"

From 2014hs.igem.org

@font-face {

   font-family: 'BebasNeueRegular';
   src: url('fonts/BebasNeue-webfont.eot');
   src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
        url('fonts/BebasNeue-webfont.woff') format('woff'),
        url('fonts/BebasNeue-webfont.ttf') format('truetype'),
        url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
   font-weight: normal;
   font-style: normal;

} /* CSS reset */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; } html,body { margin:0; padding:0; height: 100%; } table { border-collapse:collapse; border-spacing:0; } fieldset,img { border:0; } address,caption,cite,code,dfn,th,var { font-style:normal; font-weight:normal; } ol,ul { list-style:none; } caption,th { text-align:left; } h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; } q:before,q:after { content:; } abbr,acronym { border:0; } section, header{ display: block; } /* General Demo Style */ body{ font-family: Cambria, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif; background: #fff url(../images/bg.jpg) repeat top left; font-weight: 400; font-size: 15px; color: #3a2127; overflow-y: scroll; } a{ color: #333; text-decoration: none; } .container{ width: 100%; height: 100%; position: relative; text-align: center; } .clr{ clear: both; } .container > header{ padding: 20px 30px 10px 30px; margin: 0px 20px 10px 20px; position: relative; display: block; text-shadow: 1px 1px 1px rgba(0,0,0,0.2);

   text-align: center;

} .container > header h1{ font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif; font-size: 35px; line-height: 35px; position: relative; font-weight: 400; color: rgba(26,89,120,0.9); text-shadow: 1px 1px 1px rgba(0,0,0,0.1);

   padding: 0px 0px 5px 0px;

} .container > header h1 span{ color: #7cbcd6; text-shadow: 0px 1px 1px rgba(255,255,255,0.8); } .container > header h2{ font-size: 16px; font-style: italic; color: #2d6277; text-shadow: 0px 1px 1px rgba(255,255,255,0.8); } /* Header Style */ .codrops-top{ line-height: 24px; font-size: 11px; background: rgba(255, 255, 255, 0.4); text-transform: uppercase; z-index: 9999; position: relative; box-shadow: 1px 0px 2px rgba(0,0,0,0.2); } .codrops-top a{ padding: 0px 10px; letter-spacing: 1px; color: #333; text-shadow: 0px 1px 1px #fff; display: block; float: left; } .codrops-top a:hover{ background: #fff; } .codrops-top span.right{ float: right; } .codrops-top span.right a{ float: left; display: block; }

p.codrops-demos{ text-align:center; display: block; padding: 14px; } p.codrops-demos a, p.codrops-demos a.current-demo, p.codrops-demos a.current-demo:hover{

   display: inline-block;

font-size: 11px; font-style: italic; width: 60px; height: 60px; margin: 0px 3px; line-height: 60px; border-radius: 50%; font-weight: 800; box-shadow: 1px 1px 1px rgba(0,0,0,0.05) inset; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,0.1); background: rgba(104,171,194,0.5); } p.codrops-demos a:hover{ background: #4fa2c4; } p.codrops-demos a.current-demo, p.codrops-demos a.current-demo:hover{ color: rgba(104,171,194,1); background: rgba(255,255,255,0.9); box-shadow: 0px 1px 1px rgba(0,0,0,0.1); }