Template:SMTexas/CSS

From 2014hs.igem.org

(Difference between revisions)
Line 1: Line 1:
 +
/* Resets (http://meyerweb.com/eric/tools/css/reset/ | v2.0 | 20110126 | License: none (public domain)) */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,detafils,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}body{-webkit-text-size-adjust:none}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,detafils,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}body{-webkit-text-size-adjust:none}
 +
/* Box Model */
-
html, body
+
*, *:before, *:after {
-
{
+
-moz-box-sizing: border-box;
-
height: 100%;
+
-webkit-box-sizing: border-box;
-
}
+
-o-box-sizing: border-box;
 +
-ms-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
-
body
+
/* Container */
-
{
+
-
margin: 0px;
+
-
padding: 0px;
+
-
background: #383838;
+
-
font-family: 'Source Sans Pro', sans-serif;
+
-
font-size: 11pt;
+
-
font-weight: 300;
+
-
color: #6c6c6c
+
-
}
+
-
h1, h2, h3
+
body {
-
{
+
min-width: 1200px;
-
margin: 0;
+
}
-
padding: 0;
+
-
font-weight: 600;
+
-
color: #454445;
+
-
}
+
-
p, ol, ul
+
.container {
-
{
+
width: 1200px;
-
margin-top: 0;
+
margin-left: auto;
-
}
+
margin-right: auto;
 +
}
-
ol, ul
+
/* Modifiers */
-
{
+
-
padding: 0;
+
.container.small {
-
list-style: none;
+
width: 900px;
-
}
+
}
-
p
+
.container.big {
-
{
+
width: 100%;
-
line-height: 180%;
+
max-width: 1500px;
-
}
+
min-width: 1200px;
 +
}
-
strong
+
/* Grid */
-
{
+
-
}
+
-
a
+
/* Cells */
-
{
+
-
color: #2C383B;
+
-
}
+
-
a:hover
+
.\31 2u { width: 100% }
-
{
+
.\31 1u { width: 91.6666666667% }
-
text-decoration: none;
+
.\31 0u { width: 83.3333333333% }
-
}
+
.\39 u { width: 75% }
 +
.\38 u { width: 66.6666666667% }
 +
.\37 u { width: 58.3333333333% }
 +
.\36 u { width: 50% }
 +
.\35 u { width: 41.6666666667% }
 +
.\34 u { width: 33.3333333333% }
 +
.\33 u { width: 25% }
 +
.\32 u { width: 16.6666666667% }
 +
.\31 u { width: 8.3333333333% }
 +
.\-11u { margin-left: 91.6666666667% }
 +
.\-10u { margin-left: 83.3333333333% }
 +
.\-9u { margin-left: 75% }
 +
.\-8u { margin-left: 66.6666666667% }
 +
.\-7u { margin-left: 58.3333333333% }
 +
.\-6u { margin-left: 50% }
 +
.\-5u { margin-left: 41.6666666667% }
 +
.\-4u { margin-left: 33.3333333333% }
 +
.\-3u { margin-left: 25% }
 +
.\-2u { margin-left: 16.6666666667% }
 +
.\-1u { margin-left: 8.3333333333% }
-
.container
+
.row > * {
-
{
+
padding: 40px 0 0 40px;
-
margin: 0px auto;
+
float: left;
-
width: 1200px;
+
-moz-box-sizing: border-box;
-
}
+
-webkit-box-sizing: border-box;
 +
-o-box-sizing: border-box;
 +
-ms-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
-
/*********************************************************************************/
+
.row + .row > * {
-
/* Image Style                                                                  */
+
padding-top: 40px;
-
/*********************************************************************************/
+
}
-
.image
+
.row {
-
{
+
margin-left: -40px;
-
display: inline-block;
+
}
-
}
+
-
.image img
+
/* Rows */
-
{
+
-
display: block;
+
-
width: 100%;
+
-
}
+
-
.image-full
+
.row:after {
-
{
+
content: '';
-
display: block;
+
display: block;
-
width: 100%;
+
clear: both;
-
margin: 0 0 2em 0;
+
height: 0;
-
}
+
}
-
.image-left
+
.row:first-child > * {
-
{
+
padding-top: 0;
-
float: left;
+
}
-
margin: 0 2em 2em 0;
+
-
}
+
-
.image-centered
+
.row > * {
-
{
+
padding-top: 0;
-
display: block;
+
}
-
margin: 0 0 2em 0;
+
-
}
+
-
.image-centered img
+
/* Modifiers */
-
{
+
-
margin: 0 auto;
+
-
width: auto;
+
-
}
+
-
/*********************************************************************************/
+
/* Flush */
-
/* List Styles                                                                  */
+
-
/*********************************************************************************/
+
-
ul.style1
+
.row.flush {
-
{
+
margin-left: 0;
-
margin: 0;
+
}
-
padding: 0em 0em 0em 0em;
+
-
overflow: hidden;
+
-
list-style: none;
+
-
color: #6c6c6c
+
-
}
+
-
ul.style1 li
+
.row.flush > * {
-
{
+
padding: 0 !important;
-
overflow: hidden;
+
}
-
display: block;
+
-
padding: 2.80em 0em;
+
-
border-top: 1px solid #D1CFCE;
+
-
}
+
-
ul.style1 li:first-child
+
/* Quarter */
-
{
+
-
padding-top: 0;
+
-
border-top: none;
+
-
}
+
-
ul.style1 .image-left
+
.row.quarter > * {
-
{
+
padding: 10px 0 0 10px;
-
margin-bottom: 0;
+
}
-
}
+
-
ul.style1 h3
+
.row.quarter + .row.quarter > * {
-
{
+
padding-top: 10px;
-
padding: 1.2em 0em 1em 0em;
+
}
-
letter-spacing: 0.10em;
+
-
text-transform: uppercase;
+
-
font-size: 1.2em;
+
-
font-weight: 600;
+
-
color: #454445;
+
-
}
+
-
ul.style1 a
+
.row.quarter {
-
{
+
margin-left: -10px;
-
text-decoration: none;
+
}
-
color: #525252;
+
-
}
+
-
ul.style1 a:hover
+
/* Half */
-
{
+
-
text-decoration: underline;
+
-
color: #525252;
+
-
}
+
-
ul.style2
+
.row.half > * {
-
{
+
padding: 20px 0 0 20px;
-
margin: 0;
+
}
-
padding-top: 1em;
+
-
list-style: none;
+
-
}
+
-
ul.style2 li
+
.row.half + .row.half > * {
-
{
+
padding-top: 20px;
-
border-top: solid 1px #E5E5E5;
+
}
-
padding: 0.80em 0 0.80em 0;
+
-
font-family: 0.80em;
+
-
}
+
-
ul.style2 li:before
+
.row.half {
-
{
+
margin-left: -20px;
-
display: inline-block;
+
}
-
padding: 4px;
+
-
background: #DB3256;
+
-
}
+
-
ul.style2 a
+
/* One and (a) Half */
-
{
+
-
display: inline-block;
+
-
margin-left: 1em;
+
-
}
+
-
ul.style2 li:first-child
+
.row.oneandhalf > * {
-
{
+
padding: 60px 0 0 60px;
-
border-top: 0;
+
}
-
padding-top: 0;
+
-
}
+
-
ul.style2 .icon
+
.row.oneandhalf + .row.oneandhalf > * {
-
{
+
padding-top: 60px;
-
color: #FFF;
+
}
-
}
+
-
ul.style3
+
.row.oneandhalf {
-
{
+
margin-left: -60px;
-
margin: 0;
+
}
-
padding-top: 1em;
+
-
list-style: none;
+
-
}
+
-
ul.style3 li
+
/* Double */
-
{
+
-
border-top: solid 1px rgba(255,255,255,.2);
+
-
padding: 1em 0 1em 0;
+
-
font-family: 0.80em;
+
-
}
+
-
ul.style3 li:before
+
.row.double > * {
-
{
+
padding: 80px 0 0 80px;
-
display: inline-block;
+
}
-
padding: 4px;
+
-
background: #FFF;
+
-
}
+
-
ul.style3 a
+
.row.double + .row.double > * {
-
{
+
padding-top: 80px;
-
display: inline-block;
+
}
-
margin-left: 1em;
+
-
font-size: 1em !important;
+
-
color: #FFF;
+
-
}
+
-
ul.style3 li:first-child
+
.row.double {
-
{
+
margin-left: -80px;
-
border-top: 0;
+
}
-
padding-top: 0;
+
-
}
+
-
ul.style3 .icon
+
 
-
{
+
@charset 'UTF-8';
-
color: #DB3256;
+
 
-
}
+
@font-face{font-family:'FontAwesome';src:url('font/fontawesome-webfont.eot?v=4.0.1');src:url('font/fontawesome-webfont.eot?#iefix&v=4.0.1') format('embedded-opentype'),url('font/fontawesome-webfont.woff?v=4.0.1') format('woff'),url('font/fontawesome-webfont.ttf?v=4.0.1') format('truetype'),url('font/fontawesome-webfont.svg?v=4.0.1#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}
 +
 
 +
/*
 +
TXT 2.5 by HTML5 UP
 +
html5up.net | @n33co
 +
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
*/
/*********************************************************************************/
/*********************************************************************************/
-
/* Social Icon Styles                                                            */
+
/* Basic                                                                        */
/*********************************************************************************/
/*********************************************************************************/
-
ul.contact
+
*
-
{
+
{
-
margin: 0;
+
-moz-box-sizing: border-box;
-
padding: 2em 0em 0em 0em;
+
-webkit-box-sizing: border-box;
-
list-style: none;
+
-o-box-sizing: border-box;
-
}
+
-ms-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
-
ul.contact li
+
body
-
{
+
{
-
display: inline-block;
+
font-family: 'Open Sans', sans-serif;
-
padding: 0em 0.30em;
+
font-weight: 400;
-
font-size: 1em;
+
background: #f2f5f3;
-
}
+
color: #6b7770;
 +
font-size: 11.5pt;
 +
line-height: 2em;
 +
}
 +
 +
h1, h2, h3, h4, h5, h6, h7
 +
{
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
font-weight: 700;
 +
text-transform: uppercase;
 +
color: #6b7770;
 +
}
-
ul.contact li span
+
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, h7 a
-
{
+
{
-
display: none;
+
text-decoration: none;
-
margin: 0;
+
color: inherit;
-
padding: 0;
+
}
-
}
+
-
ul.contact li a
+
-
{
+
h2.major
-
color: #FFF;
+
{
-
}
+
position: relative;
 +
border-top: solid 5px #e7eae8;
 +
}
-
ul.contact li a:before
+
h2.major span
-
{
+
{
-
display: inline-block;
+
background: #fff;
-
background: #3f3f3f;
+
position: relative;
-
width: 40px;
+
display: inline-block;
-
height: 40px;
+
}
-
line-height: 40px;
+
-
border-radius: 20px;
+
-
text-align: center;
+
-
color: #FFFFFF;
+
-
}
+
-
ul.contact li a.icon-twitter:before
+
#footer h2.major span
-
{
+
{
-
background: #2DAAE4;
+
background: #f2f5f3;
-
}
+
}
 +
 +
a
 +
{
 +
color: #006376;
 +
text-decoration: underline;
 +
}
-
ul.contact li a.icon-facebook:before
+
a:hover
-
{
+
{
-
background: #39599F;
+
text-decoration: none;
-
}
+
}
-
ul.contact li a.icon-dribbble:before
+
form
-
{
+
{
-
background: #C4376B;
+
}
-
}
+
 +
form input,
 +
form select,
 +
form textarea
 +
{
 +
-webkit-appearance: none;
 +
}
 +
 +
br.clear
 +
{
 +
clear: both;
 +
}
 +
 +
p, ul, ol, dl, table
 +
{
 +
margin-bottom: 3em;
 +
}
 +
 +
section,
 +
article
 +
{
 +
margin-bottom: 6em;
 +
}
 +
 +
section > :last-child,
 +
article > :last-child
 +
{
 +
margin-bottom: 0;
 +
}
-
ul.contact li a.icon-tumblr:before
+
section:last-child,
-
{
+
article:last-child
-
background: #31516A;
+
{
-
}
+
margin-bottom: 0;
 +
}
-
ul.contact li a.icon-rss:before
+
.byline
-
{
+
{
-
background: #F2600B;
+
display: block;
-
}
+
font-family: 'Open Sans Condensed', sans-serif;
 +
font-weight: 700;
 +
text-transform: uppercase;
 +
color: #c1cac5;
 +
}
-
/*********************************************************************************/
+
.image
-
/* Button Style                                                                  */
+
{
-
/*********************************************************************************/
+
position: relative;
 +
display: inline-block;
 +
border-radius: 8px;
 +
}
 +
 +
.image img
 +
{
 +
display: block;
 +
width: 100%;
 +
border-radius: 8px;
 +
}
 +
 +
/*
 +
Note: The following style adds the textured/pixelated look to content
 +
images. I added this to help mask the distortion introduced when a browser
 +
resizes an image, but if you don't want this to happen just remove or comment
 +
out the entire style.
 +
*/
 +
 +
.image:before
 +
{
 +
content: '';
 +
position: absolute;
 +
left: 0;
 +
top: 0;
 +
width: 100%;
 +
height: 100%;
 +
background: url('https://static.igem.org/mediawiki/2014hs/5/5c/Overlay.png');
 +
opacity: 0.2;
 +
border-radius: 8px;
 +
}
 +
.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;
 +
}
 +
.button
.button
-
{
+
{
-
display: inline-block;
+
display: inline-block;
-
padding: 1.3em 3em;
+
font-family: 'Open Sans Condensed', sans-serif;
-
background: #1B9772;
+
font-weight: 700;
-
-moz-transition: opacity 0.25s ease-in-out;
+
text-transform: uppercase;
-
-webkit-transition: opacity 0.25s ease-in-out;
+
text-decoration: none;
-
-o-transition: opacity 0.25s ease-in-out;
+
background: #e3daa8;
-
-ms-transition: opacity 0.25s ease-in-out;
+
color: #fff;
-
transition: opacity 0.25s ease-in-out;
+
border-radius: 8px;
-
letter-spacing: 0.20em;
+
outline: 0;
-
text-decoration: none;
+
-moz-transition: background-color .2s ease-in-out;
-
text-transform: uppercase;
+
-webkit-transition: background-color .2s ease-in-out;
-
font-weight: 600;
+
-o-transition: background-color .2s ease-in-out;
-
color: #FFF;
+
-ms-transition: background-color .2s ease-in-out;
-
}
+
transition: background-color .2s ease-in-out;
 +
}
-
.button:hover
+
.button:hover
-
{
+
{
-
}
+
background: #ebe3b2;
 +
}
 +
 +
.button-alt
 +
{
 +
background: #c1cac5;
 +
}
-
.button:active
+
.button-alt:hover
-
{
+
{
-
}
+
background: #ccd5d0;
 +
}
-
.button-big
+
.actions
-
{
+
{
-
padding: 1.6em 4em;
+
}
-
font-size: 1.4em;
+
-
font-weight: 900;
+
-
}
+
-
/*********************************************************************************/
+
ul.style1
-
/* Heading Titles                                                                */
+
{
-
/*********************************************************************************/
+
list-style: disc;
 +
padding-left: 1.5em;
 +
}
-
.title
+
ul.style2
-
{
+
{
-
margin-bottom: 3em;
+
}
-
}
+
 +
ul.style2 > li
 +
{
 +
border-top: solid 2px #e7eae8;
 +
padding-top: 2.35em;
 +
margin-top: 2.35em;
 +
}
 +
 +
ul.style2 > li:first-child
 +
{
 +
border-top: 0;
 +
padding-top: 0;
 +
margin-top: 0;
 +
}
-
.title h2
+
ul.contact
-
{
+
{
-
font-weight: 400;
+
}
-
font-size: 2.8em;
+
-
color: #323232;
+
ul.contact li
-
}
+
{
 +
position: relative;
 +
display: inline-block;
 +
margin: 0 0.25em 0 0.25em;
 +
top: 0;
 +
-moz-transition: top .15s ease-in-out;
 +
-webkit-transition: top .15s ease-in-out;
 +
-o-transition: top .15s ease-in-out;
 +
-ms-transition: top .15s ease-in-out;
 +
transition: top .15s ease-in-out;
 +
}
-
.title .byline
+
ul.contact li a
-
{
+
{
-
letter-spacing: 0.15em;
+
display: block;
-
text-transform: uppercase;
+
position: relative;
-
font-weight: 400;
+
width: 48px;
-
font-size: 1.1em;
+
height: 48px;
-
color: #6F6F6F;
+
border-radius: 6px;
-
}
+
outline: 0;
 +
-moz-transition: background-color .2s ease-in-out;
 +
-webkit-transition: background-color .2s ease-in-out;
 +
-o-transition: background-color .2s ease-in-out;
 +
-ms-transition: background-color .2s ease-in-out;
 +
transition: background-color .2s ease-in-out;
 +
background: #c1cac5;
 +
text-align: center;
 +
}
 +
 +
ul.contact li a:before
 +
{
 +
color: #f2f5f3;
 +
font-size: 32px;
 +
line-height: 48px;
 +
}
 +
 +
ul.contact li:hover a.fa-facebook { background-color: #3C5A98; }
 +
ul.contact li:hover a.fa-twitter { background-color: #2DAAE4; }
 +
ul.contact li:hover a.fa-rss { background-color: #F2600B; }
 +
ul.contact li:hover a.fa-dribbble { background-color: #C4376B; }
 +
ul.contact li:hover a.fa-linkedin { background-color: #006599; }
 +
ul.contact li:hover a.fa-tumblr { background-color: #31516A; }
 +
ul.contact li:hover a.fa-google-plus { background-color: #DA2713; }
-
/*********************************************************************************/
+
ul.contact li:hover
-
/* Header                                                                        */
+
{
-
/*********************************************************************************/
+
top: -5px;
 +
}
 +
 
 +
ul.contact li:active
 +
{
 +
top: 0;
 +
}
 +
 
 +
ul.special
 +
{
 +
}
-
#header-wrapper
+
ul.special li
-
{
+
{
-
padding: 2em 0em;
+
position: relative;
-
background: #FFF;
+
display: inline-block;
-
}
+
margin: 0 1.5em 0 1.5em;
 +
top: 0;
 +
-moz-transition: top .15s ease-in-out;
 +
-webkit-transition: top .15s ease-in-out;
 +
-o-transition: top .15s ease-in-out;
 +
-ms-transition: top .15s ease-in-out;
 +
transition: top .15s ease-in-out;
 +
}
-
#header
+
ul.special li:hover
-
{
+
{
-
position: relative;
+
top: -10px;
-
height: 100px;
+
}
-
}
+
 
 +
ul.special li:hover a
 +
{
 +
background: #b9d2ce;
 +
}
 +
 
 +
ul.special a
 +
{
 +
display: block;
 +
position: relative;
 +
background: #c1cac5;
 +
width: 12em;
 +
height: 12em;
 +
border-radius: 6em;
 +
outline: 0;
 +
-moz-transition: background-color .2s ease-in-out;
 +
-webkit-transition: background-color .2s ease-in-out;
 +
-o-transition: background-color .2s ease-in-out;
 +
-ms-transition: background-color .2s ease-in-out;
 +
transition: background-color .2s ease-in-out;
 +
}
 +
 
 +
ul.special a:before
 +
{
 +
position: absolute;
 +
width: 128px;
 +
height: 128px;
 +
font-size: 96px;
 +
line-height: 128px;
 +
left: 50%;
 +
top: 50%;
 +
margin-top: -64px;
 +
margin-left: -64px;
 +
color: #fff;
 +
}
 +
 
 +
ul.meta
 +
{
 +
font-size: 0.85em;
 +
color: #a1aaa5;
 +
}
 +
 +
ul.meta li
 +
{
 +
position: relative;
 +
display: inline-block;
 +
padding-left: 24px;
 +
margin-left: 1em;
 +
}
 +
 
 +
ul.meta li a
 +
{
 +
color: inherit;
 +
outline: 0;
 +
}
 +
 
 +
ul.meta li:first-child
 +
{
 +
margin-left: 0;
 +
}
 +
 +
ul.meta li:before
 +
{
 +
display: block;
 +
position: absolute;
 +
width: 16px;
 +
height: 16px;
 +
left: 0;
 +
top: 50%;
 +
margin-top: -8px;
 +
opacity: 0.5;
 +
cursor: default;
 +
}
/*********************************************************************************/
/*********************************************************************************/
-
/* Logo                                                                          */
+
/* Icons                                                                        */
 +
/* Powered by Font Awesome by Dave Gandy | http://fontawesome.io                */
 +
/* Licensed under the SIL OFL 1.1 (font), MIT (CSS)                              */
/*********************************************************************************/
/*********************************************************************************/
-
#logo
+
.fa
-
{
+
{
-
position: absolute;
+
text-decoration: none;
-
top: 1.5em;
+
}
-
left: 0;
+
-
width: 100%;
+
-
}
+
-
#logo h1
+
.fa.solo
-
{
+
{
-
display: inline-block;
+
}
-
font-size: 2.5em;
+
-
text-transform: uppercase;
+
.fa.solo span
-
font-weight: 700;
+
{
-
color: #2C383B;
+
display: none;
-
padding-right: 0.50em;
+
}
-
}
+
-
#logo span
+
.fa:before
-
{
+
{
-
position: absolute;
+
display:inline-block;
-
top: 1.4em;
+
font-family: FontAwesome;
-
display: inline-block;
+
font-size: 1.25em;
-
padding-left: 1.50em;
+
text-decoration: none;
-
letter-spacing: 0.10em;
+
font-style: normal;
-
text-transform: uppercase;
+
font-weight: normal;
-
font-size: 0.90em;
+
line-height: 1;
-
}
+
-webkit-font-smoothing:antialiased;
 +
-moz-osx-font-smoothing:grayscale;
 +
}
-
#logo a
+
.fa-lg{font-size:1.3333333333333333em;line-height:.75em;vertical-align:-15%}
-
{
+
.fa-2x{font-size:2em}
-
text-decoration: none;
+
.fa-3x{font-size:3em}
-
color: #197d62;
+
.fa-4x{font-size:4em}
-
}
+
.fa-5x{font-size:5em}
 +
.fa-fw{width:1.2857142857142858em;text-align:center}
 +
.fa-ul{padding-left:0;margin-left:2.142857142857143em;list-style-type:none}.fa-ul>li{position:relative}
 +
.fa-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;top:.14285714285714285em;text-align:center}.fa-li.fa-lg{left:-1.8571428571428572em}
 +
.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}
 +
.pull-right{float:right}
 +
.pull-left{float:left}
 +
.fa.pull-left{margin-right:.3em}
 +
.fa.pull-right{margin-left:.3em}
 +
.fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear}
 +
@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)} 100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)} 100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)} 100%{-o-transform:rotate(359deg)}}@-ms-keyframes spin{0%{-ms-transform:rotate(0deg)} 100%{-ms-transform:rotate(359deg)}}@keyframes spin{0%{transform:rotate(0deg)} 100%{transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}
 +
.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}
 +
.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}
 +
