Difference between revisions of "Template:BIMATOX Project"

 
(88 intermediate revisions by the same user not shown)
Line 82: Line 82:
 
   var i;
 
   var i;
 
   var slides = document.getElementsByClassName("mySlides");
 
   var slides = document.getElementsByClassName("mySlides");
−
   var dots = document.getElementsByClassName("demo");
+
   var dots = document.getElementsByClassName("dot");
−
  var captionText = document.getElementById("caption");
+
   if (n > slides.length) {slideIndex = 1}  
−
   if (n > slides.length) {slideIndex = 1}
+
 
   if (n < 1) {slideIndex = slides.length}
 
   if (n < 1) {slideIndex = slides.length}
 
   for (i = 0; i < slides.length; i++) {
 
   for (i = 0; i < slides.length; i++) {
−
    slides[i].style.display = "none";
+
      slides[i].style.display = "none";
 
   }
 
   }
 
   for (i = 0; i < dots.length; i++) {
 
   for (i = 0; i < dots.length; i++) {
−
    dots[i].className = dots[i].className.replace(" active", "");
+
      dots[i].className = dots[i].className.replace(" active", "");
 
   }
 
   }
−
   slides[slideIndex-1].style.display = "block";
+
   slides[slideIndex-1].style.display = "block";
 
   dots[slideIndex-1].className += " active";
 
   dots[slideIndex-1].className += " active";
−
  captionText.innerHTML = dots[slideIndex-1].alt;
 
 
}
 
}
  
Line 119: Line 117:
 
     background-color: #CA6065;
 
     background-color: #CA6065;
 
     font-family: Arial;
 
     font-family: Arial;
−
    font-weight: bold;
 
 
     width:100%;
 
     width:100%;
 
     height:100px;
 
     height:100px;
Line 127: Line 124:
 
.navbar a {
 
.navbar a {
 
     float: left;
 
     float: left;
−
     font-size: 22px;
+
     font-size: 18px;
 +
    font-family: Arial;
 +
    font-weight: bold;
 
     color: #2F4641;
 
     color: #2F4641;
 
     text-align: center;
 
     text-align: center;
−
     padding: 43px 16px;
+
     padding: 45px 16px;
 
     text-decoration: none;
 
     text-decoration: none;
 
}
 
}
Line 149: Line 148:
 
