Difference between revisions of "Team:Rotterdam HR"

 
(117 intermediate revisions by 5 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
−
 
 
<head>
 
<head>
 
<meta name="viewport" content="width=device-width, initial-scale=1">
 
<meta name="viewport" content="width=device-width, initial-scale=1">
−
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
<link rel="stylesheet" href="https://2018.igem.org/Template:Rotterdam_HR/css/main?action=raw&ctype=text/css">
 
<style>
 
<style>
−
body {
 
−
font-family: "Century Gothic";
 
−
}
 
  
−
#top_title {
+
.menu #index, .menu #index-category {
−
display: none;
+
color: goldenrod;
 
}
 
}
  
−
#content {
+
</style>
−
background: none;
+
</head>
−
margin: 0 auto;
+
<body>
−
width: 95%;
+
−
}
+
  
−
.banner-team {
+
<style>
−
background: url("https://scontent-ams3-1.xx.fbcdn.net/v/t31.0-8/29060507_156657905011398_6757642805609854850_o.jpg?_nc_cat=0&oh=ce645b18fb057bfab894f3cf4ff94942&oe=5B8DA1D9");
+
.header::before {
−
background-size: 100%;
+
background: black url("https://static.igem.org/mediawiki/2018/c/c1/T--Rotterdam_HR--graffiti.jpeg") no-repeat left;
−
width: 100%;
+
  background-size: cover;
−
height: 500px;
+
}
−
}
+
  
−
.navbar {
+
@media screen and (max-width: 720px) {
−
overflow: hidden;
+
.header::before {
−
background-color: #333;
+
background: black url("https://static.igem.org/mediawiki/2018/0/0c/T--Rotterdam_HR--Graffiti-banner_small.jpeg") no-repeat left;
−
font-family: Arial, Helvetica, sans-serif;
+
background-size: cover;
 
}
 
}
 +
}
 +
</style>
  
−
.navbar a {
+
<div class="header">
−
float: left;
+
  <div>
−
font-size: 16px;
+
<div id="icon"></div>
−
color: white;
+
<script> $('#icon').load("https://2018.igem.org/Template:Rotterdam_HR/icon/index?action=raw&ctype=text/html"); </script>
−
text-align: center;
+
    <h1 style="background: none;">Home</h1>
−
padding: 14px 16px;
+
  </div>
−
text-decoration: none;
+
</div>
−
}
+
<div class="page page-index">
 +
<style>
 +
#c1 .carousel__slide:nth-of-type(1),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(1) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/f/f4/T--Rotterdam_HR--Boston1.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(2),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(2) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/f/f7/T--Rotterdam_HR--Boston2.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(3),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(3) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/f/fc/T--Rotterdam_HR--Boston3.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(4),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(4) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/9/94/T--Rotterdam_HR--Boston4.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(5),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(5) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/9/9f/T--Rotterdam_HR--Boston5.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(6),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(6) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/7/7a/T--Rotterdam_HR--Boston6.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(7),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(7) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/6/6c/T--Rotterdam_HR--Boston7.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(8),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(8) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/4/4e/T--Rotterdam_HR--Boston8.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(9),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(9) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/b/b7/T--Rotterdam_HR--Boston9.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(10),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(10) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/5/54/T--Rotterdam_HR--Boston10.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(11),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(11) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/b/b9/T--Rotterdam_HR--Boston11.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(12),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(12) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/e/ef/T--Rotterdam_HR--Boston12.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(13),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(13) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/e/e5/T--Rotterdam_HR--Boston13.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(14),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(14) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/c/c5/T--Rotterdam_HR--Boston14.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(15),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(15) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/3/35/T--Rotterdam_HR--Boston15.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(16),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(16) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/f/f8/T--Rotterdam_HR--Boston16.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
#c1 .carousel__slide:nth-of-type(17),
 +
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(17) {
 +
background-image: url("https://static.igem.org/mediawiki/2018/5/53/T--Rotterdam_HR--Boston17.jpeg");
 +
background-size: cover;
 +
background-position: center;
 +
}
 +
</style>
 +
<div id="navbar" style="position: -webkit-sticky;position: sticky;top: -2px; width: 100%; z-index: 100; margin-bottom: 100px;"></div>
 +
<div class="text-container">
 +
<h1>Team Rotterdam</h1>
 +
