Team:Harvard BioDesign

From 2014.igem.org

(Difference between revisions)
 
(57 intermediate revisions not shown)
Line 1: Line 1:
-
<!--{{CSS/Main}}-->
+
{{CSS/Main}}
-
{{Team:Harvard_BioDesign/CSS}}
+
-
 
+
<html>
<html>
-
<body>
+
 
-
<!--header-->
+
<!--main content -->
-
<header>
+
<table width="80%" align="center">
-
    <div class="follow-box">
+
 
-
        <div class="container">  
+
<!--welcome box -->
-
            <ul class="address_icon">
+
<tr>
-
                <li></li>
+
 
-
              <li>Do we want our email here?<img src="img/page1_icon2.png" alt=""></li>
+
 
-
                <li></li>
+
 
-
            </ul>
+
 
-
            <ul class="follow_icon">
+
 
-
              <li><a href="https://www.facebook.com/pages/Harvard-iGEM/269794024286"><img src="img/follow_icon1.png" alt=""></a></li>
+
<br>
-
                <li></li>
+
 
-
          </ul>
+
</tr>
-
      Banner HERE</div>
+
 
-
    </div>
+
<body></body>
-
    <div id="stuck_container">
+
 
-
        <div class="menuBox">
+
<body background= white;>
-
            <div class="container">  
+
<tr> <td colspan="3" height="5px"> </td></tr>
-
                <h1 class="navbar-brand navbar-brand_"><a href="index.html">LOGO HERE<span>company name</span></a></h1>
+
<!-- end welcome box -->
-
                <nav class="navbar navbar-default navbar-static-top tm_navbar clearfix" role="navigation">
+
<tr>  
-
                    <ul class="nav sf-menu clearfix">
+
 
-
                        <li class="active"><a href="https://2014.igem.org/Team:Harvard_BioDesign">Home</a></li>
+
<div align= "center">
-
                        <li><a href="https://2014.igem.org/Team:Harvard_BioDesign/Team">Team</a> </li>
+
<a href="https://2014.igem.org/Team:Harvard_BioDesign"><img src= "https://static.igem.org/mediawiki/2014/6/66/HarvardBioDesignLogo.jpg" width= "240px" height="200px"/></a>
-
                        <li class="sub-menu"><a href="https://igem.org/Team.cgi?year=2013&team_name=Harvard_BioDesign">Official Team Profile</a><span></span>
+
-
                            <ul class="submenu">
+
-
                <li><a href="#">history</a></li>
+
-
                <li><a href="#">news</a><span></span>
+
-
                                    <ul class="submenu">
+
-
                                        <li><a href="#">latest</a></li>
+
-
                                        <li><a href="#">archive</a></li>
+
-
                                      </ul>
+
-
                                </li>
+
-
                <li><a href="#">testimonials</a></li>
+
-
                </ul>
+
-
                        </li>
+
-
<li><a href="https://2014.igem.org/Team:Harvard_BioDesign/Project">Project</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:Harvard_BioDesign/Parts">Parts</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:Harvard_BioDesign/Modeling">Modeling</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:Harvard_BioDesign/Notebook">Notebook</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:Harvard_BioDesign/Safety">Safety</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:Harvard_BioDesign/Attributions">Attributions</a> </li>
+
-
                    </ul>
+
-
                </nav>
+
-
            </div>
+
-
        </div>
+
-
    </div>
+
-
</header>
+
-
<div class="slider">
+
-
    <div class="camera_wrap">
+
-
        <div data-src="img/PAST_JG.png" style="max-height: 100px; max-width:100 px"><div class="camera-caption fadeIn"><p class="title">Applied<br>Bio-sensors</p><a href="#" class="btn-default btn1">view info</a></div></div>
+
-
        <div data-src="img/PRESENT_JG.png" data-media="(max-width: 640px)"><div class="camera-caption fadeIn"><p class="title">Information<br>Storage</p></div></div>
