Team:TU-Eindhoven/CSS:BaseStyle

From 2013.igem.org

(Difference between revisions)
 
(171 intermediate revisions not shown)
Line 1: Line 1:
 +
ul {
 +
    list-style-image: url('https://2014.igem.org/File:TUEindhoven_2014_Background.jpg');
 +
}
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo{
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo{
display:none;
display:none;
Line 18: Line 21:
width: auto;
width: auto;
}
}
-
 
+
html,body {
 +
    height:100% !important;
 +
}
body {
body {
-
margin: 10px 0 0 0;
+
margin: 0px !important;
 +
        margin-top: -10px !important;
padding: 0;
padding: 0;
-
        background-color: #FFFFFF;
+
background: #f2f2f2; /* Old browsers */
 +
background: -moz-linear-gradient(-45deg,  #E9E9E9 0%, #ffffff 60%); /* FF3.6+ */
 +
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#E9E9E9), color-stop(60%,#ffffff)); /* Chrome,Safari4+ */
 +
background: -webkit-linear-gradient(-45deg,  #E9E9E9 0%,#ffffff 60%); /* Chrome10+,Safari5.1+ */
 +
background: -o-linear-gradient(-45deg,  #E9E9E9 0%,#ffffff 60%); /* Opera 11.10+ */
 +
background: -ms-linear-gradient(-45deg,  #E9E9E9 0%,#ffffff 60%); /* IE10+ */
 +
background: linear-gradient(135deg,  #E9E9E9 0%,#ffffff 60%); /* W3C */
 +
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E9E9E9', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
 +
background-color: #FFFFFF;
 +
background-attachment:fixed;
 +
}
 +
.tue-content p {
 +
    text-align: justify;
}
}
#top-section{
#top-section{
Line 54: Line 72:
.tue-header{
.tue-header{
-
     height: 200px;
+
     height: 150px;
-
    background: url('https://static.igem.org/mediawiki/2013/a/ad/TU-Eindhoven_logo.png') no-repeat center;
+
-webkit-box-shadow: inset 0px -5px 5px rgba(0,0,0,0.2) !important;
-
    margin-top: -30px;
+
-moz-box-shadow: inset 0px -5px 5px rgba(0,0,0,0.2) !important;
 +
box-shadow: inset 0px -5px 5px rgba(0,0,0,0.2) !important;
 +
}
 +
.tue-header1{
 +
    background: url('https://static.igem.org/mediawiki/2013/5/5e/TU-Eindhoven_Images_Header1.jpg') #b5aca5 no-repeat center top !important;
 +
}
 +
.tue-header2{
 +
    background: url('https://static.igem.org/mediawiki/2013/3/3c/TU-Eindhoven_Images_Header2.jpg') #9f9b93 no-repeat center top !important;
 +
}
 +
.tue-header3{
 +
    background: url('https://static.igem.org/mediawiki/2013/4/43/TU-Eindhoven_Images_Header3.jpg') #abb0af no-repeat center top !important;
 +
}
 +
.tue-header4{
 +
    background: url('https://static.igem.org/mediawiki/2013/2/2d/TU-Eindhoven_Images_Header4.jpg') repeat-x center top !important;
}
}
Line 72: Line 103:
.editsection{
.editsection{
-
     font-size: 10pt !important;
+
     font-size: 30% !important;
}
}
Line 80: Line 111:
}
}
.tue-toc-well{
.tue-toc-well{
-
     float: left;
+
     float: right;
-
     margin-right: 18px;
+
     margin-left: 18px;
-
     margin-bottom: 10px;
+
     margin-bottom: 10px !important;
}
}
#toctitle h2{
#toctitle h2{
Line 94: Line 125:
#content{
#content{
 +
    max-width: none !important;
     width: auto !important;
     width: auto !important;
-
     max-width: 1000px;
+
     background: none !important;
 +
    padding: 0px !important;
}
}
Line 106: Line 139:
     border-bottom: 0px !important;
     border-bottom: 0px !important;
}
}
-
a {
+
.tue-content a {
     color: #0088cc !important;
     color: #0088cc !important;
}
}
a.btn {
a.btn {
     color: #FFFFFF !important;
     color: #FFFFFF !important;
 +
}
 +
a.tue-tooltip {
 +
    border-bottom: 1px #888888 dotted !important;
 +
    color: #888888 !important;
 +
}
 +
a.tue-tooltip:hover {
 +
    text-decoration: none !important;
 +
}
 +
 +
.tue-imagespan-left {
 +
    float: left !important;
 +
    margin-left: 0px !important;
 +
    margin-right: 20px !important;
 +
}
 +
.tue-imagespan-right {
 +
    float: right !important;
 +
}
 +
ol.linenums {
 +
    margin-top: 0px !important;
 +
    margin-bottom: 0px !important;
 +
}
 +
#bodyContent a[href^='mailto:'], .link-mailto {
 +
    background-image: none !important;
 +
}
 +