<p style="font-size: 20px; text-align: center;">
 +
We are team Rotterdam, the first iGEM team from the Rotterdam University of Applied Sciences. We are a team with
 +
multiple disciplinaries: five Biology and Medical Laboratory research students; two Chemistry students; two
 +
Electrical Engineering students and even a Computer Science student. Together we make an efficient and effective team.
 +
<br><br>
 +
We stand out because of our focus on the hardware due to our two electrical engineers. We also have the ability to
 +
create powerful software to bolster our efficiency.
 +
</p>
 +
<a href="https://2018.igem.org/Team:Rotterdam_HR/Team" class="nav-button" style="color: white; text-decoration: none;">To
 +
the team page</a>
  
−
.dropdown {
+
<!-- <ul class="carousel my-carousel carousel--thumb" id="c1">
−
float: left;
+
<input class="carousel__activator" type="radio" id="carousel_A" name="thumb" checked="checked" />
−
overflow: hidden;
+
<input class="carousel__activator" type="radio" id="carousel_B" name="thumb" />
−
}
+
<input class="carousel__activator" type="radio" id="carousel_C" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_D" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_E" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_F" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_G" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_H" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_I" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_J" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_K" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_L" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_M" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_N" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_O" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_P" name="thumb" />
 +
<input class="carousel__activator" type="radio" id="carousel_Q" name="thumb" />
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--forward" for="carousel_Q"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_B"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_A"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_C"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_B"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_D"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_C"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_E"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_D"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_F"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_E"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_G"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_F"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_H"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_G"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_I"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_H"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_J"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_I"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_K"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_J"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_L"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_K"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_M"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_L"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_N"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_M"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_O"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_N"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_P"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_O"></label>
 +
<label class="carousel__control carousel__control--forward" for="carousel_Q"></label>
 +
</div>
 +
<div class="carousel__controls">
 +
<label class="carousel__control carousel__control--backward" for="carousel_P"></label>
 +
<label class="carousel__control carousel__control--backward" for="carousel_A"></label>
 +
</div>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<li class="carousel__slide"></li>
 +
<div class="carousel__indicators">
 +
<label class="carousel__indicator" for="carousel_A"></label>
 +
<label class="carousel__indicator" for="carousel_B"></label>
 +
<label class="carousel__indicator" for="carousel_C"></label>
 +
<label class="carousel__indicator" for="carousel_D"></label>
 +
<label class="carousel__indicator" for="carousel_E"></label>
 +
<label class="carousel__indicator" for="carousel_F"></label>
 +
<label class="carousel__indicator" for="carousel_G"></label>
 +
<label class="carousel__indicator" for="carousel_H"></label>
 +
<label class="carousel__indicator" for="carousel_I"></label>
 +
<label class="carousel__indicator" for="carousel_J"></label>
 +
<label class="carousel__indicator" for="carousel_K"></label>
 +
<label class="carousel__indicator" for="carousel_L"></label>
 +
<label class="carousel__indicator" for="carousel_M"></label>
 +
<label class="carousel__indicator" for="carousel_N"></label>
 +
<label class="carousel__indicator" for="carousel_O"></label>
 +
<label class="carousel__indicator" for="carousel_P"></label>
 +
<label class="carousel__indicator" for="carousel_Q"></label>
 +
</div>
 +
</ul> -->
  
−
.dropdown .dropbtn {
+
<style>
−
font-size: 16px;
+
.mySlides {display: none; overflow: hidden;}
−
border: none;
+
.mySlides img {position: absolute; vertical-align: middle; top: 0; bottom: 0; left: 0; right: 0;}
−
outline: none;
+
−
color: white;
+
−
padding: 14px 16px;
+
−
background-color: inherit;
+
−
font-family: inherit;
+
−
margin: 0;
+
−
}
+
  
−
.navbar a:hover,
+
/* Slideshow container */
−
.dropdown:hover .dropbtn {
+
.slideshow-container {
−
background-color: red;
+
max-width: 800px;
−
}
+
height: 600px;
 +
position: relative;
 +
margin: auto;
 +
}
  
