Template:Montgomery Cougars NJUSA/Common CSS

From 2014hs.igem.org

(Difference between revisions)
(New theme!)
(Undo revision 12730 by Casey.chow (talk))
Line 25: Line 25:
}
}
-
/***************************************/
+
/* Block Grids */
-
/* RANDOM                              */
+
/* http://foundation.zurb.com/index.html */
-
/***************************************/
+
[class*="block-grid-"] {
 +
  display: block;
 +
  padding: 0;
 +
  margin: 0 -0.625rem;
 +
  *zoom: 1; }
 +
  [class*="block-grid-"]:before, [class*="block-grid-"]:after {
 +
    content: " ";
 +
    display: table; }
 +
  [class*="block-grid-"]:after {
 +
    clear: both; }
 +
  [class*="block-grid-"] > li {
 +
    display: block;
 +
    height: auto;
 +
    float: left;
 +
    padding: 0 0.625rem 1.25rem; }
 +
@media only screen {
 +
  .small-block-grid-1 > li {
 +
    width: 100%;
 +
    list-style: none; }
 +
    .small-block-grid-1 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-1 > li:nth-of-type(1n+1) {
 +
      clear: both; }
-
/* fontawesome */
+
  .small-block-grid-2 > li {
-
[class*="fontawesome-"]:before {
+
    width: 50%;
-
  font-family: 'FontAwesome', sans-serif;
+
    list-style: none; }
-
}
+
    .small-block-grid-2 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-2 > li:nth-of-type(2n+1) {
 +
      clear: both; }
-
/* http://css-tricks.com/snippets/css/clear-fix/ */
+
  .small-block-grid-3 > li {
-
.clearfix:after {
+
    width: 33.33333%;
-
visibility: hidden;
+
    list-style: none; }
-
display: block;
+
    .small-block-grid-3 > li:nth-of-type(n) {
-
font-size: 0;
+
      clear: none; }
-
content: " ";
+
    .small-block-grid-3 > li:nth-of-type(3n+1) {
-
clear: both;
+
      clear: both; }
-
height: 0;
+
 
 +
  .small-block-grid-4 > li {
 +
    width: 25%;
 +
    list-style: none; }
 +
    .small-block-grid-4 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-4 > li:nth-of-type(4n+1) {
 +
      clear: both; }
 +
 
 +
  .small-block-grid-5 > li {
 +
    width: 20%;
 +
    list-style: none; }
 +
    .small-block-grid-5 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-5 > li:nth-of-type(5n+1) {
 +
      clear: both; }
 +
 
 +
  .small-block-grid-6 > li {
 +
    width: 16.66667%;
 +
    list-style: none; }
 +
    .small-block-grid-6 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-6 > li:nth-of-type(6n+1) {
 +
      clear: both; }
 +
 
 +
  .small-block-grid-7 > li {
 +
    width: 14.28571%;
 +
    list-style: none; }
 +
    .small-block-grid-7 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-7 > li:nth-of-type(7n+1) {
 +
      clear: both; }
 +
 
 +
  .small-block-grid-8 > li {
 +
    width: 12.5%;
 +
    list-style: none; }
 +
    .small-block-grid-8 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-8 > li:nth-of-type(8n+1) {
 +
      clear: both; }
 +
 
 +
  .small-block-grid-9 > li {
 +
    width: 11.11111%;
 +
    list-style: none; }
 +
    .small-block-grid-9 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-9 > li:nth-of-type(9n+1) {
 +
      clear: both; }
 +
 
 +
  .small-block-grid-10 > li {
 +
    width: 10%;
 +
    list-style: none; }
 +
    .small-block-grid-10 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-10 > li:nth-of-type(10n+1) {
 +
      clear: both; }
 +
 
 +
  .small-block-grid-11 > li {
 +
    width: 9.09091%;
 +
    list-style: none; }
 +
    .small-block-grid-11 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-11 > li:nth-of-type(11n+1) {
 +
      clear: both; }
 +
 
 +
  .small-block-grid-12 > li {
 +
    width: 8.33333%;
 +
    list-style: none; }
 +
    .small-block-grid-12 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .small-block-grid-12 > li:nth-of-type(12n+1) {
 +
      clear: both; } }
 +
@media only screen and (min-width: 40.063em) {
 +
  .medium-block-grid-1 > li {
 +
    width: 100%;
 +
    list-style: none; }
 +
    .medium-block-grid-1 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-1 > li:nth-of-type(1n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-2 > li {
 +
    width: 50%;
 +
    list-style: none; }
 +
    .medium-block-grid-2 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-2 > li:nth-of-type(2n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-3 > li {
 +
    width: 33.33333%;
 +
    list-style: none; }
 +
    .medium-block-grid-3 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-3 > li:nth-of-type(3n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-4 > li {
 +
    width: 25%;
 +
    list-style: none; }
 +
    .medium-block-grid-4 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-4 > li:nth-of-type(4n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-5 > li {
 +
    width: 20%;
 +
    list-style: none; }
 +
    .medium-block-grid-5 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-5 > li:nth-of-type(5n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-6 > li {
 +
    width: 16.66667%;
 +
    list-style: none; }
 +
    .medium-block-grid-6 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-6 > li:nth-of-type(6n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-7 > li {
 +
    width: 14.28571%;
 +
    list-style: none; }
 +
    .medium-block-grid-7 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-7 > li:nth-of-type(7n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-8 > li {
 +
    width: 12.5%;
 +
    list-style: none; }
 +
    .medium-block-grid-8 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-8 > li:nth-of-type(8n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-9 > li {
 +
    width: 11.11111%;
 +
    list-style: none; }
 +
    .medium-block-grid-9 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-9 > li:nth-of-type(9n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-10 > li {
 +
    width: 10%;
 +
    list-style: none; }
 +
    .medium-block-grid-10 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-10 > li:nth-of-type(10n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-11 > li {
 +
    width: 9.09091%;
 +
    list-style: none; }
 +
    .medium-block-grid-11 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-11 > li:nth-of-type(11n+1) {
 +
      clear: both; }
 +
 
 +
  .medium-block-grid-12 > li {
 +
    width: 8.33333%;
 +
    list-style: none; }
 +
    .medium-block-grid-12 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .medium-block-grid-12 > li:nth-of-type(12n+1) {
 +
      clear: both; } }
 +
@media only screen and (min-width: 64.063em) {
 +
  .large-block-grid-1 > li {
 +
    width: 100%;
 +
    list-style: none; }
 +
    .large-block-grid-1 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-1 > li:nth-of-type(1n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-2 > li {
 +
    width: 50%;
 +
    list-style: none; }
 +
    .large-block-grid-2 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-2 > li:nth-of-type(2n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-3 > li {
 +
    width: 33.33333%;
 +
    list-style: none; }
 +
    .large-block-grid-3 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-3 > li:nth-of-type(3n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-4 > li {
 +
    width: 25%;
 +
    list-style: none; }
 +
    .large-block-grid-4 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-4 > li:nth-of-type(4n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-5 > li {
 +
    width: 20%;
 +
    list-style: none; }
 +
    .large-block-grid-5 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-5 > li:nth-of-type(5n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-6 > li {
 +
    width: 16.66667%;
 +
    list-style: none; }
 +
    .large-block-grid-6 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-6 > li:nth-of-type(6n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-7 > li {
 +
    width: 14.28571%;
 +
    list-style: none; }
 +
    .large-block-grid-7 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-7 > li:nth-of-type(7n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-8 > li {
 +
    width: 12.5%;
 +
    list-style: none; }
 +
    .large-block-grid-8 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-8 > li:nth-of-type(8n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-9 > li {
 +
    width: 11.11111%;
 +
    list-style: none; }
 +
    .large-block-grid-9 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-9 > li:nth-of-type(9n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-10 > li {
 +
    width: 10%;
 +
    list-style: none; }
 +
    .large-block-grid-10 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-10 > li:nth-of-type(10n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-11 > li {
 +
    width: 9.09091%;
 +
    list-style: none; }
 +
    .large-block-grid-11 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-11 > li:nth-of-type(11n+1) {
 +
      clear: both; }
 +
 
 +
  .large-block-grid-12 > li {
 +
    width: 8.33333%;
 +
    list-style: none; }
 +
    .large-block-grid-12 > li:nth-of-type(n) {
 +
      clear: none; }
 +
    .large-block-grid-12 > li:nth-of-type(12n+1) {
 +
      clear: both; } }
 +
 
 +
 
 +
/* Skel */
 +
/* 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: 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;
 +
}
 +
 
 +
/*
 +
Arcana 2.1 by HTML5 UP
 +
html5up.net | @n33co
 +
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
*/
 +
 
 +
/*********************************************************************************/
 +
/* Global                                                                        */
 +
/*********************************************************************************/
 +
 
 +
/* Basic */
 +
 
 +
*,*:before,*:after{-moz-box-sizing:content-box;-webkit-box-sizing:content-box;-o-box-sizing:content-box;-ms-box-sizing:content-box;box-sizing:content-box}
 +
 
 +
body
 +
{
 +
background: #f0f0f0 url('https://static.igem.org/mediawiki/2014hs/c/c2/Bg1.png');
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
font-size: 14px;
 +
line-height: 1.75em;
 +
color: #4c4c4c;
}
}
-
.clearfix { display: inline-block; }
 
-
/* start commented backslash hack \*/
 
-
* html .clearfix { height: 1%; }
 
-
.clearfix { display: block; }
 
-
/* close commented backslash hack */
 
-
.centered {
+
h1,h2,h3,h4,#bodyContent h1,#bodyContent h2,#bodyContent h3, #bodyContent h4
-
    display: table;
+
{
-
    margin-left: auto;
+
font-family: 'Open Sans Condensed', sans-serif;
-
    margin-right: auto;
+
color: #1d1d1d;
}
}
 +
h2, h3
 +
{
 +
font-size: 1.6em;
 +
letter-spacing: -1px;
 +
margin: 0 0 0.75em 0;
 +
}
-
/***************************************/
+
strong
-
/* FONT TWEAKS                        */
+
-
/***************************************/
+
-
body, p, span, blockquote, article, section, aside, nav {
+
{ color: #1d1d1d;
-
    font-family: 'Open Sans', sans-serif;
+
}
}
-
h1, h2, h3, h4, h5, h6,
+
a
-
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
+
{
-
    font-family: 'Open Sans', sans-serif;
+
color: #478903;
-
    font-weight: 400;
+
text-decoration: underline;
}
}
-
h1, h1 a {
+
a:hover
-
    font-size: 3.25em;
+
{
 +
text-decoration: none;
}
}
-
/***************************************/
+
/* Reusable */
-
/* HEADER                              */
+
-
/***************************************/
+
-
#header-wrapper {
+
.button
-
    position: relative; /* create new stacking context to keep logo on top */
+
{
-
    z-index: 100;
+
display: inline-block;
 +
background: #0893cf;
 +
box-shadow: inset 0px 0px 0px 1px #48d3FF, 0px 2px 3px 0px rgba(0,0,0,0.25);
 +
border: solid 1px #0893cf;
 +
border-radius: 6px;
 +
padding: 0.45em 1.1em 0.5em 1.1em;
 +
color: #fff;
 +
font-size: 0.8em;
 +
text-decoration: none;
 +
text-shadow: -1px -1px 0 rgba(0,0,0,0.5);
 +
background-image: -moz-linear-gradient(top, #38C3FF, #0893cf);
 +
background-image: -webkit-linear-gradient(top, #38C3FF, #0893cf);
 +
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#38C3FF), to(#0893cf));
 +
background-image: -ms-linear-gradient(top, #38C3FF, #0893cf);
 +
background-image: -o-linear-gradient(top, #38C3FF, #0893cf);
 +
background-image: linear-gradient(top, #38C3FF, #0893cf);
 +
outline: 0;
 +
white-space: nowrap;
}
}
-
#header {
+
 
-
    background-color: rgb(38, 38, 38);
+
.button:hover
-
    border-bottom: solid 0.75em rgb(0, 102, 0);
+
{
-
    height: 7.5em;
+
background: #28a3df;
 +
background-image: -moz-linear-gradient(top, #58d3FF, #28a3df);
 +
background-image: -webkit-linear-gradient(top, #58d3FF, #28a3df);
 +
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#58d3FF), to(#28a3df));
 +
background-image: -ms-linear-gradient(top, #58d3FF, #28a3df);
 +
background-image: -o-linear-gradient(top, #58d3FF, #28a3df);
 +
background-image: linear-gradient(top, #58d3FF, #28a3df);
}
}
-
#logo {
+
.button:active
-
    margin-left: 20px;
+
{
 +
background: #38C3FF;
 +
background-image: -moz-linear-gradient(top, #0893cf, #38C3FF);
 +
background-image: -webkit-linear-gradient(top, #0893cf, #38C3FF);
 +
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0893cf), to(#38C3FF));
 +
background-image: -ms-linear-gradient(top, #0893cf, #38C3FF);
 +
background-image: -o-linear-gradient(top, #0893cf, #38C3FF);
 +
background-image: linear-gradient(top, #0893cf, #38C3FF);
}
}
-
#logo span {
+
.divider
-
    display: none;
+
{
 +
border-top: solid 1px #e5e5e5;
 +
border-bottom: solid 1px #e5e5e5;
 +
height: 4px;
 +
margin: 2em 0 2em 0;
}
}
-
#logo img {
+
.divider-top
-
    /*max-width: 275px;*/
+
{
-
    position: absolute;
+
margin-bottom: 0;
-
    width: 250px;
+
}
}
-
#nav {
+
.divider-bottom
-
    background: none;
+
{
 +
margin-top: 0;
}
}
-
#nav ul {
+
.cta-box
-
    position: absolute;
+
{
-
    left: 320px;
+
background: url('https://static.igem.org/mediawiki/2014hs/b/b3/Bg2.png');
-
    top: 4.25em;
+
text-align: center;
-
    width: 70%;
+
padding: 1.25em 0 1.25em 0;
 +
text-shadow: 1px 2px 0px #fff;
 +
font-size: 2em;
}
}
-
#nav li a {
+
.cta-box .button
-
    color: #E6E6E6;
+
{
-
    font-family: 'Open Sans', sans-serif;
+
margin-left: 0.8em;
-
    font-size: 1.2em;
+
}
-
    font-weight: 300;
+
 +
.highlight-box
 +
{
 +
background: url('https://static.igem.org/mediawiki/2014hs/b/b3/Bg2.png');
 +
text-align: center;
 +
padding: 3.5em 0 3.5em 0;
 +
text-shadow: 1px 2px 0px #fff;
 +
}
-
    -webkit-transition: background-color 0.15s ease-in;
+
.highlight-box h2
-
    -moz-transition: background-color 0.15s ease-in;
+
{
-
    -o-transition: background-color 0.15s ease-in;
+
font-size: 3.2em;
-
    -ms-transition: background-color 0.15s ease-in;
+
letter-spacing: -3px;
-
    transition: background-color 0.15s ease-in;
+
margin: 0 0 0.6em 0;
 +
}
 +
 +
.highlight-box span
 +
{
 +
font-size: 2em;
 +
color: #a1a1a1;
 +
}
 +
 
 +
.thumbnails
 +
{
}
}
-
#nav li a:hover {
+
.thumbnails .divider
-
background: rgb(70, 70, 70);
+
{
 +
border-bottom: 0;
 +
border-top: solid 1px #e5e5e5;
 +
margin: 1em 0 1em 0;
 +
}
 +
 
 +
.thumbnails .thumbnail
 +
{
 +
overflow: hidden;
 +
}
 +
 
 +
.thumbnails .thumbnail img
 +
{
 +
border: solid 5px #fff;
 +
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
 +
float: left;
 +
margin-right: 25px;
 +
}
 +
 +
.thumbnails .thumbnail blockquote
 +
{
 +
margin: 0 0 0.75em 0;
 +
margin-left: 130px;
 +
}
 +
 
 +
.thumbnails .thumbnail cite
 +
{
 +
color: #888;
 +
margin-left: 130px;
 +
display: block;
 +
}
 +
 
 +
.thumbnails .thumbnail cite strong
 +
{
 +
padding-right: 0.25em;
 +
}
 +
 +
.link-list
 +
{
}
}
-
/***************************************/
+
.link-list li
-
/* GALLERY                            */
+
{
-
/***************************************/
+
border-top: solid 1px #d0d0d0;
 +
line-height: 2.5em;
 +
}
 +
 +
.link-list li:first-child
 +
{
 +
border-top: none;
 +
}
-
#slider {  
+
/*
-
    margin-right: 0;
+
Arcana 2.1 by HTML5 UP
-
    margin-bottom: 0;
+
html5up.net | @n33co
-
    position: relative;  
+
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-
    overflow: auto;  
+
*/
-
    width: 100%;
+
 
 +
/*********************************************************************************/
 +
/* Desktop (>= 480px)                                                            */
 +
/*********************************************************************************/
 +
 
 +
/* Wrappers */
 +
 
 +
#main-wrapper
 +
{
 +
background: #fff;
 +
padding: 2em 0 4em 0;
 +
}
 +
 
 +
#header-wrapper
 +
{
 +
box-shadow: inset 0px 10px 80px 0px rgba(0,0,0,0.2);
 +
height: 102px;
 +
position: relative;
 +
padding: 2.25em 0 2.25em 0;
 +
}
 +
 
 +
#footer-wrapper
 +
{
 +
padding: 3.5em 0 5em 0;
 +
box-shadow: inset 0px 10px 60px 0px rgba(0,0,0,0.15);
 +
}
 +
 
 +
/* Site Header */
 +
 
 +
#site-header
 +
{
 +
position: relative;
 +
background: url('https://static.igem.org/mediawiki/2014hs/a/a6/Header.png');
 +
background-size: 100% 190px;
 +
height: 190px;
 +
text-shadow: -1px -1px 1px rgba(0,0,0,1);
 +
}
 +
 
 +
/* Logo */
 +
 
 +
#logo
 +
{
 +
position: absolute;
 +
left: 40px;
 +
top: 0;
 +
height: 85px;
 +
line-height: 85px;
 +
}
 +
 
 +
#logo h1
 +
{
 +
font-size: 2.25em;
 +
letter-spacing: -1px;
 +
color: #fff;
 +
}
 +
 +
#logo span
 +
{
 +
display: inline-block;
 +
border-left: solid 2px #d0d0d0;
 +
margin-left: 1em;
 +
padding-left: 1em;
 +
}
 +
 
 +
#logo a
 +
{
 +
color: white;
 +
text-decoration: none;
 +
}
 +
 
 +
/* Site Nav */
 +
 
 +
#nav
 +
{
 +
position: absolute;
 +
top: 0;
 +
right: 50px;
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
text-align: right;
 +
}
 +
 
 +
#nav ul
 +
{
 +
list-style: none;
 +
overflow: hidden;
 +
}
 +
 
 +
#nav ul li
 +
{
 +
display: block;
 +
float: left;
 +
text-decoration: none;
 +
font-size: 1.2em;
 +
height: 90px;
 +
line-height: 90px;
 +
margin: 0 0 0 1.75em;
 +
}
 +
 
 +
#nav ul li a
 +
{
 +
color: #c0c0c0;
 +
text-decoration: none;
 +
outline: 0;
 +
}
 +
 
 +
#nav ul li a:hover
 +
{
 +
color: #eee;
 +
}
 +
 
 +
#nav ul li.current_page_item
 +
{
 +
background: url('https://static.igem.org/mediawiki/2014hs/a/ae/Nav-arrow.png') center 77px no-repeat;
 +
}
 +
 
 +
#nav ul li.current_page_item a
 +
{
 +
color: #fff;
 +
}
 +
 
 +
/* Banner */
 +
 
 +
#banner
 +
{
 +
margin: 0 0 3em 0;
 +
}
 +
 
 +
#banner a
 +
{
 +
}
 +
 
 +
#banner a img
 +
{
 +
width: 100%;
 +
display: block;
 +
}
 +
 
 +
#banner .caption
 +
{
 +
background: #1e1e1e url('https://static.igem.org/mediawiki/2014hs/e/ee/Bg3.png') top left repeat-x;
 +
font-size: 2em;
 +
color: #aaa;
 +
text-align: center;
 +
text-shadow: -1px -1px 1px rgba(0,0,0,1);
 +
padding: 0.6em 0 0.6em 0;
 +
}
 +
 
 +
#banner .caption span
 +
{
 +
}
 +
 +
#banner .caption span strong
 +
{
 +
color: #ffffff;
 +
}
 +
 +
#banner .caption .button
 +
{
 +
border: solid 1px #001916;
 +
margin-left: 0.8em;
 +
}
 +
 
 +
/* Site Footer */
 +
 +
#site-footer
 +
{
 +
text-shadow: 1px 2px 0px #fff;
 +
}
 +
 
 +
#site-footer a
 +
{
 +
text-decoration: none;
 +
color: #525252;
 +
}
 +
 
 +
#site-footer a:hover
 +
{
 +
text-decoration: underline;
 +
}
 +
 
 +
 
 +
#site-footer ul li
 +
{
 +
line-height: 2.5em;
 +
}
 +
 
 +
#site-footer .divider
 +
{
 +
border-top: solid 1px #d0d0d0;
 +
border-bottom: solid 1px #d0d0d0;
 +
height: 4px;
 +
margin: 1em 0 1em 0;
 +
}
 +
 
 +
/* Copyright */
 +
 +
#copyright
 +
{
 +
text-align: center;
 +
color: #868686;
 +
}
 +
 
 +
#copyright a
 +
{
 +
color: #868686;
 +
}
 +
 +
/* Subpage */
 +
 
 +
.subpage
 +
{
 +
padding-top: 2em !important;
 +
}
 +
 
 +
.subpage article
 +
{
 +
padding: 0 1em 0 1em;
 +
}
 +
 
 +
.subpage article.first
 +
{
 +
padding: 0 1em 0 0;
 +
}
 +
 
 +
.subpage article.last
 +
{
 +
padding: 0 0 0 1em;
 +
}
 +
 
 +
.subpage h2
 +
{
 +
font-size: 2.2em;
 +
}
 +
 
 +
.subpage h3
 +
{
 +
font-size: 1.2em;
 +
}
 +
 
 +
.subpage p
 +
{
 +
margin: 0 0 1.5em 0;
 +
}
 +
 
 +
.subpage section, .subpage article
 +
{
 +
margin: 0 0 2em 0;
 +
}
 +
 
 +
 
 +
/* CUSTOM STYLES */
 +
 
 +
#globalWrapper {
 +
font-size: auto !important;
}
}
-
#slider ul {
+
#content {
-
    margin-top: 0;
+
width: 100%;
-
    padding-left: 0;
+
padding: 0;
}
}
-
#slider li {  
+
.container {
-
    list-style: none;  
+
width: 70%;
-
    position: relative;
+
max-width: 1100px;
 +
margin: 0 auto;
}
}
-
#slider ul li {  
+
p {
-
    float: left;
+
line-height: 1.5;
-
    /*margin-top: -1em;*/
+
}
}
-
#slider ul li a {
+
h1 {
-
    display: block;
+
font-size: 3em;
 +
}}
 +
 
 +
h1 span {
 +
font-size: 1em;
}
}
-
#slider img {
+
.editsection {
-
    width: 100%;
+
font-size: 0.5em;
 +
vertical-align: bottom;
 +
line-height: 2.5;
}
}
-
#slider .caption {
+
table td {
-
    background-color: rgba(0,10,5,.8);
+
padding: 5px;
-
    color: white;
+
width: 1000px;
-
    padding: 1.5em 1em;
+
-
    position: absolute;
+
-
    bottom: 0;
+
-
    text-align: center;
+
-
    width: 100%;
+
}
}
-
#slider .caption h2 {
+
/**
-
    font-size: 3em;
+
* BxSlider v4.1.2 - Fully loaded, responsive content slider
-
    font-weight: 300;
+
* http://bxslider.com
-
    margin: 0 0 0.25em;
+
*
 +
* Written by: Steven Wanderski, 2014
 +
* http://stevenwanderski.com
 +
* (while drinking Belgian ales and listening to jazz)
 +
*
 +
* CEO and founder of bxCreative, LTD
 +
* http://bxcreative.com
 +
*/
 +
 
 +
 
 +
/** RESET AND LAYOUT
 +
===================================*/
 +
 
 +
.bx-wrapper {
 +
position: relative;
 +
margin: 0 auto 60px;
 +
padding: 0;
 +
*zoom: 1;
}
}
-
#slider .caption span {
+
.bx-wrapper img {
-
    font-size: 1.25em;
+
max-width: 100%;
-
    font-weight: 300;
+
display: block;
-
    margin: 0;
+
}
}
-
/***************************************/
+
/** THEME
-
/* LEFT LINKS                          */
+
===================================*/
-
/***************************************/
+
-
#left-links {
+
.bx-wrapper .bx-viewport {
 +
-moz-box-shadow: 0 0 5px #ccc;
 +
-webkit-box-shadow: 0 0 5px #ccc;
 +
box-shadow: 0 0 5px #ccc;
 +
border:  5px solid #fff;
 +
left: -5px;
 +
background: #fff;
 +
 
 +
/*fix other elements on the page moving (on Chrome)*/
 +
-webkit-transform: translatez(0);
 +
-moz-transform: translatez(0);
 +
    -ms-transform: translatez(0);
 +
    -o-transform: translatez(0);
 +
    transform: translatez(0);
}
}
-
#left-links-title,  
+
.bx-wrapper .bx-pager,
-
#left-links-links li a {
+
.bx-wrapper .bx-controls-auto {
-
    color: rgb(245, 245, 245);
+
position: absolute;
-
    font-family: 'Open Sans', sans-serif;
+
bottom: -30px;
-
    text-decoration: none;
+
width: 100%;
}
}
-
#left-links-title {
+
/* LOADER */
-
    background-color: rgba(0, 102, 0, 1);
+
 
-
    font-size: 2.5em;
+
.bx-wrapper .bx-loading {
-
    font-weight: 300;
+
min-height: 50px;
-
    float: left;
+
background: url("https://static.igem.org/mediawiki/2014hs/2/29/Bx_loader.gif") center center no-repeat #fff;
-
    margin: 0;
+
height: 100%;
-
    min-width: 75%;
+
width: 100%;
-
    padding: 10px;
+
position: absolute;
 +
top: 0;
 +
left: 0;
 +
z-index: 2000;
}
}
 +
/* PAGER */
-
#left-links-links {
+
.bx-wrapper .bx-pager {
-
  float: left;
+
text-align: center;
-
  margin: 0;
+
font-size: .85em;
-
  padding: 0;
+
font-family: Arial;
-
  width: 100%;
+
font-weight: bold;
 +
color: #666;
 +
padding-top: 20px;
}
}
-
#left-links-links li {
+
.bx-wrapper .bx-pager .bx-pager-item,
-
    display: block;
+
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
-
    font-size: 1.5em;
+
display: inline-block;
-
    font-weight: 300;
+
*zoom: 1;
-
    width: 100%;
+
*display: inline;
}
}
-
#left-links-links li a {
+
.bx-wrapper .bx-pager.bx-default-pager a {
-
    display: block;
+
background: #666;
-
    width: 50%;
+
text-indent: -9999px;
-
    padding: 7px 15px;
+
display: block;
 +
width: 10px;
 +
height: 10px;
 +
margin: 0 5px;
 +
outline: 0;
 +
-moz-border-radius: 5px;
 +
-webkit-border-radius: 5px;
 +
border-radius: 5px;
}
}
-
#left-links-links > :nth-child(1) > a {
+
.bx-wrapper .bx-pager.bx-default-pager a:hover,
-
    background-color: rgba(0, 102, 0, 0.95);
+
.bx-wrapper .bx-pager.bx-default-pager a.active {
 +
background: #000;
}
}
-
#left-links-links > :nth-child(2) > a {
+
 
-
    background-color: rgba(0, 102, 0, 0.91);
+
/* DIRECTION CONTROLS (NEXT / PREV) */
 +
 
 +
.bx-wrapper .bx-prev {
 +
left: 10px;
 +
background: url("https://static.igem.org/mediawiki/2014hs/f/fc/Controls.png") no-repeat 0 -32px;
}
}
-
#left-links-links > :nth-child(3) > a {
+
 
-
    background-color: rgba(0, 102, 0, .87);
+
.bx-wrapper .bx-next {
 +
right: 25px;
 +
background: url("https://static.igem.org/mediawiki/2014hs/f/fc/Controls.png") no-repeat -43px -32px;
}
}
-
#left-links-links > :nth-child(4) > a {
+
 
-
    background-color: rgba(0, 102, 0, 0.83);
+
.bx-wrapper .bx-prev:hover {
 +
background-position: 0 0;
}
}
-
#left-links-links > :nth-child(5) > a {
+
 
-
    background-color: rgba(0, 102, 0, 0.79);
+
.bx-wrapper .bx-next:hover {
 +
background-position: -43px 0;
}
}
-
#left-links-links > :nth-child(6) > a {
+
 
-
    background-color: rgba(0, 102, 0, 0.75);
+
.bx-wrapper .bx-controls-direction a {
 +
position: absolute;
 +
top: 50%;
 +
margin-top: -16px;
 +
outline: 0;
 +
width: 32px;
 +
height: 32px;
 +
text-indent: -9999px;
 +
z-index: 9999;
}
}
-
#left-links-links > :nth-child(7) > a {
+
 