.tue-inlineref {
 +
    color: #444444;
 +
}
 +
.tue-reference {
 +
    display: none;
 +
}
 +
.tue-refid {
 +
    display: none;
 +
}
 +
.tue-refagain {
 +
    display: none;
 +
}
 +
.tue-attribution-table td {
 +
    padding-top: 5px;
 +
}
 +
.tue-float {
 +
    display: block !important;
 +
    margin-bottom: 15px;
 +
}
 +
.tue-float-left {
 +
    float: left !important;
 +
    margin-left: 0px !important;
 +
    margin-right: 20px !important;
 +
}
 +
.tue-float-right {
 +
    float: right !important;
 +
    margin-right: 0px !important;
 +
    margin-left: 20px !important;
 +
}
 +
.tue-float img {
 +
    width: 100%;
 +
}
 +
.tue-caption {
 +
    border-bottom: 1px solid #CCCCCC;
 +
    margin-top: 5px;
 +
}
 +
.tue-caption-figure {
 +
    color: #666666;
 +
    font-weight: bold;
 +
}
 +
.tue-caption-text {
 +
    color: #666666;
 +
}
 +
.tue-figref {
 +
    display: none;
 +
    font-style: italic !important;
 +
}
 +
table {
 +
    margin-top: 8px;
 +
    margin-bottom: 8px;
 +
}
 +
.tue-timeline-line {
 +
height: 100%;
 +
display: block;
 +
float: left;
 +
background-color: #CCCCCC;
 +
width: 10px;
 +
margin-right: 40px;
 +
margin-left: 20px;
 +
}
 +
.tue-timeline-title {
 +
display: block;
 +
height: 100%;
 +
}
 +
.tue-timeline-content {
 +
display: block;
 +
height: 100%;
 +
        float: left;
 +
        margin-left: 80px;
 +
        padding-bottom: 20px;
 +
}
 +
.tue-timeline-top {
 +
display: block;
 +
height: 70px;
 +
        width: 100%;
 +
        float: left;
 +
}
 +
.tue-timeline-bottom {
 +
display: block;
 +
height: 40px;
 +
        float: left;
 +
        width: 100%;
 +
        margin-bottom: 20px;
 +
}
 +
.tue-timeline-middle {
 +
display: block;
 +
float: left;
 +
width: 100%;
 +
        position: relative;
 +
}
 +
.tue-timeline-top .tue-timeline-line {
 +
height: 100%;
 +
-moz-border-radius-topright: 5px;
 +
border-top-right-radius: 5px;
 +
-moz-border-radius-topleft: 5px;
 +
border-top-left-radius: 5px;
 +
}
 +
.tue-timeline-bottom .tue-timeline-line {
 +
height: 40px;
 +
-moz-border-radius-bottomright: 5px;
 +
border-bottom-right-radius: 5px;
 +
-moz-border-radius-bottomleft: 5px;
 +
border-bottom-left-radius: 5px;
 +
}
 +