.dropdown .dropbtn {
 
.dropdown .dropbtn {
 
     cursor: pointer;
 
     cursor: pointer;
−
     font-size: 22px;     
+
     font-size: 18px;     
 
     border: none;
 
     border: none;
 
     outline: none;
 
     outline: none;
Line 165: Line 164:
 
     position: absolute;
 
     position: absolute;
 
     background-color: #49A4AC;
 
     background-color: #49A4AC;
 +
    font-family: Arial;
 
     min-width: 160px;
 
     min-width: 160px;
 
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
Line 173: Line 173:
 
     float: none;
 
     float: none;
 
     color: white;
 
     color: white;
 +
    font-family: Arial;
 
     padding: 12px 16px;
 
     padding: 12px 16px;
 
     text-decoration: none;
 
     text-decoration: none;
Line 185: Line 186:
 
.show {
 
.show {
 
     display: block;
 
     display: block;
 +
}
 +
 +
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
 +
@media screen and (max-width: 600px) {
 +
  .navbar a:not(:first-child) {display: none;}
 +
  .navbar a.icon {
 +
    float: right;
 +
    display: block;
 +
  }
 +
}
 +
 +
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
 +
@media screen and (max-width: 600px) {
 +
  .navbar.responsive {position: relative;}
 +
  .navbar.responsive a.icon {
 +
    position: absolute;
 +
    right: 0;
 +
    top: 0;
 +
  }
 +
  .navbar.responsive a {
 +
    float: none;
 +
    display: block;
 +
    text-align: left;
 +
  }
 
}
 
}
  
Line 205: Line 230:
 
     text-align: center;
 
     text-align: center;
 
     padding: 0 0 0 0;
 
     padding: 0 0 0 0;
−
}
 
−
 
−
/* SLIDESHOW GALERY */
 
−
 
−
/* Slideshow container */
 
−
.slideshow-container {
 
−
  max-width: 1000px;
 
−
  position: relative;
 
−
  margin: auto;
 
−
}
 
−
 
−
.mySlides {
 
−
    display: none;
 
−
}
 
−
 
−
/* Next & previous buttons */
 
−
.prev, .next {
 
−
  cursor: pointer;
 
−
  position: absolute;
 
−
  top: 50%;
 
−
  width: auto;
 
−
  margin-top: -22px;
 
−
  padding: 16px;
 
−
  color: white;
 
−
  font-weight: bold;
 
−
  font-size: 18px;
 
−
  transition: 0.6s ease;
 
−
  border-radius: 0 3px 3px 0;
 
−
}
 
−
 
−
/* Position the "next button" to the right */
 
−
.next {
 
−
  right: 0;
 
−
  border-radius: 3px 0 0 3px;
 
−
}
 
−
 
−
/* On hover, add a black background color with a little bit see-through */
 
−
.prev:hover, .next:hover {
 
−
  background-color: rgba(0,0,0,0.8);
 
−
}
 
−
 
−
/* Caption text */
 
−
.text {
 
−
  color: #f2f2f2;
 
−
  font-size: 15px;
 
−
  padding: 8px 12px;
 
−
  position: absolute;
 
−
  bottom: 8px;
 
−
  width: 100%;
 
−
  text-align: center;
 
−
}
 
−
 
−
/* Number text (1/3 etc) */
 
−
.numbertext {
 
−
  color: #f2f2f2;
 
−
  font-size: 12px;
 
−
  padding: 8px 12px;
 
−
  position: absolute;
 
−
  top: 0;
 
−
}
 
−
 
−
/* The dots/bullets/indicators */
 
−
.dot {
 
−
  cursor:pointer;
 
−
  height: 15px;
 
−
  width: 15px;
 
−
  margin: 0 2px;
 
−
  background-color: #bbb;
 
−
  border-radius: 50%;
 
−
  display: inline-block;
 
−
  transition: background-color 0.6s ease;
 
−
}
 
−
 
−
.active, .dot:hover {
 
−
  background-color: #CA6065;
 
−
}
 
−
 
−
/* Fading animation */
 
−
.fade {
 
−
  -webkit-animation-name: fade;
 
−
  -webkit-animation-duration: 1.5s;
 
−
  animation-name: fade;
 
−
  animation-duration: 1.5s;
 
−
}
 
−
 
−
@-webkit-keyframes fade {
 
−
  from {opacity: .4}
 
−
  to {opacity: 1}
 
−
}
 
−
 
−
@keyframes fade {
 
−
  from {opacity: .4}
 
−
  to {opacity: 1}
 
−
}
 
−
 
−
/* TEAM PRESENTATION */
 
−
 
−
/* Three columns side by side */
 
−
.column {
 
−
    float: left;
 
−
    width: 33.3%;
 
−
    margin-bottom: 16px;
 
−
    padding: 0 8px;
 
−
}
 
−
 
−
/* Display the columns below each other instead of side by side on small screens */
 
−
@media (max-width: 650px) {
 
−
    .column {
 
−
        width: 100%;
 
−
        display: block;
 
−
    }
 
−
}
 
−
 
−
/* Add some shadows to create a card effect */
 
−
.card {
 
−
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
 
−
}
 
−
 
−
/* Some left and right padding inside the container */
 
−
.container {
 
−
    padding: 0 16px;
 
−
}
 
−
 
−
/* Clear floats */
 
−
.container::after, .row::after {
 
−
    content: "";
 
−
    clear: both;
 
−
    display: table;
 
−
}
 
−
 
−
.title {
 
−
    color: grey;
 
−
}
 
−
 
−
.button {
 
−
    border: none;
 
−
    outline: 0;
 
−
    display: inline-block;
 
−
    padding: 8px;
 
−
    color: white;
 
−
    background-color: #000;
 
−
    text-align: center;
 
−
    cursor: pointer;
 
−
    width: 100%;
 
−
}
 
−
 
−
.button:hover {
 
−
    background-color: #555;
 
 
}
 
}
  