-
    background-color: rgba(0, 102, 0, 0.71);
+
.bx-wrapper .bx-controls-direction a.disabled {
-
}
+
display: none;
-
#left-links-links > :nth-child(8) > a {
+
-
    background-color: rgba(0, 102, 0, 0.67);
+
-
}
+
-
#left #left-links-title {
+
-
    background-color: rgba(0, 102, 0, 1);
+
-
    color: rgb(240, 240, 240);
+
}
}
-
/***************************************/
+
/* AUTO CONTROLS (START / STOP) */
-
/* CONTENT                            */
+
-
/***************************************/
+
-
#content {
+
.bx-wrapper .bx-controls-auto {
-
    box-sizing: border-box;
+
text-align: center;
-
    padding-right: 3em;
+
}
}
-
#content h1:first-child {
+
.bx-wrapper .bx-controls-auto .bx-start {
-
    margin: 0.3em 0 0.25em;
+
display: block;
 +
text-indent: -9999px;
 +
width: 10px;
 +
height: 11px;
 +
outline: 0;
 +
background: url("https://static.igem.org/mediawiki/2014hs/f/fc/Controls.png") -86px -11px no-repeat;
 +
margin: 0 3px;
}
}
-
 
+
.bx-wrapper .bx-controls-auto .bx-start:hover,
-
/***************************************/
+
.bx-wrapper .bx-controls-auto .bx-start.active {
-
/* FOOTER                              */
+
background-position: -86px 0;
-
/***************************************/
+
-
 
+
-
#footer {
+
-
    margin-top: 2em;
+
}
}
-
#footer-links {
+
.bx-wrapper .bx-controls-auto .bx-stop {
-
    text-align: center;
+
display: block;
 +
text-indent: -9999px;
 +
width: 9px;
 +
height: 11px;
 +
outline: 0;
 +
background: url("https://static.igem.org/mediawiki/2014hs/f/fc/Controls.png") -86px -44px no-repeat;
 +
margin: 0 3px;
}
}
-
#footer-text {
+
.bx-wrapper .bx-controls-auto .bx-stop:hover,
-
    color: #777;
