Difference between revisions of "Template:UCAS-China"

 
(37 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
−
<script>$(document).ready(function(){$("#HQ_page").attr("id","");highlight_current_page_menu();$(".menu_item").click(function(){$(".submenu_control_icon",this).toggleClass("open");$(this).next(".submenu").fadeToggle(400)});$(".igem_2018_team_mobile_bar").click(function(){$(this).next().toggleClass("displaying_menu")})});function highlight_current_page_menu(){var page_url="https://2018.igem.org/";page_url=page_url+wgPageName;$("a[href$='"+page_url+"']").children().addClass("current_page");if($(".current_page").hasClass("submenu_item")){$(".current_page").parent().parent().fadeToggle(400);$(".current_page").parent().parent().prev().addClass("current_page");$(".menu_item.current_page > .submenu_control_icon").toggleClass("open")}};</script>
+
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
 +
<script>
 +
    function hide_show_menu() {
 +
      if (window.location.href.indexOf("submit") >= 0) {
 +
        $(".igem_2017_menu_wrapper").hide();
 +
      }
  
 +
        if (document.getElementById('bars_item')) {
  
−
<style>
+
        $("#bars_item").click(function() {
−
#home_logo,#sideMenu{display:none}#sideMenu,#top_title,.patrollink{display:none}#content{margin-left:0;margin-top:-7px;padding:0;width:100%}body{background-color:white}#bodyContent h1,#bodyContent h2,#bodyContent h3,#bodyContent h4,#bodyContent h5{margin-bottom:0}.judges-will-not-evaluate{border:4px solid #e4dede;padding:2%!important;width:92%!important}.igem_2018_team_menu{background-color:#c4baba;border-left:1px solid #c4baba;display:block;float:right;height:100vh;max-width:270px;overflow-y:auto;overflow-x:hidden;padding:0;position:fixed;right:0;text-align:left;width:15%}.igem_2018_team_menu.displaying_menu{display:block}.igem_2018_team_menu a{color:#484848;text-decoration:none}.igem_2018_team_menu img{width:100%}.igem_2018_team_menu .menu_item{background-color:#c4baba;border-bottom:1px solid #928b8b;clear:both;color:#484848;cursor:pointer;float:left;font-size:120%;font-weight:bold;padding:15px 0 15px 5%;width:100%}.igem_2018_team_menu .menu_item.direct_link{color:#484848;padding-left:15%}.igem_2018_team_menu .menu_item:hover{background-color:#ecb656}.igem_2018_team_menu .menu_item .submenu_control_icon{color:#484848;float:left;width:10%}.igem_2018_team_menu .menu_item .submenu_control_icon::before{content:"+"}.igem_2018_team_menu .menu_item .submenu_control_icon.open::before{content:"-"}.igem_2018_team_menu .submenu{background-color:#e4dede;clear:both;display:none;float:left;width:100%}.igem_2018_team_menu .submenu .submenu_item{border-bottom:1px solid #c4baba;color:#635d5d;height:30px;float:left;font-size:110%;font-weight:bold;padding:12px 0 0 15%;width:100%}.igem_2018_team_menu .submenu .submenu_item:hover{background-color:#f3bd5d}.igem_2018_team_menu .submenu .submenu_item.current_page,.igem_2018_team_menu .menu_item.current_page,.igem_2018_team_menu .menu_item.direct_link.current_page{background-color:#7acbd8}.igem_2018_team_mobile_bar{background-color:#e4dede;border-bottom:1px solid #c4baba;cursor:pointer;display:none;float:left;margin-top:0;padding:5px 0;position:fixed;width:100%}.igem_logo_mobile img{width:70px}.igem_logo_mobile{float:left;padding-left:5%;width:30%}.igem_menu_control_mobile img{width:25px}.igem_menu_control_mobile{float:right;padding-right:5%;padding-top:5px;text-align:right;width:30%}.igem_2018_team_content{background-color:white;display:block;width:87%}.igem_2018_team_content .igem_2018_team_column_wrapper{margin:auto;max-width:1400px;width:90%}.igem_2018_team_content .igem_2018_team_column_wrapper h1{font-size:210%}.igem_2018_team_content .igem_2018_team_column_wrapper h2{font-size:190%}.igem_2018_team_content .igem_2018_team_column_wrapper h3{font-size:170%}.igem_2018_team_content .igem_2018_team_column_wrapper h4{font-size:150%}.igem_2018_team_content .igem_2018_team_column_wrapper h5{font-size:140%}.igem_2018_team_content .igem_2018_team_column_wrapper h6{font-size:130%}.igem_2018_team_content .igem_2018_team_column_wrapper h1,.igem_2018_team_content .igem_2018_team_column_wrapper h2{border-bottom:0;color:#635d5d;font-family:"Arial Black",Gadget,sans-serif;padding:10px 0}.igem_2018_team_content .igem_2018_team_column_wrapper h3,.igem_2018_team_content .igem_2018_team_column_wrapper h4,.igem_2018_team_content .igem_2018_team_column_wrapper h5,.igem_2018_team_content .igem_2018_team_column_wrapper h6{border-bottom:0;color:#928b8b;font-family:"Arial Black",Gadget,sans-serif;padding:5px 0}.igem_2018_team_content .igem_2018_team_column_wrapper p{font-size:130%;font-family:Arial,Helvetica,sans-serif;padding:5px 0;text-align:left;color:#484848}.igem_2018_team_content .igem_2018_team_column_wrapper a{color:#5bc7d8;font-weight:bold;text-decoration:underline;text-decoration-color:#5bc7d8;transition:all .4s ease;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;-ms-transition:all .4s ease;-o-transition:all .4s ease}.igem_2018_team_content .igem_2018_team_column_wrapper a:hover{color:#f8b732;text-decoration:none}.igem_2018_team_content .igem_2018_team_column_wrapper table{border:1px solid #928b8b;border-collapse:collapse;font-size:130%;width:100%}.igem_2018_team_content .igem_2018_team_column_wrapper td{border:1px solid #c4baba;border-collapse:collapse;font-size:105%;padding:10px;vertical-align:text-top}.igem_2018_team_content .igem_2018_team_column_wrapper th{background-color:#c4baba;border:1px solid #928b8b;border-collapse:collapse;font-size:110%;padding:10px;vertical-align:text-top}.igem_2018_team_content .igem_2018_team_column_wrapper ul,.igem_2018_team_content .igem_2018_team_column_wrapper ol{font-size:130%;font-family:Arial,Helvetica,sans-serif;padding:0 20px}.igem_2018_team_content .igem_2018_team_column_wrapper ul ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ul ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ul ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ol ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ol ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ul ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ol ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ol ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ul ol li{font-size:76%}
+
          $("#sideMenu").hide();
−
.igem_2018_team_content .igem_2018_team_column_wrapper .column{float:left;margin:1% 2%;padding:0}.igem_2018_team_content .igem_2018_team_column_wrapper .column.full_size{width:96%}.igem_2018_team_content .igem_2018_team_column_wrapper .column.two_thirds_size{width:62.6%}.igem_2018_team_content .igem_2018_team_column_wrapper .column.third_size{width:29.3%}.igem_2018_team_content .igem_2018_team_column_wrapper .column.full_size img,.igem_2018_team_content .igem_2018_team_column_wrapper .column.two_thirds_size img,.igem_2018_team_content .igem_2018_team_column_wrapper .column.third_size img{margin-bottom:15px;width:100%}.igem_2018_team_content .igem_2018_team_column_wrapper .clear{clear:both}.igem_2018_team_content .igem_2018_team_column_wrapper .clear.extra_space{height:30px}.igem_2018_team_content .igem_2018_team_column_wrapper .line_divider{border-top:1px solid #c4baba;margin:auto;width:98%}.igem_2018_team_content .igem_2018_team_column_wrapper .button_link{font-size:130%;margin:30px auto;text-align:center}.igem_2018_team_content .igem_2018_team_column_wrapper .button_link a{background-color:#5bc7d8;color:#635d5d!important;font-weight:bold;margin:auto;text-decoration:none!important;padding:10px 15px}.igem_2018_team_content .igem_2018_team_column_wrapper .button_link a:hover{background-color:#f8b732!important}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight{padding:15px 20px}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight p,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h1,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h2,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h3,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h4,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h5,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h6{padding:5px 15px}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_background{background-color:#e4dede}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_A_top{border-top:4px solid #5bc7d8}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_A_full{border:4px solid #5bc7d8}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_B_top{border-top:4px solid #f8b732}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_B_full{border:4px solid #f8b732}@media only screen and (max-width:1800px){.igem_2018_team_content{width:85%}.igem_2018_team_menu{display:block}}@media only screen and (max-width:1400px){.igem_2018_team_menu .menu_item{font-size:100%}.igem_2018_team_menu .submenu .submenu_item{font-size:90%}.igem_2018_team_menu{display:block}}@media only screen and (max-width:1001px){.igem_2018_team_menu{display:block}}@media only screen and (max-width:1000px){.igem_2018_team_content{width:100%;margin-left:0}.igem_2018_team_menu{display:none;margin-top:45px;min-width:50%;width:50%}.igem_2018_team_mobile_bar{display:block}.igem_2018_team_content .igem_2018_team_column_wrapper .column.full_size,.igem_2018_team_content .igem_2018_team_column_wrapper .column.two_thirds_size,.igem_2018_team_content .igem_2018_team_column_wrapper .column.third_size{width:96%}}@media only screen and (max-width:500px){.igem_2018_team_menu{min-width:100%;width:100%}}
+
 
−
</style>
+
          $(".igem_2017_menu_wrapper").fadeToggle("100");
 +
        });  
 +
        }  
 +
      else {
 +
            setTimeout(hide_show_menu, 15);
 +
      }
 +
    }
 +
</script>
  
 
<head>  
 
<head>  
−
<title>Team:UCAS-China &#60;Rose Forest&#62;</title>
+
 
−
<meta name="viewport" content="width=device-width, initial-scale=1">  
+
  <!-- This tells the browser that your page is responsive -->
 +
  <meta name="viewport" content="width=device-width, initial-scale=1">  
 +
        <!-- This is from CSS templates -->
 +
  <!--<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">-->
 +
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">
 +
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 +
  <script type="text/javascript" async
 +
    src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML">
 +
  </script>
 +
 
 +
  <!-- Latest compiled and minified CSS -->
 +
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 +
  <style type="text/css">
 +
    /****************************** DEFAULT WIKI SETTINGS  ****************************/
 +
 
 +
 
 +
  body,h1,h2,h3,h4,h5,h6,p {font-family: "Raleway", sans-serif; line-height: 1.5}
 +
 
 +
        body, html {
 +
        height: 100%;
 +
        line-height: 2;
 +
        }
 +
 
 +
    #home_logo, #sideMenu { display:none; }
 +
    #sideMenu, #top_title, .patrollink  {display:none;}
 +
    #content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
 +
    body {background-color:#000000; }
 +
    #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5, #bodyContent p {
 +
        font-family: "Raleway", sans-serif;
 +
        line-height: 1.5;
 +
        margin-bottom: 0px;
 +
       
 +
    }
 +
 
 +
 
 +
 
 +
/**************************** NAVBAR *************************************/
 +
 
 +
/* Add a dark background color with a little bit see-through */
 +
.navbar {
 +
    left: -20px !important;
 +
    right: -20px !important;
 +
    top: -20px !important;
 +
    padding-top: 25px;
 +
    padding-bottom: 5px;
 +
    padding-left: 25px;
 +
    padding-right: 25px;
 +
    background-color: rgb(25, 55, 89);
 +
    border-color: transparent;
 +
    border: 0;
 +
    font-size: 13px !important;
 +
    letter-spacing: 1px;
 +
    /*opacity:0.95;*/
 +
    margin-top: 17px;
 +
    transition: background-color 0.5s ease-out;
 +
}
 +
 
 +
.navbar-nav {
 +
    margin-top: 2.1em !important;
 +
}
 +
 
 +
.navbar li {
 +
    margin: 0 2px;
 +
    border-radius: 5px;
 +
}
 +
 
 +
/* Add a gray color to all navbar links */
 +
.navbar li a, .navbar .navbar-brand {
 +
    color: #fff;
 +
    border-radius: 5px;
 +
}
 +
 
 +
/* the color of the single Link ('safety') on hover */
 +
.navbar-nav li a:hover {
 +
    color: #193759;//changed
 +
}
 +
 
 +
/* The active link this seems to be useless at the moment*/
 +
.navbar-nav li.active a {
 +
    color: #fff;
 +
    background-color:#29292c;
 +
}
 +
 
 +
/* Remove border color from the collapsible button */
 +
.navbar-default .navbar-toggle {
 +
    border-color: transparent;
 +
}
 +
 
 +
.navbar-default {
 +
    border-color:transparent;
 +
}
 +
 
 +
.navbar-collapse>ul:before {
 +
    content: "";
 +
    margin-top: 40px;
 +
}
 +
 
 +
@media (min-width: 768px){
 +
    .navbar-collapse>ul:before {
 +
        content: "";
 +
        margin-top: 0px;
 +
    }
 +
 
 +
    .navbar-right {
 +
        margin-right: 2% !important;
 +
    }
 +
 
 +
    .navbar-header {
 +
        margin-left: 2% !important;
 +
    }
 +
   
 +
    .navbar>li>a {
 +
        padding: 10px 15px;
 +
    }
 +
}
 +
@media (max-width: 761px){
 +
.dropdown-menu li a {
 +
    color: #ffffff;
 +
    letter-spacing: 1px;
 +
}
 +
}
 +
 
 +
/* the color of the Dropdown on click */
 +
.open .dropdown-toggle {
 +
    color: #193759;//changed
 +
    background-color: #fff;
 +
}
 +
 
 +
/* the color of the Dropdown links */
 +
.dropdown-menu li a {
 +
    color: #000;
 +
    letter-spacing: 1px;
 +
}
 +
 
 +
/* the color of the dropdown links on hover */
 +
.dropdown-menu li a:hover {
 +
    background-color: #fff;
 +
}
 +
 
 +
.navbar-toggle .icon-bar {
 +
    background: white;
 +
}
 +
 
 +
.navbar-header img {
 +
    height: 80px;
 +
}
 +
 
 +
#globalWrapper {
 +
    margin-bottom: 0px;
 +
    padding-bottom: 0px;
 +
}
 +
 
 +
#top_menu_14 {
 +
    height: 18px;
 +
}
 +
 
 +