.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}
 +
.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}
 +
.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}
 +
.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}
 +
.fa-stack-1x{line-height:inherit}
 +
.fa-stack-2x{font-size:2em}
 +
.fa-inverse{color:#fff}
 +
.fa-glass:before{content:"\f000"}
 +
.fa-music:before{content:"\f001"}
 +
.fa-search:before{content:"\f002"}
 +
.fa-envelope-o:before{content:"\f003"}
 +
.fa-heart:before{content:"\f004"}
 +
.fa-star:before{content:"\f005"}
 +
.fa-star-o:before{content:"\f006"}
 +
.fa-user:before{content:"\f007"}
 +
.fa-film:before{content:"\f008"}
 +
.fa-th-large:before{content:"\f009"}
 +
.fa-th:before{content:"\f00a"}
 +
.fa-th-list:before{content:"\f00b"}
 +
.fa-check:before{content:"\f00c"}
 +
.fa-times:before{content:"\f00d"}
 +
.fa-search-plus:before{content:"\f00e"}
 +
.fa-search-minus:before{content:"\f010"}
 +
.fa-power-off:before{content:"\f011"}
 +
.fa-signal:before{content:"\f012"}
 +
.fa-gear:before,.fa-cog:before{content:"\f013"}
 +
.fa-trash-o:before{content:"\f014"}
 +
.fa-home:before{content:"\f015"}
 +
.fa-file-o:before{content:"\f016"}
 +
.fa-clock-o:before{content:"\f017"}
 +
.fa-road:before{content:"\f018"}
 +
.fa-download:before{content:"\f019"}
 +
.fa-arrow-circle-o-down:before{content:"\f01a"}
 +
.fa-arrow-circle-o-up:before{content:"\f01b"}
 +
.fa-inbox:before{content:"\f01c"}
 +
.fa-play-circle-o:before{content:"\f01d"}
 +
.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}
 +
.fa-refresh:before{content:"\f021"}
 +
.fa-list-alt:before{content:"\f022"}
 +
.fa-lock:before{content:"\f023"}
 +
.fa-flag:before{content:"\f024"}
 +
.fa-headphones:before{content:"\f025"}
 +
.fa-volume-off:before{content:"\f026"}
 +
.fa-volume-down:before{content:"\f027"}
 +
.fa-volume-up:before{content:"\f028"}
 +
.fa-qrcode:before{content:"\f029"}
 +
.fa-barcode:before{content:"\f02a"}
 +
.fa-tag:before{content:"\f02b"}
 +
.fa-tags:before{content:"\f02c"}
 +
.fa-book:before{content:"\f02d"}
 +
.fa-bookmark:before{content:"\f02e"}
 +
.fa-print:before{content:"\f02f"}
 +
.fa-camera:before{content:"\f030"}
 +
.fa-font:before{content:"\f031"}
 +
.fa-bold:before{content:"\f032"}
 +
.fa-italic:before{content:"\f033"}
 +
.fa-text-height:before{content:"\f034"}
 +
.fa-text-width:before{content:"\f035"}
 +
.fa-align-left:before{content:"\f036"}
 +
.fa-align-center:before{content:"\f037"}
 +
.fa-align-right:before{content:"\f038"}
 +
.fa-align-justify:before{content:"\f039"}
 +
.fa-list:before{content:"\f03a"}
 +
.fa-dedent:before,.fa-outdent:before{content:"\f03b"}
 +
.fa-indent:before{content:"\f03c"}
 +
