Difference between revisions of "Team:Peking"

 
(60 intermediate revisions by 5 users not shown)
Line 3: Line 3:
 
<html lang="en">
 
<html lang="en">
 
<head>
 
<head>
   
 
  <!-- Define Charset -->
 
 
   <meta charset="utf-8">
 
   <meta charset="utf-8">
 
 
  <!-- Responsive Metatag -->
 
 
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 
 
  <!-- Page Description and Author -->
 
 
   <meta name="Peking-iGEM-2015" content="iGEM - Peking iGEM 2015">
 
   <meta name="Peking-iGEM-2015" content="iGEM - Peking iGEM 2015">
 
+
   <!--add  ?action=raw&amp;ctype=text/css     when using Css-->
   <!--add  ?action=raw&amp;ctype=text/css when using Css-->
+
 
+
  <!-- Bootstrap CSS V  -->
+
  <link rel="stylesheet" href="https://2015.igem.org/Template:Peking/CSS?action=raw&amp;ctype=text/css" type="text/css" media="screen">
+
 
+
  <!-- Font Awesome CSS V -->
+
  <!--<link rel="stylesheet" href="https://2015.igem.org/Template:Peking/CSS/Font?action=raw&amp;ctype=text/css" type="text/css" media="screen">-->
+
  <!-- Margo CSS Styles  V-->
+
 
   <link rel="stylesheet" href="https://2015.igem.org/Template:Peking/new?action=raw&amp;ctype=text/css" type="text/css" media="screen">
 
   <link rel="stylesheet" href="https://2015.igem.org/Template:Peking/new?action=raw&amp;ctype=text/css" type="text/css" media="screen">
 
   <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Peking/Style/new?action=raw&amp;ctype=text/css" media="screen">
 
   <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Peking/Style/new?action=raw&amp;ctype=text/css" media="screen">
Line 26: Line 12:
 
   <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Peking/Animate/new?action=raw&amp;ctype=text/css" media="screen">
 
   <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Peking/Animate/new?action=raw&amp;ctype=text/css" media="screen">
 
   <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Peking/Blue/new?action=raw&amp;ctype=text/css " title="blue" media="screen" />
 
   <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Peking/Blue/new?action=raw&amp;ctype=text/css " title="blue" media="screen" />
 
+
   <style type="text/css">/*get rid of the annoying iGEM style*/
   <style type="text/css">
+
      #content{padding:0;border:0;width:100%;}
      /*get rid of the annoying iGEM style*/
+
        #content{
+
            padding:0;
+
            border:0;
+
            width:100%;
+
        }
+
      .firstHeading{
+
        visibility:hidden;
+
      }
+
      h2{
+
        border-bottom:none;
+
        padding-bottom:.5em;
+
       
+
      }   
+
        .carousel-control.left, .carousel-control.right {
+
          background-image: none
+
        }
+
    /* to style the team page*/
+
        .individual-picture{
+
        max-width:200px;margin-top:5px; margin-bottom:10px;
+
        }
+
 
        
 
        
 +
      h2{border-bottom:none;padding-bottom:.5em;}   
 +
      .carousel-control.left, .carousel-control.right{background-image: none}
 +
    /* to style the sidebar*/
 +
        @media (min-width:1024px){
 +
      #sidebar1{position:relative;top:120px;max-width:200px;}
 +
      #sidebar2{display:none;}
 +
      #nav-top{height:88px;}
 +
    }
 +
      @media (max-width: 1023px){
 +
      #sidebar1{display:none;}
 +
      #sidebar2{display:block;}
 +
    }
 +
    .back-to-top{z-index:9999;}
 +
      ul.dropdown{margin-left: 0px; margin-top: 0px;}
 +
    .classic-title span {
 +
    position: absolute;
 +
    margin-top: -30px;
 +
    border-bottom-color: #00afd1;
 +
}
 +
.page-banner{
 +
  background-color:#e0e0e0;margin-top:1%;margin-bottom:20px;padding:20px;padding-top:40px;
 +
}
 +
        #top_menu_inside, #top_menu_inside:before, #top_menu_inside:after { -webkit-box-sizing: content-box; -moz-box-sizing: border-box; box-sizing: content-box;}
 +
        #top_menu_under{font-size: 12px;}
 +
        #top_menu_14{font-size: 12px; height:18px}
 +
        #top_menu_inside li{font-size: 12px;}
 +
        #user_item{font-size: 12px;}
 
     </style>
 
     </style>
   