#top_menu_14 #user_item {
 +
    margin-top: -3px;
 +
    padding-top: 0px;
 +
}
 +
 
 +
#top_menu_14 #bars_item img {
 +
    vertical-align: top;
 +
}
 +
 
 +
@media (max-width: 810px) {
 +
    #home-link {
 +
        display:none;
 +
    }
 +
}
 +
 
 +
.nav .open>a, .nav>li>a:hover, .nav .open:hover>a, .nav .dropdown:hover>a{
 +
    background-color: white;
 +
    border: none;
 +
    border-bottom-left-radius: 0px;
 +
    border-bottom-right-radius: 0px;
 +
    box-shadow: 0px 6px 12px rgba(0,0,0,.175);
 +
    color: #193759;//changed
 +
}
 +
 
 +
.nav .open .dropdown-menu, .nav .dropdown-menu {
 +
    border: none;
 +
    border-top-left-radius: 4px !important;
 +
}
 +
 
 +
.nav .open>a:hover, .nav a:focus {
 +
    background-color: white !important;
 +
}
 +
 
 +
@media (min-width: 979px) {
 +
  ul.nav li.dropdown:hover > ul.dropdown-menu {
 +
    display: block;
 +
  }
 +
}
 +
 
 +
.navbar.scrolled {
 +
    background-color: rgba(0,33,71,0.9);
 +
}
 +
 
 +
