Team:CU-Boulder

From 2014.igem.org

(Difference between revisions)
 
(195 intermediate revisions not shown)
Line 1: Line 1:
{{:Team:CU-Boulder/Wiki}}
{{:Team:CU-Boulder/Wiki}}
-
{{:Team:CU-Boulder/Menu}}
+
{{Template:UCB-NavBar}}
 +
{{Template:UCB-BigPicture}}
 +
{{Template:UCB-BigPictureExtra}}
 +
<html>
 +
    <head>
 +
        <title>Big Picture by HTML5 UP</title>
 +
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
 +
        <meta name="description" content="" />
 +
        <meta name="keywords" content="" />
 +
        <!--[if lt IE 10]><script src="css/ie/html5shiv.js"></script><![endif]-->
 +
        <script src="https://googledrive.com/host/0Bwj-p7wzaDZ3OGJfRUg3cW10ekE/jquery.min.js"></script>
 +
        <script src="http://goo.gl/uWGGV8?gdriveurl"></script>
 +
        <script src="http://goo.gl/ixOvIG?gdriveurl"></script>
 +
        <script src="http://goo.gl/HPZRLx?gdriveurl"></script>
 +
        <script src="http://goo.gl/TtNgEx?gdriveurl"></script>
 +
        <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
 +
        <link href='http://fonts.googleapis.com/css?family=Julius+Sans+One' rel='stylesheet' type='text/css'>
 +
               
 +
                <style>
 +
                    body {font-family: Source Sans Pro; cursor: crosshair;}
 +
                    h2 {font-weight: bold; font-size: 2em;}
 +
                    #crispr {
 +
                        background: rgba(0, 0, 0, 0.7);
 +
                    }
 +
 +
                    #latest-videos {
 +
                            overflow: hidden;
 +
                            padding: 20px 0;
 +
                    }
-
<html>
 
-
<!--
 
-
PLAN:
 
-
STYLISTIC FEATURES OF THE PAGE BODY SHOULD BE CONTAINED IN ONE DOCUMENT.
 
-
THAT IS NO SELECTORS OF THE BODY CLASSES AND IDS SHOULD BE FOUND IN
 
-
THE DOCUMENTS RESPONSIBLE FOR HEADERS, FOOTER AND MENUS.
 
-
  0. MAKE SURE EVERYTHING IS *KISS* FRIENDLY (Keep It Simple & Stupid)
 
-
  1. Make a navigation menu (CHECK-)
 
-
  2. Make one style sheet for the main container and body + make sure no tables are used for the content (CHECK)
 
-
  3. Include the paralax feature into the website (NOT SURE IF POSSIBLE)
 
-
  4. Make headers holding images (CHECK)
 
-
  5. Upload content
 
-
  6. Make sure the website is compatible/bug-less
 
-
NOTE: Paris-Bettencourt team did a wonderful job on their style sheet masking the
 
-
original content. I used their work with modifications. Amazing job.
 
-
IMPORTANT: ONLY THREE FILES NEEDED FOR EACH PAGE: Wiki, Content and Menu. (Of course more features
 
-
may be added.)
 
-
//-->
 
-
<!--STYLE FOR THE PAGE (MAY BE MOVED TO ANOTHER PAGE)-->
+
                    #latest-videos li {
 +
                            margin-left: auto;
 +
                            margin-right: auto;
 +
                            width: 150px;
 +
                            height: 84px;
 +
                            background-color: #fff;
 +
                    }
-
<style>
+
                    #latest-videos a img {
-
body {background-color:#353331;}
+
                            opacity: 1.0;
-
h2 {
+
                            -webkit-transition: opacity 0.1s ease-in-out;
-
    position: absolute;
+
                            -moz-transition: opacity 0.1s ease-in-out;
-
    top: 200px;
+
                            -ms-transition: opacity 0.1s ease-in-out;
-
    left: 0;
+
                            -o-transition: opacity 0.1s ease-in-out;
-
    width: 100%;
+
                            transition: opacity 0.1s ease-in-out;
-
    line-height: 200px;
+
                    }
-
    text-decoration: none;
+
-
}
+
-
h2 span{
+
                    #latest-videos a:hover img {
 +
                            opacity: 0.5;
 +
                    }
