Difference between revisions of "Team:Harvard BioDesign"

Line 1: Line 1:
@import url("font-awesome.min.css");
+
<!--
@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,600");
+
 
+
/*
+
 
   Prologue by HTML5 UP
 
   Prologue by HTML5 UP
 
   html5up.net | @n33co
 
   html5up.net | @n33co
 
   Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 
   Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
+
-->
 
+
/* Reset */
+
 
+
  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%;
+
    vertical-align: baseline;
+
  }
+
 
+
  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
+
    display: block;
+
  }
+
 
+
#content {
+
  width: 100vw;
+
  border:none;
+
}
+
 
+
.curPage{
+
background: rgba(0, 0, 0, 0.15);
+
box-shadow: inset 0 0 0.25em 0 rgba(0, 0, 0, 0.125);
+
color: #fff;
+
}
+
 
+
  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;
+
    box-sizing: border-box;
+
  }
+
 
+
/* Containers */
+
 
+
  .container {
+
    margin-left: auto;
+
    margin-right: auto;
+
  }
+
 
+
  .container.\31 25\25 {
+
    width: 100%;
+
    max-width: 1750px;
+
    min-width: 1400px;
+
  }
+
 
+
  .container.\37 5\25 {
+
    width: 1050px;
+
  }
+
 
+
  .container.\35 0\25 {
+
    width: 700px;
+
  }
+
 
+
  .container.\32 5\25 {
+
    width: 350px;
+
  }
+
 
+
  .container {
+
    width: 1400px;
+
  }
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1880px) {
+
 
+
    .container.\31 25\25 {
+
      width: 100%;
+
      max-width: 1500px;
+
      min-width: 1200px;
+
    }
+
 
+
    .container.\37 5\25 {
+
      width: 900px;
+
    }
+
 
+
    .container.\35 0\25 {
+
      width: 600px;
+
    }
+
 
+
    .container.\32 5\25 {
+
      width: 300px;
+
    }
+
 
+
    .container {
+
      width: 1200px;
+
    }
+
 
+
  }
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1620px) {
+
 
+
    .container.\31 25\25 {
+
      width: 100%;
+
      max-width: 1200px;
+
      min-width: 960px;
+
    }
+
 
+
    .container.\37 5\25 {
+
      width: 720px;
+
    }
+
 
+
    .container.\35 0\25 {
+
      width: 480px;
+
    }
+
 
+
    .container.\32 5\25 {
+
      width: 240px;
+
    }
+
 
+
    .container {
+
      width: 960px;
+
    }
+
 
+
  }
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1320px) {
+
 
+
    .container.\31 25\25 {
+
      width: 100%;
+
      max-width: 125%;
+
      min-width: 100%;
+
    }
+
 
+
    .container.\37 5\25 {
+
      width: 75%;
+
    }
+
 
+
    .container.\35 0\25 {
+
      width: 50%;
+
    }
+
 
+
    .container.\32 5\25 {
+
      width: 25%;
+
    }
+
 
+
    .container {
+
      width: 100%;
+
    }
+
 
+
  }
+
 
+
  @media screen and (max-width: 960px) {
+
 
+
    .container.\31 25\25 {
+
      width: 100%;
+
      max-width: 125%;
+
      min-width: 100%;
+
    }
+
 
+
    .container.\37 5\25 {
+
      width: 75%;
+
    }
+
 
+
    .container.\35 0\25 {
+
      width: 50%;
+
    }
+
 
+
    .container.\32 5\25 {
+
      width: 25%;
+
    }
+
 
+
    .container {
+
      width: 100%;
+
    }
+
  }
+
 
+
#top_menu_inside #bars_item {
+
left:100%;
+
}
+
 
+
#top_menu_inside #user_item {
+
margin-right:10%;
+
}
+
 
+
#top_menu_inside {
+
width:80%;
+
}
+
 
+
/*
+
  #top_menu_14 {
+
    background-color: transparent;
+
    color: transparent;
+
    border-bottom: none;}
+
 
+
  #top_menu_14:hover {
+
    background-color: #383838;
+
  }
+
 
+
  #top_menu_inside {
+
    border: none;
+
min-width: 360px;
+
    opacity: 1;
+
  }
+
 
+
  #top_menu_under{
+
    border: none;
+
  }
+
 
+
 
+
  #top_menu_inside:hover {
+
    opacity: 0;
+
  }*/
+
 
+
  /*Removes Wiki default template*/
+
  contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo, .printfooter {
+
    display:none;
+
  }
+
 
+
  @media screen and (max-width: 736px) {
+
 
+
    .container.\31 25\25 {
+
      width: 100%;
+
      max-width: 125%;
+
      min-width: 100%;
+
    }
+
 
+
    .container.\37 5\25 {
+
      width: 75%;
+
    }
+
 
+
    .container.\35 0\25 {
+
      width: 50%;
+
    }
+
 
+
    .container.\32 5\25 {
+
      width: 25%;
+
    }
+
 
+
    .container {
+
      width: 100% !important;
+
    }
+
 
+
  }
+
 
+
/* Grid */
+
 
+
  .row {
+
    border-bottom: solid 1px transparent;
+
    -moz-box-sizing: border-box;
+
    -webkit-box-sizing: border-box;
+
    box-sizing: border-box;
+
  }
+
 
+
  .row > * {
+
    float: left;
+
    -moz-box-sizing: border-box;
+
    -webkit-box-sizing: border-box;
+
    box-sizing: border-box;
+
  }
+
 
+
  .row:after, .row:before {
+
    content: '';
+
    display: block;
+
    clear: both;
+
    height: 0;
+
  }
+
 
+
  .row.uniform > * > :first-child {
+
    margin-top: 0;
+
  }
+
 
+
  .row.uniform > * > :last-child {
+
    margin-bottom: 0;
+
  }
+
 
+
  .row.\30 \25 > * {
+
    padding: 0px 0 0 0px;
+
  }
+
 
+
  .row.\30 \25 {
+
    margin: 0px 0 -1px 0px;
+
  }
+
 
+
  .row.uniform.\30 \25 > * {
+
    padding: 0px 0 0 0px;
+
  }
+
 
+
  .row.uniform.\30 \25 {
+
    margin: 0px 0 -1px 0px;
+
  }
+
 
+
  .row > * {
+
    padding: 40px 0 0 40px;
+
  }
+
 
+
  .row {
+
    margin: -40px 0 -1px -40px;
+
  }
+
 
+
  .row.uniform > * {
+
    padding: 40px 0 0 40px;
+
  }
+
 
+
  .row.uniform {
+
    margin: -40px 0 -1px -40px;
+
  }
+
 
+
  .row.\32 00\25 > * {
+
    padding: 80px 0 0 80px;
+
  }
+
 
+
  .row.\32 00\25 {
+
    margin: -80px 0 -1px -80px;
+
  }
+
 
+
  .row.uniform.\32 00\25 > * {
+
    padding: 80px 0 0 80px;
+
  }
+
 
+
  .row.uniform.\32 00\25 {
+
    margin: -80px 0 -1px -80px;
+
  }
+
 
+
  .row.\31 50\25 > * {
+
    padding: 60px 0 0 60px;
+
  }
+
 
+
  .row.\31 50\25 {
+
    margin: -60px 0 -1px -60px;
+
  }
+
 
+
  .row.uniform.\31 50\25 > * {
+
    padding: 60px 0 0 60px;
+
  }
+
 
+
  .row.uniform.\31 50\25 {
+
    margin: -60px 0 -1px -60px;
+
  }
+
 
+
  .row.\35 0\25 > * {
+
    padding: 20px 0 0 20px;
+
  }
+
 
+
  .row.\35 0\25 {
+
    margin: -20px 0 -1px -20px;
+
  }
+
 
+
  .row.uniform.\35 0\25 > * {
+
    padding: 20px 0 0 20px;
+
  }
+
 
+
  .row.uniform.\35 0\25 {
+
    margin: -20px 0 -1px -20px;
+
  }
+
 
+
  .row.\32 5\25 > * {
+
    padding: 10px 0 0 10px;
+
  }
+
 
+
  .row.\32 5\25 {
+
    margin: -10px 0 -1px -10px;
+
  }
+
 
+
  .row.uniform.\32 5\25 > * {
+
    padding: 10px 0 0 10px;
+
  }
+
 
+
  .row.uniform.\32 5\25 {
+
    margin: -10px 0 -1px -10px;
+
  }
+
 
