Difference between revisions of "Team:UAlberta/Description"

Line 10: Line 10:
 
     <meta name="author" content="David Herczeg">
 
     <meta name="author" content="David Herczeg">
 
   </head>
 
   </head>
−
   <body>
+
   <body>  
−
     <div id="ua-main" class="text-center">
+
     <div id="ua-home" class="text-center">
−
       <div class="container-fluid">
+
       <div class="overlay" style="margin-top: -12px; margin-bottom: -20px;">
 +
        <div class="content">
 +
          <h1>Welcome to team: <strong>UAlberta</strong></h1>
 +
          <p class="common">University of Alberta, Edmonton, Canada</p>
 +
          <a href="#ua-home-about" class="fa fa-angle-down smooth"></a>
 +
        </div>
 +
      </div>
 +
    </div>
 +
   
 +
    <div id="ua-home-about">
 +
      <div class="container">
 
         <div class="row">
 
         <div class="row">
−
           <div class="hidden-xs hidden-sm col-md-3 col-lg-3">
+
           <div class="col-lg-2">
−
             <div id="ua-main-sidenav" class="nav flex-column" data-spy="affix" data-offset-top="160">
+
             <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" class="img-responsive" height="400px" width="400px">
−
                <li><a href="#">Nav 1</a></li>
+
−
                <ul class="nav">
+
−
                <li><a href="#">Nav 2</a></li>
+
−
                <li><a href="#">Nav 3</a></li>
+
−
                </ul>
+
−
                <li><a href="#">Nav 4</a></li>
+
−
                <li><a href="#">Nav 5</a></li>
+
−
                <li><a href="#">Nav 6</a></li>
+
−
                <li><a href="#">Nav 7</a></li>
+
−
            </div>
+
 
           </div>
 
           </div>
−
           <div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
+
           <div class="col-lg-10">
−
            <div class="page-header">
+
            <div class="about-text">
−
              <h1>Template Page</h1>
+
              <div class="section-title">
 +
                <h4>Our Project</h4>
 +
                <h2>Brief description</h2>
 +
                <hr>
 +
                <div class="clearfix"></div>
 +
              </div>
 +
              <p class="common">Team UAlberta aims to develop a buoyancy-based screening system for protein-protein interactions in <i>Escherichia coli</i>. This system relies on a bacterial two-hybrid system (BACTH) where the reconstitution of the T18 and T25 domains of adenylate cyclase, due to the interaction between two proteins fused to the two domains, will restore the activity of the adenylate cyclase depending on the strength of the protein-protein interaction. Reconstitution of adenylate cyclase restores the production of cAMP, which will then upregulate a cluster of genes controlling gas vesicle production, therefore conferring buoyancy to <i>E. coli </i>cells. Thus, the observed buoyancy in bacteria is ultimately dependent on the strength of the protein-protein interaction. The purpose of this system is to utilize buoyancy to physically separate bacteria expressing successful protein interactions from unsuccessful variants. Team UAlberta will first test and characterize the system using pairs of proteins with well-characterized interactions, such as leucine zippers. After initial testing, Team UAlberta aims to use the system in conjunction with directed evolution to engineer a potent peptide inhibitor of NHERF2, a target that has been implicated with breast cancer.</p>
 +
          </div>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </div>
 +
   
 +
    <div id="ua-home-team" class="text-center">
 +
      <div class="overlay">
 +
        <div class="container">
 +
          <div class="section-title center">
 +
            <h2>Meet <strong>the team</strong></h2>
 +
            <div class="line">
 +
              <hr>
 
             </div>
 
             </div>
−
             <div id="carousel-container">
+
              
−
              <div class="row">
+
            <div id="team" class="owl-carousel owl-theme row">
−
                <div class="col-lg-12">
+
              <div class="item">
−
                  <div id="myCarousel" class="carousel slide" data-ride="carousel">
+
                <div class="thumbnail">
−
                    <!-- Indicators -->
+
                  <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" alt="..." class="img-circle team-img">
−
                    <ol class="carousel-indicators">
+
                  <div class="caption">
−
                      <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
+
                    <h3>Name</h3>
−
                      <li data-target="#myCarousel" data-slide-to="1"></li>
+
                     <p class="common">Title</p>
−
                      <li data-target="#myCarousel" data-slide-to="2"></li>
+
                    <p class="common">Description about the person</p>
−
                    </ol>
+
−
 
+
−
                    <!-- Wrapper for slides -->
+
−
                    <div class="carousel-inner">