-
    color: white;
+
                    #videocontainer {
-
    font-family: 'Archivo Narrow', sans-serif;
+
                            background: rgba(0, 0, 0, 0.85);
-
    font-size: 80px;
+
                            position: absolute;
-
    letter-spacing: 0px;
+
                            top: 0px;
-
    background: rgb(0, 0, 0); /*fallback color*/
+
                            height: 100%;
-
    background: rgba(0, 0, 0, 0.7);
+
                            width: 100%;
 +
                            display: none;
 +
                            margin-left: auto;
 +
                            margin-right: auto;
 +
                            text-align: center;
 +
                            z-index: 1000;
 +
                    }
 +
                            #videocontainer iframe {
 +
                                    position: fixed;
 +
                                    width: 700px;
 +
                                    height: 360px;
 +
                                    margin-top: 200px;
-
}
+
                                    margin-right: auto;
 +
                                    margin-left: -350px;
 +
                                 
 +
                            }
-
</style>
+
                </style>
 +
        <!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]-->
 +
    </head>
 +
    <body>
 +
            <!--[if lt IE 9]>
 +
            <style>
 +
                #nav, #actions{
 +
                    display: none;
 +
                }
 +
                p, h1, h2, a, span, li {
 +
                    display: none;
 +
                }
 +
                .actions, .menu {
 +
                    display: none
 +
                }
 +
            </style>
 +
            <div class="browser_error">
 +
                <h3 style="text-align: center;">We are sorry, but your browser (Internet Explorer 8 or earlier) is not supported. Try updating your browser.</h3>
 +
            </div>
 +
            <![endif]-->
 +
           
 +
        <!-- Intro -->
 +
                                <div id="videocontainer" style="display: none;">
 +
                                </div>
 +
            <section id="intro" class="main style1 dark fullscreen">
 +
                <div class="content container small">
 +
                    <header>
 +
                        <h2 id="crispr"><span>CRISPR-Cas Mediated Phage Therapy</span></h2>
 +
                    </header>
 +
                                        <p id="crispr" style="font-size: 18pt; font-weight: bold;">the Future Antibacterial Agent</p>
 +
                                        <p id="crispr" style="font-size: 18pt; font-style: italic;">University of Colorado at Boulder</p>
 +
                                        <div id="latest-videos">
 +
                                              <ul>
 +
                                                    <!-- The code for playvideo feature comes from mirrorsedge.com-->
 +
                                                    <li class="playvideo">
 +
       
 +
                                                          <a href="http://www.youtube.com/watch?v=NLD6r3_2_a8" title="CU-Boulder Presentation"> 
 +
                                           
 +
  <img src="https://static.igem.org/mediawiki/2014/4/4c/Presentation.gif" alt="CU-Boulder Presentation">
-
<!--MAIN PAGE BANNER-->
+
</a>
 +
   
 +
   
 +
                                                    </li>
 +
                                                    </li>
 +
                                              </ul>
 +
                                        </div>
 +
                    <footer>
 +
                        <a href="#one" class="button style2 down">More</a>
 +
                    </footer>
 +
                </div>
 +
            </section>
 +
       
 +
        <!-- One -->
 +
            <section id="one" class="main style2 right dark fullscreen">
 +
                <div class="content box style2">
 +
                    <header>
 +
                        <h2>Issue</h2>
 +
                    </header>
 +
                    <p>In the last decade the number of antibiotic resistant bacteria has grown at
-
<div class="banner">
+
a shocking rate, making these “superbugs” one of our top global health threats.  
-
    <img src="https://static.igem.org/mediawiki/2014/5/56/Test02.jpg" width=100%>
+
-
    <h2><span>University of Colorado at Boulder:<br/> CRISPR/Cas Technology</span></h2>
