Difference between revisions of "Team:Calgary/Synthesis"

Line 4: Line 4:
 
<html>
 
<html>
 
<h1>Synthesis</h1>
 
<h1>Synthesis</h1>
 +
 +
 +
<div class="tiles">
 +
<div class="wrapper">
 +
<div class="box foo">
 +
<img src="https://static.igem.org/mediawiki/2017/4/43/Calgary2017_SynthesisTile.png">
 +
</div>
 +
<div class="box foo">
 +
<img src="https://static.igem.org/mediawiki/2017/5/5c/Calgary2017_SecretionTile.png">
 +
</div>
 +
<div class="box foo">
 +
<img src="https://static.igem.org/mediawiki/2017/7/7e/Calgary2017_ProcessTile.png">
 +
</div>
 +
<div class="box foo">
 +
<img src="https://static.igem.org/mediawiki/2017/4/43/Calgary2017_SynthesisTile.png">
 +
</div>
 +
<div class="box foo">
 +
<img src="https://static.igem.org/mediawiki/2017/7/7e/Calgary2017_ProcessTile.png">
 +
</div>
 +
<div class="box foo">
 +
<img src="https://static.igem.org/mediawiki/2017/f/f5/Calgary2017_HPTile.png">
 +
</div>
 +
<div class="box foo">
 +
<img src="https://static.igem.org/mediawiki/2017/8/87/Calgary2017_ModelingTile.png">
 +
</div>
 +
<div class="box foo">
 +
<img src="https://static.igem.org/mediawiki/2017/f/f5/Calgary2017_HPTile.png">
 +
</div>
 +
</div>
 +
</div>
  
 
<img src="https://static.igem.org/mediawiki/2017/a/a7/Calgary2017_SynthesisPathway.gif" alt="Synthesis Pathway" height="100%" width="100%">
 
<img src="https://static.igem.org/mediawiki/2017/a/a7/Calgary2017_SynthesisPathway.gif" alt="Synthesis Pathway" height="100%" width="100%">
Line 13: Line 43:
 
<head>
 
<head>
 
<style>
 
<style>
 +
.wrapper{
 +
width: 840px;
 +
margin: auto;
 +
}
 +
 +
.tiles{
 +
 +
}
 +
 +
 +
@media only screen and (max-width: 1131px){
 +
.wrapper{
 +
width: 640px;
 +
}
 +
}
 +
 +
 +
@media only screen and (max-width: 935px){
 +
.wrapper{
 +
width: 440px;
 +
}
 +
}
 +
 +
@media only screen and (max-width: 445px){
 +
.wrapper{
 +
width: 240px;
 +
}
 +
}
 +
 +
 +
 +
.box {
 +
  position:relative;
 +
  display: inline-block;
 +
  height: 200px;
 +
  transition: 0.5s;
 +
  cursor: pointer;
 +
  -webkit-transition:0.5s;
 +
padding: 0.2rem;
 +
    padding-bottom: 0.4rem;
 +
 +
}
 +
 +
/*
 +
.box:hover {
 +
  border: 5px solid rgba(0,160,80,0);
 +
 
 +
  color: #FFF;
 +
}
 +
*/
 +
.box::before, .box::after {
 +
  width: 100%;
 +
  height:100%;
 +
  z-index: 3;
 +
  content:'';
 +
  position: absolute;
 +
  left:0;
 +
top: 0;
 +
  box-sizing: border-box;
 +
 
 +
  -webkit-transform: scale(0);
 +
  transition: 0.5s;
 +
}
 +
 +
.foo::before {
 +
  border-bottom: 10px solid #FFF;
 +
  border-left: 10px solid #FFF;
 +
    border-radius: 10px;
 +
  -webkit-transform-origin: 0 100%;
 +
}
 +
 +
.foo::after {
 +
  border-top: 10px solid #FFF;
 +
  border-right: 10px solid #FFF;
 +
    border-radius: 10px;
 +
  -webkit-transform-origin: 100% 0%;
 +
}
 +
 +
 +
.box:hover::after, .box:hover::before {
 +
  -webkit-transform: scale(1);
 +
}
  
 
</style>
 
</style>
 
</head>
 
</head>
 
</html>
 
</html>

Revision as of 17:49, 29 August 2017

Header

Synthesis

Synthesis Pathway

References

Rose, C., Parker, A., Jefferson, B., & Cartmell, E. (2015). The Characterization of Feces and Urine: A Review of the Literature to Inform Advanced Treatment Technology. Critical Reviews In Environmental Science And Technology, 45(17), 1827-1879. http://dx.doi.org/10.1080/10643389.2014.1000761