Team:LIKA-CESAR-Brasil/Theme

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
{{CSS/Main}}
{{CSS/Main}}
<html>
<html>
-
<style type="text/css">
+
<style>
-
body {
+
body {
-
font-size:12px;
+
font-size:12px;
-
color:#666;
+
color:#111;
-
height:100%;
+
height:100%;
-
background-color:#ededed;
+
background:#ededed;
 +
}
 +
.container {
 +
width:80%;
 +
color:#ededed;
 +
background: rgb(255,255,255); /* Old browsers */
 +
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(237,237,237,1) 100%); /* FF3.6+ */
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(237,237,237,1))); /* Chrome,Safari4+ */
 +
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */
 +
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* Opera 11.10+ */
 +
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* IE10+ */
 +
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* W3C */
 +
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
 +
}
 +
.navbar-brand {
 +
padding: 5px;
 +
}
 +
.col-md-10  {
 +
width:100%;
 +
min-height:200px;
 +
padding-bottom:50px;
 +
background-color:#e0e0e0;
 +
}
 +
.col-md-4 {
 +
padding-bottom:70px;
 +
}
 +
.navbar-inverse {
 +
background-color: #ededed;
 +
border-color: #ededed;
 +
}
 +
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
 +
color: #006600;
 +
background-color: #8cff00;
 +
}
 +
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
 +
color: #006600;
 +
background-color: #8cff00;
 +
}
 +
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
 +
color: #006600;
 +
background-color: transparent;
 +
}
 +
.navbar-inverse .navbar-nav > li > a:focus {
 +
color: #006600;
 +
background-color: transparent;
 +
}
 +
.nav > li > a {
 +
display: block;
 +
padding: 25px 15px;
 +
position: relative;
 +
}
 +
.menu{
 +
color:black;
 +
z-index:999;
 +
position:relative;
 +
float:right;
 +
margin:auto;
 +
}
 +
.menu ul{
 +
margin:0 auto;
 +
}
 +
.jumbotron {
 +
background:url("../img/banner_top.jpg");
 +
border-top: solid 5px #8cff00;
 +
border-bottom: solid 5px #8cff00;
 +
background-size:cover;
 +
width:80%;
 +
height:231px;
 +
margin:auto;
 +
margin-top:70px;
 +
}
 +
h2 {
 +
font-size: 26px;
 +
color:#339900;
 +
}
 +
.videocapa{
 +
width:35%;
 +
float:right;
 +
min-height:300px;
 +
margin-top:10px;
 +
}
 +
p {
 +
font-size: 12px;
 +
color:#111;
 +
}
 +
footer {
 +
background:#b8b8b8;
 +
width:100%;
 +
padding: 50px;
 +
clear:both;
 +
position: relative;
 +
bottom:0;
 +
border-top: solid 8px #8cff00;
 +
}
 +
footer p {
 +
margin:auto;
 +
padding-top:10px;
 +
text-align:center;
 +
width:50%;
 +
color:#006600;
}
}
 +
</style>
 +
    </head>
-
.container {
+
  <body>
-
width:80%;
+
-
color:#ededed;
+
-
background: rgb(255,255,255); /* Old browsers */
+
-
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(237,237,237,1) 100%); /* FF3.6+ */
+
-
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(237,237,237,1))); /* Chrome,Safari4+ */
+
-
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */
+
-
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* Opera 11.10+ */
+
-
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* IE10+ */
+
-
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* W3C */
+
-
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
+
-
 
+
-
}
+
-
 
+
-
.container .col-md-10 {
+
-
min-height:200px;
+
-
padding-bottom:100px;
+
-
}
+
-
 
+
-
.navbar-inverse {
+
-
    background-color: #ededed;
+
-
border-color: #ededed;
+
-
}
+
-
 
+
-
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
+
-
    color: #006600;
+
-
    background-color: #8cff00;
+
-
}
+
-
 
+
-
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
+
-
    color: #006600;
+
-
    background-color: transparent;
+
-
}
+
-
 