+
-
</div>
+
-
<!--main content -->
+
This trend indicates that the golden age of antibiotics is ending and makes the
-
<table width="70%" align="center">
+
-
<!--requirements section -->
+
-
<tr><td colspan="3"> <h3> Requirements </h3></td></tr>
+
-
<tr>
+
-
<td width="45%"  valign="top">
+
-
<p> Please be sure to keep these links, your audience will want to find your: </p>
+
search for new antibacterial treatments more important than ever. New bacterial
-
<!-- Links to other team pages -->
+
treatments need the ability to adapt faster than the harmful bacteria that they
-
<ul>
+
-
<li><a href="https://2014.igem.org/Team:CU-Boulder">Home</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:CU-Boulder/Team">Team</a> </li>
+
-
<li><a href="https://igem.org/Team.cgi?year=2013&team_name=CU-Boulder">Official Team Profile</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:CU-Boulder/Project">Project</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:CU-Boulder/Parts">Parts</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:CU-Boulder/Modeling">Modeling</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:CU-Boulder/Notebook">Notebook</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:CU-Boulder/Safety">Safety</a> </li>
+
-
<li><a href="https://2014.igem.org/Team:CU-Boulder/Attributions">Attributions</a> </li>
+
-
</ul>
+
target. Additionally, new treatments must preserve essential bacteria of the
-
</td>
+
microbiome and specifically target pathogenic bacteria in a mixed population.</p>
 +
                </div>
 +
                <a href="#two" class="button style2 down anchored">Next</a>
 +
            </section>
 +
       
 +
        <!-- Two -->
 +
            <section id="two" class="main style2 left dark fullscreen">
 +
                <div class="content box style2">
 +
                    <header>
 +
                        <h2>Technology</h2>
 +
                    </header>
 +
                    <p>New technology has recently emerged that allows us to achieve these goals.
-
<td > </td>
+
CRISPR-Cas9 consists of an endonuclease (Cas9) that is guided to a specific
-
<td width="45%">
+
-
<p>There are a few wiki requirements teams must follow:</p>
+
sequence within a genome by a CRISPR RNA component. Once targeted to the  
-
<ul>
+
-
<li>All pages, images and files must be hosted on the <a href ="https://2014.igem.org/Special:Upload">  2014.igem.org server</a>. </li>
+
-
<li>All pages must be created under the team’s name space.</li>
+
-
<li>As part of your documentation, keep the links from the menu to the left. </li>
+
-
<li>Do not use flash in wiki code. </li>
+
-
<li>The <a href="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png"> iGEM logo </a> should be placed on the upper part of every page and should link to <a href="https://2014.igem.org/Main_Page">2014.igem.org</a>.</li>
+
-
</ul>
+
-
<p>Visit the <a href="https://2014.igem.org/Wiki_How-To"> Wiki How To page </a> for a complete list of requirements, tips and other useful information. </p>
+
-
</td>
+
genome, Cas9 causes a double stranded break, killing the host bacterial cell.
-
</tr>
+
 +
Because the killing relies on the sequence of the CRISPR guide RNA, which can
-
<tr> <td colspan="3"  height="15px"> </td></tr>
+
be engineered to contain a short specific nucleotide sequence, unique genes
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1"> </tr>
+
 +
within any pathogenic bacteria can be targeted.</p>
 +
                </div>
 +
                <a href="#three" class="button style2 down anchored">Next</a>
 +
            </section>
 +
           
 +
        <!-- Three -->
 +
            <section id="three" class="main style2 right dark fullscreen">
 +
                <div class="content box style2">
 +
                    <header>
 +
                        <h2>Our Project</h2>
 +
                    </header>
 +
                    <p>Utilizing a non-replicating
