Team:Penn/css/wowcss

From 2012.igem.org

/*

*	generated by WOW Slider 2.5
*	template Quiet
*/

@import url("http://fonts.googleapis.com/css?family=Oswald");

  1. wowslider-container1 {

zoom: 1; position: relative; max-width:700px; margin:0 auto; z-index:100; border:2px solid black; text-align:left; /* reset align=center */ }

  • html #wowslider-container1{ width:700px }
  1. wowslider-container1 ul{

position:relative; width: 10000%; height:auto; left:0; list-style:none; margin:0; padding:0; border-spacing:0; overflow: visible; /*table-layout:fixed;*/ }

  1. wowslider-container1 .ws_images ul li{

width:1%; line-height:0; /*opera*/ float:left; font-size:0; padding:0 0 0 0 !important; margin:0 0 0 0 !important; }

  1. wowslider-container1 .ws_images{

position: relative; left:0; top:0; width:100%; height:100%; overflow:hidden; }

  1. wowslider-container1 .ws_images a{

width:100%; display:block; color:transparent; }

  1. wowslider-container1 img{

max-width: none !important; }

  1. wowslider-container1 .ws_images img{

width:100%; border:none 0; max-width: none; }

  1. wowslider-container1 a{

text-decoration: none; outline: none; border: none; }

  1. wowslider-container1 .ws_bullets {

font-size: 0px; float: left; position:absolute; z-index:70; }

  1. wowslider-container1 .ws_bullets div{

position:relative; float:left; }

  1. wowslider-container1 a.wsl{

display:none; }

  1. wowslider-container1 .ws_bullets {

padding: 10px; }

  1. wowslider-container1 .ws_bullets a {

width:15px; height:15px; background: url("Bullet.png") left top; float: left; text-indent: -4000px; position:relative; margin-left:3px; color:transparent; }

  1. wowslider-container1 .ws_bullets a:hover{

background-position: 0 50%; }

  1. wowslider-container1 .ws_bullets a.ws_selbull{

background-position: 0 100%; }

  1. wowslider-container1 a.ws_next, #wowslider-container1 a.ws_prev {

position:absolute; display:none; top:50%; margin-top:-50px; z-index:60; height: 100px; width: 60px; background-image: url("Arrows.png"); }

  1. wowslider-container1 a.ws_next{

background-position: 100% 0; right:0; }

  1. wowslider-container1 a.ws_prev {

left:0; background-position: 0 0; }

  • html #wowslider-container1 a.ws_next,* html #wowslider-container1 a.ws_prev{display:block}
  1. wowslider-container1:hover a.ws_next, #wowslider-container1:hover a.ws_prev {display:block}

/* bottom center */

  1. wowslider-container1 .ws_bullets {
   top: 5px;
   right: 10px;

}

  1. wowslider-container1 .ws_bullets .ws_bulframe {

top: 20px; }

  1. wowslider-container1 .ws_bullets .ws_bulframe {

top: 20px; }

  1. wowslider-container1 .ws-title{

position: absolute; bottom: 10%; left: 7%; z-index: 50; padding:12px; color: #000000; background:#fff;

   font-family:Oswald,Impact,Charcoal,sans-serif;

font-size: 30px; text-shadow: 1px 1px 1px #BBBBBB; line-height: 30px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; opacity:0.5; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); }

  1. wowslider-container1 .ws-title div{

font-size: 25px; text-shadow: 1px 1px 1px #000000; }#wowslider-container1 ul{ animation: wsBasic 12s infinite; -moz-animation: wsBasic 12s infinite; -webkit-animation: wsBasic 12s infinite; } @keyframes wsBasic{0%{left:-0%} 16.67%{left:-0%} 33.33%{left:-100%} 50%{left:-100%} 66.67%{left:-200%} 83.33%{left:-200%} } @-moz-keyframes wsBasic{0%{left:-0%} 16.67%{left:-0%} 33.33%{left:-100%} 50%{left:-100%} 66.67%{left:-200%} 83.33%{left:-200%} } @-webkit-keyframes wsBasic{0%{left:-0%} 16.67%{left:-0%} 33.33%{left:-100%} 50%{left:-100%} 66.67%{left:-200%} 83.33%{left:-200%} }

  1. wowslider-container1 .ws_shadow{

/* background: url(./shadow.png) left 100%; */ background-repeat: no-repeat; background-size:100%; width:100%; height:20%; position: absolute; left:0; bottom:-20%; z-index:-1; }

  • html #wowslider-container1 .ws_shadow{/*ie6*/

background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='engine1/shadow.png', sizingMethod='scale'); }

  • +html #wowslider-container1 .ws_shadow{/*ie7*/

background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='engine1/shadow.png', sizingMethod='scale'); }

  1. wowslider-container1 .ws_bullets a img{

text-indent:0; display:block; top:15px; left:-63px; visibility:hidden; position:absolute;

   -moz-box-shadow: 0 0 5px #999999;
   box-shadow: 0 0 5px #999999;
   border: 5px solid #FFFFFF;

max-width:none; }

  1. wowslider-container1 .ws_bullets a:hover img{

visibility:visible; }

  1. wowslider-container1 .ws_bulframe div div{

height:90px; overflow:visible; position:relative; }

  1. wowslider-container1 .ws_bulframe div {

left:0; overflow:hidden; position:relative; width:126px; background-color:#FFFFFF; }

  1. wowslider-container1 .ws_bullets .ws_bulframe{

display:none; overflow:visible; position:absolute; cursor:pointer;

   -moz-box-shadow: 0 0 5px #999999;
   box-shadow: 0 0 5px #999999;
   border: 5px solid #FFFFFF;

}

  1. wowslider-container1 .ws_bulframe span{

display:block; position:absolute; top:-11px; margin-left:-5px; left:63px; background:url("Triangle.png"); width:15px; height:6px; }