SSOwat/portal/assets/css/ynhpanel.css

181 lines
6.7 KiB
CSS
Raw Normal View History

2014-02-17 13:07:28 +01:00
/* ******************************************************************
Button
******************************************************************* */
#ynhportal {
display: block;
position: fixed;
z-index: 1000;
bottom: 2%;
right: 2%;
width: 60px;
height: 52px;
padding: 10px;
border-radius: 5px;
background: #000;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA0CAYAAADWr1sfAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAA3XAAAN1wFCKJt4AAAAB3RJTUUH3gIEEAEtUaDdjAAACo9JREFUaN7lGmuQFMW5b2/37uoeeikkXKLGi5oKsTBKCiKkkoiPlFVyFmpIQFN5+UCMVgnmSCRHCJaeFYkxlvigTAwXHhHEVKGUCcQXFlYQbo8DbjmWO+65u7e7t6+Z6Znunp6emfzZI03Tsw8eQbR/bc339dff19/76wXgE7zGxsaazhpxXddnIoS2m6b5VjqdXniuhU0kEpfatu1ijF84KweYptnl/m9ZCKG551JgjPEm13Vdx3HcXC53rQynp6enDmP8CEJoq2EYW3K5XEvJB1iWhTiBXcZYYu/evY3nSmDbtnlePshkMvU8PJ1O38gYi/A8O47jEkJeisVi9UUPcBzHFZemacvOlcCGYWCeF4zx3Zy5f8m2beJ6LIzxei+6Pk7Dx0RgIBCYcwYCz2WmaT47Ojp6Cf9d07T7DMM4RAjZTCk9SSPV1dU1wqfjOI2Njb/x+XzVXmdWV1ffFY/Hv17MZ/4s3hRj7CMRj1K6ByH0fGdnZyMAAASDwQsRQuO6rq/auXOnX8RXVbXNdV3Xtu3xTCZzOQAARKPRG/hzCCE7V69efXxvZ2fnV0Re0un0fAAAgBDeypu710II/a2gwJlM5j5xk2VZwwLzx3EopQld12dpmnbHxDcI4S5FUfxCMHxrAm4Yxr8BACCVSt0knkUIeWZiTzab/b4IHx8fvy1P77BbwmKMvVLQpCsrK8MnAX2+Gu5Cbqqrq3uZM/cpVVVVj1NKv3bc5urrr/f5fL/jaVRUVPg5U5vd29sbSKVS+x3HITxeVVXV0tHR0WvyVnSSpdTW1l4QDocvDgQCV0kCXIhSGuG/ZbPZtwtquLu7+0JZ4MIYP2UYRqtt21iE2bbtmqa5iv9mmuYJB0MIj/JwVVUX5IU6INIzTfMfAACgKEqLCDMMY46u6/PF75TSyJ49e2pGR0dnCRazvaCGp0+frlJKu0WEmpqa5bW1tX/gtc0Fup2u6zaLMUPYP0nQhgkAAIyxjEjP7/ffPjo6+gVKaUCERaPRtN/v/474nTH2yuzZswnGOMl/d133+oIC5zc/XUaetBRFaaOUXiaAghM/UqnU1X6//wSB4/H47gnlS1zIN2nSpIWJROKgCHvuuecOu657ncAvC4VCfwIAgKamppmCiwQikUjxfIwQ+lUpQYEQ8lD+JncJgW4bV662ii7AWccmGV3btpPhcPi7QgBy824QF846wgXHkIRWc0naI4Q85SWo4zgWhPABrmD5UPApyKWwbgFGuDP+45a4LMtK51OnInw/DAAAuVyuRbZvZGSkueSCIZvN3iUjkslkFvF4iqIMiDj579MlqeIwp+FsqQIzxpzFixf7EEL7JJexXxZQKaX6/fffX1FWlSQ73DCMuwVr+FgWpQ3DuE/iBn8FAIC1a9de4Ja5UqnUpYSQF0vFN03z3aJBi1/vv//+Fz18vF+owUNCOXoRQqiturr6Z5K9+wEA4JZbbrm83BK1rq5urleq8ej+Xi1Xu82ym+vp6Zki9NGPlXrr6XT6m/mKbV65GsYYP/rEE09UMsZ2FcOllHaWXfT39/fPlPiLK6mV55YYeDKbNm2qyrvBEklEhYX2G4YxDwAABgYG6hFC2wqY8sfZbPbasgWGEM4pReAtW7YELMuKl+BT/+Ialc0SgVZls9lZjDEprbGxsQVCt/WgaZq9juO4CCFmmiZCCD1zym1df3//LAnTGY/x0A+KCawoyh1chN4lgc8BAIBYLDbVtu2ThIYQ3nhWG/C+vr4Lbdumgm/sKZC7W73aNsMw3hEuaCFft1NKY2+++aafq8ausCyrm8/9/f39k8761IEQskUIHG8Uws/lcvNt285x+RMjhP64e/fuesmQbgZCaLNt21jTtOdFeDAYrMIYL8EYb1UU5Uf/rzHpCX6cy+U6iu0ZGRlpgBA+iDF+JB6PN4HzbRFCVnGm1/FJ46+vr6+5p6fnojNKVFXVFkrpjlQqteCTJGw2m72CMZZmjCFVVe8Bn/al6/oaYY718HknRDqdvpIQstEwDINSGlQU5cHBwcFGj/IxKBQvVjwe/9b5oq0GjPFrjuNYkiosEovFZknK32FJcbRk5cqV/kgk0jw0NDQtk8l8b2Bg4POnzeDg4OAkhNAHhJAhwzCWHDlyZMrp0EMIvV6kRcxFo9HjUX/ZsmWVlmWZksvJ2bZtiZo3DGPJ6b79fCBUYUdEnMWLF1dEIpFplNL5qVTqNi9aHR0dtbKeVjJr/unEnqVLl/pkQ8cCgwvXMIxFUgaGhoYmI4TesCzrGCFkYywW+yoPD4fDF8sOi0ajM7mh282mae4WLuWgqqq/hBCeMGpNpVLNBbqkDRjjJaZpvphIJG6CEN5LKV0j9uGlLErpP73S0NPC7UBFUa7j3n0WehBcmd//w0K37ziOhTFePTg4OBkAAPbt23eRzHdd13V7e3uv1DStxaupKLPF3Oxlrr+XNA5HOYFXyQjquv6LcDhcw5eXRfxyKBaLNee7n3aPS3zXsqyHT0dQxhhCCD3d1dUln2JqmtYh23j06NEv50e0UoGTyeQsCOHPy2GGELKWSzNbPBiG5Qpp27ZFCNkOIVwUCoUai/XCL3uY4px8Clkq6YjcfLTdWaZfDXADQT9C6NVT1aRt21jX9fUY4we6urpK764sy3pPRnB4ePjqvElvk/hHX340m5NoSCGErGaMDcmiZ2trq0/IyYvKicDc2nWqKadbktDVtra2yrzprZeYZtvIyMgUGRcTj2Sqqt7sEZgulzzLviCJIwZCaIOmaR0Qwo1nTGDLsv4uMb23OZN/UsJM6+Dg4HUSzQ9zxf43ZAKPj4+3SPrhesuy+kTceDw+3WuMzBgbKCabz0PDn5OUcUTX9TkQwvmBQOB6SV3bXF9ff9IzZ0VFRYh7LpV2NFVVVbUTzzyU0tcBAGDGjBk6Y2ydiNvQ0DAPAADa29urJKT8ZWt3x44dUyzLOlKu80AIO6LRaKM45rFtW4MQ3kMIedZ1XUviw3hkZGRKvvfe6ziOFYvFbmhvb6+0LOtZCX5H/r26WWJl6e3btweKCqkoSjPG+EnTNI+eaoQ0DKMjz/T+cvYhhF7iXgOH+Yc3j0wxcU6zB7z4exKl9L3TrWIopXDDhg0NyWTyKkqpUmoa6e/vn1xomimJCWvyzzUBxpghGfZPKyUqf+SegXXgwIGp+Wh8ZylpRdf1vwgd029LcJ0fc/jrJEFtZlGBNU1bUUaZFoEQLjRN8yRt5HK5hziaLZZlwQIvEfFkMjmZ5+PgwYMNXvHDtm0MIXyMxz927Fg936AQQj4sKVC1t7dXqqq6oFCwUlX1cVVVbxsbG6vJj1kvYYxlBH/cKPwzaBohJCwybprm1kQiMc1j4tHEGBsT000mk/m2Rx9dr2naMxDCe0OhUE1ZETqXy031ejZZt25dlYS5FsYY5gPNihUr6kS84eHhqQihO9Pp9K19fX0NxfiIRCJXYYw7XNfdRQhZEwwG687aqCUYDDYxxsYlvvMTGX44HG6ilL4j+wfPebMwxr+WCPyoF/6hQ4fqx8bGbk8mk03npcDLly/3UUrHhYj62qd65pvJZK4xTXMbp+HHwWdhZbPZualU6tatW7f6Pw3y/Bdct+Z4+calLAAAAABJRU5ErkJggg==);
background-position: center center;
background-repeat: no-repeat;
opacity: 0.5;
zoom: 1;filter: alpha(opacity=50);
}
#ynhportal.visible,
2014-02-17 13:07:28 +01:00
#ynhportal:hover {
opacity: 1;
filter: alpha(opacity=100);
}
/* ******************************************************************
Overlay
******************************************************************* */
/* Background */
#ynhoverlay {
display: block;
position: absolute;
2014-02-19 01:48:31 +01:00
top:0;
bottom:0;
left: 100%; /* this is the trick ! */
right: 0;
width: 0;
2014-02-19 01:48:31 +01:00
height: 100%;
2014-02-17 13:07:28 +01:00
z-index: 999;
text-align: left;
overflow-y: auto;
opacity: 0;
zoom: 1;filter: alpha(opacity=0);
color:#fff;
background-color: rgba(0,0,0, 0.7);
font-family: Arial, sans-serif;
font-size: 16px; /* 100% */
font-style: normal;
font-weight: normal;
font-variant: normal;
/*
-webkit-transition: opacity .15s ease-in-out;
-moz-transition: opacity .15s ease-in-out;
-ms-transition: opacity .15s ease-in-out;
-o-transition: opacity .15s ease-in-out;
transition: opacity .15s ease-in-out;
*/
2014-02-17 13:07:28 +01:00
}
#ynhoverlay.visible {
width:100%;
2014-02-19 01:48:31 +01:00
left:0;
2014-02-17 13:07:28 +01:00
opacity: 1;
filter: alpha(opacity=100);
}
/* reset inherited style */
#ynhoverlay * {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
text-align: left;
line-height: 1;
color: #fff;
font-family: Arial, sans-serif;
font-size: 16px; /* 100% */
font-style: normal;
font-weight: normal;
font-variant: normal;
text-shadow: none;
opacity: 1;
filter: alpha(opacity=100);
}
/* Close button */
#ynhclose {
display: block;
float: right;
margin: 2%;
cursor: pointer;
z-index: 1002;
font-weight: bold;
font-size: 1.5em;
}
#ynhclose:hover {color:pink;}
/* Header */
#ynhoverlay .header {
display: block;
width:50%;
margin:1em auto;
}
#ynhoverlay h1 {
display: block;
margin:0 1em 0 0;
line-height: 1.4;
font-size: 3em;
}
2014-02-17 14:40:34 +01:00
#ynhoverlay .header {
color: #ccc;
}
#ynhoverlay .header a {
2014-02-17 13:07:28 +01:00
display: inline-block;
text-decoration: none;
color: #ccc;
}
2014-02-17 14:40:34 +01:00
#ynhoverlay .header a:hover {
2014-02-17 13:07:28 +01:00
text-decoration: underline;
color: #fff;
}
/* Application list */
#ynhoverlay ul {
2014-02-19 01:48:31 +01:00
margin: 3em auto;
2014-02-17 13:07:28 +01:00
display: block;
width: 50%;
list-style: none;
}
#ynhoverlay li {display: inline;}
#ynhoverlay ul a {
display: inline-block;
vertical-align: top;
width: 110px;
margin: 3% 6% 3% 0;
text-align: center;
text-decoration: none;
border-radius: 5px;
}
#ynhoverlay ul a:before {
content: attr(data-first-letter);
display: block;
height: 110px;
line-height: 110px;
margin-bottom:5%;
color: #000;
background: #fff;
text-align: center;
text-decoration: none;
font-size: 3em;
border-radius: 5px;
}
#ynhoverlay ul a:hover {
color:pink;
}
#ynhoverlay ul a:hover:before {
background-color: pink;
}