Template:Team:Berkeley/css2

From 2013.igem.org

(Difference between revisions)
 
(3 intermediate revisions not shown)
Line 81: Line 81:
     -webkit-padding-start: 0;}
     -webkit-padding-start: 0;}
-
#bodyContent{padding: 81px 0 0px;}
+
#bodyContent {
-
/* Navigation - Submenu
+
     padding: 5px 0 0px;
-
-------------------------------------------------*/
+
-
 
+
-
ul.subs {
+
-
     display: block;
+
-
    position: fixed;
+
-
    top: -165px;
+
-
    left: 0;
+
-
    width: 100%;
+
-
    height: 160px;
+
-
    box-shadow: 0 0 5px #ccc;
+
-
    background: url('https://static.igem.org/mediawiki/2013/2/28/Sub-bg.png') repeat-x top left;
+
-
    text-align: center;
+
-
    z-index: 5;
+
-
      -webkit-transition: all .3s ease-in-out;
+
-
          -moz-transition: all .3s ease-in-out;
+
-
                    transition: all .3s ease-in-out;}
+
-
 
+
-
ul.subs.active {
+
-
    top: 79px;
+
-
    left: 0;}
+
-
 
+
-
ul.subs li:first-child {padding-left: 5px; background:url('http://beoplay.com/resources/sbv-custom/img/megamenu/mm_divider.png') no-repeat right center, url('http://beoplay.com/resources/sbv-custom/img/megamenu/mm_divider.png') no-repeat left center; }
+
-
ul.subs li {
+
-
    display:inline-block;
+
-
    width: 10%;
+
-
    max-width: 180px;
+
-
    font-family: 'Source Sans Pro', sans-serif;
+
-
    font-size:13px;
+
-
    vertical-align: top;
+
-
    padding: 0 5px 0 0;
+
-
    background: url('http://beoplay.com/resources/sbv-custom/img/megamenu/mm_divider.png') no-repeat right center;}
+
-
 
+
-
ul.subs li:hover {
+
-
    background: url('http://beoplay.com/resources/sbv-custom/img/megamenu/mm_hover_bg.png') no-repeat top right;
+
-
    background-size: cover;
+
-
    margin: 0 0 0 -6px;
+
-
    padding: 0 5px 0 6px;
+
}
}
-
ul.subs li:first-child:hover {padding: 0 5px 0 4px; margin-left: 1px; }
 
-
ul.subs li a {
 
-
    display: block;
 
-
    padding: 40px 0 0;
 
-
    height: 120px;
 
-
    line-height: 16px;
 
-
}
 
-
 
-
ul.subs li a img {padding-bottom: 10px;}
 
-
 
-
ul.subs li .selflink img {padding-bottom: 10px;}
 