+
.bx-wrapper .bx-controls-auto .bx-stop.active {
-
    font-size: 0.8em;
+
background-position: -86px -33px;
-
    margin: 0.75em 0;
+
-
    text-align: center;
+
}
}
-
#footer-links-2 ul {
+
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
-
    margin: 0.75em 0 0.25em;
+
 
-
    padding: 0;
+
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
 +
text-align: left;
 +
width: 80%;
}
}
-
#footer-links-2 ul li {
+
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
-
    display: inline;
+
right: 0;
-
    list-style: none;
+
width: 35px;
-
    padding-right: 1em;
+
}
}
-
#footer-links-2 ul li:last-child {
+
/* IMAGE CAPTIONS */
-
    padding-right: 0;
+
 
 +
.bx-wrapper .bx-caption {
 +
position: absolute;
 +
bottom: 0;
 +
left: 0;
 +
background: #666\9;
 +
background: rgba(80, 80, 80, 0.75);
 +
width: 100%;
}
}
-
#footer-links-2 ul li a {
+
.bx-wrapper .bx-caption span {
-
    font-size: 0.9em;
+
color: #fff;
-
    color: #777;
+
font-family: Arial;
-
    text-decoration: none;
+
display: block;
 +
font-size: .85em;
 +
padding: 10px;
}
}

