(10 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
{{Team:Michigan/navbar-Irina}} | {{Team:Michigan/navbar-Irina}} | ||
− | + | {{Team:Michigan/Navigation}} | |
− | + | ||
<html> | <html> | ||
− | + | <head> | |
− | <head> | + | |
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Poiret+One"> | <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Poiret+One"> | ||
Line 10: | Line 8: | ||
<link href="https://static.igem.org/mediawiki/2016/2/2f/Bootstrap-msbt-css.txt" rel="stylesheet" type="text/css"/> | <link href="https://static.igem.org/mediawiki/2016/2/2f/Bootstrap-msbt-css.txt" rel="stylesheet" type="text/css"/> | ||
− | <style> | + | <style> |
#sideMenu, #top_title {display:none;} | #sideMenu, #top_title {display:none;} | ||
Line 44: | Line 42: | ||
.hovereffect .overlay { | .hovereffect .overlay { | ||
− | + | position: absolute; | |
− | + | overflow: hidden; | |
− | + | width: 80%; | |
− | + | height: 80%; | |
− | + | left: 10%; | |
− | + | top: 10%; | |
− | + | border-bottom: 1px solid #FFF; | |
− | + | border-top: 1px solid #FFF; | |
− | + | -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; | |
− | + | transition: opacity 0.35s, transform 0.35s; | |
− | + | -webkit-transform: scale(0,1); | |
− | + | -ms-transform: scale(0,1); | |
− | + | transform: scale(0,1); | |
− | + | } | |
− | + | /* DON'T MISS THIS, I ADDED IT! - Austin */ | |
− | + | .hovereffect:hover { | |
− | + | -webkit-transition: all 0.35s; | |
− | + | transition: all 0.35s; | |
− | + | background: rgba(0,0,0,0.35); | |
+ | } | ||
− | + | .hovereffect:hover .overlay { | |
− | + | opacity: 1; | |
− | + | filter: alpha(opacity=100); | |
− | + | -webkit-transform: scale(1); | |
− | + | -ms-transform: scale(1); | |
− | + | transform: scale(1); | |
− | + | overflow: auto; | |
− | + | } | |
− | + | .hovereffect img { | |
− | + | display: block; | |
− | + | position: relative; | |
− | + | -webkit-transition: all 0.35s; | |
− | + | transition: all 0.35s; | |
− | + | } | |
− | + | .hovereffect:hover img { | |
− | + | filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feComponentTransfer color-interpolation-filters="sRGB"><feFuncR type="linear" slope="0.6" /><feFuncG type="linear" slope="0.6" /><feFuncB type="linear" slope="0.6" /></feComponentTransfer></filter></svg>#filter'); | |
− | + | filter: brightness(0.6); | |
− | + | -webkit-filter: brightness(0.6); | |
− | + | } | |
− | + | .hovereffect h2 { | |
− | + | text-align: center; | |
− | + | position: relative; | |
− | + | font-size: 17px; | |
− | + | background-color: transparent; | |
− | + | color: #FFF; | |
− | + | padding: 1em 0; | |
− | + | opacity: 0; | |
− | + | filter: alpha(opacity=0); | |
− | + | -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; | |
− | + | transition: opacity 0.35s, transform 0.35s; | |
− | + | -webkit-transform: translate3d(0,-100%,0); | |
− | + | transform: translate3d(0,-100%,0); | |
− | + | } | |
− | + | .hovereffect a, hovereffect p { | |
− | + | color: #FFF; | |
− | + | padding: 1em 0; | |
− | + | opacity: 0; | |
− | + | overflow: scroll; | |
− | + | filter: alpha(opacity=0); | |
− | + | -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; | |
− | + | transition: opacity 0.35s, transform 0.35s; | |
− | + | -webkit-transform: translate3d(0,100%,0); | |
− | + | transform: translate3d(0,100%,0); | |
− | + | } | |
− | + | .hovereffect:hover a, .hovereffect:hover p, .hovereffect:hover h2 { | |
− | + | opacity: 1; | |
− | + | filter: alpha(opacity=100); | |
− | + | -webkit-transform: translate3d(0,0,0); | |
− | + | transform: translate3d(0,0,0); | |
− | + | overflow: auto; | |
− | + | } | |
− | + | .croppy-image { | |
− | + | display: inline-block; | |
− | + | width: 100%; | |
− | + | height: 189px; | |
− | + | background-size:cover; | |
− | + | background-position: center; | |
− | + | background-repeat: no-repeat; | |
− | + | } | |
− | + | /* PRETTY SCROLL BAR */ | |
− | + | .overlay::-webkit-scrollbar { | |
− | + | width: 2px; | |
− | + | } | |
− | + | /* Track */ | |
− | + | .overlay::-webkit-scrollbar-track { | |
− | + | -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); | |
− | + | -webkit-border-radius: 10px; | |
− | + | border-radius: 10px; | |
− | + | } | |
− | + | /* Handle */ | |
− | + | .overlay::-webkit-scrollbar-thumb { | |
− | + | -webkit-border-radius: 10px; | |
− | + | border-radius: 10px; | |
− | + | background: rgba(255,255,255,0.3); | |
− | + | /*-webkit-box-shadow: inset 0 0 6px rgba(255,255,255,0.5); */ | |
− | + | } | |
− | + | .overlay::-webkit-scrollbar-thumb:window-inactive { | |
background: rgba(0,0,0,0.3); | background: rgba(0,0,0,0.3); | ||
− | + | } | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | /* STUFF INSPIRED BY BOOTSTRAP */ | |
− | + | .container { | |
− | + | display: block; | |
− | + | margin: auto; | |
− | + | width: 1176px; | |
− | + | max-width: 90vw; | |
− | + | min-width: 800px; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | .col-3 { | |
+ | display: inline-block; | ||
+ | width: calc(24.99% - 4px); | ||
+ | padding: 2px; | ||
+ | } | ||
− | </head> | + | .col-12 { |
+ | display: inline-block; | ||
+ | width: 100%; | ||
+ | } | ||
+ | .row { | ||
+ | display: flex; | ||
+ | flex-wrap: wrap; | ||
+ | width: 100%; | ||
+ | justify-content: center; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
− | <body> | + | |
+ | <body> | ||
+ | |||
<div class="container"> | <div class="container"> | ||
− | + | <div class="row"> | |
− | + | <div class="col-12"> | |
− | + | <h1 style="text-align:center; font-size: 75px;"><font face ="Poiret One">Team Members</font></h1> | |
− | + | <br> | |
− | + | </br> | |
− | + | </div> | |
+ | </div> | ||
<!-- USE THIS AS YOUR TEMPLATE FOR THE REST!--> | <!-- USE THIS AS YOUR TEMPLATE FOR THE REST!--> | ||
<!-- Also, make sure your using the new CSS I put in for .hovereffect:hover --> | <!-- Also, make sure your using the new CSS I put in for .hovereffect:hover --> | ||
+ | |||
<div class="row"> | <div class="row"> | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/8/8c/Marc.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
− | <h2><font face ="Poiret One" color="white"> | + | <h2><font face ="Poiret One" color="white">Marc Ammerlaan</font></h2> |
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Marc Ammerlaan is a lecturer in the Program in Biology. He has been an adviser to Michigan's iGEM team since 2010. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 209: | Line 210: | ||
</div> | </div> | ||
</div> | </div> | ||
− | |||
− | |||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/thumb/3/36/T--Michigan--NickEmery.jpg/450px-T--Michigan--NickEmery.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
− | <h2><font face ="Poiret One" color="white"> | + | <h2><font face ="Poiret One" color="white">Nick Emery</font></h2> |
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Nick Emery is a student at the University of Michigan studying Cell and Molecular Biology and Biomedical Engineering. Working towards cheaper, easier detection of protein biomarkers to improve disease diagnostics in developing countries and resource scarce settings. Also working in the lab of Dr. Allen Liu in the Department of Biomedical Engineering at University of Michigan. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 228: | Line 227: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/7/77/Vijay_msbt.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
− | <h2><font face ="Poiret One" color="white"> | + | <h2><font face ="Poiret One" color="white">Vijay Vobbilisetty</font></h2> |
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Vijay is a sophomore studying Biomedical Engineering at the University of Michigan, Ann Arbor. This is his first time on the Michigan Synthetic Biology Team, and he also works in a lab that studies the genetic precursors of aortic aneurysms. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 239: | Line 238: | ||
</div> | </div> | ||
</div> | </div> | ||
+ | |||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/6/65/T--Michigan--Irina.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
− | <h2><font face ="Poiret One" color="white"> | + | <h2><font face ="Poiret One" color="white">Irina Kopyeva</font></h2> |
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Irina is a sophomore studying Chemical Engineering with a concentration in Life Sciences. She loves to whitewater kayak and being outdoors in general! | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 253: | Line 253: | ||
</div> | </div> | ||
</div> | </div> | ||
− | + | ||
<div class="row"> | <div class="row"> | ||
<div class="col-3"> | <div class="col-3"> | ||
Line 270: | Line 270: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/3/3e/T--Michigan--Rachel.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
<h2><font face ="Poiret One" color="white">Rachel Sun</font></h2> | <h2><font face ="Poiret One" color="white">Rachel Sun</font></h2> | ||
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Rachel is a student of Cellular & Developmental Biology and Biomedical Engineering at the University of Michigan. Combining the ordered and methodical thought processes of engineering and my own fascination with biological processes, I am an active member of the Michigan Synthetic Biology Team which competes anually in the iGEM competition. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 283: | Line 283: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/3/3c/Aaron_MSBT.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
<h2><font face ="Poiret One" color="white">Aaron Renberg</font></h2> | <h2><font face ="Poiret One" color="white">Aaron Renberg</font></h2> | ||
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Aaron Renberg is an enthusiastic rising junior and OptiMize Social Innovation Challenge Summer Fellow. He has previous research experience interning at the National Institutes of Health in Bethesda, MD and at Children’s National Medical Center’s genetic medicine department in Washington, D.C. In addition to MSBT, he is currently working in a medical research lab in the Brehm Center for Diabetes Research at U of M. When a micropipet isn’t in his hand, it is usually replaced by a hockey stick or a fencing foil. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 311: | Line 311: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/3/3f/Anishii_photo.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
<h2><font face ="Poiret One" color="white">Akira Nishii</font></h2> | <h2><font face ="Poiret One" color="white">Akira Nishii</font></h2> | ||
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Akira Nishii is a sophomore studying chemical engineering and biochemistry at the University of Michigan. He strives to become a physician-scientist (MD/PhD) in the "near" future. Along with MSBT, he plans to conduct research on cancer immunotherapy of brain tumors (glioma) under Dr. Maria Castro and Dr. Pedro Lowenstein of the Department of Neurosurgery. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 324: | Line 324: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/5/5b/Zach_MSBT.png')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
<h2><font face ="Poiret One" color="white">Zach Bernstein</font></h2> | <h2><font face ="Poiret One" color="white">Zach Bernstein</font></h2> | ||
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Zach Bernstein is a rising sophomore studying Neuroscience in the Honors Program at the University of Michigan. Zach has had a variety of different work and academic experiences in business and sciences. He intends on minoring in The Ross School of Business and enjoys playing basketball and hiking. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 337: | Line 337: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/2/22/Dany_lewin_msbt.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
<h2><font face ="Poiret One" color="white">Dany Lewin</font></h2> | <h2><font face ="Poiret One" color="white">Dany Lewin</font></h2> | ||
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Dany is originally from Mexico. She transferred to the University of Michigan a year ago, and she is now a junior majoring in Cell and Molecular Biology. This is her first year on the Michigan Synthetic Biology Team and is super excited to go to Boston! | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 350: | Line 350: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/d/d7/Cristina-msbt.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
<h2><font face ="Poiret One" color="white">Cristina Castillo</font></h2> | <h2><font face ="Poiret One" color="white">Cristina Castillo</font></h2> | ||
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Cristina is a recent graduate from the University of Michigan in Cell and Molecular Biology. She has been part of MSBT for three years now and currently she is an advisor for the team. As a research assistant in a physiology lab on campus, she studies effects of hypoxia in cancer. She plans to continue her career as a scientist doing a MD/PhD program. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 365: | Line 365: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/c/c6/Robin-msbt.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
<h2><font face ="Poiret One" color="white">Robin Pierce</font></h2> | <h2><font face ="Poiret One" color="white">Robin Pierce</font></h2> | ||
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Robin, a senior at the University of Michigan, is majoring in Biomedical Engineering and looking to seek a Master's as well. | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 378: | Line 378: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/3/32/Pearl_MSBT.jpeg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
<h2><font face ="Poiret One" color="white">Pearl Tu</font></h2> | <h2><font face ="Poiret One" color="white">Pearl Tu</font></h2> | ||
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Pearl is a Master student in Public Health, majoring in Nutritional Sciences. She first joined iGEM as Human Practice leader with The Chinese University of Hong Kong in 2012, and this year, 2016, she is back to iGEM as Human Practice advisor. While products of Synthetic Biology are appearing in food processing, she is interested in seeing how the gap between general public and profession in Synthetic Biology has been addressed in the last 4 years! | |
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 391: | Line 391: | ||
<div class="col-3"> | <div class="col-3"> | ||
<div class="croppy-image" | <div class="croppy-image" | ||
− | style="background-image: url('https://static.igem.org/mediawiki/2016/ | + | style="background-image: url('https://static.igem.org/mediawiki/2016/1/1b/Caleb_MSBT.jpg')"> |
<div class="hovereffect"> | <div class="hovereffect"> | ||
<div class="overlay"> | <div class="overlay"> | ||
− | <h2><font face ="Poiret One" color="white">Caleb</font></h2> | + | <h2><font face ="Poiret One" color="white">Caleb Kaczmarek</font></h2> |
<p> <font face ="Poiret One" color="white"> | <p> <font face ="Poiret One" color="white"> | ||
− | + | Caleb is a sophomore in the University of Michigan's Cellular and Molecular Bioogy and Biomedical Engineering program. As a member of Dr. Qiong Yang's lab in the Biophysics Department, he helps in research focused on kinases and embryonic development. | |
+ | |||
</font></p> | </font></p> | ||
</div> | </div> | ||
Line 402: | Line 403: | ||
</div> | </div> | ||
</div> | </div> | ||
+ | <div class="col-3"> | ||
+ | <div class="croppy-image" | ||
+ | style="background-image: url('https://static.igem.org/mediawiki/2016/c/cb/Alexhadd-msbt.png')"> | ||
+ | <div class="hovereffect"> | ||
+ | <div class="overlay"> | ||
+ | <h2><font face ="Poiret One" color="white">Alex Hadd</font></h2> | ||
+ | <p> <font face ="Poiret One" color="white"> | ||
+ | Alex is a second year undergraduate at the University of Michigan studying biomedical engineering. He is a member of Pi Kappa Alpha and the Michigan Synthetic Biology Team. He works in the Yang Lab in the Department of Biophysics as a research assistant, studying biological oscillators and self organizational processes during embryo development. His other academics interests include synthetic biology, biomaterials, and intellectual property law. | ||
+ | </font></p> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
</div> | </div> | ||
</div> | </div> | ||
</body> | </body> | ||
</html> | </html> |
Latest revision as of 01:49, 20 October 2016