Team:CityU HK

From 2014.igem.org

(Difference between revisions)
 
(189 intermediate revisions not shown)
Line 1: Line 1:
-
<!DOCTYPE html>
+
{{:Team:CityU_HK/Template}}
 +
<html>
<html lang="en">
<html lang="en">
-
  <head>
 
-
    <meta charset="utf-8">
 
-
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
-
    <meta name="viewport" content="width=device-width, initial-scale=1">
 
-
    <title>Verona homepage</title>
 
-
    <!-- Bootstrap -->
+
<link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
-
    <link href="css/bootstrap.min.css" rel="stylesheet">
+
<style>
<style>
-
.col-md-12 {
+
/*.carousel-inner {
-
background:#369de1;
+
-webkit-box-shadow: 0 8px 6px -6px black;
 +
-moz-box-shadow: 0 8px 6px -6px black;
 +
box-shadow: 0 8px 6px -6px black;*/
}
}
-
.row{
+
 
-
margin:20px;
+
.carousel-inner .carousel-caption {
 +
padding-top: 100px;
 +
padding-bottom: 100px;
 +
     
}
}
-
.nav {
+
 
-
background: #666666;
+
.btn-custom {
-
}
+
padding: 9px 30px 9px 30px;
-
.nav li {
+
font-family: 'Quattrocento Sans', sans-serif;
-
list-style-type: none;
+
-
float: left;
+
font-size: 20px;
font-size: 20px;
 +
        border-bottom: 4px solid #36ae88;
 +
        color: #fff;
 +
        background: #4eecba;
 +
        font-weight: bold;
 +
        margin: 0 20px 40px 20px;
}
}
-
.nav li a {
+
 
-
color: white;
+
.btn-custom:hover {
-
text-decoration: none;
+
color: #fff;
-
padding: 6px 20px;
+
        background-color: orange;
-
margin: 0;
+
        border-bottom: 4px solid #EC8318;
-
}
+
-
.nav a:hover {
+
-
color:#FFD700;
+
}
}
-
.dropdown-menu li a {
+
 
-
color: black;
+
.btn-custom:visited {
-
}
+
-
ul.nav li.dropdown:hover > ul.dropdown-menu {
+
-
    display: block;   
+
-
}
+
-
form{
+
-
position: relative;
+
-
right: 10px;
+
-
}
+
-
.jumbotron {
+
-
background-image: url(http://www.languatics.com/assets/Uploads/Languatics-Language-Immersion-Italian-Verona-Italy.jpg);
+
-
background-repeat: none;
+
color: #fff;
color: #fff;
-
height: 500px;
+
        background-color: orange;
-
margin:0;
+
        border-bottom: 4px solid #EC8318;
}
}
-
.jumbotron h1 {
+
 
-
position: relative;
+
#feature-icon img {
-
top: 170px;
+
        max-width: 100%;
-
font-size: 60px;
+
        max-height: 100%;
}
}
-
.jumbotron p{
+
 
-
position: relative;
+
#abstract {
-
top: 190px;
+
background: #F0EEEA;
-
}
+
-
.verona {
+
-
margin: 0 50px;
+
-
padding: 10px 200px 30px;
+
-
line-height: 40px;
+
-
}
+
-
.container {
+
-
background-color:#dfdfd9;
+
-
border-radius: 12px;
+
-
}
+
-
.thumbnail {
+
-
margin-top:40px;
+
-
margin-bottom:40px;
+
-
height: 500px;
+
-
}
+
-
.thumbnail legend {
+
-
margin:3px;
+
-
text-align:center;
+
-
width:100%
+
}
}
-
.thumbnail legend span{
+
-
font-size: 14px;
+
#abstract h2{
-
}
+
color: #676767;
-
footer {
+
-
width: 100%;
+
-
height: 100px;
+
-
margin: 20px 0 0 0;
+
-
padding: 20px 40px;
+
text-align: center;
text-align: center;
-
color: white;
+
margin-bottom: 40px;
-
background: rgba(0,0,0,.8);
+
font-size: 4em;
 +
font-family: "brandon-grotesque", sans-serif;
 +
font-weight: 700;
 +
text-shadow: 0px 2px 0px rgba(0, 0, 0, 0.2);
 +
padding-top: 100px;
 +
margin-top: 0px;
 +
letter-spacing: 8px;
}
}
-
footer img {
 
-
display: block;
 
-
}
 