Revision as of 20:44, 13 June 2014

/* Edit this file: https://2014hs.igem.org/wiki/index.php?title=Template:Montgomery_Cougars_NJUSA/Common_CSS&action=edit */ /* https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki#Centralizing_the_layout_using_templates */

/* Clear Wiki Shit */

  1. contentSub,
  2. search-controls,

.firstHeading,

  1. footer-box,
  2. catlinks,
  3. p-logo { 
   display:none;

}

  1. top-section { 
   border: none;
   height: 0px;

}

  1. content { 
   border: none;

}

  1. menubar > ul > li:last-child { 
   display: none;

}

  1. menubar { 
   width: auto;

}

/* Block Grids */ /* http://foundation.zurb.com/index.html */ [class*="block-grid-"] { 

 display: block;
 padding: 0;
 margin: 0 -0.625rem;
 *zoom: 1; }
 [class*="block-grid-"]:before, [class*="block-grid-"]:after {
   content: " ";
   display: table; }
 [class*="block-grid-"]:after {
   clear: both; }
 [class*="block-grid-"] > li {
   display: block;
   height: auto;
   float: left;
   padding: 0 0.625rem 1.25rem; }

@media only screen { 

 .small-block-grid-1 > li {
   width: 100%;
   list-style: none; }
   .small-block-grid-1 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-1 > li:nth-of-type(1n+1) {
     clear: both; }

 .small-block-grid-2 > li {
   width: 50%;
   list-style: none; }
   .small-block-grid-2 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-2 > li:nth-of-type(2n+1) {
     clear: both; }

 .small-block-grid-3 > li {
   width: 33.33333%;
   list-style: none; }
   .small-block-grid-3 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-3 > li:nth-of-type(3n+1) {
     clear: both; }

 .small-block-grid-4 > li {
   width: 25%;
   list-style: none; }
   .small-block-grid-4 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-4 > li:nth-of-type(4n+1) {
     clear: both; }

 .small-block-grid-5 > li {
   width: 20%;
   list-style: none; }
   .small-block-grid-5 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-5 > li:nth-of-type(5n+1) {
     clear: both; }

 .small-block-grid-6 > li {
   width: 16.66667%;
   list-style: none; }
   .small-block-grid-6 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-6 > li:nth-of-type(6n+1) {
     clear: both; }

 .small-block-grid-7 > li {
   width: 14.28571%;
   list-style: none; }
   .small-block-grid-7 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-7 > li:nth-of-type(7n+1) {
     clear: both; }

 .small-block-grid-8 > li {
   width: 12.5%;
   list-style: none; }
   .small-block-grid-8 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-8 > li:nth-of-type(8n+1) {
     clear: both; }

 .small-block-grid-9 > li {
   width: 11.11111%;
   list-style: none; }
   .small-block-grid-9 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-9 > li:nth-of-type(9n+1) {
     clear: both; }

 .small-block-grid-10 > li {
   width: 10%;
   list-style: none; }
   .small-block-grid-10 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-10 > li:nth-of-type(10n+1) {
     clear: both; }

 .small-block-grid-11 > li {
   width: 9.09091%;
   list-style: none; }
   .small-block-grid-11 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-11 > li:nth-of-type(11n+1) {
     clear: both; }

 .small-block-grid-12 > li {
   width: 8.33333%;
   list-style: none; }
   .small-block-grid-12 > li:nth-of-type(n) {
     clear: none; }
   .small-block-grid-12 > li:nth-of-type(12n+1) {
     clear: both; } }

