Difference between revisions of "Team:Bilkent-UNAMBG/Integrated Practices"

Line 25: Line 25:
 
     background-color:#9ED670;
 
     background-color:#9ED670;
 
     color: #CCEAE7;
 
     color: #CCEAE7;
 +
}
 +
* {box-sizing:border-box}
 +
body {font-family: Verdana,sans-serif;}
 +
 +
/* Slideshow container */
 +
.slideshow-container {
 +
  max-width: 100%;
 +
  position: relative;
 +
  margin: auto;
 +
}
 +
 +
/* Caption text */
 +
.text {
 +
  color: #f2f2f2;
 +
  font-size: 15px;
 +
  padding: 8px 12px;
 +
  position: absolute;
 +
  bottom: 8px;
 +
  width: 90%;
 +
  text-align: center;
 +
}
 +
 +
/* Number text (1/14 etc) */
 +
.numbertext {
 +
  color: #f2f2f2;
 +
  font-size: 12px;
 +
  padding: 8px 12px;
 +
  position: absolute;
 +
  top: 0;
 +
}
 +
 +
/* The dots/bullets/indicators */
 +
.dot {
 +
  height: 13px;
 +
  width: 13px;
 +
  margin: 0 2px;
 +
  background-color: #bbb;
 +
  border-radius: 50%;
 +
  display: inline-block;
 +
  transition: background-color 1.0s ease;
 +
}
 +
 +
.dot2 {
 +
  height: 13px;
 +
  width: 13px;
 +
  margin: 0 2px;
 +
  background-color: #bbb;
 +
  border-radius: 50%;
 +
  display: inline-block;
 +
  transition: background-color 1.0s ease;
 +
}
 +
 +
.active {
 +
  background-color: #717171;
 +
}
 +
 +
/* Fading animation */
 +
.fade {
 +
  -webkit-animation-name: fade;
 +
  -webkit-animation-duration: 5.0s;
 +
  animation-name: fade;
 +
  animation-duration: 3.0s;
 +
}
 +
 +
@-webkit-keyframes fade {
 +
  from {opacity: .4}
 +
  to {opacity: 1}
 +
}
 +
 +
@keyframes fade {
 +
  from {opacity: .4}
 +
  to {opacity: 1}
 +
}
 +
 +
/* On smaller screens, decrease text size */
 +
@media only screen and (max-width: 300px) {
 +
  .text {font-size: 11px}
 
}
 
}
 
</style>
 
</style>
Line 34: Line 111:
 
<ul style="width:90%" class="submenu">
 
<ul style="width:90%" class="submenu">
 
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/Human_Practices"> Human Practices </a></li>
 
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/Human_Practices"> Human Practices </a></li>
−
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/HP/Silver">★ Silver </a></li>
+
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/HP/Silver">Silver </a></li>
−
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/HP/Gold">★ Gold </a></li>
+
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/HP/Gold">Gold </a></li>
−
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/Integrated_Practices"> ★ Integrated Practices </a></li>
+
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/Integrated_Practices"> Integrated Practices </a></li>
−
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/Engagement">★ Engagement </a></li>
+
   <li class="submenu"><a href="https://2016.igem.org/Team:Bilkent-UNAMBG/Engagement">Engagement </a></li>
 
</ul>
 
</ul>
 
</div>
 
</div>
Line 48: Line 125:
 
</div>
 
</div>
  
 +
<br></br><br></br><br></br>
 +
<div style="background-color:red; width:88%; margin-left:10%; >
 +
<div class="slideshow-container" style="background-color:yellow; width:90%; height:80% ">
 +
 +
<div class="mySlides2 fade" style="width:70%;height:50%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/2/24/T--Bilkent-UNAMBG--sbd1.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/1/1e/T--Bilkent-UNAMBG--sbd2.jpg" style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/5/55/T--Bilkent-UNAMBG--sbd3.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/7/76/T--Bilkent-UNAMBG--sbd4.jpg" style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/9/98/T--Bilkent-UNAMBG--sbd5.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/8/84/T--Bilkent-UNAMBG--sbd6.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/4/43/T--Bilkent-UNAMBG--sbd7.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/c/c8/T--Bilkent-UNAMBG--sbd8.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/a/a8/T--Bilkent-UNAMBG--sbd9.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/6/68/T--Bilkent-UNAMBG--sbd10.jpg" style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/1/1f/T--Bilkent-UNAMBG--sbd11.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/3/33/T--Bilkent-UNAMBG--sbd12.jpg"  style="width:80%;height:auto">
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/a/a9/T--Bilkent-UNAMBG--sbd13.jpg" style="width:80%;height:auto" >
 +
  <div class="text"></div>
 +
</div>
 +
 +
<div class="mySlides2 fade" style="width:70%; margin: 0 auto" align="center">
 +
  <div class="numbertext"></div>
 +
  <img src="https://static.igem.org/mediawiki/2016/b/b0/T--Bilkent-UNAMBG--sbd14.jpg" style="width:80%;height:auto" >
 +
  <div class="text"></div>
 +
</div>
 +
 +
</div>
 +
<br>
 +
<div style="text-align:center">
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
  <span class="dot2"></span>
 +
 +
</div>
 +
 +
</div>
 +
 +
 +
<script>
 +
var slideIndex = 0;
 +
var slideIndex2 = 0;
 +
showSlides();
 +
 +
function showSlides() {
 +
    var i;
 +
    var slides = document.getElementsByClassName("mySlides");
 +
    var slides2 = document.getElementsByClassName("mySlides2");
 +
 +
    var dots = document.getElementsByClassName("dot");
 +
    var dots2 = document.getElementsByClassName("dot2");
 +
    for (i = 0; i < slides.length; i++) {
 +
      slides[i].style.display = "none";
 +
    }
 +
 +
    for (i = 0; i < slides2.length; i++) {
 +
      slides2[i].style.display = "none";
 +
    }
 +
 +
    slideIndex++;
 +
    slideIndex2++;
 +
    if (slideIndex> slides.length)
 +
{
 +
slideIndex = 1
 +
}
 +
    if (slideIndex2> slides2.length)
 +
{
 +
slideIndex2 = 1
 +
}
 +
 +
    for (i = 0; i < dots.length; i++) {
 +
        dots[i].className = dots[i].className.replace(" active", "");
 +
    }
 +
    for (i = 0; i < dots2.length; i++) {
 +
dots2[i].className = dots2[i].className.replace(" active", "");
 +
    }
 +
    slides[slideIndex-1].style.display = "block";
 +
    slides2[slideIndex2-1].style.display = "block";
 +
    dots[slideIndex-1].className += " active";
 +
    dots2[slideIndex2-1].className += " active";
 +
    setTimeout(showSlides, 3000); // Change image every 3 seconds
 +
}
 +
</script>
  
  

Revision as of 00:00, 20 October 2016





We have organized a Synthetic Biology Day which was held on 15th of October. In addition to presentations of our project and ITU’s, a team that we collaborated with, we invited four speakers to talk about Synthetic Biology. Wed distributed a questionnaire to analyse awareness on breast cancer and ask people if they would prefer a non-invasive and cheap diagnostic tool over traditional techniques. We had time in the end to meet our guests, talk face to face and answer their questions. During presentation, we talked about the survival rates ranged between 90-100% and showed people that there is an underestimation of the importance of early diagnosis. Seeing what the general population feels about diagnostic methods will influence how we will proceed with the development of our kit.