Team:Marburg SYNMIKRO:Template:stylesheet.css

From 2012.igem.org

(Difference between revisions)
 
(19 intermediate revisions not shown)
Line 1: Line 1:
 +
<html>
 +
<style>
 +
/*kasten*/
 +
 +
#synmikrolink {
 +
position: absolute;
 +
top:-160px;
 +
right:40px;
 +
z-index: 7;
 +
height: 60px;
 +
width:240px;
 +
background-color: transparent;
 +
}
 +
 +
#mainpagelink{
 +
position: absolute;
 +
top:-230px;
 +
left:5px;
 +
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 {
 +
    border: none;
 +
    height: 0px;}
 +
Line 6: Line 306:
     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 26: Line 326:
#top-section {
#top-section {
     position: relative;
     position: relative;
-
     height: 98px;
+
     height: 254px;
     width: 975px;
     width: 975px;
#    margin-left: 10px;
#    margin-left: 10px;
Line 44: Line 344:
#p-logo {
#p-logo {
-
    position: absolute;
+
height: 254px;
-
    z-index: 1;
+
background: #000000 url('https://static.igem.org/mediawiki/2012/8/8f/Syn_MR_banner2.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 60: Line 368:
#search-controls {
#search-controls {
position: absolute;
position: absolute;
-
top:  20px;
+
top:  170px;
-
right: 15px;
+
right: -8px;
-
width: 150px;
+
width: 180px;
height: 40px;
height: 40px;
background-color: transparent;
background-color: transparent;
Line 73: Line 381:
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 88: Line 399:
#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:370px;
 +
  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: #DAE3B7 !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;
+
.right-menu li a:hover  {
-
    position: relative;
+
     background-color: transparent;
-
    cursor: pointer;
+
     color: black;
-
    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 {
 
-
    color: white;
 
-
}
 
-
.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 295: Line 612:
  ****************************************************************************************************/
  ****************************************************************************************************/
#content {
#content {
-
    position: relative;
 
     width:  965px;
     width:  965px;
 +
    z-index: -1999
#    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 308: Line 625:
}
}
-
#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 607: Line 917:
#toc .toctoggle,
#toc .toctoggle,
.toc .toctoggle {
.toc .toctoggle {
-
font-size: 94%;
+
font-size: 120%;
-
}
+
  }
Line 1,153: Line 1,463:
background-color: #f0f0ff;
background-color: #f0f0ff;
}
}
 +
</style>
 +
</html>

Latest revision as of 14:48, 26 September 2012