Difference between revisions of "Team:NAWI-Graz"

Line 9: Line 9:
 
<meta name="keywords" content="css animation, loading effect, google plus, grid items, masonry" />
 
<meta name="keywords" content="css animation, loading effect, google plus, grid items, masonry" />
 
<script src="js/javascript.js" type="text/javascript"></script>
 
<script src="js/javascript.js" type="text/javascript"></script>
−
 
+
<link rel="stylesheet" type="text/css" href="css/design.css">
−
 
+
<link rel="shortcut icon" href="../favicon.ico">  
−
<style>
+
<link rel="stylesheet" type="text/css" href="css/component.css" />
−
 
+
<script src="js/modernizr.custom.js"></script>
−
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
+
−
 
+
−
@font-face {
+
−
font-family: 'codropsicons';
+
−
src:url('../fonts/codropsicons/codropsicons.eot');
+
−
src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
+
−
url('../fonts/codropsicons/codropsicons.woff') format('woff'),
+
−
url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
+
−
url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
+
−
font-weight: normal;
+
−
font-style: normal;
+
−
}
+
−
 
+
−
 
+
−
html {
+
−
  box-sizing: border-box;
+
−
}
+
−
*, ::before, ::after {
+
−
  box-sizing: inherit;
+
−
}
+
−
 
+
−
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
+
−
body, html { font-size: 100%; padding: 0; margin: 0;}
+
−
 
+
−
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
+
−
.clearfix:before, .clearfix:after { content: " "; display: table; }
+
−
.clearfix:after { clear: both; }
+
−
 
+
−
 
+
−
a {
+
−
color: #aaa;
+
−
text-decoration: none;
+
−
outline: none;
+
−
}
+
−
 
+
−
a img {
+
−
    border: none;
+
−
}
+
−
 
+
−
 
+
−
a:hover,
+
−
a:active {
+
−
color: #333;
+
−
}
+
−
 
+
−
 
+
−
body{
+
−
margin: 0;
+
−
padding: 0;
+
−
height:100%;
+
−
color: #6b7381;
+
−
background: #f2f2f2;
+
−
    text-align: left;
+
−
    font-size: 150%;
+
−
font-family: 'Lato', Calibri, Arial, sans-serif;
+
−
}
+
−
 
+
−
#ueberschrift
+
−
{
+
−
color: white;
+
−
padding-right: 20px;
+
−
margin-top:5px;
+
−
padding-top: 5px;
+
−
text-align: right;
+
−
    font-size: 150%;
+
−
}
+
−
 
+
−
#header{
+
−
/*margin:20px;*/
+
−
padding:0;
+
−
font-size:230%;
+
−
text-align:center;
+
−
+
−
background-color:#6599FF;
+
−
height:176px;
+
−
}
+
−
 
+
−
#teamlogo{
+
−
background-color:#6599FF;
+
−
height:156px;
+
−
width:100%;
+
−
background: url(../images/bg1.jpg);
+
−
background-repeat: repeat-x;
+
−
    background-position: center;
+
−
    background-size:13%;
+
−
}
+
−
 
+
−
#content{
+
−
-moz-border-radius: 20px;
+
−
-webkit-border-radius: 20px;
+
−
border-radius: 20px;
+
−
margin-top:10px;
+
−
margin-bottom: 2%;
+
−
margin-left: 20%;
+
−
padding: 10px 10px 10px 10px;
+
−
background: white;
+
−
    width:68%;
+
−
height:100%;
+
−
}
+
−
 
+
−
#main{
+
−
padding-left:10%;
+
−
padding-right:10%;
+
−
padding-top:5%;
+
−
padding-bottom:5%;
+
−
}
+
−
#footer{
+
−
    background: #333;
+
−
padding-bottom: 1rem;
+
−
color:white;
+
−
text-align:center;
+
−
    clear:left;
+
−
}
+
−
.floatLeft{
+
−
background: url(../images/bg.jpg);
+
−
    float:left;
+
−
}
+
−
.sidebar-left{
+
−
    background: url(../images/bg.jpg);
+
−
    width: 20%;
+
−
}
+
−
+
−
.copyright {font-size : 9px; font-family : courier new;}
+
−
p {font-size : 20px}
+
−
 
+
−
 
+
−
img {
+
−
    max-width: 100%;
+
−
    height: auto;
+
−
}
+
−
 
+
−
 