-
</style>
 
-
</head>
 
 +
#abstract p {
 +
        font-family: 'Raleway', sans-serif;
 +
line-height: 2em;
 +
text-align: center;
 +
padding-left: 200px;
 +
padding-right:200px;
 +
padding-top: 10px;
 +
padding-bottom: 100px;
 +
        font-size: 18px;
 +
        color: #444;
 +
}
 +
 +
</style>
<body>
<body>
-
<div id="wrapper" style="width:100%; text-align:center">
 
-
<img src="img/verona_logo1 as Smart Object-1.jpg" width="586" height="167" alt="logo">
 
-
  </div>
 
-
   
 
-
<div class="navbar navbar-static">
 
-
    <div class="navbar-inner">
 
-
        <ul role="navigation" class="nav">
 
-
            <li><a href="#">Get around</a></li>
 
-
            <li><a href="#">Place to stay</a></li>
 
-
            <li class="dropdown">
 
-
                <a href="#" data-toggle="dropdown" class="dropdown-toggle">Join a tour</a>
 
-
                <ul class="dropdown-menu">
 
-
                    <li><a href="#">Art tour</a></li>
 
-
                    <li><a href="#">Cycling tour</a></li>
 
-
                    <li><a href="#">Garda Lake one day tour</a></li>
 
-
                    <li class="divider"></li>
 
-
                    <li><a href="#">Price</a></li>
 
-
                </ul>
 
-
            </li>
 
-
 
 
-
            <form class="navbar-form navbar-right" role="search">
 
-
        <div class="form-group">
 
-
          <input type="text" class="form-control" placeholder="Find you place!">
 
-
                <button type="submit" class="btn btn-default">Search</button>
 
-
      </form>
 
-
         
 
-
        </ul>
 
-
    </div>
 
-
  </div>
 
-
</div>
 
-
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" style="width: 1400px; margin: 0 auto">
+
<!--========================== carousel ===============================-->
 +
 
 +
    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
 +
  <!-- Indicators -->
 +
  <ol class="carousel-indicators">
 +
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
 +
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
 +
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
 +
    <li data-target="#carousel-example-generic" data-slide-to="3"></li>
 +
  </ol>
-
  <!-- Indicators -->
+
  <!-- Wrapper for slides -->
-
<ol class="carousel-indicators">
+
-
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
+
-
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
+
-
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
+
-
  </ol>
+
-
 
+
-
  <!-- Wrapper for slides -->
+
   <div class="carousel-inner">
   <div class="carousel-inner">
-
  <div class="item active">  
+
    <div class="item active">
-
        <img src="img/verona_overview_1200x480.jpg" width="1562" height="625" alt="verona">
+
      <img src="https://static.igem.org/mediawiki/2014/d/d7/CityU_HK_slide1.png" width=100% / >
-
  <div class="carousel-caption">
+
 
-
            <h1>Explore the city.</h1>  
+
<div class="carousel-caption">
-
                <p>Let's join the city tour to get around the ancient city</p>
+
        <a id="btn-custom" href="#Lower" id="#Lower class="anchorLink"><button class="btn btn-custom">ABSTRACT</button></a>
-
            </div>
+
      </div>
-
</div>
+
    </div>
-
  <div class="item">  
+
    <div class="item">
-
        <img src="img/cycling_1200x480.jpg" width="1500" height="600" alt="cycling">
+
    <img src="https://static.igem.org/mediawiki/2014/4/4a/CityU_HK_slide2.png" />
-
<div class="carousel-caption">  
+
        <div class="carousel-caption">
-
                <h1>Join a cycling tour.</h1>
+
            <a href="https://2014.igem.org/Team:CityU_HK/project/module_fad"><button class="btn btn-custom">FadD & FadL</button></a>
-
          </div>
+
            <a href="https://2014.igem.org/Team:CityU_HK/project/module_tesA"><button class="btn btn-custom">'TesA</button></a>
-
</div>
+
            <a href="https://2014.igem.org/Team:CityU_HK/project/module_desaturase"><button class="btn btn-custom">Desaturase</button></a>
-
    <div class="item">  
+
      </div>  
-
<img src="img/lake_garda_1200x480.jpg" width="5000" height="2000" alt="lake garda">
+
    </div>
-
<div class="carousel-caption">  
+
    <div class="item">
-
    <h1>Lake Garda</h1>