@media only screen and (min-width: 40.063em) { 

 .medium-block-grid-1 > li {
   width: 100%;
   list-style: none; }
   .medium-block-grid-1 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-1 > li:nth-of-type(1n+1) {
     clear: both; }

 .medium-block-grid-2 > li {
   width: 50%;
   list-style: none; }
   .medium-block-grid-2 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-2 > li:nth-of-type(2n+1) {
     clear: both; }

 .medium-block-grid-3 > li {
   width: 33.33333%;
   list-style: none; }
   .medium-block-grid-3 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-3 > li:nth-of-type(3n+1) {
     clear: both; }

 .medium-block-grid-4 > li {
   width: 25%;
   list-style: none; }
   .medium-block-grid-4 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-4 > li:nth-of-type(4n+1) {
     clear: both; }

 .medium-block-grid-5 > li {
   width: 20%;
   list-style: none; }
   .medium-block-grid-5 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-5 > li:nth-of-type(5n+1) {
     clear: both; }

 .medium-block-grid-6 > li {
   width: 16.66667%;
   list-style: none; }
   .medium-block-grid-6 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-6 > li:nth-of-type(6n+1) {
     clear: both; }

 .medium-block-grid-7 > li {
   width: 14.28571%;
   list-style: none; }
   .medium-block-grid-7 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-7 > li:nth-of-type(7n+1) {
     clear: both; }

 .medium-block-grid-8 > li {
   width: 12.5%;
   list-style: none; }
   .medium-block-grid-8 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-8 > li:nth-of-type(8n+1) {
     clear: both; }

 .medium-block-grid-9 > li {
   width: 11.11111%;
   list-style: none; }
   .medium-block-grid-9 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-9 > li:nth-of-type(9n+1) {
     clear: both; }

 .medium-block-grid-10 > li {
   width: 10%;
   list-style: none; }
   .medium-block-grid-10 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-10 > li:nth-of-type(10n+1) {
     clear: both; }

 .medium-block-grid-11 > li {
   width: 9.09091%;
   list-style: none; }
   .medium-block-grid-11 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-11 > li:nth-of-type(11n+1) {
     clear: both; }

 .medium-block-grid-12 > li {
   width: 8.33333%;
   list-style: none; }
   .medium-block-grid-12 > li:nth-of-type(n) {
     clear: none; }
   .medium-block-grid-12 > li:nth-of-type(12n+1) {
     clear: both; } }

