Team:CIDEB-UANL Mexico

From 2014hs.igem.org

(Difference between revisions)
Line 5: Line 5:
<title>Documento sin título</title>
<title>Documento sin título</title>
<style>
<style>
-
    html, body
+
html, body
{
{
height: 100%;
height: 100%;
Line 64: Line 64:
width: 1200px;
width: 1200px;
}
}
 +
 +
 +
/*********************************************************************************/
 +
/* Form Style                                                                    */
 +
/*********************************************************************************/
 +
 +
form
 +
{
 +
}
 +
 +
form label
 +
{
 +
display: block;
 +
text-align: left;
 +
margin-bottom: 0.5em;
 +
}
 +
 +
form .submit
 +
{
 +
margin-top: 2em;
 +
line-height: 1.5em;
 +
font-size: 1.3em;
 +
}
 +
 +
form input.text,
 +
form select,
 +
form textarea
 +
{
 +
position: relative;
 +
-webkit-appearance: none;
 +
display: block;
 +
border: 0;
 +
background: #fff;
 +
background: rgba(255,255,255,0.75);
 +
width: 100%;
 +
border-radius: 0.50em;
 +
margin: 1em 0em;
 +
padding: 1.50em 1em;
 +
box-shadow: inset 0 0.1em 0.1em 0 rgba(0,0,0,0.05);
 +
border: solid 1px rgba(0,0,0,0.15);
 +
-moz-transition: all 0.35s ease-in-out;
 +
-webkit-transition: all 0.35s ease-in-out;
 +
-o-transition: all 0.35s ease-in-out;
 +
-ms-transition: all 0.35s ease-in-out;
 +
transition: all 0.35s ease-in-out;
 +
font-size: 1em;
 +
outline: none;
 +
}
 +
 +
form input.text:hover,
 +
form select:hover,
 +
form textarea:hover
 +
{
 +
}
 +
 +
form input.text:focus,
 +
form select:focus,
 +
form textarea:focus
 +
{
 +
box-shadow: 0 0 2px 1px #E0E0E0;
 +
background: #fff;
 +
}
 +
 +
form textarea
 +
{
 +
min-height: 12em;
 +
}
 +
 +
form .formerize-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form ::-webkit-input-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form :-moz-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form ::-moz-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form :-ms-input-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form ::-moz-focus-inner
 +
{
 +
border: 0;
 +
}
 +
 +
 +
/*********************************************************************************/
 +
/* Image Style                                                                  */
 +
/*********************************************************************************/
 +
 +
.image
 +
{
 +
display: inline-block;
 +
border: 1px solid rgba(0,0,0,.1);
 +
}
 +
 +
.image img
 +
{
 +
display: block;
 +
width: 100%;
 +
}
 +
 +
.image-full
 +
{
 +
display: block;
 +
width: 100%;
 +
margin: 0 0 3em 0;
 +
}
 +
 +
.image-left
 +
{
 +
float: left;
 +
margin: 0 2em 2em 0;
 +
}
 +
 +
.image-centered
 +
{
 +
display: block;
 +
margin: 0 0 2em 0;
 +
}
 +
 +
.image-centered img
 +
{
 +
margin: 0 auto;
 +
width: auto;
 +
}
 +
 +
/*********************************************************************************/
 +
/* List Styles                                                                  */
 +
/*********************************************************************************/
 +
 +
ul.style1
 +
{
 +
}
 +
 +
 +
/*********************************************************************************/
 +
/* Social Icon Styles                                                            */
 +
/*********************************************************************************/
 +
 +
ul.contact
 +
{
 +
margin: 0;
 +
padding: 2em 0em 0em 0em;
 +
list-style: none;
 +
}
 +
 +
ul.contact li
 +
{
 +
display: inline-block;
 +
padding: 0em 0.10em;
 +
font-size: 1em;
 +
}
 +
 +
