.cycle_container { position: relative; overflow: hidden; height: 389px; } .cycle { position: absolute; top: 162px; left: 50%; width: 1920px; height: 551px; margin:0; margin-left: -960px; overflow: hidden; padding:0; } .vertical_strokes { z-index: 50; position: absolute; top: 0px; left: 0; width: 100%; height: 551px; } .cycle li .caption_container { z-index: 100; position: absolute; bottom: 100px; top: 100px; left: 380px; color: #fff; font-family: 'DINPro-Regular', Arial, Helvetica, sans-serif; } .dots_nav { z-index: 200; position: absolute; bottom: 25px; left: 0; width: 100%; text-align: center; } .prev, .next{ z-index:200000; position:absolute; top:50%; margin-top:30px; background:url(/image/main_cycle_arrows.png) no-repeat; width:32px; height:200px; display:block; cursor:pointer; filter:alpha(opacity=50); -moz-opacity:0.5; khtmlopacity:0.5; opacity:0.5; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;} .prev { left: 1%; background-position: -32px 0; } .next { right: 1%; background-position: 0 0; } .prev:hover, .next:hover{filter:alpha(opacity=100); -moz-opacity:1.0; khtmlopacity:1.0; opacity:1.0;} .bg{ text-align:center; } .cycle_container,.cycle,.bg{ height:551px; } .dots_nav { z-index: 2000; position: absolute; bottom: 25px; left: 0; width: 100%; text-align: center; } .dots_nav a { display: inline-block; position: relative; text-indent: -9999px; width: 11px; height: 11px; background: url(/image/dot_nav.png) 0 0 no-repeat; margin: 0 5px; filter: alpha(opacity=30); -moz-opacity: 0.3; khtmlopacity: 0.3; opacity: 0.3; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; } a.activeSlide { filter: alpha(opacity=100); -moz-opacity: 1.0; khtmlopacity: 1.0; opacity: 1.0; } .cycle li .caption_container h2 { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; outline: none; font-weight: normal; font-size: 64px; font-weight:bold; line-height: 60px; text-transform: uppercase; background: url(/image/main_cycle_title_stroke.gif) 0 bottom no-repeat; padding-bottom: 18px; } .cycle li .caption_container h3 { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; outline: none; font-weight: normal; font: 20px/40px 'DINPro-Medium', Arial, Helvetica, sans-serif; color: #FFFFFF; margin-top: 40px; text-transform: uppercase; } .caption_container.bg p,.cycle li .caption_container h3,.cycle li .caption_container h2 { background:#010101;opacity:0.5;filter:alpha(opacity=50); background-color: rgba(0, 0, 0, 0.5); text-align:left; }