.tue-timeline-node {
 +
display: block;
 +
float: left;
 +
text-align: center;
 +
width: 54px;
 +
height: 40px;
 +
overflow: hidden;
 +
position: relative;
 +
top: 0px;
 +
left: 0px;
 +
margin-right: -62px;
 +
padding: 3px;
 +
border: solid 1px #333333;
 +
        background-color: #333333;
 +
color: #FFFFFF;
 +
-moz-border-radius-bottomright: 5px;
 +
border-bottom-right-radius: 5px;
 +
-moz-border-radius-bottomleft: 5px;
 +
border-bottom-left-radius: 5px;
 +
-moz-border-radius-topright: 5px;
 +
border-top-right-radius: 5px;
 +
-moz-border-radius-topleft: 5px;
 +
border-top-left-radius: 5px;
 +
        font-size: 8pt;
 +
}
 +
.tue-timeline-leftbar {
 +
display: block;
 +
float: left;
 +
width: 80px;
 +
        position: absolute;
 +
        top: 0px;
 +
        bottom: 0px;
 +
}
 +
.tue-timeline-content h3 {
 +
    line-height: 30px;
 +
}
 +
h2 {
 +
    font-size: 18pt !important;
 +
}
 +
h3 {
 +
    font-size: 14pt !important;
 +
}
 +
img.grayscale {
 +
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+ */
 +
    filter: gray; /* IE6-9 */
 +
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
 +
    -webkit-transition: .6s ease; /* Fade to color for Chrome and Safari */
 +
    -webkit-transition-property: -webkit-filter,opacity,filter;
 +
    -webkit-backface-visibility: hidden; /* Fix for transition flickering */
 +
    opacity:0.7;
 +
    filter:alpha(opacity=70);
 +
}
 +
 +
img.grayscale:hover {
 +
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
 +
    -webkit-filter: grayscale(0%);
 +
    opacity:1.0;
 +
    filter:alpha(opacity=100);
 +
}
 +
 +
.igemlogo {
 +
    float: right;
 +
    width: 60px;
 +
    height: 49px;
 +
    margin-top: -60px;
 +
    margin-bottom: 10px;
 +
    margin-right: 14px;
 +
}
 +
.tue-upbutton {
 +
    float: right;
 +
    position: relative;
 +
    top: 10px;
 +
}
 +
.tue-gototop-sticky {
 +
    position: fixed;
 +
    bottom: 0px;
 +
    right: 40px;
 +
    background: #DEDEDE;
 +
    padding: 10px;
 +
    -moz-border-radius-topright: 5px;
 +
    border-top-right-radius: 5px;
 +
    -moz-border-radius-topleft: 5px;
 +
    border-top-left-radius: 5px;
 +
    display: none;
 +
}
 +
.tue-gototop-sticky i {
 +
    opacity:0.6;
 +
    filter:alpha(opacity=60);
 +
}
 +
.tue-gototop-sticky a {
 +
    color: #555555;
 +
    text-decoration: none;
 +
}
 +
.tue-gototop-sticky a:hover {
 +
    color: #555555;
 +
    text-decoration: none;
 +
}
 +
#top {
 +
    display: none;
 +
    margin-top: -4px;
 +
}
 +
.nav-tabs > li > a {
 +
    text-align: center !important;
 +
    -webkit-border-radius: 4px 4px 4px 4px !important;
 +
    -moz-border-radius: 4px 4px 4px 4px !important;
 +
    border-radius: 4px 4px 4px 4px !important;
 +
}
 +
.nav-tabs {
 +
    border-bottom: transparent 0px !important;
 +
    /*width: 480px !important;*/
 +
    margin: 10px auto !important;
 +
    padding-left: 80px !important;
 +
}
 +
.nav-tabs > li {
 +
    /*width: 80px !important;*/
 +
}
 +
.nav-tabs > .active > a, .nav-tabs > .active > a:hover, .nav-tabs > .active > a:focus, .nav-tabs > li > a:hover, .nav-tabs > li > a:focus {
 +
    border: 1px solid #FFFFFF !important;
 +
}
 +
