/** * @file iSlider.css */ /** * =========================== * iSlider * =========================== */ .islider-outer { display: block; position: relative; list-style: none; margin: 0; padding: 0; height: 100%; width: 100%; overflow: hidden; } .islider-outer > li { position: absolute; top: 0; left: 0; margin: 0; padding: 0; width: 100%; height: 100%; list-style: none; overflow: hidden; display: -moz-box; display: -webkit-box; display: box; -moz-box-pack: center; -webkit-box-pack: center; box-pack: center; -moz-box-align: center; -webkit-box-align: center; box-align: center; } .islider-img > img { max-width: 100%; max-height: 100%; } .islider-sliding { z-index: 0; } .islider-sliding-focus { z-index: 1; } /** * =========================== * iSlider.plugin.button * =========================== */ .islider-btn-outer { position: absolute; width: 3em; height: 3em; cursor: pointer; top: 0; bottom: 0; margin: auto 0; display: block; background-color: #777777; } .islider-btn-outer.left { left: 5%; } .islider-btn-outer.right { right: 5%; } .islider-btn-inner { position: absolute; width: 50%; height: 50%; border-top: 2px solid #ffffff; border-left: 2px solid #ffffff; margin: auto; top: 0; bottom: 0; left: 0; right: 0; } .islider-btn-outer.left > .islider-btn-inner { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .islider-btn-outer.right > .islider-btn-inner { -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); } /** * =========================== * iSlider.plugin.dot * =========================== */ .islider-dot { position: relative; display: inline-block; width: 0.5em; height: 0.5em; border-radius: 50%; border: 1px solid #ffffff; list-style: none; margin: 5px; } .islider-dot.active { background-color: #ffffff; } body { margin: 0; padding: 0; background: #333; overflow: hidden; } /*ul wrapper*/ #iSlider-wrapper { height: 160px; width: 100%; overflow: hidden; position: absolute; } #iSlider-wrapper ul { list-style: none; margin: 0; padding: 0; height: 160px; overflow: hidden; } #iSlider-wrapper li img { max-width: 100%; max-height: 160px; }