/** * sliderkit-core.css * > Core CSS styles * * This file is part of Slider Kit jQuery plugin. * http://www.kyrielles.net/sliderkit/ * * Copyright (c) 2010-2012 Alan Frog * Licensed under the GNU General Public License * See or * */ /* * PLUGIN BASICS * ------------------------------------------------ */ .sliderkit{display:none; position:relative; right: 0; overflow:hidden;text-align:left;} .sliderkit a, .sliderkit a:hover{text-decoration:none;} .sliderkit a:focus{outline:1px dotted #000;/*optional*/} .sliderkit img{border:0;} /*--------------------------------- * Navigation *---------------------------------*/ .sliderkit .sliderkit-nav{z-index:10;position:absolute;text-align:center;} /* Nav > Clip */ .sliderkit .sliderkit-nav-clip{position:relative;overflow:hidden;margin:0 auto;} .sliderkit .sliderkit-nav-clip ul{position:relative;left:0;top:0;list-style:none;margin:0;padding:0;} .sliderkit .sliderkit-nav-clip ul li{float:left;} .sliderkit .sliderkit-nav-clip ul li a{display:block;overflow:hidden;} /*--------------------------------- * Buttons *---------------------------------*/ .sliderkit .sliderkit-btn{z-index:10;} /*--------------------------------- * Panels *---------------------------------*/ .sliderkit .sliderkit-panel{z-index:1;position:absolute;overflow:hidden;} .sliderkit .sliderkit-panel-active{z-index:5;} .sliderkit .sliderkit-panel-old{z-index:4;} /* Panels > Overlay */ .sliderkit .sliderkit-panel .sliderkit-panel-textbox{position:absolute;z-index:1;} .sliderkit .sliderkit-panel .sliderkit-panel-text{position:absolute;z-index:3;top:0;left:0;} .sliderkit .sliderkit-panel .sliderkit-panel-overlay{position:absolute;z-index:2;top:0;left:0;} /*--------------------------------- * Counter *---------------------------------*/ .sliderkit .sliderkit-count{position:absolute;top:5px;right:5px;z-index:10;padding:5px;color:#fff;background:#000;} /*--------------------------------- * Loader *---------------------------------*/ .sliderkit .sliderkit-timer{position:absolute;top:0;left:0;z-index:10;height:3px;background:#ccc;} /* This code can be reduced and pasted in any other CSS file : Here is a compact version : ------------------------------- .sliderkit{display:none;position:relative;overflow:hidden;text-align:left;} .sliderkit a, .sliderkit a:hover{text-decoration:none;} .sliderkit a:focus{outline:1px dotted #000;} .sliderkit img{border:0;} .sliderkit .sliderkit-nav{z-index:10;position:absolute;text-align:center;} .sliderkit .sliderkit-nav-clip{position:relative;overflow:hidden;margin:0 auto;} .sliderkit .sliderkit-nav-clip ul{position:relative;left:0;top:0;list-style:none;margin:0;padding:0;} .sliderkit .sliderkit-nav-clip ul li{float:left;} .sliderkit .sliderkit-nav-clip ul li a{display:block;overflow:hidden;} .sliderkit .sliderkit-btn{z-index:10;} .sliderkit .sliderkit-panel{z-index:1;position:absolute;overflow:hidden;} .sliderkit .sliderkit-panel-active{z-index:5;} .sliderkit .sliderkit-panel-old{z-index:4;} .sliderkit .sliderkit-panel .sliderkit-panel-textbox{position:absolute;z-index:1;} .sliderkit .sliderkit-panel .sliderkit-panel-text{position:absolute;z-index:3;top:0;left:0;} .sliderkit .sliderkit-panel .sliderkit-panel-overlay{position:absolute;z-index:2;top:0;left:0;} .sliderkit .sliderkit-count{position:absolute;top:5px;right:5px;z-index:10;padding:5px;color:#fff;background:#000;} .sliderkit .sliderkit-timer{position:absolute;top:0;left:0;z-index:10;height:3px;background:#ccc;} */ /* * SLIDESHOW * ------------------------------------------------ */ /*--------------------------------- * Slideshow > Basic *---------------------------------*/ .slideshow-standard{width:300px;height:300px; border: #333 solid 5px;} /* Navbar */ .slideshow-standard .sliderkit-nav{left:0;bottom:0;width:300px;padding:10px 0 10px 110px; background:#999; } .slideshow-standard .sliderkit-nav-clip ul li{float:left;margin:0;} .slideshow-standard .sliderkit-nav-clip ul li a{display:block;width:75px;height:50px;overflow:hidden;margin:0;padding:3px;} .slideshow-standard .sliderkit-nav-clip ul li.sliderkit-selected a{padding:0;border:3px solid #fff;} /* Buttons */ .slideshow-standard .sliderkit-btn a{position:relative;float:left;display:block;width:20px;height:23px;margin:0 5px;background:transparent url("../images/slideshow-btns.png") no-repeat 0 0;} .slideshow-standard .sliderkit-btn span{display:none;} /* Play button */ .slideshow-standard .sliderkit-play-btn a{background-position:-50px 0;} .slideshow-standard .sliderkit-play-btn a:hover, .slideshow-standard .sliderkit-play-btn a:focus{background-position:-50px -23px;} .slideshow-standard .sliderkit-pause-btn a{background-position:-75px 0;} .slideshow-standard .sliderkit-pause-btn a:hover, .slideshow-standard .sliderkit-pause-btn a:focus{background-position:-75px -23px;} /* Go buttons */ .slideshow-standard .sliderkit-go-prev a{background-position:-25px 0;} .slideshow-standard .sliderkit-go-next a{background-position:0 0;} .slideshow-standard .sliderkit-go-prev a:hover, .slideshow-standard .sliderkit-go-prev a:focus{background-position:-25px -23px;} .slideshow-standard .sliderkit-go-next a:hover, .slideshow-standard .sliderkit-go-next a:focus{background-position:0 -23px;} /* Panel */ .slideshow-standard .sliderkit-panel{ top:0; left:0; width:300px; height:400px; } /*--------------------------------- * Slideshow > + Carousel *---------------------------------*/ .slideshow-carousel{width:740px;height:605px;padding:0 0 40px; margin-top: 15px;} img.ramik { position:absolute; top: 0; left: 0; z-index: 7; width: 100%; } /* Navbar */ .slideshow-carousel .sliderkit-nav{left:0;bottom: 40px;width:480px;padding:10px; padding-left: 50px;} .slideshow-carousel .sliderkit-nav-clip ul li{float:left;margin:0;} .slideshow-carousel .sliderkit-nav-clip ul li a{display:block;width:75px;height:53px;overflow:hidden;margin:0;padding:3px;} .slideshow-carousel .sliderkit-nav-clip ul li.sliderkit-selected a{padding:0;border:3px solid #e2e1e1;} /* Controls */ .slideshow-carousel .sliderkit-controls{position:absolute;bottom:0;left:0;width:420px;padding:10px 0 10px 320px;background:none;} /* Go buttons */ .slideshow-carousel .sliderkit-go-btn a, .slideshow-carousel .sliderkit-play-btn a{position:relative;float:left;display:block;width:20px;height:23px;margin:0 5px;background:transparent url("../images/slideshow-btns.png") no-repeat 0 0;} .slideshow-carousel .sliderkit-btn span, .slideshow-carousel .sliderkit-play-btn span{display:none;} .slideshow-carousel .sliderkit-play-btn a{background-position:-50px 0;} .slideshow-carousel .sliderkit-play-btn a:hover, .slideshow-carousel .sliderkit-play-btn a:focus{background-position:-50px -23px;} .slideshow-carousel .sliderkit-pause-btn a{background-position:-75px 0;} .slideshow-carousel .sliderkit-pause-btn a:hover, .slideshow-carousel .sliderkit-pause-btn a:focus{background-position:-75px -23px;} .slideshow-carousel .sliderkit-go-prev a{background-position:-25px 0;} .slideshow-carousel .sliderkit-go-next a{background-position:0 0;} .slideshow-carousel .sliderkit-go-prev a:hover, .slideshow-carousel .sliderkit-go-prev a:focus{background-position:-25px -23px;} .slideshow-carousel .sliderkit-go-next a:hover, .slideshow-carousel .sliderkit-go-next a:focus{background-position:0 -23px;} /* Panel */ .slideshow-carousel .sliderkit-panel{top:0;left:0;width:740px;height:500px;}