Difference between revisions of "Team:Duesseldorf"

Line 2: Line 2:
  
 
<head>
 
<head>
−
<style>
+
<link rel="stylesheet" type="text/css"
−
/***** Wiki CSS ******/
+
href="https://2016.igem.org/Template:Duesseldorf/CSS?action=raw&ctype=text/css" />
−
+
−
#sideMenu,
+
−
#top_title {
+
−
display: none;
+
−
}
+
−
#content {
+
−
width: 100%;
+
−
padding: 0px;
+
−
margin: 0px;
+
−
margin-top: -2px;
+
−
background-color: #e6e6e6;
+
−
}
+
−
body {
+
−
background-color: #e6e6e6;
+
−
font-family: 'Roboto', sans-serif;
+
−
margin: 0px;
+
−
line-height: 1.5;
+
−
font-size: 15px;
+
−
}
+
−
/***** Normalize *****/
+
−
+
−
html {
+
−
-ms-text-size-adjust: 100%;
+
−
-webkit-text-size-adjust: 100%;
+
−
}
+
−
/***** Page CSS ******/
+
−
+
−
* {
+
−
-webkit-box-sizing: border-box;
+
−
-moz-box-sizing: border-box;
+
−
box-sizing: border-box
+
−
}
+
−
/* Fonts */
+
−
+
−
h1,
+
−
h2,
+
−
h3,
+
−
h4,
+
−
h5,
+
−
h6 {
+
−
color: #0C9476;
+
−
padding-bottom: 5px;
+
−
}
+
−
h1 {
+
−
font-size: 36px
+
−
}
+
−
h2 {
+
−
font-size: 30px
+
−
}
+
−
h3 {
+
−
font-size: 24px
+
−
}
+
−
h4 {
+
−
font-size: 20px
+
−
}
+
−
h5 {
+
−
font-size: 18px
+
−
}
+
−
h6 {
+
−
font-size: 16px
+
−
}
+
−
p,
+
−
a,
+
−
li {
+
−
padding-left: 3px;
+
−
padding-right: 3px;
+
−
}
+
−
.text-justify {
+
−
text-align: justify;
+
−
}
+
−
.text-left {
+
−
text-align: left;
+
−
}
+
−
.text-right {
+
−
text-align: right;
+
−
}
+
−
img {
+
−
max-width: 100%;
+
−
height: auto
+
−
}
+
−
/* Nützliche Klassen*/
+
−
+
−
.middle {
+
−
margin: auto;
+
−
}
+
−
.width {
+
−
width: 80%;
+
−
max-width: 1200px;
+
−
}
+
−
.top-padding {
+
−
padding-top: 15px;
+
−
}
+
−
/*Responsive*/
+
−
+
−
.row {
+
−
width: 100%;
+
−
float: left;
+
−
}
+
−
.row::after {
+
−
content: "";
+
−
clear: both;
+
−
display: table;
+
−
}
+
−
/* For mobile phones: */
+
−
+
−
[class*="col-"] {
+
−
width: 100%;
+
−
float: left;
+
−
}
+
−
.colhalf {
+
−
width: 50%;
+
−
}
+
−
@media only screen and (min-width: 600px) {
+
−
/* For tablets: */
+
−
+
−
.col-m-1 {
+
−
width: 8.33%;
+
−
}
+
−
.col-m-2 {
+
−
width: 16.66%;
+
−
}
+
−
.col-m-3 {
+
−
width: 25%;
+
−
}
+
−
.col-m-4 {
+
−
width: 33.33%;
+
−
}
+
−
.col-m-5 {
+
−
width: 41.66%;
+
−
}
+
−
.col-m-6 {
+
−
width: 50%;
+
−
}
+
−
.col-m-7 {
+
−
width: 58.33%;
+
−
}
+
−
.col-m-8 {
+
−
width: 66.66%;
+
−
}
+
−
.col-m-9 {
+
−
width: 75%;
+
−
}
+
−
.col-m-10 {
+
−
width: 83.33%;
+
−
}
+
−
.col-m-11 {
+
−
width: 91.66%;
+
−
}
+
−
.col-m-12 {
+
−
width: 100%;
+
−
}
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
/* For desktop: */
+
−
+
−
.col-1 {
+
−
width: 8.33%;
+
−
}
+
−
.col-2 {
+
−
width: 16.66%;
+
−
}
+
−
.col-3 {
+
−
width: 25%;
+
−
}
+
−
.col-4 {
+
−
width: 33.33%;
+
−
}
+
−
.col-5 {
+
−
width: 41.66%;
+
−
}
+
−
.col-6 {
+
−
width: 50%;
+
−
}
+
−
.col-7 {
+
−
width: 58.33%;
+
−
}
+
−
.col-8 {
+
−
width: 66.66%;
+
−
}
+
−
.col-9 {
+
−
width: 75%;
+
−
}
+
−
.col-10 {
+
−
width: 83.33%;
+
−
}
+
−
.col-11 {
+
−
width: 91.66%;
+
−
}
+
−
.col-12 {
+
−
width: 100%;
+
−
}
+
−
}
+
−
/*Header*/
+
−
+
−
.banner {
+
−
background-color: #e6e6e6;
+
−
}
+
−
.navigation {
+
−
background-color: #e6e6e6;
+
−
}
+
−
ul.topnav {
+
−
list-style: none;
+
−
margin: 0;
+
−
padding: 0;
+
−
overflow: hidden;
+
−
}
+
−
ul.topnav li {
+
−
float: right;
+
−
}
+
−
ul.topnav li a {
+
−
display: inline-block;
+
−
color: grey;
+
−
text-align: center;
+
−
padding: 14px 16px;
+
−
text-decoration: none;
+
−
transition: 0.3s;
+
−
font-size: 17px;
+
−
}
+
−
ul.topnav li a.active {
+
−
color: #0C9476;
+
−
}
+
−
ul.topnav li a:hover {
+
−
color: #111;
+
−
}
+
−
ul.topnav li.icon {
+
−
display: none;
+
−
}
+
−
@media screen and (max-width: 1024px) {
+
−
ul.topnav li:not(:last-child) {
+
−
display: none;
+
−
}
+
−
ul.topnav li {
+
−
float: left;
+
−
}
+
−
ul.topnav li.icon {
+
−
float: right;
+
−
display: inline-block;
+
−
}
+
−
}
+
−
@media screen and (max-width: 1024px) {
+
−
ul.topnav.responsive {
+
−
position: relative;
+
−
}
+
−
ul.topnav.responsive li.icon {
+
−
position: absolute;
+
−
right: 0;
+
−
top: 0;
+
−
}
+
−
ul.topnav.responsive li {
+
−
float: none;
+
−
display: inline;
+
−
}
+
−
ul.topnav.responsive li a {
+
−
display: block;
+
−
text-align: left;
+
−
}
+
−
}
+
−
/*Page*/
+
−
+
−
.border {
+
−
border-radius: 10px;
+
−
}
+
−
.shadow {
+
−
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
+
−
}
+
−
.page {
+
−
background-color: #ffffff;
+
−
margin-bottom: 6%;
+
−
padding-top: 4%;
+
−
padding-bottom: 2%;
+
−
overflow-x: auto
+
−
}
+
−
.footer {
+
−
margin-top: 100px;
+
−
}
+
−
/* Footer Gallery */
+
−
+
−
.sponsor {
+
−
padding: 5px;
+
−
}
+
−
.sponsor img {
+
−
-webkit-filter: grayscale(100%);
+
−
/* Chrome, Safari, Opera */
+
−
+
−
filter: grayscale(100%);
+
−
}
+
−
.sponsor img:hover {
+
−
-webkit-filter: grayscale(0%);
+
−
filter: none;
+
−
}
+
−
/* Switch Gallery*/
+
−
+
−
.sg-container {
+
−
max-width: 100%;
+
−
float: left;
+
−
display: list-item;
+
−
list-style-type: none;
+
−
position: relative;
+
−
margin: 4px;
+
−
}
+
−
.sg-container img {
+
−
max-width: 100%;
+
−
border-radius: 10px 10px 10px 10px;
+
−
-moz-border-radius: 10px 10px 10px 10px;
+
−
-webkit-border-radius: 10px 10px 10px 10px;
+
−
border: 0px solid #000000;
+
−
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
+
−
}
+
−
.img-hidden {
+
−
bottom: 0;
+
−
position: absolute;
+
−
opacity: 0;
+
−
filter: alpha(opacity=0);
+
−
width: 100%;
+
−
z-index: 1000;
+
−
transition: opacity 2s;
+
−
-moz-transition: opacity 2s;
+
−
-webkit-transition: opacity 2s;
+
−
}
+
−
.sg-container.active .img-hidden {
+
−
opacity: 1;
+
−
filter: alpha(opacity=100);
+
−
transition: opacity 2s;
+
−
-moz-transition: opacity 2s;
+
−
-webkit-transition: opacity 2s;
+
−
}
+
−
/* Accordion */
+
−
+
−
button.accordion {
+
−
background-color: #eee;
+
−
color: #444;
+
−
cursor: pointer;
+
−
padding: 18px;
+
−
width: 100%;
+
−
border: none;
+
−
text-align: left;
+
−
outline: none;
+
−
font-size: 15px;
+
−
transition: 0.4s;
+
−
}
+
−
button.accordion.active,
+
−
button.accordion:hover {
+
−
background-color: #ddd;
+
−
}
+
−
div.panel {
+
−
padding: 0 18px;
+
−
background-color: white;
+
−
max-height: 0;
+
−
overflow: hidden;
+
−
transition: 0.6s ease-in-out;
+
−
opacity: 0;
+
−
}
+
−
div.panel.show {
+
−
opacity: 1;
+
−
max-height: 500px;
+
−
}
+
−
width: 80%;
+
−
margin: auto;
+
−
background-color: #e6e6e6;
+
−
}
+
−
</style>
+
 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximun-scale=1.0, user-scalable=no">
 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximun-scale=1.0, user-scalable=no">
 
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
 
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
Line 390: Line 29:
 