+
  .\31 2u, .\31 2u\24 {
+
    width: 100%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\31 1u, .\31 1u\24 {
+
    width: 91.6666666667%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\31 0u, .\31 0u\24 {
+
    width: 83.3333333333%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\39 u, .\39 u\24 {
+
    width: 75%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\38 u, .\38 u\24 {
+
    width: 66.6666666667%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\37 u, .\37 u\24 {
+
    width: 58.3333333333%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\36 u, .\36 u\24 {
+
    width: 50%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\35 u, .\35 u\24 {
+
    width: 41.6666666667%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\34 u, .\34 u\24 {
+
    width: 33.3333333333%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\33 u, .\33 u\24 {
+
    width: 25%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\32 u, .\32 u\24 {
+
    width: 16.6666666667%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\31 u, .\31 u\24 {
+
    width: 8.3333333333%;
+
    clear: none;
+
    margin-left: 0;
+
  }
+
 
+
  .\31 2u\24 + *,
+
  .\31 1u\24 + *,
+
  .\31 0u\24 + *,
+
  .\39 u\24 + *,
+
  .\38 u\24 + *,
+
  .\37 u\24 + *,
+
  .\36 u\24 + *,
+
  .\35 u\24 + *,
+
  .\34 u\24 + *,
+
  .\33 u\24 + *,
+
  .\32 u\24 + *,
+
  .\31 u\24 + * {
+
    clear: left;
+
  }
+
 
+
  .\-11u {
+
    margin-left: 91.66667%;
+
  }
+
 
+
  .\-10u {
+
    margin-left: 83.33333%;
+
  }
+
 
+
  .\-9u {
+
    margin-left: 75%;
+
  }
+
 
+
  .\-8u {
+
    margin-left: 66.66667%;
+
  }
+
 
+
  .\-7u {
+
    margin-left: 58.33333%;
+
  }
+
 
+
  .\-6u {
+
    margin-left: 50%;
+
  }
+
 
+
  .\-5u {
+
    margin-left: 41.66667%;
+
  }
+
 
+
  .\-4u {
+
    margin-left: 33.33333%;
+
  }
+
 
+
  .\-3u {
+
    margin-left: 25%;
+
  }
+
 
+
  .\-2u {
+
    margin-left: 16.66667%;
+
  }
+
 
+
  .\-1u {
+
    margin-left: 8.33333%;
+
  }
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1880px) {
+
 
+
    .row > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.uniform > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row.uniform {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.\32 00\25 > * {
+
      padding: 80px 0 0 80px;
+
    }
+
 
+
    .row.\32 00\25 {
+
      margin: -80px 0 -1px -80px;
+
    }
+
 
+
    .row.uniform.\32 00\25 > * {
+
      padding: 80px 0 0 80px;
+
    }
+
 
+
    .row.uniform.\32 00\25 {
+
      margin: -80px 0 -1px -80px;
+
    }
+
 
+
    .row.\31 50\25 > * {
+
      padding: 60px 0 0 60px;
+
    }
+
 
+
    .row.\31 50\25 {
+
      margin: -60px 0 -1px -60px;
+
    }
+
 
+
    .row.uniform.\31 50\25 > * {
+
      padding: 60px 0 0 60px;
+
    }
+
 
+
    .row.uniform.\31 50\25 {
+
      margin: -60px 0 -1px -60px;
+
    }
+
 
+
    .row.\35 0\25 > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row.\35 0\25 {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.uniform.\35 0\25 > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row.uniform.\35 0\25 {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.\32 5\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.\32 5\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .row.uniform.\32 5\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.uniform.\32 5\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .\31 2u\28wide\29, .\31 2u\24\28wide\29 {
+
      width: 100%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 1u\28wide\29, .\31 1u\24\28wide\29 {
+
      width: 91.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 0u\28wide\29, .\31 0u\24\28wide\29 {
+
      width: 83.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\39 u\28wide\29, .\39 u\24\28wide\29 {
+
      width: 75%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\38 u\28wide\29, .\38 u\24\28wide\29 {
+
      width: 66.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\37 u\28wide\29, .\37 u\24\28wide\29 {
+
      width: 58.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\36 u\28wide\29, .\36 u\24\28wide\29 {
+
      width: 50%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\35 u\28wide\29, .\35 u\24\28wide\29 {
+
      width: 41.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\34 u\28wide\29, .\34 u\24\28wide\29 {
+
      width: 33.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\33 u\28wide\29, .\33 u\24\28wide\29 {
+
      width: 25%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\32 u\28wide\29, .\32 u\24\28wide\29 {
+
      width: 16.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 u\28wide\29, .\31 u\24\28wide\29 {
+
      width: 8.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 2u\24\28wide\29 + *,
+
    .\31 1u\24\28wide\29 + *,
+
    .\31 0u\24\28wide\29 + *,
+
    .\39 u\24\28wide\29 + *,
+
    .\38 u\24\28wide\29 + *,
+
    .\37 u\24\28wide\29 + *,
+
    .\36 u\24\28wide\29 + *,
+
    .\35 u\24\28wide\29 + *,
+
    .\34 u\24\28wide\29 + *,
+
    .\33 u\24\28wide\29 + *,
+
    .\32 u\24\28wide\29 + *,
+
    .\31 u\24\28wide\29 + * {
+
      clear: left;
+
    }
+
 
+
    .\-11u\28wide\29 {
+
      margin-left: 91.66667%;
+
    }
+
 
+
    .\-10u\28wide\29 {
+
      margin-left: 83.33333%;
+
    }
+
 
+
    .\-9u\28wide\29 {
+
      margin-left: 75%;
+
    }
+
 
+
    .\-8u\28wide\29 {
+
      margin-left: 66.66667%;
+
    }
+
 
+
    .\-7u\28wide\29 {
+
      margin-left: 58.33333%;
+
    }
+
 
+
    .\-6u\28wide\29 {
+
      margin-left: 50%;
+
    }
+
 
+
    .\-5u\28wide\29 {
+
      margin-left: 41.66667%;
+
    }
+
 
+
    .\-4u\28wide\29 {
+
      margin-left: 33.33333%;
+
    }
+
 
+
    .\-3u\28wide\29 {
+
      margin-left: 25%;
+
    }
+
 
+
    .\-2u\28wide\29 {
+
      margin-left: 16.66667%;
+
    }
+
 
+
    .\-1u\28wide\29 {
+
      margin-left: 8.33333%;
+
    }
+
 
+
  }
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1620px) {
+
 
+
    .row > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.uniform > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row.uniform {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.\32 00\25 > * {
+
      padding: 80px 0 0 80px;
+
    }
+
 
+
    .row.\32 00\25 {
+
      margin: -80px 0 -1px -80px;
+
    }
+
 
+
    .row.uniform.\32 00\25 > * {
+
      padding: 80px 0 0 80px;
+
    }
+
 
+
    .row.uniform.\32 00\25 {
+
      margin: -80px 0 -1px -80px;
+
    }
+
 
+
    .row.\31 50\25 > * {
+
      padding: 60px 0 0 60px;
+
    }
+
 
+
    .row.\31 50\25 {
+
      margin: -60px 0 -1px -60px;
+
    }
+
 
+
    .row.uniform.\31 50\25 > * {
+
      padding: 60px 0 0 60px;
+
    }
+
 
+
    .row.uniform.\31 50\25 {
+
      margin: -60px 0 -1px -60px;
+
    }
+
 
+
    .row.\35 0\25 > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row.\35 0\25 {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.uniform.\35 0\25 > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row.uniform.\35 0\25 {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.\32 5\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.\32 5\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .row.uniform.\32 5\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.uniform.\32 5\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .\31 2u\28normal\29, .\31 2u\24\28normal\29 {
+
      width: 100%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 1u\28normal\29, .\31 1u\24\28normal\29 {
+
      width: 91.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 0u\28normal\29, .\31 0u\24\28normal\29 {
+
      width: 83.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\39 u\28normal\29, .\39 u\24\28normal\29 {
+
      width: 75%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\38 u\28normal\29, .\38 u\24\28normal\29 {
+
      width: 66.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\37 u\28normal\29, .\37 u\24\28normal\29 {
+
      width: 58.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\36 u\28normal\29, .\36 u\24\28normal\29 {
+
      width: 50%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\35 u\28normal\29, .\35 u\24\28normal\29 {
+
      width: 41.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\34 u\28normal\29, .\34 u\24\28normal\29 {
+
      width: 33.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\33 u\28normal\29, .\33 u\24\28normal\29 {
+
      width: 25%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\32 u\28normal\29, .\32 u\24\28normal\29 {
+
      width: 16.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 u\28normal\29, .\31 u\24\28normal\29 {
+
      width: 8.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 2u\24\28normal\29 + *,
+
    .\31 1u\24\28normal\29 + *,
+
    .\31 0u\24\28normal\29 + *,
+
    .\39 u\24\28normal\29 + *,
+
    .\38 u\24\28normal\29 + *,
+
    .\37 u\24\28normal\29 + *,
+
    .\36 u\24\28normal\29 + *,
+
    .\35 u\24\28normal\29 + *,
+
    .\34 u\24\28normal\29 + *,
+
    .\33 u\24\28normal\29 + *,
+
    .\32 u\24\28normal\29 + *,
+
    .\31 u\24\28normal\29 + * {
+
      clear: left;
+
    }
+
 
+
    .\-11u\28normal\29 {
+
      margin-left: 91.66667%;
+
    }
+
 
+
    .\-10u\28normal\29 {
+
      margin-left: 83.33333%;
+
    }
+
 
+
    .\-9u\28normal\29 {
+
      margin-left: 75%;
+
    }
+
 
+
    .\-8u\28normal\29 {
+
      margin-left: 66.66667%;
+
    }
+
 
+
    .\-7u\28normal\29 {
+
      margin-left: 58.33333%;
+
    }
+
 
+
    .\-6u\28normal\29 {
+
      margin-left: 50%;
+
    }
+
 
+
    .\-5u\28normal\29 {
+
      margin-left: 41.66667%;
+
    }
+
 
+
    .\-4u\28normal\29 {
+
      margin-left: 33.33333%;
+
    }
+
 
+
    .\-3u\28normal\29 {
+
      margin-left: 25%;
+
    }
+
 
+
    .\-2u\28normal\29 {
+
      margin-left: 16.66667%;
+
    }
+
 
+
    .\-1u\28normal\29 {
+
      margin-left: 8.33333%;
+
    }
+
 
+
  }
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1320px) {
+
 
+
    .row > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.uniform > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row.uniform {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.\32 00\25 > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row.\32 00\25 {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.uniform.\32 00\25 > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row.uniform.\32 00\25 {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.\31 50\25 > * {
+
      padding: 30px 0 0 30px;
+
    }
+
 
+
    .row.\31 50\25 {
+
      margin: -30px 0 -1px -30px;
+
    }
+
 
+
    .row.uniform.\31 50\25 > * {
+
      padding: 30px 0 0 30px;
+
    }
+
 
+
    .row.uniform.\31 50\25 {
+
      margin: -30px 0 -1px -30px;
+
    }
+
 
+
    .row.\35 0\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.\35 0\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .row.uniform.\35 0\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.uniform.\35 0\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .row.\32 5\25 > * {
+
      padding: 5px 0 0 5px;
+
    }
+
 
+
    .row.\32 5\25 {
+
      margin: -5px 0 -1px -5px;
+
    }
+
 
+
    .row.uniform.\32 5\25 > * {
+
      padding: 5px 0 0 5px;
+
    }
+
 
+
    .row.uniform.\32 5\25 {
+
      margin: -5px 0 -1px -5px;
+
    }
+
 
+
    .\31 2u\28narrow\29, .\31 2u\24\28narrow\29 {
+
      width: 100%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 1u\28narrow\29, .\31 1u\24\28narrow\29 {
+
      width: 91.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 0u\28narrow\29, .\31 0u\24\28narrow\29 {
+
      width: 83.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\39 u\28narrow\29, .\39 u\24\28narrow\29 {
+
      width: 75%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\38 u\28narrow\29, .\38 u\24\28narrow\29 {
+
      width: 66.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\37 u\28narrow\29, .\37 u\24\28narrow\29 {
+
      width: 58.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\36 u\28narrow\29, .\36 u\24\28narrow\29 {
+
      width: 50%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\35 u\28narrow\29, .\35 u\24\28narrow\29 {
+
      width: 41.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\34 u\28narrow\29, .\34 u\24\28narrow\29 {
+
      width: 33.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\33 u\28narrow\29, .\33 u\24\28narrow\29 {
+
      width: 25%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\32 u\28narrow\29, .\32 u\24\28narrow\29 {
+
      width: 16.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 u\28narrow\29, .\31 u\24\28narrow\29 {
+
      width: 8.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 2u\24\28narrow\29 + *,
+
    .\31 1u\24\28narrow\29 + *,
+
    .\31 0u\24\28narrow\29 + *,
+
    .\39 u\24\28narrow\29 + *,
+
    .\38 u\24\28narrow\29 + *,
+
    .\37 u\24\28narrow\29 + *,
+
    .\36 u\24\28narrow\29 + *,
+
    .\35 u\24\28narrow\29 + *,
+
    .\34 u\24\28narrow\29 + *,
+
    .\33 u\24\28narrow\29 + *,
+
    .\32 u\24\28narrow\29 + *,
+
    .\31 u\24\28narrow\29 + * {
+
      clear: left;
+
    }
+
 
+
    .\-11u\28narrow\29 {
+
      margin-left: 91.66667%;
+
    }
+
 
+
    .\-10u\28narrow\29 {
+
      margin-left: 83.33333%;
+
    }
+
 
+
    .\-9u\28narrow\29 {
+
      margin-left: 75%;
+
    }
+
 
+
    .\-8u\28narrow\29 {
+
      margin-left: 66.66667%;
+
    }
+
 
+
    .\-7u\28narrow\29 {
+
      margin-left: 58.33333%;
+
    }
+
 
+
    .\-6u\28narrow\29 {
+
      margin-left: 50%;
+
    }
+
 
+
    .\-5u\28narrow\29 {
+
      margin-left: 41.66667%;
+
    }
+
 
+
    .\-4u\28narrow\29 {
+
      margin-left: 33.33333%;
+
    }
+
 
+
    .\-3u\28narrow\29 {
+
      margin-left: 25%;
+
    }
+
 
+
    .\-2u\28narrow\29 {
+
      margin-left: 16.66667%;
+
    }
+
 
+
    .\-1u\28narrow\29 {
+
      margin-left: 8.33333%;
+
    }
+
 
+
  }
+
 
+
  @media screen and (max-width: 960px) {
+
 
+
    .row > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.uniform > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row.uniform {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.\32 00\25 > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row.\32 00\25 {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.uniform.\32 00\25 > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row.uniform.\32 00\25 {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.\31 50\25 > * {
+
      padding: 30px 0 0 30px;
+
    }
+
 
+
    .row.\31 50\25 {
+
      margin: -30px 0 -1px -30px;
+
    }
+
 
+
    .row.uniform.\31 50\25 > * {
+
      padding: 30px 0 0 30px;
+
    }
+
 
+
    .row.uniform.\31 50\25 {
+
      margin: -30px 0 -1px -30px;
+
    }
+
 
+
    .row.\35 0\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.\35 0\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .row.uniform.\35 0\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.uniform.\35 0\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .row.\32 5\25 > * {
+
      padding: 5px 0 0 5px;
+
    }
+
 
+
    .row.\32 5\25 {
+
      margin: -5px 0 -1px -5px;
+
    }
+
 
+
    .row.uniform.\32 5\25 > * {
+
      padding: 5px 0 0 5px;
+
    }
+
 
+
    .row.uniform.\32 5\25 {
+
      margin: -5px 0 -1px -5px;
+
    }
+
 
+
    .\31 2u\28narrower\29, .\31 2u\24\28narrower\29 {
+
      width: 100%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 1u\28narrower\29, .\31 1u\24\28narrower\29 {
+
      width: 91.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 0u\28narrower\29, .\31 0u\24\28narrower\29 {
+
      width: 83.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\39 u\28narrower\29, .\39 u\24\28narrower\29 {
+
      width: 75%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\38 u\28narrower\29, .\38 u\24\28narrower\29 {
+
      width: 66.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\37 u\28narrower\29, .\37 u\24\28narrower\29 {
+
      width: 58.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\36 u\28narrower\29, .\36 u\24\28narrower\29 {
+
      width: 50%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\35 u\28narrower\29, .\35 u\24\28narrower\29 {
+
      width: 41.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\34 u\28narrower\29, .\34 u\24\28narrower\29 {
+
      width: 33.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\33 u\28narrower\29, .\33 u\24\28narrower\29 {
+
      width: 25%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\32 u\28narrower\29, .\32 u\24\28narrower\29 {
+
      width: 16.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 u\28narrower\29, .\31 u\24\28narrower\29 {
+
      width: 8.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 2u\24\28narrower\29 + *,
+
    .\31 1u\24\28narrower\29 + *,
+
    .\31 0u\24\28narrower\29 + *,
+
    .\39 u\24\28narrower\29 + *,
+
    .\38 u\24\28narrower\29 + *,
+
    .\37 u\24\28narrower\29 + *,
+
    .\36 u\24\28narrower\29 + *,
+
    .\35 u\24\28narrower\29 + *,
+
    .\34 u\24\28narrower\29 + *,
+
    .\33 u\24\28narrower\29 + *,
+
    .\32 u\24\28narrower\29 + *,
+
    .\31 u\24\28narrower\29 + * {
+
      clear: left;
+
    }
+
 
+
    .\-11u\28narrower\29 {
+
      margin-left: 91.66667%;
+
    }
+
 
+
    .\-10u\28narrower\29 {
+
      margin-left: 83.33333%;
+
    }
+
 
+
    .\-9u\28narrower\29 {
+
      margin-left: 75%;
+
    }
+
 
+
    .\-8u\28narrower\29 {
+
      margin-left: 66.66667%;
+
    }
+
 
+
    .\-7u\28narrower\29 {
+
      margin-left: 58.33333%;
+
    }
+
 
+
    .\-6u\28narrower\29 {
+
      margin-left: 50%;
+
    }
+
 
+
    .\-5u\28narrower\29 {
+
      margin-left: 41.66667%;
+
    }
+
 
+
    .\-4u\28narrower\29 {
+
      margin-left: 33.33333%;
+
    }
+
 
+
    .\-3u\28narrower\29 {
+
      margin-left: 25%;
+
    }
+
 
+
    .\-2u\28narrower\29 {
+
      margin-left: 16.66667%;
+
    }
+
 
+
    .\-1u\28narrower\29 {
+
      margin-left: 8.33333%;
+
    }
+
 
+
  }
+
 
+
  @media screen and (max-width: 736px) {
+
 
+
    .row > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.uniform > * {
+
      padding: 20px 0 0 20px;
+
    }
+
 
+
    .row.uniform {
+
      margin: -20px 0 -1px -20px;
+
    }
+
 
+
    .row.\32 00\25 > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row.\32 00\25 {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.uniform.\32 00\25 > * {
+
      padding: 40px 0 0 40px;
+
    }
+
 
+
    .row.uniform.\32 00\25 {
+
      margin: -40px 0 -1px -40px;
+
    }
+
 
+
    .row.\31 50\25 > * {
+
      padding: 30px 0 0 30px;
+
    }
+
 
+
    .row.\31 50\25 {
+
      margin: -30px 0 -1px -30px;
+
    }
+
 
+
    .row.uniform.\31 50\25 > * {
+
      padding: 30px 0 0 30px;
+
    }
+
 
+
    .row.uniform.\31 50\25 {
+
      margin: -30px 0 -1px -30px;
+
    }
+
 
+
    .row.\35 0\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.\35 0\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .row.uniform.\35 0\25 > * {
+
      padding: 10px 0 0 10px;
+
    }
+
 
+
    .row.uniform.\35 0\25 {
+
      margin: -10px 0 -1px -10px;
+
    }
+
 
+
    .row.\32 5\25 > * {
+
      padding: 5px 0 0 5px;
+
    }
+
 
+
    .row.\32 5\25 {
+
      margin: -5px 0 -1px -5px;
+
    }
+
 
+
    .row.uniform.\32 5\25 > * {
+
      padding: 5px 0 0 5px;
+
    }
+
 
+
    .row.uniform.\32 5\25 {
+
      margin: -5px 0 -1px -5px;
+
    }
+
 
+
    .\31 2u\28mobile\29, .\31 2u\24\28mobile\29 {
+
      width: 100%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 1u\28mobile\29, .\31 1u\24\28mobile\29 {
+
      width: 91.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 0u\28mobile\29, .\31 0u\24\28mobile\29 {
+
      width: 83.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\39 u\28mobile\29, .\39 u\24\28mobile\29 {
+
      width: 75%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\38 u\28mobile\29, .\38 u\24\28mobile\29 {
+
      width: 66.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\37 u\28mobile\29, .\37 u\24\28mobile\29 {
+
      width: 58.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\36 u\28mobile\29, .\36 u\24\28mobile\29 {
+
      width: 50%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\35 u\28mobile\29, .\35 u\24\28mobile\29 {
+
      width: 41.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\34 u\28mobile\29, .\34 u\24\28mobile\29 {
+
      width: 33.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\33 u\28mobile\29, .\33 u\24\28mobile\29 {
+
      width: 25%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\32 u\28mobile\29, .\32 u\24\28mobile\29 {
+
      width: 16.6666666667%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 u\28mobile\29, .\31 u\24\28mobile\29 {
+
      width: 8.3333333333%;
+
      clear: none;
+
      margin-left: 0;
+
    }
+
 
+
    .\31 2u\24\28mobile\29 + *,
+
    .\31 1u\24\28mobile\29 + *,
+
    .\31 0u\24\28mobile\29 + *,
+
    .\39 u\24\28mobile\29 + *,
+
    .\38 u\24\28mobile\29 + *,
+
    .\37 u\24\28mobile\29 + *,
+
    .\36 u\24\28mobile\29 + *,
+
    .\35 u\24\28mobile\29 + *,
+
    .\34 u\24\28mobile\29 + *,
+
    .\33 u\24\28mobile\29 + *,
+
    .\32 u\24\28mobile\29 + *,
+
    .\31 u\24\28mobile\29 + * {
+
      clear: left;
+
    }
+
 
+
    .\-11u\28mobile\29 {
+
      margin-left: 91.66667%;
+
    }
+
 
+
    .\-10u\28mobile\29 {
+
      margin-left: 83.33333%;
+
    }
+
 
+
    .\-9u\28mobile\29 {
+
      margin-left: 75%;
+
    }
+
 
+
    .\-8u\28mobile\29 {
+
      margin-left: 66.66667%;
+
    }
+
 
+
    .\-7u\28mobile\29 {
+
      margin-left: 58.33333%;
+
    }
+
 
+
    .\-6u\28mobile\29 {
+
      margin-left: 50%;
+
    }
+
 
+
    .\-5u\28mobile\29 {
+
      margin-left: 41.66667%;
+
    }
+
 
+
    .\-4u\28mobile\29 {
+
      margin-left: 33.33333%;
+
    }
+
 
+
    .\-3u\28mobile\29 {
+
      margin-left: 25%;
+
    }
+
 
+
    .\-2u\28mobile\29 {
+
      margin-left: 16.66667%;
+
    }
+
 
+
    .\-1u\28mobile\29 {
+
      margin-left: 8.33333%;
+
    }
+
 
+
  }
+
 
+
/* Basic */
+
 
+
  body {
+
    background: #fff;
+
    font-family: 'Source Sans Pro', sans-serif;
+
    font-size: 19pt;
+
    font-weight: 300;
+
    line-height: .7em;
+
    color: #888;
+
    overflow: hidden;
+
  }
+
 
+
    body.is-loading * {
+
      -moz-transition: none !important;
+
      -webkit-transition: none !important;
+
      -ms-transition: none !important;
+
      transition: none !important;
+
      -moz-animation: none !important;
+
      -webkit-animation: none !important;
+
      -ms-animation: none !important;
+
      animation: none !important;
+
    }
+
 
+
  input, textarea, select {
+
    font-family: 'Source Sans Pro', sans-serif;
+
    font-size: 19pt;
+
    font-weight: 300;
+
    line-height: 1.75em;
+
    color: #888;
+
  }
+
 
+
  h1, h2, h3, h4, h5, h6 {
+
    font-weight: 300;
+
    color: #666;
+
    line-height: 1.5em;
+
  }
+
 
+
  h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
+
    color: inherit;
+
    text-decoration: none;
+
  }
+
 
+
    h1 a strong, h2 a strong, h3 a strong, h4 a strong, h5 a strong, h6 a strong {
+
      color: #333;
+
    }
+
 
+
  h2 {
+
    font-size: 2em;
+
    letter-spacing: -1px;
+
  }
+
 
+
    h2.alt {
+
      color: #666;
+
    }
+
 
+
      h2.alt strong {
+
        color: #444;
+
      }
+
 
+
  h3 {
+
    font-size: 1.5em;
+
  }
+
 
+
  header {
+
    margin: 0 0 2em 0;
+
  }
+
 
+
    header > p {
+
      margin: 1em 0 0 0;
+
    }
+
 
+
  footer {
+
    margin: 2em 0 0 0;
+
  }
+
 
+
  strong, b {
+
    font-weight: 300;
+
    color: #333;
+
  }
+
 
+
  em, i {
+
    font-style: italic;
+
  }
+
 
+
  a {
+
    text-decoration: none;
+
    color: inherit;
+
    border-bottom: 0;
+
    outline: 0;
+
  }
+
 
+
    a:hover {
+
      color: #E27689;
+
      border-bottom-color: rgba(255, 255, 255, 0);
+
    }
+
 
+
  sub {
+
    position: relative;
+
    top: 0.5em;
+
    font-size: 0.8em;
+
  }
+
 
+
  sup {
+
    position: relative;
+
    top: -0.5em;
+
    font-size: 0.8em;
+
  }
+
 
+
  hr {
+
    border: 0;
+
    border-top: solid 1px #ddd;
+
  }
+
 
+
  blockquote {
+
    border-left: solid 0.5em #ddd;
+
    padding: 1em 0 1em 2em;
+
    font-style: italic;
+
  }
+
 
+
  p, ul, ol, dl, table {
+
    margin-bottom: 0em;
+
  }
+
 
+
  br.clear {
+
    clear: both;
+
  }
+
 
+
/* Sections/Article */
+
 
+
  section, article {
+
    margin-bottom: 3em;
+
  }
+
 
+
    section > :last-child,
+
    section > .container, section:last-child, article > :last-child,
+
    article > .container, article:last-child {
+
      margin-bottom: 0;
+
    }
+
 
+
    .row > section, .row > article {
+
      margin-bottom: 0;
+
    }
+
 
+
/* Image */
+
 
+
  .image {
+
    display: inline-block;
+
    border: 0;
+
  }
+
 
+
    .image img {
+
      display: block;
+
      width: 100%;
+
    }
+
 
+
    .image.avatar48 {
+
      width: 48px;
+
      height: 48px;
+
      background: #f00;
+
    }
+
 
+
      .image.avatar48 img {
+
        width: 48px;
+
        height: 48px;
+
      }
+
 
+
    .image.fit {
+
      display: block;
+
      width: 100%;
+
    }
+
 
+
    .image.featured {
+
      display: block;
+
      width: 100%;
+
      margin: 0 0 2em 0;
+
    }
+
 
+
    .image.left {
+
      float: left;
+
      margin: 0 2em 2em 0;
+
    }
+
 
+
    .image.right {
+
      float: right;
+
      margin: 0 0 2em 2em;
+
    }
+
 
+
    .image.centered {
+
      display: block;
+
      margin: 0 0 2em 0;
+
    }
+
 
+
      .image.centered img {
+
        margin: 0 auto;
+
        width: auto;
+
      }
+
 
+
/* List */
+
 
+
  ul.default {
+
    list-style: disc;
+
    padding-left: 1em;
+
  }
+
 
+
    ul.default li {
+
      padding-left: 0.5em;
+
    }
+
 
+
  ul.icons {
+
    cursor: default;
+
  }
+
 
+
    ul.icons li {
+
      display: inline-block;
+
    }
+
 
+
    ul.icons a {
+
      display: inline-block;
+
      width: 2em;
+
      height: 2em;
+
      line-height: 2em;
+
      text-align: center;
+
      border: 0;
+
    }
+
 
+
  ol.default {
+
    list-style: decimal;
+
    padding-left: 1.25em;
+
  }
+
 
+
    ol.default li {
+
      padding-left: 0.25em;
+
    }
+
 
+
/* Form */
+
 
+
  form label {
+
    display: block;
+
    text-align: left;
+
    margin-bottom: 0.5em;
+
  }
+
 
+
  form input[type="text"],
+
  form input[type="email"],
+
  form input[type="password"],
+
  form select,
+
  form textarea {
+
    position: relative;
+
    -webkit-appearance: none;
+
    display: block;
+
    border: 0;
+
    outline: 0;
+
    background: #fff;
+
    background: rgba(255, 255, 255, 0.75);
+
    width: 100%;
+
    border-radius: 0.35em;
+
    padding: 0.75em 1em 0.75em 1em;
+
    box-shadow: inset 0 0.1em 0.1em 0 rgba(0, 0, 0, 0.05);
+
    border: solid 1px rgba(0, 0, 0, 0.15);
+
    -moz-transition: all 0.35s ease-in-out;
+
    -webkit-transition: all 0.35s ease-in-out;
+
    -ms-transition: all 0.35s ease-in-out;
+
    transition: all 0.35s ease-in-out;
+
  }
+
 
+
    form input[type="text"]:focus,
+
    form input[type="email"]:focus,
+
    form input[type="password"]:focus,
+
    form select:focus,
+
    form textarea:focus {
+
      box-shadow: 0 0 2px 1px #8ebebc;
+
      background: #fff;
+
    }
+
 
+
  form input[type="text"],
+
  form input[type="email"],
+
  form input[type="password"],
+
  form select {
+
    line-height: 1.25em;
+
  }
+
 
+
  form textarea {
+
    min-height: 14em;
+
  }
+
 
+
  form .formerize-placeholder {
+
    color: #555 !important;
+
  }
+
 
+
  form ::-webkit-input-placeholder {
+
    color: #555 !important;
+
  }
+
 
+
  form :-moz-placeholder {
+
    color: #555 !important;
+
  }
+
 
+
  form ::-moz-placeholder {
+
    color: #555 !important;
+
  }
+
 
+
  form :-ms-input-placeholder {
+
    color: #555 !important;
+
  }
+
 
+
  form ::-moz-focus-inner {
+
    border: 0;
+
  }
+
 
+
/* Table */
+
 
+
  table {
+
    width: 100%;
+
  }
+
 
+
    table.default {
+
      width: 100%;
+
      text-align: left;
+
    }
+
 
+
      table.default tbody tr:nth-child(2n+2) {
+
        background: #f4f4f4;
+
      }
+
 
+
      table.default td {
+
        padding: 0.5em 1em 0.5em 1em;
+
      }
+
 
+
      table.default th {
+
        text-align: left;
+
        padding: 0.5em 1em 0.5em 1em;
+
        color: #fff;
+
        background: #222729 url("images/overlay.png");
+
      }
+
 
+
      table.default thead {
+
        background: #444;
+
        color: #fff;
+
      }
+
 
+
      table.default tfoot {
+
        background: #eee;
+
      }
+
 
+
/* Wrap for Spinny Button */
+
 
+
  .wrap{
+
    position: relative;
+
    width: 80px;
+
    height: 80px;
+
    margin: 15px auto 15px auto;
+
  }
+
 
+
/* Circle for Spinny Button*/
+
 
+
  .circle{
+
    position: relative;
+
    text-align: center;
+
    border-radius: 0px;
+
    right: 20px;
+
    top: 15px;
+
    width: 120px;
+
    height: 120px;
+
    z-index: 1;
+
    }
+
 
+
/* Button */
+
 
+
  input[type="button"],
+
  input[type="submit"],
+
  input[type="reset"],
+
  button,
+
  .button {
+
    /* For Spinny Button: */
+
    background-color: #fff; /***/
+
    outline: none;
+
    font-weight: 600;
+
    position:absolute; /**/
+
    cursor: pointer;
+
    padding: 0;
+
    border: none;
+
    height: 100px;
+
    width: 100px;
+
    left: -10px;
+
    top: 25px;
+
    border-radius: 100px;
+
    z-index: 2;
+
    /* For Rectangular Button:
+
    position: relative;
+
    display: inline-block;
+
    border-radius: 0.35em;
+
    color: #fff !important;
+
    text-decoration: none;
+
    padding: 0.75em 2.5em 0.75em 2.5em;
+
    background-color: #8ebebc;
+
    border: 0;
+
    cursor: pointer;
+
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15)), url("images/overlay.png");
+
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15)), url("images/overlay.png");
+
    background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15)), url("images/overlay.png");
+
    background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15)), url("images/overlay.png");
+
    -moz-transition: background-color 0.35s ease-in-out;
+
    -webkit-transition: background-color 0.35s ease-in-out;
+
    -ms-transition: background-color 0.35s ease-in-out;
+
    transition: background-color 0.35s ease-in-out;
+
    */
+
  }
+
 
+
    /* For Rectangular Button:
+
    input[type="button"]:hover,
+
    input[type="submit"]:hover,
+
    input[type="reset"]:hover,
+
    button:hover,
+
    .button:hover {
+
      background-color: #9ececc;
+
      text-decoration: none;
+
    }
+
    */
+
 
+
    input[type="button"]:active,
+
    input[type="submit"]:active,
+
    input[type="reset"]:active,
+
    button:active,
+
    .button:active {
+
      /* For Spinny Button: */
+
      transform: translate(0, 1px);
+
      height: 98px;
+
      /*box-shadow: 0px 1px 0 0 rgb(190,190,190) inset;*/
+
      /* For Rectangular Button:
+
      background-color: #7eaeac;
+
      */
+
    }
+
 
+
    /* Hover graphix stuff for Spinny Button */
+
    .button:hover + .circle, .button:active + .circle {
+
      animation: rotator linear .4s infinite;
+
    }
+
 
+
    @keyframes rotator{
+
      from{ transform: rotate(0deg); }
+
      to{ transform: rotate(360deg); }
+
    }
+
 
+
    .angled{
+
      background-image: linear-gradient(45deg,
+
                transparent 0%,
+
                transparent 30%,
+
                rgb(20,190,235) 30%,
+
                rgb(20,190,235) 70%,
+
                transparent 70%,
+
                transparent 100%);
+
      }
+
    }
+
    /* Graphix end here */
+
 
+
/* Item */
+
 
+
  .item {
+
    box-shadow: 0 0.05em 0.15em 0 rgba(0, 0, 0, 0.05);
+
    margin-bottom: 40px;
+
  }
+
 
+
    .item header {
+
      background: #fff;
+
      margin: 0;
+
      padding: 1em 0 1em 0;
+
      font-size: 0.8em;
+
    }
+
 
+
      .item header h3 {
+
        font-size: 1em;
+
      }
+
 
+
/* Icons */
+
 
+
  .icon {
+
    text-decoration: none;
+
  }
+
 
+
    .icon: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;
+
    }
+
 
+
    .icon > .label {
+
      display: none;
+
    }
+
 
+
/* Header */
+
 
+
  #header {
+
    position: fixed;
+
    top: 0;
+
    left: 0;
+
    width: 375px;
+
    height: 100%;
+
    color: #fff;
+
    background: #222629 url("images/overlay.png");
+
    box-shadow: inset -0.25em 0 0.25em 0 rgba(0, 0, 0, 0.1);
+
    text-align: right;
+
  }
+
 
+
    #header .top {
+
      position: absolute;
+
      left: 0;
+
      top: 0;
+
      width: 100%;
+
    }
+
 
+
    #header .bottom {
+
      position: absolute;
+
      left: 0;
+
      bottom: 0;
+
      width: 100%;
+
    }
+
 
+
    #header .icons {
+
      font-size: 0.8em;
+
      margin: 0 0 1em 0;
+
      text-align: center;
+
    }
+
 
+
      #header .icons a {
+
        color: #41484c;
+
        -moz-transition: color 0.35s ease-in-out;
+
        -webkit-transition: color 0.35s ease-in-out;
+
        -ms-transition: color 0.35s ease-in-out;
+
        transition: color 0.35s ease-in-out;
+
      }
+
 
+
        #header .icons a:hover {
+
          color: #fff;
+
        }
+
 
+
  #logo {
+
    position: relative;
+
    margin: 1.75em 1.5em 1.5em 1.5em;
+
    min-height: 48px;
+
    cursor: default;
+
  }
+
 
+
    #logo h1 {
+
      position: relative;
+
      color: #fff;
+
      font-weight: 600;
+
      font-size: 1em;
+
      line-height: 1em;
+
    }
+
 
+
    #logo p {
+
      position: relative;
+
      display: block;
+
      font-size: 0.6em;
+
      color: rgba(255, 255, 255, 0.5);
+
      line-height: 1.25em;
+
      margin: 0.5em 0 0 0;
+
    }
+
 
+
    #logo .image {
+
      position: absolute;
+
      left: 0;
+
      top: 0;
+
    }
+
 
+
  #nav ul li a {
+
    display: block;
+
    padding: 0.5em 1.5em 0.5em 1.5em;
+
    color: rgba(255, 255, 255, 0.5);
+
    text-decoration: none;
+
    outline: 0;
+
    border: 0;
+
    -moz-transition: none;
+
    -webkit-transition: none;
+
    -ms-transition: none;
+
    transition: none;
+
    -moz-transition: background-color 0.20s ease-in-out;
+
    -webkit-transition: background-color 0.20s ease-in-out;
+
    -ms-transition: background-color 0.20s ease-in-out;
+
    transition: background-color 0.20s ease-in-out;
+
  }
+
 
+
    #nav ul li a:hover{
+
      background-color: #318CE7;
+
      color: #000000;
+
    }
+
 
+
    #nav ul li a span {
+
      position: relative;
+
      display: block;
+
      font-size: 0.9em;
+
    }
+
 
+
      #nav ul li a span:before {
+
        position: absolute;
+
        left: 0;
+
        color: #41484c;
+
        text-align: center;
+
        width: 1.25em;
+
        line-height: 1.75em;
+
      }
+
 
+
    #nav ul li a.active {
+
      background: rgba(0, 0, 0, 0.15);
+
      box-shadow: inset 0 0 0.25em 0 rgba(0, 0, 0, 0.125);
+
      color: #fff;
+
    }
+
 
+
      #nav ul li a.active span:before {
+
        color: #e27689;
+
      }
+
 
+
      #nav h4 {
+
        padding: 0.5em 2.5em 0.5em 0em;
+
        color: #318CE7;
+
      }
+
 
+
/* Footer */
+
 
+
  #footer {
+
    margin-left: 75px;
+
    text-align: center;
+
    background-color: #dce3e2;
+
    padding: 3em 0 4em 0;
+
    box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.05), inset 0 0.1em 0.1em 0 rgba(0, 0, 0, 0.025);
+
    font-size: 0.8em;
+
  }
+
 
+
    #footer .copyright {
+
      cursor: default;
+
      margin: 0;
+
    }
+
 
+
      #footer .copyright li {
+
        display: inline-block;
+
        line-height: 1em;
+
        border-left: solid 1px rgba(128, 128, 128, 0.35);
+
        padding: 0 0 0 0.5em;
+
        margin: 0 0 0 0.5em;
+
      }
+
 
+
        #footer .copyright li:first-child {
+
          border-left: 0;
+
          padding-left: 0;
+
          margin-left: 0;
+
        }
+
 
+
/* Main */
+
 
+
  #main {
+
    margin-left: 75px;
+
  }
+
 
+
    #main > section {
+
      margin: 0;
+
      overflow: hidden;
+
      padding: 4em 0;
+
      box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.05), inset 0 0.1em 0.1em 0 rgba(0, 0, 0, 0.025);
+
      text-align: center;
+
      background-image: url("images/overlay.png");
+
    }
+
 
+
      #main > section.dark {
+
        color: #ddd;
+
        color: rgba(255, 255, 255, 0.75);
+
      }
+
 
+
        #main > section.dark h2, #main > section.dark h3, #main > section.dark h4, #main > section.dark h5, #main > section.dark h6 {
+
          color: inherit;
+
        }
+
 
+
        #main > section.dark strong {
+
          color: #fff;
+
          border-color: inherit;
+
        }
+
 
+
        #main > section.dark a {
+
          color: #fff;
+
          border-color: inherit;
+
        }
+
 
+
          #main > section.dark a:hover {
+
            border-bottom-color: rgba(255, 255, 255, 0);
+
          }
+
 
+
      #main > section.cover {
+
        padding: 6em 0;
+
        background-size: cover;
+
        background-position: center center;
+
      }
+
/*
+
A5DEFF
+
9DE3E8
+
B9FFEE
+
9DE8BD
+
ADFFB7
+
 
+
CDFCFF
+
C1E8DE
+
E1FFEE
+
C1E8C5
+
E0FFD5
+
*/
+
 
+
      #main > section.one {
+
        background-color: #9DE8BD;
+
        /*background-image: url("../../images/banner.jpg");*/
+
      }
+
 
+
      #main > section.two {
+
        background-color: #C1E8C5;
+
      }
+
 
+
      #main > section.three {
+
        background-color: #A5DEFF;
+
      }
+
 
+
      #main > section.four {
+
        background-color: #CDFCFF;
+
      }
+
 
+
      #main > section.five {
+
        background-color: #ADFFB7;
+
      }
+
 
+
      #main > section.six {
+
        background-color: #E0FFD5;
+
      }
+
 
+
      #main > section.seven {
+
        background-color: #B9FFEE;
+
      }
+
 
+
      #main > section.eight {
+
        background-color: #E1FFEE;
+
      }
+
 
+
      #main > section.nine {
+
        background-color: #9DE3E8;
+
      }
+
 
+
      #main > section.ten {
+
        background-color: #C1E8DE;
+
      }
+
 
+
/* Wide */
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1880px) {
+
 
+
    /* Basic */
+
 
+
      body, input, textarea, select {
+
        font-size: 17pt;
+
      }
+
 
+
    /* Header */
+
 
+
      #header {
+
        width: 300px;
+
      }
+
 
+
    /* Footer */
+
 
+
      #footer {
+
        margin-left: 300px;
+
      }
+
 
+
  }
+
 
+
/* Normal */
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1620px) {
+
 
+
    /* Main */
+
 
+
      #main > section {
+
        padding: 3em 0;
+
      }
+
 
+
      #main section.cover {
+
        padding: 5em 0;
+
      }
+
 
+
  }
+
 
+
/* Narrow */
+
 
+
  @media screen and (min-width: 961px) and (max-width: 1320px) {
+
 
+
    /* Basic */
+
 
+
      body, input, textarea, select {
+
        font-size: 16pt;
+
      }
+
 
+
      .container {
+
        padding: 0 2em 0 2em;
+
      }
+
 
+
    /* List */
+
 
+
      ul.icons li a {
+
        width: 1.75em;
+
      }
+
 
+
    /* Item */
+
 
+
      .item {
+
        margin-bottom: 20px;
+
      }
+
 
+
    /* Header */
+
 
+
      #header {
+
        width: 20%;
+
      }
+
 
+
      #logo .image {
+
        position: relative;
+
        margin: 0 0 0.5em 0;
+
      }
+
 
+
      #nav ul li a {
+
        font-size: 0.8em;
+
        padding-top: 0.5em;
+
        padding-bottom: 0.5em;
+
      }
+
 
+
        #nav ul li a span {
+
          /*padding-right: 2.25em;*/
+
        }
+
 
+
          #nav ul li a span:before {
+
            left: 100%;
+
            margin-left: -1.25em;
+
            line-height: 2.25em;
+
          }
+
 
+
    /* Footer */
+
 
+
      #footer {
+
        margin-left: 20%;
+
      }
+
 
+
    /* Main */
+
 
+
      #main {
+
        margin-left: 20%;
+
      }
+
 
+
  }
+
 
+
/* Narrower */
+
 
+
  #headerToggle {
+
    display: none;
+
  }
+
 
+
  @media screen and (max-width: 1880px) {
+
 
+
    /* Basic */
+
 
+
      html, body {
+
        overflow-x: hidden;
+
      }
+
 
+
      body, input, textarea, select {
+
        font-size: 16pt;
+
      }
+
 
+
      header br {
+
        display: none;
+
      }
+
 
+
      .container {
+
        padding: 0 2em 0 2em;
+
      }
+
 
+
    /* Item */
+
 
+
      .item {
+
        margin-bottom: 15px;
+
      }
+
 
+
    /* List */
+
 
+
      ul.icons a {
+
        width: 1.75em;
+
        font-size: 1.25em;
+
      }
+
 
+
    /* Header */
+
  
      #header {
+
<html>
        -moz-backface-visibility: hidden;
+
  <head>
        -webkit-backface-visibility: hidden;
+
    <title>Prologue by HTML5 UP</title>
        -ms-backface-visibility: hidden;
+
    <meta charset="utf-8" />
        backface-visibility: hidden;
+
    <meta name="viewport" content="width=device-width, initial-scale=1" />
        -moz-transform: translateX(-275px);
+
    <!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
        -webkit-transform: translateX(-275px);
+
    <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Harvard_BioDesign/CSS_Scroll0?action=raw&ctype=text/css" />
        -ms-transform: translateX(-275px);
+
    <!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
        transform: translateX(-275px);
+
    <!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
        -moz-transition: -moz-transform 0.5s ease;
+
        -webkit-transition: -webkit-transform 0.5s ease;
+
        -ms-transition: -ms-transform 0.5s ease;
+
        transition: transform 0.5s ease;
+
        display: block;
+
        height: 100%;
+
        left: 0;
+
        overflow: hidden; /**/
+
        position: fixed;
+
        top: 0;
+
        width: 275px;
+
        z-index: 10002;
+
        width: 275px;
+
        background: #222729 url("images/overlay.png");
+
        box-shadow: inset -0.25em 0 0.25em 0 rgba(0, 0, 0, 0.125);
+
      }
+
  
        #header .top {
 
          position: relative;
 
        }
 
  
        #header .inner {
+
  </head>
          height: 650px; /**/
+
  <body>
          overflow: auto; /**/
+
          margin:0px -300px 0px 0px;
+
          padding-right: 300px; /**/
+
        }
+
  
        #header .innertwo {
+
    <!-- header -->
          position: relative;
+
      <div id="header">
           padding: 0.5em 0em 0.5em 0em;
+
        <div class="inner">
          left: 20px;
+
        <div class="top">
        }
+
           <!-- Logo -->
 +
            <div id="logo">
 +
              <span class="harvardLogo"><a href="https://2015.igem.org/Team:Harvard_BioDesign"><img src="https://static.igem.org/mediawiki/2015/9/94/HarvardBioDesign2015Logo2.png"alt="Harvard Logo" style="width:212px;height:144px;"/></a>  </span>
 +
            <!-- <h1 id="title">Harvard BioDesign 2015</h1>-->
 +
              <p>NAME OF PROJECT</p>
 +
            </div><!-- #Logo -->
  
        #header .bottom {
+
           <!-- Nav -->
           border-top: solid 1px rgba(255, 255, 255, 0.05);
+
            <nav id="nav">
          box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.15);
+
              <!--
          padding-top: 2em;
+
          margin-top: 1em;
+
          position: relative;
+
        }
+
  
      #logo {
+
                Prologue's nav expects links in one of two formats:
        margin: 1.5em 1.25em 1.25em 1.25em;
+
      }
+
  
      #nav ul li a {
+
                1. Hash link (scrolls to a different section within the page)
        padding: 0.5em 1.25em 0.5em 1.25em;
+
      }
+
  
 +
                  <li><a href="#foobar" id="foobar-link" class="icon fa-whatever-icon-you-want skel-layers-ignoreHref"><span class="label">Foobar</span></a></li>
  
      #headerToggle {
+
                2. Standard link (sends the user to another page/site)
        -moz-backface-visibility: hidden;
+
        -webkit-backface-visibility: hidden;
+
        -ms-backface-visibility: hidden;
+
        backface-visibility: hidden;
+
        -moz-transition: -moz-transform 0.5s ease;
+
        -webkit-transition: -webkit-transform 0.5s ease;
+
        -ms-transition: -ms-transform 0.5s ease;
+
        transition: transform 0.5s ease;
+
        display: block;
+
        height: 2.25em;
+
        left: 0;
+
        position: fixed;
+
        top: 0;
+
        width: 3.25em;
+
        z-index: 10001;
+
      }
+
  
        #headerToggle .toggle {
+
                  <li><a href="http://foobar.tld" id="foobar-link" class="icon fa-whatever-icon-you-want"><span class="label">Foobar</span></a></li>
          position: absolute;
+
          left: 0;
+
          top: 0;
+
          width: 100%;
+
          height: 100%;
+
          outline: 0;
+
          border: 0;
+
        }
+
  
          #headerToggle .toggle:before {
+
              -->
            font-family: FontAwesome;
+
          <!-- Subsections -->
            text-decoration: none;
+
<h4> Content </h4>
            font-style: normal;
+
             <ul>
             font-weight: normal;
+
                <li><a href="#top" id="top-link" class="skel-layers-ignoreHref"><span class="icon fa-home">Welcome</span></a></li>
            -webkit-font-smoothing: antialiased;
+
                <li><a href="#overview" id="overview-link" class="skel-layers-ignoreHref"><span class="icon fa-th">Overview</span></a></li>
            -moz-osx-font-smoothing: grayscale;
+
                <li><a href="#sitemap" id="sitemap-link" class="skel-layers-ignoreHref"><span class="icon fa-user">Site Map</span></a></li>
            content: url(https://static.igem.org/mediawiki/2015/b/b2/Harvard2015FlaskMenu.png);
+
                <li><a href="#teampage" id="teampage-link" class="skel-layers-ignoreHref"><span class="icon fa-user">Team Page</span></a></li>
            color: #fff;
+
             </ul>
            font-size: 18px;
+
</nav>
            line-height: 2.25em;
+
</div><!--#top-->
             /*background: rgba(128, 136, 144, 0.5);*/
+
            border-radius: 0.1em;
+
            text-align: center;
+
            position: absolute;
+
            left: 0em;
+
            top: 2em;
+
            display: block;
+
            width: 0em;
+
            height: 2.25em;
+
          }
+
  
      body.header-visible #main {
+
        <div class="bottom">
         -moz-transform: translateX(275px);
+
         <nav id="nav">
        -webkit-transform: translateX(275px);
+
          <!-- Main Menu -->
         -ms-transform: translateX(275px);
+
         <h4><div class="innertwo">Main Pages</div></h4>
        transform: translateX(275px);
+
            <ul>
      }
+
                <li><a class="curPage" href="https://2015.igem.org/Team:Harvard_BioDesign">Home</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Team">Team</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Project">Project</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Results">Results</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Notebook">Notebook</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Parts">Parts</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Collaborations">Collaborations</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Attributions">Attributions</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Practices">Practices</a></li>
 +
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Safety">Safety</a></li>
 +
            </ul>
 +
          </nav>
  
      body.header-visible #headerToggle {
 
        -moz-transform: translateX(275px);
 
        -webkit-transform: translateX(275px);
 
        -ms-transform: translateX(275px);
 
        transform: translateX(275px);
 
      }
 
  
      body.header-visible #header {
 
        -moz-transform: translateX(0);
 
        -webkit-transform: translateX(0);
 
        -ms-transform: translateX(0);
 
        transform: translateX(0);
 
      }
 
  
    /* Footer */
+
          <!-- Social Icons -->
 +
            <ul class="icons">
  
      #footer {
+
              <li><a href="https://www.facebook.com/harvardigem2015" target="_blank">
        margin-left: 0;
+
                    <img src="https://static.igem.org/mediawiki/2015/e/ed/Harvard2015Facebookwhite.png"alt="Facebook Logo" style="width:51px;height:51px;"></a></li>
       }
+
              <li><a href="https://twitter.com/HarvardiGEM2015" target="_blank">
 +
                    <img src="https://static.igem.org/mediawiki/2015/6/64/Harvard2015Twitterlogowhite.png"alt="Twitter Logo" style="width:51px;height:51px;"></a></li>
 +
              <li><a href="mailto:harvardigem2015@gmail.com">
 +
                    <img src="https://static.igem.org/mediawiki/2015/9/98/Harvard2015Emaillogowhite.png" alt="Email Logo" style="width:51px;height:51px;"></a></li>
 +
            </ul>
 +
        </div><!--#bottom-->
 +
       </div><!--#inner-->
 +
      </div><!--#header-->
  
     /* Main */
+
     <!-- Main -->
 +
      <div id="main">
  
      #main {
+
         <!-- Intro -->
         -moz-backface-visibility: hidden;
+
          <section id="top" class="one">
        -webkit-backface-visibility: hidden;
+
            <div class="container">
        -ms-backface-visibility: hidden;
+
        backface-visibility: hidden;
+
        -moz-transition: -moz-transform 0.5s ease;
+
        -webkit-transition: -webkit-transform 0.5s ease;
+
        -ms-transition: -ms-transform 0.5s ease;
+
        transition: transform 0.5s ease;
+
        padding-bottom: 1px;
+
        margin-left: 0;
+
      }
+
  
        #main > section {
+
              <header>
          padding: 3em 0;
+
                <h2 class="alt">Welcome to the <strong>Harvard BioDesign 2015</strong> wiki!</h2><br/>
        }
+
                <p>The "official" place where flocculation happens and llamas are appreciated.</p>
 +
<img src="https://static.igem.org/mediawiki/2015/3/38/HarvardLlamaoutline.png" alt="Email Logo" style="width:127px;height:150px;">
 +
              </header>
  
        #main section.cover {
+
            Curious?<br/>
          padding: 4em 0;
+
              <div class="wrap">
        }
+
                <a href="#overview" class="button scrolly" style="text-decoration:none;background-color:#9DE8BD;color:#000">Start Here</a>
 +
                <div class="circle angled"></div>
 +
              </div>
  
  }
+
            </div>
 +
          </section>
  
/* Mobile */
+
        <!-- Overview -->
 +
          <section id="overview" class="two">
 +
            <div class="container">
  
  @media screen and (max-width: 736px) {
+
              <header>
 +
                <h2>About our project</h2>
 +
              </header>
  
    /* Basic */
+
              <p>Our team is engineering <i>E. coli</i> to bind to colon cancer cells through the use of their type I pili, which are hair-like appendages
 +
              that have an adhesive domain. Naturally, the strains in <i>E. coli</i> that produce pili bind to alpha-D-mannose, which can cause urinary tract infections.
 +
              However, our team is altering a non-harmful strain to produce pili using a modified Fim gene in order to localize the bacteria as a tool. For treatment of cancer,
 +
              once the bacteria are localized on the cells, the next step is to make them <E. coli</i> capable of producing a concentrated toxin or to administer a therapeutic.
 +
              Other potential applications for our <i>E. coli </i> include water pollution clean up through methods such as flocculation and targeting areas through GFP.</p>
 +
<!--
 +
              <div class="row">
 +
                <div class="4u 12u$(mobile)">
 +
                  <article class="item">
 +
                    <a href="#" class="image fit"><img src="images/pic02.jpg" alt="" /></a>
 +
                    <header>
 +
                      <h3>Ipsum Feugiat</h3>
 +
                    </header>
 +
                  </article>
 +
                  <article class="item">
 +
                    <a href="#" class="image fit"><img src="images/pic03.jpg" alt="" /></a>
 +
                    <header>
 +
                      <h3>Rhoncus Semper</h3>
 +
                    </header>
 +
                  </article>
 +
                </div>
 +
                <div class="4u 12u$(mobile)">
 +
                  <article class="item">
 +
                    <a href="#" class="image fit"><img src="images/pic04.jpg" alt="" /></a>
 +
                    <header>
 +
                      <h3>Magna Nullam</h3>
 +
                    </header>
 +
                  </article>
 +
                  <article class="item">
 +
                    <a href="#" class="image fit"><img src="images/pic05.jpg" alt="" /></a>
 +
                    <header>
 +
                      <h3>Natoque Vitae</h3>
 +
                    </header>
 +
                  </article>
 +
                </div>
 +
                <div class="4u$ 12u$(mobile)">
 +
                  <article class="item">
 +
                    <a href="#" class="image fit"><img src="images/pic06.jpg" alt="" /></a>
 +
                    <header>
 +
                      <h3>Dolor Penatibus</h3>
 +
                    </header>
 +
                  </article>
 +
                  <article class="item">
 +
                    <a href="#" class="image fit"><img src="images/pic07.jpg" alt="" /></a>
 +
                    <header>
 +
                      <h3>Orci Convallis</h3>
 +
                    </header>
 +
                  </article>
 +
                </div>
 +
              </div>-->
 +
              <div class="wrap">Feeling Lost?<br/>
 +
                <a href="#sitemap" class="button scrolly">Let's Navigate!</a>
 +
                <div class="circle angled"></div>
 +
              </div>
 +
            </div>
 +
          </section>
  
      body, input, textarea, select {
+
          <section id="sitemap" class="three">
        font-size: 14pt;
+
            <div class="container">
      }
+
  
      h2 {
+
              <header>
        font-size: 1.5em;
+
                <h2>How to navigate our site</h2>
        letter-spacing: 0;
+
              </header>
        font-weight: 300;
+
      }
+
  
      .container {
+
              <h6>Here is an easy guide to finding information on our wiki site. On the top of every page you will see a flask. When you click on it, it will open up the main navigation menu. The top section includes links of the different sections on the current page. The lower links are to switch to a new page. You can see all the pages by looking at our site map listed below.</h6>
        padding: 0 15px 0 15px;
+
              <br/>
      }
+
              <p><a href="https://static.igem.org/mediawiki/2015/c/ce/Harvard2015SiteMap.png" target="_blank">Click Here</a> to see our site map</p>
 +
            </div>
 +
  </section>
  
    /* List */
+
<section id="teampage" class="four"><div class="container"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Team" class="button scrolly">Team Page</a></div></section>
 +
<section id="top" class="five"><div class="container"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Project" class="button scrolly">Project Page</a></div></section>
 +
<section id="top" class="six"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Results" class="button scrolly">Results Page</a></section>
 +
<section id="top" class="seven"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Parts" class="button scrolly">Parts Page</a></section>
 +
<section id="top" class="eight"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Notebook" class="button scrolly">Notebook Page</a></section>
 +
<section id="top" class="nine"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Collaborations" class="button scrolly">Collaborations Page</a></section>
 +
<section id="top" class="ten"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Practices" class="button scrolly">Human Practices Page</a></section>
 +
<section id="top" class="one"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Safety" class="button scrolly">Safety Page</a></section>
 +
<section id="top" class="two"><a href="https://2015.igem.org/Team:Harvard_BioDesign/Attributions" class="button scrolly">Attributions Page</a></section>
  
      ul.icons a {
+
<!-- Contact -->
        width: 1.75em;
+
          <section id="contact" class="four">
        font-size: 1.5em;
+
            <div class="container">
      }
+
  
    /* Main */
+
              <header>
 +
                <h2>Contact</h2>
 +
              </header>
  
      #main > section {
+
              <p>Feel free to email us if you have any questions! (Starting September 18th)</p>
        padding: 2em 0;
+
      }
+
  
      #main section.cover {
+
              <form method="post" action="#">
        padding: 4em 0em;
+
                <div class="row">
      }
+
                  <div class="6u 12u$(mobile)"><input type="text" name="name" placeholder="Name" /></div>
 +
                  <div class="6u$ 12u$(mobile)"><input type="text" name="email" placeholder="Email" /></div>
 +
                  <div class="12u$">
 +
                    <textarea name="message" placeholder="Message"></textarea>
 +
                  </div>
 +
                  <div class="12u$">
 +
                    <input type="submit" value="Send Message" />
 +
                  </div>
 +
                </div>
 +
              </form>
  
        #main section.cover header {
+
            </div>
           padding: 0 1em;
+
           </section>
        }
+
  
     /* Footer */
+
     <!-- Footer -->
 +
      <div id="footer">
  
      #footer .copyright li {
+
        <!-- Copyright -->
        display: block;
+
          <ul class="copyright">
        line-height: 1.25em;
+
            <li><a href="https://static.igem.org/mediawiki/2015/c/ce/Harvard2015SiteMap.png" target="_blank">Site Map</a></li><li>Site template designed by: <a href="http://html5up.net">HTML5 UP</a></li><h5>
        border: 0;
+
          </ul>
        padding: 0;
+
        margin: 1em 0 0 0;
+
      }
+
  
        #footer .copyright li:first-child {
+
      </div>
          margin-top: 0;
+
        }
+
  
   }