+
      <img src="https://static.igem.org/mediawiki/2014/9/98/CityU_HK_slide3.png">
-
                    <p>Climb up the mountain and have a look at the beautiful scenery.</p>  
+
      <div class="carousel-caption">
-
            </div>
+
        <a href="https://2014.igem.org/Team:CityU_HK/HumanPractice"><button class="btn btn-custom">Learn More</button></a>
-
</div>
+
      </div>
 +
    </div>
 +
    <div class="item">
 +
      <img src="https://static.igem.org/mediawiki/2014/f/f6/CityU_HK_hp_group.JPG" width=100% />
 +
      <div class="carousel-caption">
 +
        <a href="https://2014.igem.org/Team:CityU_HK/TeamMember"><button class="btn btn-custom">Meet the Team</button></a>
 +
      </div>
 +
    </div>
 +
 
   </div>
   </div>
Line 173: Line 133:
</div>
</div>
-
<div class="verona">
 
-
<h2>Verona</h2>
 
-
<p>Verona is a city straddling the Adige river in Veneto, northern Italy, with approximately 265,000 inhabitants and one of the seven chef-lieus of the region. It is the second largest city municipality in the region and the third of northeast Italy. There are many exciting and beautiful places to visit in Verona. You can either go to watch an opera in the Arena or get a cup of espresso in the Pizza Bar.</p>
 
-
</div>
 
-
   
 
-
<div class="container">
 
-
<div class="row">
 
-
  <div class="col-md-4">
 
-
<div class="thumbnail">
 
-
<img alt="romeo and juliet" src="http://www.jaunted.com/files/3873/Romeo_Juliet_Balcony_Verona.jpg">
 
-
<div class="caption">
 
-
<h3>Juliet's House</h3>
 
-
<p>Every year hundreds of thousands of us trek to Verona to see the balcony where Juliet stood while Romeo declared his love.</p>
 
-
<p>
 
-
<a class="btn btn-primary" href="juliet's house.html">Learn more >></a>
 
-
</p>
 
-
</div>
 
-
</div> <!end of .thumbnail-->
 
-
  </div> <!end of .col-md-4-->
 
-
           
 
-
           
 
-
  <div class="col-md-4">
 
-
<div class="thumbnail">
 
-
<img alt="Lake Garda" src="http://www.adoc.trentino.it/home/images/stories/laghi0906.jpg">
 
-
<div class="caption">
 
-
<h3>Lake Garda</h3>
 
-
<p>Lake Garda is the largest lake in Italy. It is a popular holiday location and is located in Northern Italy, about half-way between Brescia and Verona, and between Venice and Milan. Glaciers formed this alpine region at the end of the last Ice Age. </p>
 
-
<p>
 
-
<a class="btn btn-primary" href="#">Learn more >></a>
 
-
</p>
 
-
</div>
 
-
</div> <!end of .thumbnail-->
 
-
      </div> <!end of .col-md-4-->
 
-
         
 
-
         
 
-
<div class="col-md-4">
 
-
<div class="thumbnail">
 
-
<img alt="Arena" src="http://images.kuoni.co.uk/73/verona-29203839-1377620593-ImageGalleryLightbox.jpg">
 
-
<div class="caption">
 
-
<h3>Arena di Verona</h3>
 
-
<p>The Verona Arena is a Roman amphitheatre in Piazza Bra in Verona, Italy, which is internationally famous for the large-scale opera performances given there. It is one of the best preserved ancient structures of its kind.</p>
 
-
<p>
 
-
<a class="btn btn-primary" href="#">Learn more >></a>
 
-
</p>
 
-
</div>
 
-
</div> <!end of .thumbnail-->
 
-
      </div> <!end of .col-md-4-->
 
-
</div> <!--end of .row-->
 
-
</div><!--end of #container-->
 
 +
<!--===================== Abstract =========================-->
-
<footer>
 
-
<h5 class="pull-left">Contact me:</h5> <br />
 
-
<a class="pull-left" href="http://facebook.com/maria.li1"> <img src="http://www.vishay.com/images/facebook.png"></a>
 
-
</footer>
 
-
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+
<div class="anchor" id="Lower"></div>
-
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+
<div class="row" id="abstract">
-
    <!-- Include all compiled plugins (below), or include individual files as needed -->
+
  <div class="col-sm-12 col-md-12">
-
    <script src="js/bootstrap.min.js"></script>