@media only screen and (min-width: 64.063em) { 

 .large-block-grid-1 > li {
   width: 100%;
   list-style: none; }
   .large-block-grid-1 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-1 > li:nth-of-type(1n+1) {
     clear: both; }

 .large-block-grid-2 > li {
   width: 50%;
   list-style: none; }
   .large-block-grid-2 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-2 > li:nth-of-type(2n+1) {
     clear: both; }

 .large-block-grid-3 > li {
   width: 33.33333%;
   list-style: none; }
   .large-block-grid-3 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-3 > li:nth-of-type(3n+1) {
     clear: both; }

 .large-block-grid-4 > li {
   width: 25%;
   list-style: none; }
   .large-block-grid-4 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-4 > li:nth-of-type(4n+1) {
     clear: both; }

 .large-block-grid-5 > li {
   width: 20%;
   list-style: none; }
   .large-block-grid-5 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-5 > li:nth-of-type(5n+1) {
     clear: both; }

 .large-block-grid-6 > li {
   width: 16.66667%;
   list-style: none; }
   .large-block-grid-6 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-6 > li:nth-of-type(6n+1) {
     clear: both; }

 .large-block-grid-7 > li {
   width: 14.28571%;
   list-style: none; }
   .large-block-grid-7 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-7 > li:nth-of-type(7n+1) {
     clear: both; }

 .large-block-grid-8 > li {
   width: 12.5%;
   list-style: none; }
   .large-block-grid-8 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-8 > li:nth-of-type(8n+1) {
     clear: both; }

 .large-block-grid-9 > li {
   width: 11.11111%;
   list-style: none; }
   .large-block-grid-9 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-9 > li:nth-of-type(9n+1) {
     clear: both; }

 .large-block-grid-10 > li {
   width: 10%;
   list-style: none; }
   .large-block-grid-10 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-10 > li:nth-of-type(10n+1) {
     clear: both; }

 .large-block-grid-11 > li {
   width: 9.09091%;
   list-style: none; }
   .large-block-grid-11 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-11 > li:nth-of-type(11n+1) {
     clear: both; }

 .large-block-grid-12 > li {
   width: 8.33333%;
   list-style: none; }
   .large-block-grid-12 > li:nth-of-type(n) {
     clear: none; }
   .large-block-grid-12 > li:nth-of-type(12n+1) {
     clear: both; } }