+
    <!-- Scripts -->
 +
      <script type="text/javascript" src="https://2015.igem.org/Template:Harvard_BioDesign/JS_Scroll1?action=raw&ctype=text/javascript"></script>
 +
      <script type="text/javascript" src="https://2015.igem.org/Template:Harvard_BioDesign/JS_Scroll2?action=raw&ctype=text/javascript"></script>
 +
      <script type="text/javascript" src="https://2015.igem.org/Template:Harvard_BioDesign/JS_Scroll3?action=raw&ctype=text/javascript"></script>
 +
      <script type="text/javascript" src="https://2015.igem.org/Template:Harvard_BioDesign/JS_Scroll4?action=raw&ctype=text/javascript"></script>
 +
      <script type="text/javascript" src="https://2015.igem.org/Template:Harvard_BioDesign/JS_Scroll5?action=raw&ctype=text/javascript"></script>
 +
      <!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
 +
      <script type="text/javascript" src="https://2015.igem.org/Template:Harvard_BioDesign/JS_Scroll0?action=raw&ctype=text/javascript"></script>
 +
   </div><!--main-->
 +
  </body>
 +
</html>

Revision as of 15:43, 23 July 2015


Prologue by HTML5 UP

Welcome to the Harvard BioDesign 2015 wiki!


The "official" place where flocculation happens and llamas are appreciated.

Email Logo
Curious?

About our project

Our team is engineering E. coli to bind to colon cancer cells through the use of their type I pili, which are hair-like appendages that have an adhesive domain. Naturally, the strains in E. coli that produce pili bind to alpha-D-mannose, which can cause urinary tract infections. However, our team is altering a non-harmful strain to produce pili using a modified Fim gene in order to localize the bacteria as a tool. For treatment of cancer, once the bacteria are localized on the cells, the next step is to make them capable of producing a concentrated toxin or to administer a therapeutic. Other potential applications for our E. coli include water pollution clean up through methods such as flocculation and targeting areas through GFP.

Feeling Lost?
Let's Navigate!

How to navigate our site

Here is an easy guide to finding information on our wiki site. On the top of every page you will see a flask. When you click on it, it will open up the main navigation menu. The top section includes links of the different sections on the current page. The lower links are to switch to a new page. You can see all the pages by looking at our site map listed below.

Click Here to see our site map

Results Page
Parts Page
Notebook Page
Collaborations Page
Human Practices Page
Safety Page
Attributions Page

Contact

Feel free to email us if you have any questions! (Starting September 18th)