/*
 +
.nav-tabs > .active > a {
 +
    color: #FFFFFF !important;
 +
    background: #333333 !important;
 +
}*/
 +
.tue-social {
 +
    display: block !important;
 +
    float: left !important;
 +
    padding: 0px !important;
 +
}
 +
.tue-menu-social {
 +
    height: 40px;
 +
    overflow: hidden;
 +
}
 +
.tue-social-div {
 +
    position: absolute;
 +
    top: 180px;
 +
    left: 80px;
 +
}
 +
.navbar .container {
 +
    width: 938px !important;
 +
}
 +
.tue-sponsor {
 +
    width: 397px;
 +
    background-color: #FFFFFF !important;
 +
    float: left;
 +
    padding: 8px !important;
 +
}
 +
 +
.tue-sponsors {
 +
margin-top: 100px;
 +
background: url('https://static.igem.org/mediawiki/2013/9/9a/TU-Eindhoven_Images_Pattern.png') repeat #EEEEEE;
 +
-webkit-box-shadow: inset 0px 10px 10px rgba(0,0,0,0.1) !important;
 +
-moz-box-shadow: inset 0px 10px 10px rgba(0,0,0,0.1) !important;
 +
box-shadow: inset 0px 10px 10px rgba(0,0,0,0.1) !important;
 +
padding: 30px;
 +
height: 260px;
 +
}
 +
 +
.tue-timeline-content .span1 {
 +
    width: 51px !important;
 +
}
 +
.tue-timeline-content .span2 {
 +
    width: 123px !important;
 +
}
 +
.tue-timeline-content .span3 {
 +
    width: 195px !important;
 +
}
 +
.tue-timeline-content .span4 {
 +
    width: 266px !important;
 +
}
 +
.tue-timeline-content .span5 {
 +
    width: 338px !important;
 +
}
 +
.tue-timeline-content .span6 {
 +
    width: 410px !important;
 +
}
 +
.tue-timeline-content .span7 {
 +
    width: 481px !important;
 +
}
 +
.tue-timeline-content .span8 {
 +
    width: 553px !important;
 +
}
 +
.tue-timeline-content .span9 {
 +
    width: 625px !important;
 +
}
 +
.tue-timeline-content .span10 {
 +
    width: 696px !important;
 +
}
 +
.tue-timeline-content .span11 {
 +
    width: 768px !important;
 +
}
 +
.tue-timeline-content .span12 {
 +
    width: 860px !important;
 +
}
 +
.rotate {
 +
  -webkit-transform: rotate(-90deg);
 +
  -moz-transform: rotate(-90deg);
 +
  -ms-transform: rotate(-90deg);
 +
  -o-transform: rotate(-90deg);
 +
  transform: rotate(-90deg);
 +
 +
  /* also accepts left, right, top, bottom coordinates; not required, but a good idea for styling */
 +
  -webkit-transform-origin: 50% 50%;
 +
  -moz-transform-origin: 50% 50%;
 +
  -ms-transform-origin: 50% 50%;
 +
  -o-transform-origin: 50% 50%;
 +
  transform-origin: 50% 50%;
 +
  display: block;
 +
}
 +
.graph_label {
 +
  font-style: italic;
 +
  font-size: 10pt;
 +
}
 +
.navwrapper {
 +
margin-bottom: 20px;
 +
background-image: -webkit-linear-gradient(top,#fff,#f2f2f2);
 +
}
 +
.navbar {
 +
margin-bottom: 0px !important;
 +
}
 +
.navbar-inner {
 +
background-image: none !important;
 +
border: 0px;
 +
border-radius: 0px;
 +
border-left: solid 1px #eaeaea;
 +
border-right: solid 1px #eaeaea;
 +
}
 +
li.active > a {
 +
background: none !important;
 +
/*-webkit-box-shadow: 0 0 10px rgba(255,122,163,1) !important;
 +
-moz-box-shadow: 0 0 10px rgba(255,122,163,1) !important;
 +
box-shadow: 0 0 10px rgba(255,122,163,1) !important;*/
 +
background: none !important;
 +
        background-color: #FFE8FC !important;
 +
border-radius: 0px !important;
 +
}
 +
#globalWrapper {
 +
padding: 0px !important;
 +
}
 +
