Difference between revisions of "Template:Team:Harvard BioDesign/skin2015.css"

Line 1: Line 1:
body { background-color: #123212; padding-left: 50px; }
+
<!--
/*<link rel="stylesheet" href="https://2015.igem.org/wiki/index.php?title=Template:Team:Harvard_BioDesign/skin2015.css?action=raw&ctype=text/css" type="text/css" />*/
+
  Prologue by HTML5 UP
 +
  html5up.net | @n33co
 +
  Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
-->
  
/*
+
<html>
** MediaWiki 'monobook' style sheet for CSS2-capable browsers.
+
  <head>
** Copyright Gabriel Wicke - http://wikidev.net/
+
    <title>Prologue by HTML5 UP</title>
** License: GPL (http://www.gnu.org/copyleft/gpl.html)
+
    <meta charset="utf-8" />
**
+
    <meta name="viewport" content="width=device-width, initial-scale=1" />
** Loosely based on http://www.positioniseverything.net/ordered-floats.html by Big John
+
    <!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
** and the Plone 2.0 styles, see http://plone.org/ (Alexander Limi,Joe Geldart & Tom Croucher,
+
    <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Harvard_BioDesign/CSS_Scroll0?action=raw&ctype=text/css" />
** Michael Zeltner and Geir Bækholt)
+
    <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900' rel='stylesheet' type='text/css'>
** All you guys rock :)
+
    <!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
*/
+
    <!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
  
  
/* Font size:
+
<style>
** We take advantage of keyword scaling- browsers won't go below 9px
+
** More at http://www.w3.org/2003/07/30-font-size
+
** http://style.cleverchimp.com/font_size_intervals/altintervals.html
+
*/
+
  
body {
 
    font: x-small sans-serif;
 
    color: black;
 
    margin: 0;
 
    padding: 0;
 
    background-color: #aaaaaa;
 
}
 
  
/* scale back up to a sane default */
+
/*BUTTON*/
#globalWrapper {
+
#buttonbox{
    position: relative;
+
position:relative;
    font-size: 127%;
+
height:133px;
    width: 100%;
+
width:134px;
    margin: 0;
+
margin: 0 auto;
    padding: 0;
+
/*background-color: #003344;*/
    padding-bottom: 10px;
+
}
+
.visualClear {
+
    clear: both;
+
}
+
  
/* The top section contains the banner, the search box, and the left and right menus */
 
 
#top-section {
 
    position: relative;
 
    height: 98px;
 
    width: 975px;
 
#    margin-left: 10px;
 
margin: 0 auto 0 auto;
 
    border-left: 1px solid #444444;
 
    border-right: 1px solid #444444;
 
    border-bottom: 1px solid #444444;
 
 
}
 
}
  
#p-logo {
 
    position: absolute;
 
    z-index: 1;
 
    height: 107px;
 
    width: 975px;
 
}
 
#p-logo h5 {
 
    display: none;
 
}
 
  
#p-logo a,
+
h4.mid {
#p-logo a:hover {
+
position: relative;
    text-decoration: none;
+
top:90px;
 +
text-align:center;
 +
text-decoration:none;
 +
z-index:1;
 +
color:#000;
 
}
 
}
  
#search-controls {
+
img.rot {
position: absolute;
+
   /*border-radius: 50%;*/
top:   20px;
+
  -webkit-transition: -webkit-transform .8s ease-in-out;
right: 15px;
+
  transition: transform .8s ease-in-out;
width: 150px;
+
  position:absolute;
height: 40px;
+
  right:0px;
background-color: transparent;
+
  z-index: 5;
    text-align: center;
+
    z-index: 3;
+
}
+
input.searchButton {
+
margin: 1px 10px 0 10px;
+
font-size: 100%;
+
background: none;
+
border: none;
+
color: #AAAAFF;
+
font-weight: bold;
+
}
+
input.searchButton:hover {
+
color: white;
+
}
+
#searchInput {
+
    width: 10.9em;
+
    margin: 0;
+
    font-size: 95%;
+
 
}
 
}
  
  
#menubar {
+
img.rot:hover {
    position: absolute;
+
  -webkit-transform: rotate(720deg);
    white-space: nowrap;
+
  transform: rotate(720deg);
    top: -6px;
+
  z-index: 5;
    width: 400px;
+
    z-index: 5;
+
    font-family: sans-serif;
+
    font-size: 95%;
+
    line-height: 1em;
+
 
}
 
}
  
.left-menu, .left-menu a {
+
</style>
    left: 0px;
+
    text-align: left;
+
    color:transparent;
+
    text-transform: lowercase;
+
}
+
  
.left-menu:hover {
+
  </head>
    color: white;
+
  <body>
    background-color: #555555
+
}
+
.right-menu, .right-menu a {
+
    right: 0px;
+
    text-align: right;
+
    color: white;
+
}
+
#menubar ul {
+
    color: #555555;
+
    list-style: none;
+
}
+
#menubar li {
+
    display: inline;
+
    position: relative;
+
    cursor: pointer;