Line 359: Line 236:
 
/* Wrapper for the content */
 
/* Wrapper for the content */
 
.igem_2017_content_wrapper {
 
.igem_2017_content_wrapper {
−
width: 90%;
+
width: 86%;
−
padding-top:11%;
+
padding-top:8%;
−
padding-left:5%;
+
padding-left:7%;
−
padding-bottom:18%;
+
padding-bottom:20%;
−
padding-right:5%;
+
padding-right:7%;
 
display:block;
 
display:block;
 
float:left;  
 
float:left;  
 
overflow-y:hidden;  
 
overflow-y:hidden;  
−
font-family: 'Microsoft', sans-serif !important;
 
 
margin: 0px 0px -20px 0px;
 
margin: 0px 0px -20px 0px;
 
background-image: url('https://static.igem.org/mediawiki/2017/a/a9/T--Uchile_Biotec--Fondo2.jpg');
 
background-image: url('https://static.igem.org/mediawiki/2017/a/a9/T--Uchile_Biotec--Fondo2.jpg');
 
background-repeat: no-repeat;
 
background-repeat: no-repeat;
−
background-position: right top;  
+
background-position: right top;
 +
background-color: #C0DACF;  
 
}
 
}
  
Line 379: Line 256:
 
/* styling for the titles h1 */
 
/* styling for the titles h1 */
 
.igem_2017_content_wrapper h1 {
 
.igem_2017_content_wrapper h1 {
−
padding:5px 15px;  
+
padding:15px 15px 20px !important;  
 
border-bottom: 0px;  
 
border-bottom: 0px;  
−
color: #CA6065;
+
color: #CC6666;
 
font-size: 30px !important;
 
font-size: 30px !important;
 
}
 
}
Line 387: Line 264:
 
/* styling for the titles h2 */
 
/* styling for the titles h2 */
 
.igem_2017_content_wrapper h2 {  
 
.igem_2017_content_wrapper h2 {  
−
padding:5px 24px;  
+
padding:15px 24px 15px !important;  
 
border-bottom: 0px;  
 
border-bottom: 0px;  
−
color: #CA6065;
+
color: #CE6161;
 
font-size: 28px !important;
 
font-size: 28px !important;
 
}
 
}
Line 430: Line 307:
 
font-size: 18px !important;
 
font-size: 18px !important;
 
text-shadow: -1px 0 #C0DACF, 0 1px #C0DACF, 1px 0 #C0DACF, 0 -1px #C0DACF;
 
text-shadow: -1px 0 #C0DACF, 0 1px #C0DACF, 1px 0 #C0DACF, 0 -1px #C0DACF;
−
font-family: 'Microsoft', sans-serif !important;
 
 
}
 
}
  
Line 455: Line 331:
 
.igem_2017_content_wrapper ul {
 
.igem_2017_content_wrapper ul {
 
padding:0px 20px;
 
padding:0px 20px;
−
font-size: 13px;
+
font-size: 18px !important;
 
font-family:Tahoma, Geneva, sans-serif;  
 
font-family:Tahoma, Geneva, sans-serif;  
 
}
 
}
Line 462: Line 338:
 
.igem_2017_content_wrapper ol {
 
.igem_2017_content_wrapper ol {
 
padding:0px;  
 
padding:0px;  
−
font-size: 13px;
+
font-size: 18px !important;
 
font-family:Tahoma, Geneva, sans-serif;  
 
font-family:Tahoma, Geneva, sans-serif;  
 
}
 
}
Line 470: Line 346:
 
width: 97%;  
 
width: 97%;  
 
margin:15px 10px;  
 