−
.dropdown-content {
+
/* Next & previous buttons */
−
display: none;
+
.prev, .next {
−
position: absolute;
+
cursor: pointer;
−
background-color: #f9f9f9;
+
position: absolute;
−
min-width: 160px;
+
top: 50%;
−
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
+
width: auto;
−
z-index: 1;
+
padding: 16px;
−
}
+
margin-top: -22px;
 +
color: white;
 +
font-weight: bold;
 +
font-size: 18px;
 +
transition: 0.6s ease;
 +
border-radius: 0 3px 3px 0;
 +
user-select: none;
 +
}
  
−
.dropdown-content a {
+
/* Position the "next button" to the right */
−
float: none;
+
.next {
−
color: black;
+
right: 0;
−
padding: 12px 16px;
+
border-radius: 3px 0 0 3px;
−
text-decoration: none;
+
}
−
display: block;
+
.prev {
−
text-align: left;
+
left: 0;
−
}
+
}
  
−
.dropdown-content a:hover {
+
/* On hover, add a black background color with a little bit see-through */
−
background-color: #ddd;
+
.prev:hover, .next:hover {
−
}
+
background-color: rgba(0,0,0,0.8);
 +
}
  
−
.dropdown:hover .dropdown-content {
+
/* Caption text */
−
display: block;
+
.text {
−
}
+
color: #f2f2f2;
 +
font-size: 15px;
 +
padding: 8px 12px;
 +
position: absolute;
 +
bottom: 8px;
 +
width: 100%;
 +
text-align: center;
 +
}
  
−
/* ------ TEAMLEDEN CSS ------ */
+
/* Number text (1/3 etc) */
−
.team-members {
+
.numbertext {
−
background: white;
+
color: #f2f2f2;
−
}
+
font-size: 12px;
 +
padding: 8px 12px;
 +
position: absolute;
 +
top: 0;
 +
}
  
−
.team-members h1 {
+
/* The dots/bullets/indicators */
−
background: whitesmoke;
+
.dot {
−
text-align: center;
+
cursor: pointer;
−
padding: 20px 0;
+
height: 15px;
−
}
+
width: 15px;
 +
margin: 0 2px;
 +
background-color: #bbb;
 +
border-radius: 50%;
 +
display: inline-block;
 +
transition: background-color 0.6s ease;
 +
}
  
−
.item p {
+
.active, .dot:hover {
−
margin: 0;
+
background-color: #717171;
−
padding: 10px;
+
}
−
}
+
−
.item h3 {
+
−
margin: 0;
+
−
}
+
  
−
.item ul {
+
/* Fading animation */
−
margin: 0;
+
.fade {
−
padding-left: 10px;
+
-webkit-animation-name: fade;
−
list-style-type: none;
+
-webkit-animation-duration: 1.5s;
−
                        list-style-image: none;
+
animation-name: fade;
−
border-left: black solid 2px;
+
animation-duration: 1.5s;
−
}
+
}
  
−
.multiple-items {
+
@-webkit-keyframes fade {
−
display: flex;
+
from {opacity: .4}
−
flex-wrap: wrap;
+
to {opacity: 1}
−
width: 90%;
+
}
−
justify-content: space-evenly;
+
−
margin: 0 auto;
+
−
}
+
  
−
.item {
+
@keyframes fade {
−
transition: 0.2s;
+
from {opacity: .4}
−
margin: 10px;
+
to {opacity: 1}
−
padding: 10px;
+
}
−
}
+
  
−
.item .summary {
+
/* On smaller screens, decrease text size */
−
background: rgba(255, 255, 255, 0.8);
+
@media only screen and (max-width: 300px) {
−
display: none;
+
.prev, .next,.text {font-size: 11px}
−
width: 100%;
+
}
−
height: 100%;
+
</style>
−
}
+
</head>
 +
<body>
  
−
.item .profile-picture {
+
<div class="slideshow-container">
−
width: 320px;
+
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/f/f4/T--Rotterdam_HR--Boston1.jpeg" style="width:100%"></div>
−
height: 320px;
+
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/f/f7/T--Rotterdam_HR--Boston2.jpeg" style="width:100%"></div>
−
border-radius: 50%;
+
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/f/fc/T--Rotterdam_HR--Boston3.jpeg" style="width:100%"></div>
−
transition: 0.2s;
+
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/9/94/T--Rotterdam_HR--Boston4.jpeg" style="width:100%"></div>
−
}
+
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/9/9f/T--Rotterdam_HR--Boston5.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/7/7a/T--Rotterdam_HR--Boston6.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/6/6c/T--Rotterdam_HR--Boston7.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/4/4e/T--Rotterdam_HR--Boston8.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/b/b7/T--Rotterdam_HR--Boston9.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/5/54/T--Rotterdam_HR--Boston10.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/b/b9/T--Rotterdam_HR--Boston11.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/c/c5/T--Rotterdam_HR--Boston14.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/3/35/T--Rotterdam_HR--Boston15.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/f/f8/T--Rotterdam_HR--Boston16.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/5/53/T--Rotterdam_HR--Boston17.jpeg" style="width:100%"></div>
 +