@media (min-width: 1200px) {
 +
    .container {
 +
        width: 1000px;
 +
    }
 +
}
 +
 
 +
 
 +
/**** PAGE CONTENT ****/
 +
 
 +
#bodyContent {
 +
    background-color: #000000;
 +
}
 +
 
 +
#bodyContent h1 {
 +
    text-align: center;
 +
    font-size: 48pt;
 +
    font-weight: lighter;
 +
    color: #fff;
 +
 
 +
}
 +
 
 +
#bodyContent h2 {
 +
    text-align: center;
 +
    font-size: 24pt;
 +
    font-weight: bold;
 +
    margin-top: calc(8vh);
 +
    margin-bottom: calc(5vh);
 +
color: #fff;
 +
}
 +
 
 +
#bodyContent h3 {
 +
    text-align: left;
 +
    font-size: 14pt;
 +
    font-weight: bold;
 +
color: #fff;
 +
}
 +
 
 +
#bodyContent h4 {
 +
    text-align: left;
 +
    font-size: 14pt;
 +
color: #fff;
 +
}
 +
 
 +
#bodyContent h5 {
 +
    text-align: center;
 +
    font-size: 12pt;
 +
    color: #ccc;
 +
}
 +
 
 +
#bodyContent p {
 +
    font-size: 14pt;
 +
    margin-top: 10px;
 +
