"

From 2013.igem.org

html, body { height: 100%; }

body { margin: 0px; padding: 0px; background: rgba(0,0,0,.04); font-family: 'Source Sans Pro', sans-serif; font-size: 12pt; font-weight: 300; color: #363636; }

h1, h2, h3 { margin: 0; padding: 0; }

p, ol, ul { margin-top: 0px; }

p { line-height: 190%; }

strong { }

a { color: #171717; }

a:hover { text-decoration: none; }

a img { border: none; }

.image { display: inline-block; }

.image img { display: block; width: 100%; }

.image-full { display: block; width: 100%; margin: 0 0 2em 0; }

.image-left { float: left; margin: 0 2em 2em 0; }

.image-centered { display: block; margin: 0 0 2em 0; }

.image-centered img { margin: 0 auto; width: auto; }

hr { display: none; }

/*********************************************************************************/ /* List Styles */ /*********************************************************************************/

ul.style1 { margin: 0; padding: 0; list-style: none; }

ul.style1 li { border-top: solid 1px #E5E5E5; padding: 0.80em 0; }

ul.style1 li:first-child { border-top: 0; padding-top: 0; }

ul.style2 { margin: 0; padding: 0; list-style: none; }

ul.style2 li { border-top: solid 1px #E5E5E5; padding: 0.80em 0; }

ul.style2 li:first-child { border-top: 0; padding-top: 0; }

/*********************************************************************************/ /* Social Icon Styles */ /*********************************************************************************/

ul.contact { margin: 0; padding: 1.5em 0em 2.5em 0em; list-style: none; }

ul.contact li { display: inline-block; padding: 0em 0.30em; font-size: 1em; }

ul.contact li span { display: none; margin: 0; padding: 0; }

ul.contact li a { color: #FFF; }

ul.contact li a:before { display: inline-block; background: #3f3f3f; width: 40px; height: 40px; line-height: 40px; border-radius: 20px; text-align: center; color: #FFFFFF; }

ul.contact li a.icon-twitter:before { background: #2DAAE4; } ul.contact li a.icon-facebook:before { background: #39599F; } ul.contact li a.icon-dribbble:before { background: #C4376B; } ul.contact li a.icon-tumblr:before { background: #31516A; } ul.contact li a.icon-rss:before { background: #F2600B; }

/*********************************************************************************/ /* Heading Titles */ /*********************************************************************************/

.title { margin-bottom: 2em; text-transform: uppercase; }

.title h2 { letter-spacing: 0.20em; font-weight: 700; font-size: 2em; color: #9B0808; }

.title .byline { letter-spacing: 0.15em; text-transform: uppercase; font-weight: 400; font-size: 0.90em; color: #6F6F6F; }

/** WRAPPER */

1. wrapper {

background: #FFFFFF url(images/bg01.png) repeat; }

1. footer-wrapper

{ background: #0F0F0F; }

.container { width: 1200px; margin: 0px auto; }

.clearfix { clear: both; }

/*********************************************************************************/ /* Wrappers */ /*********************************************************************************/

1. header-wrapper

{ overflow: hidden; height: 350px; background: url('images/banner.jpg') no-repeat top center; background-size: 100%; }

/*********************************************************************************/ /* Header */ /*********************************************************************************/

#header { position: relative; overflow: hidden; text-align: center; }

/*********************************************************************************/ /* Logo */ /*********************************************************************************/

#logo { width: 500px; height: 100px; margin: 0 auto; padding: 2em 0em; text-transform: uppercase; background: #9B0808; }

#logo h1 { letter-spacing: 0.10em; font-size: 3em; }

#logo p { letter-spacing: 0.10em; color: #FFF; }

#logo a { text-decoration: none; color: #FFF; }

/*********************************************************************************/ /* Banner */ /*********************************************************************************/

#banner { position: absolute; left: 0; overflow: hidden; z-index: 1; }

#banner .image { border: 5px solid #FFFFFF; }

/** MENU */

1. menu-wrapper

{ background: #9B0808; }

1. menu {

overflow: hidden; height: 100px; }

1. menu ul {

margin: 0; padding: 0px 0px 0px 0px; list-style: none; line-height: normal; text-align: center; }

1. menu li {

display: inline-block; }

1. menu a {

display: block; letter-spacing: 1px; line-height: 100px; padding: 0 40px; text-decoration: none; text-align: center; text-transform: uppercase; font-size: 0.80em; font-weight: 600; border: none; color: #FFF; }

1. menu a:hover, #menu .current_page_item a {

text-decoration: none; }

1. menu .current_page_item a {

background: #800707; }

/** PAGE */

1. page

{ position: relative; overflow: hidden; padding: 6em 0em 5em 0em; }

/** CONTENT */

1. content

{ float: right; width: 790px; }

/*********************************************************************************/ /* Sidebar */ /*********************************************************************************/

#sidebar { float: left; width: 345px; }

#sidebar .title h2 { font-size: 1.6em; }

#sidebar .box1 { margin-bottom: 3em; }

/*********************************************************************************/ /* Copyright */ /*********************************************************************************/

#copyright { overflow: hidden; padding: 5em 0em; text-align: center; }

#copyright p { letter-spacing: 0.20em; text-align: center; text-transform: uppercase; font-size: 0.80em; color: #6F6F6F; }

#copyright a { text-decoration: none; color: #8C8C8C; }

/*********************************************************************************/ /* Welcome */ /*********************************************************************************/

#welcome { overflow: hidden; padding: 5em 0em; border-bottom: 1px solid #E5E5E5; text-align: center; }

#welcome h2 { letter-spacing: 0.20em; text-transform: uppercase; font-size: 2.6em; }

#welcome p { font-size: 1.3em; }

#welcome .byline { display: block; padding: 0em 0em 1.5em 0em; letter-spacing: 0.15em; text-transform: uppercase; font-weight: 400; font-size: 1.2em; color: #6F6F6F; }

/*********************************************************************************/ /* Portfolio */ /*********************************************************************************/

#portfolio-wrapper { background: rgba(0,0,0,.04); padding: 6em 0em; }

#portfolio { overflow: hidden; }

#portfolio .title h2 { font-size: 1.2em; color: #9B0808; }

#portfolio .byline { font-size: 1em; color: #EEA7C1; }

#column1, #column2, #column3, #column4 { width: 282px; }

#column1, #column2 { float: left; margin-right: 24px; }

#column3 { float: left; }

#column4 { float: right; }

/*********************************************************************************/ /* Button Style */ /*********************************************************************************/

.button { display: inline-block; margin-top: 1.5em; padding: 0.50em 3em 0.50em 2em; background: #9B0808; letter-spacing: 0.20em; text-decoration: none; text-transform: uppercase; font-weight: 400; font-size: 0.90em; color: #FFF; }

.button:before { display: inline-block; width: 40px; height: 40px; line-height: 40px; border-radius: 20px; text-align: center; color: #FFF; }

/*********************************************************************************/ /* Footer */ /*********************************************************************************/

#footer-wrapper { overflow: hidden; padding: 5em 0em; background: #1E1B1A; }

#footer { color: #ADADAD; }

#footer .title h2 { font-weight: 400; font-size: 1.2em; color: #FFF; }

#footer .title { border-color: #2D2926 !important; }

#footer .style1 li { border-color: #2D2926 !important; }

#footer .style1 a { letter-spacing: 0.10em; font-size:1em; color: #B1B1B1; }

#box1 { float: left; width: 354px; margin-right: 24px; padding-right: 30px; }

#box2 { float: left; width: 354px; margin-left: 24px; padding-right: 30px; }

#box3 { float: right; width: 344px; padding-left: 40px; }