Difference between revisions of "Team:UCL/Playingaround3"

 
(69 intermediate revisions by 2 users not shown)
Line 3: Line 3:
  
  
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
 
 
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Raleway"/>
 
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Raleway"/>
  
Line 190: Line 189:
 
padding-top: 20px;  color: #FFFFFF;
 
padding-top: 20px;  color: #FFFFFF;
 
text-align: center;
 
text-align: center;
position: relative; bottom: 5%;
+
position: relative; top: 20px;
 
}
 
}
  
Line 359: Line 358:
 
#abstracttext {height: 80%;  
 
#abstracttext {height: 80%;  
 
     width: 80%;  
 
     width: 80%;  
    float: left;
+
margin: 0 auto;
margin: auto;
+
 
padding-left: 8%;
+
position: relative;
    padding-top: 6%;
+
vertical-align: middle;
 
font-family: Raleway;
 
font-family: Raleway;
 
letter-spacing: 1.2px;    line-height: 2;
 
letter-spacing: 1.2px;    line-height: 2;
 
text-align: justify;
 
text-align: justify;
 
font-size: 15px;
 
font-size: 15px;
 +
background: #fff;
 +
border: #fff 1px solid;
 +
border-radius: 15px;
 +
padding-top: 75px;
  
 
}
 
}
 
    
 
    
  
#abstracttext p {    line-height: 2; text-indent: 50px; font-size: 15px;
+
#abstracttext p {    line-height: 2; padding-left: 30px; padding-right: 30px; font-size: 15px;
 
}
 
}
  
Line 379: Line 382:
 
}
 
}
  
 
#whitebox1 {width: 24%; height: 38%; background-color: #fff; margin-right: 20px; margin-left: 10%; display: inline; float: left; font-size: 12px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5; border: 15px solid #F0F0F5;
 
  border-radius: 15px;
 
          }
 
#whitebox2 {width: 24%; height: 38%; background-color: #fff; margin-right: 20px; margin-left: 20px; display: inline; float: left; font-size: 12px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5;border: 15px solid #F0F0F5;
 
  border-radius: 15px;}
 
#whitebox3 {width: 24%; height: 38%; background-color: #fff; margin-right: 10%; margin-left: 20px; display: inline; float: left; font-size: 12px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5; border: 15px solid #F0F0F5;
 
  border-radius: 15px;}
 
#whitebox4 {width: 24%; height: 38%; background-color: #fff; margin-right: 20px; margin-left: 10%; display: inline; float: left; font-size: 12px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5;border: 15px solid #F0F0F5;
 
  border-radius: 15px;}
 
#whitebox5 {width: 24%; height: 38%; background-color: #fff; margin-right: 20px; margin-left: 20px; display: inline; float: left; font-size: 12px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5;border: 15px solid #F0F0F5;
 
  border-radius: 15px;}
 
#whitebox6 {width: 24%; height: 38%; background-color: #fff; margin-right: 10%; margin-left: 20px; display: inline; float: left; font-size: 12px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5;border: 15px solid #F0F0F5;
 
  border-radius: 15px; }
 
  
 
}
 
}
Line 398: Line 387:
 
#abstract h2 {font-size: 20px;}
 
#abstract h2 {font-size: 20px;}
  
/*why stats */
 
 
.why {height: 100%;
 
    width: 100%;
 
    padding: 10px;
 
margin: 0;
 
    padding-top: 8%;
 
font-family: Raleway;
 
letter-spacing: 1.2px;    line-height: 1.2;
 
text-align: center;
 
color: #fff;
 
font-size: 20px;
 
}
 
 
#whitebox1 {width: 24%; height: 38%; background-color: #fff; margin-right: 20px; margin-left: 10%; display: inline; float: left; font-size: 14px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5; border: 15px solid #F0F0F5;
 
  border-radius: 15px;
 
          }
 
#whitebox2 {width: 24%; height: 38%; background-color: #fff; margin-right: 20px; margin-left: 20px; display: inline; float: left; font-size: 14px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5;border: 15px solid #F0F0F5;
 
  border-radius: 15px;}
 
#whitebox3 {width: 24%; height: 38%; background-color: #fff; margin-right: 10%; margin-left: 20px; display: inline; float: left; font-size: 14px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5; border: 15px solid #F0F0F5;
 
  border-radius: 15px;}
 
