2012-02-08 18:11:08 -08:00
|
|
|
ul.segmented-control {
|
2012-02-09 13:12:32 -08:00
|
|
|
background-color: #595959;
|
2012-02-08 18:11:08 -08:00
|
|
|
list-style-type: none;
|
2012-02-08 18:12:56 -08:00
|
|
|
width: 120px;
|
2012-02-08 18:11:08 -08:00
|
|
|
overflow: hidden;
|
|
|
|
padding: 1px;
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
|
|
-webkit-border-radius: 4px;
|
|
|
|
-moz-border-radius: 4px;
|
|
|
|
border-radius: 4px;
|
|
|
|
|
|
|
|
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .15);
|
|
|
|
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .15);
|
|
|
|
box-shadow: 0 1px 0 rgba(255, 255, 255, .15);
|
|
|
|
clear: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.segmented-control li {
|
|
|
|
background: none;
|
2012-03-01 10:15:26 -08:00
|
|
|
background-color: #909090;
|
2012-02-08 18:11:08 -08:00
|
|
|
float: left;
|
|
|
|
margin-left: 1px;
|
|
|
|
cursor: pointer;
|
|
|
|
margin: 0;
|
|
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
|
2012-03-01 10:15:26 -08:00
|
|
|
.segmented-control li {
|
2012-02-08 18:11:08 -08:00
|
|
|
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .1)), to(rgba(255, 255, 255, 0)));
|
|
|
|
|
|
|
|
background-image: -moz-linear-gradient(0 0 -90deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, 0));
|
|
|
|
}
|
|
|
|
|
2012-03-01 10:15:26 -08:00
|
|
|
.segmented-control li {
|
2012-02-08 18:11:08 -08:00
|
|
|
-webkit-box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .1);
|
|
|
|
-moz-box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .1);
|
|
|
|
box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .1);
|
|
|
|
}
|
|
|
|
|
|
|
|
.segmented-control li:first-child {
|
|
|
|
margin-left: 0;
|
|
|
|
|
|
|
|
-webkit-border-top-left-radius: 3px;
|
|
|
|
-webkit-border-bottom-left-radius: 3px;
|
|
|
|
-moz-border-radius-topleft: 3px;
|
|
|
|
-moz-border-radius-bottomleft: 3px;
|
|
|
|
border-top-left-radius: 3px;
|
|
|
|
border-bottom-left-radius: 3px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.segmented-control li:last-child {
|
|
|
|
-webkit-border-top-right-radius: 3px;
|
|
|
|
-webkit-border-bottom-right-radius: 3px;
|
|
|
|
-moz-border-radius-topright: 3px;
|
|
|
|
-moz-border-radius-bottomright: 3px;
|
|
|
|
border-top-right-radius: 3px;
|
|
|
|
border-bottom-right-radius: 3px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.segmented-control a {
|
|
|
|
font-size: 12px;
|
|
|
|
font-weight: bold;
|
|
|
|
line-height: 24px;
|
|
|
|
text-align: center;
|
|
|
|
text-decoration: none;
|
|
|
|
display: block;
|
|
|
|
width: 70px;
|
|
|
|
height: 25px;
|
|
|
|
}
|
|
|
|
|
2012-03-01 10:15:26 -08:00
|
|
|
.segmented-control a {
|
2012-02-08 18:11:08 -08:00
|
|
|
color: #262626;
|
|
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, .15);
|
|
|
|
}
|
|
|
|
|
2012-03-01 10:15:26 -08:00
|
|
|
.segmented-control li:active a {
|
2012-02-08 18:11:08 -08:00
|
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, .1);
|
|
|
|
position: relative;
|
|
|
|
top: 1px;
|
|
|
|
}
|
|
|
|
|
2012-02-09 13:12:32 -08:00
|
|
|
.segmented-control li:active,
|
2012-02-08 18:11:08 -08:00
|
|
|
.segmented-control li.NB-active {
|
|
|
|
background-image:
|
|
|
|
-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, .1))),
|
|
|
|
url(/media/img/reader/background-control.png);
|
|
|
|
|
|
|
|
background-image:
|
|
|
|
-moz-linear-gradient(0% 0% -90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1)),
|
|
|
|
url(/media/img/reader/background-control.png);
|
|
|
|
|
2012-03-01 10:15:26 -08:00
|
|
|
background-color: #898989;
|
2012-02-08 18:11:08 -08:00
|
|
|
|
2012-02-09 13:12:32 -08:00
|
|
|
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
|
|
|
-moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
|
|
|
box-shadow: inset 0 1px 3px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
2012-02-08 18:11:08 -08:00
|
|
|
}
|
|
|
|
|
2012-02-09 13:12:32 -08:00
|
|
|
.segmented-control li:active {
|
|
|
|
background-image:
|
|
|
|
-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .2)), to(rgba(255, 255, 255, .25))),
|
|
|
|
url(/media/img/reader/background-control.png);
|
|
|
|
|
|
|
|
background-image:
|
|
|
|
-moz-linear-gradient(0% 0% -90deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, .25)),
|
|
|
|
url(/media/img/reader/background-control.png);
|
|
|
|
|
|
|
|
-webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
|
|
|
-moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
|
|
|
box-shadow: inset 0 1px 4px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2012-02-08 18:11:08 -08:00
|
|
|
.segmented-control li.NB-active a {color: #fff; text-shadow: 0 1px 0 #000;}
|
|
|
|
|
|
|
|
.segmented-control li.NB-active:active {
|
|
|
|
background-image:
|
|
|
|
-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, .05))),
|
|
|
|
url(/media/img/reader/background-control.png);
|
|
|
|
|
|
|
|
background-image:
|
|
|
|
-moz-linear-gradient(0% 0% -90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .05)),
|
|
|
|
url(/media/img/reader/background-control.png);
|
|
|
|
|
|
|
|
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .15);
|
|
|
|
-moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .15);
|
|
|
|
box-shadow: inset 0 1px 3px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .15);
|
|
|
|
}
|