+
-
.navbar-inverse .navbar-nav > li > a:focus {
+
-
    color: #006600;
+
-
    background-color: transparent;
+
-
}
+
-
 
+
-
.menu{
+
-
background-color:white;
+
-
color:black;
+
-
z-index:999;
+
-
position:relative;
+
-
}
+
-
.jumbotron {
+
-
background:url("https://static.igem.org/mediawiki/2014/7/7a/Banner_top.jpg") no-repeat;
+
-
background-size:cover;
+
-
width:80%;
+
-
height:284px;
+
-
margin:auto;
+
-
}
+
-
 
+
-
h2 {
+
-
font-size: 26px;
+
-
color:#339900;
+
-
}
+
-
 
+
-
p {
+
-
font-size: 12px;
+
-
color:#999;
+
-
}
+
-
 
+
-
footer {
+
-
background: rgb(140,255,0); /* Old browsers */
+
-
background: -moz-linear-gradient(top,  rgba(140,255,0,1) 0%, rgba(139,198,0,1) 100%); /* FF3.6+ */
+
-
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(140,255,0,1)), color-stop(100%,rgba(139,198,0,1))); /* Chrome,Safari4+ */
+
-
background: -webkit-linear-gradient(top,  rgba(140,255,0,1) 0%,rgba(139,198,0,1) 100%); /* Chrome10+,Safari5.1+ */
+
-
background: -o-linear-gradient(top,  rgba(140,255,0,1) 0%,rgba(139,198,0,1) 100%); /* Opera 11.10+ */
+
-
background: -ms-linear-gradient(top,  rgba(140,255,0,1) 0%,rgba(139,198,0,1) 100%); /* IE10+ */
+
-
background: linear-gradient(to bottom,  rgba(140,255,0,1) 0%,rgba(139,198,0,1) 100%); /* W3C */
+
-
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8cff00', endColorstr='#8bc600',GradientType=0 ); /* IE6-9 */
+
-
width:100%;
+
-
margin-top: -50px; /* A mesma altura do rodapé, o valor deve ser negativo */
+
-
  height: 150px;
+
-
clear:both;
+
-
position: relative;
+
-
bottom:0;
+
-
}
+
-
 
+
-
footer p {
+
-
 
+
-
margin:auto;
+
-
padding-top:10px;
+
-
text-align:center;
+
-
width:50%;
+
-
color:#006600;
+
-
}
+
-
</style>
+
     <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
     <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
       <div class="container">
       <div class="container">
-
 
+
  <header>
-
      <div class="navbar-collapse collapse menu" id="bs-example-navbar-collapse-1">
+
-
             <ul class="nav navbar-nav">
+
    <div class="navbar-header">
-
              <li class="active"><a href="index.html">HOME</a></li>
+
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
 +
            <span class="sr-only">Toggle navigation</span>
 +
             <span class="icon-bar"></span>
 +
            <span class="icon-bar"></span>
 +
            <span class="icon-bar"></span>
 +
          </button>
 +
  <a class="navbar-brand" href="#"><img src="img/marca.png" alt="Marca LIKA"></a>
 +
        </div>
 +
      <div class="navbar-collapse collapse menu">
 +
          <ul class="nav navbar-nav">
 +
 
 +
  <li class="active"><a href="index.html">HOME</a></li>
               <li class="dropdown">
               <li class="dropdown">
                 <a href="#" class="dropdown-toggle" data-toggle="dropdown">TEAM<span class="caret"></span></a>
                 <a href="#" class="dropdown-toggle" data-toggle="dropdown">TEAM<span class="caret"></span></a>
Line 141: Line 165:
             </ul>
             </ul>
           </div><!--/.nav-collapse -->
           </div><!--/.nav-collapse -->
 +
  </header>
       </div>
       </div>
     </div>
     </div>
Line 149: Line 174:
       <div class="row">
       <div class="row">
         <div class="col-md-10">
         <div class="col-md-10">
-
           <h2>Synthetic Biology and Robotics - The Integration that can Save Lives</h2>
+
           <div style="width:60%; float:left">