.fb-like {
 +
    margin-left: 14px;
 +
}
 +
.thumbnail {
 +
-webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.1) !important;
 +
-moz-box-shadow: 3px 3px 5px rgba(0,0,0,0.1) !important;
 +
box-shadow: 3px 3px 5px rgba(0,0,0,0.1) !important;
 +
padding: 0px !important;
 +
}
 +
.thumbnail img {
 +
width: 300px !important;
 +
}
 +
.dropdown-menu>li>a:hover {
 +
    background-image: none !important;
 +
    background-color: #FF7AA3 !important;
 +
}
 +
h1 {
 +
text-shadow: 0px 0px 20px #9BAAE9;
 +
}
 +
.tue-2013-igem-logo {
 +
width: 150px;
 +
position: relative;
 +
left: -80px;
 +
}
 +
.img-rounded {
 +
-webkit-box-shadow: 0 0 10px rgba(155,170,233,0.3) !important;
 +
-moz-box-shadow: 0 0 10px rgba(255,122,163,0.3) !important;
 +
box-shadow: 0 0 10px rgba(155,170,233,0.3) !important;
 +
}
 +
.tue-abstract {
 +
display: block!important;
 +
padding: 20px 40px!important;
 +
margin: 0 0 10px!important;
 +
font-size: 12pt!important;
 +
line-height: 20px!important;
 +
background-color: #f5f5f5!important;
 +
border: 1px solid #ccc!important;
 +
border: 1px solid rgba(0,0,0,.15)!important;
 +
-webkit-border-radius: 4px!important;
 +
-moz-border-radius: 4px!important;
 +
border-radius: 4px!important;
 +
}
 +
.tue-abstract > h2 {
 +
margin-top: 0px;
 +
padding-top: 0px;
 +
}
 +
.tue-reflist {
 +
    text-align: left !important;
 +
}
 +
#tue-teammember-d-Ardjan img{
 +
    position: relative !important;
 +
    left: 0px;
 +
    right: 0px;
}
}

Latest revision as of 10:47, 15 May 2014

ul {

   list-style-image: url('https://2014.igem.org/File:TUEindhoven_2014_Background.jpg');

}

  1. contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo{

display:none; }

  1. top-section{

border: none; height: 0px; }

  1. content{

border: none; }

/* Removes "teams" from the menubar */

  1. menubar > ul > li:last-child{

display: none; } /* Resizes the menubar to fik the links (default is 400px) */

  1. menubar{

width: auto; } html,body {

   height:100% !important;

} body { margin: 0px !important;

       margin-top: -10px !important;

padding: 0; background: #f2f2f2; /* Old browsers */ background: -moz-linear-gradient(-45deg, #E9E9E9 0%, #ffffff 60%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#E9E9E9), color-stop(60%,#ffffff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(-45deg, #E9E9E9 0%,#ffffff 60%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(-45deg, #E9E9E9 0%,#ffffff 60%); /* Opera 11.10+ */ background: -ms-linear-gradient(-45deg, #E9E9E9 0%,#ffffff 60%); /* IE10+ */ background: linear-gradient(135deg, #E9E9E9 0%,#ffffff 60%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E9E9E9', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ background-color: #FFFFFF; background-attachment:fixed; } .tue-content p {

   text-align: justify;

}

  1. top-section{

width: 965px; height: 0; margin: 0 auto; padding: 0; border: none; }

  1. menubar{

font-size: 65%; top: -14px; } .left-menu:hover{ background-color: transparent; }

  1. menubar li a{

background-color: transparent; }

  1. menubar:hover{

color: white; }

  1. menubar li a{

color: transparent; }

  1. menubar:hover li a{

color: black; }

/* TU Eindhoven Style */

