Team:Marburg SYNMIKRO:Template:stylesheet.css

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
-
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks {
+
/*kasten*/
-
     display:none;}
+
 
 +
#synmikrolink {
 +
position: absolute;
 +
top:-180px;
 +
right:20px;
 +
z-index: 7;
 +
height: 60px;
 +
width:220px;
 +
background-color: transparent;
 +
}
 +
 
 +
#mainpagelink{
 +
position: absolute;
 +
top:-120px;
 +
left:25px;
 +
z-index: 7;
 +
}
 +
 
 +
.conboxs{
 +
    -moz-border-bottom-colors: none;
 +
    -moz-border-left-colors: none;
 +
    -moz-border-right-colors: none;
 +
    -moz-border-top-colors: none;
 +
    background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
 +
    border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
 +
    border-image: none;
 +
    border-radius: 2em 2em 2em 2em;
 +
    border-style: solid solid solid solid;
 +
    border-width: medium;
 +
    box-shadow: 0 1px 3px black;
 +
    float: left;
 +
    width: 45%;
 +
    padding: 10px;
 +
    margin:1%;
 +
}
 +
 +
.conboxb{
 +
    -moz-border-bottom-colors: none;
 +
    -moz-border-left-colors: none;
 +
    -moz-border-right-colors: none;
 +
    -moz-border-top-colors: none;
 +
    background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
 +
    border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
 +
    border-image: none;
 +
    border-radius: 2em 2em 2em 2em;
 +
    border-style: solid solid solid solid;
 +
    border-width: medium;
 +
    box-shadow: 0 1px 3px black;
 +
    float: left;
 +
    width: 95%;
 +
    padding: 10px;
 +
    margin:1%;
 +
}
 +
 +
  .conbox20{
 +
    -moz-border-bottom-colors: none;
 +
    -moz-border-left-colors: none;
 +
    -moz-border-right-colors: none;
 +
    -moz-border-top-colors: none;
 +
    background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
 +
    border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
 +
    border-image: none;
 +
    border-radius: 2em 2em 2em 2em;
 +
    border-style: solid solid solid solid;
 +
    border-width: medium;
 +
    box-shadow: 0 1px 3px black;
 +
    float: left;
 +
    width: 20.25%;
 +
    padding: 10px;
 +
    margin:1%;
 +
}
 +
 +
  .conbox28{
 +
    -moz-border-bottom-colors: none;
 +
    -moz-border-left-colors: none;
 +
    -moz-border-right-colors: none;
 +
    -moz-border-top-colors: none;
 +
    background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
 +
    border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
 +
    border-image: none;
 +
    border-radius: 2em 2em 2em 2em;
 +
    border-style: solid solid solid solid;
 +
    border-width: medium;
 +
    box-shadow: 0 1px 3px black;
 +
    float: left;
 +
    width: 28.5%;
 +
    padding: 10px;
 +
    margin:1%;
 +
}
 +
 +
.conbox60{
 +
    -moz-border-bottom-colors: none;
 +
    -moz-border-left-colors: none;
 +
    -moz-border-right-colors: none;
 +
    -moz-border-top-colors: none;
 +
    background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
 +
    border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
 +
    border-image: none;
 +
    border-radius: 2em 2em 2em 2em;
 +
    border-style: solid solid solid solid;
 +
    border-width: medium;
 +
    box-shadow: 0 1px 3px black;
 +
    float: left;
 +
    width: 62%;
 +
    padding: 10px;
 +
    margin:1%;
 +
}
 +
 +
/* Vertical Navigation */
 +
#vertical-navigation {
 +
list-style: none;
 +
margin: 0;
 +
padding: 0;
 +
font-size: 1.2em;
 +
float: left;
 +
position: absolute;
 +
  background: tranparent;
 +
  top: -32px;
 +
  left: 0px;
 +
  width: 975px;
 +
  z-index:7;
 +
 
 +
}
 +
 
 +
 
 +
/* CSS for each Parent Item */
 +
#vertical-navigation li {
 +
float: left;
 +
position: relative;
 +
width: 150.5px;
 +
background: #E9F3D9;
 +
margin-left: 2px;
 +
margin-right: 2px;
 +
padding-right:8px;
 +
}
 +
 
 +
#vertical-navigation li.home{
 +
background-color: #B8C881;
 +
}
 +
 
 +
#vertical-navigation li.team{
 +