color: #fff;
 +
}
 +
 
 +
#bodyContent .table {
 +
    font-size: 12pt;
 +
   
 +
}
 +
.img-center {
 +
    margin: 6pt auto;
 +
}
 +
 
 +
.img-reponsive {
 +
    margin-top: 6pt;
 +
    margin-bottom: 6pt;
 +
 
 +
}
 +
#bodyContent .imager{
 +
float: right;
 +
/*width: 200px;*/
 +
text-align: center;
 +
font-size: 12px;
 +
padding-left: 20px;
 +
 
 +
}
 +
 
 +
#bodyContent strong{
 +
    text-align: justify;
 +
    padding: calc(4vh);
 +
    font-size: 25px;
 +
line-height; 2.5;
 +
    color: white;
 +
}
 +
#bodyContent b{
 +
    color: white;
 +
    text-align: justify;
 +
    padding-top: 10px;
 +
    padding-bottom: 10px;
 +
}
 +
 
 +
#bodyContent .imagel{
 +
float: left;
 +
/*width: 200px;*/
 +
text-align: center;
 +
font-size: 12px;
 +
padding-right: 20px;
 +
 
 +
}
 +
 
 +
#side {
 +
    float: left;
 +
padding-right: 20px;
 +
padding-top: 15px;
 +
}
 +
