Team:Colombia/HP

From 2014.igem.org

(Difference between revisions)
Line 3: Line 3:
<html>
<html>
-
<!--PART IV: Text Buttons-->
+
<a href="#"><div class="button-fill grey"><div class="button-text">Learn More</div><div class="button-inside"><div class="inside-text">Learn&nbspMore</div></div></div></a><a href="#"><div class="button-fill orange"><div class="button-text">Learn More</div><div class="button-inside"><div class="inside-text">Learn&nbspMore</div></div></div></a>
-
<!--CSS-->
+
-
<style>
+
-
* {
+
-
  font-family: 'Open Sans', sans-serif;
+
-
}
+
-
.button-fill {
+
-
  text-align: center;
+
-
  background: #ccc;
+
-
  display: inline-block;
+
-
  position: relative;
+
-
  text-transform: uppercase;
+
-
  margin: 25px;
+
-
}
+
-
.button-fill.grey {
+
-
  background: #445561;
+
-
  color: white;
+
-
}
+
-
.button-fill.orange {
+
-
  background: #f26b43;
+
-
  color: #fff;
+
-
}
+
-
.button-fill.orange .button-inside {
+
-
  color: #f26b43;
+
-
}
+
-
.button-fill.orange .button-inside.full {
+
-
  border: 1px solid #f26b43;
+
-
}
+
-
.button-text {
+
-
  padding: 0 25px;
+
-
  line-height: 56px;
+
-
  letter-spacing: .1em;
+
-
}
+
-
.button-inside {
+
-
  width: 0px;
+
-
  height: 54px;
+
-
  margin: 0;
+
-
  float: left;
+
-
  position: absolute;
+
-
  top: 1px;
+
-
  left: 50%;
+
-
  line-height: 54px;
+
-
  color: #445561;
+
-
  background: #fff;
+
-
  text-align: center;
+
-
  overflow: hidden;
+
-
  -webkit-transition: width 0.5s, left 0.5s, margin 0.5s;
+
-
  -moz-transition: width 0.5s, left 0.5s, margin 0.5s;
+
-
  -o-transition: width 0.5s, left 0.5s, margin 0.5s;
+
-
  transition: width 0.5s, left 0.5s, margin 0.5s;
+
-
}
+
-
.button-inside.full {
+
-
  width: 100%;
+
-
  left: 0%;
+
-
  top: 0;
+
-
  margin-right: -50px;
+
-
  border: 1px solid #445561;
+
-
}
+
-
.inside-text {
+
-
  text-align: center;
+
-
  position: absolute;
+
-
  right: 50%;
+
-
  letter-spacing: .1em;
+
-
  text-transform: uppercase;
+
-
  -webkit-transform: translateX(50%);
+
-
  -moz-transform: translateX(50%);
+
-
  -ms-transform: translateX(50%);
+
-
  transform: translateX(50%);
+
-
}
+
-
</style>
+
-
 
+
-
<!--JS-->
+
-
<script type="text/javascript">
+
-
$(".button-fill").hover(function () {
+
-
    $(this).children(".button-inside").addClass('full');
+
-
}, function() {
+
-
  $(this).children(".button-inside").removeClass('full');
+
-
});
+
-
</script>
+
-
 
+
-
<a href="#"><div class="button-fill grey"><div class="button-text">Learn More</div><div class="button-inside"><div class="inside-text">Learn&nbspMore</div></div></div></a>
+
-
<a href="#"><div class="button-fill orange"><div class="button-text">Learn More</div><div class="button-inside"><div class="inside-text">Learn&nbspMore</div></div></div></a>
+
<div class="span11" style="text-align: justify;">
<div class="span11" style="text-align: justify;">

Revision as of 00:27, 29 September 2014

Wheeltz - CSS3 Navigational Wheel Menu

  • Home
  • iGEM
  • Facebook
  • Twitter

<div class="button-fill grey">

Learn More
Learn&nbspMore
Learn More
Learn&nbspMore
</div>

Human Practices



You're more than welcome to explore all our Human Practices' activities. Click on the buttom of each one to get the full information about it. We hope you like them!



Low-Budget Lab Contest

LowBudgetLab.jpg


Money could be a serious problem for research when it is not available. That's why this year we devise a new approach on Human Practice as a way to develop cheap but also efficent processes to be used in any molecular biology laboratory. At the same time we take advantage of this idea for collaborate with other iGEM teams around the world, this in a little and fun contest that allow us to get a big set of interesting ideas.


<div class="button-fill orange">
Learn More
Learn&nbspMore
</div>









Interviewing Experts

InterviewExpertss.jpg


The experts' opinions is always a priority for us. In this opportunity we talked to experts in Food Microbiology and Ethics. Their comments were used as a source of feedback and improvment for the project.


Interviews







Industry, Economic,

and Ethical Issues

Logocolombiaigem.jpg


Because of our project is aimed to create a easy use kit to detect ''V. cholerae'' in foods and water is very important to have the opinion of whom would be the final users, that means the marine food and water industry. With the goal to get a feedback form them, we perform interviews about the viability of our idea. We also perform a deep analysis about the context of our project, focusing in economic and ethical issues.


What about?








Outreach

Outreachcolombia.jpg


At last, but not less important, we have our outreach. In this part of our Human Practice we talked to every kind of people about Synthetic Biology, iGEM, food-transmitted diseases (as cholerae is one of them) and our project using several fun ways to do it. In addition we inquire, for the first time, why our team (Universidad de los Andes) has been the only Colombian team during four years, while other latin american countries have several iGEM teams. Do other Colombian universities know about iGEM? Do they research in synthetic biology? Take a look of this section!


Outreach








Retrieved from "http://2014.igem.org/Team:Colombia/HP"