Template:Team:Alberta/2011style.css

From 2011.igem.org

(Difference between revisions)
m
 
(431 intermediate revisions not shown)
Line 1: Line 1:
-
/* NOTE This is an edited version of the MediaWiki 'monobook' style sheet  
+
/* Style sheet for 2011 wiki page */
-
*      edited by Team Alberta 2010 for their wiki
+
-
*/
+
-
div#test{
+
 
-
     background-color:red;
+
/* Colors:
-
width:100px;
+
 
-
height:100px;
+
grey: 959995
 +
orange navbar: f09131
 +
orange box: f19232
 +
beige: fffcd5
 +
green: 5db54b
 +
 
 +
*/
 +
 
 +
#menubar a:visited { color: transparent; }
 +
 
 +
body {
 +
     //background-color: #959995;
 +
    //background-color: #757575;
 +
    //background-color: #ffffff;
 +
    //background-color: #555555;
 +
    font-family: verdana;
 +
    background-color: #ddd;
 +
    background-attachment: fixed;
 +
}
 +
/* TOP MENU SECTION*/
 +
#top-section {
 +
    width: 1000px;
 +
    height: auto;
 +
    border: 0px;
 +
    padding: 0px;
 +
    margin-bottom: 0px;
}
}
-
div#preload { display: none; }
+
#firstHeading {
 +
    display: none;
 +
}
-
/* things we want to hide */
+
#p-logo {
-
#info-box1 h2 .editsection, #info-box2 h2 .editsection, #info-box3 h2 .editsection, #info-box4 h2 .editsection{
+
    display: none;
-
display:none;
+
}
}
-
h1.firstHeading {
+
 
-
display:none;
+
.left-menu, .right-menu {
 +
    margin: 2px;
}
}
-
#p-logo{
+
.left-menu:hover, .right-menu ul li a {
-
      display:none;
+
    background-color: transparent;
}
}
-
/* rearrange the topsection bar */
+
.right-menu li a {
-
#top-section{
+
    color: transparent;
-
        height:0;
+
}
}
-
#menubar{
+
 
-
        top:0;
+
.left-menu:hover ul li a, .right-menu:hover ul li a {
 +
    color: #959995;
}
}
-
#search-controls{
+
 
-
        top:4px;
+
.left-menu li {
-
                left:547px;
+
    color: transparent !important;
-
                        width:0;
+
}
}
-
#searchInput{
+
 
-
        border:1px solid white;
+
#search-controls {
-
                  position:absolute;
+
    display: none;
}
}
 +
/* NAVBAR SECTION ... which is really part of content */
-
#searchGoButton{
+
#navbar {
-
      display:none;
+
    //width: 950px;
 +
    /*background-color: #f09131;*/
 +
    //margin-left:15px;
 +
    //margin-right:15px;
 +
    //padding-left: 10px;
 +
    //padding-right: 10px;
 +
    height: 78px;
 +
    /*border-radius: 2px;*/
 +
    background-image:url(https://static.igem.org/mediawiki/2011/6/6e/Alberta_navbar_green2.png)
 +
}
 +
 
 +
#navbar ul {
 +
    list-style:none;
 +
    margin: 0px;
 +
    font-size: 16pt;
}
}
-
#mw-searchButton{
+
 
-
      background-color:#3C2415;
+
#navbar ul li {
-
        border:1px solid white;
+
    position:relative;
-
                color:transparent;
+
    float:left;
-
                        height:19px;
+
    margin: 0px;
-
                                  left:124px;
+
    height: 78px;
-
                                        position:absolute;
+
-
                                                    top:-1px;
+
-
                                                          width:24px;
+
-
                                                                  cursor:pointer;
+
-
                                                                          background-image:url("https://static.igem.org/mediawiki/2010/8/83/Team-alberta-search-glass.png");
+
-
                                                                            background-position:center center;
+
-
                                                                              background-repeat:no-repeat;
+
}
}
-
#catlinks{
+
#navbar ul li ul {
-
display:none;
+
    border-style: solid;
 +
    border-color: #3C2415;
 +
    background-color: #33AA33;
 +
    border-width: 2px;
 +
}
 +
 
 +
#navbar ul li a:visited, #navbar ul li a:link{
 +
    display:block;
 +
    height:78px;
 +
    color:#FFFFFF;
 +
    /*background-color:#F7941E;*/
 +
    padding-left: 19px;
 +
    padding-right: 19px;
 +
}
 +
 
 +
li#nav-interactive{
 +
    float:right !important;
 +
}
 +
a#nav-interactive-a{
 +
    padding-left:21px !important;
 +
    padding-right:21px !important;
}
}
-
 
+
#navbar ul li a:hover, #navbar ul li a.selected {
-
/*** position the genomikon logo ***/
+
    color: #000000;
-
#top-strip a img{
+
    text-decoration:none;
-
        position:absolute;
+
    left:auto;
-
                    top:38px;
+
    background-image:url(https://static.igem.org/mediawiki/2011/4/4b/Alberta_navbar_hover.png);
-
                            left:0;
+
-
                                      width:auto;
+
-
                                                height:79px;
+
}
}
-
/*** navbar styling **/
+
#navbar li.headlink ul{
-
#navbar {
+
    position: absolute;
-
width:1050px;
+
    display:none;
-
        position:absolute;
+
    list-style:none;
-
        top:16px;
+
    color:#000000;
-
left:-25px;
+
    text-align:center;
-
font-size:11px;
+
}
-
}  
+
-
#navbar ul {
+
#navbar li.headlink ul li {
-
        list-style:none;
+
  width: 280px;
-
      /* list-style-type:none;*/
+
-
margin:0;
+
-
padding:0;
+
-
/*overflow:hidden;*/
+
-
/* for IE */
+
-
  filter:alpha(opacity=96);
+
-
  /* CSS3 standard */
+
-
  opacity:0.96;
+
-
           
+
}
}
-
#navbar ul li{
+
 
-
        float:left;
+
/* CONTENT SECTION */
-
      position:relative;
+
#content {
 +
    width: 1000px;
 +
    border: 0px;
 +
    padding: 0px;
 +
    margin-top: 0px;
}
}
-
#navbar ul li a:visited,#navbar ul li a:link{
+
h1.firstHeading { display:none; }
-
display:block;
+
-
width:150px;
+
-
height:28px;
+
-
color:#FFFFFF;
+
-
background-color:#F7941E;
+
-
text-align:center;
+
 +
