(32 intermediate revisions by the same user not shown) | |||
Line 20: | Line 20: | ||
vertical-align: middle; | vertical-align: middle; | ||
background-color: rgba(0, 0, 0, 0.2); | background-color: rgba(0, 0, 0, 0.2); | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
#synbiothon-details { margin-top: 20px; } | #synbiothon-details { margin-top: 20px; } | ||
#synbiothon-details .row { margin-top: 10px; } | #synbiothon-details .row { margin-top: 10px; } | ||
− | #synbiothon-details .row .col-sm-3 { height: 350px; } | + | #synbiothon-details .row .col-sm-3 { |
+ | height: 350px; | ||
+ | margin-bottom: 20px; | ||
+ | } | ||
.panel { | .panel { | ||
border-radius: 0 !important; | border-radius: 0 !important; | ||
Line 58: | Line 47: | ||
border-bottom-left-radius: 0px; | border-bottom-left-radius: 0px; | ||
border-bottom-right-radius: 0px; | border-bottom-right-radius: 0px; | ||
+ | height: 125px; | ||
} | } | ||
.panel-body { height: 125px; } | .panel-body { height: 125px; } | ||
Line 71: | Line 61: | ||
color: #fff; | color: #fff; | ||
} | } | ||
− | + | #syn-video h1 { text-align: center; } | |
− | + | #syn-video video { | |
− | + | display: block; | |
− | + | margin: 0 auto; | |
− | + | width: 800px; | |
− | + | height: 450px; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | margin | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | height: | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | #synbiothon-details .row { | |
− | + | padding-top: 20px; | |
− | + | border-top: 1px solid #d3d3d3; | |
− | + | ||
− | + | ||
− | + | ||
} | } | ||
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) { | @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) { | ||
Line 126: | Line 81: | ||
.panel { height: auto; } | .panel { height: auto; } | ||
.panel-body { height: auto; } | .panel-body { height: auto; } | ||
+ | .panel-heading { height: auto; } | ||
} | } | ||
@media screen and (max-width: 480px) { | @media screen and (max-width: 480px) { | ||
.panel { height: auto; } | .panel { height: auto; } | ||
.panel-body { height: auto; } | .panel-body { height: auto; } | ||
− | + | .panel-heading { height: auto; } | |
+ | } | ||
@media screen and (max-width: 480px) { | @media screen and (max-width: 480px) { | ||
} | } | ||
Line 137: | Line 94: | ||
<main class="synbiothon well"> | <main class="synbiothon well"> | ||
<div class="jumbotron text-center parallax"> | <div class="jumbotron text-center parallax"> | ||
− | <h1 style="font-size: 50px;">SynBioThon 2016<br><span>Rewriting the code</span></h1> | + | <h1 style="font-size: 50px;">SynBioThon 2016<br><span>Rewriting the code</span></h1> |
</div> | </div> | ||
<div class="concept"> | <div class="concept"> | ||
− | <p style="text-align: center;">SynBioThon 2016 (SBT16) is a Synthetic Biology competition, in which teams of students work for a weekend to create an in silico genetic device that can solve some kind of problem. | + | <p style="text-align: center;">SynBioThon 2016 (SBT16) is a Synthetic Biology competition, in which teams of students work for a weekend to create an <em>in silico</em> genetic device that can solve some kind of problem. SBT16 was organized not only as a mean to promote Synthetic Biology within the community but also to make aware about the importance of the application of Synthetic Biology as a high potential tool that allows technological development in Costa Rica. As an iGEM team, we wanted to improve innovation, creativity, and teamwork among participants; we worked to generate a space for student’s active participation in science.</p> |
− | + | ||
</div> | </div> | ||
− | <h1> | + | <div id="syn-video" class="container-fluid"> |
− | <p>For SBT16, we had diverse talks in different classes and universities, trying to reach the most diverse participants. In our | + | <h1>Take a look at SynBioThon 2016!</h1> |
− | <div id="synbiothon-details" class="container-fluid"> | + | <video controls poster="https://static.igem.org/mediawiki/2016/1/1e/T--TEC-Costa_Rica--prostal_human_practice_synbio.png"> |
− | <div class="row | + | <source src="https://static.igem.org/mediawiki/2016/0/0e/T--TEC-Costa_Rica--Video_SBT.mp4" type="video/mp4"> |
+ | Your browser does not support HTML5 video. | ||
+ | </video> | ||
+ | </div> | ||
+ | <div id="reach" class="container-fluid slideanim"> | ||
+ | <h1>Reach</h1> | ||
+ | <img src="https://static.igem.org/mediawiki/2016/9/97/T--TEC-Costa_Rica--prostal_hp_reach.png" class="img-responsive" alt="Prostal Reach"> | ||
+ | <p>For SBT16, we had diverse talks in different classes and universities, trying to reach the most diverse participants for our event but also for promoting Synthetic Biology within students. In our university (TEC), we spoke with people of different majors (Biotechnology Engineering, Material Science, Agricultural Engineering, and others). We also went to University of Costa Rica (UCR), where we spoke with people of Biology, Microbiology, and Pharmacy, and to the National University (UNA), where we talked to students of Biology. We also gave talks in other universities such as UCIMED (Medical School), and LEAD University (Business Management).</p> | ||
+ | <br> | ||
+ | <p>Prior to the event, we had preparatory workshops with students so they could get a grasp of genetics, molecular biology, and bioinformatics if they weren’t familiar with them. A total of eight workshops were imparted at UCR, UNA, and TEC. We had about 80 students overall in a full-day session. We had a theoric section, and then an activity to test the concepts, and after lunch a demonstrative session of bioinformatics, centered in databases and Benchling, which was followed by work.</p> | ||
+ | <p>These workshops encouraged students to participate in SBT16, so once the inscription closed we had 78 students from three different universities, willing to participate in our 54-hour SynBio competition.</p> | ||
+ | </div> | ||
+ | <div id="synbiothon-details" class="container-fluid slideanim"> | ||
+ | <div class="row"> | ||
<div class="col-sm-3"> | <div class="col-sm-3"> | ||
<div class="panel panel-default text-center"> | <div class="panel panel-default text-center"> | ||
<div class="panel-heading"> | <div class="panel-heading"> | ||
− | <h1> | + | <h1>Biohacker's Journal</h1> |
</div> | </div> | ||
<div class="panel-body"> | <div class="panel-body"> | ||
− | <p style="text-align: center;"> | + | <p style="text-align: center;">What really happened at SBT16!</p> |
</div> | </div> | ||
<div class="panel-footer"> | <div class="panel-footer"> | ||
− | <a href="https://2016.igem.org/Team:TEC-Costa_Rica/Human_Practice/Synbiothon/ | + | <a href="https://2016.igem.org/Team:TEC-Costa_Rica/Human_Practice/Synbiothon/Biohacker_Journal"><button class="btn btn-lg">Read More</button></a> |
</div> | </div> | ||
</div> | </div> | ||
− | </div> | + | </div> |
<div class="col-sm-3"> | <div class="col-sm-3"> | ||
<div class="panel panel-default text-center"> | <div class="panel panel-default text-center"> | ||
<div class="panel-heading"> | <div class="panel-heading"> | ||
− | <h1> | + | <h1>Projects</h1> |
</div> | </div> | ||
<div class="panel-body"> | <div class="panel-body"> | ||
− | <p style="text-align: center;"> | + | <p style="text-align: center;">Here you can read about the 15 projects that were generated at SBT16.</p> |
</div> | </div> | ||
<div class="panel-footer"> | <div class="panel-footer"> | ||
− | <a href="https://2016.igem.org/Team:TEC-Costa_Rica/Human_Practice/Synbiothon/ | + | <a href="https://2016.igem.org/Team:TEC-Costa_Rica/Human_Practice/Synbiothon/Projects"><button class="btn btn-lg">Read More</button></a> |
</div> | </div> | ||
</div> | </div> | ||
− | </div> | + | </div> |
<div class="col-sm-3"> | <div class="col-sm-3"> | ||
<div class="panel panel-default text-center"> | <div class="panel panel-default text-center"> | ||
<div class="panel-heading"> | <div class="panel-heading"> | ||
− | <h1> | + | <h1>Mentors & Judges</h1> |
</div> | </div> | ||
<div class="panel-body"> | <div class="panel-body"> | ||
− | <p style="text-align: center;"> | + | <p style="text-align: center;">Molecular and Synthetic Biology experts were invited to join SBT16. Check them out!</p> |
</div> | </div> | ||
<div class="panel-footer"> | <div class="panel-footer"> | ||
− | <a href=""><button class="btn btn-lg">More</button></a> | + | <a href="https://2016.igem.org/Team:TEC-Costa_Rica/Human_Practice/Synbiothon/Mentors_Judges"><button class="btn btn-lg">Read More</button></a> |
</div> | </div> | ||
</div> | </div> | ||
− | </div> | + | </div> |
<div class="col-sm-3"> | <div class="col-sm-3"> | ||
<div class="panel panel-default text-center"> | <div class="panel panel-default text-center"> | ||
<div class="panel-heading"> | <div class="panel-heading"> | ||
− | <h1> | + | <h1>Evaluation & Winners</h1> |
</div> | </div> | ||
<div class="panel-body"> | <div class="panel-body"> | ||
− | <p style="text-align: center;"> | + | <p style="text-align: center;">How were the winners selected? Take a look here!</p> |
</div> | </div> | ||
<div class="panel-footer"> | <div class="panel-footer"> | ||
− | <a href=""><button class="btn btn-lg">More</button></a> | + | <a href="https://2016.igem.org/Team:TEC-Costa_Rica/Human_Practice/Synbiothon/Evaluation_Winners"><button class="btn btn-lg">Read More</button></a> |
</div> | </div> | ||
</div> | </div> | ||
− | </div> | + | </div> |
</div> | </div> | ||
</div> | </div> | ||
<!-- | <!-- | ||
− | <div class="container-fluid"> | + | <div class="comments container-fluid"> |
− | <div class="row"> | + | <div class="row slideanim"> |
− | + | <img class="img-responsive" src="https://static.igem.org/mediawiki/2016/3/3c/T--TEC-Costa_Rica--prostal_hp_projects_commet1.jpg" alt="Comment 1"> | |
− | + | </div> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | </div> | + | |
</div> | </div> | ||
--> | --> | ||
Line 270: | Line 182: | ||
nav.className += " active"; | nav.className += " active"; | ||
− | var panels | + | var panels = document.querySelectorAll(".panel"); |
var panelsFooter = document.querySelectorAll(".panel-footer"); | var panelsFooter = document.querySelectorAll(".panel-footer"); | ||
var panelsHeading = document.querySelectorAll(".panel-heading"); | var panelsHeading = document.querySelectorAll(".panel-heading"); | ||
var panelsFooterBtn = document.querySelectorAll(".panel-footer .btn"); | var panelsFooterBtn = document.querySelectorAll(".panel-footer .btn"); | ||
var colors = ["#0091d7", "#eb7f00"]; | var colors = ["#0091d7", "#eb7f00"]; | ||
− | |||
for (var i = 0; i < panelsFooter.length; i++) { | for (var i = 0; i < panelsFooter.length; i++) { | ||
var color = colors[i % 2]; | var color = colors[i % 2]; | ||
panels[i].style.border = "1px solid " + color; | panels[i].style.border = "1px solid " + color; | ||
− | panelsFooter[i].backgroundColor = color; | + | panelsFooter[i].style.backgroundColor = color; |
− | panelsHeading[i].backgroundColor = color; | + | panelsHeading[i].style.backgroundColor = color; |
− | panelsFooterBtn[i].backgroundColor = color; | + | panelsFooterBtn[i].style.backgroundColor = color; |
} | } | ||
</script> | </script> |
Latest revision as of 17:24, 19 October 2016
SynBioThon 2016
Rewriting the code
SynBioThon 2016 (SBT16) is a Synthetic Biology competition, in which teams of students work for a weekend to create an in silico genetic device that can solve some kind of problem. SBT16 was organized not only as a mean to promote Synthetic Biology within the community but also to make aware about the importance of the application of Synthetic Biology as a high potential tool that allows technological development in Costa Rica. As an iGEM team, we wanted to improve innovation, creativity, and teamwork among participants; we worked to generate a space for student’s active participation in science.