+
     <h2>Abstract</h2>
-
    <script>
+
    <p><b>Obesity</b> has now reached epidemic proportions worldwide, which has serious consequences because obesity is associated with various chronic human diseases such as diabetes, hypertension and cardiovascular diseases. With the aim to protect oneself against obesity and debilitating diseases caused by a high-fat diet, we are using a synthetic biology approach to design an <i>Escherichia coli</i> strain (called <b><font color=#3cc>Fit. Coli</font></b>) that has an enhanced ability to uptake and convert excess fatty acids from fatty foods into a-linolenic acid (ALA). The strategy is to engineer the <i>fadL</i> and <i>fadD</i> genes along with three desaturase genes to facilitate the uptake of long-chain fatty acids and their biotransformation to ALA by the “Fit. Coli” strain. It is predicted that the ALA converted from excess fatty acids by Fit. Coli is converted to docosahexaenoic acid (DHA), an omega-3-fatty acid, in the human gut, which is well known to have many positive health benefits.</p>
-
$('.carousel').carousel();
+
 
-
</script>
+
  </div>
-
  </body>
+
</div>
 +
 
 +
<!--==================== footer ===========================-->
 +
<div id="footer" class="row">
 +
<div class="col-md-7">
 +
      <h3>Sponsors</h3>
 +
      <a href="http://www.cityu.edu.hk/" target="_blank"><img src="https://static.igem.org/mediawiki/2014/9/9c/CityU_HK_citylogo.png" width="95"></a>
 +
    <a href="http://www6.cityu.edu.hk/bhdbapp/deptweb/index.html" target="_blank"><img src="https://static.igem.org/mediawiki/2014/9/98/CityU_HK_bchlogo.png" width="80"></a>
 +
      <img src="https://static.igem.org/mediawiki/2014/b/b1/CityU_HK_Invitrogen.png" width="100">
 +
    <img src="https://static.igem.org/mediawiki/2014/7/7a/CityU_HK_Neblogocol.png" width="135">
 +
    <img src="https://static.igem.org/mediawiki/2014/d/dc/CityU_HK_IDT-Logo.png" width="125">
 +
</div> <!-- end of col-md-7-->
 +
 
 +
<div class="col-md-5">
 +
      <h3>Stay connected!</h3>
 +
      <p>email: <a href="mailto:cityuhk.igem@gmail.com">cityuhk.igem@gmail.com</a></p>
 +
      <a href="http://www.facebook.com/igem.2014CityU"><img src="https://static.igem.org/mediawiki/2014/3/31/CityU_HK_fb_logo.png" width="50" height="48"></a>
 +
      <a href="http://twitter.com/CityUHK_iGEM"><img src="http://ibo2014.org/wordpress/wp-content/themes/ibo2014/img/navbar/twitter_icon.png" width="49" height="51"></a>
 +
      <a href="http://www.youtube.com/channel/UC0_bUWwafB4m0K6mFdXN7-w"><img src="https://static.igem.org/mediawiki/2014/1/12/CityU_HK_youtube_logo.png" width="52" height="50"></a>
 +
</div> <!--end of col-md-5-->
 +
</div> <!-- end of row-->
 +
 
 +
<div class="row">
 +
<div id="copyright" class="col-md-12">
 +
<p>Copyright &copy; iGEM CityU HK 2014. All Rights Reserved</p>
 +
</div>
 +
</div>
 +
<!--end of footer-->
 +
 
 +
</body>
</html>
</html>

Latest revision as of 00:22, 18 October 2014

Bootstrap 101 Template

Abstract

Obesity has now reached epidemic proportions worldwide, which has serious consequences because obesity is associated with various chronic human diseases such as diabetes, hypertension and cardiovascular diseases. With the aim to protect oneself against obesity and debilitating diseases caused by a high-fat diet, we are using a synthetic biology approach to design an Escherichia coli strain (called Fit. Coli) that has an enhanced ability to uptake and convert excess fatty acids from fatty foods into a-linolenic acid (ALA). The strategy is to engineer the fadL and fadD genes along with three desaturase genes to facilitate the uptake of long-chain fatty acids and their biotransformation to ALA by the “Fit. Coli” strain. It is predicted that the ALA converted from excess fatty acids by Fit. Coli is converted to docosahexaenoic acid (DHA), an omega-3-fatty acid, in the human gut, which is well known to have many positive health benefits.