+
    padding-left: 0px;
+
    padding-right: 0px;
+
}
+
.left-menu li a {
+
    padding: 0px 10px 0px 0px;
+
}
+
.left-menu .selected {
+
#    color: white;
+
}
+
#.left-menu .selected:hover {
+
#    color: #5555FF;
+
#}
+
  
.left-menu:hover a {
+
    <!-- header -->
    color: white;
+
      <div id="header">
}
+
        <div class="inner">
.right-menu li {
+
        <div class="top">
#    background-color: #606060;
+
          <!-- Logo -->
}
+
            <div id="logo">
.right-menu li a {
+
              <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>
    padding: 0px 15px 0px 0px;
+
            <!-- <h1 id="title">Harvard BioDesign 2015</h1>-->
    color: white;
+
            </div><!-- #Logo -->
    background-color: #606060;
+
}
+
.right-menu li a:hover {
+
    color: #aaaaff;
+
    text-decoration: underline;
+
}
+
  
/* footer */
+
          <!-- Nav -->
#footer-box {
+
            <nav id="nav">
margin-left:  10px;
+
              <!--
width: 965px;
+
padding: 5px;
+
background-color: white;
+
margin: 0 auto;
+
border: 1px solid #444444;
+
}
+
#footer {
+
color: #000000;
+
text-align: center;
+
font-size: 90%;;
+
}
+
#footer li {
+
display: inline;
+
margin: 0 1.3em;
+
}
+
  
/* Sponsors box */
+
                Prologue's nav expects links in one of two formats:
  
#sponsor-box {
+
                1. Hash link (scrolls to a different section within the page)
    height: 49px;
+
    width: 975px;
+
#    margin-left: 10px;   
+
margin: 0 auto;
+
    border-left: 1px solid #444444;
+
    border-right: 1px solid #444444;
+
    border-bottom: 1px solid #444444;
+
    background-color: white;
+
    font-family: 'verdana' 'arial' sans-serif;
+
    font-size: 11pt;
+
    line-height: 1.2em;
+
    z-index: 5;
+
}
+
#f-poweredbyico {
+
    float: right;
+
}
+
#f-copyrightico {
+
    float: left;
+
}
+
  
/* Pulldown menu boxes */
+
                  <li><a href="#foobar" id="foobar-link" class="icon fa-whatever-icon-you-want skel-layers-ignoreHref"><span class="label">Foobar</span></a></li>
  
.hidden  { visibility: hidden;  }
+
                2. Standard link (sends the user to another page/site)
.visible {      visibility: visible; }
+
  
 +
                  <li><a href="http://foobar.tld" id="foobar-link" class="icon fa-whatever-icon-you-want"><span class="label">Foobar</span></a></li>
  
.menubox {
+
              -->
position: absolute;
+
          <!-- Subsections -->
top: 20px;
+
<h4> Content </h4>
left: 0px;
+
            <ul>
border: 1px solid #A4A4A4;
+
                <li><a href="#top" id="top-link" class="skel-layers-ignoreHref active"><span class="icon fa-home">Welcome</span></a></li>
background-color: #E0E0E0;
+
                <li><a href="#sitemap" id="sitemap-link" class="skel-layers-ignoreHref"><span class="icon fa-user">Site Map</span></a></li>
width: 200px;
+
                <li><a href="#teampage" id="teampage-link" class="skel-layers-ignoreHref"><span class="icon fa-user">Page Overviews</span></a></li>
        height: 200px;
+
            </ul>
z-index: 20;
+
</nav>
}
+
</div><!--#top-->
  
.bridge1 {
+
        <div class="bottom">
position: absolute;
+
        <nav id="nav">
top: 18px;
+
          <!-- Main Menu -->
left: 1px;
+
        <h4><div class="innertwo">Main Pages</div></h4>
width: 59px;
+
            <ul>
        height: 4px;
+
                <li><a class="curPage" href="https://2015.igem.org/Team:Harvard_BioDesign">Home</a></li>
background-color: #d8d8d8;
+
                <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Team">Team</a></li>
z-index: 25;
+
                <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>
  
.shadow1 {
 
position: absolute;
 
top: 23px;
 
left: 3px;
 
width: 202px;
 
        height: 202px;
 
background-color: #202020;
 
border-right: 1px solid #454545;
 
border-bottom: 1px solid #454545;
 
z-index: 18;
 
opacity: 0.6
 
}
 
.shadow2 {
 
position: absolute;
 
top: 25px;
 
left: 5px;
 
width: 202px;
 
        height: 202px;
 
border-right: 1px solid #606060;
 
border-bottom: 1px solid #606060;
 
background-color: #303030;
 
opacity: 0.4;
 
z-index: 16;
 
}
 
.shadow3 {
 
position: absolute;
 
top: 27px;
 
left: 7px;
 
width: 202px;
 
        height: 202px;
 
border-right: 1px solid #666666;
 
border-bottom: 1px solid #666666;
 
background-color: #000000;
 
opacity: 0.2;
 
z-index: 13;
 
}
 
  
/*  IGEM RIGHT SIDEBAR STYLING */
 
#right-sidebar {
 
position: absolute;
 
right: 0px;
 
width: 190px;
 
border-left: 3px solid gray;
 
font-size: 95%;
 
line-height: 90%;
 
}
 