#catlinks { display: none; }
 +
 +
#contentSub { margin: 0px; }
 +
 +
p { margin: 0px; }
 +
 +
#top-content {
 +
    background-color: #ffffff;
 +
    height: 125px;
 +
    //width: 970px; /* maybe change height, width to fit image */
 +
    //margin-left: 15px;
 +
    //margin-right: 15px;
 +
    padding-top: 10px;
 +
    background-image:url(https://static.igem.org/mediawiki/2011/9/99/Alberta_banner_back.png)
}
}
-
#navbar ul li a:hover,#navbar ul li a.selected {
 
-
background-color:#3C2415;
 
-
text-decoration:none;
 
-
left:auto;
 
 +
img.ta {
 +
    position: relative;
 +
    float: left;
 +
    left: 20px;
 +
}
 +
img.igem {
 +
    position: relative;
 +
    float: right;
 +
    right: 20px;
 +
    top: 15px;
 +
    width: 120px;
}
}
-
#navbar li.headlink ul{
+
#main-content {
-
        display:none;
+
    /*//color: #808080;*/
-
list-style:none;
+
    /*//background-color: white;*/
-
background-color:#3C2415;                            
+
    margin-left:15px;
-
                                              text-align:center;
+
    margin-right: 15px;
-
                                                  padding:6px,0px;
+
-
                                                 
+
-
                                                                  position:absolute;
+
-
                                                                         
+
-
                                                                                     
+
}
}
-
#navbar li.headlink ul li{
+
 
-
        float:center;
+
#main-content table.student-table td {
 +
    padding-left: 0px;
 +
    padding-top: 0px;
 +
    padding-right: 5px;
 +
    padding-bottom: 5px;
}
}
 +
#main-content table.student-table td img:hover {
 +
    cursor: pointer;
 +
}
-
/*
+
#main-content h2 {
-
div#navbar {
+
    font-weight: bold;
-
    width: 900px;
+
    font-size: 18px;
 +
    color: #f19232;
 +
    border-width: 0px;
}
}
-
#navbar {
+
 
-
        position:absolute;
+
#main-content h3 {
-
        top:200px;
+
    font-weight: bold;
 +
    font-size: 16px;
 +
    color: #000000;
 +
    border-width: 0px;
}
}
-
#navbar ul {
+
 
-
        list-style:none;
+
#main-content h4 {
-
            width:100%;
+
    color: #5db54b;
}
}
-
#navbar ul li{
+
 
-
        float:left;
+
 
-
        position:relative;
+
#main-content td{
 +
    /*color: #808080;*/
 +
    text-align: justify;
 +
    padding: 8px;
}
}
-
#navbar ul li a:visited,#navbar ul li a:link{
+
 
-
        margin-right:30px;
+
#ingenuity-button, #cost-button, #sustainability-button {
-
            color:#fff;
+
    border-style: solid;
-
                 
+
    border-color: #808080;
 +
    border-width: 1px;
 +
    height: 50px;
 +
    width: 290px;
 +
    margin: 5px;
 +
    text-align: center;
 +
    font-size: 20px;
}
}
-
#navbar ul li a:hover,#navbar ul li a.selected {
+
 
-
  text-decoration: underline;
+
#main-content td a:link { color: #f19232; }
-
  font-weight: bold;
+
#main-content td a:visited { color: #f19232; }
-
        color:#3C2415;
+
#main-content td a:active { color: #f19232; }
-
                  text-decoration:none;
+
#main-content td a:hover { color: #f19232; }
 +
 
 +
#page-content a:link { color: #f19232; }
 +
#page-content a:visited { color: #f19232; }
 +
#page-content a:active { color: #f19232; }
 +
#page-content a:hover { color: #f19232; }
 +
 
 +
.frontpage-slide a:link { color: #f19232; }
 +
.frontpage-slide a:visited { color: #f19232; }
 +
.frontpage-slide a:active { color: #f19232; }
 +
.frontpage-slide a:hover { color: #f19232; }
 +
 
 +
#top-pictures {
 +
    margin-top: 30px;
 +
    margin-bottom: 10px;
 +
    margin-left: 40px;
 +
    margin-right: 40px;
 +
    border-style: solid;
 +
    border-width: 1px;
 +
    border-color: #808080;
}
}
-
#navbar li.headlink ul{
+
 
-
        display:table;
+
#top-pictures .pictures {
-
                    display:none;
+
    background-color: transparent;
-
                                background-color:#F7941E;
+
    border-spacing: 5px;
-
                                              text-align:left;
+
-
                                                  padding:10px;
+
-
                                                              z-index:20;
+
-
                                                                  position:absolute;
+
-
                                                                                left:-10px;
+
-
                                                                                        width:100%;
+
}
}
-
#navbar li.headlink ul li{
+
 
-
        float:center;
+
#top-pictures .pictures td:hover {
 +
    background-color: #ffffff;
}
}
-
*/
 
 +
#top-pictures .pictures td {
 +
    font-weight: bold;
 +
    font-size: 14px;
 +
    text-align: center;
 +
    width: 20px;
 +
    border-style: solid;
 +
    border-width: 1px;
 +
    border-color: #808080;
 +
}
 +
#the-plan {
 +
    background-color: #fffcd5;
 +
    width: 400px;
 +
    text-align: justify;
 +
    font-size: 12px;
 +
    padding: 20px;
 +
}
-
/* make a content area in center and a sidebar on each side*/
+
#page-title {
-
#left-sidebar, #right-sidebar, #center-content, #wide-content{
+
    color: #33aa33; /*TODO get correct green*/
-
        float:left;
+
    font-size: 24px;
-
                  /* leave space for header */
+
    font-weight: bold;
-
                  margin-top:160px;
+
    margin-top: 25px;
-
                      min-height:1em;
