Difference between revisions of "Team:Warwick"

Line 3: Line 3:
 
<html lang="en" dir="ltr" class="client-nojs">
 
<html lang="en" dir="ltr" class="client-nojs">
 
<head>
 
<head>
<meta charset="UTF-8" />
+
  <meta charset="UTF-8" />
<title>Team:Warwick-2016.igem.org</title>
+
  <title>Team:Warwick-2016.igem.org</title>
 +
  <style type="text/css">
  
<head>
+
  #text {margin-top: 50px; z-index: 9999;}
 +
  #text h2 {font-size: 25px; text-decoration: none; border-bottom: 0px; display: block; background-color: #c97062; color: #fff; font-weight: bold; border-radius: 4px; padding: 15px; opacity: 0.5; }
  
<style type="text/css">
+
  .blockk:hover h2 {opacity: 0.9 !important; transition-property: opacity;
 +
      transition-duration: 1s;
 +
      transition-timing-function: ease; }
  
#text {margin-top: 50px; z-index: 9999;}
+
  #text h4 {text-decoration: none; font-size: 14px; font-weight: normal !important; border-bottom: 0px; display: block;   padding-left: 5px; padding-top: 5px; padding-bottom: 5px; line-height: 2; text-align: justify; color: #272a2b}
#text h2 {font-size: 25px; text-decoration: none; border-bottom: 0px; display: block; background-color: #c97062; color: #fff; font-weight: bold; border-radius: 4px; padding: 15px; opacity: 0.5; }
+
  
.blockk:hover h2 {opacity: 0.9 !important; transition-property: opacity;
+
      
     transition-duration: 1s;
+
      
     transition-timing-function: ease; }
+
  
#text h4 {text-decoration: none; font-size: 14px; font-weight: normal !important; border-bottom: 0px; display: block;   padding-left: 5px; padding-top: 5px; padding-bottom: 5px; line-height: 2; text-align: justify; color: #272a2b}
+
  /*references*/
 +
  .content .tooltip {
 +
    background-color: #fff;
 +
    border: 1px #22343C solid;
 +
    border-radius: 4px;
 +
    padding: 3px;
 +
    position: absolute;
 +
    width: 300px;
 +
    z-Index: 99999;
 +
    display: none;
 +
    letter-spacing: 1px;
 +
    line-height: 1;
 +
    font-size: 11px;
 +
  }
  
    
+
   .tooltip a {color: #22343C;}
    
+
   .tooltip {color: #22343C;}
  
/*references*/
+
  .content {
.content .tooltip {
+
    position: relative;
  background-color: #fff;
+
   }
border: 1px #22343C solid;
+
  border-radius: 4px;
+
  padding: 3px;
+
  position: absolute;
+
   width: 300px;
+
  z-Index: 99999;
+
  display: none;
+
letter-spacing: 1px;
+
line-height: 1;
+
font-size: 11px;
+
}
+
  
.tooltip a {color: #22343C;}
+
  .content {color: #d67166;}
.tooltip {color: #22343C;}
+
  
.content {
+
   /* end-of-references */
   position: relative;
+
}
+
  
.content {color: #d67166;}
+
  .bigtitle {width: 42%; margin-top: 100px; margin: 0 auto; font-size: 16px; background-image:none /*url('https://static.igem.org/mediawiki/2015/4/43/Warwick_headercircle.png')*/; text-align: center; line-height: 2;
 +
      background-position: top center;  background-repeat: no-repeat; background-size: contain; padding: 9%; position: relative; margin-bottom: 100px; color: #22343C;}
  
/* end-of-references */
+
  .bigtitle a {color: #22343C; text-decoration: none;}
  
.bigtitle {width: 42%; margin-top: 100px; margin: 0 auto; font-size: 16px; background-image:none /*url('https://static.igem.org/mediawiki/2015/4/43/Warwick_headercircle.png')*/; text-align: center; line-height: 2;
+
  .title2 {font-family: Satisfy; font-size: 380%; text-align:center;}
    background-position: top center;  background-repeat: no-repeat; background-size: contain; padding: 9%; position: relative; margin-bottom: 100px; color: #22343C;}
+
  
.bigtitle a {color: #22343C; text-decoration: none;}
+
  .titlecircle {width: 85%; margin: 0 auto; padding-top: 12%;}
  
.title2 {font-family: Satisfy; font-size: 380%; text-align:center;}
+
  .arrow {font-size: 50px;}
  
.titlecircle {width: 85%; margin: 0 auto; padding-top: 12%;}
 
  
.arrow {font-size: 50px;}
+
  #text h2 {
 +
  font-size: 25px !important;
 +
  text-decoration: none;
 +
  border-bottom: 0px;
 +
  display: block;
 +
  background-color: #c97062;
 +
  color: #fff;
 +
  font-weight: bold;
 +
  border-radius: 4px;
 +
  padding: 10px;
 +
  opacity: 0.5;
 +
    line-height: 1.4;
 +
  }
  
 +
  a {
 +
  color:#473E4F;
 +
  -webkit-transition: color ease-in-out 300ms;
 +
  }
  
#text h2 {
+
  a:hover
font-size: 25px !important;
+
  {color: #70C4BB;
text-decoration: none;  
+
  text-decoration:none;
border-bottom: 0px;
+
  -webkit-transition: color ease-in-out 300ms;
display: block;
+
   }
background-color: #c97062;
+
color: #fff;
+
font-weight: bold;
+
border-radius: 4px;
+
padding: 10px;
+
opacity: 0.5;
+
   line-height: 1.4;
+
}
+
  
a {
 
color:#473E4F;
 
-webkit-transition: color ease-in-out 300ms;
 
}
 
  
a:hover
 
{color: #70C4BB;
 
text-decoration:none;
 
-webkit-transition: color ease-in-out 300ms;
 
}
 
  
 +
  a:visited {
 +
  color:#473E4F;
 +
  text-decoration:none;
 +
  -webkit-transition: color ease-in-out 300ms;
 +
  }
  
 +
  #bodyContent {
 +
  background-color:#F8FFFF;
 +
  }
  
a:visited {
+
  @media (max-width:400px){
color:#473E4F;
+
  p {text-align:justify;};
text-decoration:none;
+
  h3 {font-size:10px;};
-webkit-transition: color ease-in-out 300ms;
+
  }
}
+
  
#bodyContent {
+
  /* wiki width fixing */
background-color:#F8FFFF;
+
  #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
}
+
      display:none;}
 +
  #top-section {
 +
      border: none;
 +
      height: 0px;}
  
@media (max-width:400px){
+
  #p-logo, h1.firstHeading,#search-controls,#catlinks {display:none;}
p {text-align:justify;};
+
    #footer #f-list {margin-top:0;}
h3 {font-size:10px;};
+
    #top-section,#footer-box{margin:0;padding:0;width:100%;height:0;}
}
+
    #contentSub {margin: 0;}
  
/* wiki width fixing */
+
  #globalWrapper, #content {
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
+
  width: 100% !important;
    display:none;}
+
  height: 100%;
#top-section {
+
  border: 0;
    border: none;
+
  background-color: F8FFFF;
    height: 0px;}
+
  margin: 0;
 +
  padding: 0 !important;
 +
  padding-bottom: 0 !important;
 +
  top:0;
 +
  line-height: 1;
 +
  position: absolute;
 +
  }
  
#p-logo, h1.firstHeading,#search-controls,#catlinks {display:none;}
+
  #bodyContent {top: 0px;
   #footer #f-list {margin-top:0;}
+
   position: absolute;
   #top-section,#footer-box{margin:0;padding:0;width:100%;height:0;}
+
   height: auto;
   #contentSub {margin: 0;}
+
  min-height: 100%;
 +
  margin: 0 auto;
 +
  padding: 0;
 +
  overflow-y: scroll;
 +
  overflow-x: hidden;  
 +
   margin-left:-500px ;}
  