.right-box {
 
width: 180px;
 
padding: 4px 5px 5px 5px;
 
margin-top: 10px;
 
border: 1px solid #444444;
 
border-left: none;
 
}
 
  
.right-box:first-child {
+
          <!-- Social Icons -->
margin-top: 0px;
+
            <ul class="icons">
}
+
  
.right-heading {
+
              <li><a href="https://www.facebook.com/harvardigem2015" target="_blank">
font-size: 125%;
+
                    <img src="https://static.igem.org/mediawiki/2015/e/ed/Harvard2015Facebookwhite.png"alt="Facebook Logo" style="width:51px;height:51px;"></a></li>
font-weight: bold;
+
              <li><a href="https://twitter.com/HarvardiGEM2015" target="_blank">
padding: 0.5em 0 0;
+
                    <img src="https://static.igem.org/mediawiki/2015/6/64/Harvard2015Twitterlogowhite.png"alt="Twitter Logo" style="width:51px;height:51px;"></a></li>
line-height:100%;
+
              <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>
.right-box ul {
+
            </ul>
line-height: 90%;
+
        </div><!--#bottom-->
}
+
      </div><!--#inner-->
.right-box li {
+
      </div><!--#header-->
color: #666666;    /* The items are grayed until they have links */
+
}
+
  
/*****************************************************************************************************
+
     <!-- Main -->
* The content div contains all of the contents of the page - provided by mediawiki
+
      <div id="main">
****************************************************************************************************/
+
#content {
+
     position: relative;
+
    width:  965px;
+
#    margin-left: 10px;
+
margin: 0 auto;
+
    padding: 5px 5px 5px 5px;;
+
    background: white;
+
    color: black;
+
    border-left: 1px solid #444444;
+
    border-right: 1px solid #444444;
+
    line-height: 1.5em;
+
    z-index: 2;
+
}
+
  
#column-one {
+
        <!-- Intro -->
    padding-top: 107px;
+
          <section id="top" class="one">
    position: absolute;
+
            <div class="container">
    right: 4px;
+
    padding: 100px 20px 0 0;
+
}
+
/* the left column width is specified in class .portlet */
+
  
/* general styles */
+
              <header>
 +
                <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>
  
table {
+
            Curious?<br/>
    font-size: 100%;
+
            <!--  <div class="wrap">
    background: white;
+
                <a href="#sitemap" class="button scrolly" style="font-family:'Lato';text-decoration:none;background-color:#9DE8BD;color:#000;"><br/>Start Here</a>
    color: black;
+
                <div class="circle angled"></div>
}
+
              </div>-->
a {
+
            </div>
    text-decoration: none;
+
    color: #002bb8;
+
    background: none;
+
}
+
a:visited {
+
    color: #002bb8;
+
}
+
a:active {
+
    color: #002bb8;
+
}
+
a:hover {
+
    text-decoration: underline;
+
}
+
a.stub {
+
    color: #772233;
+
}
+
/*  a.new, #p-personal a.new {    - rdr */
+
a.new {
+
    color: #AAAAFF;
+
}
+
a.new:visited, #p-personal a.new:visited {
+
    color: #002bb8;
+
}
+
  
img {
+
<footer>
    border: none;
+
<div id="buttonbox">
    vertical-align: middle;
+
<a href="#sitemap" style="font-family:'Lato';color:#9DE8BD;font-size:23px;"><h4 class="mid" style="font-size:90%;">Start Here</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
}
+
</div>
p {
+
</footer>
    margin: .4em 0 .5em 0;
+
          </section>
    line-height: 1.5em;
+
}
+
p img {
+
    margin: 0;
+
}
+
  
hr {
+
          <section id="sitemap" class="three">
    height: 1px;
+
            <div class="container">
    color: #aaa;
+
    background-color: #aaa;
+
    border: 0;
+
    margin: .2em 0 .2em 0;
+
}
+
  
h1, h2, h3, h4, h5, h6 {
+
              <header>
    color: black;
+
                <h2>How to navigate our site</h2>
    background: none;
+
              </header>
    font-weight: normal;
+
    margin: 0;
+
    padding-top: .5em;
+
    padding-bottom: .17em;
+
    border-bottom: 1px solid #aaa;
+
}
+
h1 { font-size: 188%; }
+
h2 { font-size: 150%; }
+
h3, h4, h5, h6 {
+
    border-bottom: none;
+
    font-weight: bold;
+
}
+
h3 { font-size: 132%; }
+
h4 { font-size: 116%; }
+
h5 { font-size: 100%; }
+
h6 { font-size: 80%;  }
+
  
