Difference between revisions of "Team:NAIT Edmonton/Bios"

Line 122: Line 122:
 
         <center>
 
         <center>
  
<style type="text/css">
 
  
/*Portraits*/
 
.abbie {display:inline-block;width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/0/0f/NAIT_Abbie_BW.jpg);background-size:200px 200px ;background-position:50%;}
 
.abbie:hover {width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/f/f9/NAIT_Abbie.jpg);background-size:200px 200px; background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
.david {display:inline-block;width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/0/08/NAIT_Temp_DavidBW.jpg);background-size:200px 200px ;background-position:50%;}
 
.david:hover {width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/9/91/NAIT_temp_David.jpg);background-size:200px 200px;background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
.eduardo {display:inline-block;width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/7/70/NAIT_Eduardo_BW.jpg);background-size:200px 200px ;background-position:50%;}
 
.eduardo:hover {width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/8/80/NAIT_Eduardo.jpg);background-size:200px 200px;background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
.johannes {display:inline-block;width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/4/4c/NAIT_Johannes_BW.jpg);background-size:200px 200px ;background-position:50%;}
 
.johannes:hover {width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/4/4a/NAIT_Johannes.jpg);background-size:200px 200px;background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
.joy {display:inline-block;width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/c/c8/NAIT_Joy_BW.jpg);background-size:200px 200px ;background-position:50%;}
 
.joy:hover {width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/4/41/NAIT_Joy.jpg);background-size:200px 200px;background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
.kevin {display:inline-block;width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/d/dc/NAIT_Kevin_BW.jpg);background-size:200px 200px ;background-position:50%;}
 
.kevin:hover {width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/6/6d/NAIT_Kevin.jpg);background-size:200px 200px;background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
.marcelo {display:inline-block;width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/5/55/MarceloBW.jpg);background-size:200px 200px ;background-position:50%;}
 
.marcelo:hover {width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/7/77/NAIT_temp_Marcelo.jpg);background-size:200px 200px;background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
.mattea {display:inline-block;width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/4/4d/NAIT_MatteaBW.jpg);background-size:200px 200px ;background-position:50%;}
 
.mattea:hover {width: 200px; height: 200px; background: url(https://static.igem.org/mediawiki/2015/3/3b/NAIT_Mattea.jpg);background-size:200px 200px;background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
.NAIT {display:inline-block;width: 200px; height: 200px; background: url(http://www.brandsoftheworld.com/sites/default/files/styles/logo-thumbnail/public/0024/6865/brand.gif?itok=VWfIVGE5);background-size:185px 185px ;background-position:50%;}
 
.NAIT:hover {width: 200px; height: 200px; background: url(http://www.brandsoftheworld.com/sites/default/files/styles/logo-thumbnail/public/0024/6865/brand.gif?itok=VWfIVGE5);background-size:185px 185px;background-position:50%;border-radius:50%;width:200px;height:200px)}
 
 
/*Fade Portrait Effect*/
 
.imgwrap {width:700px;margin:0px;background-color:none;padding:0px;overflow:hidden}
 
.imgwrap div {display:inline-block;width:200px;height:200px;border-radius:50%;margin:5px;-webkit-transition:opacity 0.26s ease-out;-moz-transition:opacity 0.26s ease-out;-ms-transition:opacity 0.26s ease-out;-o-transition:opacity 0.26s ease-out;transition:opacity 0.26s ease-out;}
 
.imgwrap:hover div {opacity:0.2;}
 
.imgwrap:hover div:hover {opacity:1}
 
 
@media screen and (max-width: 700px) {
 
.imgwrap {width:auto;margin:0px;}
 
 
}
 
 
</style>
 
 
          
 
          
 
<br>
 
<br>

Revision as of 16:11, 12 August 2015

Team NAIT 2015

Meet Our Team