+
    margin-bottom: 17px;
 +
    height: 20px;
 +
    background-image:url(https://static.igem.org/mediawiki/2011/e/e2/Horiz-green-bar.png);
}
}
-
#left-sidebar.not-top, #right-sidebar.not-top, #center-content.not-top, #wide-content.not-top{
+
.section-title {
-
        margin-top:0;
+
    color: #33aa33; /*TODO get correct green*/
 +
    font-size: 24px;
 +
    font-weight: bold;
 +
    margin-top: 10px;
 +
    margin-bottom: 10px;
 +
    height: 20px;
 +
    background-image:url(https://static.igem.org/mediawiki/2011/e/e2/Horiz-green-bar.png);
}
}
-
#center-content{
+
/* green bar */
-
        width:550px;  
+
#page-title-text{
 +
    background-color: #fff;
 +
    padding-right: 10px;
}
}
-
/*The centre content for the Timeline needs to be a bit wider*/
+
#section-title {
-
#center-content .timeline{
+
    font-color: #33aa33; /*TODO get correct green*/
-
        width:800px;
+
    font-size: 24px;
-
                  float:none;
+
    font-weight: bold;
 +
    margin-top: 10px;
 +
    margin-bottom: 10px;
}
}
-
#wide-content{
+
 
-
        width:1075px;
+
#interact-title {
 +
    color: #f19232;
 +
    font-weight: bold;
 +
    font-size: 16px;
}
}
-
#left-sidebar, #right-sidebar{
+
#round-pic {
-
  margin-top:160px;
+
    border-style: solid;
-
        width:198px;
+
    border-radius: 25px;
 +
    border-color: #808080;
 +
    border-width: 2px;
}
}
-
/*Need Timeline to start at left*/
+
 
-
#left-sidebar .Timeline{
+
#media-pic {
-
        width:0px;
+
    border-style: solid;
 +
    border-color: #808080;
 +
    border-width: 2px;
}
}
-
#left-sidebar{
+
 
-
        margin-right:20px;
+
/* PAGE LAYOUT SECTION */
 +
 
 +
#contents-box {
 +
    float: left;
 +
    height: 600px;
 +
    //width: 160px;
 +
    width: 225px;
 +
    margin: 12px 0px;
 +
    padding: 5px 10px;
 +
    background-color: #ccc;
}
}
-
#right-sidebar{
+
 
-
        border:none;
+
#contents-box ul{
-
                  margin-left:20px;
+
    list-style: none;
}
}
-
#tourbar-back{
+
#subpage-links li {
-
        clear:both;
+
    margin-top: 20px;
-
                  height: 3px;
+
-
                              width: 100%;
+
-
                                        background-color: #EEEEEE;
+
}
}
-
/* the tourbar */
+
 
-
#tourbar{
+
#subpage-links a {
-
        clear:both;
+
    font-size: 14px;
-
                  height:5em;
+
    color: #555;
-
                            margin:173px auto 4em;
+
-
                                        width:788px;
+
}
}
-
#tourbar a{
 
-
        background:none repeat scroll 0 0 #CCCCCC;
 
-
                      color:black;
 
-
                                display:block;
 
-
                                            float:left;
 
-
                                                      height:1em;
 
-
                                                                  padding:3em 0;
 
-
                                                                              text-align:center;
 
-
                                                                                  vertical-align:middle;
 
-
                                                                                      font-weight: bold;
 
-
                                                                                          width:100px;
 
-
                                                                                                    margin-right:5px;
 
-
                                                                                                        margin-left:5px;
 
-
                                                                                                            -moz-border-radius: 10px;
 
-
                                                                                                                border-radius: 10px;
 
 +
#active-subpage {
 +
    font-weight: bold;
 +
    font-size: 16px;
}
}
-
#tourbar a:hover{
+
#subpage-links ul li{
-
        text-decoration: none;
+
    margin-top: 0px;
-
            filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
+
}
-
                      -moz-opacity: 0.5;
+
-
                          opacity: 0.5;
+
 +
#page-content{
 +
    float: right;
 +
    width: 685px;
}
}
-
#tourbar a.selected{
+
 
-
        margin-top:1em;
+
.page-content-full{
}
}
-
#tourbar a.left{
+
 
-
        background-color:white;
+
 
-
            background-image:url("/wiki/images/d/da/Team-alberta-left-arrow.png");
+
 
-
                background-repeat:no-repeat;
+
.frontpage-content-right{
-
                    width:54px;
+
    float: right;
 +
    width: 340px;
}
}
-
#tourbar a.right{
+
.frontpage-content-left{
-
        background-color:white;
+
    float: left;
-
            background-image:url("/wiki/images/6/6f/Team-alberta-right-arrow.png");
+
    width: 600px;
-
                background-repeat:no-repeat;
+
-
                    width:54px;
+
}
}
-
/* the info boxes on homepage */
+
 
-
#main-info-box,#info-box1,#info-box2,#info-box3,#info-box4{
+
img.sponsor-logo {
-
        height:250px;
+
    width: 188px;
-
                  padding:18px;
+
    margin: 10px 25px;
-
                              z-index:-1;
+
-
                                  float:left;
+
}
}
-
#info-box1 ol,#info-box2 ol,#info-box3 ol,#info-box4 ol {
+
 
-
        margin-left: 1em;
+
div#sponsor-page-logos img {
 +
    width: 175px;
 +
    margin: 10px 25px;
}
}
-
#main-info-box {
+
/* FOOTER SECTION */
-
        width:550px;
+
/* custom footer */
-
                  overflow:hidden;
+
#content-footer-box {
-
                              padding:0;
+
    //width: 970px;
-
                                          height:286px;
+
    background-color: #ccc;
-
                                                      position: relative;
+
    color: #888;
-
                                                                    z-index: 10;
+
    margin: auto;
 +
    margin-top: 20px;
 +
    padding: 0px;
 +
    border: 0px;
}
}
-
#tinted-info-box {
+
#content-footer-box ul{
-
        width:100%
+
    list-style: none;
-
                      overflow:hidden;
+
}
-
                  padding:10px;
+
-
                              height:286px;
+
-
                                        clear:both;
+
-
                                                  background-color: #00F2BC;
+
-
                                                     
+
 +
#content-footer-box li {
 +
    /*background-color: white;*/
 +
    margin: 0.5em 0;
}
}
-
#left-gray-box {
+
#content-footer-box li a {
-
        width:100%;
+
    color: #888;
-
                  padding-left: 10px;
+
-
                      background-color: #e6e6e6;
+
}
}
-
#info-box1,#info-box2,#info-box3,#info-box4 {
+
/*wiki standard footer */
-
        background-color:#00CDD0;