ul {
+
              <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. You can also get a brief idea of what you'll find on each page by scrolling down.</h6>
    line-height: 1.5em;
+
              <br/>
    list-style-type: square;
+
              <p><a href="https://static.igem.org/mediawiki/2015/c/ce/Harvard2015SiteMap.png" target="_blank">Click Here</a> to see our site map</p>
    margin: .3em 0 0 1.5em;
+
            </div>
    padding: 0;
+
  </section>
    list-style-image: url(bullet.gif);
+
}
+
ol {
+
    line-height: 1.5em;
+
    margin: .3em 0 0 3.2em;
+
    padding: 0;
+
    list-style-image: none;
+
}
+
li {
+
    margin-bottom: .1em;
+
}
+
dt {
+
    font-weight: bold;
+
    margin-bottom: .1em;
+
}
+
dl {
+
    margin-top: .2em;
+
    margin-bottom: .5em;
+
}
+
dd {
+
    line-height: 1.5em;
+
    margin-left: 2em;
+
    margin-bottom: .1em;
+
}
+
  
fieldset {
+
<section id="teampage" class="four"><div class="container"></div>
    border: 1px solid #2f6fab;
+
<img src="https://static.igem.org/mediawiki/2015/e/e2/Harvard2015_Team.png" alt="Team Logo" style="width:200px;height:200px;"/></a>
    margin: 1em 0 1em 0;
+
<header><h3>See who participated on this year’s iGEM team.</h3></header>
    padding: 0 1em 1em;
+
<footer>
    line-height: 1.5em;
+
<div id="buttonbox">
}
+
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Team" style="font-family:'Lato';color:#CDFCFF;"><h4 class="mid">Team</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
legend {
+
</div>
    background: white;
+
</footer>
    padding: .5em;
+
</section>
    font-size: 95%;
+
}
+
form {
+
    border: none;
+
    margin: 0;
+
}
+
  
textarea {
+
<section id="top" class="five"><div class="container"></div>
    width: 100%;
+
<img src="https://static.igem.org/mediawiki/2015/8/85/Harvard_2015_Project.png" alt="Project Logo" style="width:200px;height:200px;"/></a>
    padding: .1em;
+
<header><h3>Learn what we are all about. Here you can learn how we set up and conducted our research.</h3></header>
}
+
<footer>
 +
<div id="buttonbox">
 +
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Project" style="font-family:'Lato';color:#ADFFB7;"><h4 class="mid">Project</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
 +
</div>
 +
</footer>
 +
</section>
  
input.historysubmit {
+
<section id="top" class="six">
    padding: 0 .3em .3em .3em !important;
+
<img src="https://static.igem.org/mediawiki/2015/4/40/Harvard2015_Results.png" alt="Results Logo" style="width:200px;height:200px;"/></a>
    font-size: 94%;
+
<header><h3>Find our major accomplishments here and where we plan to go with them.</h3></header>
    cursor: pointer;
+
<footer>
    height: 1.7em !important;
+
<div id="buttonbox">
    margin-left: 1.6em;
+
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Results" style="font-family:'Lato';color:#E0FFD5;"><h4 class="mid">Results</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
}
+
</div>
select {
+
</footer>
    vertical-align: top;
+
</section>
}
+
abbr, acronym, .explain {
+
    border-bottom: 1px dotted black;
+
    color: black;
+
    background: none;
+
    cursor: help;
+
}
+
q {
+
    font-family: Times, "Times New Roman", serif;
+
    font-style: italic;
+
}
+
/* disabled for now
+
blockquote {
+
    font-family: Times, "Times New Roman", serif;
+
    font-style: italic;
+
}*/
+
code {
+
    background-color: #f9f9f9;
+
}
+
pre {
+
    padding: 1em;
+
    border: 1px dashed #2f6fab;
+
    color: black;
+
    background-color: #f9f9f9;
+
    line-height: 1.1em;
+
}
+
  
/*
+
<section id="top" class="seven">
** the main content area
+
<img src="https://static.igem.org/mediawiki/2015/b/b1/Harvard2015_Parts.png" alt="Parts Logo" style="width:200px;height:200px;"/></a>
*/
+
<header><h3>View the parts we created.</h3></header>
 +
<footer>
 +
<div id="buttonbox">
 +
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Parts" style="font-family:'Lato';color:#B9FFEE;"><h4 class="mid">Parts</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
 +
</div>
 +
</footer>
 +
</section>
  
#siteSub {
+
<section id="top" class="eight">
    display: none;
+
<img src="https://static.igem.org/mediawiki/2015/5/53/Harvard2015_Notebook.png" alt="Notebook Logo" style="width:200px;height:200px;"/></a>
}
+
<header><h3>The story of our hard work.</h3></header>
#contentSub {
+
<footer>
    font-size: 84%;
+
<div id="buttonbox">
    line-height: 1.2em;
+
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Notebook" style="font-family:'Lato';color:#E1FFEE;"><h4 class="mid">Notes</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
    margin: 0 0 1.4em 1em;
+
</div>
    color: #7d7d7d;
+
</footer>
    width: auto;
+
</section>
}
+
span.subpages {
+
    display: block;
+
}
+
  