+
−
#global-nav{
+
−
background-color:black;
+
−
width:100%;
+
−
-moz-border-radius: 20px;
+
−
-webkit-border-radius: 20px;
+
−
border-radius: 20px;
+
−
margin:0 auto;
+
−
}
+
−
 
+
−
 
+
−
nav
+
−
{
+
−
+
−
margin: 0 auto;
+
−
width: 100%; /* 1000 */
+
−
font-family: 'Open Sans', sans-serif;
+
−
font-weight: 100;
+
−
+
−
}
+
−
 
+
−
nav > a
+
−
{
+
−
display: none;
+
−
}
+
−
 
+
−
nav li
+
−
{
+
−
+
−
position: relative;
+
−
}
+
−
nav li a
+
−
{
+
−
color: white;
+
−
display: block;
+
−
}
+
−
nav li a:active
+
−
{
+
−
background-color: yellow !important;
+
−
}
+
−
 
+
−
nav span:after
+
−
{
+
−
width: 0;
+
−
height: 0;
+
−
border: 0.313em solid transparent; /* 5 */
+
−
border-bottom: none;
+
−
border-top-color: white;
+
−
content: '';
+
−
vertical-align: middle;
+
−
display: inline-block;
+
−
position: relative;
+
−
right: -0.313em; /* 5 */
+
−
}
+
−
 
+
−
/* first level */
+
−
 
+
−
nav > ul
+
−
{
+
−
+
−
margin:0 auto;
+
−
padding:0px;
+
−
height: 2.65em; /* 60 */
+
−
background-color: transparent;
+
−
}
+
−
nav > ul > li
+
−
{
+
−
width: 11%;
+
−
height: 100%;
+
−
float: left;
+
−
list-style:none;
+
−
+
−
}
+
−
nav > ul > li > a
+
−
{
+
−
text-decoration: none;
+
−
display:block;
+
−
height: 100%;
+
−
+
−
font-size: 0.8em; /* 24 */
+
−
line-height: 1.8em; /* 60 (24) */
+
−
text-align: center;
+
−
}
+
−
nav > ul > li:not( :last-child ) > a
+
−
{
+
−
/*border-right: 1px solid white;*/
+
−
}
+
−
nav > ul > li:hover > a,
+
−
nav > ul:not( :hover ) > li.active > a
+
−
{
+
−
background-color: transparent;
+
−
color:yellow;
+
−
-moz-border-radius: 20px;
+
−
-webkit-border-radius: 20px;
+
−
border-radius: 20px;
+
−
}
+
−
 
+
−
 
+
−
/* second level */
+
−
 
+
−
nav li ul
+
−
{
+
−
width:200%;
+
−
-moz-border-radius: 20px;
+
−
-webkit-border-radius: 20px;
+
−
border-radius: 20px;
+
−
background-color: white;
+
−
opacity:0.8;
+
−
display: none;
+
−
font-size:40%;
+
−
color: black;
+
−
list-style: none;
+
−
position: absolute;
+
−
top: 100%;
+
−
}
+
−
nav li:hover ul
+
−
{
+
−
display: block;
+
−
left: 0;
+
−
right: 0;
+
−
}
+
−
nav li:not( :first-child ):hover ul
+
−
{
+
−
left: -1px;
+
−
}
+
−
nav li ul a
+
−
{
+
−
height:80%;
+
−
font-size: 1.25em; /* 20 */
+
−
border-top: 1px solid white;
+
−
color:black;
+
−
padding: 0.3em; /* 15 (20) */
+
−
}
+
−
nav li ul li a:hover,
+
−
nav li ul:not( :hover ) li.active a
+
−
{
+
−
background-color: yellow;
+
−
-moz-border-radius: 20px;
+
−
-webkit-border-radius: 20px;
+
−
border-radius: 20px;
+
−
}
+
−
+
−
nav > ul > li > a > img
+
−
{
+
−
height: auto;
+
−
width: auto;
+
−
max-height:500px;
+
−
max-width:200px;
+
−
padding: 0 0.633em; /* 20 (24) */
+
−
}
+
−
/* Team */
+
−
 
+
−
.teamfoto {
+
−
+
−
}
+
−
 
+
−
.teamtext {
+
−
+
−
}
+
−
 
+
−
#membercontent{
+
−
width:100%;
+
−
}
+
−
#member{
+
−
width:47%;
+
−
float: left;
+
−
margin-left: 10px;
+
−
margin-bottom: 20px;
+
−
background-color: white;
+
−
min-height:250px;
+
−
}
+
−
 