#globalWrapper, #content {
+
  html, body, #container {
width: 100% !important;
+
  top: 0px;
height: 100%;
+
  width:100%;
border: 0;
+
  height: auto;
background-color: F8FFFF;
+
  overflow-x: hidden;  
margin: 0;
+
    background: none !important;
padding: 0 !important;
+
  }
padding-bottom: 0 !important;
+
top:0;
+
line-height: 1;
+
position: absolute;
+
}
+
  
#bodyContent {top: 0px;
+
  .buttonblack {
position: absolute;
+
height: auto;
+
min-height: 100%;
+
margin: 0 auto;
+
padding: 0;
+
overflow-y: scroll;
+
overflow-x: hidden;
+
margin-left:-500px ;}
+
  
html, body, #container {
+
    margin-bottom: 10px;
top: 0px;
+
    margin-top: 10px;
width:100%;
+
 
height: auto;
+
   }
overflow-x: hidden;
+
   background: none !important;
+
}
+
  
.buttonblack {
 
  
   margin-bottom: 10px;
+
   .intro-buttons {
   margin-top: 10px;
+
   padding-top: 20pxcolor: #FFFFFF;
   
+
  }
}
+
  
  
.intro-buttons {
 
padding-top: 20px;  color: #FFFFFF;
 
}
 
  
 +
  .intro-buttons a {  color: #FFFFFF; text-decoration: none;}
  
  
.intro-buttons a { color: #FFFFFF; text-decoration: none;}
+
   
 +
   
 +
    #header2:before
 +
  {
 +
  content: "";
 +
 
 +
 
 +
      position: fixed;
 +
      top: 0;
 +
      left: 0;
 +
    bottom: 0;
 +
  margin: 0;
 +
  padding: 0;
 +
      width: 100%;
 +
      height: 100%;
 +
  overflow: hidden;
 +
  display: block;
 +
  border: none;
  
 +
  }
 +
   
 +
   
 +
   
  
 
 
 
 
  #header2:before
 
{
 
content: "";
 
 
 
    position: fixed;
 
    top: 0;
 
    left: 0;
 
  bottom: 0;
 
margin: 0;
 
padding: 0;
 
    width: 100%;
 
    height: 100%;
 
overflow: hidden;
 
display: block;
 
border: none;
 
  
}
+
  .back {text-align: center; top: 15%; position: relative;}
    
+
   .back img {padding-left: 10px; padding-right: 10px; padding-bottom: 7px;}
    
+
   .back a {color: #2a2133; font-size: 16px; font-family: Raleway; letter-spacing: 1.5px; }
    
+
   .back a:hover {color: #493c54;  -webkit-transition: color ease-in-out 400ms;}
  
 +
 
  
.back {text-align: center; top: 15%; position: relative;}
 
.back img {padding-left: 10px; padding-right: 10px; padding-bottom: 7px;}
 
.back a {color: #2a2133; font-size: 16px; font-family: Raleway; letter-spacing: 1.5px; }
 
.back a:hover {color: #493c54;  -webkit-transition: color ease-in-out 400ms;}
 
  
 
  
  
 +
  @media screen and (max-width: 960px) {
 +
  #abstracttext p {    line-height: 2; font-size: 13px; text-indent: 50px;
 +
  }
  
  
@media screen and (max-width: 960px) {
+
  }
#abstracttext p {    line-height: 2; font-size: 13px; text-indent: 50px;
+
}
+
  
 +
  #abstract h2 {font-size: 20px;}
  
}
 
  
#abstract h2 {font-size: 20px;}
 
  
  
  
 +
  .mailus {background: #F0F0F5; padding: 5px;}
  
 +
  /*menu*/
  
.mailus {background: #F0F0F5; padding: 5px;}
+
  .mainmenu {
 +
    position: fixed;
 +
    top: 0;
 +
    left: 0;
 +
    z-index: 99999;
 +
    width: 100%;
 +
    height: 100px;
 +
  font-size: 20px;
 +
  background-color: #fff;
 +
  box-shadow: 0px -6px 22px;
 +
  }
  
/*menu*/
 
  
.mainmenu {
 
  position: fixed;
 
  top: 0;
 
  left: 0;
 
  z-index: 99999;
 
  width: 100%;
 
  height: 100px;
 
font-size: 20px;
 
background-color: #fff;
 
box-shadow: 0px -6px 22px;
 
}
 
  
 +
  #hidden-menu {
 +
  margin-left:85%;
 +
  display: none;}
  
 +
  #hidden-menu:hover ul{
 +
  height:auto;
 +
  width:auto;
 +
  z-index:99999999;
 +
  display: block;
 +
  }
  
#hidden-menu {
+
  #hidden-menu ul li {
margin-left:85%;
+
  background-color: #70C4BB;
display: none;}
+
  text-align: center;
 +
  display: block;
 +
  margin:none;
 +
  padding-left:20px;
 +
  padding-right:20px;
 +
  padding-top:8px;
 +
  padding-bottom:8px;
 +
  box-shadow:1.5px 1.5px lightgrey;
 +
  border-radius:4px;
 +
  opacity:0.9;
 +
  z-index:99999999;
 +
  }
  
#hidden-menu:hover ul{
+
  #hidden-menu ul {
height:auto;  
+
  position:fixed;
width:auto;
+
  padding-top:60px;
z-index:99999999;
+
  right: 0px;
display: block;
+
  padding-right: 50px;
}
+
  display: none;
 +
  }
  
