Difference between revisions of "Team:Rotterdam HR"

 
(123 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>
−
#content {
 
−
background: none;
 
−
margin: 0 auto;
 
−
}
 
  
−
.navbar {
+
.menu #index, .menu #index-category {
−
overflow: hidden;
+
color: goldenrod;
−
background-color: #333;
+
−
font-family: Arial, Helvetica, sans-serif;
+
 
}
 
}
  
−
.navbar a {
+
</style>
−
float: left;
+
</head>
−
font-size: 16px;
+
<body>
−
color: white;
+
−
text-align: center;
+
−
padding: 14px 16px;
+
−
text-decoration: none;
+
−
}
+
  
−
.dropdown {
+
<style>
−
float: left;
+
.header::before {
−
overflow: hidden;
+
background: black url("https://static.igem.org/mediawiki/2018/c/c1/T--Rotterdam_HR--graffiti.jpeg") no-repeat left;
−
}
+
  background-size: cover;
 +
}
  
−
.dropdown .dropbtn {
+
@media screen and (max-width: 720px) {
−
font-size: 16px;
+
.header::before {
−
border: none;
+
background: black url("https://static.igem.org/mediawiki/2018/0/0c/T--Rotterdam_HR--Graffiti-banner_small.jpeg") no-repeat left;
−
outline: none;
+
background-size: cover;
−
color: white;
+
−
padding: 14px 16px;
+
−
background-color: inherit;
+
−
font-family: inherit;
+
−
margin: 0;
+
 
}
 
}
 +
}
 +
</style>
  
−
.navbar a:hover,
+
<div class="header">
−
.dropdown:hover .dropbtn {
+
  <div>
−
background-color: red;
+
<div id="icon"></div>
−
}
+
<script> $('#icon').load("https://2018.igem.org/Template:Rotterdam_HR/icon/index?action=raw&ctype=text/html"); </script>
−
 
+
    <h1 style="background: none;">Home</h1>
−
.dropdown-content {
+
  </div>
−
display: none;
+
</div>
−
position: absolute;
+
<div class="page page-index">
−
background-color: #f9f9f9;
+
<style>
−
min-width: 160px;
+
#c1 .carousel__slide:nth-of-type(1),
−
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
+
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(1) {
−
z-index: 1;
+
background-image: url("https://static.igem.org/mediawiki/2018/f/f4/T--Rotterdam_HR--Boston1.jpeg");
−
}
+
background-size: cover;
−
 
+
background-position: center;
−
.dropdown-content a {
+
}
−
float: none;
+
#c1 .carousel__slide:nth-of-type(2),
−
color: black;
+
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(2) {
−
padding: 12px 16px;
+
background-image: url("https://static.igem.org/mediawiki/2018/f/f7/T--Rotterdam_HR--Boston2.jpeg");
−
text-decoration: none;
+
background-size: cover;
−
display: block;
+
background-position: center;
−
text-align: left;
+
}
−
}
+
#c1 .carousel__slide:nth-of-type(3),
−
 
+
#c1.carousel--thumb .carousel__indicators .carousel__indicator:nth-of-type(3) {
−
.dropdown-content a:hover {
+
background-image: url("https://static.igem.org/mediawiki/2018/f/fc/T--Rotterdam_HR--Boston3.jpeg");
−
background-color: #ddd;
+
background-size: cover;
−
}
+
background-position: center;
−
 