+
−
#member1{
+
−
width:47%;
+
−
float: right;
+
−
margin-left: 10px;
+
−
margin-bottom: 20px;
+
−
background-color: #123;
+
−
min-height:250px;
+
−
}
+
−
 
+
−
#member2{
+
−
width:47%;
+
−
float: left;
+
−
margin-left: 10px;
+
−
margin-bottom: 20px;
+
−
background-color: #123;
+
−
min-height:250px;
+
−
}
+
−
 
+
−
#member3{
+
−
width:47%;
+
−
float: right;
+
−
margin-left: 10px;
+
−
margin-bottom: 20px;
+
−
background-color: white;
+
−
min-height:250px;
+
−
}
+
−
 
+
−
#wrapper {
+
−
width: 100%;
+
−
margin: 0 auto;
+
−
}
+
−
 
+
−
 
+
−
#memberfoto {
+
−
float: left;
+
−
padding: 2px 2px 2px 2px;
+
−
max-width: 200px;
+
−
margin-left: 10px;
+
−
margin-top:10px;
+
−
margin-bottom: 10px;
+
−
}
+
−
 
+
−
#memberfoto1 {
+
−
float: left;
+
−
padding: 2px 2px 2px 2px;
+
−
max-width: 200px;
+
−
margin-left: 10px;
+
−
margin-top:10px;
+
−
margin-bottom: 10px;
+
−
+
−
}
+
−
 
+
−
 
+
−
 
+
−
#membertextfieldgraz {
+
−
width: 50%;
+
−
margin-left: 210px;
+
−
margin-top:10px;
+
−
padding-left:10px;
+
−
padding-top:10px;
+
−
margin-bottom: 10px;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
@media only screen and (max-width: 70rem),
+
−
only screen and (max-device-width: 40rem) {
+
−
#footer{
+
−
display:none;
+
−
}
+
−
+
−
#global-nav{
+
−
background-color:black;
+
−
width:100%;
+
−
position: fixed;
+
−
+
−
}
+
−
#header{
+
−
/*font-size:200%;
+
−
text-align:center;
+
−
    padding-top: 5px;
+
−
    background-size: 60% 100%;
+
−
height:140px;
+
−
background-repeat: no-repeat;*/
+
−
display:none;
+
−
}
+
−
+
−
#content{
+
−
margin:2px 2px 2px 2px;
+
−
width:100%;
+
−
padding:0em;
+
−
}
+
−
+
−
#member{
+
−
background-color: white;
+
−
width:95%;
+
−
float:none;
+
−
padding-bottom:10px;
+
−
}
+
−
#member1{
+
−
background-color: #123;
+
−
float:none;
+
−
width:95%;
+
−
padding-bottom:10px;
+
−
}
+
−
#member2{
+
−
background-color: white;
+
−
width:95%;
+
−
float:none;
+
−
padding-bottom:10px;
+
−
}
+
−
#member3{
+
−
float:none;
+
−
background-color: #123;
+
−
width:95%;
+
−
padding-bottom:10px;
+
−
}
+
−
+
−
+
−
#wrapper {
+
−
width: 100%;
+
−
margin: 0 auto;
+
−
background-color: #D2D2EF;
+
−
 
+
−
}
+
−
 
+
−
#memberfoto {
+
−
float:left;
+
−
width:90%;
+
−
+
−
margin-left: 10px;
+
−
margin-top:10px;
+
−
margin-bottom: 10px;
+
−
padding-right:10px;
+
−
padding-top:10px;
+
−
+
−
}
+
−
#memberfoto img {
+
−
width: 100%;
+
−
+
−
}
+
−
 
+
−
 
+
−
#memberfoto1 {
+
−
float: right;
+
−
padding: 2px 2px 2px 2px;
+
−
max-width: 200px;
+
−
margin-left: 10px;
+
−
margin-top:10px;
+
−
margin-bottom: 10px;
+
−
+
−
}
+
−
 
+
−
#membertextfieldgraz {
+
−
width:80%;
+
−
margin-left: 10px;
+
−
margin-top:10px;
+
−
padding-left:10px;
+
−
padding-top:10px;
+
−
margin-bottom: 10px;
+
−
}
+
−
+
−
#teamlogo{
+
−
display:none;
+
−
}
+
−
+
−
    html
+
−
{
+
−
font-size: 55%; /* 12 */
+
−
}
+
−
 
