Difference between revisions of "Team:Costa Rica"

 
(126 intermediate revisions by 4 users not shown)
Line 1: Line 1:
{{Costa_Rica/NavBar}}{{Costa_Rica/BootStrap}}{{Costa_Rica/General}}
+
{{Costa_Rica/NavBar}}{{Costa_Rica/BootStrap}}
  
 
<html>
 
<html>
 +
<style>
 +
    .logo-link {
 +
        position: relative;
 +
        left: -20.9%;
 +
        top: -20px;
 +
        width: 98px;
 +
        height: 90px;
 +
        display: inline;
 +
    }
  
<main role="main">
+
    .text-link {
 +
        margin-left: -25px;
 +
        margin-top: 10px;
 +
        position: relative;
 +
        display: inline-block;
 +
    }
  
 +
    .link {
 +
        border-radius: 25px;
 +
        box-shadow: 1px 2px 10px 0 rgba(0, 0, 0, 0.2);
 +
        background-color: #ffffff;
 +
        height: 72px;
 +
    }
  
<p>
+
.iframe-container{
 +
  position: relative;
 +
  width: 100%;
 +
  padding-bottom: 56.25%;
 +
  height: 0;
 +
}
  
<h1> Welcome to iGEM 2019! </h1>
+
.slideshow-container{
<p>Coming soon...</p>
+
<div class="container marketing">
+
  
        <!-- Three columns of text below the carousel -->
+
background: none !important
        <div class="row">
+
}
          <div class="col-lg-3">
+
            <h2>Heading</h2>
+
            <p>La idea de esta seccion es crear un mini menu, todavia se debe averiguar como.</p>
+
          </div><!-- /.col-lg-3 -->
+
          <div class="col-lg-9">
+
            <h2>Aqui va todo lo de la pagina</h2>
+
            <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna. Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna. Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna. Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
+
         
+
<img src="https://static.igem.org/mediawiki/2019/8/84/T--Costa_Rica--ScienceThroughDance.jpeg" class="img-fluid" alt="Responsive image">
+
  
 +
.tab__title{
 +
  font-size:20px!important;
 +
  font-family: Montserrat !important;
 +
  padding:5px;
 +
}
 +
.iframe-container iframe{
 +
  position: absolute;
 +
  top:0;
 +
  left: 0;
 +
  width: 100%;
 +
  height: 100%;
 +
}
  
<div class="iframe-container" >
+
p.ref{
 +
    text-indent: -30px;
  
<iframe src="https://www.youtube.com/embed/WHn4IkQw5kE?rel=0" width="600" height="315" frameborder="0"></iframe>
+
    padding-left: 40px;
 +
}
  
</div>
+
#top_title {
          </div><!-- /.col-lg-4 -->
+
display: none;
      </div>
+
}
</div>
+
center{
 +
  font-family: Montserrat !important;
 +
}
  
</p>
+
#content {
 +
left: 0px;
 +
height: 100%;
 +
padding:0px;
 +
width:100%;
 +
margin-top:-7px;
 +
margin-left:0px;
 +
}
  
<div class="container marketing">
+
body {
 +
background-color:white;
 +
width:100%;
 +
padding-top: 125px;
 +
 
 +
}
 +
 
 +
h1{
 +
font-family: Montserrat !important;
 +
}
 +
 
 +
h2 {
 +
font-family: Montserrat !important;
 +
 
 +
}
 +
 
 +
 
 +
h3 {
 +
font-family: Montserrat !important;
 +
}
 +
h4 {
 +
font-family: Montserrat !important;
 +
}
 +
 
 +
.title-text {
 +
 
 +
}
 +
 
 +
.title-text:after {
 +
    content: ""; /* This is necessary for the pseudo element to work. */
 +
    display: block; /* This will put the pseudo element on its own line. */
 +
 
 +
    width: 28px; /* Change this to whatever width you want. */
 +
    padding-top: 10px; /* This creates some space between the element and the border. */
 +
    border-bottom: 3px solid #705ba0; /* This creates the border. Replace black with whatever color you want. */
 +
}
 +
 
 +
div > p{
 +
  font-family: Montserrat;
 +
 
 +
  font-size: 18px !important;
 +
 
 +
  color: #5d5d5d;
 +
}
 +
 
 +
.mw-body {width100% !important;}
 +
 
 +
@font-face {
 +
  font-family: 'Montserrat';
 +
  font-style: normal;
 +
  font-weight: 300;
 +
  src: url('https://static.igem.org/mediawiki/2019/4/43/T--Costa_Rica--montserrat-300.eot');
 +
  src: local('Montserrat'), local('Montserrat'),
 +
url('https://static.igem.org/mediawiki/2019/4/43/T--Costa_Rica--montserrat-300.eot') format('embedded-opentype'),
 +
url('https://static.igem.org/mediawiki/2019/5/54/T--Costa_Rica--montserrat-300.woff') format('woff'),
 +
url('https://static.igem.org/mediawiki/2019/b/b2/T--Costa_Rica--montserrat-300.ttf') format('truetype'),
 +
url('https://static.igem.org/mediawiki/2019/f/fe/T--Costa_Rica--montserrat-300.svg') format('svg');
 +
}
 +
 
 +