-
ul.subs .selflink {display:block; font-weight: normal !important; color: #0d9c64; cursor: default; padding: 40px 0 0; height: 120px; line-height: 16px;}
 
-
 
-
.tournav {
 
-
    height: 74px;
 
-
    background: url('https://static.igem.org/mediawiki/2013/9/92/Footerline.png') left bottom repeat-x;
 
-
}
 
-
 
-
.tournav ul {
 
-
    width: 89.06244%;
 
-
    margin: 0 5.46878%;
 
-
}
 
-
 
-
    .tournav ul li {
 
-
        display: block;
 
-
        position: relative;
 
-
        float: left;
 
-
        width: 11.11111111%;
 
-
        font-size: 10px;
 
-
        text-align: center;
 
-
        line-height: 14px;
 
-
        background: url('https://static.igem.org/mediawiki/2013/a/a7/Progress2sm.png') center top no-repeat;
 
-
        color: #ccc;
 
-
    }
 
-
 
-
    .tournav ul li a {
 
-
        display:block;
 
-
        padding-top: 42px;
 
-
        color: #ccc;}
 
-
    .tournav ul li a:hover {
 
-
        color: rgb(19,162,102);}
 
-
 
-
/* Tournav begin
 
-
-------------------------------------------------*/
 
-
 
-
    .tournav ul .first{
 
-
        background: url('https://static.igem.org/mediawiki/2013/6/64/Progress1.png') center top no-repeat;
 
-
        color: rgb(19,162,102);
 
-
    }
 
-
    .tournav ul .first.pad{padding-top: 42px;}
 
-
 
-
    .tournav ul .firstbgsm.fill{
 
-
        background: url('https://static.igem.org/mediawiki/2013/2/2d/Progress1fillbgsm.png') center top no-repeat !important;
 
-
    }
 
-
    .tournav ul .firstbgsm.fill a{color: #333;}
 
-
    .tournav ul .firstbgsm.fill a:hover{color: rgb(19,162,102);}
 
-
    .tournav ul .first.fill {
 
-
        background: url('https://static.igem.org/mediawiki/2013/2/25/Progress1fill.png') center top no-repeat !important;
 
-
        color: #ccc;
 
-
    }
 
-
 
-
/* Tournav verloop klein -> klein (standaard behalve fill)
 
-
-------------------------------------------------*/
 
-
 
-
    .tournav ul .fill {
 
-
        background: url('https://static.igem.org/mediawiki/2013/c/ca/Progress2fillsm.png') center top no-repeat !important;
 
-
    }
 
-
 
-
/* Tournav verloop groot -> groot
 
-
-------------------------------------------------*/
 
-
 
-
    .tournav ul .bgbg {
 
-
        background: url('https://static.igem.org/mediawiki/2013/a/a1/Progress2.png') center top no-repeat !important;
 
-
    }
 
-
    .tournav ul .bgbg a{color: #333;}
 
-
    .tournav ul .bgbg a:hover{color: rgb(19,162,102);}
 
-
    .tournav ul .bgbg.current {
 
-
        background: url('https://static.igem.org/mediawiki/2013/1/1e/Progress2current.png') center top no-repeat !important;
 
-
        color: rgb(19,162,102);
 
-
        padding-top: 42px;
 
-
    }
 
-
    .tournav ul .bgbg.fill {
 
-
        background: url('https://static.igem.org/mediawiki/2013/b/b0/Progress2fill.png') center top no-repeat !important;
 
-
    }
 
-
 
-
 
-
/* Tournav verloop klein -> groot
 
-
-------------------------------------------------*/
 
-
 
-
    .tournav ul .smbg {
 
-
        background: url('https://static.igem.org/mediawiki/2013/b/b8/Progress2smbg.png') center top no-repeat !important;
 
-
    }
 
-
    .tournav ul .smbg a{color: #333;}
 
-
    .tournav ul .smbg a:hover{color: rgb(19,162,102);}
 
-
    .tournav ul .smbg.current {
 
-
        background: url('https://static.igem.org/mediawiki/2013/1/18/Progress2currentsmbg.png') center top no-repeat !important;
 
-
        color: rgb(19,162,102);
 
-
        padding-top: 42px;
 
-
    }
 
-
    .tournav ul .smbg.fill {
 
-
        background: url('https://static.igem.org/mediawiki/2013/5/5c/Progress2fillsmbg.png') center top no-repeat !important;
 
-
    }
 
-
 
-
/* Tournav verloop groot -> klein
 
-
-------------------------------------------------*/
 
-
 
-
    .tournav ul .bgsm {
 
-
        background: url('https://static.igem.org/mediawiki/2013/2/23/Progress2bgsm.png') center top no-repeat !important;
 
-
    }   
 
-
    .tournav ul .bgsm a{color: #333;}
 
-
    .tournav ul .bgsm a:hover{color: rgb(19,162,102);}
 
-
    .tournav ul .bgsm a{color: #333;}
 
-
    .tournav ul .bgbg.fill a:hover{color: rgb(19,162,102);}
 
-
    .tournav ul .bgsm.current {
 
-
        background: url('https://static.igem.org/mediawiki/2013/a/ae/Progress2currentbgsm.png') center top no-repeat !important;
 
-
        color: rgb(19,162,102);
 
-
        padding-top: 42px;
 
-
    }
 
-
    .tournav ul .bgsm.fill {
 
-
        background: url('https://static.igem.org/mediawiki/2013/c/ce/Progress2fillbgsm.png') center top no-repeat !important;
 
-
        color: rgb(19,162,102);
 
-
    }
 
-
    .tournav ul .bgsm.fill a{color: #333;}
 
-
    .tournav ul .bgsm.fill a:hover{color: rgb(19,162,102);}
 
-
 
-
/* Tournav verloop klein -> groot -> klein
 
-
-------------------------------------------------*/
 
-
 
-
    .tournav ul .smbgsm {
 
-
        background: url('https://static.igem.org/mediawiki/2013/0/04/Progress2smbgsm.png') center top no-repeat !important;
 
-
    }
 
-
    .tournav ul .smbgsm a{color: #333;}
 
-
    .tournav ul .smbgsm a:hover{color: rgb(19,162,102);}
 
-
    .tournav ul .smbgsm.current {
 
-
        background: url('https://static.igem.org/mediawiki/2013/f/f6/Progress2currentsmbgsm.png') center top no-repeat !important;
 
-
        color: rgb(19,162,102);
 
-
        padding-top: 42px;
 
-
    }
 
-
    .tournav ul .smbgsm.fill {
 
-
        background: url('https://static.igem.org/mediawiki/2013/6/61/Progress2fillsmbgsm.png') center top no-repeat !important;
 
-
    }
 
-
 
-
/* Tournav end
 
-
-------------------------------------------------*/
 
-
 
-
    .tournav ul .last {
 
-
        background: url('https://static.igem.org/mediawiki/2013/1/1c/Progress3.png') center top no-repeat;
 
-
    }
 
-
    .tournav ul .last.bg {
 
-
        background: url('https://static.igem.org/mediawiki/2013/5/53/Progress3bg.png') center top no-repeat !important;
 
-
    }
 
-
    .tournav ul .last.bg a{color: #333;}
 
-
    .tournav ul .last.bg a:hover{color: rgb(19,162,102);}
 
-
    .tournav ul .last.current {
 
-
        background: url('https://static.igem.org/mediawiki/2013/2/2a/Progress3current.png') center top no-repeat !important;
 
-
        color: rgb(19,162,102);
 
-
        padding-top: 42px;
 
-
    }
 
-
 
-
/* Navigation
 
-
-------------------------------------------------*/
 
-
 
-
#tabs {
 
-
    display: block;
 
-
    width: 89.06244%;
 
-
    height: 40px;
 
-
    position: absolute;
 
-
    left: 5.46878%;
 
-
    top: -40px;
 
-
}
 
-
 
-
 
-
#tabs ul li {
 
-
    display: block;
 
-
    width: 19%;
 
-
    height: 40px;
 
-
    float: left;
 
-
    margin-right: 1.25%;
 
-
    background: #fff;
 
-
    border-top-left-radius: 6px;
 
-
    border-top-right-radius: 6px;
 
-
    overflow: hidden;
 
-
    border: 1px solid #ccc;
 
-
    border-bottom-color: #0d9c64;
 
-
    -moz-box-sizing: border-box;
 
-
              box-sizing: border-box;
 
-
}
 
-
 
-
 
-
#tabs ul li#li_tab1 a {
 
-
    background: url('https://static.igem.org/mediawiki/2013/b/ba/Aspergillusheader-icon.png') 10px 8px no-repeat;
 
-
    background-size: 20px auto;}
 
-
 
-
#tabs ul li#li_tab2 a {
 
-
    background: url('https://static.igem.org/mediawiki/2013/6/6d/Secmetheader-icon.png') 7px 9px no-repeat;
 
-
    background-size: 24px auto;}
 
-
 
-
#tabs ul li#li_tab3 a {
 
-
    background: url('https://static.igem.org/mediawiki/2013/2/29/Toolbox-icon.png') -10px 6px no-repeat;
 
-
    background-size: auto 28px;}
 
-
 
-
#tabs ul li#li_tab4 a {
 
-
    background: url('https://static.igem.org/mediawiki/2013/6/63/Host-icon.png') -10px 6px no-repeat;
 
-
    background-size: auto 28px;}
 
-
 
-
#tabs ul li#li_tab5 a {
 
-
    background: url('https://static.igem.org/mediawiki/2013/8/8e/Applications-icon.png') -10px 6px no-repeat;
 
-
    background-size: auto 28px;}
 
-
 
-
 
-
 
-
#tabs ul li#li_tab5 {margin-right: 0;}
 
-
 
-
#tabs ul li a {
 
-
    display: block;
 
-
    width: 100%;
 
-
    padding-left: 35px;
 
-
    line-height: 40px;
 
-
    color: #888;
 
-
    cursor:pointer;
 
-
    -moz-box-sizing: border-box;
 
-
              box-sizing: border-box;
 
-
}
 
-
 
-
#tabs ul li a:hover {color: #0d9c64;}
 
-
 
-
#tabs ul li.active {background: #f1f1f1; border-bottom: none;border-color: #0d9c64;}
 
-
#tabs ul li.active a {color: #333;cursor: default;}
 

Latest revision as of 05:35, 18 October 2013

  1. topmenu { 
       display: block;
       position: fixed;
       top: 0;
       width: 89.06244%;
       padding: 0 5.46878%;
       height: 80px;
       background: url('https://static.igem.org/mediawiki/2013/1/1d/Top-gradient.png') #f1f1f1 repeat-x left top;
       border-top: 1px solid #0d9c64;
       box-shadow: 0 0 5px #888;
       z-index: 10;}
  1. topmenu .selflink {font-weight: normal !important; color: #0d9c64; cursor: default; padding: 0 12px 0 8px;}
  2. topmenu .menucenter li:hover .selflink {padding: 0 11px 0 9px}
  1. topmenu .menucenter{position: relative; display: block; line-height: 80px;}
  1. topmenu .menuleft {position: absolute; line-height: 76px; z-index: 3;}
  2. topmenu .menuleft a img {position: relative; height: 60px; top: 10px;}
  1. topmenu .menucenter { 
   display:block;
   margin: 0 auto;
   width:100%;
   text-align: center;
   font-size: 0;}
   #topmenu .menucenter li {
       display:inline-block;
       margin: 0;
       background: url('https://static.igem.org/mediawiki/2013/c/ca/Top-menu-divider.png') no-repeat right top;
       font-size: 16px;}
   #topmenu .menucenter li:first-child {
       background: url('https://static.igem.org/mediawiki/2013/c/ca/Top-menu-divider.png') no-repeat left top, url('https://static.igem.org/mediawiki/2013/c/ca/Top-menu-divider.png') no-repeat right top;}
   #topmenu .menucenter li:hover {
       background: url('https://static.igem.org/mediawiki/2013/0/03/Top-menu-hover.png') repeat-x top left; 
       border-left:1px solid #ccc;
       border-right:1px solid #ccc;
       margin: 0 0 0 -2px;}
       #topmenu .menucenter li a {display:block; height: 79px; padding: 0 12px 0 8px;}
       #topmenu .menucenter li:hover a {padding: 0 11px 0 9px}
  1. topmenu .menuright {position: absolute; display: block; width: 109px; height: 80px; right: 5.46878%; top: 0; z-index: 3;}
  1. topmenu .menuright a{display: inline-block; position: relative;} 
   #topmenu .menuright a.twitter {
       display:block;
       float: left;
       width: 36px;
       height: 30px;
       margin-top: 25px;
       padding: 0;
       background: url('https://static.igem.org/mediawiki/2013/d/de/Twitterbtn.png') left top no-repeat;
   }
   #topmenu .menuright a.facebook {
       display:block;
       float: left;
       width: 36px;
       height: 34px;
       margin-top: 23px;
       padding: 0;
       background: url('https://static.igem.org/mediawiki/2013/7/7c/Facebookbtn.png') left top no-repeat;
   }
   #topmenu .menuright a.mail {
       display:block;
       float: left;
       width: 37px;
       height: 29px;
       margin-top: 26px;
       padding: 0;
       background: url('https://static.igem.org/mediawiki/2013/9/94/Mailbtn.png') left top no-repeat;
   }
   #topmenu .menuright a:hover {
       background-position: right top;
   }


  1. topmenu ul, topmenu li { 
   -webkit-margin-before: 0;
   -webkit-margin-after: 0;
   -webkit-padding-start: 0;}
  1. bodyContent { 
   padding: 5px 0 0px;

}

Retrieved from "http://2013.igem.org/Template:Team:Berkeley/css2"