<a class="prev" onclick="plusSlides(-1)">&#10094;</a>
 +
<a class="next" onclick="plusSlides(1)">&#10095;</a>
 +
</div>
 +
<br>
  
−
.item .title {
+
<div style="text-align:center">
−
margin: 10px 0;
+
<span class="dot" onclick="currentSlide(1)"></span>
−
padding: 5px 0;
+
<span class="dot" onclick="currentSlide(2)"></span>
−
background: whitesmoke;
+
<span class="dot" onclick="currentSlide(3)"></span>
−
display: flex;
+
<span class="dot" onclick="currentSlide(4)"></span>
−
}
+
<span class="dot" onclick="currentSlide(5)"></span>
 +
<span class="dot" onclick="currentSlide(6)"></span>
 +
<span class="dot" onclick="currentSlide(7)"></span>
 +
<span class="dot" onclick="currentSlide(8)"></span>
 +
<span class="dot" onclick="currentSlide(9)"></span>
 +
<span class="dot" onclick="currentSlide(10)"></span>
 +
<span class="dot" onclick="currentSlide(11)"></span>
 +
<span class="dot" onclick="currentSlide(12)"></span>
 +
<span class="dot" onclick="currentSlide(13)"></span>
 +
<span class="dot" onclick="currentSlide(14)"></span>
 +
<span class="dot" onclick="currentSlide(15)"></span>
 +
</div>
  
−
.item .title .linked-in:hover {
+
<script>
−
filter: grayscale(50%);
+
var slideIndex = 1;
−
}
+
showSlides(slideIndex);
  
−
.item .title .linked-in {
+
function plusSlides(n) {
−
margin: 5px;
+
showSlides(slideIndex += n);
−
}
+
}
  
−
.item:hover {
+
function currentSlide(n) {
−
margin: 0;
+
showSlides(slideIndex = n);
−
}
+
}
  
−
.item:hover .summary{
+
function showSlides(n) {
−
display: block;
+
var i;
−
}
+
var slides = document.getElementsByClassName("mySlides");
 +
var dots = document.getElementsByClassName("dot");
 +
if (n > slides.length) {slideIndex = 1}
 +
if (n < 1) {slideIndex = slides.length}
 +
for (i = 0; i < slides.length; i++) {
 +
slides[i].style.display = "none";
 +
}
 +
for (i = 0; i < dots.length; i++) {
 +
dots[i].className = dots[i].className.replace(" active", "");
 +
}
 +
slides[slideIndex-1].style.display = "block";
 +
dots[slideIndex-1].className += " active";
 +
}
 +
</script>
  
−
.item:hover .profile-picture {
 
−
border-radius: 0%;
 
−
padding: 10px;
 
−
}
 
−
 
−
/* ------ PROFILE PICTURES ------ */
 
−
.item #mei-ju {
 
−
background: url('');
 
−
background-size: 100%;
 
−
}
 
−
 
−
.item #dustin {
 
−
background: url('');
 
−
background-size: 100%;
 
−
}
 
−
.item #suzanne {
 
−
background: url('');
 
−
background-size: 100%;
 
−
}
 
−
.item #randall {
 
−
background: url('');
 
−
background-size: 100%;
 
−
}
 
−
 
−
</style>
 
−
</head>
 
−
 
−
<body>
 
−
 
−
<!-- ------ NAVIGATION BAR ------ -->
 
−
 
−
<div class="navbar">
 
−
<a href="#home">Home</a>
 
−
<a href="#team">Team</a>
 
−
<div class="dropdown">
 
−
<button class="dropbtn">Project
 
−
<i class="fa fa-caret-down"></i>
 
−
</button>
 
−
<div class="dropdown-content">
 
−
<a href="#1">Link 1</a>
 