/* Skel */ /* 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: 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; }

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

  • /

/*********************************************************************************/ /* Global */ /*********************************************************************************/

/* Basic */

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

body { background: #f0f0f0 url('https://static.igem.org/mediawiki/2014hs/c/c2/Bg1.png'); font-family: 'Open Sans Condensed', sans-serif; font-size: 14px; line-height: 1.75em; color: #4c4c4c; }

h1,h2,h3,h4,#bodyContent h1,#bodyContent h2,#bodyContent h3, #bodyContent h4 { font-family: 'Open Sans Condensed', sans-serif; color: #1d1d1d; }

h2, h3 { font-size: 1.6em; letter-spacing: -1px; margin: 0 0 0.75em 0; }

strong

{ color: #1d1d1d; }

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

a:hover { text-decoration: none; }

/* Reusable */

.button { display: inline-block; background: #0893cf; box-shadow: inset 0px 0px 0px 1px #48d3FF, 0px 2px 3px 0px rgba(0,0,0,0.25); border: solid 1px #0893cf; border-radius: 6px; padding: 0.45em 1.1em 0.5em 1.1em; color: #fff; font-size: 0.8em; text-decoration: none; text-shadow: -1px -1px 0 rgba(0,0,0,0.5); background-image: -moz-linear-gradient(top, #38C3FF, #0893cf); background-image: -webkit-linear-gradient(top, #38C3FF, #0893cf); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#38C3FF), to(#0893cf)); background-image: -ms-linear-gradient(top, #38C3FF, #0893cf); background-image: -o-linear-gradient(top, #38C3FF, #0893cf); background-image: linear-gradient(top, #38C3FF, #0893cf); outline: 0; white-space: nowrap; }

.button:hover { background: #28a3df; background-image: -moz-linear-gradient(top, #58d3FF, #28a3df); background-image: -webkit-linear-gradient(top, #58d3FF, #28a3df); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#58d3FF), to(#28a3df)); background-image: -ms-linear-gradient(top, #58d3FF, #28a3df); background-image: -o-linear-gradient(top, #58d3FF, #28a3df); background-image: linear-gradient(top, #58d3FF, #28a3df); }

.button:active { background: #38C3FF; background-image: -moz-linear-gradient(top, #0893cf, #38C3FF); background-image: -webkit-linear-gradient(top, #0893cf, #38C3FF); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0893cf), to(#38C3FF)); background-image: -ms-linear-gradient(top, #0893cf, #38C3FF); background-image: -o-linear-gradient(top, #0893cf, #38C3FF); background-image: linear-gradient(top, #0893cf, #38C3FF); }

.divider { border-top: solid 1px #e5e5e5; border-bottom: solid 1px #e5e5e5; height: 4px; margin: 2em 0 2em 0; }

.divider-top { margin-bottom: 0; }

.divider-bottom { margin-top: 0; }

.cta-box { background: url('https://static.igem.org/mediawiki/2014hs/b/b3/Bg2.png'); text-align: center; padding: 1.25em 0 1.25em 0; text-shadow: 1px 2px 0px #fff; font-size: 2em; }

.cta-box .button { margin-left: 0.8em; }

.highlight-box { background: url('https://static.igem.org/mediawiki/2014hs/b/b3/Bg2.png'); text-align: center; padding: 3.5em 0 3.5em 0; text-shadow: 1px 2px 0px #fff; }

.highlight-box h2 { font-size: 3.2em; letter-spacing: -3px; margin: 0 0 0.6em 0; }

.highlight-box span { font-size: 2em; color: #a1a1a1; }

.thumbnails { }

.thumbnails .divider { border-bottom: 0; border-top: solid 1px #e5e5e5; margin: 1em 0 1em 0; }

.thumbnails .thumbnail { overflow: hidden; }

.thumbnails .thumbnail img { border: solid 5px #fff; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25); float: left; margin-right: 25px; }

.thumbnails .thumbnail blockquote { margin: 0 0 0.75em 0; margin-left: 130px; }

.thumbnails .thumbnail cite { color: #888; margin-left: 130px; display: block; }

.thumbnails .thumbnail cite strong { padding-right: 0.25em; }

.link-list { }

.link-list li { border-top: solid 1px #d0d0d0; line-height: 2.5em; }

.link-list li:first-child { border-top: none; }

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

  • /

/*********************************************************************************/ /* Desktop (>= 480px) */ /*********************************************************************************/

/* Wrappers */

#main-wrapper { background: #fff; padding: 2em 0 4em 0; }

#header-wrapper { box-shadow: inset 0px 10px 80px 0px rgba(0,0,0,0.2); height: 102px; position: relative; padding: 2.25em 0 2.25em 0; }

#footer-wrapper { padding: 3.5em 0 5em 0; box-shadow: inset 0px 10px 60px 0px rgba(0,0,0,0.15); }

/* Site Header */

#site-header { position: relative; background: url('https://static.igem.org/mediawiki/2014hs/a/a6/Header.png'); background-size: 100% 190px; height: 190px; text-shadow: -1px -1px 1px rgba(0,0,0,1); }

/* Logo */

#logo { position: absolute; left: 40px; top: 0; height: 85px; line-height: 85px; }

#logo h1 { font-size: 2.25em; letter-spacing: -1px; color: #fff; }

#logo span { display: inline-block; border-left: solid 2px #d0d0d0; margin-left: 1em; padding-left: 1em; }

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

/* Site Nav */

#nav { position: absolute; top: 0; right: 50px; font-family: 'Open Sans Condensed', sans-serif; text-align: right; }

#nav ul { list-style: none; overflow: hidden; }

#nav ul li { display: block; float: left; text-decoration: none; font-size: 1.2em; height: 90px; line-height: 90px; margin: 0 0 0 1.75em; }

#nav ul li a { color: #c0c0c0; text-decoration: none; outline: 0; }

#nav ul li a:hover { color: #eee; }

#nav ul li.current_page_item { background: url('https://static.igem.org/mediawiki/2014hs/a/ae/Nav-arrow.png') center 77px no-repeat; }

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

/* Banner */

#banner { margin: 0 0 3em 0; }

#banner a { }

#banner a img { width: 100%; display: block; }

#banner .caption { background: #1e1e1e url('https://static.igem.org/mediawiki/2014hs/e/ee/Bg3.png') top left repeat-x; font-size: 2em; color: #aaa; text-align: center; text-shadow: -1px -1px 1px rgba(0,0,0,1); padding: 0.6em 0 0.6em 0; }

#banner .caption span { }

#banner .caption span strong { color: #ffffff; }

#banner .caption .button { border: solid 1px #001916; margin-left: 0.8em; }

/* Site Footer */

#site-footer { text-shadow: 1px 2px 0px #fff; }

#site-footer a { text-decoration: none; color: #525252; }

#site-footer a:hover { text-decoration: underline; }


#site-footer ul li { line-height: 2.5em; }

#site-footer .divider { border-top: solid 1px #d0d0d0; border-bottom: solid 1px #d0d0d0; height: 4px; margin: 1em 0 1em 0; }

/* Copyright */

#copyright { text-align: center; color: #868686; }

#copyright a { color: #868686; }

/* Subpage */

.subpage { padding-top: 2em !important; }

.subpage article { padding: 0 1em 0 1em; }

.subpage article.first { padding: 0 1em 0 0; }

.subpage article.last { padding: 0 0 0 1em; }

.subpage h2 { font-size: 2.2em; }

.subpage h3 { font-size: 1.2em; }

.subpage p { margin: 0 0 1.5em 0; }

.subpage section, .subpage article { margin: 0 0 2em 0; }


/* CUSTOM STYLES */

  1. globalWrapper {

font-size: auto !important; }

  1. content {

width: 100%; padding: 0; }

.container { width: 70%; max-width: 1100px; margin: 0 auto; }

p { line-height: 1.5; }

h1 { font-size: 3em; }}

h1 span { font-size: 1em; }

.editsection { font-size: 0.5em; vertical-align: bottom; line-height: 2.5; }

table td { padding: 5px; width: 1000px; }

/** 

* BxSlider v4.1.2 - Fully loaded, responsive content slider
* http://bxslider.com
*
* Written by: Steven Wanderski, 2014
* http://stevenwanderski.com
* (while drinking Belgian ales and listening to jazz)
*
* CEO and founder of bxCreative, LTD
* http://bxcreative.com
*/


/** RESET AND LAYOUT ===================================*/

.bx-wrapper { position: relative; margin: 0 auto 60px; padding: 0; *zoom: 1; }

.bx-wrapper img { max-width: 100%; display: block; }

/** THEME ===================================*/

.bx-wrapper .bx-viewport { -moz-box-shadow: 0 0 5px #ccc; -webkit-box-shadow: 0 0 5px #ccc; box-shadow: 0 0 5px #ccc; border: 5px solid #fff; left: -5px; background: #fff;

/*fix other elements on the page moving (on Chrome)*/ -webkit-transform: translatez(0); -moz-transform: translatez(0); 

   	-ms-transform: translatez(0);
   	-o-transform: translatez(0);
   	transform: translatez(0);

}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { position: absolute; bottom: -30px; width: 100%; }

/* LOADER */

.bx-wrapper .bx-loading { min-height: 50px; background: url("Bx_loader.gif") center center no-repeat #fff; height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 2000; }

/* PAGER */

.bx-wrapper .bx-pager { text-align: center; font-size: .85em; font-family: Arial; font-weight: bold; color: #666; padding-top: 20px; }

.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item { display: inline-block; *zoom: 1; *display: inline; }

.bx-wrapper .bx-pager.bx-default-pager a { background: #666; text-indent: -9999px; display: block; width: 10px; height: 10px; margin: 0 5px; outline: 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active { background: #000; }

/* DIRECTION CONTROLS (NEXT / PREV) */

.bx-wrapper .bx-prev { left: 10px; background: url("Controls.png") no-repeat 0 -32px; }

.bx-wrapper .bx-next { right: 25px; background: url("Controls.png") no-repeat -43px -32px; }

.bx-wrapper .bx-prev:hover { background-position: 0 0; }

.bx-wrapper .bx-next:hover { background-position: -43px 0; }

.bx-wrapper .bx-controls-direction a { position: absolute; top: 50%; margin-top: -16px; outline: 0; width: 32px; height: 32px; text-indent: -9999px; z-index: 9999; }

.bx-wrapper .bx-controls-direction a.disabled { display: none; }

/* AUTO CONTROLS (START / STOP) */

.bx-wrapper .bx-controls-auto { text-align: center; }

.bx-wrapper .bx-controls-auto .bx-start { display: block; text-indent: -9999px; width: 10px; height: 11px; outline: 0; background: url("Controls.png") -86px -11px no-repeat; margin: 0 3px; }

.bx-wrapper .bx-controls-auto .bx-start:hover, .bx-wrapper .bx-controls-auto .bx-start.active { background-position: -86px 0; }

.bx-wrapper .bx-controls-auto .bx-stop { display: block; text-indent: -9999px; width: 9px; height: 11px; outline: 0; background: url("Controls.png") -86px -44px no-repeat; margin: 0 3px; }

.bx-wrapper .bx-controls-auto .bx-stop:hover, .bx-wrapper .bx-controls-auto .bx-stop.active { background-position: -86px -33px; }

/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager { text-align: left; width: 80%; }

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto { right: 0; width: 35px; }

/* IMAGE CAPTIONS */

.bx-wrapper .bx-caption { position: absolute; bottom: 0; left: 0; background: #666\9; background: rgba(80, 80, 80, 0.75); width: 100%; }

.bx-wrapper .bx-caption span { color: #fff; font-family: Arial; display: block; font-size: .85em; padding: 10px; }

Retrieved from "http://2014hs.igem.org/Template:Montgomery_Cougars_NJUSA/Common_CSS"