#sider {
 +
    float: right;
 +
padding-left: 20px;
 +
padding-top: 15px;
 +
}
 +
 
 +
.container a{
 +
  color: #71C671;
 +
}
 +
 
 +
.container table, .container td, .contain .tr{
 +
    border: 0;
 +
    border-color: transparent;
 +
}
 +
  </style>
 +
 
 +
  <!-- Latest compiled JavaScript -->
 +
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 +
 
 +
  <!-- Google Analytics -->
 +
  <script>
 +
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
 +
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
 +
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
 +
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
 +
 
 +
  ga('create', 'UA-102136418-1', 'auto');
 +
  ga('send', 'pageview');
 +
 
 +
  </script>
 +
 
 +
 
 
</head>
 
</head>
−
<div class="igem_2018_team_content">
 
−
<div class="igem_2018_team_column_wrapper">
 
−
        <div id="igemUCAS">
 
−
<div>
 
−
<h1>DESCRIPTION</h1>
 
−
<img class="img-responsive img-center" width="400px;" src="https://static.igem.org/mediawiki/2018/c/cb/T--UCAS-China--_Logo_1_PNG.png">
 
−
<p>One hundred years ago, there was a young boy who was seeking a unique rose for his behaved girl. That was freezing winter night, all roes had died. After a long time searching in the withered rose bushed fruitlessly, the young boy was almost desperate. Touched by his true love, a nightingale, who understood his wish, sung all night under the cold moonlight. Just before dawn, a rose stained with blood of the nightingale, bloomed, bright and fragrant.</p>
 
−
<p>The nightingale, created by Oscar Wilde, built a red rose for true love out of her song under moonlight. To Wilde, the unique rose stained with blood of the nightingale is the symbol of love and true art. To us UCAS-China team, the touching story should be passed down to our generation and explained in a more scientific and interesting way with the tools of synthetic biology. Furthermore, as Wilde conveyed in the story, the barrier and combination of art and science still remain worth discussing, so we also explore in depth the relationship of art and science in the <a href= "https://2018.igem.org/Team:UCAS-China/Human_Practices
 