background-color: #B8C881;
 +
}
 +
 
 +
#vertical-navigation li.project{
 +
background-color: #B8C881;
 +
}
 +
 
 +
#vertical-navigation li.notebook{
 +
background-color: #B8C881;
 +
}
 +
 
 +
#vertical-navigation li.safety{
 +
background-color: #B8C881;
 +
}
 +
 
 +
#vertical-navigation li.attributions{
 +
background-color: #B8C881;
 +
}
 +
 
 +
#vertical-navigation li a
 +
{
 +
float: left;
 +
display: block;
 +
padding: 4px;
 +
text-decoration: none;
 +
color: black;
 +
margin-right: 10px;
 +
  text-align: center;
 +
  width: 150.5px;
 +
}
 +
 
 +
/*
 +
Change background color and font color
 +
of parent items when mouse hover
 +
*/
 +
#vertical-navigation li:hover a,
 +
#vertical-navigation li a:hover
 +
{
 +
width: 150.5px;
 +
background: #E9F3D9;
 +
position:relative;
 +
color: black;
 +
text-decoration: none;
 +
}
 +
 
 +
#vertical-navigation li.home:hover a,
 +
#vertical-navigation li home:hover{
 +
background-color: #E077A7;
 +
}
 +
 
 +
#vertical-navigation li.team:hover a,
 +
#vertical-navigation li team:hover{
 +
background-color: #41A9E0;
 +
}
 +
 
 +
#vertical-navigation li.project:hover a,
 +
#vertical-navigation li project:hover{
 +
background-color: #A0B919;
 +
}
 +
 
 +
#vertical-navigation li.notebook:hover a,
 +
#vertical-navigation li notebook:hover{
 +
background-color: #F1DC00;
 +
}
 +
 
 +
#vertical-navigation li.safety:hover a,
 +
#vertical-navigation li safety:hover{
 +
background-color: #D33F18;
 +
}
 +
 
 +
#vertical-navigation li.attributions:hover a,
 +
#vertical-navigation li attributions:hover{
 +
background-color: #8865A7;
 +
}
 +
 
 +
 
 +
/*
 +
Applie to group of Child Items
 +
Each Child Item will be invisible by default
 +
*/
 +
#vertical-navigation ul {display: none;}
 +
 
 +
/* Each Child Item will be visible if mouse hover */
 +
#vertical-navigation li:hover ul {display: block;}
 +
 
 +
#vertical-navigation li.child {
 +
float: left;
 +
position: relative;
 +
width: 146.5px;
 +
background: #00f;
 +
}
 +
 
 +
#vertical-navigation li.child a {
 +
float: left;
 +
position: relative;
 +
width: 146.5px;
 +
}
 +
 
 +
#vertical-navigation ul
 +
{
 +
float: none;
 +
position: absolute;
 +
list-style: none;
 +
margin: 0;
 +
padding: 0;
 +
top: 2em;
 +
left: 0;
 +
}
 +
 
 +
#vertical-navigation ul li
 +
{
 +
float: none;
 +
clear: none;
 +
margin: 0;
 +
padding: 0;
 +
width: 146.5;
 +
color: #999;
 +
}
 +
 
 +
 
 +
/*
 +
Reset and re style
 +
link of each child item
 +
*/
 +
#vertical-navigation li:hover ul li a,
 +
#vertical-navigation ul li a
 +
{
 +
line-height: 200%;
 +
display: block;
 +
padding: 6px 6px 0px 6px;
 +
float: none;
 +
color: #000;
 +
background: #bc5e0a;
 +
  width: 146.5;
 +
  white-space:nowrap;
 +
  text-decoration: none;
 +
}
 +
 
 +
#vertical-navigation li:hover ul li a:hover,
 +
#vertical-navigation ul li a:hover
 +
{
 +
color: #000;
 +
  text-decoration: underline;
 +
 
 +
}
 +
 
 +
 
 +
/*
 +
#footer-box, #p-logo, #search-controls
 +
*/
 +
#contentSub, .firstHeading, #catlinks{
 +
     display:none;}  
#top-section {
#top-section {
     border: none;
     border: none;
     height: 0px;}
     height: 0px;}
-
#content {
 
-
    border: none;}
 
-
/* Logo: #p-logo */
+
 
