"

From 2014.igem.org

body {

 margin: 0;
 background-image: url("background.jpg");

background-size: cover; }

1. header {

 width: 60em;
 height: 7em;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 1em;

}

.headerContentFirst {

 vertical-align: middle;
 text-align: right;

}

.headerContent { vertical-align: middle; text-align: right; width: 1%; }

.menuButton { background: transparent; border: 0px; border-bottom: thick solid #FFFFFF; font-family: 'Lato', sans-serif; font-size: 1.25em; color: white; text-transform: uppercase; margin: 0.5em; cursor: pointer; }

1. header a:link {

   text-decoration: none;

}

1. header a:visited {

   text-decoration: none;

}

1. header a:hover {

   text-decoration: none;

}

1. header a:active {

   text-decoration: none;

}

p a { color: white; }

1. iGEMLogo {

 width: 5em;
 margin: 0.5em;

}

1. content {

 width: 60em;
 height: 25em;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 1em;
 display: table;
 height: 70%;
 vertical-align: middle;

}

1. contentRow {

 display: table-row;

}

1. teamLogo {

 position: relative;
 display: table-cell;
 vertical-align: middle;
 text-align: center;
 width: 19em;

}

1. logoImage {

 width: 18em;

}

1. pageContent {

 position: relative;
 display: table-cell;
 vertical-align: middle;
 text-align: center;
 width: 40em;
 height: 100%;

}

.title {

 font-family: 'Lato', sans-serif;

font-size: 3.1em; letter-spacing: -2px; color: white; font-weight: 250; margin-top: 0.25em; margin-bottom: 0.25em; }

h2 { font-family: 'Lato', sans-serif; font-size: 1.5em; color: white; text-transform: uppercase; font-weight: 400; }

.subtitle { font-family: 'Lato', sans-serif; font-size: 1em; color: white; text-transform: uppercase; font-weight: 400; margin-top: 0.1em; margin-bottom: 0.1em; }

.caption h1 { color: #000000; font-family: 'Lato', sans-serif; font-size: 2em; margin-bottom: 0; }

.caption p { color: #000000; font-family: 'Lato', sans-serif; }

.dataTable { border-collapse: collapse; margin: 20px; }

.dataTable, .dataTable th, .dataTable tr {

   border: 1px solid white;

}

.dataTable th { background-color: white; color: black; font-weight: 600; }

.dataTable td { vertical-align: top; border: 1px solid white; color: white; padding: 2px }

1. timer {

width: 100%; text-align: center; vertical-align: middle; color: white; margin-bottom: 1em; margin-top: 1em; }

.timerCell { width: 25%; }

.timerValue { color: white; font-family: 'Lato', sans-serif; font-size: 3.5em; font-weight: 900; }

.timerDesc { color: white; font-family: 'Lato', sans-serif; font-size: 1em; text-transform: uppercase; }

.formField { background: #6e6e6e; background: rgba(169,169,169,0.2); border: 1px solid #6e6e6e; color: #ffffff; font-family: 'Lato', sans-serif; font-size: 1em; padding: 0.35em; text-transform: lowercase; width: 15em; }

.buttonStyle { background: #73ba37; background: rgba(115,186,55,0.8); border: 1px solid #6e6e6e; color: #ffffff; font-family: 'Lato', sans-serif; font-size: 1em; padding: 0.35em; white-space: normal; }

.buttonStyleInactive { background: #6c6c6c; background: rgba(108,108,108,0.8); border: 1px solid #6e6e6e; color: #ffffff; font-family: 'Lato', sans-serif; font-size: 1em; padding: 0.35em; white-space: normal; }

.sponsorHolder { background: rgba(255, 255, 255, 0.3);

       width: 100%;
       height: 8em;
       margin: 5px;
       display: table;
     }
     
     .sponsorHolder div, .sponsorHolder p {
       display: table-cell;
       vertical-align: middle;
       height: 100%;
       color: white;
       padding: 10px;
       text-align: center;
     }
     
     .sponsorHolder div {
       width: 1%;
     }
     
     .sponsorHolder img {
       height: 3em;
     }

1. footer {

 width: 60em;
 height: 7em;
 margin-left: auto;
 margin-right: auto;
 text-align: center;

}

.sponsorImage {

 height: 3em;

}

p { font-family: 'Lato', sans-serif; font-size: 1em; color: white; font-weight: 400; }

a.socialIcons { margin-right: 5px; /* Increase the number to increase the space between the icons */

}

a.socialIcons:hover { opacity: .8; filter:alpha(opacity=80); width: 10px; height: 10px;/* For IE8 and earlier */ }

.imageHolder { position: relative; width: 175px; height: 175px; padding: 0px 10px 5px 0px; }

.imageHolder .caption { opacity: 0; position: absolute; height:175px; width: 235px; top: 0px; left: 0px; padding: 0px 0px; color: black; background: #75FF75; text-align: center; font-family: calibri; font-size: 15px; transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; -webkit-transition: opacity 0.5s ease-in-out; }

.imageHolder:hover .caption { opacity: 0.9; }