-
          <p>The LIKA-CESAR BRASIL proposes the development of a biosensor for the detection of breast cancer with the help of synthetic biology and robotics. The idea was to build a robotic system linked to genetic engineering capable of processing and prepare small samples of blood in an automated manner.</p>
+
  <h2>Synthetic Biology and Robotics - The Integration that can Save Lives</h2>
-
  <p>For this our team, created the Coli Alert for the BreastBotSensor.  This system is one robot to DNA/RNA extraction coupled by an electrochemical biosensor and linked to one quality control, the ColiAlert, responsible to confirm the process of nucleic acid extraction.</p>
+
  <p>The LIKA-CESAR BRASIL proposes the development of a biosensor for the detection of breast cancer with the help of synthetic biology and robotics. The idea was to build a robotic system linked to genetic engineering capable of processing and prepare small samples of blood in an automated manner.</p>
-
  <p>The team believes that the best way to solve problems is joining technologies. For this, we think that synthetic biology should go hand in hand with robotics and information technology. Then our project was to join the synthetic biology with the robots, aiming to fight against to the one of biggest health problems: The Breast Cancer.</p>
+
  <p>For this our team, created the Coli Alert for the BreastBotSensor.  This system is one robot to DNA/RNA extraction coupled by an electrochemical biosensor and linked to one quality control, the ColiAlert, responsible to confirm the process of nucleic acid extraction.</p>
-
        </div>
+
  <p>The team believes that the best way to solve problems is joining technologies. For this, we think that synthetic biology should go hand in hand with robotics and information technology. Then our project was to join the synthetic biology with the robots, aiming to fight against to the one of biggest health problems: The Breast Cancer.</p>
-
         </div>
+
</div>
 +
<iframe class="videocapa"
 +
src="http://www.youtube.com/embed/hNmoEvCqs7U">
 +
</iframe>
 +
</div>
 +
 
 +
          <div class="col-md-4">
 +
          <h2>Heading</h2>
 +
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
 +
          </div>
 +
         <div class="col-md-4">
 +
          <h2>Heading</h2>
 +
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
 +
          </div>
 +
        <div class="col-md-4">
 +
          <h2>Heading</h2>
 +
          <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
 +
          </div>
 +
  <footer>
 +
<p><a href="http://www.cesar.org.br/site/">C.E.S.A.R</a> | Rua Bione, 220 Cais do Apolo Bairro do Recife. CEP 50.030-390, Recife - Pernambuco - Brasil</p>
 +
  </footer>
 +
      </div>
 +
 
         </div> <!-- /container -->
         </div> <!-- /container -->
-
<footer>
 
-
        <p><a href="http://www.cesar.org.br/site/">C.E.S.A.R</a> | Rua Bione, 220 Cais do Apolo Bairro do Recife. CEP 50.030-390, Recife - Pernambuco - Brasil</p>
 
-
    </footer>
 
   <!-- Bootstrap core JavaScript
   <!-- Bootstrap core JavaScript
     ================================================== -->
     ================================================== -->
Line 166: Line 210:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-
 
+
   
 +
  </body>
</html>
</html>

Revision as of 19:17, 14 October 2014

Synthetic Biology and Robotics - The Integration that can Save Lives

The LIKA-CESAR BRASIL proposes the development of a biosensor for the detection of breast cancer with the help of synthetic biology and robotics. The idea was to build a robotic system linked to genetic engineering capable of processing and prepare small samples of blood in an automated manner.

For this our team, created the Coli Alert for the BreastBotSensor. This system is one robot to DNA/RNA extraction coupled by an electrochemical biosensor and linked to one quality control, the ColiAlert, responsible to confirm the process of nucleic acid extraction.

The team believes that the best way to solve problems is joining technologies. For this, we think that synthetic biology should go hand in hand with robotics and information technology. Then our project was to join the synthetic biology with the robots, aiming to fight against to the one of biggest health problems: The Breast Cancer.

Heading

Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.

Heading

Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.

Heading

Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

C.E.S.A.R | Rua Bione, 220 Cais do Apolo Bairro do Recife. CEP 50.030-390, Recife - Pernambuco - Brasil