body {
body {
Line 14: Line 304:
     margin: 0;
     margin: 0;
     padding: 0;
     padding: 0;
-
     background-color: #000000;
+
     background: #333333 url('https://static.igem.org/mediawiki/2012/c/cf/Syn_MR_bgr.jpg') repeat fixed;
}
}
Line 34: Line 324:
#top-section {
#top-section {
     position: relative;
     position: relative;
-
     height: 98px;
+
     height: 254px;
     width: 975px;
     width: 975px;
#    margin-left: 10px;
#    margin-left: 10px;
Line 52: Line 342:
#p-logo {
#p-logo {
-
    position: absolute;
+
height: 254px;
-
    z-index: 1;
+
background: #000000 url('http://web383.mis60.de/inprogress/banner_2.png');
-
    height: 107px;
+
-
    width: 975px;
+
}
}
 +
 +
#p-logo img {
 +
display: none;
 +
}
 +
 +
#p-logo a {
 +
display: none;
 +
}
 +
 +
#p-logo h5 {
#p-logo h5 {
     display: none;
     display: none;
Line 69: Line 367:
position: absolute;
position: absolute;
top:  20px;
top:  20px;
-
right: 15px;
+
right: -8px;
-
width: 150px;
+
width: 180px;
height: 40px;
height: 40px;
background-color: transparent;
background-color: transparent;
Line 81: Line 379:
background: none;
background: none;
border: none;
border: none;
-
color: #AAAAFF;
+
color: black;
-
font-weight: bold;
+
}
}
 +
input.searchButton:hover {
input.searchButton:hover {
-
color: white;
+
font-weight: bold;
 +
  color: black;
 +
  text-decoration: underline;
}
}
 +
#searchInput {
#searchInput {
     width: 10.9em;
     width: 10.9em;
Line 96: Line 397:
#menubar {
#menubar {
     position: absolute;
     position: absolute;
-
    white-space: nowrap;
 
     top: -6px;
     top: -6px;
-
    width: 400px;
 
     z-index: 5;
     z-index: 5;
     font-family: sans-serif;
     font-family: sans-serif;
     font-size: 95%;
     font-size: 95%;
     line-height: 1em;
     line-height: 1em;
 +
    width:340px;
 +
   
}
}
 +
  .left-menu li  {
 +
  font-size: 0%;
 +
  }
 +
 
 +
  .left-menu li a  {
 +
  font-size: small;
 +
  }
 +
 
 +
  .left-menu ul{
 +
  width:170px;
 +
  white-space: normal;
 +
  }
-
.left-menu, .left-menu a {
+
  .left-menu, .left-menu a {
     left: 0px;
     left: 0px;
     text-align: left;
     text-align: left;
-
     color:transparent;
+
    text-decoration:none;
 +
     color: #DBD6C3 !important;
     text-transform: lowercase;
     text-transform: lowercase;
 +
    background-color: transparent;
 +
    left: -10px;
}
}
-
.left-menu:hover {
+
.left-menu:hover, .left-menu:hover a{
-
    color: white;
+
background-color: transparent;
-
    background-color: #555555
+
color: green !important;
 +
font-size: small;
 +
text-decoration:none;
}
}
 +
 +
.left-menu a:hover {
 +
background-color: transparent;
 +
color: black;
 +
font-size: small;
 +
text-decoration:none;
 +
}
 +
 +
 +
.right-menu, .right-menu a {
.right-menu, .right-menu a {
     right: 0px;
     right: 0px;
     text-align: right;
     text-align: right;
     color: white;
     color: white;
 +
    text-decoration:none;
 +
    color: black;
 +
    text-transform: lowercase;
 +
    background-color: transparent;
}
}
-
#menubar ul {
+
 
-
     color: #555555;
+
.right-menu li a  {
-
     list-style: none;
+
     background-color: transparent;
 +
     color: black;
}
}
-
#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 {
+
.right-menu li a:hover  {
-
    color: white;
+
     background-color: transparent;
-
}
+
     color: black;
-
.right-menu li {
+
-
#    background-color: #606060;
+
-
}
+
-
.right-menu li a {
+
-
    padding: 0px 15px 0px 0px;
+
-
    color: white;
+
-
     background-color: #606060;
+
-
}
+
-
.right-menu li a:hover {
+
-
     color: #aaaaff;
+
-
    text-decoration: underline;
+
}
}
 +
/* footer */
/* footer */
Line 303: Line 610:
  ****************************************************************************************************/
  ****************************************************************************************************/