#hidden-menu ul li {
+
  #hidden-menu ul li a {
background-color: #70C4BB;
+
  color: #fff; font-size: 23px;
text-align: center;
+
  }
display: block;
+
margin:none;
+
padding-left:20px;
+
padding-right:20px;
+
padding-top:8px;
+
padding-bottom:8px;
+
box-shadow:1.5px 1.5px lightgrey;
+
border-radius:4px;
+
opacity:0.9;
+
z-index:99999999;
+
}
+
  
#hidden-menu ul {
+
  #hidden-menu ul li a:hover {
position:fixed;
+
  color: #787172
padding-top:60px;
+
  }
right: 0px;
+
padding-right: 50px;
+
display: none;
+
}
+
  
#hidden-menu ul li a {
+
  #hidden-menu a {
color: #fff; font-size: 23px;
+
  color: #473E4F; text-decoration: none; font-family: Raleway;  
}
+
  }
  
#hidden-menu ul li a:hover {
+
  #hidden-menu a:hover {color: #70C4BB;
color: #787172
+
      -webkit-transition: color ease-in-out 150ms;
}
+
  }
  
#hidden-menu a {
 
color: #473E4F; text-decoration: none; font-family: Raleway; 
 
}
 
  
#hidden-menu a:hover {color: #70C4BB;
+
  #mobilebutton {
    -webkit-transition: color ease-in-out 150ms;
+
  height:50px;
}
+
  width:50px;
 +
  top:0;
 +
  right:0px;
 +
  margin-top: 17px;
 +
  position:fixed;
 +
  opacity:0.9;
 +
  z-index:999999999;
 +
  }
  
  
#mobilebutton {
+
  #igemlogo {
height:50px;
+
  position:fixed;
width:50px;
+
  top:30px;
top:0;
+
  left: 10px; float:left;
right:0px;
+
  z-index:99999;
margin-top: 17px;
+
  }
position:fixed;
+
opacity:0.9;
+
z-index:999999999;
+
}
+
  
 +
  .menu-items {display: inline-block;
 +
  width: 100%;
 +
  text-align: right;
 +
  position:fixed;
 +
  top: 20px;
 +
  z-index:99998;
 +
  right: 0;
 +
  padding-right: 53px;
 +
  }
  
#igemlogo {
 
position:fixed;
 
top:30px;
 
left: 10px; float:left;
 
z-index:99999;
 
}
 
  
.menu-items {display: inline-block;
 
width: 100%;
 
text-align: right;
 
position:fixed;
 
top: 20px;
 
z-index:99998;
 
right: 0;
 
padding-right: 53px;
 
}
 
  
 +
  .menu-items li {
 +
    display: inline-block;
 +
    margin-right: 20px;
 +
    margin-left: 10px;
 +
  margin-top: 0px;
 +
  letter-spacing: 3px;
 +
  height: 30px;
 +
  text-transform: uppercase;
 +
  font-size: 12px;
 +
  font-weight: bold;
 +
    }
  
  
.menu-items li {
+
  .menu-items li:hover ul, .menu-items li.hover ul{
  display: inline-block;
+
   padding-left: 0;
   margin-right: 20px;
+
  visibility: visible;
  margin-left: 10px;
+
    opacity: 1;
margin-top: 0px;
+
  transition: opacity 1s ease-in 0s, visibility 0s linear 0s;  
letter-spacing: 3px;
+
height: 30px;
+
text-transform: uppercase;
+
font-size: 12px;
+
font-weight: bold;
+
 
   }
 
   }
  
  
.menu-items li:hover ul, .menu-items li.hover ul{
 
padding-left: 0;
 
visibility: visible;
 
  opacity: 1;
 
transition:  opacity 1s ease-in 0s, visibility 0s linear 0s;
 
}
 
  
  
 +
  .menu-items li ul {
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  transition:  opacity 0.5s ease-in 0s, visibility 0s linear 0.5s;
 +
  position: absolute;
 +
  top: 10px;
 +
    margin-right: 0px;
 +
    margin-left: 0px;
 +
  padding: 0;
 +
  text-align: left;
 +
  }
  
 +
  .menu-items li ul a{list-style-type:none;}
  