.tue-header{

   height: 150px;

-webkit-box-shadow: inset 0px -5px 5px rgba(0,0,0,0.2) !important; -moz-box-shadow: inset 0px -5px 5px rgba(0,0,0,0.2) !important; box-shadow: inset 0px -5px 5px rgba(0,0,0,0.2) !important; } .tue-header1{

   	background: url('https://static.igem.org/mediawiki/2013/5/5e/TU-Eindhoven_Images_Header1.jpg') #b5aca5 no-repeat center top !important;

} .tue-header2{

   	background: url('https://static.igem.org/mediawiki/2013/3/3c/TU-Eindhoven_Images_Header2.jpg') #9f9b93 no-repeat center top !important;

} .tue-header3{

   	background: url('https://static.igem.org/mediawiki/2013/4/43/TU-Eindhoven_Images_Header3.jpg') #abb0af no-repeat center top !important;

} .tue-header4{

   	background: url('https://static.igem.org/mediawiki/2013/2/2d/TU-Eindhoven_Images_Header4.jpg') repeat-x center top !important;

}

.dropdown-menu{

   padding-top: 6px !important;

} .dropdown-menu li{

   display: block !important;
   width: 100% !important;

} .dropdown-menu li a{

   text-align: left !important;
   border-radius: 0px !important;

}

.editsection{

   font-size: 30% !important;

}

  1. toc{
   border: none;
   background: none;

} .tue-toc-well{

   float: right;
   margin-left: 18px;
   margin-bottom: 10px !important;

}

  1. toctitle h2{
   font-size: 11px;
   font-weight: bold;
   line-height: 20px;
   color: #999999;
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
   text-transform: uppercase;

}

  1. content{
   max-width: none !important;
   width: auto !important;
   background: none !important;
   padding: 0px !important;

}

  1. editform textarea{
   width: auto;

}

h1, h2, h3, h4 {

   padding: 0px !important;
   border-bottom: 0px !important;

} .tue-content a {

   color: #0088cc !important;

} a.btn {

   color: #FFFFFF !important;

} a.tue-tooltip {

   border-bottom: 1px #888888 dotted !important;
   color: #888888 !important;

} a.tue-tooltip:hover {

   text-decoration: none !important;

}

.tue-imagespan-left {

   float: left !important;
   margin-left: 0px !important;
   margin-right: 20px !important;

} .tue-imagespan-right {

   float: right !important;

} ol.linenums {

   margin-top: 0px !important;
   margin-bottom: 0px !important;

}

  1. bodyContent a[href^='mailto:'], .link-mailto {
   background-image: none !important;

} .tue-inlineref {

   color: #444444;

} .tue-reference {

   display: none;

} .tue-refid {

   display: none;

} .tue-refagain {

   display: none;

} .tue-attribution-table td {

   padding-top: 5px;

} .tue-float {

   display: block !important;
   margin-bottom: 15px;

} .tue-float-left {

   float: left !important;
   margin-left: 0px !important;
   margin-right: 20px !important;

} .tue-float-right {

   float: right !important;
   margin-right: 0px !important;
   margin-left: 20px !important;

} .tue-float img {

   width: 100%;

} .tue-caption {

   border-bottom: 1px solid #CCCCCC;
   margin-top: 5px;

} .tue-caption-figure {

   color: #666666;
   font-weight: bold;

} .tue-caption-text {

   color: #666666;

} .tue-figref {

   display: none;
   font-style: italic !important;

} table {

   margin-top: 8px;
   margin-bottom: 8px;

} .tue-timeline-line { height: 100%; display: block; float: left; background-color: #CCCCCC; width: 10px; margin-right: 40px; margin-left: 20px; } .tue-timeline-title { display: block; height: 100%; } .tue-timeline-content { display: block; height: 100%;

       float: left;
       margin-left: 80px;
       padding-bottom: 20px;

} .tue-timeline-top { display: block; height: 70px;

       width: 100%;
       float: left;

} .tue-timeline-bottom { display: block; height: 40px;

       float: left;
       width: 100%;
       margin-bottom: 20px;

} .tue-timeline-middle { display: block; float: left; width: 100%;

       position: relative;

} .tue-timeline-top .tue-timeline-line { height: 100%; -moz-border-radius-topright: 5px; border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 5px; } .tue-timeline-bottom .tue-timeline-line { height: 40px; -moz-border-radius-bottomright: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-left-radius: 5px; } .tue-timeline-node { display: block; float: left; text-align: center; width: 54px; height: 40px; overflow: hidden; position: relative; top: 0px; left: 0px; margin-right: -62px; padding: 3px; border: solid 1px #333333;

       background-color: #333333;

color: #FFFFFF; -moz-border-radius-bottomright: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-left-radius: 5px; -moz-border-radius-topright: 5px; border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 5px;

       font-size: 8pt;

} .tue-timeline-leftbar { display: block; float: left; width: 80px;

       position: absolute;
       top: 0px;
       bottom: 0px;

} .tue-timeline-content h3 {

   line-height: 30px;

} h2 {

   font-size: 18pt !important;

} h3 {

   font-size: 14pt !important;

} img.grayscale {

   filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+ */
   filter: gray; /* IE6-9 */
   -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
   -webkit-transition: .6s ease; /* Fade to color for Chrome and Safari */
   -webkit-transition-property: -webkit-filter,opacity,filter;
   -webkit-backface-visibility: hidden; /* Fix for transition flickering */
   opacity:0.7;
   filter:alpha(opacity=70);

}