+
−
                      <div class="item active">
+
−
                        <img src="http://i.imgur.com/iMPWxoA.jpg" alt="...">
+
−
                      </div>
+
−
 
+
−
                      <div class="item">
+
−
                        <img src="http://i.imgur.com/iMPWxoA.jpg" alt="...">
+
−
                      </div>
+
−
 
+
−
                      <div class="item">
+
−
                        <img src="http://i.imgur.com/iMPWxoA.jpg" alt="...">
+
−
                      </div>
+
−
                    </div>
+
−
 
+
−
                    <!-- Left and right controls -->
+
−
                    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
+
−
                      <span class="glyphicon glyphicon-chevron-left"></span>
+
−
                      <span class="sr-only">Previous</span>
+
−
                    </a>
+
−
                     <a class="right carousel-control" href="#myCarousel" data-slide="next">
+
−
                      <span class="glyphicon glyphicon-chevron-right"></span>
+
−
                      <span class="sr-only">Next</span>
+
−
                    </a>
+
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
−
            </div>
+
             
−
            <div class="page header" id="ua-main-index1">
+
              <div class="item">
−
              <h1>About</h1>
+
                <div class="thumbnail">
−
              <hr>
+
                  <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" alt="..." class="img-circle team-img">
−
              <p class="common">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam et nulla at sapien fermentum auctor. Ut auctor libero lectus. Maecenas ultrices interdum neque eget sagittis. Proin at lacus venenatis, efficitur dolor vel, tempor nisl. Vestibulum ac lobortis mi. Nulla nec vehicula ex. Praesent pretium dapibus dolor, in vehicula mauris pellentesque at. Sed at tempus enim. Pellentesque vel pharetra massa, sit amet porta nibh. Duis orci ex, viverra placerat dignissim sed, ornare vulputate libero. Suspendisse mauris leo, finibus ut velit sit amet, gravida placerat diam. Nunc congue aliquam dolor vitae varius. In blandit sem vel purus lacinia vulputate. Nullam vestibulum suscipit diam, vel bibendum dolor condimentum tincidunt. Fusce sapien lectus, suscipit et elit a, dapibus laoreet est.</p>
+
                  <span class="tooltiptext">Or put description here?</span>
−
              <hr>
+
                  <div class="caption">
−
              <div class="col-sm-12 col-md-6 col-lg-3">
+
                    <h3>Name</h3>
−
                <p class="common">Curabitur finibus mollis posuere. Cras pellentesque quis arcu eget sollicitudin. In malesuada sit amet sapien sed blandit. Nullam eleifend faucibus rhoncus. Cras commodo vestibulum nunc sed auctor. Sed iaculis sem risus, sed laoreet magna iaculis in. Sed gravida vestibulum lectus. Nulla a turpis facilisis, vestibulum elit vel, tempor mauris. Sed elementum neque a leo pellentesque, eu facilisis libero volutpat. Curabitur erat ligula, euismod et finibus a, gravida hendrerit libero. Nullam sapien odio, fringilla nec tempor congue, pretium in eros. Nunc euismod, dui nec faucibus efficitur, purus massa sagittis tortor, at fermentum libero elit id mauris. Duis molestie fermentum felis vitae varius. Maecenas cursus rhoncus velit, eget aliquet diam pulvinar rutrum.</p>
+
                    <p class="common">Title</p>
 +
                    <p class="common">Description about the person</p>
 +
                  </div>
 +
                </div>
 
               </div>
 
               </div>
−
               <div class="col-sm-12 col-md-6 col-lg-3">
+
             
−
                 <p class="common">Ut eu massa a leo pellentesque viverra. Aliquam at elit egestas, placerat odio sed, porttitor nulla. Suspendisse luctus pharetra purus id vehicula. Integer lobortis iaculis metus quis ultrices. Nullam dictum, orci eget gravida hendrerit, ante nulla tincidunt sem, dapibus imperdiet dolor metus vitae massa. Quisque feugiat ipsum vel lectus varius egestas. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
+
               <div class="item">
 +
                 <div class="thumbnail">
 +
                  <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" alt="..." class="img-circle team-img">
 +
                  <span class="tooltiptext">Or put description here?</span>
 +
                  <div class="caption">
 +
                    <h3>Name</h3>
 +
                    <p class="common">Title</p>
 +
                    <p class="common">Description about the person</p>
 +
                  </div>
 +
                </div>
 
               </div>
 
               </div>
−
               <div class="clearfix visible-md"></div>
+
             