.fa-video-camera:before{content:"\f03d"}
 +
.fa-picture-o:before{content:"\f03e"}
 +
.fa-pencil:before{content:"\f040"}
 +
.fa-map-marker:before{content:"\f041"}
 +
.fa-adjust:before{content:"\f042"}
 +
.fa-tint:before{content:"\f043"}
 +
.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}
 +
.fa-share-square-o:before{content:"\f045"}
 +
.fa-check-square-o:before{content:"\f046"}
 +
.fa-move:before{content:"\f047"}
 +
.fa-step-backward:before{content:"\f048"}
 +
.fa-fast-backward:before{content:"\f049"}
 +
.fa-backward:before{content:"\f04a"}
 +
.fa-play:before{content:"\f04b"}
 +
.fa-pause:before{content:"\f04c"}
 +
.fa-stop:before{content:"\f04d"}
 +
.fa-forward:before{content:"\f04e"}
 +
.fa-fast-forward:before{content:"\f050"}
 +
.fa-step-forward:before{content:"\f051"}
 +
.fa-eject:before{content:"\f052"}
 +
.fa-chevron-left:before{content:"\f053"}
 +
.fa-chevron-right:before{content:"\f054"}
 +
.fa-plus-circle:before{content:"\f055"}
 +
.fa-minus-circle:before{content:"\f056"}
 +
.fa-times-circle:before{content:"\f057"}
 +
.fa-check-circle:before{content:"\f058"}
 +
.fa-question-circle:before{content:"\f059"}
 +
.fa-info-circle:before{content:"\f05a"}
 +
.fa-crosshairs:before{content:"\f05b"}
 +
.fa-times-circle-o:before{content:"\f05c"}
 +
.fa-check-circle-o:before{content:"\f05d"}
 +
.fa-ban:before{content:"\f05e"}
 +
.fa-arrow-left:before{content:"\f060"}
 +
.fa-arrow-right:before{content:"\f061"}
 +
.fa-arrow-up:before{content:"\f062"}
 +
.fa-arrow-down:before{content:"\f063"}
 +
.fa-mail-forward:before,.fa-share:before{content:"\f064"}
 +
.fa-resize-full:before{content:"\f065"}
 +
.fa-resize-small:before{content:"\f066"}
 +
.fa-plus:before{content:"\f067"}
 +
.fa-minus:before{content:"\f068"}
 +
.fa-asterisk:before{content:"\f069"}
 +
.fa-exclamation-circle:before{content:"\f06a"}
 +
.fa-gift:before{content:"\f06b"}
 +
.fa-leaf:before{content:"\f06c"}
 +
.fa-fire:before{content:"\f06d"}
 +
.fa-eye:before{content:"\f06e"}
 +
.fa-eye-slash:before{content:"\f070"}
 +
.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}
 +
.fa-plane:before{content:"\f072"}
 +
.fa-calendar:before{content:"\f073"}
 +
.fa-random:before{content:"\f074"}
 +
.fa-comment:before{content:"\f075"}
 +
.fa-magnet:before{content:"\f076"}
 +
.fa-chevron-up:before{content:"\f077"}
 +
.fa-chevron-down:before{content:"\f078"}
 +
.fa-retweet:before{content:"\f079"}
 +
.fa-shopping-cart:before{content:"\f07a"}
 +
.fa-folder:before{content:"\f07b"}
 +
.fa-folder-open:before{content:"\f07c"}
 +
.fa-resize-vertical:before{content:"\f07d"}
 +
.fa-resize-horizontal:before{content:"\f07e"}
 +
.fa-bar-chart-o:before{content:"\f080"}
 +
.fa-twitter-square:before{content:"\f081"}
 +
.fa-facebook-square:before{content:"\f082"}
 +
.fa-camera-retro:before{content:"\f083"}
 +
.fa-key:before{content:"\f084"}
 +
.fa-gears:before,.fa-cogs:before{content:"\f085"}
 +
.fa-comments:before{content:"\f086"}
 +
.fa-thumbs-o-up:before{content:"\f087"}
 +
.fa-thumbs-o-down:before{content:"\f088"}
 +
.fa-star-half:before{content:"\f089"}
 +
.fa-heart-o:before{content:"\f08a"}
 +
.fa-sign-out:before{content:"\f08b"}
 +
.fa-linkedin-square:before{content:"\f08c"}
 +
.fa-thumb-tack:before{content:"\f08d"}
 +
.fa-external-link:before{content:"\f08e"}
 +
.fa-sign-in:before{content:"\f090"}
 +
.fa-trophy:before{content:"\f091"}
 +
.fa-github-square:before{content:"\f092"}
 +
.fa-upload:before{content:"\f093"}
 +
.fa-lemon-o:before{content:"\f094"}
 +
.fa-phone:before{content:"\f095"}
 +
.fa-square-o:before{content:"\f096"}
 +
.fa-bookmark-o:before{content:"\f097"}
 +
.fa-phone-square:before{content:"\f098"}
 +
.fa-twitter:before{content:"\f099"}
 +
.fa-facebook:before{content:"\f09a"}
 +
.fa-github:before{content:"\f09b"}
 +
.fa-unlock:before{content:"\f09c"}
 +
.fa-credit-card:before{content:"\f09d"}
 +
.fa-rss:before{content:"\f09e"}
 +
.fa-hdd-o:before{content:"\f0a0"}
 +
.fa-bullhorn:before{content:"\f0a1"}
 +
.fa-bell:before{content:"\f0f3"}
 +
.fa-certificate:before{content:"\f0a3"}
 +
.fa-hand-o-right:before{content:"\f0a4"}
 +
.fa-hand-o-left:before{content:"\f0a5"}
 +
.fa-hand-o-up:before{content:"\f0a6"}
 +
.fa-hand-o-down:before{content:"\f0a7"}
 +
.fa-arrow-circle-left:before{content:"\f0a8"}
 +
.fa-arrow-circle-right:before{content:"\f0a9"}
 +
.fa-arrow-circle-up:before{content:"\f0aa"}
 +
.fa-arrow-circle-down:before{content:"\f0ab"}
 +
.fa-globe:before{content:"\f0ac"}
 +
.fa-wrench:before{content:"\f0ad"}
 +
.fa-tasks:before{content:"\f0ae"}
 +
.fa-filter:before{content:"\f0b0"}
 +
.fa-briefcase:before{content:"\f0b1"}
 +
.fa-fullscreen:before{content:"\f0b2"}
 +
.fa-group:before{content:"\f0c0"}
 +
.fa-chain:before,.fa-link:before{content:"\f0c1"}
 +
.fa-cloud:before{content:"\f0c2"}
 +
.fa-flask:before{content:"\f0c3"}
 +
.fa-cut:before,.fa-scissors:before{content:"\f0c4"}
 +
.fa-copy:before,.fa-files-o:before{content:"\f0c5"}
 +
.fa-paperclip:before{content:"\f0c6"}
 +
.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}
 +
.fa-square:before{content:"\f0c8"}
 +
.fa-reorder:before{content:"\f0c9"}
 +
.fa-list-ul:before{content:"\f0ca"}
 +
.fa-list-ol:before{content:"\f0cb"}
 +
.fa-strikethrough:before{content:"\f0cc"}
 +
.fa-underline:before{content:"\f0cd"}
 +
.fa-table:before{content:"\f0ce"}
 +
.fa-magic:before{content:"\f0d0"}
 +
.fa-truck:before{content:"\f0d1"}
 +
.fa-pinterest:before{content:"\f0d2"}
 +
.fa-pinterest-square:before{content:"\f0d3"}
 +
.fa-google-plus-square:before{content:"\f0d4"}
 +
.fa-google-plus:before{content:"\f0d5"}
 +
.fa-money:before{content:"\f0d6"}
 +
.fa-caret-down:before{content:"\f0d7"}
 +
.fa-caret-up:before{content:"\f0d8"}
 +
.fa-caret-left:before{content:"\f0d9"}
 +
.fa-caret-right:before{content:"\f0da"}
 +
.fa-columns:before{content:"\f0db"}
 +
.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}
 +
.fa-sort-down:before,.fa-sort-asc:before{content:"\f0dd"}
 +
.fa-sort-up:before,.fa-sort-desc:before{content:"\f0de"}
 +
.fa-envelope:before{content:"\f0e0"}
 +
.fa-linkedin:before{content:"\f0e1"}
 +
.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}
 +
.fa-legal:before,.fa-gavel:before{content:"\f0e3"}
 +
.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}
 +
.fa-comment-o:before{content:"\f0e5"}
 +
.fa-comments-o:before{content:"\f0e6"}
 +
.fa-flash:before,.fa-bolt:before{content:"\f0e7"}
 +
.fa-sitemap:before{content:"\f0e8"}
 +
.fa-umbrella:before{content:"\f0e9"}
 +
.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}
 +
.fa-lightbulb-o:before{content:"\f0eb"}
 +
.fa-exchange:before{content:"\f0ec"}
 +
.fa-cloud-download:before{content:"\f0ed"}
 +
.fa-cloud-upload:before{content:"\f0ee"}
 +
.fa-user-md:before{content:"\f0f0"}
 +
.fa-stethoscope:before{content:"\f0f1"}
 +
.fa-suitcase:before{content:"\f0f2"}
 +
.fa-bell-o:before{content:"\f0a2"}
 +
.fa-coffee:before{content:"\f0f4"}
 +
.fa-cutlery:before{content:"\f0f5"}
 +
.fa-file-text-o:before{content:"\f0f6"}
 +
.fa-building:before{content:"\f0f7"}
 +
.fa-hospital:before{content:"\f0f8"}
 +
.fa-ambulance:before{content:"\f0f9"}
 +
.fa-medkit:before{content:"\f0fa"}
 +
.fa-fighter-jet:before{content:"\f0fb"}
 +
.fa-beer:before{content:"\f0fc"}
 +
.fa-h-square:before{content:"\f0fd"}
 +
.fa-plus-square:before{content:"\f0fe"}
 +
.fa-angle-double-left:before{content:"\f100"}
 +
.fa-angle-double-right:before{content:"\f101"}
 +
.fa-angle-double-up:before{content:"\f102"}
 +
.fa-angle-double-down:before{content:"\f103"}
 +
.fa-angle-left:before{content:"\f104"}
 +
.fa-angle-right:before{content:"\f105"}
 +
.fa-angle-up:before{content:"\f106"}
 +
.fa-angle-down:before{content:"\f107"}
 +
.fa-desktop:before{content:"\f108"}
 +
.fa-laptop:before{content:"\f109"}
 +
.fa-tablet:before{content:"\f10a"}
 +
.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}
 +
.fa-circle-o:before{content:"\f10c"}
 +
.fa-quote-left:before{content:"\f10d"}
 +
.fa-quote-right:before{content:"\f10e"}
 +
.fa-spinner:before{content:"\f110"}
 +
.fa-circle:before{content:"\f111"}
 +
.fa-mail-reply:before,.fa-reply:before{content:"\f112"}
 +
.fa-github-alt:before{content:"\f113"}
 +
.fa-folder-o:before{content:"\f114"}
 +
.fa-folder-open-o:before{content:"\f115"}
 +
.fa-expand-o:before{content:"\f116"}
 +
.fa-collapse-o:before{content:"\f117"}
 +
.fa-smile-o:before{content:"\f118"}
 +
.fa-frown-o:before{content:"\f119"}
 +
.fa-meh-o:before{content:"\f11a"}
 +
.fa-gamepad:before{content:"\f11b"}
 +
.fa-keyboard-o:before{content:"\f11c"}
 +
.fa-flag-o:before{content:"\f11d"}
 +
.fa-flag-checkered:before{content:"\f11e"}
 +
.fa-terminal:before{content:"\f120"}
 +
.fa-code:before{content:"\f121"}
 +
.fa-reply-all:before{content:"\f122"}
 +
.fa-mail-reply-all:before{content:"\f122"}
 +
.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}
 +
.fa-location-arrow:before{content:"\f124"}
 +
.fa-crop:before{content:"\f125"}
 +
.fa-code-fork:before{content:"\f126"}
 +
.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}
 +
.fa-question:before{content:"\f128"}
 +
.fa-info:before{content:"\f129"}
 +
.fa-exclamation:before{content:"\f12a"}
 +
.fa-superscript:before{content:"\f12b"}
 +
.fa-subscript:before{content:"\f12c"}
 +
.fa-eraser:before{content:"\f12d"}
 +
.fa-puzzle-piece:before{content:"\f12e"}
 +
.fa-microphone:before{content:"\f130"}
 +
.fa-microphone-slash:before{content:"\f131"}
 +
.fa-shield:before{content:"\f132"}
 +
.fa-calendar-o:before{content:"\f133"}
 +
.fa-fire-extinguisher:before{content:"\f134"}
 +
.fa-rocket:before{content:"\f135"}
 +
.fa-maxcdn:before{content:"\f136"}
 +
.fa-chevron-circle-left:before{content:"\f137"}
 +
.fa-chevron-circle-right:before{content:"\f138"}
 +
.fa-chevron-circle-up:before{content:"\f139"}
 +
.fa-chevron-circle-down:before{content:"\f13a"}
 +
.fa-html5:before{content:"\f13b"}
 +
.fa-css3:before{content:"\f13c"}
 +
.fa-anchor:before{content:"\f13d"}
 +