.menu-items li ul {
 
visibility: hidden;
 
opacity: 0;
 
transition:  opacity 0.5s ease-in 0s, visibility 0s linear 0.5s;
 
position: absolute;
 
top: 10px;
 
  margin-right: 0px;
 
  margin-left: 0px;
 
padding: 0;
 
text-align: left;
 
}
 
  
.menu-items li ul a{list-style-type:none;}
+
  .menu-items li ul li{
 +
  text-align: left;
 +
  padding: 2px 0px;
 +
  width: auto;
 +
  display:block;
 +
  height: 8px;
 +
  margin: 0px;
  
 +
  }
  
.menu-items li ul li{
+
  .menu-items li ul li a {
text-align: left;
+
  color: #22343C;
padding: 2px 0px;
+
  font-size: 9px;
width: auto;
+
  }
display:block;
+
height: 8px;
+
margin: 0px;
+
  
}
+
  .menu-items li ul li a:hover {
 +
  color: #FE6C68;
 +
  }
  
.menu-items li ul li a {
+
  .menu-items a {
color: #22343C;
+
  color: #22343C;
font-size: 9px;
+
  text-decoration: none;
}
+
  font-family: Raleway;  
 +
  }
  
.menu-items li ul li a:hover {
+
  .menu-items a:hover {color: #70C4BB;
color: #FE6C68;
+
      -webkit-transition: color ease-in-out 150ms;
}
+
  }
  
.menu-items a {
 
color: #22343C;
 
text-decoration: none;
 
font-family: Raleway; 
 
}
 
  
.menu-items a:hover {color: #70C4BB;
 
    -webkit-transition: color ease-in-out 150ms;
 
}
 
  
  
 +
  .buttonblack {
 +
    margin-bottom: 10px;
 +
  margin-top: 10px;
 +
  text-transform: uppercase;
 +
    font-size: 14px;
 +
    font-weight: normal;
 +
    line-height: 1.428571429;
 +
    text-align: center;
 +
    white-space: nowrap;
 +
    vertical-align: middle;
 +
    border-radius: 4px;
 +
  transition-property: background-color, color, border-color;
 +
    transition-duration: 1s;
 +
    transition-timing-function: ease;
 +
              color: #FFFFFF;
 +
    border: solid 5px #336666;
 +
      padding: 10px 16px;
 +
    text-decoration: none;
 +
    width:180px; background-color: #336666;
 +
  font-family: Raleway;
 +
  letter-spacing: 2px;
 +
  font-weight: bold;}
  
  
