#eyecatcher>div { width: 1200px; height: 400px; position: relative; overflow: hidden; } #eyecatcher ul { margin: 0; padding: 0; list-style: none; position: absolute; left: 0; transition: left 0.5s; } #eyecatcher li { display: block; position: absolute; width: 1200px; height: 400px; } #eyecatcher img { display: block; border: none; width: 1200px; height: 400px; } #eyecatcherbullets { position: absolute; bottom: 10px; left: 5px; z-index: 2; } #eyecatcherbullets>div { width: 20px; height: 20px; background-color: #ffffff; float: left; margin: 0 5px; cursor: pointer; box-shadow: 1px 1px 1px rgba(0,0,0,0.2); } #eyecatcherbullets>div:hover { background-color: #eeeeee; } #eyecatcherbullets>div.selected { background-color: #dddddd; } #eyecatchernext, #eyecatcherprev { width: 32px; height: 32px; background: url(../img/prevnext.png) no-repeat; position: absolute; top: 50%; margin-top: -16px; cursor: pointer; z-index: 2; } #eyecatchernext { background-position: 0 0; right: 10px; } #eyecatcherprev { background-position: -32px 0; left: 10px; }