Team:Sheffield/Template:team2style.css

From 2014.igem.org

body{ text-align:center; font-family: 'Oswald', sans-serif; }


/*-- Portfolio Starts Here --*/ .portfolio{ text-align:center; } .portfolio-top { text-align: center; } .portfolio-top h3 { font-weight: 700; font-family: 'Droid Sans', sans-serif; font-size:45px; padding: 40px 0px; }

/* Strip /*-----------------------------------------------------------------------------------*/ .b-link-stripe{ position:relative; display:inline-block; vertical-align:top; font-family: 'Open Sans', sans-serif; font-weight: 300; overflow:hidden; } .b-link-stripe .b-wrapper{ position:absolute; width:100%; height:100%; top:0; left:0; text-align:center; color:#ffffff; overflow:hidden; } .b-link-stripe .b-line{ position:absolute; top:0; bottom:0; width:20%; background:rgba(15, 207, 140, 0.9); transition:all 0.5s linear; -moz-transition:all 0.5s linear; -ms-transition:all 0.5s linear; -o-transition:all 0.5s linear; -webkit-transition:all 0.5s linear; opacity:0; visibility:hidden; /* lt-ie9 */ } /*-----------------------------------------------------------------------------------*/ /* Animation effects /*-----------------------------------------------------------------------------------*/ .b-animate-go{ text-decoration:none; } .b-animate{ transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; -webkit-transition: all 0.5s; visibility: hidden; font-size:1.1em; font-weight:700; } .b-animate img{ margin-top:16%; display: -webkit-inline-box; } /* lt-ie9 */ .b-animate-go:hover .b-animate{ visibility:visible; } .b-from-left{ position:relative; left:-100%; } .b-animate-go:hover .b-from-left{ left:0; } span.m_4{ font-size:14px; font-weight:400; } p.m_5 { margin: 2% auto 5%; width: 70%; color: #283A47; font-size: 1.1em; font-weight: 600; line-height: 1.5em; text-align: center; } ul#filters { padding: 0px; }





/*--team--*/ .team{ background:#fff; padding:0 0 9% 0; } .col_1_of_4:first-child { margin-left: 0; } .span_1_of_4 { width: 22.8%; } .col_1_of_4 { display: block; float: left; margin: 1% 0 1% 2.6%; background: #FFF; } /* lt-ie9 */ .b-link-stripe:hover .b-line{ visibility:visible; } .b-link-stripe .b-line1{ left:0; } .b-link-stripe .b-line2{ left:20%; transition-delay:0.1s !important; -moz-transition-delay:0.1s !important; -ms-transition-delay:0.1s !important; -o-transition-delay:0.1s !important; -webkit-transition-delay:0.1s !important; } .b-link-stripe .b-line3{ left:40%; transition-delay:0.2s !important; -moz-transition-delay:0.2s !important; -ms-transition-delay:0.2s !important; -o-transition-delay:0.2s !important; -webkit-transition-delay:0.2s !important; } .b-link-stripe .b-line4{ left:60%; transition-delay:0.3s !important; -moz-transition-delay:0.3s !important; -ms-transition-delay:0.3s !important; -o-transition-delay:0.3s !important; -webkit-transition-delay:0.3s !important; } .b-link-stripe .b-line5{ left:80%; transition-delay:0.4s !important; -moz-transition-delay:0.4s !important; -ms-transition-delay:0.4s !important; -o-transition-delay:0.4s !important; -webkit-transition-delay:0.4s !important; } .b-link-stripe:hover .b-line{ opacity:1; } }

  1. filters {

margin: 3% 0; padding: 0; list-style: none; text-align: center; } #filters li { display: -webkit-inline-box; } #filters li span { display: block; padding: 5px 24px; text-decoration: none; color: rgba(31, 49, 63, 0.7); cursor: pointer; font-size: 28px; font-weight: 400; font-family: 'Droid Sans', sans-serif; } #filters li span.active { background:#0FCF8C; color: #FFF; border-radius: 22px; -webkit-border-radius: 22px; -moz-border-radius: 22px; -o-border-radius: 22px; }

	#portfoliolist .portfolio {

-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; width: 32%; display:none; float:left; overflow:hidden; } div#portfoliolist { padding: 40px 0px; } .portfolio-wrapper { overflow:hidden; position: relative !important; cursor:pointer; } .portfolio img { max-width:100%; /*--position: relative;--*/ transition: all 300ms!important; -webkit-transition: all 300ms!important; -moz-transition: all 300ms!important; } .portfolio .label { position: absolute; width: 100%; height:40px; bottom:-40px; } .portfolio .label-bg { background: #22B4B8; width: 100%; height:100%; position: absolute; top:0; left:0; } .portfolio .label-text { color:#fff; position: relative; z-index:500; padding:5px 8px; }

.portfolio .text-category { display:block; font-size:9px; font-size: 12px; text-transform:uppercase; } /* Self Clearing Goodness */ .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; } .clearfix:before, .clearfix:after, .row:before, .row:after {

 content: '\0020';
 display: block;
 overflow: hidden;
 visibility: hidden;
 width: 0;
 height: 0; }

.row:after, .clearfix:after {

 clear: both; }

.row, .clearfix {

 zoom: 1; }

.clear {

 clear: both;
 display: block;
 overflow: hidden;
 visibility: hidden;
 width: 0;
 height: 0;

} /*-- Portfolio Ends Here --*/






/*-- Our Team Starts Here --*/ .ourteam {

padding:40px 0px; }


h2{ color:#000000; }

.team-row{ text-align: center; } .team-row h3{ color:#000; font-weight: 700; font-family: 'Droid Sans', sans-serif; font-size: 45px; padding:0px 0px 20px 0px; }

.team-row-column img{ background:#ffffff; border-radius:130px; -webkit-border-radius: 130px; -moz-border-radius:130px; -o-border-radius: 130pxx; padding:5px 0px; } .team-row-column h4 a{ color:#fff; font-weight: 700; font-family: 'Droid Sans', sans-serif; font-size: 26px; text-decoration:none; } .team-row-column h4 a:hover{ color:#2ecc71; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .team-row-column{ padding:0px 137px; text-align: center; } .team-row-column h4 {

       color: #000;

margin: 40px 0px 20px 0px; } .team-row-column p{ color:#000; font-family: 'Lato', serif; font-weight: 400; font-size:18px; line-height:30px; padding:0px 0px 20px 0px; } ul.social li{ display:inline-block; margin:0px 20px 0px 0px;

} ul.social li i{ background:url(../images/img-sprite.png); width:64px; height:64px; display:block; cursor:pointer; } ul.social li i:hover{ -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } ul.social li i.fa{ background-position:-7px 0px; } ul.social li i.fa:hover{ background-position:-7px -65px; } ul.social li i.tw{ background-position:-68px 0px; } ul.social li i.tw:hover{ background-position:-68px -65px; } ul.social li i.ist{ background-position:-132px 0px; } ul.social li i.ist:hover{ background-position:-132px -65px; }

/*-- Our Team Ends Here --*/