.buttonblack {
+
  .buttonblack:hover {border-color: #fff; color: #fff; background: none;}
  margin-bottom: 10px;
+
   .buttongreen:hover {border-color: #019966; color: #019966; background: none;}
margin-top: 10px;
+
text-transform: uppercase;
+
  font-size: 14px;
+
  font-weight: normal;
+
  line-height: 1.428571429;
+
  text-align: center;
+
  white-space: nowrap;
+
  vertical-align: middle;
+
  border-radius: 4px;
+
transition-property: background-color, color, border-color;
+
  transition-duration: 1s;  
+
  transition-timing-function: ease;
+
            color: #FFFFFF;
+
  border: solid 5px #336666;
+
    padding: 10px 16px;
+
  text-decoration: none;
+
   width:180px; background-color: #336666;
+
font-family: Raleway;
+
letter-spacing: 2px;
+
font-weight: bold;}
+
  
 +
  .buttongreen {  margin-bottom: 10px;
 +
  margin-top: 20px;
 +
  text-transform: uppercase;
 +
    font-size: 14px;
 +
    font-weight: normal;
 +
    line-height: 1.428571429;
 +
    text-align: center;
 +
    white-space: nowrap;
 +
    vertical-align: middle;
 +
    border-radius: 4px;
 +
  transition-property: background-color, color, border-color;
 +
    transition-duration: 1s;
 +
    transition-timing-function: ease;
 +
              color: #FFFFFF;
 +
    border: solid 5px #019966;
 +
      padding: 10px 16px;
 +
    text-decoration: none;
 +
    width:180px; background-color: #019966;
 +
  font-family: Raleway;
 +
  letter-spacing: 2px;
 +
  font-weight: bold;}
  
.buttonblack:hover {border-color: #fff; color: #fff; background: none;}
+
  a.buttongreen  {text-decoration: none; color: #fff;}
.buttongreen:hover {border-color: #019966; color: #019966; background: none;}
+
  
.buttongreen { margin-bottom: 10px;
+
  .igemlogoo {width: 65px;}
margin-top: 20px;
+
text-transform: uppercase;
+
  font-size: 14px;
+
  font-weight: normal;
+
  line-height: 1.428571429;
+
  text-align: center;
+
  white-space: nowrap;
+
  vertical-align: middle;
+
  border-radius: 4px;
+
transition-property: background-color, color, border-color;
+
  transition-duration: 1s;
+
  transition-timing-function: ease;
+
            color: #FFFFFF;
+
  border: solid 5px #019966;
+
    padding: 10px 16px;
+
  text-decoration: none;
+
  width:180px; background-color: #019966;
+
font-family: Raleway;
+
letter-spacing: 2px;
+
font-weight: bold;}
+
  
a.buttongreen  {text-decoration: none; color: #fff;}
 
  
.igemlogoo {width: 65px;}
+
  /*media*/
  
 +
  @media(max-width:1280px){
 +
  .menu-items {padding-right: 53px;}
 +
  .menu-items li {margin-right: 12px; margin-left: 12px; letter-spacing: 3px;}
  
/*media*/
 
  
@media(max-width:1280px){
+
  }
.menu-items {padding-right: 53px;}
+
.menu-items li {margin-right: 12px; margin-left: 12px; letter-spacing: 3px;}
+
  
  
}
+
  @media(max-width:1152px){
 +
  .menu-items li {margin-right: 12px; margin-left: 9px; letter-spacing: 2.8px;}
  
 +
  }
  
@media(max-width:1152px){
 
.menu-items li {margin-right: 12px; margin-left: 9px; letter-spacing: 2.8px;}
 
  
}
+
  @media(max-width:1024px){
 +
  .menu-items li {
 +
  margin-right: 9px;
 +
  letter-spacing: 2.4px; }
 +
  .menu-items ul li ul a {font-size: 10px; letter-spacing: 1.9px;}
 +
  .igemlogoo {width: 50px;}
 +
  #bodyContent {margin-left: -60px; width: calc(100% + 32px);}
  
 +
  }
  
@media(max-width:1024px){
+
  @media(max-width:960px){
.menu-items li {
+
  .menu-items li {
margin-right: 9px;
+
  margin-right: 9px;
letter-spacing: 2.4px; }
+
  font-size: 10px;
.menu-items ul li ul a {font-size: 10px; letter-spacing: 1.9px;}
+
  letter-spacing: 2.4px;
.igemlogoo {width: 50px;}
+
  }
#bodyContent {margin-left: -60px; width: calc(100% + 32px);}
+
  
}
+
  .menu-items ul li ul a {font-size: 9px; letter-spacing: 1.9px;}
  
@media(max-width:960px){
 
.menu-items li {
 
margin-right: 9px;
 
font-size: 10px;
 
letter-spacing: 2.4px;
 
}
 
  
.menu-items ul li ul a {font-size: 9px; letter-spacing: 1.9px;}
+
  }
  
  
}
+
  @media(max-width:900px){
  
  
@media(max-width:900px){
 
  
 +
  .menu-items li {
 +
  margin-right: 9px;
 +
  margin-left: 0px;
 +
  font-size: 10px;
 +
  letter-spacing: 2.4px;
  
 +
  }
  
.menu-items li {
+
  .menu-items ul li ul a {font-size: 9px; letter-spacing: 1.9px;}
margin-right: 9px;
+
margin-left: 0px;
+
font-size: 10px;
+
letter-spacing: 2.4px;
+
  
}
+
  .menu-items li ul li {height: 6px;}
  
.menu-items ul li ul a {font-size: 9px; letter-spacing: 1.9px;}
+
  .mainmenu {height: 90px; }
  
.menu-items li ul li {height: 6px;}
 
  
.mainmenu {height: 90px; }
+
  .menu-items li ul {top: 20px;}
  
 +
  }
  
.menu-items li ul {top: 20px;}
 
  
}
 
  
  
  
 +
  @media(max-width:830px){
  
 +
  .igemlogoo {width: 40px; opacity: 0.7;}
  
@media(max-width:830px){
+
  #igemlogo {top: 40px; z-index: -1;}
 +
    #Warwickigemlogo {display: none;}
  
.igemlogoo {width: 40px; opacity: 0.7;}
+
  .menu-items ul li ul a {letter-spacing: 1.4px;}
  
#igemlogo {top: 40px; z-index: -1;}
 
  #Warwickigemlogo {display: none;}
 
  
.menu-items ul li ul a {letter-spacing: 1.4px;}
+
  }
  
  
}
+
  @media(max-width: 768px){
  
  
@media(max-width: 768px){
+
  .menu-items li {
 +
  letter-spacing: 2px;
 +
  font-size: 10px;
 +
  margin-right: 3px;
 +
  margin-left: 3px;
 +
  margin-top: 6px;
 +
  text-align: center;
 +
  }
 +
  .menu-items ul {text-align: center; padding: 0; margin: 0 2px; list-style:none;}
  
 +
  .menu-items {text-align: center; padding-left: 0px; margin: 0 auto;}
 +
  .menu-items li ul {position: absolute; left: 0; width: 100%; text-align: center; margin-top: 20px;  }
  
.menu-items li {
+
  .menu-items li ul li {display: inline-block; margin-left: 10px; margin-right: 10px; height: 34px; }
letter-spacing: 2px;
+
  .menu-items ul li ul a { font-size: 10px; letter-spacing: 2px;}
font-size: 10px;
+
margin-right: 3px;
+
margin-left: 3px;
+
margin-top: 6px;
+
text-align: center;
+
}
+
.menu-items ul {text-align: center; padding: 0; margin: 0 2px; list-style:none;}
+
  
.menu-items {text-align: center; padding-left: 0px; margin: 0 auto;}
+
  }
.menu-items li ul {position: absolute; left: 0; width: 100%; text-align: center; margin-top: 20px;  }
+
  
.menu-items li ul li {display: inline-block;  margin-left: 10px; margin-right: 10px; height: 34px; }
 
.menu-items ul li ul a { font-size: 10px; letter-spacing: 2px;}
 
  
}
 
  
 +
  @media(max-width: 740px){
  
 +
  .menu-items li {
 +
  letter-spacing: 1.6px;
 +
  font-size: 10px;
 +
  margin-right: 3px;
 +
  margin-top: 6px;
 +
  }
  
@media(max-width: 740px){
 
  
.menu-items li {
+
  }
letter-spacing: 1.6px;
+
font-size: 10px;
+
margin-right: 3px;
+
margin-top: 6px;
+
}
+
  
  
}
+
  @media(max-width: 680px){
  
 +
  .menu-items li {
 +
  letter-spacing: 1.8px;
 +
  font-size: 9px;
 +
  margin-right: 3px;
 +
  margin-left: 3px;
 +
  margin-top: 8px;
 +
  }
  
@media(max-width: 680px){
+
  .menu-items li ul { margin-top: 20px;}
  
.menu-items li {
+
  .menu-items li ul li {margin-right: 6px;
letter-spacing: 1.8px;
+
  margin-left: 6px;}
font-size: 9px;
+
margin-right: 3px;
+
margin-left: 3px;
+
margin-top: 8px;
+
}
+
  
.menu-items li ul { margin-top: 20px;}
+
  .menu-items ul li ul a { font-size: 9px; letter-spacing: 1.8px;}
  
.menu-items li ul li {margin-right: 6px;
+
  }
margin-left: 6px;}
+
  
.menu-items ul li ul a { font-size: 9px; letter-spacing: 1.8px;}
 
  
}
 
  
 +
  @media(max-width: 640px){
 +
  .mainmenu, .mainmenu ul, .mainmenu ul li {visibility: hidden;}
 +
  #hidden-menu {display: block; z-index: 999999;}
  
 +
  }
  
@media(max-width: 640px){
+
   
.mainmenu, .mainmenu ul, .mainmenu ul li {visibility: hidden;}
+
#hidden-menu {display: block; z-index: 999999;}
+
  
}
+
  @media(max-width:1280px){
  
    
+
   .bigtitle {font-size: 15px;}
 +
  .bigtitle {width: 50%;}
 +
  .buttonblack {padding: 5px 11px;}
  
@media(max-width:1280px){
+
  }
  
.bigtitle {font-size: 15px;}
 
.bigtitle {width: 50%;}
 
.buttonblack {padding: 5px 11px;}
 
  
}
+
  @media(max-width:1152px){
  
 +
  .bigtitle {font-size: 14px;}
 +
  .bigtitle {width: 52%;}
 +
  .titlecircle {width: 80%;}
 +
  a.buttonblack {font-size: 11px; letter-spacing: 1.8px;}
 +
  .buttonblack {padding: 5px 8px;}
 +
  }
  
@media(max-width:1152px){
 
  
.bigtitle {font-size: 14px;}
+
  @media(max-width:1024px){
.bigtitle {width: 52%;}
+
  .bigtitle {width: 58%;}
.titlecircle {width: 80%;}
+
  .titlecircle {padding-top: 15%; width: 75%;}
a.buttonblack {font-size: 11px; letter-spacing: 1.8px;}
+
  #wrapper {top: 100px;}
.buttonblack {padding: 5px 8px;}
+
  a.buttonblack {font-size: 10px; letter-spacing: 1.7px;}
}
+
  #header2:before {background-image: none;}
 +
  #mobilebackground {display: block;}
 +
  .constructs {font-size: 15px;}
  
  
@media(max-width:1024px){
+
  }
.bigtitle {width: 58%;}
+
.titlecircle {padding-top: 15%; width: 75%;}
+
#wrapper {top: 100px;}
+
a.buttonblack {font-size: 10px; letter-spacing: 1.7px;}
+
#header2:before {background-image: none;}
+
#mobilebackground {display: block;}
+
.constructs {font-size: 15px;}
+
  
 +
  @media(max-width:960px){
  
}
+
  .bigtitle {font-size: 13px; width: 65%;}
 +
  .arrow {font-size: 40px;}
 +
  .buttonblack {padding: 5px 5px;}
 +
  #submenu {width: 110%; margin-left: -5%;}
 +
  .constructs img {float: none !important; margin: 0 auto !important; min-width: 60% !important;}
 +
  .constructs {text-align: center;}
 +
  }
  
@media(max-width:960px){
 
  
.bigtitle {font-size: 13px; width: 65%;}
+
  @media(max-width:910px){  
.arrow {font-size: 40px;}
+
  }
.buttonblack {padding: 5px 5px;}
+
#submenu {width: 110%; margin-left: -5%;}
+
.constructs img {float: none !important; margin: 0 auto !important; min-width: 60% !important;}
+
.constructs {text-align: center;}
+
}
+
  
 +
  @media(max-width:850px){
 +
  a.buttonblack {font-size: 10px; letter-spacing: 1.3px;}
 +
  .buttonblack {padding: 4px 3px;}
 +
  #submenu {width: 112%; margin-left: -6%;}
 +
  .constructs img {min-width: 80% !important;}
  
@media(max-width:910px){
 
}
 
  
@media(max-width:850px){
 
a.buttonblack {font-size: 10px; letter-spacing: 1.3px;}
 
.buttonblack {padding: 4px 3px;}
 
#submenu {width: 112%; margin-left: -6%;}
 
.constructs img {min-width: 80% !important;}
 
  
  
 +
  }
  
  
}
 
  
 +
  @media(max-width: 768px){
 +
  .bigtitle {width: 90%; font-size: 13px; padding: 13%; margin-left: -7%;}
 +
  .bigtitle p { font-size: 13px; margin-top: 10px !important;}
 +
  .titlecircle {width: 70%; padding-top: 8%;}
 +
  a.buttonblack {font-size: 9px; letter-spacing: 1.3px;}
 +
  #submenu {width: 80%; margin: 0 auto;}
 +
  .buttonblack {line-height: 3.8;}
 +
  a.buttonblack {font-size: 11px; letter-spacing: 1.8px;}
 +
  .buttonblack {padding: 5px 8px;}
 +
  .citecryan {margin-left: 50px;}
  
 +
  }
  
@media(max-width: 768px){
 
.bigtitle {width: 90%; font-size: 13px; padding: 13%; margin-left: -7%;}
 
.bigtitle p { font-size: 13px; margin-top: 10px !important;}
 
.titlecircle {width: 70%; padding-top: 8%;}
 
a.buttonblack {font-size: 9px; letter-spacing: 1.3px;}
 
#submenu {width: 80%; margin: 0 auto;}
 
.buttonblack {line-height: 3.8;}
 
a.buttonblack {font-size: 11px; letter-spacing: 1.8px;}
 
.buttonblack {padding: 5px 8px;}
 
.citecryan {margin-left: 50px;}
 
  
}
 
  
  
 +
  @media(max-width:680px){
 +
  #wrapper {width: 100%;}
 +
  #text {margin: 50px 25px 0 25px;}
 +
  #text h4 {font-size: 13px;}
 +
  .constructs {font-size: 13px;}
 +
  .bigtitle p { font-size: 13px; }
 +
  .titlecircle {width: 60%;}
 +
  #submenu {width: 70%; margin: 0 auto;}
 +
  .buttonblack {line-height: 3.8;}
 +
  a.buttonblack {font-size: 11px; letter-spacing: 1.8px;}
 +
  .buttonblack {padding: 5px 8px;}
  
 +
  }
  
@media(max-width:680px){
+
  @media(max-width:640px){  
#wrapper {width: 100%;}
+
  .arrow {font-size: 30px;}
#text {margin: 50px 25px 0 25px;}
+
  .titlecircle {width: 60%;}
#text h4 {font-size: 13px;}
+
  #submenu {width: 80%; margin: 0 auto;}
.constructs {font-size: 13px;}
+
.bigtitle p { font-size: 13px; }
+
.titlecircle {width: 60%;}
+
#submenu {width: 70%; margin: 0 auto;}
+
.buttonblack {line-height: 3.8;}
+
a.buttonblack {font-size: 11px; letter-spacing: 1.8px;}
+
.buttonblack {padding: 5px 8px;}
+
  
}
 
  
@media(max-width:640px){
+
  }
.arrow {font-size: 30px;}
+
.titlecircle {width: 60%;}
+
#submenu {width: 80%; margin: 0 auto;}
+
  
  
}
 
  
 +
  @media(max-width:530px){
 +
  a.buttonblack {font-size: 10px; letter-spacing: 1.8px;}
 +
  .bigtitle  {background-image:none;}
 +
  .titlecircle {width: 60%;}
 +
  .title2 {font-size: 320%;}
 +
  #text h4 {line-height: 1.7;}
 +
  .citecryan {margin-left: 10px;}
  
  
@media(max-width:530px){
+
  }
a.buttonblack {font-size: 10px; letter-spacing: 1.8px;}
+
.bigtitle  {background-image:none;}
+
.titlecircle {width: 60%;}
+
.title2 {font-size: 320%;}
+
#text h4 {line-height: 1.7;}
+
.citecryan {margin-left: 10px;}
+
  
 +
  @media(max-width: 480px) {
 +
  .bigtitle p { font-size: 13px; text-align: center;}
 +
  .titlecircle {width: 70%;}
 +
  #submenu {width: 90%; margin: 0 auto;}
  
}
 
  
@media(max-width: 480px) {
 
.bigtitle p { font-size: 13px; text-align: center;}
 
.titlecircle {width: 70%;}
 
#submenu {width: 90%; margin: 0 auto;}
 
  
 +
  }
  
 +
  @media(max-width: 410px) {
 +
  .titlecircle {width: 75%;}
 +
  .title2 {font-size: 300%;}
 +
  .bigtitle p {line-height: 1.5 !important;}
 +
  }
  
}
+
  @media(max-width: 380px) {
 +
  .titlecircle {width: 75%; padding-top: 10%;}
 +
  .bigtitle p {font-size: 12px; line-height: 1.2 !important; letter-spacing: 1px;}
 +
  .title2 {font-size: 260%;}
  
@media(max-width: 410px) {
+
  }
.titlecircle {width: 75%;}
+
.title2 {font-size: 300%;}
+
.bigtitle p {line-height: 1.5 !important;}
+
}
+
 
+
@media(max-width: 380px) {
+
.titlecircle {width: 75%; padding-top: 10%;}
+
.bigtitle p {font-size: 12px; line-height: 1.2 !important; letter-spacing: 1px;}
+
.title2 {font-size: 260%;}
+
 
+
}
+
 
+
 
+
@media(max-width: 360px) {
+
.titlecircle {width: 80%;}
+
.title2 {font-size: 240%;}
+
.buttonblack {width: 250px; display: block; line-height: 1.5; margin: 5px auto;}
+
}
+
</style>
+
  
  
 +
  @media(max-width: 360px) {
 +
  .titlecircle {width: 80%;}
 +
  .title2 {font-size: 240%;}
 +
  .buttonblack {width: 250px; display: block; line-height: 1.5; margin: 5px auto;}
 +
  }
 +
  </style>
 
</head>
 
</head>
 
<html>
 
<html>
<body>
+
   <body>
 
+
    <p>Testing Shit 1 2 3 </p>
<div style="clear: both;"></div>
+
  </body>
<nav class="mainmenu">
+
<div id="menu" class="menu">
+
+
<div class="menu-items">
+
<div id="igemlogo">
+
<a href="https://2016.igem.org"><img src="https://static.igem.org/mediawiki/2015/7/72/UPOSevillaIgemLogoGrey.png" class="igemlogoo"></a></div>
+
 
+
<div id="igemlogo2">
+
<a href="https://2016.igem.org/Team:Warwick"><img src="https://static.igem.org/mediawiki/2016/2/26/T--Warwick--FinalLogo_and_.jpg " class="igemlogoo" style="float:left;position:fixed;left:90px;top:25px;"> </a>
+
</div>
+
 
+
    
+
<li><a href="https://2016.igem.org/Team:Warwick/Description">Project</a>
+
 
+
   
+
 
+
 
+
+
<li><a href="#">Lab work</a>
+
<ul> 
+
 
+
<li><a href="https://2016.igem.org/Team:Warwick/Experiments"> &#9679;  Experiments & Protocols</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Sensors"> &#9679;  Lab book</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Safety"> &#9679;  Biosafety</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Design"> &#9679; Problems Encountered</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Fermentation"> &#9679; Trouble-shooting</a></li>
+
 
+
 
+
</ul>
+
</li>
+
 
+
  <li><a href="https://2016.igem.org/Team:Warwick/HumanAspects">Human Aspects</a>
+
+
</li>
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
+
<li><a href="https://2016.igem.org/Team:Warwick/Teamintroduction">Team Introduction</a></li>
+
 
+
 
+
<li><a href="#">Process</a><ul>
+
  <li><a href="https://2016.igem.org/Team:Warwick/Interlabstudy"> &#9679;  InterLab Study</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Collaborations"> &#9679;  Collaborations</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Notebook"> &#9679;  Notebook</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Modelling"> &#9679;  Modelling</a></li>
+
 
+
 
+
</ul>
+
</li>
+
 
+
<li><a href="#">Outcomes</a><ul>
+
<li><a href="https://2016.igem.org/Team:Warwick/Software">&#9679; Software</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Bactoman">&#9679; Public engagemnt</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Parts"> &#9679; Parts</a></li>
+
 
+
<li><a href="https://2016.igem.org/Team:Warwick/Achievements"> &#9679;  Achievements</a></li>
+
 
+
</ul></li>
+
 
+
 
+
<li><a href="#">People</a>
+
<ul>
+
                              <li><a href="https://2016.igem.org/Team:Warwick/Education"> &#9679; Education</a></li>
+
                              <li><a href="https://2016.igem.org/Team:Warwick/Sponsors">&#9679; Sponsors</a></li>
+
                              <li><a href="https://2016.igem.org/Team:Warwick/Attributions">&#9679; Attributions</a></li>
+
</ul>
+
</li>
+
 
+
</ul>
+
 
+
+
              </div>
+
</div>
+
+
</nav>
+
 
+
<div id="hidden-menu">
+
<img src="https://static.igem.org/mediawiki/2015/d/de/WarwickigemMobileMenu.png" id="mobilebutton">
+
<ul id="mobile-list">
+
<li><a href="https://2016.igem.org/Team:Warwick">Home</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Description">Project</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Effectors">Effectors</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Sensors">Sensors</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Design">Gut-on-a-Chip</a></li>
+
  <li><a href="https://2016.igem.org/Team:Warwick/HumanAspects">Human Aspects</a>
+
<li><a href="https://2016.igem.org/Team:Warwick/Entrepreneurship">Entrepreneurship</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Software">Software</a></li>
+
+
<li><a href="https://2016.igem.org/Team:Warwick/Collaborations">Collaborations</a></li>
+
<li><a href="https://2016.igem.org/Team:Warwick/Parts">Parts</a></li>
+
 
+
<li><a href="https://2016.igem.org/Team:Warwick/Achievements">Achievements</a></li>
+
 
+
                              <li><a href="https://2016.igem.org/Team:Warwick/Team">Team</a></li>
+
                              <li><a href="https://2016.igem.org/Team:Warwick/Attributions">Attributions</a></li>
+
 
+
<li><a href="https://2016.igem.org/Team:Warwick/Interlabstudy">InterLab Study</a></li>
+
<head>
+
 
+
</ul>
+
  </div> </div></div>
+
</body>
+
 
+
<br><br><img src="http://s2.quickmeme.com/img/1a/1af33bbe837b9b1d65c9ac632afc856f90796618695ce6561dfb09387fefac18.jpg" alt="Under Construction" style="padding-top: 2cm;">
+
 
+
</body>
+
 
+
 
+
<h1 style="color:Black;"> Under Construction</h1>
+
 
+
<p style="font-family: Geneva, Tahoma, Verdana, sans-serif">
+
There is no global challenge worth greater investment than improving quality of life. During initial discussions, we identified a wide range of problems that we felt further scientific development would be most beneficial: increasing crop yields; sewage filtration; reclamation of rare earth metals. Upon evaluation, the team decided that synthesizing a modular biosensor detection kit would be most influential, due to the potential application to a wide range of diseases and environmental health issues. This affordable, accessible system could tackle multiple issues over a large demographic, making the venture truly worthwhile. Lyme’s disease, although not at the forefront of discussion, is the inceptive focus of the investigation, as current detection methods can only be applied after debilitating symptoms have manifested. Our novel biosensor would therefore allow treatment of the disease at a period before serious symptoms have arisen. The theoretically adaptable nature of the bio detector also could allow replacement of antibody-reliant detection systems, hence why our other primary research focus is leptospirosis. We also aim to modify this technology such that it can be used to monitor toxic lead and mercury levels in water supplies.
+
 
+
<br><br>Our detection system for infectious agents and environmental pollutants will be based on CRISPR/Cas9 technology, relying on conformational changes in an RNA-based sensor that will trigger transcriptional regulation by a dCas9 protein. We plan to produce a modular gene circuit that can detect the presence of either RNA from an infectious agent or metallic ion and output a fluorescent signal. This will be arranged on a plasmid encoding for an RNA sensor, the CRISPR/Cas9 system, and a fluorescent reporter. The RNA sensor will be a modified sgRNA containing a motif binding either Borrelia/Leptospira RNA or lead/mercury aptamers. This binding will cause a conformational change such that the modified dCas9 enzyme may bind upstream of the transcriptional start site of the fluorescent reporter gene inducing transcription. We will be testing this using multiple novel dCas9 fusion proteins as well as more traditional CRISPR/dCas9 methods. Afterwards, the sensor will be freeze-dried onto a paper scaffold for ease of use.
+
 
+
<br><br>An example of a modified CRISPR/dCas9 system to be used in the project.
+
By the end of the project we hope to create a paper based sensor that will be able to be used in a low-tech, out-of-lab, environment. We hope this will make it available to less economically developed countries as a frontline diagnostic tool and make a real impact in the fight against infectious diseases and pollution.</p>
+
 
+
<h1 style="color:Black;">Contact Us</h1>
+
 
+
<body>
+
 
+
<p>
+
Facebook <a href="https://www.facebook.com/WarwickIGEM/">
+
<img border="0" alt="Facebook" src="https://static.igem.org/mediawiki/2016/4/41/Facebook_Link_Badge_Black.png" width="20" height="20">
+
</a>
+
 
+
Twitter <a href="https://twitter.com/WarwickIgem">
+
<img border="0" alt="Facebook" src="https://static.igem.org/mediawiki/2016/e/e3/WarwickTwitterBadgeImage.png" width="20" height="20">
+
</a>
+
</p>
+
</body>
+
 
</html>
 
</html>

Revision as of 13:44, 5 September 2016

<!DOCTYPE html> Team:Warwick-2016.igem.org

Testing Shit 1 2 3