#content {
#content {
-
    position: relative;
 
     width:  965px;
     width:  965px;
#    margin-left: 10px;
#    margin-left: 10px;
margin: 0 auto;
margin: 0 auto;
     padding: 5px 5px 5px 5px;;
     padding: 5px 5px 5px 5px;;
-
     background: white;
+
     background-color:rgba(255,255,255,0.8);
     color: black;
     color: black;
     border-left: 1px solid #444444;
     border-left: 1px solid #444444;
Line 316: Line 622:
}
}
-
#column-one {
 
-
    padding-top: 107px;
 
-
    position: absolute;
 
-
    right: 4px;
 
-
    padding: 100px 20px 0 0;
 
-
}
 
-
/* the left column width is specified in class .portlet */
 
/* general styles */
/* general styles */
Line 615: Line 914:
#toc .toctoggle,
#toc .toctoggle,
.toc .toctoggle {
.toc .toctoggle {
-
font-size: 94%;
+
font-size: 120%;
-
}
+
  }

Revision as of 11:13, 25 September 2012

/*kasten*/

  1. synmikrolink {

position: absolute; top:-180px; right:20px; z-index: 7; height: 60px; width:220px; background-color: transparent; }

  1. mainpagelink{

position: absolute; top:-120px; left:25px; z-index: 7; }

.conboxs{

   -moz-border-bottom-colors: none;
   -moz-border-left-colors: none;
   -moz-border-right-colors: none;
   -moz-border-top-colors: none;
   background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
   border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
   border-image: none;
   border-radius: 2em 2em 2em 2em;
   border-style: solid solid solid solid;
   border-width: medium;
   box-shadow: 0 1px 3px black;
   float: left;
   width: 45%;
   padding: 10px;
   margin:1%;
}

.conboxb{
   -moz-border-bottom-colors: none;
   -moz-border-left-colors: none;
   -moz-border-right-colors: none;
   -moz-border-top-colors: none;
   background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
   border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
   border-image: none;
   border-radius: 2em 2em 2em 2em;
   border-style: solid solid solid solid;
   border-width: medium;
   box-shadow: 0 1px 3px black;
   float: left;
   width: 95%;
   padding: 10px;
   margin:1%;
}

 .conbox20{
   -moz-border-bottom-colors: none;
   -moz-border-left-colors: none;
   -moz-border-right-colors: none;
   -moz-border-top-colors: none;
   background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
   border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
   border-image: none;
   border-radius: 2em 2em 2em 2em;
   border-style: solid solid solid solid;
   border-width: medium;
   box-shadow: 0 1px 3px black;
   float: left;
   width: 20.25%;
   padding: 10px;
   margin:1%;
}

  .conbox28{
   -moz-border-bottom-colors: none;
   -moz-border-left-colors: none;
   -moz-border-right-colors: none;
   -moz-border-top-colors: none;
   background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
   border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
   border-image: none;
   border-radius: 2em 2em 2em 2em;
   border-style: solid solid solid solid;
   border-width: medium;
   box-shadow: 0 1px 3px black;
   float: left;
   width: 28.5%;
   padding: 10px;
   margin:1%;
}

.conbox60{
   -moz-border-bottom-colors: none;
   -moz-border-left-colors: none;
   -moz-border-right-colors: none;
   -moz-border-top-colors: none;
   background: none repeat scroll 0 0 rgba(233, 243, 217, 0.7);
   border-color: rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5) rgba(233, 243, 217, 0.5);
   border-image: none;
   border-radius: 2em 2em 2em 2em;
   border-style: solid solid solid solid;
   border-width: medium;
   box-shadow: 0 1px 3px black;
   float: left;
   width: 62%;
   padding: 10px;
   margin:1%;
}

/* Vertical Navigation */

  1. vertical-navigation {

list-style: none; margin: 0; padding: 0; font-size: 1.2em; float: left; position: absolute;

 background: tranparent;
 top: -32px;
 left: 0px;
 width: 975px;
 z-index:7;
 

}