/* Some space under the headers in the content area */
+
<section id="top" class="nine">
#bodyContent h1, #bodyContent h2 {
+
<img src="https://static.igem.org/mediawiki/2015/8/82/Harvard2015_Collabs.png" alt="Collabs Logo" style="width:200px;height:200px;"/></a>
    margin-bottom: .6em;
+
<header><h3>Outreach to our fellow iGEMers.</h3></header>
}
+
<footer>
#bodyContent h3, #bodyContent h4, #bodyContent h5 {
+
<div id="buttonbox">
    margin-bottom: .3em;
+
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Collaborations" style="font-family:'Lato';color:#9DE3E8;"><h4 class="mid">Collabs</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
}
+
</div>
.firstHeading {
+
</footer>
    margin-bottom: .1em;
+
</section>
}
+
  
/* user notification thing */
+
<section id="top" class="ten">
.usermessage {
+
<img src="https://static.igem.org/mediawiki/2015/c/c8/Harvard2015_Practices.png" alt="Practices Logo" style="width:200px;height:200px;"/></a>
    background-color: #ffce7b;
+
<header><h3>A guide to how to take research to the next level.</h3></header>
    border: 1px solid #ffa500;
+
<footer>
    color: black;
+
<div id="buttonbox">
    font-weight: bold;
+
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Practices" style="font-family:'Lato';color:#C1E8DE;font-size:23px;"><h4 class="mid">Practices</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
    margin: 2em 0 1em;
+
</div>
    padding: .5em 1em;
+
</footer>
    vertical-align: middle;
+
</section>
}
+
#siteNotice {
+
    text-align: center;
+
    font-size: 95%;
+
    padding: 0 .9em;
+
}
+
#siteNotice p {
+
    margin: 0;
+
    padding: 0;
+
}
+
.error {
+
    color: red;
+
    font-size: larger;
+
}
+
#catlinks {
+
    border: 1px solid #aaa;
+
    background-color: #f9f9f9;
+
    padding: 5px;
+
    margin-top: 1em;
+
    clear: both;
+
}
+
/* currently unused, intended to be used by a metadata box
+
in the bottom-right corner of the content area */
+
.documentDescription {
+
    /* The summary text describing the document */
+
    font-weight: bold;
+
    display: block;
+
    margin: 1em 0;
+
    line-height: 1.5em;
+
}
+
.documentByLine {
+
    text-align: right;
+
    font-size: 90%;
+
    clear: both;
+
    font-weight: normal;
+
    color: #76797c;
+
}
+
  
/* emulate center */
+
<section id="top" class="one">
.center {
+
<img src="https://static.igem.org/mediawiki/2015/4/44/Harvard2015_Safety.png" alt="Safety Logo" style="width:200px;height:200px;"/></a>
    width: 100%;
+
<header><h3>Safety is what really matters.</h3></header>
    text-align: center;
+
<footer>
}
+
<div id="buttonbox">
*.center * {
+
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Safety" style="font-family:'Lato';color:#9DE8BD;"><h4 class="mid">Safety</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
    margin-left: auto;
+
</div>
    margin-right: auto;
+
</footer>
}
+
</section>
/* small for tables and similar */
+
.small, .small * {
+
    font-size: 94%;
+
}
+
table.small {
+
    font-size: 100%;
+
}
+
  
/*
+
<section id="top" class="two">
** content styles
+
<img src="https://static.igem.org/mediawiki/2015/1/1b/Harvard2015_Attributions.png" alt="Attributions Logo" style="width:200px;height:200px;"/></a>
*/
+
<header><h3>A shoutout to those who made us possible.</h3></header>
 +
<footer>
 +
<div id="buttonbox">
 +
<a href="https://2015.igem.org/Team:Harvard_BioDesign/Attributions" style="font-family:'Lato';color:#C1E8C5;"><h4 class="mid">Thanks</h4><img class="rot" src="https://static.igem.org/mediawiki/2015/6/64/Harvard_Circle_Outside.png"/></a>
 +
</div>
 +
</footer>
 +
</section>
  
#toc,
+
    <!-- Footer -->
.toc {
+
      <div id="footer">
border: 1px solid #aaa;
+
background-color: #f9f9f9;
+
padding: 5px;
+
font-size: 95%;
+
}
+
#toc h2,
+
.toc h2 {
+
display: inline;
+
border: none;
+
padding: 0;
+
font-size: 100%;
+
font-weight: bold;
+
}
+
#toc #toctitle,
+
.toc #toctitle,
+
#toc .toctitle,
+
.toc .toctitle {
+
text-align: center;
+
}
+
#toc ul,
+
.toc ul {
+
list-style-type: none;
+
list-style-image: none;
+
margin-left: 0;
+
padding-left: 0;
+
text-align: left;
+
}
+
#toc ul ul,
+
.toc ul ul {
+
margin: 0 0 0 2em;
+
}
+
#toc .toctoggle,
+
.toc .toctoggle {
+
font-size: 94%;
+
}
+
  
 +
        <!-- Copyright -->
 +
          <ul class="copyright">
 +
            <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>
 +
          </ul>
  