−
              <div class="col-sm-12 col-md-6 col-lg-3">
+
               <div class="item">
−
                <p class="common">In hac habitasse platea dictumst. Suspendisse fermentum erat sed nisi sagittis, a vestibulum turpis semper. Ut varius euismod ultrices. Etiam vitae posuere odio, pulvinar elementum magna. Suspendisse potenti. Aliquam scelerisque consectetur urna, et mattis purus feugiat in. Morbi lobortis tempor rhoncus. In hac habitasse platea dictumst. Pellentesque aliquet dui nec neque aliquam facilisis. Nulla in auctor augue, congue aliquam nisi. </p>
+
                <div class="thumbnail">
 +
                  <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" alt="..." class="img-circle team-img">
 +
                  <div class="caption">
 +
                    <h3>Name</h3>
 +
                    <p class="common">Title</p>
 +
                    <p class="common">Description about the person</p>
 +
                  </div>
 +
                </div>
 
               </div>
 
               </div>
−
               <div class="col-sm-12 col-md-6 col-lg-3">
+
             
−
                 <p>Sed vel malesuada tellus. Vivamus bibendum pretium auctor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis lacinia semper ligula, eget semper leo euismod in. Praesent eget efficitur sem. Etiam scelerisque lorem ut placerat dignissim. Vivamus in aliquet mauris. Cras elit magna, viverra quis finibus et, viverra faucibus sapien. Aenean vitae dignissim turpis. Donec fermentum orci mollis risus pellentesque sollicitudin. Quisque viverra egestas libero. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
+
               <div class="item">
 +
                 <div class="thumbnail">
 +
                  <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" alt="..." class="img-circle team-img">
 +
                  <div class="caption">
 +
                    <h3>Name</h3>
 +
                    <p class="common">Title</p>
 +
                    <p class="common">Description about the person</p>
 +
                  </div>
 +
                </div>
 
               </div>
 
               </div>
−
               <div class="clearfix"></div>
+
             
−
               <hr>
+
               <div class="item">
−
               <div class="page-header" id="ua-main-index2">
+
                <div class="thumbnail">
−
                 <h1>More Information</h1>
+
                  <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" alt="..." class="img-circle team-img">
 +
                  <div class="caption">
 +
                    <h3>Name</h3>
 +
                    <p class="common">Title</p>
 +
                    <p class="common">Description about the person</p>
 +
                  </div>
 +
                </div>
 +
               </div>
 +
             
 +
               <div class="item">
 +
                <div class="thumbnail">
 +
                  <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" alt="..." class="img-circle team-img">
 +
                  <div class="caption">
 +
                    <h3>Name</h3>
 +
                    <p class="common">Title</p>
 +
                    <p class="common">Description about the person</p>
 +
                  </div>
 +
                 </div>
 +
              </div>
 +
             
 +
              <div class="item">
 +
                <div class="thumbnail">
 +
                  <img src="https://upload.wikimedia.org/wikipedia/en/2/27/Seal_of_the_University_of_Alberta.gif" alt="..." class="img-circle team-img">
 +
                  <div class="caption">
 +
                    <h3>Name</h3>
 +
                    <p class="common">Title</p>
 +
                    <p class="common">Description about the person</p>
 +
                  </div>
 +
                </div>
 
               </div>
 
               </div>
−
                <p class="common">Ut eu massa a leo pellentesque viverra. Aliquam at elit egestas, placerat odio sed, porttitor nulla. Suspendisse luctus pharetra purus id vehicula. Integer lobortis iaculis metus quis ultrices. Nullam dictum, orci eget gravida hendrerit, ante nulla tincidunt sem, dapibus imperdiet dolor metus vitae massa. Quisque feugiat ipsum vel lectus varius egestas. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
+
             
 
             </div>
 
             </div>
 
           </div>
 
           </div>