+
#footer-box {
-
            color:#FFFCD5;
+
    width: 960px;
-
                      overflow:hidden;
+
    background-color: #ccc;
-
                                  width:228px;
+
    margin-top: 0px;
-
                                            margin-top: 18px;
+
    padding: 20px;
-
                                                cursor: pointer;
+
    border: 0px;
-
                                                            -moz-border-radius: 10px;
+
}
-
                                                                border-radius: 10px;
+
 +
.footer-left-half{
 +
    width: 500px;
 +
    float: left;
}
}
-
#info-box1 h2,#info-box2 h2,#info-box3 h2,#info-box4 h2{
+
 
-
        color:#FFFCD5;
+
.footer-right-half{
-
                  text-align:center;
+
    width: 500px;
-
                      text-transform:uppercase;
+
    float: right;
}
}
-
#info-box1 p,#info-box2 p,#info-box3 p,#info-box4 p{
+
 
-
        color:#000
+
.footer-left-col{
 +
    width: 200px;
 +
    float: left;
 +
    padding: 20px 10px;
 +
    padding-left: 20px;
}
}
-
.right-info-box{
+
 
 +
.footer-right-left-col{
 +
    width: 210px;
 +
    float: left;
 +
    padding: 20px 10px;
 +
    padding-left: 10px;
}
}
-
.center-info-box{
+
 
-
        float:left;
+
.footer-right-left-col ul{
 +
    margin: 0px;
}
}
-
/* software */
+
 
-
#tourbar a.software{
+
.footer-right-col{
-
        background-color:#B5FFEE;
+
    width: 230px;
 +
    float: right;
 +
    padding: 20px 10px;
}
}
-
#info-box1{
+
 
-
        margin-top:0;
+
.footer-right-right-col{
-
        /*    background-color:#00cdd0;*/
+
    width: 240px;
-
            background-color:#B5FFEE;
+
    float: right;
-
                margin-left:12px;
+
    padding: 20px 10px;
}
}
-
#info-box1:hover {
+
input.searchInput {
-
        background-color: #93DDB4
+
}
 +
input.searchButton {
 +
    font-weight: bold;
 +
    color: #888;
 +
    margin: 0;
}
}
-
/* kit box */
+
.clear {
-
#tourbar a.kit {
+
    clear:both;
-
        background-color:#b8fed1;
+
}
}
 +
#clear {
 +
    clear:both;
 +
}
 +
 +
 +
 +
/*
 +
* jQuery FlexSlider v1.7
 +
* http://flex.madebymufffin.com
 +
*
 +
* Copyright 2011, Tyler Smith
 +
* Free to use under the MIT license.
 +
* http://www.opensource.org/licenses/mit-license.php
 +
*/
 +
 +
/* Browser Resets */
 +
.flex-container a:active,
 +
.flexslider a:active {outline: none;}
 +
.slides,
 +
.flex-control-nav,
 +
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}
 +
 +
/* FlexSlider Necessary Styles
 +
*********************************/
 +
.flexslider {width: 100%; margin: 0; padding: 0;}
 +
.flexslider .slides > li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */
 +
.flexslider .slides img {max-width: 100%; display: block;}
 +
.flex-pauseplay span {text-transform: capitalize;}
 +
 +
/* Clearfix for the .slides element */
 +
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
 +
html[xmlns] .slides {display: block;}
 +
* html .slides {height: 1%;}
 +
 +
/* No JavaScript Fallback */
 +
/* If you are not using another script, such as Modernizr, make sure you
 +
* include js that eliminates this class on page load */
 +
.no-js .slides > li:first-child {display: block;}
 +
 +
 +
/* FlexSlider Default Theme
 +
*********************************/
 +
.flexslider {background: #fff;
 +
    /*border: 4px solid #fff; */
 +
    position: relative; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; zoom: 1;}
 +
.flexslider .slides {zoom: 1;}
 +
.flexslider .slides > li {position: relative;}
 +
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */
 +
.flex-container {zoom: 1; position: relative;}
 +
 +
/* Caption style */
 +
/* IE rgba() hack */
 +
.flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
 +
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;}
 +
.flex-caption {width: 96%; padding: 2%; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;}
-
#info-box2{
+
/* Direction Nav */
-
        /*background-color: # b8fed1;*/
+
.flex-direction-nav li a {
-
        background-color:#D6FFE2;
+
    width: 52px;
 +
    height: 52px;
 +
    margin: -13px 0 0;
 +
    display: block;  
 +
    background: url(https://static.igem.org/mediawiki/2011/7/7b/Alberta_arrows.png) no-repeat 0 0;
 +
    position: absolute;
 +
    top: 42%;
 +
    cursor: pointer;
 +
    text-indent: -9999px;
}
}
-
#info-box2:hover {
+
 
-
        /*background-color:#9AC2FD;*/
+
.flex-direction-nav li a.next {background-position: -52px 0; right: 0px;}
-
        background-color:#A6FFC0;
+
.flex-direction-nav li a.prev {background-position: 0 0; left: 0px;}
 +
.flex-direction-nav li a.disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}
 +
 
 +
/* Control Nav */
 +
.flex-control-nav {
 +
    width: 100%;
 +
    position: absolute;
 +
    bottom: 30px;
 +
    left: 58px;
 +
    text-align: center;
}
}
-
/* achievments boxes*/
+
.flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;}
-
#tourbar a.achievements{
+
.flex-control-nav li:first-child {margin: 0;}
-
        background-color:#B4FFC9;
+
.flex-control-nav li a {width: 13px; height: 13px; display: block; background: url(https://static.igem.org/mediawiki/2011/a/aa/Alberta_control_nav.png) no-repeat 0 0; cursor: pointer; text-indent: -9999px;}
 +
.flex-control-nav li a:hover {background-position: 0 -13px;}
 +
.flex-control-nav li a.active {background-position: 0 -26px; cursor: default;}
 +
 
 +
/* END flexslider styling ***************************************************/
 +
 
 +
.flexslider {
 +
    width: 950px;
 +
    margin: 20px 10px 0px;
}
}
-
#info-box3{
+
 
-
     /*    background-color:# 7 3FF9A;*/
+
div.frontpage-slide {
-
        background-color:#B4FFC9;
+
     height: 300px;
-
            margin-left:17px;
+
    background-color: #CCC;
}
}
-
#info-box3:hover {
+
 
