"

From 2014.igem.org

@charset "utf-8"; /*** General ********************/

.nav a, .nav h3, .nav h5, .one li a{ text-transform: uppercase; } .nav a{ display:block; text-decoration: none; } .nav a:visited{ color:#FFFFFF;} .nav li { list-style: none; }

.nav img { padding: 5px;

box-shadow: 1px 1px 4px rgba(102,102,102,.4); -webkit-box-shadow: 1px 1px 4px rgba(102,102,102,.4); -moz-box-shadow: 1px 1px 4px rgba(102,102,102,.4);

transition: all .3s; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; -ms-transition: all .3s; } .nav img:hover { transform:scale(1.1); -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -ms-transform:scale(1.1); -o-transform:scale(1.1); }

/* Start .nav Class *************/ .label{ color:#FFF;} .nav { display: block; position:absolute; top:220px; left:110px;

height:50px; margin: 0 0 20px 0 ; padding:0 5px;

} .nav li { position: relative; padding:8px 0 15px 0; z-index:2; } .nav > li { display: block; float:left; color:#000;

border-right:1px solid #FFF; } .nav > li:hover { cursor: pointer; } .nav li > a{

font-size: 15px; text-align: center; margin:0 15px 0;

transition: background-color .7s; -webkit-transition: background-color .7s; -moz-transition: background-color .5s; -o-transition: background-color .5s; -ms-transition: background-color .5s; } .nav li:last-child{ border:none; }

/* End .nav Class ***************/

/* Start .one Class *************/ .nav .one { display: block; position: absolute; top: 100%; left: 0%;

box-shadow: 1px 1px 1px rgba(102,102,102,.2); -webkit-box-shadow: 1px 1px 1px rgba(102,102,102,.2); -moz-box-shadow: 1px 1px 1px rgba(102,102,102,.2);

transition: background-color .3s ease-out; -webkit-transition: background-color .3s ease-out; -moz-transition: background-color .3s ease-out; -o-transition: background-color .3s ease-out; -ms-transition: background-color .3s ease-out; } .one > li { float: none; width: 160px;

} .one > li a{

margin:5px; height:20px;

font-size: 11px; letter-spacing: 1px; } .one li i.icon-chevron-right { float:right; margin:3px 5px 0 0;

font-size: 10px; } /* Animation Effects */ .nav li:hover .one > li{ -webkit-animation: fadeIn .6s 1; animation: fadeIn .6s 1; } /* End .one Class *******************/

/**** Start Gallery ****************/

1. gallery{

padding: 0; margin:0; background:rgba(255,255,255,0.7); }

1. gallery li{

width:200px;

}

1. gallery li .image{

width:120px; height:30px; padding:5px; margin:auto; border-bottom: 1px solid rgba(51,51,51,.2);

}

1. gallery li img{

float:left; margin:5px 5px 10px 0px; width:100px; height:150px; }

1. gallery .image a{

text-align:center; line-height:40px;

}

1. gallery .image a:hover{

color:#69F;

}

1. gallery .image a:visited{

color:#CCCCCC;

}

1. gallery a.more{

display:block; width:35px; height:16px; padding:0px 4px; margin:8px 0 5px 10px; cursor: pointer;

text-transform:capitalize; font-size:10px;

border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px;

-webkit-box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset; -moz-box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset; box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset; } /**** End Gallery *****************/