margin:15px 10px;  
−
border: 1px solid #d3d3d3;  
+
border: 1px solid #dclass="dropbtn" onclick="3d3d3;  
 
border-collapse: collapse;  
 
border-collapse: collapse;  
 
}
 
}
Line 575: Line 451:
  
 
/***************************************************** RESPONSIVE STYLING ****************************************************/
 
/***************************************************** RESPONSIVE STYLING ****************************************************/
−
 
+
class="dropbtn" onclick="
 
</Style>
 
</Style>
  
Line 586: Line 462:
 
<head>
 
<head>
  
−
<div class="navbar">
+
<div class="navbar" id="myTopnav">
  
 
   <img src="https://static.igem.org/mediawiki/2017/1/13/T--Uchile_Biotec--LogoFull.jpg" style="width:100px;height:100px;margin: 0px 0px 0px 10px"></img>
 
   <img src="https://static.igem.org/mediawiki/2017/1/13/T--Uchile_Biotec--LogoFull.jpg" style="width:100px;height:100px;margin: 0px 0px 0px 10px"></img>
Line 599: Line 475:
 
     <div class="dropdown-content" id="1">
 
     <div class="dropdown-content" id="1">
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Team">Team</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Team">Team</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Collaborations">Collaborations</a>
 
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/igem_latam">iGEM Latam</a>
 
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Sponsors">Sponsors</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Sponsors">Sponsors</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Attributions">Attributions</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Attributions">Attributions</a>
 
     </div>
 
     </div>
 
   </div>  
 
   </div>  
 +
 +
  <a href="https://2017.igem.org/Team:UChile_Biotec/igem_latam">iGEM LATAM</a>
  
 
   <div class="dropdown">
 
   <div class="dropdown">
 
     <button class="dropbtn" onclick="myFunction('2')"><b>Project∇</b>
 
     <button class="dropbtn" onclick="myFunction('2')"><b>Project∇</b>
 +
    </button>
 
     <div class="dropdown-content" id="2">
 
     <div class="dropdown-content" id="2">
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Proyect">Description</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Proyect">Description</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Design">Design</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Design">Design</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Experiments">Experiments</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Experiments">Experiments</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Contribution">Contribution</a>
 
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Collaborations">Collaborations</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Collaborations">Collaborations</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Afters">Improve</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Afters">Improve</a>
Line 623: Line 499:
 
     <div class="dropdown-content" id="6">
 
     <div class="dropdown-content" id="6">
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Notebook">Notebook</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Notebook">Notebook</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/InterLab">InterLab</a>
 
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Model">Model</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Model">Model</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Results">Results</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Results">Results</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Demonstrate">Demonstrate</a>
 
 
     </div>
 
     </div>
 
   </div>  
 
   </div>  
Line 632: Line 506:
 
   <a href="https://2017.igem.org/Team:UChile_Biotec/Parts">Parts</a>
 
   <a href="https://2017.igem.org/Team:UChile_Biotec/Parts">Parts</a>
  
−
   <a href="https://2017.igem.org/Team:UChile_Biotec/Safety">Safety</a>
+
   <a href="https://2017.igem.org/Team:UChile_Biotec/Safety"><b>Safety</b></a>
  
 
   <div class="dropdown">
 
   <div class="dropdown">
Line 644: Line 518:
 
   </div>  
 
   </div>  
  
−
   <div class="dropdown">
+
   <a href="https://2017.igem.org/Team:UChile_Biotec/Judging"><b>For Judges</b></a>
−
    <button class="dropbtn" onclick="myFunction('5')"><b>Awards∇</b>
+
−
    </button>
+
−
    <div class="dropdown-content" id="5">
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Applied Design</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Entrepreneurship</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Hardware</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Measurement</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Model</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Plant</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Software</a>
+
−
    </div>
+
−
  </div>  
+
  
−
</div>
+
</div>  
  
 
<!-- start of content -->
 
<!-- start of content -->

Latest revision as of 03:44, 2 November 2017