Team:Heidelberg/Stylesheet

From 2013.igem.org

Revision as of 15:58, 16 August 2013 by JuliaS1992 (Talk | contribs)

/* Hiding predefined html elements */ /***********************************/

  1. contentSub, #search-controls, #catlinks, #p-logo, .firstHeading {

display:none; padding:0px; margin:0px; }

/* Resize general layout */ /*************************/ body { background-color:#606060; text-align:center; }

  1. content {

position:relative; width:1024px; margin:0px; padding:0px; display:inline-block; text-align:left; z-index:888; }

  1. top-section, #footer-box {

width:1014px; padding:5px; margin:0px; display:inline-block; text-align:left; }

  1. top-section {

position:fixed; width:1024px; height:5px; border:none; z-index:999; }

  1. bodyContent {

margin:0px; z-index:877; }

  1. top-matter {

position:fixed; width:1024px; height:220px; z-index:777; } .center-vert { display:inline-block; width:100%; color:#000000; background-color:white; }

  1. main {

margin-top:200px; } .content-hori { float:left; min-height:1000px; padding:3px; }

  1. navigation-bar {

border-right-style:solid; border-right-color:#606060; width:170px; }

  1. main-content {

width:600px; }

/* Override general formatting */ /*******************************/

/** { font-family:Calibri;}*/ p { margin:0px;}

/* Change user editing menu appearance */ /***************************************/

  1. menubar {

top:-5px; }

  1. menubar, #menubar:hover, .left-menu, .left-menu:hover, .right-menu, .right-menu:hover, .right-menu li a, .right-menu a:hover, #top-section, #top-section:hover {

background-color:transparent; } .left-menu li a { color:transparent; } .left-menu ul li:last-child, .right-menu li a { color:#AAAAAA; color:#AAAAAA !important; }

  1. top-section:hover .left-menu li a{

color:#AAAAAA; }

  1. menubar li a:hover {

color:#FFD83D; color:#FFD83D !important; }

/* Define top navigation bar */ /*****************************/

  1. main-menu {

width:1024; height:200px; position:relative; top:0px; /*background-image:url(../png/Imagemap_Menue_schrift_angepasst.jpg);*/ background-repeat:no-repeat; background-color:#FFFFFF; } .menu-item { position:absolute; float:left; z-index:666; top:-3px; background-color:transparent; } .menu-item a { display:block; border:none; line-height:50px; background-color:#333; font-size:12pt; } .menu-item a:active { text-decoration:none; } .menu-item ul { display:none; background-color:#93ADAE; list-style:none; margin:0px; border:none; } .menu-item ul li { border-bottom: 1pt solid; }

  1. menu-team { left:44px;}
  2. link-team {

/*background-image:url(../png/Team_all.png);*/ background-position:0px 0px; height:105px; }

  1. link-team, #link-team + ul { width:65px;}
  2. menu-team:hover a { background-position:0px 105px;}
  3. menu-team:hover ul { display:inline-block;}
  1. menu-project { left:110px;}
  2. link-project {

/*background-image:url(../png/Project_all.png);*/ background-position:0px 0px; height:141px; }

  1. link-project, #link-project + ul { width:76px;}
  2. menu-project:hover a { background-position:0px 141px;}
  3. menu-project:hover ul{ display:inline-block;}
  1. menu-modelling { left:214px;}
  2. link-modelling {

/*background-image:url(../png/Modelling_all.png);*/ background-position:0px 0px; height:173px; }

  1. link-modelling, #link-modelling + ul { width:86px;}
  2. menu-modelling:hover a { background-position:0px 173px;}
  3. menu-modelling:hover ul{ display:inline-block;}
  1. menu-parts { left:343px;}
  2. link-parts {

/*background-image:url(../png/SubmittedParts_all.png);*/ background-position:0px 0px; height:173px; }

  1. link-parts, #link-parts + ul { width:153px;}
  2. menu-parts:hover a { background-position:0px 173px;}
  3. menu-parts:hover ul{ display:inline-block;}
  1. menu-notebook { left:532px;}
  2. link-notebook {

/*background-image:url(../png/Notebook_all.png);*/ background-position:0px 0px; height:173px; }

  1. link-notebook, #link-notebook + ul { width:105px;}
  2. menu-notebook:hover a { background-position:0px 173px;}
  3. menu-notebook:hover ul{ display:inline-block;}
  1. menu-human { left:677px;}
  2. link-human {

/*background-image:url(../png/HumanPractice_all.png);*/ background-position:0px 0px; height:173px; }

  1. link-human, #link-human + ul { width:155px;}
  2. menu-human:hover a { background-position:0px 173px;}
  3. menu-human:hover ul{ display:inline-block;}
  1. menu-safety { left:837px;}
  2. link-safety {

/*background-image:url(../png/Safety_all.png);*/ background-position:0px 0px; height:126px; }

  1. link-safety, #link-safety + ul { width:74px;}
  2. menu-safety:hover a { background-position:0px 126px;}
  3. menu-safety:hover ul{ display:inline-block;}
  1. team-logo{

position:absolute; top:135px; left:40px; z-index:4; }

  1. PS {

position:absolute; height:30px; top:165px; left:139px; z-index:3; }

  1. flubber {

position:absolute; height:60px; top:135px; right:139px; z-index:6; }

  1. igem-2013 {

position:absolute; top:135px; right:40px; z-index:5; }

  1. top-separator {

background-color:#F5B800; height:20px; }

/* Style left navigation bar */ /*****************************/

  1. navigation-bar ul, #navigation-bar li{

margin-top:0px; margin-bottom:0px; margin-right:0px; padding:0px; line-height:20px; }

.drop-navi-left + ul { display:none; }

/* Go to top and guided tour navigation */ /*********************************************/

  1. goto-top {

position:fixed; bottom:20px; margin-left:700px; }

  1. tour-navi {

position:fixed; bottom:10px; margin-left:650px; width:100px; height:50px; display:none; }

  1. tour-navi ul {

/* background-image:url(../png/Guided_Navigation.svg); */ background-repeat:no-repeat; background-position:top center; width:100%; height:100%; list-style:none; }

  1. tour-navi ul li {

float:left; }

  1. tour-navi ul .tour-text {

position:absolute; width:70px; top:40px; left:15px; display:none; }

  1. tour-navi #tour-rev, #tour-navi #tour-pause, #tour-navi #tour-fwd {
   height: 80%;
   width: 33%;

}

  1. tour-navi ul li a {

display:block; text-decoration:none; width:100%; height:100%; }

  1. tour-navi #tour-fwd:hover + li, #tour-navi #tour-pause:hover + li, #tour-navi #tour-rev:hover + li {

display:block; }