+
}
−
.dropdown:hover .dropdown-content {
+
#c1 .carousel__slide:nth-of-type(4),
−
display: block;
+
#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>
 
</style>
−
</head>
+
<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>
  
−
<body>
+
<!-- <ul class="carousel my-carousel carousel--thumb" id="c1">
−
 
+
<input class="carousel__activator" type="radio" id="carousel_A" name="thumb" checked="checked" />
−
<div class="navbar">
+
<input class="carousel__activator" type="radio" id="carousel_B" name="thumb" />
−
<a href="#home">Home</a>
+
<input class="carousel__activator" type="radio" id="carousel_C" name="thumb" />
−
<a href="#team">Team</a>
+
<input class="carousel__activator" type="radio" id="carousel_D" name="thumb" />
−
<div class="dropdown">
+
<input class="carousel__activator" type="radio" id="carousel_E" name="thumb" />
−
<button class="dropbtn">Project
+
<input class="carousel__activator" type="radio" id="carousel_F" name="thumb" />
−
<i class="fa fa-caret-down"></i>
+
<input class="carousel__activator" type="radio" id="carousel_G" name="thumb" />
−
</button>
+
<input class="carousel__activator" type="radio" id="carousel_H" name="thumb" />
−
<div class="dropdown-content">
+
<input class="carousel__activator" type="radio" id="carousel_I" name="thumb" />
−
<a href="#1">Link 1</a>
+
<input class="carousel__activator" type="radio" id="carousel_J" name="thumb" />
−
<a href="#2">Link 2</a>
+
<input class="carousel__activator" type="radio" id="carousel_K" name="thumb" />
−
<a href="#3">Link 3</a>
+
<input class="carousel__activator" type="radio" id="carousel_L" name="thumb" />
−
</div>
+
<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>
−
 
+
<div class="carousel__controls">
−
<div class="dropdown">
+
<label class="carousel__control carousel__control--backward" for="carousel_A"></label>
−
<button class="dropbtn">Results
+
<label class="carousel__control carousel__control--forward" for="carousel_C"></label>
−
<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>
+
<div class="carousel__controls">
−
 
+
<label class="carousel__control carousel__control--backward" for="carousel_B"></label>
−
<head>
+
<label class="carousel__control carousel__control--forward" for="carousel_D"></label>
−
<style>
+
−
body {
+
−
background-image: url("https://noellesterk.com/wp-content/uploads/herfst.jpg");
+
−
}
+
−
</style>
+
−
</head>
+
−
 
+
−
<h3>Welkom on our wiki page</h3>
+
−
<p></p>
+
−
 
+
−
<div style="height:650px;overflow:hidden;text-align:justify;line-height:170%;color:#333;">
+
−
 
+
−
 
+
−
 
+
−
<a name="home"></a>
+
−
<div class="page" style="height:570px;padding:40px;overflow:auto;">
+
−
<center class="page-head" style="margin:0 18% 20px 18%;line-height:200%;">
+
−
<b style="letter-spacing:3px;font-size:20px;color:#000;">We are iGEM team Hogeschool Rotterdam </b>
+
−
<br>
+
−
<i style="font-family:Palatino Linotype;"> Sorry, we are still under construction</i>
+
−
</center>
+
 
</div>
 
</div>
−
 
+
<div class="carousel__controls">
−
 
+
<label class="carousel__control carousel__control--backward" for="carousel_C"></label>
−
<a name="team"></a>
+
<label class="carousel__control carousel__control--forward" for="carousel_E"></label>
−
<div class="page" style="height:570px;padding:40px;overflow:auto;">
+
−
<center class="page-head" style="margin:0 18% 20px 18%;line-height:200%;">
+
−
<b style="letter-spacing:3px;font-size:20px;color:#000;">Lets meet our team :D </b>
+
−
<br>
+
−
<i style="font-family:Palatino Linotype;"></i>
+
−
</center>
+
−
 
+
−
<div id="about-nav" style="display:flex;flex-wrap:wrap;justify-content:center;text-align:center;font-family:Palatino Linotype;font-size:25px;font-style:italic;font-weight:bold;letter-spacing:3px;text-transform:uppercase;">
+
−
<a href="#1a" style="display:block;width:200px;height:220px;background:#ddd url(https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg);background-size:cover;line-height:220px;margin:10px;text-decoration:none;color:#fff;">set 1</a>
+
−
<a href="#1b" style="display:block;width:200px;height:220px;background:#ddd url(https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg);background-size:cover;line-height:220px;margin:10px;text-decoration:none;color:#fff;">set 2</a>
+
−
<a href="#1c" style="display:block;width:200px;height:220px;background:#ddd url(https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg);background-size:cover;line-height:220px;margin:10px;text-decoration:none;color:#fff;">Set 3</a>
+
−
<a href="#1d" style="display:block;width:200px;height:220px;background:#ddd url(https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg);background-size:cover;line-height:220px;margin:10px;text-decoration:none;color:#fff;">PI's</a>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
</div>
+
 
</div>
 
</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>
−
<a name="1a"></a>
+
<div class="carousel__controls">
−
<div class="page" style="height:570px;padding:40px;overflow:auto;">
+
<label class="carousel__control carousel__control--backward" for="carousel_E"></label>
−
<center class="page-head" style="margin:0 18% 20px 18%;line-height:200%;">
+
<label class="carousel__control carousel__control--forward" for="carousel_G"></label>
−
<b style="letter-spacing:3px;font-size:20px;color:#000;">A our team</b>
+
</div>
−
<br>
+
<div class="carousel__controls">
−
<i style="font-family:Palatino Linotype;">diversity makes a team stronger</i>
+
<label class="carousel__control carousel__control--backward" for="carousel_F"></label>
−
</center>
+
<label class="carousel__control carousel__control--forward" for="carousel_H"></label>
−
 
+
</div>
−
<div class="page-col" style="display:flex;">
+
<div class="carousel__controls">
−
<div class="page-side" style="width:30%;margin-right:3%;">
+
<label class="carousel__control carousel__control--backward" for="carousel_G"></label>
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
<label class="carousel__control carousel__control--forward" for="carousel_I"></label>
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
</div>
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
<div class="carousel__controls">
−
<br />
+
<label class="carousel__control carousel__control--backward" for="carousel_H"></label>
−
 
+
<label class="carousel__control carousel__control--forward" for="carousel_J"></label>
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
</div>
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
<div class="carousel__controls">
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
<label class="carousel__control carousel__control--backward" for="carousel_I"></label>
−
<br />
+
<label class="carousel__control carousel__control--forward" for="carousel_K"></label>
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
</div>
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
<div class="carousel__controls">
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
<label class="carousel__control carousel__control--backward" for="carousel_J"></label>
−
<br />
+
<label class="carousel__control carousel__control--forward" for="carousel_L"></label>
−
<div id="traits" style="font-size:10px;letter-spacing:3px;color:#fff;margin:15px 0;">
+
</div>
−
 
+
<div class="carousel__controls">
−
<br>
+
<label class="carousel__control carousel__control--backward" for="carousel_K"></label>
−
 
+
<label class="carousel__control carousel__control--forward" for="carousel_M"></label>
−
</div>
+
</div>
−
 
+
<div class="carousel__controls">
−
</div>
+
<label class="carousel__control carousel__control--backward" for="carousel_L"></label>
−
 
+
<label class="carousel__control carousel__control--forward" for="carousel_N"></label>
−
<div class="page-side" style="width:67%;">
+
</div>
−
Mei Ju Goemans is our team Leader.
+
<div class="carousel__controls">
−
<br> She is 18 years old and a chemical engeneering student.
+
<label class="carousel__control carousel__control--backward" for="carousel_M"></label>
−
 
+
<label class="carousel__control carousel__control--forward" for="carousel_O"></label>
−
 
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br> Persoon 2
+
−
 
+
−
 
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br> Persoon 3
+
−
</div>
+
−
 
+
−
 
+
−
</div>
+
 
</div>
 
</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> -->
  
−
<a name="1b"></a>
+
<style>
−
<div class="page" style="height:570px;padding:40px;overflow:auto;">
+
.mySlides {display: none; overflow: hidden;}
−
<center class="page-head" style="margin:0 18% 20px 18%;line-height:200%;">
+
.mySlides img {position: absolute; vertical-align: middle; top: 0; bottom: 0; left: 0; right: 0;}
−
<b style="letter-spacing:3px;font-size:20px;color:#000;">A our team</b>
+
−
<br>
+
−
<i style="font-family:Palatino Linotype;">diversity makes a team stronger</i>
+
−
</center>
+
  
−
<div class="page-col" style="display:flex;">
+
/* Slideshow container */
−
<div class="page-side" style="width:30%;margin-right:3%;">
+
.slideshow-container {
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
max-width: 800px;
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
height: 600px;
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
position: relative;
−
<br />
+
margin: auto;
 +
}
  
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
/* Next & previous buttons */
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
.prev, .next {
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
cursor: pointer;
−
<br />
+
position: absolute;
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
top: 50%;
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
width: auto;
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
padding: 16px;
−
<br />
+
margin-top: -22px;
−
<div id="traits" style="font-size:10px;letter-spacing:3px;color:#fff;margin:15px 0;">
+
color: white;
−
<br>
+
font-weight: bold;
−
</div>
+
font-size: 18px;
 +
transition: 0.6s ease;
 +
border-radius: 0 3px 3px 0;
 +
user-select: none;
 +
}
  
−
</div>
+
/* Position the "next button" to the right */
 +
.next {
 +
right: 0;
 +
border-radius: 3px 0 0 3px;
 +
}
 +
.prev {
 +
left: 0;
 +
}
  
−
<div class="page-side" style="width:67%;">
+
/* On hover, add a black background color with a little bit see-through */
−
Persoon 1
+
.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;
 +
}
  