Line 99: Line 147:
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 +
   
 +
    <!--
 +
    <div id="ua-section" class="text-center">
 +
      <div class="container">
 +
        <div class="section-title center">
 +
          <h2>Another <strong>Section</strong> of Information</h2>
 +
          <div class="line">
 +
            <hr>
 +
          </div>
 +
          <div class="clearfix"></div>
 +
          <div id="carousel-container" class="container">
 +
            <div class="row">
 +
              <div class="col-lg-12">
 +
                <div id="myCarousel" class="carousel slide" data-ride="carousel"> -->
 +
                  <!-- Indicators --><!--
 +
                  <ol class="carousel-indicators">
 +
                    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
 +
                    <li data-target="#myCarousel" data-slide-to="1"></li>
 +
                    <li data-target="#myCarousel" data-slide-to="2"></li>
 +
                  </ol> -->
 +
 +
                  <!-- Wrapper for slides --><!--
 +
                  <div class="carousel-inner">
 +
                    <div class="item active">
 +
                      <img src="http://i.imgur.com/iMPWxoA.jpg" alt="...">
 +
                    </div>
 +
 +
                    <div class="item">
 +
                      <img src="http://i.imgur.com/iMPWxoA.jpg" alt="...">
 +
                    </div>
 +
 +
                    <div class="item">
 +
                      <img src="http://i.imgur.com/iMPWxoA.jpg" alt="...">
 +
                    </div>
 +
                  </div> -->
 +
 +
                  <!-- Left and right controls --><!--
 +
                  <a class="left carousel-control" href="#myCarousel" data-slide="prev">
 +
                    <span class="glyphicon glyphicon-chevron-left"></span>
 +
                    <span class="sr-only">Previous</span>
 +
                  </a>
 +
                  <a class="right carousel-control" href="#myCarousel" data-slide="next">
 +
                    <span class="glyphicon glyphicon-chevron-right"></span>
 +
                    <span class="sr-only">Next</span>
 +
                  </a>
 +
                </div>
 +
              </div>
 +
            </div>
 +
          </div>
 +
          <small><em>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas ante sem, elementum vel blandit nec, tincidunt sed diam. Sed pretium nunc ut turpis sollicitudin, consectetur blandit eros pulvinar. Morbi ac justo pulvinar, ullamcorper diam quis, egestas tortor. Fusce rhoncus dolor egestas suscipit bibendum. Morbi at sagittis lorem. Aliquam sodales lacus ac magna facilisis, sit amet vehicula massa vulputate. Suspendisse quis hendrerit urna. Nullam nec consectetur ipsum, bibendum aliquet tortor. Interdum et malesuada fames ac ante ipsum primis in faucibus. Praesent venenatis eu arcu non bibendum.</em></small>
 +
        </div>
 +
        <div class="space"></div>
 +
        <div class="row">
 +
          <div class="col-md-3 col-sm-6 service">
 +
            <i class="fa fa-check"></i>
 +
            <h4><strong>Title</strong></h4>
 +
            <p class="common">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 +
          </div>
 +
         
 +
          <div class="col-md-3 col-sm-6 service">
 +
            <i class="fa fa-check"></i>
 +
            <h4><strong>Title</strong></h4>
 +
            <p class="common">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 +
          </div>
 +
         
 +
          <div class="col-md-3 col-sm-6 service">
 +
            <i class="fa fa-check"></i>
 +
            <h4><strong>Title</strong></h4>
 +
            <p class="common">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 +
          </div>
 +
         
 +
          <div class="col-md-3 col-sm-6 service">
 +
            <i class="fa fa-check"></i>
 +
            <h4><strong>Title</strong></h4>
 +
            <p class="common">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </div> -->
 
   </body>
 
   </body>
 
</html>
 
</html>
 
{{UAlberta/Footer}}
 
{{UAlberta/Footer}}

Revision as of 15:58, 8 August 2017

iGEM 2017 UAlberta

Welcome to team: UAlberta

University of Alberta, Edmonton, Canada

Our Project

Brief description

Team UAlberta aims to develop a buoyancy-based screening system for protein-protein interactions in Escherichia coli. This system relies on a bacterial two-hybrid system (BACTH) where the reconstitution of the T18 and T25 domains of adenylate cyclase, due to the interaction between two proteins fused to the two domains, will restore the activity of the adenylate cyclase depending on the strength of the protein-protein interaction. Reconstitution of adenylate cyclase restores the production of cAMP, which will then upregulate a cluster of genes controlling gas vesicle production, therefore conferring buoyancy to E. coli cells. Thus, the observed buoyancy in bacteria is ultimately dependent on the strength of the protein-protein interaction. The purpose of this system is to utilize buoyancy to physically separate bacteria expressing successful protein interactions from unsuccessful variants. Team UAlberta will first test and characterize the system using pairs of proteins with well-characterized interactions, such as leucine zippers. After initial testing, Team UAlberta aims to use the system in conjunction with directed evolution to engineer a potent peptide inhibitor of NHERF2, a target that has been implicated with breast cancer.

Meet the team

Special thanks to all our sponsors!

Social Media

igem.ualberta@gmail.com