-
        background-color:#93DDb8;
+
div.frontpage-slide img{
 +
    height: 300px;
 +
    float: left;
}
}
-
/* biobytes boxes */
+
div.slide-right-col {
-
#tourbar a.biobytes{
+
    color: #33AA33;
-
        background-color:#BCD7FF;
+
    float: right;
 +
    width: 400px;
 +
    font-size: 16px;
 +
    margin-top: 30px;
 +
    margin-right: 50px;
 +
    line-height: 1.5em;
}
}
-
#info-box4 {
+
 
-
     /*    background-color:#00F2BC;*/
+
div.slide-heading {
-
        background-color:#BCD7FF;
+
     font-size: 30px;
-
            margin-left:18px;
+
    font-weight: bold;
 +
    margin-bottom: 20px;
}
}
-
#info-box4:hover {
+
 
-
    /*    background-color:#33f5f6;*/
+
.tweet,
-
        background-color:#9AC2FD;
+
.query {
 +
font: 120% Georgia, serif;
 +
color: #085258;
}
}
 +
.tweet_list {
 +
    -webkit-border-radius: 0.5em;
 +
    -moz-border-radius: 0.5em;
 +
    border-radius: 0.5em;
 +
    list-style: none;
 +
    margin: 0;
 +
    padding: 0;
 +
    overflow-y: hidden;
 +
    background-color: #8ADEE2;
 +
}
 +
.tweet_list .awesome,
 +
.tweet_list .epic {
 +
    text-transform: uppercase;
 +
}
 +
 +
.tweet_list li {
 +
    overflow-y: auto;
 +
    overflow-x: hidden;
 +
    padding: 0.5em;
 +
}
 +
 +
.tweet_list li a {
 +
    color: #0C717A;
 +
}
 +
 +
.tweet_list .tweet_even {
 +
    background-color: #91E5E7;
 +
}
-
/* parts table */
+
.tweet_list .tweet_avatar {
-
#mytable
+
    padding-right: .5em; float: left;
-
{
+
-
        width: 100%;
+
-
                padding: 0;
+
-
                            margin: 0;
+
}
}
-
#mytable th
+
.tweet_list .tweet_avatar img {
-
{
+
    vertical-align: middle;
-
      background-color:#FFFCD5;
+
-
        color:#fff;
+
-
                padding:6px 6px 6px 12px;
+
-
                          text-align:left;
+
}
}
-
#mytable td
+
 
-
{
+
 
-
        background: #ccc;
+
div#interact-links {
-
                        padding: 0.3em 0.3em 0.3em 0.7em;
+
    text-align: center;
-
                                    color: #FFFCD5;
+
}
}
 +
a#int-fb {
 +
    float: left;
 +
    margin-left: 25px;
 +
}
-
#mytable td.alt
+
a#int-twitter {
-
{
+
    margin: 0 auto;
-
        background: #ffffff;
+
-
                        color: #FFFCD5;
+
}
}
-
#mytable th.spec
+
a#int-youtube {
-
{
+
    float: right;
-
        background: #a5a5a5 no-repeat;
+
    margin-right: 25px;
-
                        font: bold 1em "Trebuchet MS", Times;
+
-
                                      color: #ffffff;
+
}
}
-
#mytable th.specalt
+
a#sustainability-img {
-
{
+
    float:right;
-
        background: #ffffff no-repeat;
+
    width: 184px;
-
                        font: bold 1em "Trebuchet MS", Times;
+
    height: 100px;
-
                                color: #656565;
+
    background:url(https://static.igem.org/mediawiki/2011/c/cc/Alberta_sustainability.png) bottom;
 +
    text-indent: -99999px
}
}
-
#mytable a:visited, #mytable a:link, #mytable a:hover{
+
 
-
        color:#FFFCD5;
+
a#costefficiency-img {
-
                  text-decoration:underline;
+
    display: block;
 +
    margin: 0 auto;
 +
    width: 184px;
 +
    height: 100px;
 +
    background:url(https://static.igem.org/mediawiki/2011/b/b5/Alberta_costefficiency.png) bottom;
 +
    text-indent: -99999px
}
}
-
#mytable a:hover {
+
 
-
        color:#00F2BC;
+
a#ingenuity-img {
 +
    float: left;
 +
    width: 184px;
 +
    height: 100px;
 +
    background:url(https://static.igem.org/mediawiki/2011/a/a7/Alberta_ingenuity.png) bottom;
 +
    text-indent: -99999px
}
}
-
/********* things we changed ***********/
+
a#wiki-tour-link img {
 +
    margin: 20px 0px;
 +
}
 +
a#sustainability-img:hover { background-position: 0 0; }
 +
a#costefficiency-img:hover { background-position: 0 0; }
 +
a#ingenuity-img:hover { background-position: 0 0; }
-
#toctitle, span.tocnumber {
+
img.tour-img {
-
      display:none;
+
    width: 150px;
}
}
-
.toclevel-1{
+
 
-
      margin-bottom:1em;
+
#wiki-tour-table td {
 +
    text-align: left;
 +
    vertical-align: top;
}
}
-
.toclevel-2{
+
 
-
      display:none;
+
.tweet-container {
 +
    float: left;
 +
    width: 310px;
}
}
-
span.toctext {
+
.fb-container {
-
      color: #3C2415;
+
    float: right;
-
              font-size:14px;
+
    width: 310px;
-
                line-height:14px;
+
}
}
-
#footer-box{
+
div.safety-img {
-
      background-color:#E6E6E6;
+
    float: right;
-
        border:none;
+
    padding: 25px;
-
                margin:100px auto 0;
+
    width: 240px;
-
                          padding:5px;
+
-
                                    width:965px;
+
}
}
-
body {
+
div.safety-img img{
-
      background-color:#F7941E;
+
    width: 220px;
-
      background-image:url("https://static.igem.org/mediawiki/2011/7/74/TeamAlberta-strip2.png");
+
-
      background-repeat:repeat-x;
+
-
      font-family:corbel;
+
-
      text-align:justify;
+
}
}
-
#thanks-footer{
+
div.supervisor-left {
-
        position: relative;
+
    float:left;
-
                      width: 1032px;
+
}
-
                                left: 0px;