−
<br>
+
/* Number text (1/3 etc) */
−
<br>
+
.numbertext {
−
<br>
+
color: #f2f2f2;
−
<br>
+
font-size: 12px;
−
<br>
+
padding: 8px 12px;
−
<br>
+
position: absolute;
−
<br> Persoon 2
+
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;
 +
}
  
−
<br>
+
.active, .dot:hover {
−
<br>
+
background-color: #717171;
−
<br>
+
}
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br> Persoon 3
+
−
</div>
+
  
 +
/* Fading animation */
 +
.fade {
 +
-webkit-animation-name: fade;
 +
-webkit-animation-duration: 1.5s;
 +
animation-name: fade;
 +
animation-duration: 1.5s;
 +
}
  
−
</div>
+
@-webkit-keyframes fade {
−
</div>
+
from {opacity: .4}
 +
to {opacity: 1}
 +
}
  
−
<a name="1c"></a>
+
@keyframes fade {
−
<div class="page" style="height:570px;padding:40px;overflow:auto;">
+
from {opacity: .4}
−
<center class="page-head" style="margin:0 18% 20px 18%;line-height:200%;">
+
to {opacity: 1}
−
<b style="letter-spacing:3px;font-size:20px;color:#000;">A our team</b>
+
}
−
<br>
+
−
<i style="font-family:Palatino Linotype;">diversity makes a team stronger</i>
+
−
</center>
+
−
 