ul.contact li span
 +
{
 +
display: none;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 +
ul.contact li a
 +
{
 +
color: #FFF;
 +
}
 +
 +
ul.contact li a:before
 +
{
 +
display: inline-block;
 +
background: #4C93B9;
 +
width: 40px;
 +
height: 40px;
 +
line-height: 40px;
 +
text-align: center;
 +
color: rgba(255,255,255,1);
 +
}
 +
 +
 +
/*********************************************************************************/
 +
/* Button Style                                                                  */
 +
/*********************************************************************************/
 +
 +
.button
 +
{
 +
display: inline-block;
 +
margin-top: 2em;
 +
padding: 0.8em 2em;
 +
background: #64ABD1;
 +
line-height: 1.8em;
 +
letter-spacing: 1px;
 +
text-decoration: none;
 +
font-size: 1em;
 +
color: #FFF;
 +
}
 +
 +
.button:before
 +
{
 +
display: inline-block;
 +
background: #8DCB89;
 +
margin-right: 1em;
 +
width: 40px;
 +
height: 40px;
 +
line-height: 40px;
 +
border-radius: 20px;
 +
text-align: center;
 +
color: #272925;
 +
}
 +
 +
.button-small
 +
{
 +
}
 +
 +
/*********************************************************************************/
 +
/* Heading Titles                                                                */
 +
/*********************************************************************************/
 +
 +
.title
 +
{
 +
margin-bottom: 3em;
 +
}
 +
 +
.title h2
 +
{
 +
font-size: 2.8em;
 +
}
 +
 +
.title .byline
 +
{
 +
font-size: 1.1em;
 +
color: #6F6F6F#;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Header                                                                        */
 +
/*********************************************************************************/
 +
#header-wrapper
#header-wrapper
{
{
Line 69: Line 318:
background-image:url(https://static.igem.org/mediawiki/2014hs/3/32/Cideb_Fondo1.gif);
background-image:url(https://static.igem.org/mediawiki/2014hs/3/32/Cideb_Fondo1.gif);
}
}
 +
#header
#header
{
{
text-align: center;
text-align: center;
}
}
 +
 +
/*********************************************************************************/
 +
/* Logo                                                                          */
 +
/*********************************************************************************/
 +
 +
#logo
 +
{
 +
padding: 8em 0em 4em 0em;
 +
}
 +
 +
#logo h1
 +
{
 +
display: block;
 +
margin-bottom: 0.20em;
 +
padding: 0.20em 0.9em;
 +
font-size: 3.5em;
 +
}
 +
 +
#logo a
 +
{
 +
text-decoration: none;
 +
color: #FFF;
 +
}
 +
 +
#logo span
 +
{
 +
text-transform: uppercase;
 +
font-size: 2.90em;
 +
color: rgba(255,255,255,1);
 +
}
 +
 +
#logo span a
 +
{
 +
color: rgba(255,255,255,0.8);
 +
}
 +
 +
 +
 +
/*********************************************************************************/
 +
/* Menu                                                                          */
 +
/*********************************************************************************/
 +
#menu
#menu
{
{
Line 112: Line 404:
#menu .current_page_item a
#menu .current_page_item a
{
{
 +
}
 +
 +
 +
/*********************************************************************************/
 +
/* Banner                                                                        */
 +
/*********************************************************************************/
 +
 +
#banner
 +
{
 +
padding-top: 5em;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Wrapper                                                                      */
 +
/*********************************************************************************/
 +
 +
 +
.wrapper
 +
{
 +
overflow: hidden;
 +
padding: 0em 0em 5em 0em;
 +
background: #FFF;
 +
}
 +
 +
#wrapper1
 +
{
 +
background: #FFF;
 +
}
 +
 +
#wrapper2
 +
{
 +
overflow: hidden;
 +
background: #F3F3F3;
 +
padding: 5em 0em;
 +
text-align: center;
 +
}
 +
 +
#wrapper3
 +
{
 +
}
 +
 +
#wrapper4
 +
{
 +
}
 +
 +
/*********************************************************************************/
 +
/* Welcome                                                                      */
 +
/*********************************************************************************/
 +
 +
#welcome
 +
{
 +
overflow: hidden;
 +
width: 1000px;
 +
padding: 6em 100px 0em 100px;
 +
text-align: center;
 +
}
 +
 +
#welcome .content
 +
{
 +
padding: 0em 8em;
 +
}
 +
 +
#welcome .title h2
 +
{
 +
}
 +
 +
#welcome a,
 +
#welcome strong
 +
{
 +
}
 +
 +
/*********************************************************************************/
 +
/* Page                                                                          */
 +
/*********************************************************************************/
 +
 +
#page-wrapper
 +
{
 +
overflow: hidden;
 +
background: #2F1E28;
 +
padding: 3em 0em 6em 0em;
 +
text-align: center;
 +
}
 +
 +
#page
 +
{
 +
}
 +
 +
/*********************************************************************************/
 +
/* Content                                                                      */
 +
/*********************************************************************************/
 +
 +
#content
 +
{
 +
float: left;
 +
width: 700px;
 +
padding-right: 100px;
 +
border-right: 1px solid rgba(0,0,0,.1);
 +
}
 +
 +
/*********************************************************************************/
 +
/* Sidebar                                                                      */
 +
/*********************************************************************************/
 +
 +
#sidebar
 +
{
 +
float: right;
 +
width: 350px;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Footer                                                                        */
 +
/*********************************************************************************/
 +
 +
#footer
 +
{
 +
overflow: hidden;
 +
padding: 5em 0em;
 +
background: #E3F0F7;
 +
text-align: center;
 +
}
 +
 +
 +
 +
#footer .fbox1,
 +
#footer .fbox2,
 +
#footer .fbox3
 +
{
 +
float: left;
 +
width: 320px;
 +
padding: 0px 40px 0px 40px;
 +
}
 +
 +
#footer .icon
 +
{
 +
display: block;
 +
margin-bottom: 1em;
 +
font-size: 3em;
 +
}
 +
 +
 +
#footer .title span
 +
{
 +
color: rgba(255,255,255,0.4);
 +
}
 +
 +
/*********************************************************************************/
 +
/* Copyright                                                                    */
 +
/*********************************************************************************/
 +
 +
#copyright
 +
{
 +
overflow: hidden;
 +
padding: 5em 0em;
 +
border-top: 20px solid rgba(255,255,255,0.08);
 +
text-align: center;
 +
}
 +
 +
#copyright p
 +
{
 +
letter-spacing: 1px;
 +
font-size: 0.90em;
 +
color: rgba(255,255,255,0.6);
 +
}
 +
 +
#copyright a
 +
{
 +
text-decoration: none;
 +
color: rgba(255,255,255,0.8);
 +
}
 +
 +
/*********************************************************************************/
 +
/* Newsletter                                                                    */
 +
/*********************************************************************************/
 +
 +
#newsletter
 +
{
 +
overflow: hidden;
 +
padding: 8em 0em;
 +
background: #EDEDED;
 +
text-align: center;
 +
}
 +
 +
#newsletter .title h2
 +
{
 +
color: rgba(0,0,0,0.8);
 +
}
 +
 +
#newsletter .content
 +
{
 +
width: 600px;
 +
margin: 0px auto;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Portfolio                                                                    */
 +
/*********************************************************************************/
 +
 +
#portfolio
 +
{
 +
overflow: hidden;
 +
padding-top: 5em;
 +
border-top: 1px solid rgba(0,0,0,0.2);
 +
}
 +
 +
#portfolio .box
 +
{
 +
text-align: center;
 +
color: rgba(0,0,0,0.5);
 +
}
 +
 +
#portfolio h3
 +
{
 +
display: block;
 +
padding-bottom: 1em;
 +
font-size: 1em;
 +
color: rgba(0,0,0,0.6);
 +
}
 +
 +
#portfolio .title
 +
{
 +
text-align: center;
 +
}
 +
 +
#portfolio .title h2
 +
{
 +
color: rgba(0,0,0,0.8);
 +
}
 +
 +
.column1,
 +
.column2,
 +
.column3,
 +
.column4
 +
{
 +
width: 282px;
 +
}
 +
 +
.column1,
 +
.column2,
 +
.column3
 +
{
 +
float: left;
 +
margin-right: 24px;
 +
}
 +
 +
.column4
 +
{
 +
float: right;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Three Columns                                                                */
 +
/*********************************************************************************/
 +
 +
#three-column
 +
{
 +
overflow: hidden;
 +
margin-top: 5em;
 +
padding-top: 1em;
 +
border-top: 1px solid rgba(0,0,0,0.2);
 +
text-align: center;
 +
}
 +
 +
#three-column h2
 +
{
 +
margin: 1em 0em;
 +
font-size: 1.5em;
 +
font-weight: 700;
 +
}
 +
 +
#three-column .icon
 +
{
 +
position: relative;
 +
display: block;
 +
margin: 0px auto 0.80em auto;
 +
background: none;
 +
line-height: 150px;
 +
font-size: 4em;
 +
width: 150px;
 +
height: 100px;
 +
border-radius: 100px;
 +
border: 6px solid #67128F;
 +
text-align: center;
 +
color: #FFF;
 +
 +
}
 +
 +
#three-column #tbox1,
 +
#three-column #tbox2,
 +
#three-column #tbox3
 +
{
 +
float: left;
 +
width: 320px;
 +
padding: 30px 40px 50px 40px;
 +
}
 +
 +
#three-column .title
 +
{
 +
text-align: center;
 +
}
 +
 +
#three-column .title h2
 +
{
 +
font-size: 1.60em;
 +
}
 +
 +
#three-column .title .byline
 +
{
 +
padding-top: 0.50em;
 +
font-size: 0.90em;
 +
color: #858585;
 +
}
 +
 +
#three-column .arrow-down
 +
{
 +
border-top-color: #292929;
 +
}
 +
 +
 +
ul.tools
 +
{
 +
margin: 0;
 +
padding: 0em 0em 0em 0em;
 +
list-style: none;
 +
}
 +
 +
ul.tools li
 +
{
 +
display: inline-block;
 +
padding: 0em .2em;
 +
font-size: 4em;
 +
}
 +
 +
ul.tools li span
 +
{
 +
display: none;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 +
ul.tools li a
 +
{
 +
color: #FFF;
 +
}
 +
 +
ul.tools li a:before
 +
{
 +
display: inline-block;
 +
background: #1ABC9C;
 +
width: 120px;
 +
height: 120px;
 +
border-radius: 50%;
 +
line-height: 120px;
 +
text-align: center;
 +
color: #FFFFFF;
}
}
</style>
</style>
Line 120: Line 766:
<div id="header" class="container">
<div id="header" class="container">
<div>
<div>
-
             <a href="#"><img src="https://static.igem.org/mediawiki/2014hs/0/03/CIDEB_2014-Logo.gif" style="padding-top:20px; padding-bottom:10px"/></a>
+
             <a href="#"><img src="https://static.igem.org/mediawiki/2014hs/0/03/CIDEB_2014-Logo.gif" style="padding-top:20px; padding-bottom:10px" style="padding-top:20px; padding-bottom:10px"/></a>
</div>
</div>
<div id="menu">
<div id="menu">
Line 131: Line 777:
                 <li><a href="#" accesskey="5" title="">Software</a></li>
                 <li><a href="#" accesskey="5" title="">Software</a></li>
</ul>
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="wrapper">
 +
<div id="banner" class="container"><img src="https://static.igem.org/mediawiki/2014hs/8/8b/Cideb_Banner1.jpg" width="1200" height="500" alt="" /></div>
 +
<div id="welcome" class="container">
 +
        <div class="title">
 +
      <h2>Welcome to our wiki</h2>
 +
</div>
 +
<p>We are <strong>iGEM CIDEB 2014</strong> team, from CIDEB high school in Monterrey, Nuevo Leon, Mexico. This year, our proyect is <a href="http://templated.co" rel="nofollow">E. CARU</a>, a biofilter that helps eliminate Sodium ions from water, in order to make it clean for human consumption. In this wiki, you can learn from our proyect, our activities, and our experiments.</p>
 +
</div>
 +
<div id="three-column" class="container">
 +
<div><span class="arrow-down"></span></div>
 +
<div id="tbox1">
 +
<div class="title">
 +
<h2>E. CARU</h2>
 +
</div>
 +
<p>Learn the four modules from our proyect to understand how E. CARU works. Also, learn the benefits from our biofilter. </p>
 +
<a href="#" class="button">Learn More</a> </div>
 +
<div id="tbox2">
 +
<div class="title">
 +
<h2>Wet-Lab</h2>
 +
</div>
 +
<p>See our work inside the lab! Including our construction plan, our lab notebook, our project experiments, and their results.</p>
 +
<a href="#" class="button">Learn More</a> </div>
 +
<div id="tbox3">
 +
<div class="title">
 +
<h2>Conclusions</h2>
 +
</div>
 +
<p>See the final conclusion of the wet-lab experiments and the mathematical model. Also, read the future plans of the project. </p>
 +
<a href="#" class="button">Learn More</a> </div>
 +
</div>
 +
<div id="portfolio" class="container">
 +
<div class="column1">
 +
<div class="box">
 +
  <h3>iGEM CIDEB Race</h3>
 +
<p>More than 600 persons, learning from our project and iGEM, while exercising.</p>
 +
  <a href="#" class="button button-small">Learn More</a> </div>
 +
</div>
 +
<div class="column2">
 +
<div class="box">
 +
  <h3>E. CARU Videogame</h3>
 +
<p>An entertaining way to learn the bases of the modules from our project. </p>
 +
  <a href="#" class="button button-small">Download it!</a> </div>
 +
</div>
 +
<div class="column3">
 +
<div class="box">
 +
  <h3>Math Model</h3>
 +
<p>Our mathematical model to predict our project behaivor. </p>
 +
  <a href="#" class="button button-small">Learn More</a> </div>
 +
</div>
 +
<div class="column4">
 +
<div class="box">
 +
  <h3>DNA Week</h3>
 +
<p>Fun activities to teach students from our high school about sinthetic biology. </p>
 +
  <a href="#" class="button button-small">Learn More</a> </div>
</div>
</div>
</div>
</div>

Revision as of 04:10, 27 May 2014

Documento sin título

Welcome to our wiki

We are iGEM CIDEB 2014 team, from CIDEB high school in Monterrey, Nuevo Leon, Mexico. This year, our proyect is E. CARU, a biofilter that helps eliminate Sodium ions from water, in order to make it clean for human consumption. In this wiki, you can learn from our proyect, our activities, and our experiments.

E. CARU

Learn the four modules from our proyect to understand how E. CARU works. Also, learn the benefits from our biofilter.

Learn More

Wet-Lab

See our work inside the lab! Including our construction plan, our lab notebook, our project experiments, and their results.

Learn More

Conclusions

See the final conclusion of the wet-lab experiments and the mathematical model. Also, read the future plans of the project.

Learn More

iGEM CIDEB Race

More than 600 persons, learning from our project and iGEM, while exercising.

Learn More

E. CARU Videogame

An entertaining way to learn the bases of the modules from our project.

Download it!

Math Model

Our mathematical model to predict our project behaivor.

Learn More

DNA Week

Fun activities to teach students from our high school about sinthetic biology.

Learn More

Retrieved from "http://2014hs.igem.org/Team:CIDEB-UANL_Mexico"