/* images */
+
      </div>
div.floatright, table.floatright {
+
    clear: right;
+
    float: right;
+
    position: relative;
+
    margin: 0 0 .5em .5em;
+
    border: 0;
+
/*
+
    border: .5em solid white;
+
    border-width: .5em 0 .8em 1.4em;
+
*/
+
}
+
div.floatright p { font-style: italic; }
+
div.floatleft, table.floatleft {
+
    float: left;
+
    position: relative;
+
    margin: 0 .5em .5em 0;
+
    border: 0;
+
/*
+
    margin: .3em .5em .5em 0;
+
    border: .5em solid white;
+
    border-width: .5em 1.4em .8em 0;
+
*/
+
}
+
div.floatleft p { font-style: italic; }
+
/* thumbnails */
+
div.thumb {
+
    margin-bottom: .5em;
+
    border-style: solid;
+
    border-color: white;
+
    width: auto;
+
}
+
div.thumb div {
+
    border: 1px solid #ccc;
+
    padding: 3px !important;
+
    background-color: #f9f9f9;
+
    font-size: 94%;
+
    text-align: center;
+
    overflow: hidden;
+
}
+
div.thumb div a img {
+
    border: 1px solid #ccc;
+
}
+
div.thumb div div.thumbcaption {
+
    border: none;
+
    text-align: left;
+
    line-height: 1.4em;
+
    padding: .3em 0 .1em 0;
+
}
+
div.magnify {
+
    float: right;
+
    border: none !important;
+
    background: none !important;
+
}
+
div.magnify a, div.magnify img {
+
    display: block;
+
    border: none !important;
+
    background: none !important;
+
}
+
div.tright {
+
    clear: right;
+
    float: right;
+
    border-width: .5em 0 .8em 1.4em;
+
}
+
div.tleft {
+
    float: left;
+
    margin-right: .5em;
+
    border-width: .5em 1.4em .8em 0;
+
}
+
  
.hiddenStructure {
+
     <!-- Scripts -->
     display: none;
+
      <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>
img.tex {
+
      <script type="text/javascript" src="https://2015.igem.org/Template:Harvard_BioDesign/JS_Scroll3?action=raw&ctype=text/javascript"></script>
    vertical-align: middle;
+
      <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>
span.texhtml {
+
      <!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
    font-family: serif;
+
      <script type="text/javascript" src="https://2015.igem.org/Template:Harvard_BioDesign/JS_Scroll0?action=raw&ctype=text/javascript"></script>
}
+
  </div><!--main-->
 
+
  </body>
/*
+
</html>
** classes for special content elements like town boxes
+
** intended to be referenced directly from the wiki src
+
*/
+
 
+
/*
+
** User styles
+
*/
+
/* table standards */
+
table.rimage {
+
    float: right;
+
    position: relative;
+
    margin-left: 1em;
+
    margin-bottom: 1em;
+
    text-align: center;
+
}
+
.toccolours {
+
    border: 1px solid #aaa;
+
    background-color: #f9f9f9;
+
    padding: 5px;
+
    font-size: 95%;
+
}
+
div.townBox {
+
    position: relative;
+
    float: right;
+
    background: white;
+
    margin-left: 1em;
+
    border: 1px solid gray;
+
    padding: .3em;
+
    width: 200px;
+
    overflow: hidden;
+
    clear: right;
+
}
+
div.townBox dl {
+
    padding: 0;
+
    margin: 0 0 .3em;
+
    font-size: 96%;
+
}
+
div.townBox dl dt {
+
    background: none;
+
    margin: .4em 0 0;
+
}
+
div.townBox dl dd {
+
    margin: .1em 0 0 1.1em;
+
    background-color: #f3f3f3;
+
}
+
 
+
/*
+
** edit views etc
+
*/
+
.special li {
+
    line-height: 1.4em;
+
    margin: 0;
+
    padding: 0;
+
}
+
 
+
/* Page history styling */
+
/* the auto-generated edit comments */
+
.autocomment {
+
    color: gray;
+
}
+
#pagehistory span.user {
+
    margin-left: 1.4em;
+
    margin-right: .4em;
+
}
+
#pagehistory span.minor {
+
    font-weight: bold;
+
}
+
#pagehistory li {
+
    border: 1px solid white;
+
}
+
#pagehistory li.selected {
+
    background-color: #f9f9f9;
+
    border: 1px dashed #aaa;
+
}
+
 
+
/*
+
** Diff rendering
+
*/
+
table.diff, td.diff-otitle, td.diff-ntitle {
+
    background-color: white;
+
}
+
td.diff-addedline {
+
    background: #cfc;
+
    font-size: smaller;
+
}
+
td.diff-deletedline {
+
    background: #ffa;
+
    font-size: smaller;
+
}
+
td.diff-context {
+
    background: #eee;
+
    font-size: smaller;
+
}
+
span.diffchange {
+
    color: red;
+
    font-weight: bold;
+
}
+
 