+
div.supervisor-right {
-
                                          clear:both;
+
    float:right;
-
                                                    background-color: #DDDDDD;
+
    width:500px;
-
                                                        top: 12px;
+
-
                                                                  border-radius: 10px;
+
-
                                                                      -moz-border-radius: 10px;
+
-
                                                                          text-align: center;
+
}
}
-
/* new colors */
+
div.student-large {
 +
    float:left;
 +
}
 +
div.student-thumbs {
 +
    float:right;
 +
    width:300px;
 +
}
-
h1, h2, h3, h4, h5, h6 {
+
ol#reference-list {
-
        color: #3c2415;
+
    list-style-type: lower-roman;
-
                  border:none;
+
-
font-family:eurostile;
+
}
}
-
h2 {
+
ul#subpage-links li a.selected {
-
        line-height:125%;
+
    text-transform:uppercase;
 +
    font-weight: bold;
 +
    font-size: 16px;
}
}
-
h3{
+
ul#subpage-links li ul {
-
      font-size:100%;
+
    display:none;
-
          font-weight:normal;
+
-
            position:relative;
+
-
                        top:-1em;
+
-
                                color: #3c2415;
+
-
                                          font-style: italic;
+
-
                                            margin-bottom: -0.5em;
+
}
}
-
span.editsection, span.editsection a{
+
ul#subpage-links li ul.selected {
-
        color:#ccc;
+
    display: block;
}
}
-
body{
+
 
-
        background-color:#fff;
+
#content {
 +
    /*background-color:transparent;
 +
    background-image:url(https://static.igem.org/mediawiki/2011/b/b8/Background-translucent.png);*/
}
}
-
#content{
 
-
        border:none;
 
-
                            padding:0;
+
table.figure {
-
background:none;
+
    border-spacing:0px;
 +
    border-bottom: 2px solid black;
 +
}
 +
table.figure th{
 +
    /*max-width: 200px;*/
 +
    padding-left: 5px;
 +
    padding-right: 5px;
 +
}
 +
tr.top td, tr.top th{
 +
    border-top: 2px solid black;
 +
    border-bottom: 2px solid black;
 +
}
 +
 +
th.border_bottom {
 +
    border-bottom: 2px solid black;
 +
}
 +
 +
tr.top_top td, tr.top_top th{
 +
    border-top: 2px solid black;
 +
}
 +
tr.top_bottom td, tr.top_bottom th{
 +
    border-bottom: 2px solid black;
 +
}
 +
 +
table.figure td {
 +
    color: #333 !important;
 +
    text-align: center !important;
 +
}
 +
 +
table.figure tr.odd td, table.figure tr.odd th {
 +
    background-color: #ccc;
 +
}
 +
 +
table#wiki-tour {
 +
    color: black;
 +
}
 +
 +
img.overview-link {
 +
    width: 250px;
 +
}
 +
img.content-img {
 +
    margin: 10px;
 +
}
 +
img.content-img-left {
 +
    margin: 10px;
 +
    float:left;
 +
}
 +
img.content-img-right {
 +
    margin: 10px;
 +
    float:right;
}
}

Latest revision as of 17:33, 28 September 2011

/* Style sheet for 2011 wiki page */


/* Colors:

grey: 959995 orange navbar: f09131 orange box: f19232 beige: fffcd5 green: 5db54b

  • /
  1. menubar a:visited { color: transparent; }

body {

   //background-color: #959995;
   //background-color: #757575;
   //background-color: #ffffff;
   //background-color: #555555;
   font-family: verdana;
   background-color: #ddd;
   background-attachment: fixed;

} /* TOP MENU SECTION*/

  1. top-section {
   width: 1000px;
   height: auto;
   border: 0px;
   padding: 0px;
   margin-bottom: 0px;

}

  1. firstHeading {
   display: none;

}

  1. p-logo {
   display: none;

}

.left-menu, .right-menu {

   margin: 2px;

}

.left-menu:hover, .right-menu ul li a {

   background-color: transparent;

}

.right-menu li a {

   color: transparent;

}

.left-menu:hover ul li a, .right-menu:hover ul li a {

   color: #959995;

}

.left-menu li {

   color: transparent !important;

}

  1. search-controls {
   display: none;

}

/* NAVBAR SECTION ... which is really part of content */

  1. navbar {
   //width: 950px;
   /*background-color: #f09131;*/
   //margin-left:15px;
   //margin-right:15px;
   //padding-left: 10px;
   //padding-right: 10px;
   height: 78px;
   /*border-radius: 2px;*/
   background-image:url(Alberta_navbar_green2.png)

}

  1. navbar ul {
   list-style:none;
   margin: 0px;
   font-size: 16pt;

}

  1. navbar ul li {
   position:relative;
   float:left;
   margin: 0px;
   height: 78px;

}

  1. navbar ul li ul {
   border-style: solid;
   border-color: #3C2415;
   background-color: #33AA33;
   border-width: 2px;

}

  1. navbar ul li a:visited, #navbar ul li a:link{
   display:block;
   height:78px;
   color:#FFFFFF;
   /*background-color:#F7941E;*/
   padding-left: 19px;
   padding-right: 19px;

}

li#nav-interactive{

   float:right !important;

} a#nav-interactive-a{

   padding-left:21px !important;
   padding-right:21px !important;

}


  1. navbar ul li a:hover, #navbar ul li a.selected {
   color: #000000;
   text-decoration:none;
   left:auto;
   background-image:url(Alberta_navbar_hover.png);

}

  1. navbar li.headlink ul{
   position: absolute;
   display:none;
   list-style:none;
   color:#000000;
   text-align:center;

}

  1. navbar li.headlink ul li {
  width: 280px;

}

/* CONTENT SECTION */

  1. content {
   width: 1000px;
   border: 0px;
   padding: 0px;
   margin-top: 0px;

}

h1.firstHeading { display:none; }

  1. catlinks { display: none; }
  1. contentSub { margin: 0px; }

p { margin: 0px; }

  1. top-content {
   background-color: #ffffff;
   height: 125px;
   //width: 970px; /* maybe change height, width to fit image */
   //margin-left: 15px;
   //margin-right: 15px;
   padding-top: 10px;
   background-image:url(Alberta_banner_back.png)

}