+
-
        <div data-src="img/FUTURE_JG.png" data-media="(max-width: 640px)"><div class="camera-caption fadeIn"><p class="title">Biological<br>Sesning</p></div></div>
+
-
    </div>
+
</div>
</div>
-
<div class="global">
+
 
-
    <div class="center-box">
+
<!--navigation menu -->
-
        <div class="container">
+
 
-
            <div class="row">
+
 
-
                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
+
<td align="center" colspan="3">
-
                    <figure><img src="img/PAST_JG.png" width="300" height="223" alt="What has been done in the past"></figure>
+
 
-
                    <p class="title">PAST</p>
+
<table  width="100%">
-
                    <p>odio dignissimos ducimus qui blan <br>ditiis praesentium voluptatum <br>deleniti atque corrupti.</p>
+
<tr height="15px"></tr>
-
                    <a href="#" class="btn-default btn2">more</a>
+
<tr height="75px">  
-
                </div>
+
 
-
                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
+
 
-
                    <figure><img src="img/PRESENT_JG.png" width="300" height="223" alt="What our project entails"></figure>
+
<td style="border:1px solid crimson;" align="center" width = "60px" height ="45px" onMouseOver="this.bgColor=color:#660000" onMouseOut="this.bgColor=color:#660000" bgColor=color:#660000>
-
                    <p align="center" class="title">PRESENT</p>
+
<a href="https://2014.igem.org/Team:Harvard_BioDesign"style="color:#000000">Home </a> </td>
-
                  <p>odio dignissimos ducimus qui blan <br>ditiis praesentium voluptatum <br>deleniti atque corrupti.</p>
+
 
-
                    <a href="#" class="btn-default btn2">more</a>
+
<td style="border:1px solid crimson;" align="center" width = "60px" height ="45px" onMouseOver="this.bgColor=color:#660000'" onMouseOut="this.bgColor=color:#660000" bgColor=color:#660000>  
-
                </div>
+
<a href="https://2014.igem.org/Team:Harvard_BioDesign/Team"style="color:#000000"> Team </a> </td>
-
                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
+
 
-
                    <figure><img src="img/FUTURE_JG.png" width="300" height="223" alt="Where we hope our project is heading"></figure>
+
<td style="border:1px solid crimson" align="center" width = "60px" height ="45px" onMouseOver="this.bgColor=color:#660000'" onMouseOut="this.bgColor=color:#660000'" bgColor=color:#660000>
-
                    <p class="title">FUTURE</p>
+
<a href="https://2014.igem.org/Team:Harvard_BioDesign/Project"style="color:#000000"> Project</a></td>
-
                    <p>odio dignissimos ducimus qui blan <br>ditiis praesentium voluptatum <br>deleniti atque corrupti.</p>
+
 
-
                    <a href="#" class="btn-default btn2">more</a>
+
<td style="border:1px solid crimson;" align="center" height ="45px" onMouseOver="this.bgColor=color:#660000'" onMouseOut="this.bgColor=color:#660000'" bgColor=color:#660000>  
-
                </div>
+
<a href="https://2014.igem.org/Team:Harvard_BioDesign/Parts"style="color:#000000"> Parts</a></td>
-
            </div>
+
 
-
        </div>
+
<td style="border:1px solid crimson;" align="center" height ="45px" onMouseOver="this.bgColor=color:#660000'" onMouseOut="this.bgColor=color:#660000'" bgColor=color:#660000>
-
    </div>
+
<a href="https://2014.igem.org/Team:Harvard_BioDesign/Notebook"style="color:#000000"> Notebook</a></td>
-
    <div class="welcome-box">
+
 
-
        <div class="container">
+
<td style="border:1px solid crimson;" align="center" height ="45px" onMouseOver="this.bgColor=color:#660000'" onMouseOut="this.bgColor=color:#660000'" bgColor=color:#660000>  
-
            <div class="row">