img.grayscale:hover {

   filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
   -webkit-filter: grayscale(0%);
   opacity:1.0;
   filter:alpha(opacity=100);

}

.igemlogo {

   float: right;
   width: 60px;
   height: 49px;
   margin-top: -60px;
   margin-bottom: 10px;
   margin-right: 14px;

} .tue-upbutton {

   float: right;
   position: relative;
   top: 10px;

} .tue-gototop-sticky {

   position: fixed;
   bottom: 0px;
   right: 40px;
   background: #DEDEDE;
   padding: 10px;
   -moz-border-radius-topright: 5px;
   border-top-right-radius: 5px;
   -moz-border-radius-topleft: 5px;
   border-top-left-radius: 5px;
   display: none;

} .tue-gototop-sticky i {

   opacity:0.6;
   filter:alpha(opacity=60);

} .tue-gototop-sticky a {

   color: #555555;
   text-decoration: none;

} .tue-gototop-sticky a:hover {

   color: #555555;
   text-decoration: none;

}

  1. top {
   display: none;
   margin-top: -4px;

} .nav-tabs > li > a {

   text-align: center !important;
   -webkit-border-radius: 4px 4px 4px 4px !important;
   -moz-border-radius: 4px 4px 4px 4px !important;
   border-radius: 4px 4px 4px 4px !important;

} .nav-tabs {

   border-bottom: transparent 0px !important;
   /*width: 480px !important;*/
   margin: 10px auto !important;
   padding-left: 80px !important;

} .nav-tabs > li {

   /*width: 80px !important;*/

} .nav-tabs > .active > a, .nav-tabs > .active > a:hover, .nav-tabs > .active > a:focus, .nav-tabs > li > a:hover, .nav-tabs > li > a:focus {

   border: 1px solid #FFFFFF !important;

} /* .nav-tabs > .active > a {

   color: #FFFFFF !important;
   background: #333333 !important;

}*/ .tue-social {

   display: block !important;
   float: left !important;
   padding: 0px !important;

} .tue-menu-social {

   height: 40px;
   overflow: hidden;

} .tue-social-div {

   position: absolute;
   top: 180px;
   left: 80px;

} .navbar .container {

   width: 938px !important;

} .tue-sponsor {

   width: 397px;
   background-color: #FFFFFF !important;
   float: left;
   padding: 8px !important;

}