+
/*
+
** keep the whitespace in front of the ^=, hides rule from konqueror
+
** this is css3, the validator doesn't like it when validating as css2
+
*/
+
#bodyContent a[href ^="http://"],
+
#bodyContent a[href ^="gopher://"] {
+
/*    background: url(external.png) center right no-repeat;    rdr */
+
/*    padding-right: 13px;                                    rdr */
+
}
+
#bodyContent a[href ^="https://"],
+
.link-https {
+
    background: url(lock_icon.gif) center right no-repeat;
+
    padding-right: 16px;
+
}
+
#bodyContent a[href ^="mailto:"],
+
.link-mailto {
+
    background: url(mail_icon.gif) center right no-repeat;
+
    padding-right: 18px;
+
}
+
#bodyContent a[href ^="news://"] {
+
    background: url(news_icon.png) center right no-repeat;
+
    padding-right: 18px;
+
}
+
#bodyContent a[href ^="ftp://"],
+
.link-ftp {
+
    background: url(file_icon.gif) center right no-repeat;
+
    padding-right: 18px;
+
}
+
#bodyContent a[href ^="irc://"],
+
.link-irc {
+
    background: url(discussionitem_icon.gif) center right no-repeat;
+
    padding-right: 18px;
+
}
+
/* disable interwiki styling */
+
#bodyContent a.extiw,
+
#bodyContent a.extiw:active {
+
    color: #36b;
+
    background: none;
+
    padding: 0;
+
}
+
/* this can be used in the content area to switch off
+
special external link styling */
+
#bodyContent .plainlinks a {
+
    background: none !important;
+
    padding: 0;
+
}
+
 
+
/* the icon in front of the user name, single quotes
+
in bg url to hide it from iemac */
+
li#pt-userpage,
+
li#pt-anonuserpage,
+
li#pt-login {
+
    padding-left: 20px;
+
    text-transform: none;
+
}
+
 
+
 
+
/* hide from incapable browsers */
+
head:first-child+body #footer li { white-space: nowrap; }
+
 
+
 
+
/* js pref toc */
+
#preftoc {
+
    float: left;
+
    margin: 1em;
+
    width: 13em;
+
}
+
#preftoc li {
+
    border: 1px solid white;
+
}
+
#preftoc li.selected {
+
    background-color: #f9f9f9;
+
    border: 1px dashed #aaa;
+
}
+
#preftoc a,
+
#preftoc a:active {
+
    display: block;
+
    color: #0014a6;
+
}
+
#prefcontrol {
+
    clear: both;
+
    float: left;
+
    margin-top: 1em;
+
}
+
div.prefsectiontip {
+
    font-size: 95%;
+
    margin-top: 1em;
+
}
+
fieldset.operaprefsection {
+
    margin-left: 15em;
+
}
+
 
+
/*
+
** IE/Mac fixes, hope to find a validating way to move this
+
** to a separate stylesheet. This would work but doesn't validate:
+
** @import("IEMacFixes.css");
+
*/
+
/* tabs: border on the a, not the div */
+
* > html #p-cactions li { border: none; }
+
* > html #p-cactions li a {
+
    border: 1px solid #aaa;
+
    border-bottom: none;
+
}
+
 
+
/* * > html #p-cactions li.selected a { border-color: #00bd23; }  */
+
/* footer icons need a fixed width */
+
* > html #f-poweredbyico,
+
/* * > html #f-copyrightico { width: 88px; } */
+
* > html #bodyContent,
+
* > html #bodyContent pre {
+
    overflow-x: auto;
+
    width: 100%;
+
    padding-bottom: 25px;
+
}
+
 
+
/* more IE fixes */
+
/* float/negative margin brokenness */
+
* html #footer {margin-top: 0;}
+
* html #column-content {
+
    display: inline;
+
    margin-bottom: 0;
+
}
+
* html div.editsection { font-size: smaller; }
+
#pagehistory li.selected { position: relative; }
+
 
+
/* Mac IE 5.0 fix; floated content turns invisible */
+
* > html #column-content {
+
    float: none;
+
}
+
* > html #column-one {
+
    position: absolute;
+
    left: 0;
+
    top: 0;
+
}
+
* > html #footer {
+
    margin-left: 13.2em;
+
}
+
.redirectText {
+
    font-size: 150%;
+
    margin: 5px;
+
}
+
 
+
.printfooter {
+
    display: none;
+
}
+
 
+
.not-patrolled {
+
    background-color: #ffa;
+
}
+
div.patrollink {
+
    font-size: 75%;
+
    text-align: right;
+
}
+
span.newpage, span.minor, span.searchmatch {
+
    font-weight: bold;
+
}
+
span.unpatrolled {
+
    font-weight: bold;
+
    color: red;
+
}
+
 
+
span.searchmatch {
+
    color: red;
+
}
+
.sharedUploadNotice {
+
    font-style: italic;
+
}
+
 
