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://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> |
− | <style> | + | <style> |
− | + | #content { | |
− | + | background: none; | |
− | + | margin: 0 auto; | |
− | + | } | |
− | } | + | |
− | .navbar | + | .navbar { |
− | + | overflow: hidden; | |
− | + | background-color: #333; | |
− | + | font-family: Arial, Helvetica, sans-serif; | |
− | + | } | |
− | + | ||
− | + | ||
− | } | + | |
− | . | + | .navbar a { |
− | + | float: left; | |
− | + | font-size: 16px; | |
− | } | + | color: white; |
+ | text-align: center; | ||
+ | padding: 14px 16px; | ||
+ | text-decoration: none; | ||
+ | } | ||
− | .dropdown | + | .dropdown { |
− | + | float: left; | |
− | + | overflow: hidden; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | } | + | |
− | + | .dropdown .dropbtn { | |
− | + | font-size: 16px; | |
− | } | + | border: none; |
+ | outline: none; | ||
+ | color: white; | ||
+ | padding: 14px 16px; | ||
+ | background-color: inherit; | ||
+ | font-family: inherit; | ||
+ | margin: 0; | ||
+ | } | ||
− | . | + | .navbar a:hover, |
− | + | .dropdown:hover .dropbtn { | |
− | + | background-color: red; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | } | + | |
− | .dropdown-content | + | .dropdown-content { |
− | + | display: none; | |
− | + | position: absolute; | |
− | + | background-color: #f9f9f9; | |
− | + | min-width: 160px; | |
− | + | box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); | |
− | + | z-index: 1; | |
− | } | + | } |
− | .dropdown-content a | + | .dropdown-content a { |
− | + | float: none; | |
− | } | + | color: black; |
+ | padding: 12px 16px; | ||
+ | text-decoration: none; | ||
+ | display: block; | ||
+ | text-align: left; | ||
+ | } | ||
− | .dropdown:hover | + | .dropdown-content a:hover { |
− | + | background-color: #ddd; | |
− | } | + | } |
− | + | ||
− | + | ||
− | + | ||
− | + | .dropdown:hover .dropdown-content { | |
− | + | display: block; | |
− | + | } | |
− | + | </style> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | } | + | |
− | </style> | + | |
</head> | </head> | ||
− | < | + | <body> |
− | + | ||
− | <div | + | <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> | ||
+ | <head> | ||
+ | <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> | ||
+ | <a name="team"></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;">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> | + | <a name="1a"></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%;"> | ||
+ | Mei Ju Goemans is our team Leader. | ||
+ | <br> She is 18 years old and a chemical engeneering student. | ||
− | |||
− | + | <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> |
− | < | + | <a name="1b"></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> | ||
− | <br> | + | <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 /> | ||
− | </div> | + | <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> |
− | <div class="page-side" style="width:67%;"> | + | <div class="page-side" style="width:67%;"> |
− | Persoon 1 | + | Persoon 1 |
− | <br><br><br><br><br><br><br> | + | <br> |
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> Persoon 2 | ||
− | |||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> Persoon 3 | ||
+ | </div> | ||
− | |||
− | + | </div> | |
− | </div> | + | </div> |
+ | <a name="1c"></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=" | + | <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> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> Persoon 3 | ||
+ | </div> | ||
− | |||
+ | </div> | ||
+ | </div> | ||
− | < | + | <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> |
− | + | ||
− | < | + | <div class="page-side" style="width:67%;"> |
− | + | PI mister Veldscholte | |
− | + | ||
− | <br> | + | <br> |
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> Persoon 2 | ||
− | |||
− | </div> | + | <br> |
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> Persoon 3 | ||
+ | </div> | ||
− | |||
− | |||
− | < | + | </div> |
+ | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <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> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</html> | </html> |
Revision as of 13:02, 9 May 2018