.fa-unlock-o:before{content:"\f13e"}
 +
.fa-bullseye:before{content:"\f140"}
 +
.fa-ellipsis-horizontal:before{content:"\f141"}
 +
.fa-ellipsis-vertical:before{content:"\f142"}
 +
.fa-rss-square:before{content:"\f143"}
 +
.fa-play-circle:before{content:"\f144"}
 +
.fa-ticket:before{content:"\f145"}
 +
.fa-minus-square:before{content:"\f146"}
 +
.fa-minus-square-o:before{content:"\f147"}
 +
.fa-level-up:before{content:"\f148"}
 +
.fa-level-down:before{content:"\f149"}
 +
.fa-check-square:before{content:"\f14a"}
 +
.fa-pencil-square:before{content:"\f14b"}
 +
.fa-external-link-square:before{content:"\f14c"}
 +
.fa-share-square:before{content:"\f14d"}
 +
.fa-compass:before{content:"\f14e"}
 +
.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}
 +
.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}
 +
.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}
 +
.fa-euro:before,.fa-eur:before{content:"\f153"}
 +
.fa-gbp:before{content:"\f154"}
 +
.fa-dollar:before,.fa-usd:before{content:"\f155"}
 +
.fa-rupee:before,.fa-inr:before{content:"\f156"}
 +
.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}
 +
.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}
 +
.fa-won:before,.fa-krw:before{content:"\f159"}
 +
.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}
 +
.fa-file:before{content:"\f15b"}
 +
.fa-file-text:before{content:"\f15c"}
 +
.fa-sort-alpha-asc:before{content:"\f15d"}
 +
.fa-sort-alpha-desc:before{content:"\f15e"}
 +
.fa-sort-amount-asc:before{content:"\f160"}
 +
.fa-sort-amount-desc:before{content:"\f161"}
 +
.fa-sort-numeric-asc:before{content:"\f162"}
 +
.fa-sort-numeric-desc:before{content:"\f163"}
 +
.fa-thumbs-up:before{content:"\f164"}
 +
.fa-thumbs-down:before{content:"\f165"}
 +
.fa-youtube-square:before{content:"\f166"}
 +
.fa-youtube:before{content:"\f167"}
 +
.fa-xing:before{content:"\f168"}
 +
.fa-xing-square:before{content:"\f169"}
 +
.fa-youtube-play:before{content:"\f16a"}
 +
.fa-dropbox:before{content:"\f16b"}
 +
.fa-stack-overflow:before{content:"\f16c"}
 +
.fa-instagram:before{content:"\f16d"}
 +
.fa-flickr:before{content:"\f16e"}
 +
.fa-adn:before{content:"\f170"}
 +
.fa-bitbucket:before{content:"\f171"}
 +
.fa-bitbucket-square:before{content:"\f172"}
 +
.fa-tumblr:before{content:"\f173"}
 +
.fa-tumblr-square:before{content:"\f174"}
 +
.fa-long-arrow-down:before{content:"\f175"}
 +
.fa-long-arrow-up:before{content:"\f176"}
 +
.fa-long-arrow-left:before{content:"\f177"}
 +
.fa-long-arrow-right:before{content:"\f178"}
 +
.fa-apple:before{content:"\f179"}
 +
.fa-windows:before{content:"\f17a"}
 +
.fa-android:before{content:"\f17b"}
 +
.fa-linux:before{content:"\f17c"}
 +
.fa-dribbble:before{content:"\f17d"}
 +
.fa-skype:before{content:"\f17e"}
 +
.fa-foursquare:before{content:"\f180"}
 +
.fa-trello:before{content:"\f181"}
 +
.fa-female:before{content:"\f182"}
 +
.fa-male:before{content:"\f183"}
 +
.fa-gittip:before{content:"\f184"}
 +
.fa-sun-o:before{content:"\f185"}
 +
.fa-moon-o:before{content:"\f186"}
 +
.fa-archive:before{content:"\f187"}
 +
.fa-bug:before{content:"\f188"}
 +
.fa-vk:before{content:"\f189"}
 +
.fa-weibo:before{content:"\f18a"}
 +
.fa-renren:before{content:"\f18b"}
 +
.fa-pagelines:before{content:"\f18c"}
 +
.fa-stack-exchange:before{content:"\f18d"}
 +
.fa-arrow-circle-o-right:before{content:"\f18e"}
 +
.fa-arrow-circle-o-left:before{content:"\f190"}
 +
.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}
 +
.fa-dot-circle-o:before{content:"\f192"}
 +
.fa-wheelchair:before{content:"\f193"}
 +
.fa-vimeo-square:before{content:"\f194"}
 +
.fa-turkish-lira:before,.fa-try:before{content:"\f195"}
/*********************************************************************************/
/*********************************************************************************/
-
/* Menu                                                                          */
+
/* Section + Article Types                                                      */
/*********************************************************************************/
/*********************************************************************************/
-
#menu
+
.is-highlight
-
{
+
{
-
position: absolute;
+
text-align: center;
-
right: 0;
+
}
-
top: 1em;
+
-
}
+
-
#menu ul
+
.is-features
-
{
+
{
-
display: inline-block;
+
}
-
}
+
 +
.is-feature
 +
{
 +
}
-
#menu li
+
.is-blog
-
{
+
{
-
display: block;
+
}
-
float: left;
+
-
text-align: center;
+
-
line-height: 60px;
+
-
}
+
-
#menu li a, #menu li span
+
.is-post
-
{
+
{
-
display: inline-block;
+
}
-
margin-left: 1px;
+
-
padding: 0em 1.5em;
+
-
letter-spacing: 0.10em;
+
-
text-decoration: none;
+
-
font-size: 1em;
+
-
text-transform: uppercase;
+
-
outline: 0;
+
-
color: #212121;
+
-
}
+
-
#menu li:hover a, #menu li.active a, #menu li.active span
+
.is-post-summary
-
{
+
{
-
}
+
}
-
#menu li.current_page_item a
+
.is-page-content
-
{
+
{
-
background: #197d62;
+
}
-
color: #FFF !important;
+
-
}
+
-
 
+
-
#menu .icon
+
-
{
+
-
}
+
/*********************************************************************************/
/*********************************************************************************/
-
/* Banner                                                                        */
+
/* Sidebar + Content                                                            */
/*********************************************************************************/
/*********************************************************************************/
 +
 +
.sidebar
 +
{
 +
}
-
#banner-wrapper
+
.content
-
{
+
{
-
overflow: hidden;
+
}
-
padding: 3em 0em;
+
-
background: #197d62;
+
-
}
+
-
#banner
+
/*********************************************************************************/
-
{
+
/* Wrappers                                                                      */
-
overflow: hidden;
+
/*********************************************************************************/
-
width: 1000px;
+
-
padding: 0px 100px;
+
-
text-align: center;
+
-
color: rgba(255,255,255,.7);
+
-
}
+
-
#banner a
+
#banner-wrapper
-
{
+
{
-
color: rgba(255,255,255,.9);
+
position: relative;
-
}
+
background: url('https://static.igem.org/mediawiki/2014hs/5/51/IGEM_Graphic_PNG.png') center center no-repeat;
 +
background-size: cover;
 +
z-index: 1;
 +
}
-
#banner .box-left
+
/*
-
{
+
Note: The following style adds the textured/pixelated look to the banner
-
float: left;
+
image. I added this to help mask the distortion introduced when a browser
-
}
+
resizes an image, but if you don't want this to happen just remove or comment
 +
out the entire style.
 +
*/
-
#banner .box-right
+
#banner-wrapper:before
-
{
+
{
-
float: right;
+
content: '';
-
}
+
position: absolute;
 +
left: 0;
 +
top: 0;
 +
width: 100%;
 +
height: 100%;
 +
background: url('https://static.igem.org/mediawiki/2014hs/5/5c/Overlay.png');
 +
opacity: 0.175;
 +
}
 +
 +