@font-face {
 +
  font-family: 'Montserrat';
 +
  font-style: normal;
 +
  font-weight: 500;
 +
  src: url('https://static.igem.org/mediawiki/2019/8/8d/T--Costa_Rica--montserrat-500.eot');
 +
  src: local('Montserrat'), local('Montserrat'),
 +
url('https://static.igem.org/mediawiki/2019/8/8d/T--Costa_Rica--montserrat-500.eot') format('embedded-opentype'),
 +
url('https://static.igem.org/mediawiki/2019/2/2d/T--Costa_Rica--montserrat-500.woff') format('woff'),
 +
url('https://static.igem.org/mediawiki/2019/9/9b/T--Costa_Rica--montserrat-500.ttf') format('truetype'),
 +
url('https://static.igem.org/mediawiki/2019/7/78/T--Costa_Rica--montserrat-500.svg') format('svg');
 +
}
 +
 
 +
@font-face {
 +
  font-family: 'Montserrat';
 +
  font-style: normal;
 +
  font-weight: regular;
 +
  src: url('https://static.igem.org/mediawiki/2019/0/07/T--Costa_Rica--montserrat-regular.eot');
 +
  src: local('Montserrat'), local('Montserrat'),
 +
url('https://static.igem.org/mediawiki/2019/0/07/T--Costa_Rica--montserrat-regular.eot') format('embedded-opentype'),
 +
url('https://static.igem.org/mediawiki/2019/3/38/T--Costa_Rica--montserrat-regular.woff') format('woff'),
 +
url('https://static.igem.org/mediawiki/2019/8/8e/T--Costa_Rica--montserrat-regular.ttf') format('truetype'),
 +
url('https://static.igem.org/mediawiki/2019/d/d9/T--Costa_Rica--montserrat-regular.svg') format('svg');
 +
}
 +
 
 +
 
 +
 
 +
@font-face {
 +
  font-family: 'Montserrat';
 +
  font-style: normal;
 +
  font-weight: 600;
 +
  src: url('https://static.igem.org/mediawiki/2019/0/0d/T--Costa_Rica--montserrat-600.eot');
 +
  src: local('Montserrat'), local('Montserrat'),
 +
url('https://static.igem.org/mediawiki/2019/0/0d/T--Costa_Rica--montserrat-600.eot') format('embedded-opentype'),
 +
url('https://static.igem.org/mediawiki/2019/d/d7/T--Costa_Rica--montserrat-600.woff') format('woff'),
 +
url('https://static.igem.org/mediawiki/2019/1/1a/T--Costa_Rica--montserrat-600.ttf') format('truetype'),
 +
url('https://static.igem.org/mediawiki/2019/0/0d/T--Costa_Rica--montserrat-600.svg') format('svg');
 +
}
 +
 
 +
.bolas1{
 +
 
 +
position:absolute;
 +
z-index:-2;
 +
top:60%;
 +
left:10%;
 +
}
 +
 
 +
.bolas2{
 +
 
 +
position:absolute;
 +
z-index:-2;
 +
top:40%;
 +
right:0%;
 +
}
 +
 
 +
.bolas3{
 +
 
 +
position:absolute;
 +
z-index:-2;
 +
top:80%;
 +
right:0%;
 +
}
 +
 
 +
 
 +
</style>
 +
<img class="bolas1" src="https://static.igem.org/mediawiki/2019/5/52/T--Costa_Rica--team-L3.png">
 +
<img class="bolas2" src="https://static.igem.org/mediawiki/2019/f/f1/T--Costa_Rica--team-L1.png">
 +
<img class="bolas3" src="https://static.igem.org/mediawiki/2019/0/04/T--Costa_Rica--team-L2.png">
 +
</style>
 +
