Team:CU-Boulder/Test2

From 2014.igem.org

(Difference between revisions)
Line 23: Line 23:
<script src="js/skel.min.js"></script>
<script src="js/skel.min.js"></script>
<noscript>
<noscript>
-
</noscript>
+
                //style.css
                 <style>
                 <style>
                     @charset 'UTF-8';
                     @charset 'UTF-8';
Line 616: Line 616:
                         }
                         }
                 </style>
                 </style>
 +
                //style-noscript
                 <style>
                 <style>
-
                      
+
                     /*
 +
Parallelism 1.1 by HTML5 UP
 +
html5up.net | @n33co
 +
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
*/
 +
 
 +
/*********************************************************************************/
 +
/* Basic                                                                        */
 +
/*********************************************************************************/
 +
 
 +
body
 +
{
 +
height: auto;
 +
}
 +
 
 +
ul.contact
 +
{
 +
}
 +
 +
ul.contact li
 +
{
 +
margin: 0 1em 0 0;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Main                                                                          */
 +
/*********************************************************************************/
 +
 
 +
#main
 +
{
 +
position: relative;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Reel                                                                          */
 +
/*********************************************************************************/
 +
 
 +
#reel
 +
{
 +
overflow: hidden;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Footer                                                                        */
 +
/*********************************************************************************/
 +
 
 +
#footer
 +
{
 +
position: relative;
 +
overflow: visible;
 +
}
 +
 +
#footer .left,
 +
#footer .right
 +
{
 +
position: relative;
 +
padding: 2em;
 +
text-align: left;
 +
}
 +
 
 +
                </style>
 +
                //style-mobile
 +
                <style>
 +
                    /*
 +
Parallelism 1.1 by HTML5 UP
 +
html5up.net | @n33co
 +
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
*/
 +
 
 +
/*********************************************************************************/
 +
/* Basic                                                                        */
 +
/*********************************************************************************/
 +
 
 +
body
 +
{
 +
font-size: 12pt;
 +
line-height: 1.75em;
 +
}
 +
 
 +
ul.contact
 +
{
 +
}
 +
 +
ul.contact li
 +
{
 +
margin: 0 0.25em 0 0.25em;
 +
}
 +
 
 +
.item
 +
{
 +
}
 +
 
 +
.thumb
 +
{
 +
}
 +
 +
.thumb h2
 +
{
 +
text-align: center;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Wrapper                                                                      */
 +
/*********************************************************************************/
 +
 
 +
#wrapper
 +
{
 +
}
 +
 +
#wrapper.overlayed
 +
{
 +
-webkit-filter: blur(1px);
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Header                                                                        */
 +
/*********************************************************************************/
 +
 
 +
#header
 +
{
 +
padding: 3em 0 3em 0;
 +
text-align: center;
 +
}
 +
 
 +
#header h1
 +
{
 +
font-size: 2.25em;
 +
margin: 0 0 0.5em 0;
 +
}
 +
 +
#header p
 +
{
 +
font-size: 1.25em;
 +
line-height: 1.25em;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Footer                                                                        */
 +
/*********************************************************************************/
 +
 
 +
#footer
 +
{
 +
padding: 2em;
 +
text-align: center;
 +
}
 +
 +
#footer br
 +
{
 +
display: none;
 +
}
 +
 +
#footer .left
 +
{
 +
margin: 0 0 2em 0;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Popup                                                                        */
 +
/*********************************************************************************/
 +
 
 +
.poptrox-popup
 +
{
 +
background: #0a0f1c;
 +
box-shadow: 0px 0px 30px 10px rgba(8,11,19,0.85);
 +
border: solid 5px #fff;
 +
-moz-box-sizing: content-box;
 +
-webkit-box-sizing: content-box;
 +
-o-box-sizing: content-box;
 +
-ms-box-sizing: content-box;
 +
box-sizing: content-box;
 +
}
 +
                </style>
 +
                //style-desktop.css
 +
                <style>
 +
                    /*
 +
Parallelism 1.1 by HTML5 UP
 +
html5up.net | @n33co
 +
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
*/
 +
 
 +
/*********************************************************************************/
 +
/* Basic                                                                        */
 +
/*********************************************************************************/
 +
 
 +
html
 +
{
 +
height: 100%;
 +
}
 +
 
 +
body
 +
{
 +
padding: 0;
 +
font-size: 12pt;
 +
line-height: 1.75em;
 +
height: 100%;
 +
min-height: 450px;
 +
min-width: 1000px;
 +
}
 +
 
 +
body:before
 +
{
 +
content: '';
 +
position: absolute;
 +
left: 0;
 +
top: 0;
 +
width: 100%;
 +
height: 100%;
 +
background: -moz-linear-gradient(top, rgba(0,0,0,0) 50%, rgba(0,0,0,0.75));
 +
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 50%, rgba(0,0,0,0.75));
 +
background: -o-linear-gradient(top, rgba(0,0,0,0) 50%, rgba(0,0,0,0.75));
 +
background: -ms-linear-gradient(top, rgba(0,0,0,0) 50%, rgba(0,0,0,0.75));
 +
background: linear-gradient(top, rgba(0,0,0,0) 50%, rgba(0,0,0,0.75));
 +
}
 +
 
 +
ul.contact
 +
{
 +
}
 +
 +
ul.contact li
 +
{
 +
margin-left: 1em;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Wrapper                                                                      */
 +
/*********************************************************************************/
 +
 
 +
#wrapper
 +
{
 +
height: 100%;
 +
overflow: hidden;
 +
-webkit-transition: -webkit-filter 0.25s ease-in-out;
 +
}
 +
 +
#wrapper.overlayed
 +
{
 +
-webkit-filter: blur(3px);
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Main                                                                          */
 +
/*********************************************************************************/
 +
 
 +
#main
 +
{
 +
width: 100%;
 +
position: absolute;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Reel                                                                          */
 +
/*********************************************************************************/
 +
 
 +
#reel
 +
{
 +
position: relative;
 +
}
 +
 
 +
#reel .item
 +
{
 +
display: block;
 +
float: left;
 +
position: relative;
 +
overflow: hidden;
 +
}
 +
 
 +
/*********************************************************************************/
 +
/* Header                                                                        */
 +
/*********************************************************************************/
 +
 
 +
#header
 +
{
 +
padding: 3.25em 2em 0 2em;
 +
min-height: 212px;
 +
}
 +
 
 +
#header h1
 +
{
 +
font-size: 2.5em;
 +
margin: 0 0 0.5em 0;
 +
}
 +
 +
#header p
 +
{
 +
font-size: 1.4em;
 +
line-height: 1.25em;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Footer                                                                        */
 +
/*********************************************************************************/
 +
 
 +
#footer
 +
{
 +
position: absolute;
 +
bottom: 0;
 +
left: 0;
 +
width: 100%;
 +
overflow: hidden;
 +
}
 +
 +
#footer h2
 +
{
 +
font-size: 2.25em;
 +
margin: 0 0 1em 0;
 +
}
 +
 +
#footer .left
 +
{
 +
padding: 2em;
 +
text-align: left;
 +
}
 +
 +
#footer .right
 +
{
 +
position: absolute;
 +
top: 0;
 +
right: 0;
 +
padding: 2em;
 +
text-align: right;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Popup                                                                        */
 +
/*********************************************************************************/
 +
 
 +
.poptrox-popup
 +
{
 +
background: #1a1f2c;
 +
background: rgba(18,21,29,0.9);
 +
box-shadow: 0px 0px 0px 20px #fff, 0px 10px 60px 10px rgba(8,11,19,0.55);
 +
}
 +
 +
.poptrox-popup .loader
 +
{
 +
display: block;
 +
width: 48px;
 +
height: 48px;
 +
position: absolute;
 +
top: 50%;
 +
left: 50%;
 +
margin: -24px 0 0 -24px;
 +
background: url('images/loader.gif');
 +
opacity: 0.25;
 +
}
 +
 +
.poptrox-popup .caption
 +
{
 +
position: absolute;
 +
bottom: 0;
 +
left: 0;
 +
background: #1a1f2c;
 +
background: rgba(18,21,29,0.85);
 +
display: block;
 +
width: 100%;
 +
line-height: 75px;
 +
text-align: center;
 +
font-size: 1.25em;
 +
color: #fff;
 +
}
 +
 +
.poptrox-popup .nav-next,
 +
.poptrox-popup .nav-previous,
 +
.poptrox-popup .closer
 +
{
 +
text-decoration: none;
 +
font-weight: normal;
 +
font-style: normal;
 +
-moz-transition: opacity 0.25s ease-in-out;
 +
-webkit-transition: opacity 0.25s ease-in-out;
 +
-o-transition: opacity 0.25s ease-in-out;
 +
-ms-transition: opacity 0.25s ease-in-out;
 +
transition: opacity 0.25s ease-in-out;
 +
opacity: 0.35;
 +
}
 +
 
 +
.poptrox-popup .nav-next:hover,
 +
.poptrox-popup .nav-previous:hover,
 +
.poptrox-popup .closer:hover
 +
{
 +
opacity: 1.0;
 +
}
 +
 +
.poptrox-popup .nav-next,
 +
.poptrox-popup .nav-previous
 +
{
 +
width: 150px;
 +
height: 75px;
 +
position: absolute;
 +
bottom: 0;
 +
cursor: pointer;
 +
font-size: 3em;
 +
line-height: 75px;
 +
}
 +
 +
.poptrox-popup .nav-next
 +
{
 +
right: 0;
 +
text-align: right;
 +
padding-right: 30px;
 +
}
 +
 
 +
.poptrox-popup .nav-next:before
 +
{
 +
content: "\003e";
 +
}
 +
 +
.poptrox-popup .nav-previous
 +
{
 +
left: 0;
 +
text-align: left;
 +
padding-left: 30px;
 +
}
 +
 
 +
.poptrox-popup .nav-previous:before
 +
{
 +
content: "\003c";
 +
}
 +
 +
.poptrox-popup .closer
 +
{
 +
width: 35px;
 +
height: 35px;
 +
font-size: 2em;
 +
line-height: 35px;
 +
text-align: center;
 +
position: absolute;
 +
top: -70px;
 +
right: -70px;
 +
cursor: pointer;
 +
border-radius: 40px;
 +
box-shadow: 0px 0px 0px 1px #fff;
 +
}
 +
 +
.poptrox-popup .closer:before
 +
{
 +
content: "\00d7";
 +
}
 +
                </style>
 +
                //skel-noscript
 +
                <style>
 +
                    /* 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,details,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: 50px 0 0 50px;
 +
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: 50px;
 +
}
 +
 
 +
.row {
 +
margin-left: -50px;
 +
}
 +
 
 +
/* 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: 12.5px 0 0 12.5px;
 +
}
 +
 
 +
.row.quarter + .row.quarter > * {
 +
padding-top: 12.5px;
 +
}
 +
 
 +
.row.quarter {
 +
margin-left: -12.5px;
 +
}
 +
 
 +
/* Half */
 +
 
 +
.row.half > * {
 +
padding: 25px 0 0 25px;
 +
}
 +
 
 +
.row.half + .row.half > * {
 +
padding-top: 25px;
 +
}
 +
 
 +
.row.half {
 +
margin-left: -25px;
 +
}
 +
 
 +
/* One and (a) Half */
 +
 
 +
.row.oneandhalf > * {
 +
padding: 75px 0 0 75px;
 +
}
 +
 
 +
.row.oneandhalf + .row.oneandhalf > * {
 +
padding-top: 75px;
 +
}
 +
 
 +
.row.oneandhalf {
 +
margin-left: -75px;
 +
}
 +
 
 +
/* Double */
 +
 
 +
.row.double > * {
 +
padding: 100px 0 0 100px;
 +
}
 +
 
 +
.row.double + .row.double > * {
 +
padding-top: 100px;
 +
}
 +
 
 +
.row.double {
 +
margin-left: -100px;
 +
}
                 </style>
                 </style>
 +
                </noscript>
<!--[if lte IE 8]><link rel="stylesheet" href="css/ie8.css" /><![endif]-->
<!--[if lte IE 8]><link rel="stylesheet" href="css/ie8.css" /><![endif]-->
</head>
</head>

Revision as of 20:26, 26 June 2014

<!DOCTYPE HTML> Parallelism by HTML5 UP

You really got me

Ad Infinitum

Different.

Elysium

Kingdom of the Wind

The Pursuit

Boundless

The Spectators

Kingdom of the Wind

The Pursuit

Boundless

The Spectators

You really got me

Ad Infinitum

Different.

Elysium

Retrieved from "http://2014.igem.org/Team:CU-Boulder/Test2"