img.ta {

   position: relative;
   float: left;
   left: 20px;

}

img.igem {

   position: relative;
   float: right;
   right: 20px;
   top: 15px;
   width: 120px;

}

  1. main-content {
   /*//color: #808080;*/
   /*//background-color: white;*/
   margin-left:15px;
   margin-right: 15px;

}

  1. main-content table.student-table td {
   padding-left: 0px;
   padding-top: 0px;
   padding-right: 5px;
   padding-bottom: 5px;

}

  1. main-content table.student-table td img:hover {
   cursor: pointer;

}

  1. main-content h2 {
   font-weight: bold;
   font-size: 18px;
   color: #f19232;
   border-width: 0px;

}

  1. main-content h3 {
   font-weight: bold;
   font-size: 16px;
   color: #000000;
   border-width: 0px;

}

  1. main-content h4 {
   color: #5db54b;

}


  1. main-content td{
   /*color: #808080;*/
   text-align: justify;
   padding: 8px;

}

  1. ingenuity-button, #cost-button, #sustainability-button {
   border-style: solid;
   border-color: #808080;
   border-width: 1px;
   height: 50px;
   width: 290px;
   margin: 5px;
   text-align: center;
   font-size: 20px;

}

  1. main-content td a:link { color: #f19232; }
  2. main-content td a:visited { color: #f19232; }
  3. main-content td a:active { color: #f19232; }
  4. main-content td a:hover { color: #f19232; }
  1. page-content a:link { color: #f19232; }
  2. page-content a:visited { color: #f19232; }
  3. page-content a:active { color: #f19232; }
  4. page-content a:hover { color: #f19232; }

.frontpage-slide a:link { color: #f19232; } .frontpage-slide a:visited { color: #f19232; } .frontpage-slide a:active { color: #f19232; } .frontpage-slide a:hover { color: #f19232; }

  1. top-pictures {
   margin-top: 30px;
   margin-bottom: 10px;
   margin-left: 40px;
   margin-right: 40px;
   border-style: solid;
   border-width: 1px;
   border-color: #808080;

}

  1. top-pictures .pictures {
   background-color: transparent;
   border-spacing: 5px;

}

  1. top-pictures .pictures td:hover {
   background-color: #ffffff;

}

  1. top-pictures .pictures td {
   font-weight: bold;
   font-size: 14px;
   text-align: center;
   width: 20px;
   border-style: solid;
   border-width: 1px;
   border-color: #808080;

}

  1. the-plan {
   background-color: #fffcd5;
   width: 400px;
   text-align: justify;
   font-size: 12px;
   padding: 20px;

}

  1. page-title {
   color: #33aa33; /*TODO get correct green*/
   font-size: 24px;
   font-weight: bold;
   margin-top: 25px;
   margin-bottom: 17px;
   height: 20px;
   background-image:url(Horiz-green-bar.png);

}

.section-title {

   color: #33aa33; /*TODO get correct green*/
   font-size: 24px;
   font-weight: bold;
   margin-top: 10px;
   margin-bottom: 10px;
   height: 20px;
   background-image:url(Horiz-green-bar.png);

}

/* green bar */

  1. page-title-text{
   background-color: #fff;
   padding-right: 10px;

}

  1. section-title {
   font-color: #33aa33; /*TODO get correct green*/
   font-size: 24px;
   font-weight: bold;
   margin-top: 10px;
   margin-bottom: 10px;

}

  1. interact-title {
   color: #f19232;
   font-weight: bold;
   font-size: 16px;

}

  1. round-pic {
   border-style: solid;
   border-radius: 25px;
   border-color: #808080;
   border-width: 2px;

}

  1. media-pic {
   border-style: solid;
   border-color: #808080;
   border-width: 2px;

}

/* PAGE LAYOUT SECTION */

  1. contents-box {
   float: left;
   height: 600px;
   //width: 160px;
   width: 225px;
   margin: 12px 0px;
   padding: 5px 10px;
   background-color: #ccc;

}

  1. contents-box ul{
   list-style: none;

}

  1. subpage-links li {
   margin-top: 20px;

}

  1. subpage-links a {
   font-size: 14px;
   color: #555;

}

  1. active-subpage {
   font-weight: bold;
   font-size: 16px;

}

  1. subpage-links ul li{
   margin-top: 0px;

}

  1. page-content{
   float: right;
   width: 685px;

}

.page-content-full{ }


.frontpage-content-right{

   float: right;
   width: 340px;

} .frontpage-content-left{

   float: left;
   width: 600px;

}

img.sponsor-logo {

   width: 188px;
   margin: 10px 25px;

}

div#sponsor-page-logos img {

   width: 175px;
   margin: 10px 25px;

}

/* FOOTER SECTION */ /* custom footer */

  1. content-footer-box {
   //width: 970px;
   background-color: #ccc;
   color: #888;
   margin: auto;
   margin-top: 20px;
   padding: 0px;
   border: 0px;

}

  1. content-footer-box ul{
   list-style: none;

}

  1. content-footer-box li {
   /*background-color: white;*/
   margin: 0.5em 0;

}

  1. content-footer-box li a {
   color: #888;

}

/*wiki standard footer */

  1. footer-box {
   width: 960px;
   background-color: #ccc;
   margin-top: 0px;
   padding: 20px;
   border: 0px;

}

.footer-left-half{

   width: 500px;
   float: left;

}

.footer-right-half{

   width: 500px;
   float: right;

}

.footer-left-col{

   width: 200px;
   float: left;
   padding: 20px 10px;
   padding-left: 20px;

}

.footer-right-left-col{

   width: 210px;
   float: left;
   padding: 20px 10px;
   padding-left: 10px;

}

.footer-right-left-col ul{

   margin: 0px;

}

.footer-right-col{

   width: 230px;
   float: right;
   padding: 20px 10px;

}

.footer-right-right-col{

   width: 240px;
   float: right;
   padding: 20px 10px;

}

input.searchInput { } input.searchButton {

   font-weight: bold;
   color: #888;
   margin: 0;

}

.clear {

   clear:both;

}

  1. clear {
   clear:both;

}


/*

* jQuery FlexSlider v1.7
* http://flex.madebymufffin.com
*
* Copyright 2011, Tyler Smith
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/

/* Browser Resets */ .flex-container a:active, .flexslider a:active {outline: none;} .slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;}

/* FlexSlider Necessary Styles

                                                                  • /

.flexslider {width: 100%; margin: 0; padding: 0;} .flexslider .slides > li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img {max-width: 100%; display: block;} .flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */ .slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .slides {display: block;}

  • html .slides {height: 1%;}

/* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you

* include js that eliminates this class on page load */

.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme

                                                                  • /

.flexslider {background: #fff;

   /*border: 4px solid #fff; */
   position: relative; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; zoom: 1;}

.flexslider .slides {zoom: 1;} .flexslider .slides > li {position: relative;} /* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */ .flex-container {zoom: 1; position: relative;}

/* Caption style */ /* IE rgba() hack */ .flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;} .flex-caption {width: 96%; padding: 2%; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;}

/* Direction Nav */ .flex-direction-nav li a {

   width: 52px; 
   height: 52px; 
   margin: -13px 0 0; 
   display: block; 
   background: url(Alberta_arrows.png) no-repeat 0 0; 
   position: absolute; 
   top: 42%; 
   cursor: pointer; 
   text-indent: -9999px;

}

.flex-direction-nav li a.next {background-position: -52px 0; right: 0px;} .flex-direction-nav li a.prev {background-position: 0 0; left: 0px;} .flex-direction-nav li a.disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */ .flex-control-nav {

   width: 100%; 
   position: absolute; 
   bottom: 30px; 
   left: 58px;
   text-align: center;

}

.flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;} .flex-control-nav li:first-child {margin: 0;} .flex-control-nav li a {width: 13px; height: 13px; display: block; background: url(Alberta_control_nav.png) no-repeat 0 0; cursor: pointer; text-indent: -9999px;} .flex-control-nav li a:hover {background-position: 0 -13px;} .flex-control-nav li a.active {background-position: 0 -26px; cursor: default;}

/* END flexslider styling ***************************************************/

.flexslider {

   width: 950px;
   margin: 20px 10px 0px;

}

div.frontpage-slide {

   height: 300px;
   background-color: #CCC;

}

div.frontpage-slide img{

   height: 300px;
   float: left;

}

div.slide-right-col {

   color: #33AA33;
   float: right;
   width: 400px;
   font-size: 16px;
   margin-top: 30px;
   margin-right: 50px;
   line-height: 1.5em;

}

div.slide-heading {

   font-size: 30px;
   font-weight: bold;
   margin-bottom: 20px;

}

.tweet, .query { font: 120% Georgia, serif; color: #085258; }

.tweet_list {

   -webkit-border-radius: 0.5em;
   -moz-border-radius: 0.5em;
   border-radius: 0.5em;
   list-style: none;
   margin: 0;
   padding: 0;
   overflow-y: hidden;
   background-color: #8ADEE2;

}

.tweet_list .awesome, .tweet_list .epic {

   text-transform: uppercase;

}

.tweet_list li {

   overflow-y: auto;
   overflow-x: hidden;
   padding: 0.5em;

}

.tweet_list li a {

   color: #0C717A;

}

.tweet_list .tweet_even {

   background-color: #91E5E7;

}

.tweet_list .tweet_avatar {

   padding-right: .5em; float: left;

}

.tweet_list .tweet_avatar img {

   vertical-align: middle;

}


div#interact-links {

   text-align: center;

}

a#int-fb {

   float: left;
   margin-left: 25px;

}

a#int-twitter {

   margin: 0 auto;

}

a#int-youtube {

   float: right;
   margin-right: 25px;

}

a#sustainability-img {

   float:right;
   width: 184px;
   height: 100px;
   background:url(Alberta_sustainability.png) bottom;
   text-indent: -99999px

}

a#costefficiency-img {

   display: block;
   margin: 0 auto;
   width: 184px;
   height: 100px;
   background:url(Alberta_costefficiency.png) bottom;
   text-indent: -99999px

}