<ul class="topnav">
 
<ul class="topnav">
 
<li class="icon"> <a href="javascript:void(0);" style="font-size:15px;" onclick="myFunction()">☰</a> </li>
 
<li class="icon"> <a href="javascript:void(0);" style="font-size:15px;" onclick="myFunction()">☰</a> </li>
−
<li><a href="Contact.html">Contact Us!</a>
+
<li><a href="https://2016.igem.org/Team:Duesseldorf/Contact">Contact Us!</a>
 
</li>
 
</li>
−
<li><a href="Parts.html">Parts</a>
+
<li><a href="https://2016.igem.org/Team:Duesseldorf/Parts">Parts</a>
 
</li>
 
</li>
−
<li><a href="Lab-Book.html">Lab Book</a>
+
<li><a href="https://2016.igem.org/Team:Duesseldorf/Lab-Book">Lab Book</a>
 
</li>
 
</li>
−
<li><a href="Project-Description.html">Project</a>
+
<li><a href="https://2016.igem.org/Team:Duesseldorf/Description">Project</a>
 
</li>
 
</li>
−
<li><a href="Team.html">Team</a>
+
<li><a href="https://2016.igem.org/Team:Duesseldorf/Team">Team</a>
 
</li>
 
</li>
−
<li><a class="active" href="Home.html">Home</a>
+
<li><a class="active" href="https://2016.igem.org/Team:Duesseldorf">Home</a>
 
</li>
 
</li>
 
</ul>
 
</ul>

Revision as of 15:25, 4 July 2016

Heading

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Heading 2

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Team Opoptosis, Heinrich-Heine Universität Düsseldorf. Design by Marvin van Aalst