#main-wrapper
 +
{
 +
background: #fff;
 +
border-top: solid 5px #e3daa8;
 +
border-bottom: solid 5px #c1cac5;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Header                                                                        */
 +
/*********************************************************************************/
-
#banner h2
+
#header
-
{
+
{
-
margin: 0em;
+
}
-
padding: 0em;
+
-
font-weight: 400;
+
-
font-size: 3em;
+
-
color: #555555;
+
-
}
+
-
#banner span
+
/*********************************************************************************/
-
{
+
/* Nav                                                                          */
-
display: block;
+
/*********************************************************************************/
-
padding-top: 0.20em;
+
 
-
text-transform: uppercase;
+
#nav
-
font-size: 1.2em;
+
{
-
color: #A2A2A2;
+
}
-
}
+
/*********************************************************************************/
/*********************************************************************************/
-
/* Page                                                                          */
+
/* Banner                                                                        */
/*********************************************************************************/
/*********************************************************************************/
-
#wrapper
+
#banner
-
{
+
{
-
background: #FFF;
+
position: relative;
-
}
+
background: rgba(21, 28, 23, 0.95);
 +
text-align: center;
 +
z-index: 2;
 +
}
-
#page
+
#banner:before
-
{
+
{
-
overflow: hidden;
+
content: '';
-
padding: 6em 0em;
+
position: absolute;
-
border-bottom: 2px solid #E3E3E3;
+
left: 0;
-
text-align: center;
+
top: 0;
-
}
+
width: 100%;
 +
height: 100%;
 +
background: url('https://static.igem.org/mediawiki/2014hs/5/55/Highlight.png') center center;
 +
background-size: 100% 200%;
 +
}
 +
 
 +
#banner:after
 +
{
 +
content: '';
 +
position: absolute;
 +
left: 0;
 +
top: 0;
 +
width: 100%;
 +
height: 100%;
 +
background: url('https://static.igem.org/mediawiki/2014hs/5/5c/Overlay.png');
 +
opacity: 0.25;
 +
}
 +
 +
#banner > *
 +
{
 +
position: relative;
 +
z-index: 3;
 +
}
 +
 +
#banner h2
 +
{
 +
color: #3A77B0;
 +
}
 +
 +
#banner .byline
 +
{
 +
color: #fff;
 +
}
 +
 
 +
-
#page .button
 
-
{
 
-
margin-top: 2em;
 
-
}
 
/*********************************************************************************/
/*********************************************************************************/
-
/* Content                                                                      */
+
/* Main                                                                          */
/*********************************************************************************/
/*********************************************************************************/
-
#content
+
#main
-
{
+
{
-
padding: 0em 7em;
+
}
-
}
+
/*********************************************************************************/
/*********************************************************************************/
-
/* Sidebar                                                                      */
+
/* Footer                                                                        */
/*********************************************************************************/
/*********************************************************************************/
-
#sidebar
+
#footer
-
{
+
{
-
float: right;
+
}
-
width: 450px;
+
-
}
+
#footer a
 +
{
 +
color: inherit;
 +
}
-
#stwo-col
+
/*********************************************************************************/
-
{
+
/* Copyright                                                                    */
-
margin-top: 2em;
+
/*********************************************************************************/
-
}
+
-
#stwo-col h2
+
#copyright
-
{
+
{
-
display: block;
+
display: inline-block;
-
padding-bottom: 1.5em;
+
background: #e7eae8;
-
letter-spacing: 0.10em;
+
padding: 0.75em 2em 0.75em 2em;
-
text-transform: uppercase;
+
border-radius: 8px;
-
font-size: 1.2em;
+
font-size: 0.85em;
-
font-weight: 600;
+
color: #8b9790;
-
color: #454445;
+
}
-
}
+
 +
#copyright a
 +
{
 +
color: inherit;
 +
}
-
#stwo-col .sbox1
+
/*
-
{
+
TXT 2.5 by HTML5 UP
-
float: left;
+
html5up.net | @n33co
-
width: 210px;
+
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-
}
+
*/
-
 
+
-
#stwo-col .sbox2
+
-
{
+
-
float: right;
+
-
width: 210px;
+
-
}
+
/*********************************************************************************/
/*********************************************************************************/
-
/* Copyright                                                                    */
+
/* Basic                                                                        */
/*********************************************************************************/
/*********************************************************************************/
-
#copyright
+
body
-
{
+
{
-
overflow: hidden;
+
min-width: 1200px;
-
padding: 5em 0em;
+
}
-
border-top: 1px solid rgba(255,255,255,0.08);
+
-
}
+
-
#copyright p
+
h1, h2, h3, h4, h5, h6, h7
-
{
+
{
-
letter-spacing: 0.20em;
+
margin: 0 0 0.5em 0;
-
text-align: center;
+
}
-
text-transform: uppercase;
+
-
font-size: 0.80em;
+
-
color: rgba(255,255,255,0.3);
+
-
}
+
-
#copyright a
+
h2
-
{
+
{
-
text-decoration: none;
+
font-size: 1.65em;
-
color: rgba(255,255,255,0.6);
+
}
-
}
+
 
 +
h2.major
 +
{
 +
font-size: 1.65em;
 +
text-align: center;
 +
margin: 0 0 3em 0;
 +
}
 +
 
 +
h2.major span
 +
{
 +
top: -0.775em;
 +
padding: 0 1.5em 0 1.5em;
 +
}
 +
 
 +
#footer h2.major
 +
{
 +
margin: 0 0 1em 0;
 +
}
 +
 +
.sidebar h2.major
 +
{
 +
text-align: left;
 +
margin: 0 0 1em 0;
 +
}
 +
 +
.sidebar h2.major span
 +
{
 +
padding-left: 0;
 +
}
 +
 
 +
h3
 +
{
 +
font-size: 1.25em;
 +
}
 +
 
 +
h4
 +
{
 +
font-size: 1.25em;
 +
}
 +
 
 +
.button
 +
{
 +
font-size: 1.25em;
 +
padding: 0.85em 1.85em 0.85em 1.85em;
 +
}
 +
 
 +
.button-big
 +
{
 +
font-size: 1.65em;
 +
padding: 0.85em 1.85em 0.85em 1.85em;
 +
}
 +
 +
.actions
 +
{
 +
text-align: center;
 +
margin: 2em 0 0 0;
 +
}
 +
 +
.actions .button
 +
{
 +
margin: 0 0.5em 0 0.5em;
 +
}
/*********************************************************************************/
/*********************************************************************************/
-
/* Featured                                                                      */
+
/* Section + Article Types                                                      */
/*********************************************************************************/
/*********************************************************************************/
-
#featured-wrapper
+
.is-highlight
-
{
+
{
-
overflow: hidden;
+
}
-
padding: 6em 0em;
+
-
background: #383838;
+
.is-highlight .special
-
text-align: center;
+
{
-
}
+
margin: 0 0 4em 0;
 +
}
-
#featured
+
.is-highlight h2
-
{
+
{
-
overflow: hidden;
+
font-size: 3em;
-
}
+
margin: 0 0 0.75em 0;
 +
}
-
#featured .major
+
.is-highlight .byline
-
{
+
{
-
overflow: hidden;
+
font-size: 1.65em;
-
margin-bottom: 3em;
+
margin: 0 0 1.5em 0;
-
padding-bottom: 2em;
+
}
-
border-bottom: 1px solid #E8E8E8;
+
-
}
+
-
#featured .major h2
+
.is-feature
-
{
+
{
-
font-size: 3em;
+
text-align: center;
-
}
+
}
 +
 +
.is-post
 +
{
 +
}
-
#featured .major .byline
+
.is-post header
-
{
+
{
-
font-size: 1.3em;
+
margin: 0 0 2.5em 0;
-
}
+
}
-
#featured .title
+
.is-post h3
-
{
+
{
-
margin-bottom: 1.5em;
+
font-size: 3em;
-
padding-bottom: 1.5em;
+
margin: 0 0 0.5em 0;
-
border-bottom: 1px solid rgba(255,255,255,.1);
+
}
-
}
+
-
#featured .title h2
+
.is-post .byline
-
{
+
{
-
font-size: 1.2em;
+
font-size: 1.65em;
-
}
+
margin: 0 0 0.5em 0;
 +
}
-
#featured h2
+
.is-post ul.meta
-
{
+
{
-
text-align: center;
+
margin: 0 0 0.5em 0;
-
color: #FFF;
+
}
-
}
+
 +
.is-post-summary
 +
{
 +
}
 +
 +
.is-post-summary h3
 +
{
 +
line-height: 1em;
 +
margin: 0 0 0.75em 0;
 +
}
-
#featured .icon
+
.is-post-summary .meta
-
{
+
{
-
position: relative;
+
margin: 0;
-
display: inline-block;
+
line-height: 1em;
-
width: 100px;
+
}
-
height: 100px;
+
-
margin: 0px auto 20px auto;
+
-
line-height: 100px;
+
-
font-size: 3em;
+
-
text-align: center;
+
-
color: #FFF;
+
-
}
+
-
.column1,  .column2,  .column3,  .column4
+
.is-page-content
-
{
+
{
-
width: 282px;
+
}
-
}
+
-
.column1,  .column2
+
.is-page-content header
-
{
+
{
-
float: left;
+
margin: 0 0 2.5em 0;
-
margin-right: 24px;
+
}
-
}
+
-
.column3
+
.is-page-content h2
-
{
+
{
-
float: left;
+
font-size: 3em;
-
}
+
margin: 0 0 0.5em 0;
 +
}
-
.column4
+
.is-page-content .byline
-
{
+
{
-
float: right;
+
font-size: 1.65em;
-
}
+
margin: 0 0 0.5em 0;
 +
}
 +
.is-page-content ul.meta
 +
{
 +
margin: 0 0 0.5em 0;
 +
}
-
#header-featured
+
/*********************************************************************************/
 +
/* Sidebar + Content                                                            */
 +
/*********************************************************************************/
 +
 
 +
.sidebar
{
{
-
height: 30em;
+
padding-top: 0.5em;
-
background-image: url(images/banner.jpg);
+
-
background-position: center;
+
-
background-size: cover;
+
}
}
 +
 +
.homepage .sidebar
 +
{
 +
padding-top: 0;
 +
}
 +
.content
 +
{
 +
}
-
#slider-wrapper
+
.content-left
-
{
+
{
-
padding: 6em 0em;
+
padding-right: 2em;
-
background: #DB3256;
+
}
-
}
+
 +
.content-right
 +
{
 +
padding-left: 2em;
 +
}
-
#slider
+
/*********************************************************************************/
-
{
+
/* Wrappers                                                                      */
-
margin: 0em auto 0em auto;
+
/*********************************************************************************/
-
width: 1200px;
+
-
position: relative;
+
-
}
+
-
#slider .button
+
#banner-wrapper
-
{
+
{
-
}
+
padding: 8em 0 8em 0;
 +
}
 +
 +
#main-wrapper
 +
{
 +
border-top-width: 35px;
 +
border-bottom-width: 10px;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Header                                                                        */
 +
/*********************************************************************************/
-
#slider .button:hover
+
#header
-
{
+
{
-
}
+
text-align: center;
 +
font-size: 2em;
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
font-weight: 700;
 +
text-transform: uppercase;
 +
padding: 6em 0 3em 0;
 +
background: #fff;
 +
margin: 0 auto;
 +
}
-
#slider .viewer
+
#header .logo
-
{
+
{
-
width: 1000px;
+
position: relative;
-
height: 375px;
+
text-align: center;
-
margin: 0 auto;
+
border-top: solid 5px #e7eae8;
-
overflow: hidden;
+
}
-
}
+
-
#slider .viewer .reel
+
#header .logo div
-
{
+
{
-
display: none;
+
background: #fff;
-
height: 375px;
+
position: relative;
-
}
+
display: inline-block;
 +
padding: 0 1.5em 0 1.5em;
 +
top: -0.65em;
 +
}
 +
 +
#header .logo h1,
 +
#header .logo .byline
 +
{
 +
display: inline;
 +
}
-
#slider .viewer .reel .slide
+
/*********************************************************************************/
-
{
+
/* Nav                                                                          */
-
position: relative;
+
/*********************************************************************************/
-
width: 1000px;
+
-
height: 375px;
+
-
}
+
-
#slider .viewer .reel h2
+
#nav
-
{
+
{
-
position: absolute;
+
position: fixed;
-
top: 130px;
+
top: 0;
-
left: 0;
+
left: 0;
-
width: 1200px;
+
z-index: 1000;
-
height: 80px;
+
background: rgba(255,255,255,0.95);
-
line-height: 80px;
+
width: 100%;
-
background: #111111;
+
/*height: 3.5em*/
-
text-align: center;
+
line-height: 3.5em;
-
opacity: 0.85;
+
text-align: center;
-
font-weight: normal;
+
font-family: 'Open Sans Condensed', sans-serif;
-
color: #ffffff;
+
font-weight: 700;
-
font-size: 2.25em;
+
text-transform: uppercase;
-
}
+
}
-
#slider .viewer .reel p
+
#nav:after
-
{
+
{
-
position: absolute;
+
content: '';
-
top: 210px;
+
position: absolute;
-
left: 0;
+
left: 0;
-
width: 1200px;
+
top: 0;
-
height: 40px;
+
width: 100%;
-
line-height: 40px;
+
height: 100%;
-
background: #0074C6;
+
background: url('https://static.igem.org/mediawiki/2014hs/5/5c/Overlay.png');
-
text-align: center;
+
opacity: 0.03;
-
opacity: 0.85;
+
}
-
font-weight: normal;
+
-
color: #ffffff;
+
-
font-size: 1.1em;
+
-
}
+
-
#slider .icon
+
#nav ul
-
{
+
{
-
font-size: 4em;
+
position: relative;
-
color: #FFF;
+
z-index: 1001;
-
}
+
}
 +
 +
#nav li
 +
{
 +
display: inline-block;
 +
margin: 0 0.5em 0 0.5em;
 +
top: 0;
 +
position: relative;
 +
-moz-transition: top .15s ease-in-out;
 +
-webkit-transition: top .15s ease-in-out;
 +
-o-transition: top .15s ease-in-out;
 +
-ms-transition: top .15s ease-in-out;
 +
transition: top .15s ease-in-out;
 +
}
-
#slider .previous-button
+
#nav li a
-
{
+
{
-
position: absolute;
+
position: relative;
-
top: 150px;
+
display: block;
-
left: 0;
+
text-decoration: none;
-
}
+
color: #6b7770;
 +
top: -3px;
 +
padding: 3px 1.5% 0.25em 1.5%;    /* modified percentages, previously 1.5em */
 +
border-bottom-left-radius: 6px;
 +
border-bottom-right-radius: 6px;
 +
outline: 0;
 +
-moz-transition: background-color .075s ease-in-out, color .075s ease-in-out;
 +
-webkit-transition: background-color .075s ease-in-out, color .075s ease-in-out;
 +
-o-transition: background-color .075s ease-in-out, color .075s ease-in-out;
 +
-ms-transition: background-color .075s ease-in-out, color .075s ease-in-out;
 +
transition: background-color .075s ease-in-out, color .075s ease-in-out;
 +
}
-
#slider .next-button
+
#nav li:hover
-
{
+
{
-
position: absolute;
+
top: 3px;
-
top: 150px;
+
}
-
right: 0;
+
-
}
+
-
#slider .indicator
+
#nav li:hover a
-
{
+
{
-
margin: 30px auto 0 auto;
+
background: #4AB0D6;
-
}
+
color: #fff;
 +
}
-
#slider .indicator ul
+
#nav li.current_page_item
-
{
+
{
-
list-style: none;
+
}
-
padding: 0;
+
-
margin: 0;
+
-
text-align: center;
+
-
}
+
-
#slider .indicator ul li
+
#nav li.current_page_item a
-
{
+
{
-
display: inline-block;
+
background: #A5D6E4;
-
width: 12px;
+
color: #fff;
-
height: 12px;
+
}
-
text-indent: -9999em;
+
-
background: #c8c8c8;
+
-
margin: 0 2px 0 2px;
+
-
border-radius: 8px;
+
-
border-bottom: solid 1px #ffffff;
+
-
border-top: solid 1px #909090;
+
-
}
+
-
#slider .indicator ul li.active
+
/*********************************************************************************/
-
{
+
/* Banner                                                                        */
-
background: #505050;
+
/*********************************************************************************/
-
border-top: solid 1px #505050;
+
 
-
}
+
#banner
 +
{
 +
padding: 5em 0 5em 0;
 +
}
 +
 +
#banner h2
 +
{
 +
font-size: 2.75em;
 +
margin: 0 0 0.75em 0;
 +
}
 +
 +
#banner .byline
 +
{
 +
font-size: 1.35em;
 +
margin: 0 0 1.75em 0;
 +
}
 +
 
 +
#banner .button
 +
{
 +
font-size: 1.5em;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Main                                                                          */
 +
/*********************************************************************************/
 +
 
 +
#main
 +
{
 +
padding: 4em 0 4em 0;
 +
}
 +
 
 +
#main > .row
 +
{
 +
padding: 3em 0 3em 0;
 +
}
/*********************************************************************************/
/*********************************************************************************/
Line 844: Line 1,590:
/*********************************************************************************/
/*********************************************************************************/
 +
#footer
 +
{
 +
text-align: center;
 +
padding: 8em 0 8em 0;
 +
}
 +
 +
#footer > .row
 +
{
 +
padding: 2em 0 2em 0;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Copyright                                                                    */
 +
/*********************************************************************************/
-
#footer-wrapper
+
#copyright
-
{
+
{
-
overflow: hidden;
+
margin: 4em 0 0 0;
-
padding: 6em 0em;
+
}
-
background: #383838;
+
-
text-align: center;
+
-
}
+
-
#footer
+
/*
-
{
+
TXT 2.5 by HTML5 UP
-
overflow: hidden;
+
html5up.net | @n33co
-
}
+
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
*/
 +
/*********************************************************************************/
 +
/* Basic                                                                        */
 +
/*********************************************************************************/
-
#footer .title h2
+
body
-
{
+
{
-
font-size: 1.6em;
+
min-width: 960px;
-
font-weight: 300;
+
font-size: 10.25pt;
-
color: #FFF;
+
line-height: 1.75em;
-
}
+
}
-
#footer .title .byline
+
h2.major
-
{
+
{
-
display: block;
+
margin: 0 0 2em 0;
-
padding-top: 1em;
+
}
-
text-transform: uppercase;
+
-
font-size: 0.80em;
+
-
color: rgba(255,255,255,0.5);
+
-
}
+
-
#footer .button
+
h2.major span
-
{
+
{
-
margin-top: 2em;
+
top: -0.75em;
-
}
+
padding: 0 1em 0 1em;
 +
}
-
#extra
+
#footer-wrapper h2.major
-
{
+
{
-
overflow: hidden;
+
margin: 0 0 1em 0;
-
margin: 0em auto 0em auto;
+
}
-
padding: 5em 0em 5em 0em;
+
-
text-align: center;
+
-
}
+
-
#extra h2
+
/*********************************************************************************/
-
{
+
/* Wrappers                                                                      */
-
margin: 0em;
+
/*********************************************************************************/
-
padding: 0em;
+
-
font-weight: 400;
+
-
font-size: 2.4em;
+
-
color: #555555;
+
-
}
+
-
#extra span
+
#banner-wrapper
-
{
+
{
-
display: block;
+
padding: 6em 0 6em 0;
-
padding-top: 0.20em;
+
}
-
margin-bottom: 3em;
+
-
text-transform: uppercase;
+
#main-wrapper
-
font-size: 1.2em;
+
{
-
color: #A2A2A2;
+
border-top-width: 10px;
-
}
+
border-bottom-width: 10px;
 +
}
 +
/*********************************************************************************/
 +
/* Header                                                                        */
 +
/*********************************************************************************/
-
#extra .button
+
#header
-
{
+
{
-
margin-top: 2em;
+
padding: 5em 0 2em 0;
-
}
+
}
-
#extra2
+
/*********************************************************************************/
-
{
+
/* Banner                                                                        */
-
overflow: hidden;
+
/*********************************************************************************/
-
padding-bottom: 5em;
+
-
}
+
-
#extra2 .button
+
#banner
-
{
+
{
-
margin-top: 2em;
+
padding: 4em 0 3.5em 0;
-
}
+
}
-
#extra2 .title h2
+
#banner h2
-
{
+
{
-
font-size: 2em;
+
margin: 0 0 0.5em 0;
-
}
+
}
 +
 +
#banner .byline
 +
{
 +
margin: 0 0 1.5em 0;
 +
}
-
#extra2 .title .byline
+
/*********************************************************************************/
-
{
+
/* Main                                                                          */
-
font-size: 0.80em;
+
/*********************************************************************************/
-
}
+
-
#extra2 #ebox1,
+
#main
-
#extra2 #ebox2
+
{
-
{
+
padding: 3em 0 2em 0;
-
width: 560px;
+
}
-
}
+
-
#extra2  #ebox1
+
#main > .row
-
{
+
{
-
float: left;
+
padding: 2em 0 2em 0;
-
}
+
}
-
#extra2 #ebox2
+
/*********************************************************************************/
-
{
+
/* Footer                                                                        */
-
float: right;
+
/*********************************************************************************/
-
}
+
 
 +
#footer
 +
{
 +
text-align: center;
 +
padding: 4em 0 4em 0;
 +
}
 +
 +
#footer > .row
 +
{
 +
padding: 2em 0 2em 0;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Copyright                                                                    */
 +
/*********************************************************************************/
 +
 
 +
#copyright
 +
{
 +
margin: 0;
 +
}

Revision as of 16:33, 2 June 2014

/* Resets (http://meyerweb.com/eric/tools/css/reset/ | v2.0 | 20110126 | License: none (public domain)) */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,detafils,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:;content:none;}table{border-collapse:collapse;border-spacing:0;}body{-webkit-text-size-adjust:none}

/* Box Model */

*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }

/* Container */

body { min-width: 1200px; }

.container { width: 1200px; margin-left: auto; margin-right: auto; }

/* Modifiers */

.container.small { width: 900px; }

.container.big { width: 100%; max-width: 1500px; min-width: 1200px; }

/* Grid */

/* Cells */

.\31 2u { width: 100% } .\31 1u { width: 91.6666666667% } .\31 0u { width: 83.3333333333% } .\39 u { width: 75% } .\38 u { width: 66.6666666667% } .\37 u { width: 58.3333333333% } .\36 u { width: 50% } .\35 u { width: 41.6666666667% } .\34 u { width: 33.3333333333% } .\33 u { width: 25% } .\32 u { width: 16.6666666667% } .\31 u { width: 8.3333333333% } .\-11u { margin-left: 91.6666666667% } .\-10u { margin-left: 83.3333333333% } .\-9u { margin-left: 75% } .\-8u { margin-left: 66.6666666667% } .\-7u { margin-left: 58.3333333333% } .\-6u { margin-left: 50% } .\-5u { margin-left: 41.6666666667% } .\-4u { margin-left: 33.3333333333% } .\-3u { margin-left: 25% } .\-2u { margin-left: 16.6666666667% } .\-1u { margin-left: 8.3333333333% }

.row > * { padding: 40px 0 0 40px; float: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }

.row + .row > * { padding-top: 40px; }

.row { margin-left: -40px; }

/* Rows */

.row:after { content: ; display: block; clear: both; height: 0; }

.row:first-child > * { padding-top: 0; }

.row > * { padding-top: 0; }

/* Modifiers */

/* Flush */

.row.flush { margin-left: 0; }

.row.flush > * { padding: 0 !important; }

/* Quarter */

.row.quarter > * { padding: 10px 0 0 10px; }

.row.quarter + .row.quarter > * { padding-top: 10px; }

.row.quarter { margin-left: -10px; }

/* Half */

.row.half > * { padding: 20px 0 0 20px; }

.row.half + .row.half > * { padding-top: 20px; }

.row.half { margin-left: -20px; }

/* One and (a) Half */

.row.oneandhalf > * { padding: 60px 0 0 60px; }

.row.oneandhalf + .row.oneandhalf > * { padding-top: 60px; }

.row.oneandhalf { margin-left: -60px; }

/* Double */

.row.double > * { padding: 80px 0 0 80px; }

.row.double + .row.double > * { padding-top: 80px; }

.row.double { margin-left: -80px; }


@charset 'UTF-8';

@font-face{font-family:'FontAwesome';src:url('font/fontawesome-webfont.eot?v=4.0.1');src:url('font/fontawesome-webfont.eot?#iefix&v=4.0.1') format('embedded-opentype'),url('font/fontawesome-webfont.woff?v=4.0.1') format('woff'),url('font/fontawesome-webfont.ttf?v=4.0.1') format('truetype'),url('font/fontawesome-webfont.svg?v=4.0.1#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}

/* TXT 2.5 by HTML5 UP html5up.net | @n33co Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)

  • /

/*********************************************************************************/ /* Basic */ /*********************************************************************************/

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }

body { font-family: 'Open Sans', sans-serif; font-weight: 400; background: #f2f5f3; color: #6b7770; font-size: 11.5pt; line-height: 2em; }

h1, h2, h3, h4, h5, h6, h7 { font-family: 'Open Sans Condensed', sans-serif; font-weight: 700; text-transform: uppercase; color: #6b7770; }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, h7 a { text-decoration: none; color: inherit; }


h2.major { position: relative; border-top: solid 5px #e7eae8; }

h2.major span { background: #fff; position: relative; display: inline-block; }

#footer h2.major span { background: #f2f5f3; }

a { color: #006376; text-decoration: underline; }

a:hover { text-decoration: none; }

form { }

form input, form select, form textarea { -webkit-appearance: none; }

br.clear { clear: both; }

p, ul, ol, dl, table { margin-bottom: 3em; }

section, article { margin-bottom: 6em; }

section > :last-child, article > :last-child { margin-bottom: 0; }

section:last-child, article:last-child { margin-bottom: 0; }

.byline { display: block; font-family: 'Open Sans Condensed', sans-serif; font-weight: 700; text-transform: uppercase; color: #c1cac5; }

.image { position: relative; display: inline-block; border-radius: 8px; }

.image img { display: block; width: 100%; border-radius: 8px; }

/* Note: The following style adds the textured/pixelated look to content images. I added this to help mask the distortion introduced when a browser resizes an image, but if you don't want this to happen just remove or comment out the entire style. */

.image:before { content: ; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('https://static.igem.org/mediawiki/2014hs/5/5c/Overlay.png'); opacity: 0.2; border-radius: 8px; }

.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; }

.button { display: inline-block; font-family: 'Open Sans Condensed', sans-serif; font-weight: 700; text-transform: uppercase; text-decoration: none; background: #e3daa8; color: #fff; border-radius: 8px; outline: 0; -moz-transition: background-color .2s ease-in-out; -webkit-transition: background-color .2s ease-in-out; -o-transition: background-color .2s ease-in-out; -ms-transition: background-color .2s ease-in-out; transition: background-color .2s ease-in-out; }

.button:hover { background: #ebe3b2; }

.button-alt { background: #c1cac5; }

.button-alt:hover { background: #ccd5d0; }

.actions { }

ul.style1 { list-style: disc; padding-left: 1.5em; }

ul.style2 { }

ul.style2 > li { border-top: solid 2px #e7eae8; padding-top: 2.35em; margin-top: 2.35em; }

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

ul.contact { }

ul.contact li { position: relative; display: inline-block; margin: 0 0.25em 0 0.25em; top: 0; -moz-transition: top .15s ease-in-out; -webkit-transition: top .15s ease-in-out; -o-transition: top .15s ease-in-out; -ms-transition: top .15s ease-in-out; transition: top .15s ease-in-out; }

ul.contact li a { display: block; position: relative; width: 48px; height: 48px; border-radius: 6px; outline: 0; -moz-transition: background-color .2s ease-in-out; -webkit-transition: background-color .2s ease-in-out; -o-transition: background-color .2s ease-in-out; -ms-transition: background-color .2s ease-in-out; transition: background-color .2s ease-in-out; background: #c1cac5; text-align: center; }

ul.contact li a:before { color: #f2f5f3; font-size: 32px; line-height: 48px; }

ul.contact li:hover a.fa-facebook { background-color: #3C5A98; } ul.contact li:hover a.fa-twitter { background-color: #2DAAE4; } ul.contact li:hover a.fa-rss { background-color: #F2600B; } ul.contact li:hover a.fa-dribbble { background-color: #C4376B; } ul.contact li:hover a.fa-linkedin { background-color: #006599; } ul.contact li:hover a.fa-tumblr { background-color: #31516A; } ul.contact li:hover a.fa-google-plus { background-color: #DA2713; }

ul.contact li:hover { top: -5px; }

ul.contact li:active { top: 0; }

ul.special { }

ul.special li { position: relative; display: inline-block; margin: 0 1.5em 0 1.5em; top: 0; -moz-transition: top .15s ease-in-out; -webkit-transition: top .15s ease-in-out; -o-transition: top .15s ease-in-out; -ms-transition: top .15s ease-in-out; transition: top .15s ease-in-out; }

ul.special li:hover { top: -10px; }

ul.special li:hover a { background: #b9d2ce; }

ul.special a { display: block; position: relative; background: #c1cac5; width: 12em; height: 12em; border-radius: 6em; outline: 0; -moz-transition: background-color .2s ease-in-out; -webkit-transition: background-color .2s ease-in-out; -o-transition: background-color .2s ease-in-out; -ms-transition: background-color .2s ease-in-out; transition: background-color .2s ease-in-out; }

ul.special a:before { position: absolute; width: 128px; height: 128px; font-size: 96px; line-height: 128px; left: 50%; top: 50%; margin-top: -64px; margin-left: -64px; color: #fff; }

ul.meta { font-size: 0.85em; color: #a1aaa5; }

ul.meta li { position: relative; display: inline-block; padding-left: 24px; margin-left: 1em; }

ul.meta li a { color: inherit; outline: 0; }

ul.meta li:first-child { margin-left: 0; }

ul.meta li:before { display: block; position: absolute; width: 16px; height: 16px; left: 0; top: 50%; margin-top: -8px; opacity: 0.5; cursor: default; }

/*********************************************************************************/ /* Icons */ /* Powered by Font Awesome by Dave Gandy | http://fontawesome.io */ /* Licensed under the SIL OFL 1.1 (font), MIT (CSS) */ /*********************************************************************************/

.fa { text-decoration: none; }

.fa.solo { }

.fa.solo span { display: none; }

.fa:before { display:inline-block; font-family: FontAwesome; font-size: 1.25em; text-decoration: none; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }

.fa-lg{font-size:1.3333333333333333em;line-height:.75em;vertical-align:-15%} .fa-2x{font-size:2em} .fa-3x{font-size:3em} .fa-4x{font-size:4em} .fa-5x{font-size:5em} .fa-fw{width:1.2857142857142858em;text-align:center} .fa-ul{padding-left:0;margin-left:2.142857142857143em;list-style-type:none}.fa-ul>li{position:relative} .fa-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;top:.14285714285714285em;text-align:center}.fa-li.fa-lg{left:-1.8571428571428572em} .fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em} .pull-right{float:right} .pull-left{float:left} .fa.pull-left{margin-right:.3em} .fa.pull-right{margin-left:.3em} .fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear} @-moz-keyframes spin{0%{-moz-transform:rotate(0deg)} 100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)} 100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)} 100%{-o-transform:rotate(359deg)}}@-ms-keyframes spin{0%{-ms-transform:rotate(0deg)} 100%{-ms-transform:rotate(359deg)}}@keyframes spin{0%{transform:rotate(0deg)} 100%{transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)} .fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)} .fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)} .fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)} .fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)} .fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle} .fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center} .fa-stack-1x{line-height:inherit} .fa-stack-2x{font-size:2em} .fa-inverse{color:#fff} .fa-glass:before{content:"\f000"} .fa-music:before{content:"\f001"} .fa-search:before{content:"\f002"} .fa-envelope-o:before{content:"\f003"} .fa-heart:before{content:"\f004"} .fa-star:before{content:"\f005"} .fa-star-o:before{content:"\f006"} .fa-user:before{content:"\f007"} .fa-film:before{content:"\f008"} .fa-th-large:before{content:"\f009"} .fa-th:before{content:"\f00a"} .fa-th-list:before{content:"\f00b"} .fa-check:before{content:"\f00c"} .fa-times:before{content:"\f00d"} .fa-search-plus:before{content:"\f00e"} .fa-search-minus:before{content:"\f010"} .fa-power-off:before{content:"\f011"} .fa-signal:before{content:"\f012"} .fa-gear:before,.fa-cog:before{content:"\f013"} .fa-trash-o:before{content:"\f014"} .fa-home:before{content:"\f015"} .fa-file-o:before{content:"\f016"} .fa-clock-o:before{content:"\f017"} .fa-road:before{content:"\f018"} .fa-download:before{content:"\f019"} .fa-arrow-circle-o-down:before{content:"\f01a"} .fa-arrow-circle-o-up:before{content:"\f01b"} .fa-inbox:before{content:"\f01c"} .fa-play-circle-o:before{content:"\f01d"} .fa-rotate-right:before,.fa-repeat:before{content:"\f01e"} .fa-refresh:before{content:"\f021"} .fa-list-alt:before{content:"\f022"} .fa-lock:before{content:"\f023"} .fa-flag:before{content:"\f024"} .fa-headphones:before{content:"\f025"} .fa-volume-off:before{content:"\f026"} .fa-volume-down:before{content:"\f027"} .fa-volume-up:before{content:"\f028"} .fa-qrcode:before{content:"\f029"} .fa-barcode:before{content:"\f02a"} .fa-tag:before{content:"\f02b"} .fa-tags:before{content:"\f02c"} .fa-book:before{content:"\f02d"} .fa-bookmark:before{content:"\f02e"} .fa-print:before{content:"\f02f"} .fa-camera:before{content:"\f030"} .fa-font:before{content:"\f031"} .fa-bold:before{content:"\f032"} .fa-italic:before{content:"\f033"} .fa-text-height:before{content:"\f034"} .fa-text-width:before{content:"\f035"} .fa-align-left:before{content:"\f036"} .fa-align-center:before{content:"\f037"} .fa-align-right:before{content:"\f038"} .fa-align-justify:before{content:"\f039"} .fa-list:before{content:"\f03a"} .fa-dedent:before,.fa-outdent:before{content:"\f03b"} .fa-indent:before{content:"\f03c"} .fa-video-camera:before{content:"\f03d"} .fa-picture-o:before{content:"\f03e"} .fa-pencil:before{content:"\f040"} .fa-map-marker:before{content:"\f041"} .fa-adjust:before{content:"\f042"} .fa-tint:before{content:"\f043"} .fa-edit:before,.fa-pencil-square-o:before{content:"\f044"} .fa-share-square-o:before{content:"\f045"} .fa-check-square-o:before{content:"\f046"} .fa-move:before{content:"\f047"} .fa-step-backward:before{content:"\f048"} .fa-fast-backward:before{content:"\f049"} .fa-backward:before{content:"\f04a"} .fa-play:before{content:"\f04b"} .fa-pause:before{content:"\f04c"} .fa-stop:before{content:"\f04d"} .fa-forward:before{content:"\f04e"} .fa-fast-forward:before{content:"\f050"} .fa-step-forward:before{content:"\f051"} .fa-eject:before{content:"\f052"} .fa-chevron-left:before{content:"\f053"} .fa-chevron-right:before{content:"\f054"} .fa-plus-circle:before{content:"\f055"} .fa-minus-circle:before{content:"\f056"} .fa-times-circle:before{content:"\f057"} .fa-check-circle:before{content:"\f058"} .fa-question-circle:before{content:"\f059"} .fa-info-circle:before{content:"\f05a"} .fa-crosshairs:before{content:"\f05b"} .fa-times-circle-o:before{content:"\f05c"} .fa-check-circle-o:before{content:"\f05d"} .fa-ban:before{content:"\f05e"} .fa-arrow-left:before{content:"\f060"} .fa-arrow-right:before{content:"\f061"} .fa-arrow-up:before{content:"\f062"} .fa-arrow-down:before{content:"\f063"} .fa-mail-forward:before,.fa-share:before{content:"\f064"} .fa-resize-full:before{content:"\f065"} .fa-resize-small:before{content:"\f066"} .fa-plus:before{content:"\f067"} .fa-minus:before{content:"\f068"} .fa-asterisk:before{content:"\f069"} .fa-exclamation-circle:before{content:"\f06a"} .fa-gift:before{content:"\f06b"} .fa-leaf:before{content:"\f06c"} .fa-fire:before{content:"\f06d"} .fa-eye:before{content:"\f06e"} .fa-eye-slash:before{content:"\f070"} .fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"} .fa-plane:before{content:"\f072"} .fa-calendar:before{content:"\f073"} .fa-random:before{content:"\f074"} .fa-comment:before{content:"\f075"} .fa-magnet:before{content:"\f076"} .fa-chevron-up:before{content:"\f077"} .fa-chevron-down:before{content:"\f078"} .fa-retweet:before{content:"\f079"} .fa-shopping-cart:before{content:"\f07a"} .fa-folder:before{content:"\f07b"} .fa-folder-open:before{content:"\f07c"} .fa-resize-vertical:before{content:"\f07d"} .fa-resize-horizontal:before{content:"\f07e"} .fa-bar-chart-o:before{content:"\f080"} .fa-twitter-square:before{content:"\f081"} .fa-facebook-square:before{content:"\f082"} .fa-camera-retro:before{content:"\f083"} .fa-key:before{content:"\f084"} .fa-gears:before,.fa-cogs:before{content:"\f085"} .fa-comments:before{content:"\f086"} .fa-thumbs-o-up:before{content:"\f087"} .fa-thumbs-o-down:before{content:"\f088"} .fa-star-half:before{content:"\f089"} .fa-heart-o:before{content:"\f08a"} .fa-sign-out:before{content:"\f08b"} .fa-linkedin-square:before{content:"\f08c"} .fa-thumb-tack:before{content:"\f08d"} .fa-external-link:before{content:"\f08e"} .fa-sign-in:before{content:"\f090"} .fa-trophy:before{content:"\f091"} .fa-github-square:before{content:"\f092"} .fa-upload:before{content:"\f093"} .fa-lemon-o:before{content:"\f094"} .fa-phone:before{content:"\f095"} .fa-square-o:before{content:"\f096"} .fa-bookmark-o:before{content:"\f097"} .fa-phone-square:before{content:"\f098"} .fa-twitter:before{content:"\f099"} .fa-facebook:before{content:"\f09a"} .fa-github:before{content:"\f09b"} .fa-unlock:before{content:"\f09c"} .fa-credit-card:before{content:"\f09d"} .fa-rss:before{content:"\f09e"} .fa-hdd-o:before{content:"\f0a0"} .fa-bullhorn:before{content:"\f0a1"} .fa-bell:before{content:"\f0f3"} .fa-certificate:before{content:"\f0a3"} .fa-hand-o-right:before{content:"\f0a4"} .fa-hand-o-left:before{content:"\f0a5"} .fa-hand-o-up:before{content:"\f0a6"} .fa-hand-o-down:before{content:"\f0a7"} .fa-arrow-circle-left:before{content:"\f0a8"} .fa-arrow-circle-right:before{content:"\f0a9"} .fa-arrow-circle-up:before{content:"\f0aa"} .fa-arrow-circle-down:before{content:"\f0ab"} .fa-globe:before{content:"\f0ac"} .fa-wrench:before{content:"\f0ad"} .fa-tasks:before{content:"\f0ae"} .fa-filter:before{content:"\f0b0"} .fa-briefcase:before{content:"\f0b1"} .fa-fullscreen:before{content:"\f0b2"} .fa-group:before{content:"\f0c0"} .fa-chain:before,.fa-link:before{content:"\f0c1"} .fa-cloud:before{content:"\f0c2"} .fa-flask:before{content:"\f0c3"} .fa-cut:before,.fa-scissors:before{content:"\f0c4"} .fa-copy:before,.fa-files-o:before{content:"\f0c5"} .fa-paperclip:before{content:"\f0c6"} .fa-save:before,.fa-floppy-o:before{content:"\f0c7"} .fa-square:before{content:"\f0c8"} .fa-reorder:before{content:"\f0c9"} .fa-list-ul:before{content:"\f0ca"} .fa-list-ol:before{content:"\f0cb"} .fa-strikethrough:before{content:"\f0cc"} .fa-underline:before{content:"\f0cd"} .fa-table:before{content:"\f0ce"} .fa-magic:before{content:"\f0d0"} .fa-truck:before{content:"\f0d1"} .fa-pinterest:before{content:"\f0d2"} .fa-pinterest-square:before{content:"\f0d3"} .fa-google-plus-square:before{content:"\f0d4"} .fa-google-plus:before{content:"\f0d5"} .fa-money:before{content:"\f0d6"} .fa-caret-down:before{content:"\f0d7"} .fa-caret-up:before{content:"\f0d8"} .fa-caret-left:before{content:"\f0d9"} .fa-caret-right:before{content:"\f0da"} .fa-columns:before{content:"\f0db"} .fa-unsorted:before,.fa-sort:before{content:"\f0dc"} .fa-sort-down:before,.fa-sort-asc:before{content:"\f0dd"} .fa-sort-up:before,.fa-sort-desc:before{content:"\f0de"} .fa-envelope:before{content:"\f0e0"} .fa-linkedin:before{content:"\f0e1"} .fa-rotate-left:before,.fa-undo:before{content:"\f0e2"} .fa-legal:before,.fa-gavel:before{content:"\f0e3"} .fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"} .fa-comment-o:before{content:"\f0e5"} .fa-comments-o:before{content:"\f0e6"} .fa-flash:before,.fa-bolt:before{content:"\f0e7"} .fa-sitemap:before{content:"\f0e8"} .fa-umbrella:before{content:"\f0e9"} .fa-paste:before,.fa-clipboard:before{content:"\f0ea"} .fa-lightbulb-o:before{content:"\f0eb"} .fa-exchange:before{content:"\f0ec"} .fa-cloud-download:before{content:"\f0ed"} .fa-cloud-upload:before{content:"\f0ee"} .fa-user-md:before{content:"\f0f0"} .fa-stethoscope:before{content:"\f0f1"} .fa-suitcase:before{content:"\f0f2"} .fa-bell-o:before{content:"\f0a2"} .fa-coffee:before{content:"\f0f4"} .fa-cutlery:before{content:"\f0f5"} .fa-file-text-o:before{content:"\f0f6"} .fa-building:before{content:"\f0f7"} .fa-hospital:before{content:"\f0f8"} .fa-ambulance:before{content:"\f0f9"} .fa-medkit:before{content:"\f0fa"} .fa-fighter-jet:before{content:"\f0fb"} .fa-beer:before{content:"\f0fc"} .fa-h-square:before{content:"\f0fd"} .fa-plus-square:before{content:"\f0fe"} .fa-angle-double-left:before{content:"\f100"} .fa-angle-double-right:before{content:"\f101"} .fa-angle-double-up:before{content:"\f102"} .fa-angle-double-down:before{content:"\f103"} .fa-angle-left:before{content:"\f104"} .fa-angle-right:before{content:"\f105"} .fa-angle-up:before{content:"\f106"} .fa-angle-down:before{content:"\f107"} .fa-desktop:before{content:"\f108"} .fa-laptop:before{content:"\f109"} .fa-tablet:before{content:"\f10a"} .fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"} .fa-circle-o:before{content:"\f10c"} .fa-quote-left:before{content:"\f10d"} .fa-quote-right:before{content:"\f10e"} .fa-spinner:before{content:"\f110"} .fa-circle:before{content:"\f111"} .fa-mail-reply:before,.fa-reply:before{content:"\f112"} .fa-github-alt:before{content:"\f113"} .fa-folder-o:before{content:"\f114"} .fa-folder-open-o:before{content:"\f115"} .fa-expand-o:before{content:"\f116"} .fa-collapse-o:before{content:"\f117"} .fa-smile-o:before{content:"\f118"} .fa-frown-o:before{content:"\f119"} .fa-meh-o:before{content:"\f11a"} .fa-gamepad:before{content:"\f11b"} .fa-keyboard-o:before{content:"\f11c"} .fa-flag-o:before{content:"\f11d"} .fa-flag-checkered:before{content:"\f11e"} .fa-terminal:before{content:"\f120"} .fa-code:before{content:"\f121"} .fa-reply-all:before{content:"\f122"} .fa-mail-reply-all:before{content:"\f122"} .fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"} .fa-location-arrow:before{content:"\f124"} .fa-crop:before{content:"\f125"} .fa-code-fork:before{content:"\f126"} .fa-unlink:before,.fa-chain-broken:before{content:"\f127"} .fa-question:before{content:"\f128"} .fa-info:before{content:"\f129"} .fa-exclamation:before{content:"\f12a"} .fa-superscript:before{content:"\f12b"} .fa-subscript:before{content:"\f12c"} .fa-eraser:before{content:"\f12d"} .fa-puzzle-piece:before{content:"\f12e"} .fa-microphone:before{content:"\f130"} .fa-microphone-slash:before{content:"\f131"} .fa-shield:before{content:"\f132"} .fa-calendar-o:before{content:"\f133"} .fa-fire-extinguisher:before{content:"\f134"} .fa-rocket:before{content:"\f135"} .fa-maxcdn:before{content:"\f136"} .fa-chevron-circle-left:before{content:"\f137"} .fa-chevron-circle-right:before{content:"\f138"} .fa-chevron-circle-up:before{content:"\f139"} .fa-chevron-circle-down:before{content:"\f13a"} .fa-html5:before{content:"\f13b"} .fa-css3:before{content:"\f13c"} .fa-anchor:before{content:"\f13d"} .fa-unlock-o:before{content:"\f13e"} .fa-bullseye:before{content:"\f140"} .fa-ellipsis-horizontal:before{content:"\f141"} .fa-ellipsis-vertical:before{content:"\f142"} .fa-rss-square:before{content:"\f143"} .fa-play-circle:before{content:"\f144"} .fa-ticket:before{content:"\f145"} .fa-minus-square:before{content:"\f146"} .fa-minus-square-o:before{content:"\f147"} .fa-level-up:before{content:"\f148"} .fa-level-down:before{content:"\f149"} .fa-check-square:before{content:"\f14a"} .fa-pencil-square:before{content:"\f14b"} .fa-external-link-square:before{content:"\f14c"} .fa-share-square:before{content:"\f14d"} .fa-compass:before{content:"\f14e"} .fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"} .fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"} .fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"} .fa-euro:before,.fa-eur:before{content:"\f153"} .fa-gbp:before{content:"\f154"} .fa-dollar:before,.fa-usd:before{content:"\f155"} .fa-rupee:before,.fa-inr:before{content:"\f156"} .fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"} .fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"} .fa-won:before,.fa-krw:before{content:"\f159"} .fa-bitcoin:before,.fa-btc:before{content:"\f15a"} .fa-file:before{content:"\f15b"} .fa-file-text:before{content:"\f15c"} .fa-sort-alpha-asc:before{content:"\f15d"} .fa-sort-alpha-desc:before{content:"\f15e"} .fa-sort-amount-asc:before{content:"\f160"} .fa-sort-amount-desc:before{content:"\f161"} .fa-sort-numeric-asc:before{content:"\f162"} .fa-sort-numeric-desc:before{content:"\f163"} .fa-thumbs-up:before{content:"\f164"} .fa-thumbs-down:before{content:"\f165"} .fa-youtube-square:before{content:"\f166"} .fa-youtube:before{content:"\f167"} .fa-xing:before{content:"\f168"} .fa-xing-square:before{content:"\f169"} .fa-youtube-play:before{content:"\f16a"} .fa-dropbox:before{content:"\f16b"} .fa-stack-overflow:before{content:"\f16c"} .fa-instagram:before{content:"\f16d"} .fa-flickr:before{content:"\f16e"} .fa-adn:before{content:"\f170"} .fa-bitbucket:before{content:"\f171"} .fa-bitbucket-square:before{content:"\f172"} .fa-tumblr:before{content:"\f173"} .fa-tumblr-square:before{content:"\f174"} .fa-long-arrow-down:before{content:"\f175"} .fa-long-arrow-up:before{content:"\f176"} .fa-long-arrow-left:before{content:"\f177"} .fa-long-arrow-right:before{content:"\f178"} .fa-apple:before{content:"\f179"} .fa-windows:before{content:"\f17a"} .fa-android:before{content:"\f17b"} .fa-linux:before{content:"\f17c"} .fa-dribbble:before{content:"\f17d"} .fa-skype:before{content:"\f17e"} .fa-foursquare:before{content:"\f180"} .fa-trello:before{content:"\f181"} .fa-female:before{content:"\f182"} .fa-male:before{content:"\f183"} .fa-gittip:before{content:"\f184"} .fa-sun-o:before{content:"\f185"} .fa-moon-o:before{content:"\f186"} .fa-archive:before{content:"\f187"} .fa-bug:before{content:"\f188"} .fa-vk:before{content:"\f189"} .fa-weibo:before{content:"\f18a"} .fa-renren:before{content:"\f18b"} .fa-pagelines:before{content:"\f18c"} .fa-stack-exchange:before{content:"\f18d"} .fa-arrow-circle-o-right:before{content:"\f18e"} .fa-arrow-circle-o-left:before{content:"\f190"} .fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"} .fa-dot-circle-o:before{content:"\f192"} .fa-wheelchair:before{content:"\f193"} .fa-vimeo-square:before{content:"\f194"} .fa-turkish-lira:before,.fa-try:before{content:"\f195"}

/*********************************************************************************/ /* Section + Article Types */ /*********************************************************************************/

.is-highlight { text-align: center; }

.is-features { }

.is-feature { }

.is-blog { }

.is-post { }

.is-post-summary { }

.is-page-content { }

/*********************************************************************************/ /* Sidebar + Content */ /*********************************************************************************/

.sidebar { }

.content { }

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

#banner-wrapper { position: relative; background: url('https://static.igem.org/mediawiki/2014hs/5/51/IGEM_Graphic_PNG.png') center center no-repeat; background-size: cover; z-index: 1; }

/* Note: The following style adds the textured/pixelated look to the banner image. I added this to help mask the distortion introduced when a browser resizes an image, but if you don't want this to happen just remove or comment out the entire style. */

#banner-wrapper:before { content: ; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('https://static.igem.org/mediawiki/2014hs/5/5c/Overlay.png'); opacity: 0.175; }

#main-wrapper { background: #fff; border-top: solid 5px #e3daa8; border-bottom: solid 5px #c1cac5; }

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

#header { }

/*********************************************************************************/ /* Nav */ /*********************************************************************************/

#nav { }

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

#banner { position: relative; background: rgba(21, 28, 23, 0.95); text-align: center; z-index: 2; }

#banner:before { content: ; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('https://static.igem.org/mediawiki/2014hs/5/55/Highlight.png') center center; background-size: 100% 200%; }

#banner:after { content: ; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('https://static.igem.org/mediawiki/2014hs/5/5c/Overlay.png'); opacity: 0.25; }

#banner > * { position: relative; z-index: 3; }

#banner h2 { color: #3A77B0; }

#banner .byline { color: #fff; }



/*********************************************************************************/ /* Main */ /*********************************************************************************/

#main { }

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

#footer { }

#footer a { color: inherit; }

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

#copyright { display: inline-block; background: #e7eae8; padding: 0.75em 2em 0.75em 2em; border-radius: 8px; font-size: 0.85em; color: #8b9790; }

#copyright a { color: inherit; }

/* TXT 2.5 by HTML5 UP html5up.net | @n33co Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)

  • /

/*********************************************************************************/ /* Basic */ /*********************************************************************************/

body { min-width: 1200px; }

h1, h2, h3, h4, h5, h6, h7 { margin: 0 0 0.5em 0; }

h2 { font-size: 1.65em; }

h2.major { font-size: 1.65em; text-align: center; margin: 0 0 3em 0; }

h2.major span { top: -0.775em; padding: 0 1.5em 0 1.5em; }

#footer h2.major { margin: 0 0 1em 0; }

.sidebar h2.major { text-align: left; margin: 0 0 1em 0; }

.sidebar h2.major span { padding-left: 0; }

h3 { font-size: 1.25em; }

h4 { font-size: 1.25em; }

.button { font-size: 1.25em; padding: 0.85em 1.85em 0.85em 1.85em; }

.button-big { font-size: 1.65em; padding: 0.85em 1.85em 0.85em 1.85em; }

.actions { text-align: center; margin: 2em 0 0 0; }

.actions .button { margin: 0 0.5em 0 0.5em; }

/*********************************************************************************/ /* Section + Article Types */ /*********************************************************************************/

.is-highlight { }

.is-highlight .special { margin: 0 0 4em 0; }

.is-highlight h2 { font-size: 3em; margin: 0 0 0.75em 0; }

.is-highlight .byline { font-size: 1.65em; margin: 0 0 1.5em 0; }

.is-feature { text-align: center; }

.is-post { }

.is-post header { margin: 0 0 2.5em 0; }

.is-post h3 { font-size: 3em; margin: 0 0 0.5em 0; }

.is-post .byline { font-size: 1.65em; margin: 0 0 0.5em 0; }

.is-post ul.meta { margin: 0 0 0.5em 0; }

.is-post-summary { }

.is-post-summary h3 { line-height: 1em; margin: 0 0 0.75em 0; }

.is-post-summary .meta { margin: 0; line-height: 1em; }

.is-page-content { }

.is-page-content header { margin: 0 0 2.5em 0; }

.is-page-content h2 { font-size: 3em; margin: 0 0 0.5em 0; }

.is-page-content .byline { font-size: 1.65em; margin: 0 0 0.5em 0; }

.is-page-content ul.meta { margin: 0 0 0.5em 0; }

/*********************************************************************************/ /* Sidebar + Content */ /*********************************************************************************/

.sidebar { padding-top: 0.5em; }

.homepage .sidebar { padding-top: 0; }

.content { }

.content-left { padding-right: 2em; }

.content-right { padding-left: 2em; }

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

#banner-wrapper { padding: 8em 0 8em 0; }

#main-wrapper { border-top-width: 35px; border-bottom-width: 10px; }

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

#header { text-align: center; font-size: 2em; font-family: 'Open Sans Condensed', sans-serif; font-weight: 700; text-transform: uppercase; padding: 6em 0 3em 0; background: #fff; margin: 0 auto; }

#header .logo { position: relative; text-align: center; border-top: solid 5px #e7eae8; }

#header .logo div { background: #fff; position: relative; display: inline-block; padding: 0 1.5em 0 1.5em; top: -0.65em; }

#header .logo h1, #header .logo .byline { display: inline; }

/*********************************************************************************/ /* Nav */ /*********************************************************************************/

#nav { position: fixed; top: 0; left: 0; z-index: 1000; background: rgba(255,255,255,0.95); width: 100%; /*height: 3.5em*/ line-height: 3.5em; text-align: center; font-family: 'Open Sans Condensed', sans-serif; font-weight: 700; text-transform: uppercase; }

#nav:after { content: ; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('https://static.igem.org/mediawiki/2014hs/5/5c/Overlay.png'); opacity: 0.03; }

#nav ul { position: relative; z-index: 1001; }

#nav li { display: inline-block; margin: 0 0.5em 0 0.5em; top: 0; position: relative; -moz-transition: top .15s ease-in-out; -webkit-transition: top .15s ease-in-out; -o-transition: top .15s ease-in-out; -ms-transition: top .15s ease-in-out; transition: top .15s ease-in-out; }

#nav li a { position: relative; display: block; text-decoration: none; color: #6b7770; top: -3px; padding: 3px 1.5% 0.25em 1.5%; /* modified percentages, previously 1.5em */ border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; outline: 0; -moz-transition: background-color .075s ease-in-out, color .075s ease-in-out; -webkit-transition: background-color .075s ease-in-out, color .075s ease-in-out; -o-transition: background-color .075s ease-in-out, color .075s ease-in-out; -ms-transition: background-color .075s ease-in-out, color .075s ease-in-out; transition: background-color .075s ease-in-out, color .075s ease-in-out; }

#nav li:hover { top: 3px; }

#nav li:hover a { background: #4AB0D6; color: #fff; }

#nav li.current_page_item { }

#nav li.current_page_item a { background: #A5D6E4; color: #fff; }

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

#banner { padding: 5em 0 5em 0; }

#banner h2 { font-size: 2.75em; margin: 0 0 0.75em 0; }

#banner .byline { font-size: 1.35em; margin: 0 0 1.75em 0; }

#banner .button { font-size: 1.5em; }

/*********************************************************************************/ /* Main */ /*********************************************************************************/

#main { padding: 4em 0 4em 0; }

#main > .row { padding: 3em 0 3em 0; }

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

#footer { text-align: center; padding: 8em 0 8em 0; }

#footer > .row { padding: 2em 0 2em 0; }

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

#copyright { margin: 4em 0 0 0; }

/* TXT 2.5 by HTML5 UP html5up.net | @n33co Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)

  • /

/*********************************************************************************/ /* Basic */ /*********************************************************************************/

body { min-width: 960px; font-size: 10.25pt; line-height: 1.75em; }

h2.major { margin: 0 0 2em 0; }

h2.major span { top: -0.75em; padding: 0 1em 0 1em; }

#footer-wrapper h2.major { margin: 0 0 1em 0; }

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

#banner-wrapper { padding: 6em 0 6em 0; }

#main-wrapper { border-top-width: 10px; border-bottom-width: 10px; }

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

#header { padding: 5em 0 2em 0; }

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

#banner { padding: 4em 0 3.5em 0; }

#banner h2 { margin: 0 0 0.5em 0; }

#banner .byline { margin: 0 0 1.5em 0; }

/*********************************************************************************/ /* Main */ /*********************************************************************************/

#main { padding: 3em 0 2em 0; }

#main > .row { padding: 2em 0 2em 0; }

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

#footer { text-align: center; padding: 4em 0 4em 0; }

#footer > .row { padding: 2em 0 2em 0; }

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

#copyright { margin: 0; }

Retrieved from "http://2014hs.igem.org/Template:SMTexas/CSS"