Difference between revisions of "Team:Fudan/Test"

Line 9: Line 9:
 
   #content { margin-left: 0; padding:0px; width:100%;}
 
   #content { margin-left: 0; padding:0px; width:100%;}
 
   .judges-will-not-evaluate { border: 4px solid #e4dede; padding: 2% !important; width: 92%!important; }
 
   .judges-will-not-evaluate { border: 4px solid #e4dede; padding: 2% !important; width: 92%!important; }
 +
 +
ul {
 +
  list-style-type: none;
 +
  margin: 0;
 +
  padding: 0;
 +
  overflow: hidden;
 +
  background-color: #804000;
 +
  font-weight: bold; /* bold font for nav bar*/
 +
}
 +
 +
li {
 +
  float: right;
 +
}
 +
 +
li a {
 +
  display: block;
 +
  color:#FFF4E1;
 +
  text-align: center;
 +
  padding: 14px 16px;
 +
  text-decoration: none;
 +
  text
 +
}
 +
 +
li a:hover {
 +
  color: #FFC864; /*hover makes text yellow */
 +
}
 +
 +
li a, .dropbtn {
 +
  display: inline-block;
 +
  color: white;
 +
  text-align: center;
 +
  padding: 14px 16px;
 +
  text-decoration: none;
 +
}
 +
 +
 +
li.dropdown {
 +
  display: inline-block;
 +
}
 +
 +
.dropdown-content {
 +
  display: none;
 +
  position: absolute;
 +
  background-color: #FFC864;
 +
  min-width: 120px;
 +
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 +
  z-index: 1;
 +
}
 +
 +
.dropdown-content a {
 +
  color:#804000; /* brown text*/
 +
  padding: 12px 16px;
 +
  text-decoration: none;
 +
  display: block;
 +
  text-align: left;
 +
}
 +
 +
.dropdown-content a:hover {
 +
    color:#804000; /* diff from hover to yellow*/
 +
    font-size:large;
 +
}
 +
 +
.dropdown:hover .dropdown-content {
 +
  display: block;
 +
}
 +
 +
.logo {
 +
  display: inline-block;
 +
  position: absolute;
 +
  left: 50px;
 +
  z-index: 1;
 +
}
 +
 +
.project {
 +
    display: block;
 +
    background-color:#DCF0F0; /* light blue */
 +
    box-sizing: border-box;
 +
    padding: 40px;
 +
    text-align: center;
 +
    width: 100%;
 +
    position: relative;
 +
}
 +
 +
.sealedLogo {
 +
    position: absolute;
 +
    width: 20%;
 +
    top: 0%;
 +
left: 40%;
 +
    content: url(https://static.igem.org/mediawiki/2020/d/d0/T--Fudan--sealed_logo.svg);
 +
}
 +
.footer {
 +
    position: relative;
 +
    display: block;
 +
    overflow: hidden;
 +
    background-color:#DCF0F0;
 +
    width: 100%;
 +
    padding: 0;
 +
    margin: 0;
 +
    border: 0;
 +
    background-image: url(https://static.igem.org/mediawiki/2020/4/4b/T--Fudan--footer_envelope.svg);
 +
}
 
</style>
 
</style>
 
</head>
 
</head>
 +
<body>
 +
 +
<ul>
 +
    <div class="logo">
 +
        <a href="#"><img src="https://static.igem.org/mediawiki/2020/0/0e/T--Fudan--brown_logo.svg" alt="logo" width=100%></a>
 +
    </div>
 +
  <li><a href="#about">About</a></li>
 +
  <li><a href="#Team">Team</a></li>
 +
  <li><a href="#Awards">Awards</a></li>
 +
  <li><a href="#Modelling">Modelling</a></li>
 +
  <li><a href="#HumanPractices">HP</a></li>
 +
  <li class="dropdown">
 +
    <a href="javascript:void(0)" class="dropbtn">Experiments</a>
 +
    <div class="dropdown-content">
 +
    <a href="#">Overview</a>
 +
    <a href="#">Results</a>
 +
    <a href="#">Notebook</a>
 +
    </div>
 +
</li>
 +
  <li><a href="#Project">Project</a></li>
 +
  <li><a class="active" href="#home">Home</a></li>
 +
 
 +
</ul>
 +
<div class="project">
 +
    <img src="https://static.igem.org/mediawiki/2020/1/1d/T--Fudan--test_filler_image.jpg" alt = "filler image" width=100%>
 +
    <h1><strong>Description</strong></h1>
 +
    <p1>Very early on, we each came up with an idea for our iGEM project and presented it to the group. You can see some of these on our Initial Ideas page.</p1>
 +
    <br><br>
 +
    <p1>We carried out a public survey in the UK, where more than half of the 200 surveyed wanted a synthetic biology solution for disease diagnosis. You can read more about our surveys on our Silver Human Practices page.
 +
    </p1>
 +
    <br><br>
 +
    <p1>We identified a gap in the field of rapid, point-of-care diagnostics which arises when antibody-based technologies cannot be used, for example diagnosis of diseases in infants or immunocompromised patients.
 +
    </p1>
 +
    <h1>Design</h1>
 +
    <p1>As a result, we decided to use the flexibility and versatility of synthetic biology to design
 +
        a platform technology which addresses these issues.
 +
    </p1>
 +
    <br><br>
 +
    <p1>Lorem Ipsum</p1><br>
 +
    <p1>Lorem Ipsum</p1><br>
 +
    <p1>Lorem Ipsum</p1><br>
 +
    <p1>Lorem Ipsum</p1><br>
 +
    <p1>Lorem Ipsum</p1><br>
 +
</div>
 +
<div class="footer">
 +
    <div class="sealedLogo"></div>
 +
    <img src="https://static.igem.org/mediawiki/2020/4/4b/T--Fudan--footer_envelope.svg" alt="envelope">
  
 +
</div>
 +
</body>
 
</html>
 
</html>

Revision as of 15:35, 15 July 2020

filler image

Description

Very early on, we each came up with an idea for our iGEM project and presented it to the group. You can see some of these on our Initial Ideas page.

We carried out a public survey in the UK, where more than half of the 200 surveyed wanted a synthetic biology solution for disease diagnosis. You can read more about our surveys on our Silver Human Practices page.

We identified a gap in the field of rapid, point-of-care diagnostics which arises when antibody-based technologies cannot be used, for example diagnosis of diseases in infants or immunocompromised patients.

Design

As a result, we decided to use the flexibility and versatility of synthetic biology to design a platform technology which addresses these issues.

Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
envelope