+
</head>
  
  <!--[if IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
 
  <!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
 
 
 
</head>
 
 
<body>
 
<body>
 
   <!-- Container -->
 
   <!-- Container -->
 
   <div id="container">
 
   <div id="container">
   
+
    <!-- Start Header -->
    <!-- Start Header -->
+
    <div class="hidden-header"></div>
+
 
     <header class="clearfix">
 
     <header class="clearfix">
         
 
 
         <!-- Start  Logo & Naviagtion  -->
 
         <!-- Start  Logo & Naviagtion  -->
 
             <div class="navbar navbar-default navbar-top">
 
             <div class="navbar navbar-default navbar-top">
Line 70: Line 55:
 
                     <div class="navbar-header" >
 
                     <div class="navbar-header" >
 
                         <!-- Stat Toggle Nav Link For Mobiles -->
 
                         <!-- Stat Toggle Nav Link For Mobiles -->
                         <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse" style="marginn-top:20px">
+
                         <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse" style="margin-top:40px">
 
                             <i class="fa"><img  style="margin-left:0;height:30px;"src="https://static.igem.org/mediawiki/2015/4/45/Peking-Hambergur-1.png" ></i>
 
                             <i class="fa"><img  style="margin-left:0;height:30px;"src="https://static.igem.org/mediawiki/2015/4/45/Peking-Hambergur-1.png" ></i>
 
                         </button>
 
                         </button>
 
                         <!-- End Toggle Nav Link For Mobiles -->
 
                         <!-- End Toggle Nav Link For Mobiles -->
                         <a class="navbar-brand" href="2015.igem.org/Team:Peking">
+
                         <a class="navbar-brand" href="https://2015.igem.org/Team:Peking">
 
                             <img alt="Peking iGEM 2015" src="https://static.igem.org/mediawiki/2015/8/8b/Peking-header-logo-1.png" style="height:55px;margin-top:7px">
 
                             <img alt="Peking iGEM 2015" src="https://static.igem.org/mediawiki/2015/8/8b/Peking-header-logo-1.png" style="height:55px;margin-top:7px">
 
                         </a>
 
                         </a>
 
                     </div>
 
                     </div>
 
                     <div class="navbar-collapse collapse"  style="padding-top:5px;padding-bottom:0">
 
                     <div class="navbar-collapse collapse"  style="padding-top:5px;padding-bottom:0">
                          
+
                         <!-- Start Navigation List -->
                        <!-- Start Navigation List -->
+
                         <ul class="nav navbar-nav navbar-right " style="padding-bottom:15px;padding-top:10px">
                         <ul class="nav navbar-nav navbar-right " style="padding-bottom:15px;height:88px;padding-top:10px">
+
 
                             <li>
 
                             <li>
 
                                 <a href="https://2015.igem.org/Team:Peking/JudgingCriteria">Achievements</a>
 
                                 <a href="https://2015.igem.org/Team:Peking/JudgingCriteria">Achievements</a>
Line 98: Line 82:
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Design">Overview</a>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Design">Overview</a>
 
                                     </li>
 
                                     </li>
<li><a href="https://2015.igem.org/Team:Peking/Design/PC_Reporter">Paired<span style="text-transform:lowercase"> d</span>Cas9 Reporter</a>
+
<li><a href="https://2015.igem.org/Team:Peking/Design/PC_Reporter">Paired<span style="text-transform:lowercase"> d</span>Cas9 Reporter</a>                                  
                                    </li>
+
</li>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Design/Isothermal">Iso-<span style="text-transform:lowercase">t</span>hermal Amplification</a></li>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Design/Isothermal">Iso-<span style="text-transform:lowercase">t</span>hermal Amplification</a></li>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Device">Hardware</a>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Device">Hardware</a>
Line 112: Line 96:
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Modeling">Array Design</a>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Modeling">Array Design</a>
 
                                     </li>
 
                                     </li>
                                     <li><a href="https://2015.igem.org/Team:Peking/Modeling/Analysis">Analysis algorithm</a>
+
                                     <li><a href="https://2015.igem.org/Team:Peking/Modeling/Analysis">Analysis Algorithm</a>
 
                                     </li>
 
                                     </li>
 
                                 </ul>
 
                                 </ul>
Line 121: Line 105:
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Practices">Overview</a>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Practices">Overview</a>
 
                                     </li>
 
                                     </li>
                                     <li><a href="https://2015.igem.org/Team:Peking/Practices/Background">Facts about TB</a>
+
                                     <li><a href="https://2015.igem.org/Team:Peking/Practices/Background">TB Facts</a>
 
                                     </li>  
 
                                     </li>  
                                     <li><a href="https://2015.igem.org/Team:Peking/Practices/Consultation">Consultation and Interview</a>
+
                                     <li><a href="https://2015.igem.org/Team:Peking/Practices/Consultation">Consultation and Interview</a>
 
                                     </li>
 
                                     </li>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Practices/Engagement">Public Engagement</a>
 
                                     <li><a href="https://2015.igem.org/Team:Peking/Practices/Engagement">Public Engagement</a>
Line 145: Line 129:
 
                             </li>
 
                             </li>
 
                         </ul>
 
                         </ul>
 +
                        <!-- End Navigation List -->
 +
                    </div>
 +
                </div>
 +
            </div>
 
             <!-- End Header Logo & Naviagtion -->
 
             <!-- End Header Logo & Naviagtion -->
 
              
 
              
Line 150: Line 138:
 
         <!-- End Header Section -->  
 
         <!-- End Header Section -->  
 
      
 
      
<!-- END OF HEAD PART*********END OF HEAD PART*********** END OF HEAD PART *********** END OF HEAD PART ****************END OF HEAD PART*****-->   
+
   
 
+
  
<section id="home">
 
      <!-- Carousel -->
 
      <div id="main-slide" class="carousel slide" data-ride="carousel">
 
  
        <!-- Indicators -->
+
<div class="container-fluid" style="text-align:justify;padding:0;margin:0">
        <ol class="carousel-indicators">
+
      <div id="banner" class="col-md-12">
          <li data-target="#main-slide" data-slide-to="0" class="active"></li>
+
        <img src="https://static.igem.org/mediawiki/2015/1/1e/Peking-Home-Slider-Background-2.jpg">
          <li data-target="#main-slide" data-slide-to="1"></li>
+
      </div>
          <li data-target="#main-slide" data-slide-to="2"></li>
+
        </ol><!--/ Indicators end-->
+
     <!-- Divider -->
 
+
         <div class="hr5" style="margin-top:25px; margin-bottom:45px;"></div>
        <!-- Carousel inner -->
+
      <div class="col-md-12">
        <div class="carousel-inner">
+
       <h3 align="center" style="font-size:24px;color:#00afd1;"> Project Description</h3>
          <div class="item active">
+
      </div>
            <img class="img-responsive" src="https://static.igem.org/mediawiki/2015/7/77/Peking-Home-Slider-Background-1.jpg" alt="slider">
+
            <div class="slider-content">
+
              <div class="col-md-12 text-center">
+
                <h3 style="margin-top:0px">
+
                  <span>Fighting against Tuberculosis, </span>
+
                </h3>
+
                <h3 style=" font-size:60px; margin-top:50px">
+
                  <span><strong>Making invisible visible</strong></span>
+
                </h3>
+
                </div>
+
            </div>
+
          </div><!--/ Carousel item end -->
+
          <div class="item">
+
            <img class="img-responsive" src="https://static.igem.org/mediawiki/2015/7/77/Peking-Home-Slider-Background-1.jpg" alt="slider">
+
            <div class="slider-content">
+
              <div class="col-md-12 text-center">
+
                <h3>
+
                  <span>Peking iGEM 2015</span>
+
                </h3>
+
                   
+
              </div>
+
            </div>
+
          </div><!--/ Carousel item end -->
+
          <div class="item">
+
            <img class="img-responsive" src="https://static.igem.org/mediawiki/2015/7/77/Peking-Home-Slider-Background-1.jpg" alt="slider">
+
            <div class="slider-content">
+
              <div class="col-md-12 text-center">
+
                <h3> <span> some words....</span></h3>
+
                </div>      
+
              </div>
+
            </div>
+
          </div><!--/ Carousel item end -->
+
         </div><!-- Carousel inner end-->
+
 
+
        <!-- Controls -->
+
        <a class="left carousel-control" href="#main-slide" role="button" data-slide="prev">
+
                              <span class="glyphicon" aria-hidden="true"><img src="https://static.igem.org/mediawiki/2015/d/d1/Peking-left.png" style="margin-top:1000%"></span>
+
                                      <span class="sr-only">Previous</span>
+
                          </a>
+
        <a class="right carousel-control" href="#main-slide" role="button" data-slide="next">
+
                              <span class="glyphicon" aria-hidden="true"><img src="https://static.igem.org/mediawiki/2015/f/fc/Peking-right.png" style="margin-top:1000%"></span>
+
                                      <span class="sr-only">Next</span>
+
                          </a>
+
       
+
       </div><!-- /carousel -->     
+
    </section>
+
    <!-- End HomePage Slider -->
+
 
+
<!-- Start Big Heading -->
+
                    <div class="big-title text-center" style="margin-top:45px" data-animation="fadeInDown" data-animation-delay="01">
+
                        <h3 style="font-size:24px"> Project <span class="accent-color">Description</span></h1>
+
                    </div>
+
 
                     <!-- End Big Heading -->
 
                     <!-- End Big Heading -->
  
 
                     <!-- Some Text -->
 
                     <!-- Some Text -->
                    <div id="project-description" class="title-desc text-left" style="max-width:75%; margin:auto;">
+
      <div id="project-description" class="title-desc" style="max-width:75%; margin:auto;">
                    <p class="text-center">
+
        <p>Tuberculosis, caused by <i>Mycobacterium tuberculosis</i>, remains one of the world's most serious public health problems. Although tuberculosis is curable and the treatment success rate is high, it is still the second most common cause of death from infectious disease (after HIV). It causes more than 1.3 million deaths annually, and most of the deaths occur in developing countries that are lack of effective identification of those in need of therapy, with an enormous amount of delayed or failed diagnosis.<br></p>
                      <p>Tuberculosis (TB), caused by <i>Mycobacterium tuberculosis</i>, remains one of the world’s most serious public health problems. Although tuberculosis is curable and the treatment success rate is high, it is still the second most common cause of death from infectious disease (after HIV). Most of the deaths occur in developing countries that are lack of effective identification of those in need of therapy. In 2014 there were 5 million active cases, 1.5 million new cases in China. About 80% cases occurred in rural area, with an enormous amount of delayed or failed diagnosis.<br>
+
        <p><br/>Case detection is currently the rate-limiting step in disease control. The available Nucleic Acid Detection (NAD) Method is sensitive and fast, but does not reach the requirement of specificity and reliability.<br>  
                      Case detection is currently the rate-limiting step in disease control. A diagnostic tool with high sensitivities and specificities is desired urgently, and it is supposed to be used at the point-of-care (POC) within a clinic or in the community. <br>  
+
      <p><br/>To obviate such problems, Peking iGEM team is developing a novel PC Reporters system that can transform biomarkers of the disease into optical signal. Combined with array design and statistical analysis, the presence of <i>Mycobacterium tuberculosis</i> can be easily verified. It can also be easily used in developing areas with designed hardware development. We believe this new advanced system can turn  out as a powerful tool in disease diagnosis, with high specificity and reliability.  
                      To obviate such problems, Peking iGEM team is developing a novel <i>Mycobacterium tuberculosis</i>pathogen detection system that can transform biomarkers of the disease into optical signal or electric signal. Combined with our work in software and hardware development, we believe this new advanced system can be turned out as a powerful tool in disease diagnosis, with high sensitivities and specificities.
+
 
 
                     </p>
 
                     </p>
 
                     </div>
 
                     </div>
 +
                  </div>
  
 
<!-- Divider -->
 
<!-- Divider -->
Line 236: Line 169:
 
         <!-- Start Big Heading -->
 
         <!-- Start Big Heading -->
 
           <div class="big-title text-center" style="margin-top:30px">
 
           <div class="big-title text-center" style="margin-top:30px">
             <h3 style="font-size:24px">blablablabla<span class="accent-color">blablabla</span> & <span class="accent-color">blablabla</span> blablabla</h3>
+
            <h3 style="font-size:24px"><span class="accent-color">Awards</span></br>
             <p class="title-desc" style="margin-top:25px">Lorem Ipsum is simply dummy text of the typesetting industry.</p>
+
                          Best New Composite Part<br/>
 +
              Best Part Collection
 +
            </h3>
 +
             <h3 style="font-size:24px"><span class="accent-color">Poster</span></br>
 +
            97 - Zone 4 - Hall C</br>
 +
            <span class="accent-color">Presentation</span></br>
 +
            9/26/2015 - Room 302 - 11:30 AM
 +
            </h3>
 +
             <p class="title-desc" style="margin-top:30px; font-size:22px;font-weight:bold" >Thanks for your attention!</p>
 
           </div>
 
           </div>
 
           <!-- End Big Heading -->
 
           <!-- End Big Heading -->
Line 246: Line 187:
 
          
 
          
 
         <!-- Start Services Icons -->
 
         <!-- Start Services Icons -->
        <div class="row">
+
     
 +
          <div class="row" style="text-align:justify">
 +
            <div class="col-md-3">
 +
              <div align="center">
 +
                <a href="https://2015.igem.org/Team:Peking/Design/PC_Reporter"><img src="https://static.igem.org/mediawiki/2015/3/32/Peking-feature-1.png" style="max-width:180px"></a>
 +
              </div>
 +
              <div>
 +
                <p align="center" style="margin-top:10px"><b>Specificity</b></p>
 +
                <p style="padding-left:5px;padding-right:5px">A nucleic-acid-based, sequence-specific detection system named "paired dCas9" (PC) reporter was built. Its specificity and sensitivity proved to be enough to detect real MTB genome.</p>
 +
              </div>
 +
            </div>
 +
            <div class="col-md-3">
 +
              <div align="center">
 +
                <a href="https://2015.igem.org/Team:Peking/Design/PC_Reporter#array"><img src="https://static.igem.org/mediawiki/2015/7/79/Peking-feature-2.png" style="max-width:180px"></a>
 +
              </div>
 +
              <div>
 +
                <p align="center" style="margin-top:10px"><b>Reliability</b></p>
 +
                <p style="padding-left:5px;padding-right:5px">An array of MTB-specific markers was designed to use information from the entire genome of MTB to improve the reliability of diagnosis. By statistics, we are able to present the readouts in a quantitative way.</i></p>
 +
              </div>
 +
            </div>
 +
            <div class="col-md-3">
 +
              <div  align="center">
 +
                <a href="https://2015.igem.org/Team:Peking/Device"><img src="https://static.igem.org/mediawiki/2015/0/0c/Peking-feature-3.png" style="max-width:180px"></a>
 +
              </div>
 +
              <div>
 +
                <p align="center" style="margin-top:10px"><b>Portability</b></p>
 +
                <p style="padding-left:5px;padding-right:5px">Noticing that most TB cases occur in developing areas, we built an electronic device that was portable, affordable, and easy to use.</p>
 +
              </div>
 +
            </div>
 +
            <div class="col-md-3">
 +
              <div  align="center">
 +
                <a href="https://2015.igem.org/Team:Peking/Practices"><img src="https://static.igem.org/mediawiki/2015/2/2a/Peking-feature-4.png" style="max-width:180px"></a>
 +
              </div>
 +
              <div>
 +
                <p align="center" style="margin-top:10px"><b>Bench to Bedside</b></p>
 +
                <p style="padding-left:5px;padding-right:5px">Coming from bedside to bench, we set out to apply our bench achievements back to bedside. With consultation, survey and feedback from clinical practice, we are still working on improving our detection system!</p>
 +
              </div>
 +
            </div>
 +
          </div>
 +
 
 +
 
 +
 
 +
        <!-- End Feature Icon 1 -->
 +
        <!--<div class="row">
 
            
 
            
          <!-- Start Feature Icon 1 -->
+
           
          <div class="col-md-3 col-sm-6 service-box service-center">
+
            <div class="col-md-3 service-box service-center" style="height:30%">
 
             <div class="service-icon">
 
             <div class="service-icon">
               <a href="#"><i class="fa "><img src="https://static.igem.org/mediawiki/2015/c/cd/Peking-Home-Feature-1.png" style="max-width:85%"></i></a>
+
               <a href="https://2015.igem.org/Team:Peking/Design/PC_Reporter"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/3/32/Peking-feature-1.png" style="max-width:50%"></i></a>
 
             </div>
 
             </div>
 
             <div class="service-content">
 
             <div class="service-content">
               <h4>Feature 1</h4>
+
               <h4>Specificity</h4>
               <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor.</p>
+
               <p><br>Designed the novel Paired dCas9 (PC) Reporter system to improve the specificty and tested on <span style="color:#00afd1">real TB genome</span>.</p>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
Line 261: Line 245:
 
            
 
            
 
           <!-- Start Feature Icon 2 -->
 
           <!-- Start Feature Icon 2 -->
          <div class="col-md-3 col-sm-6 service-box service-center">
+
        <!--  <div class="col-md-3 service-box service-center" style="height:30%">
 
             <div class="service-icon">
 
             <div class="service-icon">
               <a href="#"><i class="fa "><img src="https://static.igem.org/mediawiki/2015/c/cd/Peking-Home-Feature-1.png" style="max-width:85%"></i></a>
+
               <a href="https://2015.igem.org/Team:Peking/Design/PC_Reporter#array"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/7/79/Peking-feature-2.png" style="max-width:50%"></i></a>
 
             </div>
 
             </div>
 
             <div class="service-content">
 
             <div class="service-content">
               <h4>Feature 2</h4>
+
               <h4>Reliability</h4>
               <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor.</p>
+
               <p><br>Combine <span style="color:#00afd1">array design</span> and <span style="color:#00afd1">statistical analysis</span> to verify the presence of <i>Mycobacterium tuberculosis</i>.</p>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
          <!-- End Feature Icon 2 -->
+
     
         
+
     
 
           <!-- Start Feature Icon 3 -->
 
           <!-- Start Feature Icon 3 -->
          <div class="col-md-3 col-sm-6 service-box service-center">
+
 +
          <!--<div class="col-md-3 service-box service-center">
 
             <div class="service-icon">
 
             <div class="service-icon">
              <a href="#"><i class="fa "><img src="https://static.igem.org/mediawiki/2015/c/cd/Peking-Home-Feature-1.png" style="max-width:85%"></i></a>          
+
              <a href="https://2015.igem.org/Team:Peking/Device"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/0/0c/Peking-feature-3.png" style="max-width:50%"></i></a>
 
             </div>
 
             </div>
 
             <div class="service-content">
 
             <div class="service-content">
               <h4>Feature 3</h4>
+
               <h4>Portability</h4>
               <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor.</p>
+
               <p>Designed a <span style="color:#00afd1">cheap and portable</span> prototype to be used in developing regions.</p>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
           <!-- End Feature Icon 3 -->
+
           <!-- End Feature Icon 1 -->
 
+
         
          <!-- Start Feature Icon 4 -->
+
          <!-- Start Feature Icon 4 -->
           <div class="col-md-3 col-sm-6 service-box service-center">
+
           <!--<div class="col-md-3 service-box service-center" style="height:30%">
 
             <div class="service-icon">
 
             <div class="service-icon">
               <a href="#"><i class="fa "><img src="https://static.igem.org/mediawiki/2015/c/cd/Peking-Home-Feature-1.png" style="max-width:85%"></i></a>
+
               <a href="https://2015.igem.org/Team:Peking/Practices"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/2/2a/Peking-feature-4.png" style="max-width:50%"></i></a>
 
             </div>
 
             </div>
 
             <div class="service-content">
 
             <div class="service-content">
               <h4>Feature 4</h4>
+
               <h4>Bench to Bedside</h4>
               <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor.</p>
+
               <p><br>Come from bedside to bench, and <span style="color:#00afd1">back to bedside</span> again.</p>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
           <!-- End Feature Icon 4 -->
+
           </div>
 +
   
 +
         
 
            
 
            
 
         </div>
 
         </div>
 
         <!-- End Features Icons -->
 
         <!-- End Features Icons -->
               
+
        </div>     
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
+
  </div>
 
+
</div>
 
+
   
 
+
 
       <!--FOOTER************FOOTER*******************FOOTER***************FOOTER************-->
 
       <!--FOOTER************FOOTER*******************FOOTER***************FOOTER************-->
 
+
<!--******************************* the only thing to CHANGE is the SHARE LINK******************************-->
 
     <!-- Start Footer -->
 
     <!-- Start Footer -->
     <footer style="margin-top:30px">
+
     <footer style="margin-top:30px; padding:0">
       <div class="container">
+
       <div class="container" >
         <div class="row footer-widgets">
+
         <div class="row footer-widgets" style="padding:0:margin:0">  
 
            
 
            
 
           <!-- Start Subscribe & Social Links Widget -->
 
           <!-- Start Subscribe & Social Links Widget -->
 
                     <div class="col-md-3">
 
                     <div class="col-md-3">
                           <div class="col-md-12 footer-widget social-widget row">
+
                           <div class="col-md-12 footer-widget social-widget row" style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0">
 
                             <h4>Share This<span class="head-line"></span></h4>
 
                             <h4>Share This<span class="head-line"></span></h4>
                             <ul class="social-icons">
+
                             <ul class="social-icons" style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0">
                                 <li>
+
                                 <li style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0"><!--HERE need to be changed-->
                                     <a class="twitter" target="_blank" href="https://twitter.com/home/?status=2015.igem.org/Team:Peking"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/d/d0/Peking-twitter.png" style="height:20px;width:auto; margin-top:7px;"></i></a>
+
                                     <a class="twitter" target="_blank" href="https://twitter.com/home/?status=https://2015.igem.org/Team:Peking">
 +
                                      <i class="fa">
 +
                                        <img src="https://static.igem.org/mediawiki/2015/d/d0/Peking-twitter.png" style="height:20px;width:auto; margin-top:7px;">
 +
                                      </i>
 +
                                    </a>
 
                                 </li>
 
                                 </li>
                                 <li>
+
                                 <li style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0"><!--HERE need to be changed-->
                                     <a class="facebook"target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=2015.igem.org/Team:Peking"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/0/0e/Peking-facebook.png" style="height:20px; margin-top:7px;"></i></a>
+
                                     <a class="facebook"target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https://2015.igem.org/Team:Peking">
 +
                                      <i class="fa">
 +
                                        <img src="https://static.igem.org/mediawiki/2015/0/0e/Peking-facebook.png" style="height:20px; margin-top:7px;">
 +
                                      </i>
 +
                                    </a>
 
                                 </li>
 
                                 </li>
                                 <li>
+
                                 <li style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0"><!--HERE need to be changed-->
                                     <a class="google"target="_blank" href="https://plus.google.com/share?url=2015.igem.org/Team:Peking"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/7/7a/Peking-google_plus.png" style="height:20px; margin-top:7px;"></i></a>
+
                                     <a class="google"target="_blank" href="https://plus.google.com/share?url=https://2015.igem.org/Team:Peking">
 +
                                      <i class="fa">
 +
                                        <img src="https://static.igem.org/mediawiki/2015/7/7a/Peking-google_plus.png" style="height:20px; margin-top:7px;">
 +
                                      </i>
 +
                                    </a>
 
                                 </li>
 
                                 </li>
 
                                  
 
                                  
Line 332: Line 330:
 
                         <div class="col-md-12 footer-widget social-widget row">
 
                         <div class="col-md-12 footer-widget social-widget row">
 
                             <h4>Follow Us<span class="head-line"></span></h4>
 
                             <h4>Follow Us<span class="head-line"></span></h4>
                             <ul class="social-icons">
+
                             <ul class="social-icons" style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0">
                                 <li>
+
                                 <li style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0">
 
                                     <a class="twitter" href="https://twitter.com/iGEM_Peking"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/d/d0/Peking-twitter.png" style="height:20px; margin-top:7px;"></i></a>
 
                                     <a class="twitter" href="https://twitter.com/iGEM_Peking"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/d/d0/Peking-twitter.png" style="height:20px; margin-top:7px;"></i></a>
 
                                 </li>
 
                                 </li>
                                 <li>
+
                                 <li style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0">  
 
                                     <a class="facebook" href="https://www.facebook.com/pekingigem"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/0/0e/Peking-facebook.png" style="height:20px; margin-top:7px;"></i></a>
 
                                     <a class="facebook" href="https://www.facebook.com/pekingigem"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/0/0e/Peking-facebook.png" style="height:20px; margin-top:7px;"></i></a>
 
                                 </li>
 
                                 </li>
                                 <li>
+
                                 <li style="padding-top:0:padding-bottom:0;margin-top:0;margin-bottom:0">
 
                                     <a class="google" href="https://plus.google.com/u/0/102072923413833492667/posts"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/7/7a/Peking-google_plus.png" style="height:20px; margin-top:7px;"></i></a>
 
                                     <a class="google" href="https://plus.google.com/u/0/102072923413833492667/posts"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/7/7a/Peking-google_plus.png" style="height:20px; margin-top:7px;"></i></a>
 
                                 </li>
 
                                 </li>
Line 377: Line 375:
 
                   <!-- Start Contact Widget -->
 
                   <!-- Start Contact Widget -->
 
                     <div class="col-md-3">
 
                     <div class="col-md-3">
                         <div class="footer-widget">
+
                         <div class="footer-widget" style="padding:0:margin:0" >
 
                         <h4>Contact us<span class="head-line" ></span></h4>
 
                         <h4>Contact us<span class="head-line" ></span></h4>
                         <div class="footer-widget contact-widget" style="font-size:12px">
+
                         <div class="footer-widget contact-widget">
 
                             <img src="https://static.igem.org/mediawiki/2015/e/e1/Peking-footer-logo-1.png" style="max-height:100px;margin-top:10px;margin-bottom:10px" class="img-responsive" alt="Peking iGEM 2015 Logo" >
 
                             <img src="https://static.igem.org/mediawiki/2015/e/e1/Peking-footer-logo-1.png" style="max-height:100px;margin-top:10px;margin-bottom:10px" class="img-responsive" alt="Peking iGEM 2015 Logo" >
 
                              
 
                              
                             <ul>
+
                             <ul style="font-size:12px;color:#b4b4b4">
                                 <li><span>Email:</span> pekingigem@gmail.com</li>
+
                                 <li><span>Email:</span> <a href="Mailto:pekingigem@gmail.com&amp;Subject=Hello&amp;Body=Hi, Peking iGEM!"style="color:#b4b4b4">pekingigem@gmail.com</li>
                                 <li><span>Website:</span> <a href="2015.igem.org/Team:Peking" style="color:#b4b4b4">2015.igem.org/Team:Peking</a></li>
+
                                 <li><span>Website:</span> <a href="2015.igem.org/Team:Peking" style="color:#b4b4b4"> 2015.igem.org/Team:Peking</a></li>
 
                                 <li><span>Address:</span> Peking University, <br>No.5 Yiheyuan Road Haidian District, <br>Beijing, P.R.China 100871</li>
 
                                 <li><span>Address:</span> Peking University, <br>No.5 Yiheyuan Road Haidian District, <br>Beijing, P.R.China 100871</li>
 
                             </ul>
 
                             </ul>
Line 397: Line 395:
 
                 <div class="copyright-section">
 
                 <div class="copyright-section">
 
                     <div class="row">
 
                     <div class="row">
                         <div class="col-md-6">
+
                         <div class="col-md-12" style="padding:0;margin:0;height:30px">
                             <p>&copy; 2015 Peking iGEM -  All Rights Reserved</p>
+
                             <p class="text-center">&copy; 2015 Peking iGEM -  All Rights Reserved. Based on <a href="http://getbootstrap.com/"style="color:#b4b4b4">Bootstrap</a> and Margo template.</p>
 
                         </div>
 
                         </div>
 
                                            
 
                                            
Line 413: Line 411:
 
    
 
    
 
   <!-- Go To Top Link -->
 
   <!-- Go To Top Link -->
   <a href="#" class="back-to-top"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/0/06/Peking-Up.png" style="margin-top:5px; width:90%"></i></a>
+
   <a href="#" class="back-to-top" style="z-index:9999"><i class="fa"><img src="https://static.igem.org/mediawiki/2015/0/06/Peking-Up.png" style="margin-top:5px; width:90%"></i></a>
 
    
 
    
 
   <div id="loader">
 
   <div id="loader">
Line 421: Line 419:
 
     </div>
 
     </div>
 
   </div>
 
   </div>
 
+
 
 +
 
 
<!-- add  ?action=raw&amp;ctype=text/javascript    when using Js-->
 
<!-- add  ?action=raw&amp;ctype=text/javascript    when using Js-->
 
   <!-- Margo JS  -->
 
   <!-- Margo JS  -->
Line 428: Line 427:
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Modernizr?action=raw&amp;ctype=text/javascript "></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Modernizr?action=raw&amp;ctype=text/javascript "></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript?action=raw&amp;ctype=text/javascript"></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript?action=raw&amp;ctype=text/javascript"></script>
 
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Carousel?action=raw&amp;ctype=text/javascript"></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Carousel?action=raw&amp;ctype=text/javascript"></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Appear?action=raw&amp;ctype=text/javascript"></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Appear?action=raw&amp;ctype=text/javascript"></script>
Line 436: Line 434:
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Nicescroll?action=raw&amp;ctype=text/javascript"></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Nicescroll?action=raw&amp;ctype=text/javascript"></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Script?action=raw&amp;ctype=text/javascript"></script>
 
   <script type="text/javascript" src="https://2015.igem.org/Template:Peking/Javascript/Script?action=raw&amp;ctype=text/javascript"></script>
    
+
   <script type="text/javascript" >
 +
function menuFixed(id){
 +
var obj = document.getElementById(id);
 +
var _getHeight = obj.offsetTop;
 +
 
 +
window.onscroll = function(){
 +
changePos(id,_getHeight);
 +
}
 +
}
 +
function changePos(id,height){
 +
var obj = document.getElementById(id);var windowBottom = $(window).scrollTop() + $(window).innerHeight();
 +
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop - 150;
 +
var windowBottom = $(window).scrollTop() + $(window).innerHeight();
 +
var w = window.innerWidth;
 +
if(w>=1024){
 +
  if($(window).scrollTop() + $(window).height() > $(document).height() - 260){
 +
                $('#sidebar1').fadeOut("fast");}else{$('#sidebar1').fadeIn("fast");}
 +
}
 +
if(scrollTop < height){ obj.style.position = 'relative';     
 +
}else{
 +
obj.style.position = 'fixed';
 +
}
 +
}
 +
</script>
 +
 
 +
<script type="text/javascript">
 +
window.onload = function(){
 +
menuFixed('sidebar1');
 +
}
 +
</script>
 +
 
 +
 
 
    
 
    
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 12:42, 17 November 2015

Project Description

Tuberculosis, caused by Mycobacterium tuberculosis, remains one of the world's most serious public health problems. Although tuberculosis is curable and the treatment success rate is high, it is still the second most common cause of death from infectious disease (after HIV). It causes more than 1.3 million deaths annually, and most of the deaths occur in developing countries that are lack of effective identification of those in need of therapy, with an enormous amount of delayed or failed diagnosis.


Case detection is currently the rate-limiting step in disease control. The available Nucleic Acid Detection (NAD) Method is sensitive and fast, but does not reach the requirement of specificity and reliability.


To obviate such problems, Peking iGEM team is developing a novel PC Reporters system that can transform biomarkers of the disease into optical signal. Combined with array design and statistical analysis, the presence of Mycobacterium tuberculosis can be easily verified. It can also be easily used in developing areas with designed hardware development. We believe this new advanced system can turn out as a powerful tool in disease diagnosis, with high specificity and reliability.

Awards
Best New Composite Part
Best Part Collection

Poster
97 - Zone 4 - Hall C
Presentation
9/26/2015 - Room 302 - 11:30 AM

Thanks for your attention!

Specificity

A nucleic-acid-based, sequence-specific detection system named "paired dCas9" (PC) reporter was built. Its specificity and sensitivity proved to be enough to detect real MTB genome.

Reliability

An array of MTB-specific markers was designed to use information from the entire genome of MTB to improve the reliability of diagnosis. By statistics, we are able to present the readouts in a quantitative way.

Portability

Noticing that most TB cases occur in developing areas, we built an electronic device that was portable, affordable, and easy to use.

Bench to Bedside

Coming from bedside to bench, we set out to apply our bench achievements back to bedside. With consultation, survey and feedback from clinical practice, we are still working on improving our detection system!