.tue-sponsors { margin-top: 100px; background: url('https://static.igem.org/mediawiki/2013/9/9a/TU-Eindhoven_Images_Pattern.png') repeat #EEEEEE; -webkit-box-shadow: inset 0px 10px 10px rgba(0,0,0,0.1) !important; -moz-box-shadow: inset 0px 10px 10px rgba(0,0,0,0.1) !important; box-shadow: inset 0px 10px 10px rgba(0,0,0,0.1) !important; padding: 30px; height: 260px; }

.tue-timeline-content .span1 {

   width: 51px !important;

} .tue-timeline-content .span2 {

   width: 123px !important;

} .tue-timeline-content .span3 {

   width: 195px !important;

} .tue-timeline-content .span4 {

   width: 266px !important;

} .tue-timeline-content .span5 {

   width: 338px !important;

} .tue-timeline-content .span6 {

   width: 410px !important;

} .tue-timeline-content .span7 {

   width: 481px !important;

} .tue-timeline-content .span8 {

   width: 553px !important;

} .tue-timeline-content .span9 {

   width: 625px !important;

} .tue-timeline-content .span10 {

   width: 696px !important;

} .tue-timeline-content .span11 {

   width: 768px !important;

} .tue-timeline-content .span12 {

   width: 860px !important;

} .rotate {

 -webkit-transform: rotate(-90deg);
 -moz-transform: rotate(-90deg);
 -ms-transform: rotate(-90deg);
 -o-transform: rotate(-90deg);
 transform: rotate(-90deg);
 /* also accepts left, right, top, bottom coordinates; not required, but a good idea for styling */
 -webkit-transform-origin: 50% 50%;
 -moz-transform-origin: 50% 50%;
 -ms-transform-origin: 50% 50%;
 -o-transform-origin: 50% 50%;
 transform-origin: 50% 50%;
 display: block;

} .graph_label {

 font-style: italic;
 font-size: 10pt;

} .navwrapper { margin-bottom: 20px; background-image: -webkit-linear-gradient(top,#fff,#f2f2f2); } .navbar { margin-bottom: 0px !important; } .navbar-inner { background-image: none !important; border: 0px; border-radius: 0px; border-left: solid 1px #eaeaea; border-right: solid 1px #eaeaea; } li.active > a { background: none !important; /*-webkit-box-shadow: 0 0 10px rgba(255,122,163,1) !important; -moz-box-shadow: 0 0 10px rgba(255,122,163,1) !important; box-shadow: 0 0 10px rgba(255,122,163,1) !important;*/ background: none !important;

       background-color: #FFE8FC !important;

border-radius: 0px !important; }

  1. globalWrapper {

padding: 0px !important; } .fb-like {

   margin-left: 14px;

} .thumbnail { -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.1) !important; -moz-box-shadow: 3px 3px 5px rgba(0,0,0,0.1) !important; box-shadow: 3px 3px 5px rgba(0,0,0,0.1) !important; padding: 0px !important; } .thumbnail img { width: 300px !important; } .dropdown-menu>li>a:hover {

   background-image: none !important;
   background-color: #FF7AA3 !important;

} h1 { text-shadow: 0px 0px 20px #9BAAE9; } .tue-2013-igem-logo { width: 150px; position: relative; left: -80px; } .img-rounded { -webkit-box-shadow: 0 0 10px rgba(155,170,233,0.3) !important; -moz-box-shadow: 0 0 10px rgba(255,122,163,0.3) !important; box-shadow: 0 0 10px rgba(155,170,233,0.3) !important; } .tue-abstract { display: block!important; padding: 20px 40px!important; margin: 0 0 10px!important; font-size: 12pt!important; line-height: 20px!important; background-color: #f5f5f5!important; border: 1px solid #ccc!important; border: 1px solid rgba(0,0,0,.15)!important; -webkit-border-radius: 4px!important; -moz-border-radius: 4px!important; border-radius: 4px!important; } .tue-abstract > h2 { margin-top: 0px; padding-top: 0px; } .tue-reflist {

   text-align: left !important;

}

  1. tue-teammember-d-Ardjan img{
   position: relative !important;
   left: 0px;
   right: 0px;

}