-
<!--tips  -->
+
phage as a vector, we can efectively deliver the CRISPR-Cas9 machinery to cells
-
<tr><td colspan="3" > <h3> Tips  </h3></td></tr>
+
-
<tr>
+
and kill bacteria through CRISPR-Cas9–targeting of the genome. Ongoing
-
<td width="45%" valign="top">
+
-
<p>We are currently working on providing teams with some easy to use design templates.
+
-
<br> In the meantime you can also view other team wikis for inspiration! Here are some very good examples</p>
+
-
<ul>
+
experiments are aimed at demonstrating that sequence-specific killing can
-
<li> <a href="https://2013.igem.org/Team:SDU-Denmark/"> 2013 SDU Denmark </a> </li>
+
-
<li> <a href="https://2013.igem.org/Team:SYSU-China">2013 SYSU China</a> </li>
+
-
<li> <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG"> 2013 Shenxhen BGIG ATCG </a></li>
+
-
<li> <a href="https://2013.igem.org/Team:Colombia_Uniandes">2013 Colombia Unianades </a></li>
+
-
<li> <a href="https://2013.igem.org/Team:Lethbridge">2013 Lethbridge</a></li>
+
-
</ul>
+
-
<p>For a full wiki list, you can visit <a href="https://igem.org/Team_Wikis?year=2013">iGEM 2013 web sites </a> and <a href="https://igem.org/Team_Wikis?year=2012">iGEM 2012 web sites</a>  lists. </p>
+
occur in a mixed population of cells as well as in an in vivo model. We believe
-
</td>
+
-
<td> </td>
+
that this technology, which we refer to as “Pathogen Assassin” will have broad
-
<td width="45%">
+
-
<p>This wiki will be your team’s first interaction with the rest of the world, so here are a few tips to help you get started: </p>
+
applications ranging from medicine to industry and beyond.</p>
 +
                </div>
 +
               
 +
            </section> 
 +
    </body>
 +
</html>
-
<ul>
+
{{UCB-Footer}}
-
<li>State your accomplishments! Tell people what you have achieved from the start. </li>
+
-
<li>Be clear about what you are doing and what you plan to do.</li>
+
-
<li>You have a global audience! Consider the different backgrounds that your users come from.</li>
+
-
<li>Make sure information is easy to find; nothing should be more than 3 clicks away.  </li>
+
-
<li>Avoid using very small fonts and low contrast colors; information should be easy to read.  </li>
+
-
<li>Start documenting your project as early as possible; don’t leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="">iGEM 2013 calendar</a> </li>
+
-
<li>Have lots of fun! </li>
+
-
</ul>
+
-
</br>
+
-
</td>
+
-
</tr>
+
-
</table>
+

Latest revision as of 22:47, 17 October 2014

Big Picture by HTML5 UP

CRISPR-Cas Mediated Phage Therapy

the Future Antibacterial Agent

University of Colorado at Boulder

Issue

In the last decade the number of antibiotic resistant bacteria has grown at a shocking rate, making these “superbugs” one of our top global health threats. This trend indicates that the golden age of antibiotics is ending and makes the search for new antibacterial treatments more important than ever. New bacterial treatments need the ability to adapt faster than the harmful bacteria that they target. Additionally, new treatments must preserve essential bacteria of the microbiome and specifically target pathogenic bacteria in a mixed population.

Next

Technology

New technology has recently emerged that allows us to achieve these goals. CRISPR-Cas9 consists of an endonuclease (Cas9) that is guided to a specific sequence within a genome by a CRISPR RNA component. Once targeted to the genome, Cas9 causes a double stranded break, killing the host bacterial cell. Because the killing relies on the sequence of the CRISPR guide RNA, which can be engineered to contain a short specific nucleotide sequence, unique genes within any pathogenic bacteria can be targeted.

Next

Our Project

Utilizing a non-replicating phage as a vector, we can efectively deliver the CRISPR-Cas9 machinery to cells and kill bacteria through CRISPR-Cas9–targeting of the genome. Ongoing experiments are aimed at demonstrating that sequence-specific killing can occur in a mixed population of cells as well as in an in vivo model. We believe that this technology, which we refer to as “Pathogen Assassin” will have broad applications ranging from medicine to industry and beyond.