#whitebox4 {width: 24%; height: 38%; background-color: #fff; margin-right: 20px; margin-left: 10%; display: inline; float: left; font-size: 14px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5;border: 15px solid #F0F0F5;
 
  border-radius: 15px;}
 
#whitebox5 {width: 24%; height: 38%; background-color: #fff; margin-right: 20px; margin-left: 20px; display: inline; float: left; font-size: 14px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5;border: 15px solid #F0F0F5;
 
  border-radius: 15px;}
 
#whitebox6 {width: 24%; height: 38%; background-color: #fff; margin-right: 10%; margin-left: 20px; display: inline; float: left; font-size: 14px; color: #787172; margin-top: 20px; text-align: justify; padding: 10px; line-height: 1.5;border: 15px solid #F0F0F5;
 
  border-radius: 15px; }
 
 
 
 
/*icons*/
 
@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");
 
.glyphicon {
 
  font-family: 'Glyphicons Halflings';
 
  font-style: normal;
 
  font-weight: normal;
 
  line-height: 1;
 
font-size: 40px;
 
position: relative;
 
}
 
 
.icon {
 
  font-family: 'FontAwesome';
 
  font-style: normal;
 
  font-weight: normal;
 
  line-height: 1;
 
font-size: 50px;
 
position: relative;
 
}
 
  
  