+
<a href="https://2014.igem.org/Team:Harvard_BioDesign/Safety"style=" color:#000000"> Safety </a></td>
-
                <div class="col-lg-7 col-md-7 col-sm-12 pull-right">
+
 
-
                    <figure>SPLASH SCREEN PICTURE</figure>
+
<td style="border:1px solid crimson;" align="center" height ="45px" onMouseOver="this.bgColor=color:#660000'" onMouseOut="this.bgColor=color:#660000" bgColor=color:#660000>  
-
                </div>
+
<a href="https://2014.igem.org/Team:Harvard_BioDesign/Attributions"style="color:#000000"> Attributions </a></td>
-
                <div class="col-lg-5 col-md-5 col-sm-12 pull-left">
+
 
-
                    <p class="title">Welcome Visitor!</p>
+
<td align ="center"> <a href="https://2014.igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a> </td>
-
                    <h4>BROAD OVERVIEW OF OUR PROJECT</h4>
+
</tr>
-
                    <a href="#" class="btn-default btn3">more info</a>
+
 
-
                </div>
+
 
-
            </div>
+
 
-
        </div>
+
 
-
    </div>
+
<!--end navigation menu -->
-
<div class="container">
+
</tr>
-
        <div class="col-lg-12">
+
 
-
            <h2>IMPORTANT LINKS WE WANT TO HIGHLIGHT</h2>
+
 
-
            <div class="row">
+
</tr>
-
                <div class="col-lg-4 col-md-4 col-sm-4">
+
-
                    <div class="thumb-pad0">
+
 
-
                        <div class="thumbnail">
+
 
-
                            <figure>IMAGE HERE</figure>
+
 
-
                            <div class="caption">
+
 
-
                                <p class="title">PROJECT OVERVIEW</p>
+
</td>
-
                                <p>IN OUR PPROJECT...</p>
+
 
-
                                <a href="#" class="btn-default btn4">more <span></span></a>
+
<tr> <td colspan="3" height="15px"> </td></tr>
-
                            </div>
+
<tr><td bgColor=yellow  colspan="3" height="1px"> </tr>
-
                        </div>
+
<tr> <td colspan="3" height="5px"> </td></tr>
-
                    </div>
+
 
-
                </div>
+
 
-
                <div class="col-lg-4 col-md-4 col-sm-4">
+
<!--requirements section -->
-
                    <div class="thumb-pad0">
+
<tr><td colspan="3" width = "30%"> <h3> Currently </h3></td><td colspan="3" width = "30%"> <h3> Our System </h3></td><td colspan="3" width = "30%"> <h3> Our Vision </h3></td></tr>
-
                        <div class="thumbnail">
+
<tr>
-
                            <figure><img src="img/page1_badge2.png" alt=""></figure>
+
<td colspan="3" width="30%"  valign="top">  
-
                            <div class="caption">
+
Natural cellular mechanisms are co-opted by synthetic biologists for use in biological sensors. Typical reporters such as GFP are only detectable inside living cells and used to gather information in the laboratory environment.
-
                                <p class="title">HUMAN PRACTICES</p>
+
<br/>
-
                                <p>HERE IS WHAT WE DID TO BE SAFE</p>
+
<br/>
-
                                <a href="#" class="btn-default btn4">more <span></span></a>
+
<br/>
-
                            </div>
+
<br/>
-
                        </div>
+
<img src = "https://static.igem.org/mediawiki/2014/6/6a/Past.jpg" width =100% height =350px/>
-
                    </div>
+
 
-
                </div>
+
</td>
-
                <div class="col-lg-4 col-md-4 col-sm-4">
+
<td colspan="3"width="30%"  valign="top">  
-
                    <div class="thumb-pad0">