−
">Human Practices section</a>.</p><br>.
 
−
<p>In our project which combining the four elements-music (the song of the nightingale), light (the moonlight), color (the stained rose) and odor (the rose fragrance), everyone is able to create his/her own with unique soul, together forming our rose forest in the junction of art and science!
 
−
</p>
 
−
<h2>DESIGN</h2>
 
−
<p> In our work, the E. coli need light and sound as inputs to produce color and odor as outputs. The process is mainly divided into three parts: sound to light, light to color, and light to odor. The light-color and light-odor conversions are achieved with the RGB vision system which is based on the phage RNAP system as a resource allocator. As for the sound-light conversion, we develop a software that allows users to upload their own music to generate their unique dynamic pictures, with which people can color and ensoul their own roses.
 
−
</p><br>
 
  
−
<p>The light control system mainly consists of 3 subsystems, a “sensor array”, an “output array” and a “signal transit”.</p><br>
 
  
−
<p>Firstly, the “sensor array” combines 3 sensors, Cph8* (asterisk), YF1 and CcaSR, which could be activated predominantly by red, blue and green light. These optogenetic tools enables our E. coli to response to light of different wavelengths respectively.</p><br>
+
<!-- THIS IS WHERE THE HTML BEGINS -->
 +
 
 +
<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="50">
 +
 
 +
<nav class= "navbar-fixed-top navbar">
 +
  <div class="container-fluid">
 +
    <div class="navbar-header">
 +
      <!-- This allows the navigation bar to be replaced by a button in the top right corner when screen is to small -->
 +
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
 +
        <span class="icon-bar"></span>
 +
        <span class="icon-bar"></span>
 +
        <span class="icon-bar"></span>
 +
      </button>
 +
 
 +
      <!-- This is the logo -->
 +
    <a href="https://2018.igem.org/Team:UCAS-China" class="navbar-left"><img src="https://static.igem.org/mediawiki/2018/c/cb/T--UCAS-China--_Logo_1_PNG.png"></a>
 +
 
 +
    </div>
 +
    <div class="collapse navbar-collapse" id="myNavbar">
 +
      <ul class="nav navbar-nav navbar-right">
 +
       
 +
        <li id="home-link"><a href="https://2018.igem.org/Team:UCAS-China">HOME</a></li>
 +
       
 +
        <!-- This is the project dropdown -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">PROJECT
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Description">DESCRIPTION</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/LightToColor">LIGHT TO COLOR</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/LightToOdor">LIGHT TO ODOR</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/SoundToLight">SOUND TO LIGHT</a></li>
 +
           
 +
          </ul>
 +
        </li>
 +
 
 +
        <!-- This is the results button -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">RESULTS
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Validated_contribution">PROOF OF CONCEPT</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Demonstrate">DEMONSTRATE</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Software">SOFTWARE</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Hardware">HARDWARE</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Model">MODEL</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Improve">IMPROVE</a></li>
 +
         
 +
           
 +
           
 +
          </ul>
 +
        </li>
 +
<!-- This is the PARTS button -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">PARTS
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Composite_Part">BASIC & COMPOSITE PARTS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Part_Collection">PART COLLECTION</a></li>     
 +
          </ul>
 +
        </li>
 +
 
 +
 
 +
 
 +
          <!-- This is the human practices dropdown -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">HUMAN PRACTICE
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices">OVERVIEW</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/Gold_overview">GOLD—OVERVIEW</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/Gold_art-and-science">GOLD—ART X SCIENCE</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/orpheus">GOLD—ORPHEUS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/gifts_for_the_world">GOLD—GIFTS FOR THE WORLD!</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/silver_overview">SILVER—OVERVIEW</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Collaborations">SILVER—COLLABORATIONS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/silver_education">SILVER—EDUCATION</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/silver_interview">SILVER—INTERVIEW</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Public_Engagement">SILVER—PUBLIC ENGAGEMENT</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/HP_safety">SILVER—SAFETY & SECURITY</a></li>
 +
 
  