<main role="main">
 +
 
 +
 
 +
    <div class="container" >
 +
        <div class="row" style="margin-bottom: 10px">
 +
            <div class="col-md-6"><img src="https://static.igem.org/mediawiki/2019/e/eb/T--Costa_Rica--TituloMain.png"
 +
                    class="img-fluid"></div>
 +
            <div class="col-md-4"><img src="https://static.igem.org/mediawiki/2019/thumb/6/6d/T--Costa_Rica--team-I2.png/644px-T--Costa_Rica--team-I2.png" style="width:50%;margin-left:20%;" ></div>
 +
 
 +
            <div class="col-md-2"><img src="https://static.igem.org/mediawiki/2019/5/52/T--Costa_Rica--team-L3.png" class="img-fluid"></div>
 +
        </div>
 +
        <div class="row shadow" style="margin-bottom: 100px">
 +
            <video controls autoplay style="width:100%;">
 +
                <source src="https://static.igem.org/mediawiki/2019/1/17/T--Costa_Rica--diffEASY_video.mp4" type="video/mp4">
 +
                Your browser does not support HTML5 video.
 +
            </video>
 +
        </div>
 +
        <div class="row" style="margin-bottom:60px;">
 +
            <div class="col-md-6">
 +
                <img src="https://static.igem.org/mediawiki/2019/f/f3/T--Costa_Rica--TituloMainProject.png"
 +
                    class="img-fluid">
 +
            </div>
 +
            <div class="col-md-6"></div>
 +
        </div>
 +
        <div class="row" style="margin-bottom:30px;">
 +
            <div class="col-md-4">
 +
                <div class="link">
 +
                    <img class="logo-link" src="https://static.igem.org/mediawiki/2019/c/c3/T--Costa_Rica--team-G4.png">
 +
                    <a href="https://2019.igem.org/Team:Costa_Rica/Description">
 +
                        <h4 class="text-link">Description</h4>
 +
                    </a>
 +
 
 +
                </div>
 +
            </div>
 +
            <div class="col-md-2"></div>
 +
            <div class="col-md-4">
 +
                <div class="link">
 +
                    <img class="logo-link" src="https://static.igem.org/mediawiki/2019/f/f7/T--Costa_Rica--team-G3.png">
 +
 
 +
                    <a href="https://2019.igem.org/Team:Costa_Rica/Model">
 +
                        <h4 class="text-link">Modeling</h4>
 +
                    </a>
 +
                </div>
 +
            </div>
 +
        </div>
 +
        <div class="col-md-2"></div>
 +
        <div class="row" style="padding-bottom: 200px">
 +
            <div class="col-md-2"></div>
 +
            <div class="col-md-4">
 +
                <div class="link">
 +
                    <img class="logo-link" src="https://static.igem.org/mediawiki/2019/0/02/T--Costa_Rica--team-G2.png">
 +
 
 +
                    <a href="https://2019.igem.org/Team:Costa_Rica/Results">
 +
                        <h4 class="text-link">Results</h4>
 +
                    </a>
 +
 
 +
                </div>
 +
            </div>
 +
            <div class="col-md-2"></div>
 +
            <div class="col-md-4">
 +
                <div class="link">
 +
                    <img class="logo-link" src="https://static.igem.org/mediawiki/2019/c/ce/T--Costa_Rica--team-G5.png">
 +
 
 +
                    <a href="https://2019.igem.org/Team:Costa_Rica/Public_Engagement">
 +
                        <h4 class="text-link">Human Practice</h4>
 +
                    </a>
 +
                </div>
 +
            </div>
 +
        </div>
 +
        <div class="row"style="padding-bottom: 100px">
 +
            <div class="col-md-8">
 +
                <img src="https://static.igem.org/mediawiki/2019/6/6c/T--Costa_Rica--UnderTeamDescription.png" class="img-fluid">
 +
                <img src="https://static.igem.org/mediawiki/2019/6/6b/T--Costa_Rica--TeamDescription.png" style="position: absolute; left:14%; top:17%; width: 45%;">
 +
            <div style=" width: 65%;
 +
            height: 36%;
 +
            position:absolute; left:14%; top:42%;"><p>We are Costa Rica's iGEM team! Just a few people with big dreams, coming from three different universities: the University of Costa Rica (UCR), the National University (UNA) and the Costa Rican Institute of Technology (ITCR). We all met by luck, in many different circumstances, such as tiny Synthetic Biology competitions in the ITCR, by a guy who met a guy, or by being close friends from long ago.</p></div>
 +
            </div>
 +
            <div class="col-md-4">                <img src="https://static.igem.org/mediawiki/2019/2/25/T--Costa_Rica--team-E1.png" class="img-fluid" style="margin-left:-10%;margin-top:20%;">
 +
            </div>
 +
 
 +
        </div>
  
        <!-- Three columns of text below the carousel -->
 
        <div class="row">
 
          <div class="col-lg-4">
 
            <img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
 
            <h2>Heading</h2>
 
            <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
 
            <p><a class="btn btn-secondary" href="#" role="button">View details »</a></p>
 
          </div><!-- /.col-lg-4 -->
 
          <div class="col-lg-4">
 
            <img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
 
            <h2>Heading</h2>
 
            <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p>
 
            <p><a class="btn btn-secondary" href="#" role="button">View details »</a></p>
 
          </div><!-- /.col-lg-4 -->
 
          <div class="col-lg-4">
 
            <img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
 
            <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>
 
            <p><a class="btn btn-secondary" href="#" role="button">View details »</a></p>
 
          </div><!-- /.col-lg-4 -->
 
        </div><!-- /.row -->
 
  
  
     
 
 
     </div>
 
     </div>
 +
 +
 +
  
 
</main>
 
</main>

Latest revision as of 21:21, 13 December 2019

We are Costa Rica's iGEM team! Just a few people with big dreams, coming from three different universities: the University of Costa Rica (UCR), the National University (UNA) and the Costa Rican Institute of Technology (ITCR). We all met by luck, in many different circumstances, such as tiny Synthetic Biology competitions in the ITCR, by a guy who met a guy, or by being close friends from long ago.

"La ciencia es lo que entendemos lo suficientemente bien como para explicarle a una computadora. Arte es todo lo demás que hacemos".

— Donald Knuth.