+
−
<div class="page-col" style="display:flex;">
+
−
<div class="page-side" style="width:30%;margin-right:3%;">
+
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
−
<br />
+
−
 
+
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
−
<br />
+
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
−
<br />
+
−
<div id="traits" style="font-size:10px;letter-spacing:3px;color:#fff;margin:15px 0;">
+
−
 
+
−
<br>
+
−
 
+
−
</div>
+
−
 
+
−
</div>
+
−
 
+
−
<div class="page-side" style="width:67%;">
+
−
persoon 1
+
−
 
+
−
 
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br> Persoon 2
+
−
 
+
−
 
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br> Persoon 3
+
−
</div>
+
  
 +
/* On smaller screens, decrease text size */
 +
@media only screen and (max-width: 300px) {
 +
.prev, .next,.text {font-size: 11px}
 +
}
 +
</style>
 +
</head>
 +
<body>
  
 +
<div class="slideshow-container">
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/f/f4/T--Rotterdam_HR--Boston1.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/f/f7/T--Rotterdam_HR--Boston2.jpeg" style="width:100%"></div>
 +
<div class="mySlides fade"><img src="https://static.igem.org/mediawiki/2018/f/fc/T--Rotterdam_HR--Boston3.jpeg" style="width:100%"></div>
 +
<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>
 
</div>
−
</div>
+
<br>
−
 
+
−
<a name="1d"></a>
+
−
<div class="page" style="height:570px;padding:40px;overflow:auto;">
+
−
<center class="page-head" style="margin:0 18% 20px 18%;line-height:200%;">
+
−
<b style="letter-spacing:3px;font-size:20px;color:#000;">A our team</b>
+
−
<br>
+
−
<i style="font-family:Palatino Linotype;">diversity makes a team stronger</i>
+
−
</center>
+
−
 
+
−
<div class="page-col" style="display:flex;">
+
−
<div class="page-side" style="width:30%;margin-right:3%;">
+
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
−
<br />
+
−
 
+
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
−
<br />
+
−
<img src="https://3.bp.blogspot.com/-GDbfmwmOSCo/TWdzmdUuTyI/AAAAAAAADf0/nuxONbRoE4E/s1600/Grijze-achtergronden-grijze-wallpapers-grijs-achtergrond-hd-14.jpg"
+
−
style="width:140px;height:150px;margin-bottom:20px;padding:10px;background:#eee;" />
+
−
<b style="color:#062D39;text-transform:uppercase;letter-spacing:3px;"></b>
+
−
<br />
+
−
<div id="traits" style="font-size:10px;letter-spacing:3px;color:#fff;margin:15px 0;">
+
−
 
+
−
<br>
+
−
 
+
−
</div>
+
−
 
+
−
</div>
+
−
 
+
−
<div class="page-side" style="width:67%;">
+
−
PI mister Veldscholte
+
−
 
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br> Persoon 2
+
−
 
+
−
 
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br> Persoon 3
+
−
</div>
+
−
 
+
  
 +
<div style="text-align:center">
 +
<span class="dot" onclick="currentSlide(1)"></span>
 +
<span class="dot" onclick="currentSlide(2)"></span>
 +
<span class="dot" onclick="currentSlide(3)"></span>
 +
<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>
 
</div>
−
</div>
 
  
 +
<script>
 +
var slideIndex = 1;
 +
showSlides(slideIndex);
  
 +
function plusSlides(n) {
 +
showSlides(slideIndex += n);
 +
}
  
 +
function currentSlide(n) {
 +
showSlides(slideIndex = n);
 +
}
  
 +
function showSlides(n) {
 +
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>
  
 +
</div>
  
 +
<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="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>
−
</div>
+
<script src="https://2018.igem.org/Template:Rotterdam_HR/js/main?action=raw&ctype=text/javascript"></script>
−
<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>
+
  
 +
</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