GIF89a;
| Direktori : /home/serb/www/5/ |
| Current File : /home/serb/www/5/thumbnail-slider.css |
/* http://www.menucool.com/jquery-slider */
#thumbnail-slider {
margin:0 auto; /*center-aligned*/
width:100%;/*width:400px;*/
max-width:700px;
padding:4px 34px;/*Gives room for arrow buttons*/
box-sizing:border-box;
position:relative;
-webkit-user-select: none;
user-select:none;
}
#thumbnail-slider div.inner {
border-radius:3px;
/*border:4px solid transparent;
box-shadow:0 0 4px rgba(0,0,0,0.4);*/
/*the followings should not be changed */
position:relative;
overflow:hidden;
padding:0;
margin:0;
}
#thumbnail-slider div.inner ul {
/*the followings should not be changed */
white-space:nowrap;
position:relative;
left:0; top:0;
list-style:none;
font-size:0;
padding:0;
margin:0;
float:left!important;
width:auto!important;
height:auto!important;
}
#thumbnail-slider ul li {
opacity:1;
display:inline-block;
*display:inline!important; /*IE7 hack*/
border:2px solid transparent;
margin:0 3px; /* Spacing between thumbs*/
transition:border-color 0.5s;
box-sizing:content-box;
text-align:center;
vertical-align:middle;
padding:0;
position:relative;
list-style:none;
backface-visibility:hidden;
}
#thumbnail-slider ul li.active {
border-color:white;
}
#thumbnail-slider .thumb {
width:100%;
height: 100%;
background-size:contain;
background-repeat:no-repeat;
background-position:center center;
display:block;
position:absolute;
font-size:0;
}
#thumbnail-slider .thumb h3 {
font-size:0;
}
/* --------- navigation controls ------- */
/* The nav id should be: slider id + ("-prev", "-next", and "-pause-play") */
#thumbnail-slider-pause-play {display:none;} /*.pause*/
#thumbnail-slider-prev, #thumbnail-slider-next
{
opacity:1;
position: absolute;
/*background-color:#0346a3;*/
*background-color:#ccc;/*IE7 hack*/
backface-visibility:hidden;
width:32px;
height:60px;
line-height:60px;
top: 50%;
margin:0;
margin-top:-30px;
color:white;
z-index:10;
cursor:pointer;
}
#thumbnail-slider-prev {
left:1px; right:auto;
}
#thumbnail-slider-next {
left:auto; right:1px;
}
#thumbnail-slider-next.disabled, #thumbnail-slider-prev.disabled {
opacity:0.3;
cursor:default;
}
/* arrows */
#thumbnail-slider-prev::before, #thumbnail-slider-next::before {
position: absolute;
top: 24px;
content: "";
display: block;
width: 12px;
height: 12px;
border-left: 6px solid #DDD;
border-top: 6px solid #DDD;
}
#thumbnail-slider-prev::before {
left:7px;
-ms-transform:rotate(-45deg);/*IE9*/
-webkit-transform:rotate(-45deg);
transform: rotate(-45deg);
}
#thumbnail-slider-next::before {
right:7px;
-ms-transform:rotate(135deg);/*IE9*/
-webkit-transform:rotate(135deg);
transform: rotate(135deg);
}
@media only screen and (max-width:736px){
#thumbnail-slider {
padding:4px 24px;
}
}