+
−
nav
+
−
{
+
−
position: relative;
+
−
top: 0;
+
−
left: 0px;
+
−
}
+
−
nav > a
+
−
{
+
−
width: 1.125em; /* 50 */
+
−
height: 1.125em; /* 50 */
+
−
text-align: left;
+
−
text-indent: -9999px;
+
−
background-color: black;
+
−
+
−
}
+
−
nav > a:before,
+
−
nav > a:after
+
−
{
+
−
position: absolute;
+
−
border: 2px solid #fff;
+
−
top: 35%;
+
−
left: 25%;
+
−
right: 25%;
+
−
content: '';
+
−
+
−
}
+
−
nav > a:after
+
−
{
+
−
top: 60%;
+
−
}
+
−
 
+
−
nav:not( :target ) > a:first-of-type,
+
−
nav:target > a:last-of-type
+
−
{
+
−
display: block;
+
−
}
+
−
 
+
−
 
+
−
/* first level */
+
−
 
+
−
nav > ul
+
−
{
+
−
+
−
height: auto;
+
−
display: none;
+
−
position: absolute;
+
−
left: 0;
+
−
right: 0;
+
−
background-color:#6599FF;
+
−
+
−
+
−
}
+
−
nav:target > ul
+
−
{
+
−
+
−
width: 100%;
+
−
display: block;
+
−
}
+
−
nav > ul > li
+
−
{
+
−
text-align:center;
+
−
/*background: url("../images/8.jpg");*/
+
−
background-size:100% 100%;
+
−
width: 100%;
+
−
float: none;
+
−
}
+
−
nav > ul > li > a
+
−
{
+
−
font-size:20px;
+
−
height: left;
+
−
padding-left: 30%;
+
−
text-align: left;
+
−
}
+
−
nav > ul > li:not( :last-child ) > a
+
−
{
+
−
+
−
border-right: none;
+
−
width:100%;
+
−
border-bottom: 1px solid white;
+
−
}
+
−
+
−
nav > ul > li > a > img
+
−
{
+
−
height: 20%;
+
−
max-width:30px;
+
−
width: 20%;
+
−
max-height:30px;
+
−
text-align: left;
+
−
padding: 0 0.633em; /* 20 (24) */
+
−
}
+
−
 
+
−
 
+
−
/* second level */
+
−
 
+
−
nav li ul
+
−
{
+
−
position: static;
+
−
padding: 0.25em;
+
−
padding-top: 0;
+
−
height:100%;
+
−
width:98%;
+
−
-moz-border-radius: 20px;
+
−
-webkit-border-radius: 20px;
+
−
border-radius: 20px;
+
−
background-color: #124;
+
−
opacity:0.70;
+
−
display: none;
+
−
font-size:80%;
+
−
+
−
list-style: none;
+
−
top: 100%;
+
−
}
+
−
nav li:hover ul
+
−
{
+
−
display: none;
+
−
left: 0;
+
−
right: 0;
+
−
}
+
−
nav li:not( :first-child ):hover ul
+
−
{
+
−
left: -1px;
+
−
}
+
−
nav li ul a
+
−
{
+
−
font-size: 1.15em;
+
−
border-top: 1px solid white;
+
−
padding: 0.3em;
+
−
}
+
−
nav li ul li a:hover,
+
−
nav li ul:not( :hover ) li.active a
+
−
{
+
−
background-color: #eee;
+
−
-moz-border-radius: 7px;
+
−
-webkit-border-radius: 7px;
+
−
border-radius: 7px;
+
−
}
+
−
+
−
+
−
}
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
</style>
+
  
 
 

Revision as of 15:59, 23 June 2016

iGEM Team Graz

Introduction

Hello everyone and welcome to our facebook page! We are very excited about iGEM 2016 and are looking forward to working on a great project! On this page we will keep you updated about our project, which we are going to submit for the competition and the progress made as well as other interesting things.

What is iGEM?

The International Genetically Engineered Machine (iGEM) is an international competition in the field of synthetic biology that was initially aimed at university students. The iGEM foundation is dedicated to education and competition, advancement of synthetic biology, and the development of open community and collaboration.

What is iGEM?

The International Genetically Engineered Machine (iGEM) is an international competition in the field of synthetic biology that was initially aimed at university students. The iGEM foundation is dedicated to education and competition, advancement of synthetic biology, and the development of open community and collaboration.

What is iGEM?

The International Genetically Engineered Machine (iGEM) is an international competition in the field of synthetic biology that was initially aimed at university students. The iGEM foundation is dedicated to education and competition, advancement of synthetic biology, and the development of open community and collaboration.