+
span.updatedmarker {
+
    color: black;
+
    background-color: #0f0;
+
}
+
span.newpageletter {
+
    font-weight: bold;
+
    color: black;
+
    background-color: yellow;
+
}
+
span.minoreditletter {
+
    color: black;
+
    background-color: #c5ffe6;
+
}
+
 
+
table.gallery {
+
    border: 1px solid #ccc;
+
    margin: 2px;
+
    padding: 2px;
+
    background-color: white;
+
}
+
 
+
table.gallery tr {
+
    vertical-align: top;
+
}
+
 
+
table.gallery td {
+
    vertical-align: top;
+
    background-color: #f9f9f9;
+
    border: solid 2px white;
+
}
+
 
+
div.gallerybox {
+
    margin: 2px;
+
    width:  150px;
+
}
+
 
+
div.gallerybox div.thumb {
+
    text-align: center;
+
    border: 1px solid #ccc;
+
    margin: 2px;
+
}
+
 
+
div.gallerytext {
+
    font-size: 94%;
+
    padding: 2px 4px;
+
}
+
 
+
span.comment {
+
font-style: italic;
+
}
+
 
+
span.changedby {
+
font-size: 95%;
+
}
+
 
+
.previewnote {
+
text-align: center;
+
color: #cc0000;
+
}
+
.editExternally {
+
border: 1px solid gray;
+
background-color: #ffffff;
+
padding: 3px;
+
margin-top: 0.5em;
+
float: left;
+
font-size: small;
+
text-align: center;
+
}
+
.editExternallyHelp {
+
font-style: italic;
+
color: gray;
+
}
+
 
+
li span.deleted {
+
text-decoration: line-through;
+
color: #888;
+
font-style: italic;
+
}
+
 
+
.toggle {
+
margin-left: 2em;
+
text-indent: -2em;
+
}
+
 
+
/* Classes for EXIF data display */
+
table.metadata {
+
font-size: 0.8em;
+
margin-left: 0.5em;
+
margin-bottom: 0.5em;
+
}
+
 
+
table.metadata caption {
+
font-weight: bold;
+
}
+
 
+
table.metadata th {
+
font-weight: normal;
+
}
+
 
+
table.metadata td {
+
padding: 0.1em;
+
}
+
 
+
table.metadata {
+
border: none;
+
border-collapse: collapse;
+
}
+
 
+
table.metadata td, table.metadata th {
+
text-align: center;
+
border: 1px solid #aaaaaa;
+
padding-left: 0.1em;
+
padding-right: 0.1em;
+
}
+
 
+
table.metadata th {
+
background-color: #f9f9f9;
+
}
+
 
+
table.metadata td {
+
background-color: #fcfcfc;
+
}
+
 
+
/* filetoc */
+
ul#filetoc {
+
text-align: center;
+
border: 1px solid #aaaaaa;
+
background-color: #f9f9f9;
+
padding: 5px;
+
font-size: 95%;
+
margin-bottom: 0.5em;
+
margin-left: 0;
+
margin-right: 0;
+
}
+
 
+
#filetoc li {
+
display: inline;
+
list-style-type: none;
+
padding-right: 2em;
+
}
+
 
+
/* @bug 1714 */
+
input#wpSave, input#wpDiff {
+
margin-right: 0.33em;
+
}
+
 
+
 
+
/* Classes for article validation */
+
 
+
table.revisionform_default {
+
border: 1px solid #000000;
+
}
+
 
+
table.revisionform_focus {
+
border: 1px solid #000000;
+
background-color:#00BBFF;
+
}
+
 
+
tr.revision_tr_default {
+
background-color:#EEEEEE;
+
}
+
 
+
tr.revision_tr_first {
+
background-color:#DDDDDD;
+
}
+
 
+
p.revision_saved {
+
color: green;
+
font-weight:bold;
+
}
+
 
+
#mw_trackbacks {
+
border: solid 1px #bbbbff;
+
background-color: #eeeeff;
+
padding: 0.2em;
+
}
+
 
+
 
+
/* Allmessages table */
+
 
+
#allmessagestable th {
+
background-color: #b2b2ff;
+
}
+
 
+
#allmessagestable tr.orig {
+
background-color: #ffe2e2;
+
}
+
 
+
#allmessagestable tr.new {
+
background-color: #e2ffe2;
+
}
+
 
+
#allmessagestable tr.def {
+
background-color: #f0f0ff;
+
}
+

Revision as of 01:41, 18 September 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?

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. You can also get a brief idea of what you'll find on each page by scrolling down.

Click Here to see our site map

Team Logo

See who participated on this year’s iGEM team.

Project Logo

Learn what we are all about. Here you can learn how we set up and conducted our research.

Results Logo

Find our major accomplishments here and where we plan to go with them.

Parts Logo

View the parts we created.

Notebook Logo

The story of our hard work.

Collabs Logo

Outreach to our fellow iGEMers.

Practices Logo

A guide to how to take research to the next level.

Safety Logo

Safety is what really matters.

Attributions Logo

A shoutout to those who made us possible.