/* SLIDER */ #main-inner { position: relative; height: 300px; width: 960px; } #slider { height: 300px; width: 960px; } #slider img { height: 298px; width: 960px; margin: 0; position: relative; } /* SLIDER CONTAINER */ .slider-container { border: 1px solid #222; width: 958px; height: 298px; overflow: hidden; } a, a:hover, a:visited { text-decoration: none; color: #fff; } .previous-btn, .next-btn { position: absolute; top: 130px; width: 40px; height: 40px; font-size: 60px; font-weight: 100; line-height: 30px; color: #fff; text-align: center; background: #222; border: 3px solid #fff; border-radius: 23px; opacity: 0.7; -moz-opacity: 0.7; filter:alpha(opacity=70); } .previous-btn:hover, .next-btn:hover { opacity: 0.9; -moz-opacity: 0.9; filter:alpha(opacity=90); } .previous-btn { left: 10px; } .next-btn { right: 10px; } /* PAGiNATION */ .pagination { position: absolute; top: 10px; margin: 0; padding: 0; right: 6px; } .pagination li { list-style: none; float: left; margin: 0 5px; width: 10px; height: 10px; position: relative; } .pagination li a { position: absolute; width: 10px; height: 10px; border-radius: 23px; background: #fff; text-indent: -9999px; display: block; opacity: 0.5; -moz-opacity: 0.5; filter:alpha(opacity=50); } .pagination li.current-pagination a, .pagination li a:hover { opacity: 0.9; -moz-opacity: 0.9; filter:alpha(opacity=90); }