+
Our system encodes sensing information into the amyloid protein curli within bacterial biofilms. Unlike common reporter proteins, curli fibers are highly resistant to degradation and can survive extreme pH and temperature changes extracellularly. Applying chromoproteins engineered to bind specifically to corresponding curli units, information is easily displayed.
-
                        <div class="thumbnail">
+
<br/>
-
                            <figure><img src="img/page1_badge3.png" alt=""></figure>
+
<br/>
-
                            <div class="caption">
+
<img src = "https://static.igem.org/mediawiki/2014/5/55/Idea.jpg" width =100% height = 350px/>
-
                                <p class="title">TEAM MEMBERS</p>
+
</td>
-
                                <p>MEET OUR AMAZING TEAM...</p>
+
<td colspan="3"width="30%" valign="top">  
-
                                <a href="#" class="btn-default btn4">more <span></span></a>
+
Biological sensing can be applied outside of the laboratory settings with information that is robust and can be easily read in a biomaterial with functional potential.
-
                            </div>
+
<br/>
-
                        </div>
+
<br/>
-
                    </div>
+
<br/>
-
                </div>
+
<br/>
-
            </div>
+
<br/>
-
        </div>
+
<img src = "https://static.igem.org/mediawiki/2014/5/5b/Future.jpg" width =100% height =350px/>
-
    </div>
+
</td>
-
    <div class="map-box">
+
</tr>
-
        <figure><img src="img/page1_icon1.png" alt=""><p>Domestic</p></figure>
+
 
-
    </div>
+
<td> </td>
-
    <div class="container">
+
</table>
-
        <div class="row">
+
-
            <div class="col-lg-12 tools-box">
+
-
                <div class="row">
+
-
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
+
-
                        <div class="maxheight">
+
-
                            <h3>Telephone</h3>
+
-
                            <p>&nbsp;</p>
+
-
                        </div>
+
-
                    </div>
+
-
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
+
-
                        <div class="maxheight">
+
-
                            <h3>E-Mail Us</h3>
+
-
                            <p>&nbsp;</p>
+
-
                        </div>
+
-
                    </div>
+
-
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
+
-
                        <div class="maxheight">
+
-
                            <h3>Follow Us</h3>
+
-
                            <ul class="follow_icon indent">
+
-
                                <li><a href="https://www.facebook.com/pages/Harvard-iGEM/269794024286"><img src="img/follow_icon6.png" alt=""></a></li>
+
-
                            </ul>
+
-
                        </div>
+
-
                    </div>
+
-
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
+
-
                        <div class="indent maxheight">
+
-
                            <h3>Address</h3>
+
-
                            <p>&nbsp;</p>
+
-
                        </div>
+
-
                    </div>
+
-
                </div>
+
-
            </div>
+
-
        </div>
+
-
    </div>
+
-
</div>
+
-
<!--footer-->
+
-
<footer>
+
-
    <div class="container">
+
-
        <div class="row">
+
-
            <div class="col-lg-12">
+
-
                <p><span>copyright</span> &copy; <em id="copyright-year"></em> <a href="index-5.html">Privacy policy</a></p>
+
-
            </div>
+
-
        </div>
+
-
    </div>
+
-
  <!-- {%FOOTER_LINK} -->
+
-
</footer>
+
-
</body>
+
</html>
</html>

Latest revision as of 01:43, 18 October 2014


Home Team Project Parts Notebook Safety Attributions

Currently

Our System

Our Vision

Natural cellular mechanisms are co-opted by synthetic biologists for use in biological sensors. Typical reporters such as GFP are only detectable inside living cells and used to gather information in the laboratory environment.



Our system encodes sensing information into the amyloid protein curli within bacterial biofilms. Unlike common reporter proteins, curli fibers are highly resistant to degradation and can survive extreme pH and temperature changes extracellularly. Applying chromoproteins engineered to bind specifically to corresponding curli units, information is easily displayed.

Biological sensing can be applied outside of the laboratory settings with information that is robust and can be easily read in a biomaterial with functional potential.