−
<h2>Why did we focus on diagnostics?</h2>
+
         
 +
          </ul>
 +
        </li>
  
−
<p>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 <a href= "https://2017.igem.org/Team:Oxford/InitialIdeas">Initial Ideas page</a>.</p><br>
 
−
<p>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 <a href= "https://2017.igem.org/Team:Oxford/HP/Silver">Silver Human Practices page</a>.<br>
 
−
<br><p>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. As a result, we decided to use the flexibility and versatility of synthetic biology to design a platform technology which addresses these issues.
 
−
</p><br>
 
  
−
<h2>What is Chagas disease?</h2>
 
−
<p>Our cell-free diagnosis kit is designed to diagnose Chagas disease in its acute phase using a simple blood test. Chagas disease is a neglected tropical disease endemic to Latin America that impacts 6-7 million people, of whom 95% lack sufficient diagnosis or treatment. We decided to focus our efforts on designing a diagnostic for congenital Chagas disease, since current point-of-care diagnostics cannot be used to detect Chagas disease in infants. Current treatments using benznidazole and nifurtimox are almost 100% effective if given shortly after the onset of the acute phase. However, lack of diagnosis leads to the onset of the chronic phase, which causes irreversible pathological consequences to the heart, digestive system, and nervous system. We hope to make a positive contribution towards this cause with our project. </p><br>
 
−
<p> You can read more about this on our <a href= "https://2017.igem.org/Team:Oxford/Chagas_Disease">Chagas disease page</a>.</p><br>
 
  
−
<h2>What is our solution?</h2>
+
        <!-- This is the people dropdown -->
−
<p>We have designed two systems - one DNA based and one protein-based - to detect a protease, cruzipain. Cruzipain is produced and secreted  by <em>T. cruzi</em> in the blood and has a specific cleavage sequence, which is ideal for the input. Our systems have bivalirudin as the output for both methods. Bivalirudin is a small peptide that acts as an anticoagulant. Therefore if bivalrirudin were produced in response to the presence of cruzipain, the blood would be inhibited from clotting. These systems are designed to be cell-free and freeze-dried to ensure safety and ease of transport, before being added to a sample of blood.</p><br>
+
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">PEOPLE
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/Meet_the_Team">MEET THE TEAM!</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Attributions">ATTRIBUTIONS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/Medal_Achievements">ACHIEVEMENTS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/Notebook">NOTEBOOK</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Contributions">CONTRIBUTIONS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/safety">SAFETY & SECURITY</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/acknowledgement">ACKNOWLEDGEMENT</a></li>
 +
          </ul>
 +
        </li>
  
−
<p>For our DNA-based system, we have designed a TetR molecule with a cleavage site for TEV protease. Our TetR will start bound to its DNA operator, repressing the production of an output protein. When it is cleaved by TEV, repression is relieved, and the reporter produced.</p><br>
+
        <!-- This is the search button -->
 +
      </ul>
 +
    </div>
 +
  </div>
 +
</nav>
 +
<script>
 +
//
 +
function checkScroll(){
 +
    var startY = 200; //The point where the navbar changes in px
  
−
<p>For our protein-based system, we have designed an amplificatory protein circuit encased in outer membrane vesicles (OMVs). Both our input (cruzipain) and our intermediate output (TEV protease) are proteases. The amplification components of our system is a split TEV protease, the two halves of which are made accessible to dimerise in the presence of cruzipain. Upon dimerisation, the protease is activated and can go on to activate more of itself in an amplificatory positive feedback loop. Active TEV protease can then cleave and release bivalirudin, which acts as the <a href = "https://2017.igem.org/Team:Oxford/Design#C3">reporter</a> of our system by inhibiting blood clotting.</p><br>
+
    if($(window).scrollTop() > startY){
 +
        $('.navbar').addClass("scrolled");
 +
    }else{
 +
        $('.navbar').removeClass("scrolled");
 +
    }
 +
}
  
−
</div>
+
if($('.navbar').length > 0){
−
</div>
+
    $(window).on("scroll load resize", function(){
−
         </div>
+
         checkScroll();
−
</div>
+
    });
 +
}
 +
</script>

Latest revision as of 06:48, 1 December 2018