−
<a href="#2">Link 2</a>
 
−
<a href="#3">Link 3</a>
 
−
</div>
 
−
</div>
 
−
 
−
<div class="dropdown">
 
−
<button class="dropbtn">Results
 
−
<i class="fa fa-caret-down"></i>
 
−
</button>
 
−
<div class="dropdown-content">
 
−
<a href="#4">Link 4</a>
 
−
<a href="#5">Link 5</a>
 
−
<a href="#6">Link 6</a>
 
−
</div>
 
−
</div>
 
 
</div>
 
</div>
  
−
<!-- ------ TEAM ------ -->
+
<img src="https://static.igem.org/mediawiki/2018/a/a4/T--Rotterdam_HR--Wikifrontpage.png" style="width: 100%; max-width: 900px; margin: auto; display: block;">
−
 
+
−
<div class="banner-team"></div>
+
−
 
+
−
<div class="team-members">
+
−
<h1>Team members</h1>
+
−
<div class="multiple-items">
+
−
 
+
−
<div class="item">
+
−
<div class="profile-picture" id="mei-ju">
+
−
<div class="summary">
+
−
<p>
+
−
<strong>Chemistry student | 18</strong>
+
−
<br>
+
−
<i>
+
−
"I think that my knowledge of chemistry can be useful for the development of our project.
+
−
And I am sure that I will learn a lot about biology and biochemistry because of this experience and by the knowledge of my colleagues.
+
−
<br><br>
+
−
See you in Boston!"
+
−
</i>
+
−
</p>
+
−
</div>
+
−
</div>
+
−
<div class="title">
+
−
<div class="linked-in">
+
−
<a href="https://www.linkedin.com/in/mei-ju-goemans-073a32158/" target="_blank"><img src="../images/linkedIn-circle.png" style="width: 35px; height: 35px;"></a>
+
−
</div>
+
−
<div>
+
−
<ul>
+
−
<li><h3>Mei Ju Goemans</h3></li>
+
−
<li><h3>Team Leader</h3></li>
+
−
</ul>
+
−
</div>
+
−
</div>
+
−
</div>
+
−
 
+
−
<div class="item">
+
−
<div class="profile-picture" id="dustin">
+
−
<div class="summary">
+
−
<p>
+
−
<strong>Biology and Medical Laboratory research student | 19</strong>
+
−
<br>
+
−
<i>
+
−
"Hi, my name is Dustin van der Meulen, I'm 19 years old and the team leader of the iGEM team Hogeschool Rotterdam.
+
−
I'm currently in my third year of my bachelor, biology and medical laboratory research.
+
−
My hobbies include aikido and philosophy. Another thing I like is biochemistry at college.
+
−
I hope to improve my knowledge during iGEM.
+
−
<br><br>
+
−
I'll see everyone from iGEM in Boston!"
+
−
</i>
+
−
</p>
+
−
</div>
+
−
</div>
+
−
<div class="title">
+
−
<div class="linked-in">
+
−
<a href="https://www.linkedin.com/in/mei-ju-goemans-073a32158/" target="_blank"><img src="../images/linkedIn-circle.png" style="width: 35px; height: 35px;"></a>
+
−
</div>
+
−
<div>
+
−
<ul>
+
−
<li><h3>Dustin van der Meulen</h3></li>
+
−
<li><h3>Budget and fundraising</h3></li>
+
−
</ul>
+
−
</div>
+
−
</div>
+
−
</div>
+
−
 
+
−
<div class="item">
+
−
<div class="profile-picture" id="randall">
+
−
<div class="summary">
+
−
<p>
+
−
<strong>Biology and Medical Laboratory research student | unknown</strong>
+
−
<br>
+
−
<i>
+
−
As this is the first time our school joins the iGEM competition I'm looking forwards to the challenges that it will present us.
+
−
And building up a base on which future teams of our school can expand upon.
+
−
For this reason, I hope to be a valuable asset to the team.
+
−
<br><br>I wish the other iGEM
+
−
teams the best of luck, and I’ll see you in Boston!
+
−
</i>
+
−
</p>
+
−
</div>
+
−
</div>
+
−
<div class="title">
+
−
<div class="linked-in">
+
−
<a href="https://www.linkedin.com/in/mei-ju-goemans-073a32158/" target="_blank"><img src="../images/linkedIn-circle.png" style="width: 35px; height: 35px;"></a>
+
−
</div>
+
−
<div>
+
−
<ul>
+
−
<li><h3>Randall de Waard</h3></li>
+
−
<li><h3>Budget and fundraising</h3></li>
+
−
</ul>
+
−
</div>
+
−
</div>
+
−
</div>
+
−
 
