"

From 2013.igem.org

@import url(http://fonts.googleapis.com/css?family=Marck+Script); @import url(http://fonts.googleapis.com/css?family=Mouse+Memoirs);

html, body { width: 100%; height: 100%;

margin: 0; padding: 0;

background-color: #DCD8D0;

font-size: 16px; }

/********/ /*HEADER*/ /********/

1. tn-header-wrap {

display: inline-block;

width: 100%; height: 250px;

margin: 0; padding: 0;

background-color: #2880C5; border-bottom: 7px solid white;

background-image: url(imgs/sfondobb.png); background-position: center; background-size: 100%; }

1. tn-header {

display: static; position: relative; top: 0;

max-width: 1300px; height: 180px;

margin: 0 auto; padding: 1em; }

/*-----------*/ /*HEADER MENU*/ /*-----------*/

1. tn-header #tn-menu {

position: absolute; top: 170px; left: 0;

width: 100%;

margin: 0; padding: 0;

list-style: none; text-align: center; }

1. tn-header #tn-menu > li {

display: inline-block;

height: 100px; width: 100px;

margin: 0.5em;

background-position: center center; background-repeat: no-repeat; background-size: 75%;

line-height: 100px; /*font-weight: bold;*/ text-shadow: 0 0 2px black; text-align: center; vertical-align: middle; }

1. tn-header #tn-menu > li > a {

display: block; padding: 0.3em 0.5em; margin-top: 2.2em; border-radius: 0.5em; border: 3px solid white; background: rgba(31,68,87,.9); color: #ffffff; font-family: 'Mouse Memoirs', sans-serif; font-size: 1.5em; line-height: 1em; text-decoration: none; }

1. tn-header #tn-menu > li:hover {

transform: rotate(-15deg); -ms-transform: rotate(-15deg); /* IE 9 */ -webkit-transform: rotate(-15deg); /* Safari and Chrome */

background-size: 100%; }

1. tn-header #tn-menu > li:hover > a {

padding: 0.3em 0.5em; margin-top: 2.2em; border-radius: 0.5em; border: 3px solid white; background: #C4221C; font-family: 'Mouse Memoirs', sans-serif; font-size: 1.5em; line-height: 1em; text-decoration: underline; }

/*SUB MENU*/

1. tn-header #tn-menu li ul {

display: none; position: relative; top: 2.5em;

width: 500px; height: 1em;

padding: 0; padding-top: 1em; margin: 0; margin-top: 1em;

line-height: 1em; list-style: none;

transform: rotate(15deg); -ms-transform: rotate(15deg); /* IE 9 */ -webkit-transform: rotate(15deg); /* Safari and Chrome */

text-align: left; }

1. tn-header #tn-menu li:hover ul {

display: block; }

1. tn-header #tn-menu li ul li {

display: inline-block; height: 1.4em;

margin: 0; padding: 0;

font-family: 'Mouse Memoirs', sans-serif; font-size: 1.5em; font-variant: small-caps;

line-height: 1em; }

1. tn-header #tn-menu li ul li a {

display: block; padding-top: 0em; margin: 0 0.5em; color: #1F4457; text-decoration: none; text-shadow: none; }

1. tn-header #tn-menu li ul li:hover a {

color: #C4221C; text-decoration: underline; }

/*------------*/ /*HEADER LOGHI*/ /*------------*/

1. tn-header #tn-loghi {

width: 100%; height: 180px; }

1. tn-header #tn-loghi .title {

margin: 0; margin-top: 0.3em;

color: #eee;

font-family: 'Marck Script', cursive; font-size: 7em;

line-height: 1em; text-align: center; text-shadow: 1px 1px 2px #000; }

/*******************/ /*CENTRAL CONTAINER*/ /*******************/

1. tn-central-container {

display: block;

max-width: 1300px; min-height: 600px;

margin: 0 auto; padding: 1em 0;

background-color: #dadada; }

1. tn-content-wrap {

display: static;

max-width: 1200px; min-height: 600px;

margin: 0 auto; margin-top: 6em; padding: 1px;

background-color: #767676; }

1. tn-content {

display: static;

max-width: 1200px; height: 100%;

padding: 1em;

background-color: #ffffff; }

/********/ /*FOOTER*/ /********/

1. tn-footer-wrap {

display: inline-block;

width: 100%; height: 250px;

margin: 0; padding: 0;

background-color: #323232; }

1. tn-footer {

display: static;

max-width: 1300px; max-height: 180px;

margin: 1em auto; padding: 1em;

background-color: #ffffff; overflow: hidden; }