/* CSS for each Parent Item */

  1. vertical-navigation li {

float: left; position: relative; width: 150.5px; background: #E9F3D9; margin-left: 2px; margin-right: 2px; padding-right:8px; }

  1. vertical-navigation li.home{

background-color: #B8C881; }

  1. vertical-navigation li.team{

background-color: #B8C881; }

  1. vertical-navigation li.project{

background-color: #B8C881; }

  1. vertical-navigation li.notebook{

background-color: #B8C881; }

  1. vertical-navigation li.safety{

background-color: #B8C881; }

  1. vertical-navigation li.attributions{

background-color: #B8C881; }

  1. vertical-navigation li a

{ float: left; display: block; padding: 4px; text-decoration: none; color: black; margin-right: 10px;

 text-align: center;
 width: 150.5px;

}

/* Change background color and font color of parent items when mouse hover

  • /
  1. vertical-navigation li:hover a,
  2. vertical-navigation li a:hover

{ width: 150.5px; background: #E9F3D9; position:relative; color: black; text-decoration: none; }

  1. vertical-navigation li.home:hover a,
  2. vertical-navigation li home:hover{

background-color: #E077A7; }

  1. vertical-navigation li.team:hover a,
  2. vertical-navigation li team:hover{

background-color: #41A9E0; }

  1. vertical-navigation li.project:hover a,
  2. vertical-navigation li project:hover{

background-color: #A0B919; }

  1. vertical-navigation li.notebook:hover a,
  2. vertical-navigation li notebook:hover{

background-color: #F1DC00; }

  1. vertical-navigation li.safety:hover a,
  2. vertical-navigation li safety:hover{

background-color: #D33F18; }

  1. vertical-navigation li.attributions:hover a,
  2. vertical-navigation li attributions:hover{

background-color: #8865A7; }


/* Applie to group of Child Items Each Child Item will be invisible by default

  • /
  1. vertical-navigation ul {display: none;}

/* Each Child Item will be visible if mouse hover */

  1. vertical-navigation li:hover ul {display: block;}
  1. vertical-navigation li.child {

float: left; position: relative; width: 146.5px; background: #00f; }

  1. vertical-navigation li.child a {

float: left; position: relative; width: 146.5px; }

  1. vertical-navigation ul

{ float: none; position: absolute; list-style: none; margin: 0; padding: 0; top: 2em; left: 0; }

  1. vertical-navigation ul li

{ float: none; clear: none; margin: 0; padding: 0; width: 146.5; color: #999; }


/* Reset and re style link of each child item

  • /
  1. vertical-navigation li:hover ul li a,
  2. vertical-navigation ul li a

{ line-height: 200%; display: block; padding: 6px 6px 0px 6px; float: none; color: #000; background: #bc5e0a;

 width: 146.5;
 white-space:nowrap;
 text-decoration: none;

}

  1. vertical-navigation li:hover ul li a:hover,
  2. vertical-navigation ul li a:hover

{ color: #000;

 text-decoration: underline;
 

}


/*

  1. footer-box, #p-logo, #search-controls
  • /
  1. contentSub, .firstHeading, #catlinks{
   display:none;} 
  1. top-section {
   border: none;
   height: 0px;}


body {

   font: x-small sans-serif;
   color: black;
   margin: 0;
   padding: 0;
   background: #333333 url('https://static.igem.org/mediawiki/2012/c/cf/Syn_MR_bgr.jpg') repeat fixed;

}

/* scale back up to a sane default */

  1. globalWrapper {
   position: relative;
   font-size: 127%;
   width: 100%;
   margin: 0;
   padding: 0;
   padding-bottom: 10px;

} .visualClear {

   clear: both;

}

/* The top section contains the banner, the search box, and the left and right menus */

  1. top-section {
   position: relative;
   height: 254px;
   width: 975px;
  1. margin-left: 10px;

margin: 0 auto 0 auto;

   border-left: 1px solid #444444;
   border-right: 1px solid #444444;
   border-bottom: 1px solid #444444;

}

  1. box {

width: 700px;

margin-left: 137px;
padding: 5px; 
border: 3px solid #000; 
background-color: #fe2b33;
}
  1. p-logo {

height: 254px; background: #000000 url('http://web383.mis60.de/inprogress/banner_2.png'); }

  1. p-logo img {

display: none; }

  1. p-logo a {

display: none; }


  1. p-logo h5 {
   display: none;

}

  1. p-logo a,
  2. p-logo a:hover {
   text-decoration: none;

}

  1. search-controls {

position: absolute; top: 20px; right: -8px; width: 180px; height: 40px; background-color: transparent;

   	text-align: center;
   	z-index: 3;

} input.searchButton { margin: 1px 10px 0 10px; font-size: 100%; background: none; border: none; color: black; }

input.searchButton:hover { font-weight: bold;

 color: black;
 text-decoration: underline;

}

  1. searchInput {
   width: 10.9em;
   margin: 0;
   font-size: 95%;

}


  1. menubar {
   position: absolute;
   top: -6px;
   z-index: 5;
   font-family: sans-serif;
   font-size: 95%;
   line-height: 1em;
   width:340px;
    

}

  .left-menu li   {
  font-size: 0%;
  } 
  
  .left-menu li a   {
  font-size: small;
  }
  
  .left-menu ul{
  width:170px;
  white-space: normal;
  }
  .left-menu, .left-menu a {
   left: 0px;
   text-align: left;
   text-decoration:none;
   color: #DBD6C3 !important;
   text-transform: lowercase;
   background-color: transparent;
   left: -10px;

}

.left-menu:hover, .left-menu:hover a{ background-color: transparent; color: green !important; font-size: small; text-decoration:none; }

.left-menu a:hover { background-color: transparent; color: black; font-size: small; text-decoration:none; }


.right-menu, .right-menu a {

   right: 0px;
   text-align: right;
   color: white;
   text-decoration:none;
   color: black;
   text-transform: lowercase;
   background-color: transparent;

}

.right-menu li a {

   background-color: transparent;
   color: black;

}

.right-menu li a:hover {

   background-color: transparent;
   color: black;

}


/* footer */

  1. footer-box {

margin-left: 10px; width: 965px; padding: 5px; background-color: white; margin: 0 auto; border: 1px solid #444444; }

  1. footer {

color: #000000; text-align: center; font-size: 90%;; }

  1. footer li {

display: inline; margin: 0 1.3em; }

/* Sponsors box */

  1. sponsor-box {
   height: 49px;
   width: 975px;
  1. 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;

}

  1. f-poweredbyico {
   float: right;

}

  1. f-copyrightico {
   float: left;

}

/* Pulldown menu boxes */

.hidden { visibility: hidden; } .visible { visibility: visible; }


.menubox { position: absolute; top: 20px; left: 0px; border: 1px solid #A4A4A4; background-color: #E0E0E0; width: 200px;

       height: 200px;

z-index: 20; }

.bridge1 { position: absolute; top: 18px; left: 1px; width: 59px;

       height: 4px;

background-color: #d8d8d8; z-index: 25; }


.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 */

  1. 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 { margin-top: 0px; }

.right-heading { font-size: 125%; font-weight: bold; padding: 0.5em 0 0; line-height:100%; } .right-box ul { line-height: 90%; } .right-box li { color: #666666; /* The items are grayed until they have links */ }

/*****************************************************************************************************

* The content div contains all of the contents of the page - provided by mediawiki
****************************************************************************************************/
  1. content {
   width:  965px;
  1. margin-left: 10px;

margin: 0 auto;

   padding: 5px 5px 5px 5px;;
   background-color:rgba(255,255,255,0.8);
   color: black;
   border-left: 1px solid #444444;
   border-right: 1px solid #444444;
   line-height: 1.5em;
   z-index: 2;

}


/* general styles */

table {

   font-size: 100%;
   background: white;
   color: black;

} a {

   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 {

  1. color: #AAAAFF;

} a.new:visited, #p-personal a.new:visited {

   color: #002bb8;

}

img {

   border: none;
   vertical-align: middle;

} p {

   margin: .4em 0 .5em 0;
   line-height: 1.5em;

} p img {

   margin: 0;

}

hr {

   height: 1px;
   color: #aaa;
   background-color: #aaa;
   border: 0;
   margin: .2em 0 .2em 0;

}

h1, h2, h3, h4, h5, h6 {

   color: black;
   background: none;
   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 {

   line-height: 1.5em;
   list-style-type: square;
   margin: .3em 0 0 1.5em;
   padding: 0;
   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 {

   border: 1px solid #2f6fab;
   margin: 1em 0 1em 0;
   padding: 0 1em 1em;
   line-height: 1.5em;

} legend {

   background: white;
   padding: .5em;
   font-size: 95%;

} form {

   border: none;
   margin: 0;

}

textarea {

   width: 100%;
   padding: .1em;

}

input.historysubmit {

   padding: 0 .3em .3em .3em !important;
   font-size: 94%;
   cursor: pointer;
   height: 1.7em !important;
   margin-left: 1.6em;

} select {

   vertical-align: top;

} 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;

}

/*

    • the main content area
  • /
  1. siteSub {
   display: none;

}

  1. contentSub {
   font-size: 84%;
   line-height: 1.2em;
   margin: 0 0 1.4em 1em;
   color: #7d7d7d;
   width: auto;

} span.subpages {

   display: block;

}

/* Some space under the headers in the content area */

  1. bodyContent h1, #bodyContent h2 {
   margin-bottom: .6em;

}

  1. bodyContent h3, #bodyContent h4, #bodyContent h5 {
   margin-bottom: .3em;

} .firstHeading {

   margin-bottom: .1em;

}

/* user notification thing */ .usermessage {

   background-color: #ffce7b;
   border: 1px solid #ffa500;
   color: black;
   font-weight: bold;
   margin: 2em 0 1em;
   padding: .5em 1em;
   vertical-align: middle;

}

  1. siteNotice {
   text-align: center;
   font-size: 95%;
   padding: 0 .9em;

}

  1. siteNotice p {
   margin: 0;
   padding: 0;

} .error {

   color: red;
   font-size: larger;

}

  1. 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 */ .center {

   width: 100%;
   text-align: center;

}

  • .center * {
   margin-left: auto;
   margin-right: auto;

} /* small for tables and similar */ .small, .small * {

   font-size: 94%;

} table.small {

   font-size: 100%;

}

/*

    • content styles
  • /
  1. toc,

.toc { border: 1px solid #aaa; background-color: #f9f9f9; padding: 5px; font-size: 95%; }

  1. toc h2,

.toc h2 { display: inline; border: none; padding: 0; font-size: 100%; font-weight: bold; }

  1. toc #toctitle,

.toc #toctitle,

  1. toc .toctitle,

.toc .toctitle { text-align: center; }

  1. toc ul,

.toc ul { list-style-type: none; list-style-image: none; margin-left: 0; padding-left: 0; text-align: left; }

  1. toc ul ul,

.toc ul ul { margin: 0 0 0 2em; }

  1. toc .toctoggle,

.toc .toctoggle { font-size: 120%;

 }


/* images */ 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 {

   display: none;

} img.tex {

   vertical-align: middle;

} span.texhtml {

   font-family: serif;

}

/*

    • 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;

}

  1. pagehistory span.user {
   margin-left: 1.4em;
   margin-right: .4em;

}

  1. pagehistory span.minor {
   font-weight: bold;

}

  1. pagehistory li {
   border: 1px solid white;

}

  1. 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
  • /
  1. bodyContent a[href ^="http://"],
  2. bodyContent a[href ^="gopher://"] {

/* background: url(external.png) center right no-repeat; rdr */ /* padding-right: 13px; rdr */ }

  1. bodyContent a[href ^="https://"],

.link-https {

   background: url(lock_icon.gif) center right no-repeat;
   padding-right: 16px;

}

  1. bodyContent a[href ^="mailto:"],

.link-mailto {

   background: url(mail_icon.gif) center right no-repeat;
   padding-right: 18px;

}

  1. bodyContent a[href ^="news://"] {
   background: url(news_icon.png) center right no-repeat;
   padding-right: 18px;

}

  1. bodyContent a[href ^="ftp://"],

.link-ftp {

   background: url(file_icon.gif) center right no-repeat;
   padding-right: 18px;

}

  1. bodyContent a[href ^="irc://"],

.link-irc {

   background: url(discussionitem_icon.gif) center right no-repeat;
   padding-right: 18px;

} /* disable interwiki styling */

  1. bodyContent a.extiw,
  2. 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 */

  1. 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 */

  1. preftoc {
   float: left;
   margin: 1em;
   width: 13em;

}

  1. preftoc li {
   border: 1px solid white;

}

  1. preftoc li.selected {
   background-color: #f9f9f9;
   border: 1px dashed #aaa;

}

  1. preftoc a,
  2. preftoc a:active {
   display: block;
   color: #0014a6;

}

  1. 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; }
  1. 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; }

  1. 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; }

  1. mw_trackbacks {

border: solid 1px #bbbbff; background-color: #eeeeff; padding: 0.2em; }


/* Allmessages table */

  1. allmessagestable th {

background-color: #b2b2ff; }

  1. allmessagestable tr.orig {

background-color: #ffe2e2; }

  1. allmessagestable tr.new {

background-color: #e2ffe2; }

  1. allmessagestable tr.def {

background-color: #f0f0ff; }