a#ingenuity-img {

   float: left;
   width: 184px;
   height: 100px;
   background:url(Alberta_ingenuity.png) bottom;
   text-indent: -99999px

}

a#wiki-tour-link img {

   margin: 20px 0px;

}

a#sustainability-img:hover { background-position: 0 0; } a#costefficiency-img:hover { background-position: 0 0; } a#ingenuity-img:hover { background-position: 0 0; }

img.tour-img {

   width: 150px;

}

  1. wiki-tour-table td {
   text-align: left;
   vertical-align: top;

}

.tweet-container {

   float: left;
   width: 310px;

} .fb-container {

   float: right;
   width: 310px;

}

div.safety-img {

   float: right;
   padding: 25px;
   width: 240px;

}

div.safety-img img{

   width: 220px;

}

div.supervisor-left {

   float:left;

} div.supervisor-right {

   float:right;
   width:500px;

}

div.student-large {

   float:left;

} div.student-thumbs {

   float:right;
   width:300px;

}

ol#reference-list {

   list-style-type: lower-roman;

}

ul#subpage-links li a.selected {

   text-transform:uppercase;
   font-weight: bold;
   font-size: 16px;

}

ul#subpage-links li ul {

   display:none;

}

ul#subpage-links li ul.selected {

   display: block;

}

  1. content {
   /*background-color:transparent;
   background-image:url(https://static.igem.org/mediawiki/2011/b/b8/Background-translucent.png);*/

}

table.figure {

   border-spacing:0px;
   border-bottom: 2px solid black;

}

table.figure th{

   /*max-width: 200px;*/
   padding-left: 5px;
   padding-right: 5px;

}

tr.top td, tr.top th{

   border-top: 2px solid black;
   border-bottom: 2px solid black;

}

th.border_bottom {

   border-bottom: 2px solid black;

}

tr.top_top td, tr.top_top th{

   border-top: 2px solid black;

} tr.top_bottom td, tr.top_bottom th{

   border-bottom: 2px solid black;

}

table.figure td {

   color: #333 !important;
   text-align: center !important; 

}

table.figure tr.odd td, table.figure tr.odd th {

   background-color: #ccc;

}

table#wiki-tour {

   color: black;

}

img.overview-link {

   width: 250px;

} img.content-img {

   margin: 10px;

} img.content-img-left {

   margin: 10px;
   float:left;

} img.content-img-right {

   margin: 10px;
   float:right;

}