+
−
<div class="item">
+
−
<div class="profile-picture" id="suzanne">
+
−
<div class="summary">
+
−
<p>
+
−
<strong>Chemistry student | 18</strong>
+
−
<br>
+
−
<i>
+
−
"My role in our team is keeping the social media up tot date.
+
−
At the moment we have a twitter (@IGEM_HR_2018), facebook (IGEM team Hogeschool Rotterdam) and an instagram account (@igemhr).
+
−
From the IGEM experience I hope to gain a lot of knowledge from the biochemical side of the project and a lot of new friends of course.
+
−
<br><br>
+
−
Really looking forward to meet you all in Boston!"
+
−
</i>
+
−
</p>
+
−
</div>
+
−
</div>
+
−
<div class="title">
+
−
<div class="linked-in">
+
−
<a href="https://www.linkedin.com/in/mei-ju-goemans-073a32158/" target="_blank"><img src="../images/linkedIn-circle.png" style="width: 35px; height: 35px;"></a>
+
−
</div>
+
−
<div>
+
−
<ul>
+
−
<li><h3>Suzanne Romeijn</h3></li>
+
−
<li><h3>Social media</h3></li>
+
−
</ul>
+
−
</div>
+
−
</div>
+
−
</div>
+
  
 +
<div class="text-container relevant">
 +
<h1>Relevant pages</h1>
 +
<div class="nav-cards">
 +
<a href="https://2018.igem.org/Team:Rotterdam_HR/Description" class="nav-card">
 +
<h2>Project Description</h2>
 +
<svg viewBox="0 0 24 24">
 +
<path d="M9.46,6.28L11.05,9C8.47,9.26 6.5,11.41 6.5,14A5,5 0 0,0 11.5,19C13.55,19 15.31,17.77 16.08,16H13.5V14H21.5V16H19.25C18.84,17.57 17.97,18.96 16.79,20H19.5V22H3.5V20H6.21C4.55,18.53 3.5,16.39 3.5,14C3.5,10.37 5.96,7.2 9.46,6.28M12.74,2.07L13.5,3.37L14.36,2.87L17.86,8.93L14.39,10.93L10.89,4.87L11.76,4.37L11,3.07L12.74,2.07Z"></path>
 +
</svg>
 +
</a>
 +
<a href="https://2018.igem.org/Team:Rotterdam_HR/Team" class="nav-card">
 +
<h2>Team Rotterdam</h2>
 +
<svg viewBox="0 0 24 24">
 +
<path d="M16,13C15.71,13 15.38,13 15.03,13.05C16.19,13.89 17,15 17,16.5V19H23V16.5C23,14.17 18.33,13 16,13M8,13C5.67,13 1,14.17 1,16.5V19H15V16.5C15,14.17 10.33,13 8,13M8,11A3,3 0 0,0 11,8A3,3 0 0,0 8,5A3,3 0 0,0 5,8A3,3 0 0,0 8,11M16,11A3,3 0 0,0 19,8A3,3 0 0,0 16,5A3,3 0 0,0 13,8A3,3 0 0,0 16,11Z" />
 +
</svg>
 +
</a>
 +
<a href="https://2018.igem.org/Team:Rotterdam_HR/Hardware" class="nav-card">
 +
<h2>Hardware</h2>
 +
<svg viewBox="0 0 24 24">
 +