.icondiv {text-align: center; width: 100%; padding-top: 20px; padding-bottom: 20px; color: #F0F0F5;}
 
  
.glyphicon-globe {color: #006C93;}
 
.glyphicon-stats {color: #61D9D2;}
 
.glyphicon-piggy-bank {color: #019966;}
 
.glyphicon-blackboard {color: #104A57;}
 
.icon-user-md {color: #FE6C68;}
 
.icon-group {color: #FFCD55;}
 
  
 
.mailus {background: #F0F0F5; padding: 5px;}
 
.mailus {background: #F0F0F5; padding: 5px;}
Line 490: Line 423:
  
  
.menu-items {display: inline-block; width: 100%; text-align: center;  margin-left: -25px;
+
.menu-items {display: inline-block; width: 100%; text-align: center;  margin-left: -25px;   z-index: 99999;
 +
 
 
}
 
}
@media(max-width:463px){
+
@media(max-width: 463px){
 
.menu-items {margin-top: 10px; }
 
.menu-items {margin-top: 10px; }
 
}
 
}
Line 502: Line 436:
 
margin-top: 3px;
 
margin-top: 3px;
 
letter-spacing: 1.1px;
 
letter-spacing: 1.1px;
 +
 
   }
 
   }
  
.menu-items li:hover ul{
+
.menu-items ul li:hover ul{
 
display:block;
 
display:block;
  
Line 514: Line 449:
 
margin-left: -19px;
 
margin-left: -19px;
 
float: left;
 
float: left;
margin-top: 16px;
 
 
}
 
}
  
Line 535: Line 469:
  
 
.menu-items li ul li a {color: #fff; font-size: 14px;}
 
.menu-items li ul li a {color: #fff; font-size: 14px;}
 
+
.menu-items li ul li a:hover {color: #726082;}
 
.menu-items a {color: #473E4F; text-decoration: none; font-family: Raleway;   
 
.menu-items a {color: #473E4F; text-decoration: none; font-family: Raleway;   
 
}
 
}
Line 643: Line 577:
 
left: 3%;
 
left: 3%;
 
background-position: 0 50%;
 
background-position: 0 50%;
 +
z-index:100;
 
}
 
}
  
Line 652: Line 587:
 
.sssprev:hover, .sssnext:hover {
 
.sssprev:hover, .sssnext:hover {
 
cursor: pointer;
 
cursor: pointer;
 +
 
}
 
}
  
Line 661: Line 597:
 
box-sizing: border-box;
 
box-sizing: border-box;
 
background: #fff;
 
background: #fff;
height: 420px;
+
height: 380px;
  
 
}
 
}
Line 668: Line 604:
 
width: 60%;
 
width: 60%;
 
margin: 0 auto;
 
margin: 0 auto;
padding-top: 10%; height: 350px;
+
padding-top: 10%; height: 400px;
 
 
 
}
 
}
Line 736: Line 672:
 
<div id="logo">   
 
<div id="logo">   
  
<img src="https://static.igem.org/mediawiki/2015/d/d4/UCL_mtg2.png" class="logophoto" style="margin-bottom:40px; margin-top:-35px" />  
+
<img src="https://static.igem.org/mediawiki/2015/d/d4/UCL_mtg2.png" class="logophoto" style="margin-bottom:40px; margin-top:-35px" alt="Mind the Gut" />  
 
       <div class="intro-buttons" id="box-links">
 
       <div class="intro-buttons" id="box-links">
 
         <a data-scroll data-options='{ "easing": "linear" }' href="#intro1" class="buttonblack">Learn more</a>
 
         <a data-scroll data-options='{ "easing": "linear" }' href="#intro1" class="buttonblack">Learn more</a>
Line 770: Line 706:
 
</div>
 
</div>
 
</div>
 
</div>
 +
<div style="clear: both;"></div>
  
  
Line 777: Line 714:
  
 
</div>
 
</div>
 +
  
  
Line 785: Line 723:
 
  <div id="abstracttext">
 
  <div id="abstracttext">
 
              
 
              
        <h2> Mind the Gut: Abstract</h2>
+
        <p>        <h2> Mind the Gut: Abstract</h2></p>
        <p>
+
<p>
 
The gut–brain axis refers to the biochemical signalling taking place between the gastrointestinal tract and the nervous system, often involving intestinal microbiota, which have been shown to play an important role in healthy brain function. The current research suggests that gut microbes secrete neuroactive compounds – including neurotransmitters – that interact with the brain via two main mechanisms: the vagus nerve, connecting brain and digestive tract, and the immune system, which maintains its own means of communication with the brain.</p>
 
The gut–brain axis refers to the biochemical signalling taking place between the gastrointestinal tract and the nervous system, often involving intestinal microbiota, which have been shown to play an important role in healthy brain function. The current research suggests that gut microbes secrete neuroactive compounds – including neurotransmitters – that interact with the brain via two main mechanisms: the vagus nerve, connecting brain and digestive tract, and the immune system, which maintains its own means of communication with the brain.</p>
 
<p>
 
<p>
Line 797: Line 735:
 
<div style="clear: both;"></div>
 
<div style="clear: both;"></div>
  
<div id="why2">
+
 
<a data-scroll data-options='{ "easing": "linear" }' href="#motivation" class="buttonc2">Why do it?</a>
+
</div>
+
  
 
         </div>
 
         </div>

Latest revision as of 15:52, 22 July 2015

The number of microorganisms in human gut is higher than the number of human cells in our body. Their metabolic activity equals that of liver and plays crucial role in many key processes such as digestion, drug metabolism, or functioning of the immune system...
Studies in mice have shown that the gut microbiome is also capable of influencing the chemistry of our brain, thus regulating our behaviour , anxiety , mood , cognition and pain ...
Being inspired by this emerging research area, UCL 2015 team wants to explore the modulation of the gut bacteria as a strategy for developing novel treatments for mental health disorders. Ultimately, our goal is to harness synthetic biology to make people happy!

Mind the Gut: Abstract

The gut–brain axis refers to the biochemical signalling taking place between the gastrointestinal tract and the nervous system, often involving intestinal microbiota, which have been shown to play an important role in healthy brain function. The current research suggests that gut microbes secrete neuroactive compounds – including neurotransmitters – that interact with the brain via two main mechanisms: the vagus nerve, connecting brain and digestive tract, and the immune system, which maintains its own means of communication with the brain.

In line with the ongoing research, UCL iGEM 2015 aims to develop synthetic probiotic strains that mimic the neuromodulatory strategies identified in gut microbes, with a focus on regulation of tryptophan pathway and signalling via serotonin. Additionally, in order to incorporate our neuromodulators into precise and safe therapeutic devices, we are developing a set of sensors capable of detecting mood-related physiological changes in the gut environment.

Available small molecule treatments are associated with both stigma and side effects. We believe that, besides aiding in better understanding of the communication between the gut microbiome and nervous system, our work will also lay a foundation for novel user-friendly treatments targeting a range of mental health disorders.