Line 1: | Line 1: | ||
{{EPFL}} | {{EPFL}} | ||
<html> | <html> | ||
+ | <style> | ||
+ | .pictureTitle{ | ||
+ | background: linear-gradient(rgba(0,0,0,.2), rgba(0,0,0,.6)), url("https://static.igem.org/mediawiki/2018/b/ba/T--Munich--home_Team.jpg"); | ||
+ | |||
+ | background-repeat: no-repeat; | ||
+ | background-size: cover; | ||
+ | background-position:center; | ||
+ | |||
+ | } | ||
+ | .ImgContainer { | ||
+ | position: relative; | ||
+ | cursor:zoom-in; | ||
+ | } | ||
+ | |||
+ | .Img { | ||
+ | display: block; | ||
+ | width: 100%; | ||
+ | height: auto; | ||
+ | opacity: 1; | ||
+ | border-width: 2px !important; | ||
+ | border-color: white; | ||
+ | } | ||
+ | |||
+ | .ImgOverlay { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | bottom: 0; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | height: 100%; | ||
+ | width: 100%; | ||
+ | opacity: 0; | ||
+ | visibility: hidden; | ||
+ | transition: .5s ease; | ||
+ | background-color: rgba(30,30,30,1); | ||
+ | z-index: 99; | ||
+ | } | ||
+ | |||
+ | /* | ||
+ | .ImgContainer:hover .ImgOverlay { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | */ | ||
+ | |||
+ | |||
+ | .ImgContainer.mobileShow .ImgOverlay { | ||
+ | visibility: visible; | ||
+ | opacity: 0.97; | ||
+ | transition: .5s ease; | ||
+ | } | ||
+ | .ImgContainer.mobileShow .Img { | ||
+ | transition: .5s ease; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | .ImgContainer.mobileShow { | ||
+ | cursor:zoom-out; | ||
+ | } | ||
+ | |||
+ | .ImgText { | ||
+ | color: rgba(220,220,220,1); | ||
+ | position: absolute; | ||
+ | top: 15%; | ||
+ | left: 10%; | ||
+ | -webkit-transform: translate(-5%, -10%); | ||
+ | -ms-transform: translate(-5%, -10%); | ||
+ | transform: translate(-5%, -10%); | ||
+ | } | ||
+ | |||
+ | .ImgText b{ | ||
+ | color: rgba(255,255,255,1); | ||
+ | } | ||
+ | |||
+ | .parallax { | ||
+ | /* The image used */ | ||
+ | background: linear-gradient(rgba(0, 0, 0,.4), rgba(0, 0, 0,.4)), url('https://static.igem.org/mediawiki/2018/e/e9/T--munich--building.jpeg'); | ||
+ | |||
+ | /* Full height */ | ||
+ | height: 50vh; | ||
+ | |||
+ | /* Create the parallax scrolling effect */ | ||
+ | background-attachment: fixed; | ||
+ | background-position: center; | ||
+ | background-repeat: no-repeat; | ||
+ | background-size: cover; | ||
+ | } | ||
+ | |||
+ | @media only screen and (max-width: 575.98px) { | ||
+ | .ImgText { | ||
+ | font-size: 1rem; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media only screen and (min-width: 575.98px) { | ||
+ | .ImgText { | ||
+ | font-size: 1.5rem; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media only screen and (min-width: 767.98px) { | ||
+ | |||
+ | .ImgText { | ||
+ | font-size: 1rem; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | @media only screen and (min-width: 991.98px) { | ||
+ | |||
+ | .ImgText { | ||
+ | font-size: 1.2rem; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | @media only screen and (min-width: 1199.98px) { | ||
+ | .ImgText { | ||
+ | font-size: 1rem; | ||
+ | } | ||
+ | .ImgOverlay { | ||
+ | width: 100%; | ||
+ | top: 100%; | ||
+ | height:140%; | ||
+ | } | ||
+ | .Img { | ||
+ | transition: .5s ease; | ||
+ | opacity: 0.7; | ||
+ | } | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | <script> | ||
+ | |||
+ | //show the descriptions on mobile | ||
+ | $(function () { | ||
+ | $(".ImgContainer").click(function() { | ||
+ | $(".ImgContainer").not(this).removeClass("mobileShow"); | ||
+ | $(this).toggleClass("mobileShow"); | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | </script> | ||
<!-- Wrapper--> | <!-- Wrapper--> | ||
<div class="wrapper"> | <div class="wrapper"> | ||
Line 43: | Line 184: | ||
</div> | </div> | ||
</div> | </div> | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
<div class="col-md-4"> | <div class="col-md-4"> | ||
<div class="team-item"> | <div class="team-item"> |
Revision as of 08:46, 30 September 2019
Team
Laura
Team Leader - Create a colorimetric signal
Leonard
Toehold switches, grammar corrector
Théo
Make amplification by RPA work
Dana
Create a colorimetric signal
Hana
DNA extraction with micro needle patch and wiki creation
Luc
Make amplification by RPA work
Konstantinos
One Pot
Dodo
<3
Stefania
wiki & DNA extraction