<path d="M15.9,18.45C17.25,18.45 18.35,17.35 18.35,16C18.35,14.65 17.25,13.55 15.9,13.55C14.54,13.55 13.45,14.65 13.45,16C13.45,17.35 14.54,18.45 15.9,18.45M21.1,16.68L22.58,17.84C22.71,17.95 22.75,18.13 22.66,18.29L21.26,20.71C21.17,20.86 21,20.92 20.83,20.86L19.09,20.16C18.73,20.44 18.33,20.67 17.91,20.85L17.64,22.7C17.62,22.87 17.47,23 17.3,23H14.5C14.32,23 14.18,22.87 14.15,22.7L13.89,20.85C13.46,20.67 13.07,20.44 12.71,20.16L10.96,20.86C10.81,20.92 10.62,20.86 10.54,20.71L9.14,18.29C9.05,18.13 9.09,17.95 9.22,17.84L10.7,16.68L10.65,16L10.7,15.31L9.22,14.16C9.09,14.05 9.05,13.86 9.14,13.71L10.54,11.29C10.62,11.13 10.81,11.07 10.96,11.13L12.71,11.84C13.07,11.56 13.46,11.32 13.89,11.15L14.15,9.29C14.18,9.13 14.32,9 14.5,9H17.3C17.47,9 17.62,9.13 17.64,9.29L17.91,11.15C18.33,11.32 18.73,11.56 19.09,11.84L20.83,11.13C21,11.07 21.17,11.13 21.26,11.29L22.66,13.71C22.75,13.86 22.71,14.05 22.58,14.16L21.1,15.31L21.15,16L21.1,16.68M6.69,8.07C7.56,8.07 8.26,7.37 8.26,6.5C8.26,5.63 7.56,4.92 6.69,4.92A1.58,1.58 0 0,0 5.11,6.5C5.11,7.37 5.82,8.07 6.69,8.07M10.03,6.94L11,7.68C11.07,7.75 11.09,7.87 11.03,7.97L10.13,9.53C10.08,9.63 9.96,9.67 9.86,9.63L8.74,9.18L8,9.62L7.81,10.81C7.79,10.92 7.7,11 7.59,11H5.79C5.67,11 5.58,10.92 5.56,10.81L5.4,9.62L4.64,9.18L3.5,9.63C3.41,9.67 3.3,9.63 3.24,9.53L2.34,7.97C2.28,7.87 2.31,7.75 2.39,7.68L3.34,6.94L3.31,6.5L3.34,6.06L2.39,5.32C2.31,5.25 2.28,5.13 2.34,5.03L3.24,3.47C3.3,3.37 3.41,3.33 3.5,3.37L4.63,3.82L5.4,3.38L5.56,2.19C5.58,2.08 5.67,2 5.79,2H7.59C7.7,2 7.79,2.08 7.81,2.19L8,3.38L8.74,3.82L9.86,3.37C9.96,3.33 10.08,3.37 10.13,3.47L11.03,5.03C11.09,5.13 11.07,5.25 11,5.32L10.03,6.06L10.06,6.5L10.03,6.94Z"></path>
 +
</svg>
 +
</a>
 +
<a href="https://2018.igem.org/Team:Rotterdam_HR/Wikistat" class="nav-card">
 +
<h2>Wiki statistics</h2>
 +
<svg viewBox="0 0 24 24">
 +
<path d="M22,21H2V3H4V19H6V10H10V19H12V6H16V19H18V14H22V21Z" />
 +
</svg>
 +
</a>
 
</div>
 
</div>
 
</div>
 
</div>
 +
<div id="footer"></div>
 +
<script src="https://2018.igem.org/Template:Rotterdam_HR/js/main?action=raw&ctype=text/javascript"></script>
  
−
<!-- ------ FOOTER ------ -->
 
−
 
−
<div id="footer" style="padding:40px;background:#BDBDBD;text-align:center;color:#fff;font-size:17px;">
 
−
<b style="letter-spacing:3px;font-size:20px;">Contact Info</b>
 
−
<br>
 
−
<i style="text-transform:lowercase;font-family:Palatino Linotype;">
 
−
iGEM team Hogeschool Rotterdam
 
−
<br>
 
−
igemteam.HR@gmail.com ~ +31 10 7944554
 
−
</i>
 
 
</div>
 
</div>
−
 
 
</body>
 
</body>
−
 
 
</html>
 
</html>

Latest revision as of 19:40, 7 December 2018

Home

Team Rotterdam

We are team Rotterdam, the first iGEM team from the Rotterdam University of Applied Sciences. We are a team with multiple disciplinaries: five Biology and Medical Laboratory research students; two Chemistry students; two Electrical Engineering students and even a Computer Science student. Together we make an efficient and effective team.

We stand out because of our focus on the hardware due to our two electrical engineers. We also have the ability to create powerful software to bolster our efficiency.

To the team page

Relevant pages

Project Description

Team Rotterdam

Hardware

Wiki statistics