Team:Alberta/sample.css

From 2011.igem.org

(Difference between revisions)
m
m (Undo revision 85560 by HelenZ (talk))
 
(354 intermediate revisions not shown)
Line 1: Line 1:
/* NOTE This is an edited version of the MediaWiki 'monobook' style sheet  
/* NOTE This is an edited version of the MediaWiki 'monobook' style sheet  
-
*      edited by Team Alberta 2010 for their wiki
+
*      edited by Team Alberta 2010 for their wiki
-
*/
+
*/
-
 
+
div#test{
div#test{
-
background-color:red;
+
    background-color:red;
width:100px;
width:100px;
height:100px;
height:100px;
}
}
 +
 +
div#preload { display: none; }
/* things we want to hide */
/* things we want to hide */
Line 19: Line 20:
#p-logo{
#p-logo{
-
  display:none;
+
      display:none;
}
}
/* rearrange the topsection bar */
/* rearrange the topsection bar */
#top-section{
#top-section{
-
    height:0;
+
        height:0;
}
}
#menubar{
#menubar{
-
    top:0;
+
        top:0;
}
}
#search-controls{
#search-controls{
-
    top:4px;
+
        top:4px;
-
    left:547px;
+
                left:547px;
-
    width:0;
+
                        width:0;
}
}
#searchInput{
#searchInput{
-
    border:1px solid white;
+
        border:1px solid white;
-
    position:absolute;
+
                  position:absolute;
}
}
-
/*
+
 
-
#mw-searchButton{
+
-
    color:#FFFFFF;
+
-
    left:172px;
+
-
    top:0;
+
-
    position:absolute;
+
-
}
+
-
#searchGoButton{
+
-
    position:absolute;
+
-
    left:130px;
+
-
}
+
-
*/
+
#searchGoButton{
#searchGoButton{
-
  display:none;
+
      display:none;
}
}
#mw-searchButton{
#mw-searchButton{
-
  background-color:#282560;
+
      background-color:#3C2415;
-
  border:1px solid white;
+
        border:1px solid white;
-
  color:transparent;
+
                color:transparent;
-
  height:19px;
+
                        height:19px;
-
  left:124px;
+
                                  left:124px;
-
  position:absolute;
+
                                        position:absolute;
-
  top:-1px;
+
                                                    top:-1px;
-
  width:24px;
+
                                                          width:24px;
-
  cursor:pointer;
+
                                                                  cursor:pointer;
-
  background-image:url("https://static.igem.org/mediawiki/2010/8/83/Team-alberta-search-glass.png");
+
                                                                          background-image:url("https://static.igem.org/mediawiki/2010/8/83/Team-alberta-search-glass.png");
-
  background-position:center center;
+
                                                                            background-position:center center;
-
  background-repeat:no-repeat;
+
                                                                              background-repeat:no-repeat;
}
}
 +
#catlinks{
 +
display:none;
 +
}
/******** things we added ****************/
/******** things we added ****************/
#tour-link{
#tour-link{
-
  -moz-border-radius:10px 10px 10px 10px;   
+
      -moz-border-radius:10px 10px 10px 10px;   
-
  -webkit-border-radius:10px 10px 10px 10px;   
+
        -webkit-border-radius:10px 10px 10px 10px;   
-
  background-color:#282560;   
+
          background-color:#FFFCD5;   
-
  position: absolute;
+
            position: absolute;
-
  bottom: 0px;
+
                        bottom: 0px;
-
  left: 0px;
+
                                  left: 0px;
-
  padding:28px;
+
                                          padding:28px;
-
  width: 89%;
+
                                                    width: 89%;
-
  text-align:center;
+
                                                            text-align:center;
-
  z-index: 10;
+
                                                              z-index: 10;
}
}
#tour-link:hover{
#tour-link:hover{
-
  background-color:#403B9D;
+
      background-color:#403B9D;
-
  cursor: pointer;
+
        cursor: pointer;
}
}
#tour-link p {
#tour-link p {
-
  margin: 0;
+
      margin: 0;
-
  color:#FFFFFF;
+
                color:#FFFFFF;
-
  font-weight:bold;
+
                        font-weight:bold;
-
  font-size:30px;
+
                          font-size:30px;
}
}
div#igem-logo-link{
div#igem-logo-link{
   background-color:transparent;
   background-color:transparent;
-
   background-image:url("https://static.igem.org/mediawiki/2010/7/74/Team-Alberta-IGEM-logo100x77.png");
+
   background-image:url("https://static.igem.org/mediawiki/2011/7/71/TeamAlberta_IGEMLOGO_100x77.png");
   height:77px;
   height:77px;
   margin:0;
   margin:0;
Line 113: Line 106:
   width:100px;
   width:100px;
}
}
 +
 +
#second-nav{
 +
background-color:#F7941E;
 +
position:absolute;
 +
top:155px;
 +
left:150px;
 +
height:28px;
 +
font-size:11px;
 +
}
 +
 +
#second-nav ul {
 +
      list-style:none;
 +
      /* list-style-type:none;*/
 +
margin:0;
 +
padding:0;
 +
/*overflow:hidden;*/
 +
/* for IE */
 +
  filter:alpha(opacity=96);
 +
  /* CSS3 standard */
 +
  opacity:0.96;
 +
           
 +
}
 +
#second-nav ul li{
 +
border-style: solid;
 +
border-color: #000;
 +
border-width: 1px;
 +
        float:left;
 +
      position:relative;
 +
}
 +
 +
#second-nav ul li a:visited,#second-nav ul li a:link{
 +
display:block;
 +
width:150px;
 +
height:28px;
 +
color:#FFFFFF;
 +
background-color:#F7941E;
 +
text-align:center;
 +
 +
}
 +
#second-nav ul li a:hover,#second-nav ul li a.selected {
 +
background-color:#3C2415;
 +
text-decoration:none;
 +
//left:auto;
 +
 +
 +
}
 +
 +
#second-nav li.headlink ul{
 +
        display:none;
 +
list-style:none;
 +
background-color:#3C2415;                             
 +
                                              text-align:center;
 +
                                                  padding:6px,0px;
 +
                                                 
 +
                                                                  position:absolute;
 +
                                                                         
 +
                                                                                     
 +
}
 +
#second-nav li.headlink ul li{
 +
        float:center;
 +
}
 +
 +
#top-strip{
#top-strip{
-
    background-color:#282560;
+
      /* background-color:#FFFCD5; */
-
    clear:both;
+
            clear:both;
-
    display:block;
+
                      display:block;
-
    height:170px;
+
                                /*  height:200px;*/
-
    padding-left:50%;
+
                                                    position:absolute;
-
    padding-right:54%;
+
                                                                  top:30px;
-
    position:absolute;
+
                                                                          width:900px;
-
    top:0;
+
-
    width:0
+
}
}
#top-strip h2{
#top-strip h2{
-
    color:#73FF9A;
+
        color:#000000;
-
    display:block;
+
                  display:inline;
-
    font-size:35px;
+
                              font-size:70px;
-
    font-weight:bold;
+
                                  font-weight:bold;
-
    left:61px;
+
                                      left:200px;
-
    line-height:39px;
+
                                              line-height:79px;
-
    position:relative;
+
                                                  position:relative;
-
    top:22px;
+
                                                                top:32px;
}
}
/*** position the genomikon logo ***/
/*** position the genomikon logo ***/
#top-strip a img{
#top-strip a img{
-
    position:absolute;
+
        position:absolute;
-
    top:38px;
+
                    top:38px;
-
    left:0;
+
                            left:0;
-
    width:auto;
+
                                      width:auto;
-
    height:79px;
+
                                                height:79px;
}
}
/*** navbar styling **/
/*** navbar styling **/
#navbar {
#navbar {
-
    position:absolute;
+
width:1050px;
-
    top:131px;
+
        position:absolute;
 +
        top:16px;
 +
left:-25px;
 +
font-size:11px;
 +
}
 +
 
 +
#navbar ul {
 +
        list-style:none;
 +
      /* 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;
 +
      position:relative;
 +
}
 +
 
 +
#navbar ul li a:visited,#navbar ul li a:link{
 +
display:block;
 +
width:150px;
 +
height:28px;
 +
color:#FFFFFF;
 +
background-color:#F7941E;
 +
text-align:center;
 +
 
 +
}
 +
#navbar ul li a:hover,#navbar ul li a.selected {
 +
background-color:#3C2415;
 +
text-decoration:none;
 +
left:auto;
 +
 
 +
 
 +
}
 +
 
 +
#navbar li.headlink ul{
 +
        display:none;
 +
list-style:none;
 +
background-color:#3C2415;                             
 +
                                              text-align:center;
 +
                                                  padding:6px,0px;
 +
                                                 
 +
                                                                  position:absolute;
 +
                                                                         
 +
                                                                                     
 +
}
 +
#navbar li.headlink ul li{
 +
        float:center;
 +
}
 +
 
 +
 
 +
/*
 +
div#navbar {
 +
    width: 900px;
 +
}
 +
#navbar {
 +
        position:absolute;
 +
        top:20px;
}
}
#navbar ul {
#navbar ul {
-
    list-style:none;
+
        list-style:none;
-
    width:100%;
+
            width:100%;
}
}
#navbar ul li{
#navbar ul li{
-
    float:left;
+
        float:left;
-
    position:relative;
+
        position:relative;
}
}
#navbar ul li a:visited,#navbar ul li a:link{
#navbar ul li a:visited,#navbar ul li a:link{
-
    margin-right:30px;
+
        margin-right:30px;
-
    color:#fff;
+
            color:#fff;
-
    font-weight:bold;
+
                 
}
}
#navbar ul li a:hover,#navbar ul li a.selected {
#navbar ul li a:hover,#navbar ul li a.selected {
-
  // color:#00F2BC;
+
  text-decoration: underline;
-
    color:#39B54A;
+
  font-weight: bold;
-
    text-decoration:none;
+
        color:#3C2415;
 +
                  text-decoration:none;
}
}
#navbar li.headlink ul{
#navbar li.headlink ul{
-
    display:table;
+
        display:table;
-
    display:none;
+
                    display:none;
-
    //background-color:#282560;
+
                                background-color:#F7941E;
-
    background-color:#39B54A;
+
                                              text-align:left;
-
    margin:0 10px 0 0;
+
                                                  padding:10px;
-
    text-align:left;
+
                                                              z-index:20;
-
    padding:10px;
+
                                                                  position:absolute;
-
    z-index:20;
+
                                                                                left:-10px;
-
    position:absolute;
+
                                                                                        width:100%;
-
    left:-10px;
+
-
    width:100%;
+
}
}
#navbar li.headlink ul li{
#navbar li.headlink ul li{
-
    float:none;
+
        float:center;
}
}
 +
*/
 +
/* make a content area in center and a sidebar on each side*/
/* make a content area in center and a sidebar on each side*/
#left-sidebar, #right-sidebar, #center-content, #wide-content{
#left-sidebar, #right-sidebar, #center-content, #wide-content{
-
    float:left;
+
        float:left;
-
    /* leave space for header */
+
                  /* leave space for header */
-
    margin-top:170px;
+
                  margin-top:160px;
-
    min-height:1em;
+
                      min-height:1em;
}
}
#left-sidebar.not-top, #right-sidebar.not-top, #center-content.not-top, #wide-content.not-top{
#left-sidebar.not-top, #right-sidebar.not-top, #center-content.not-top, #wide-content.not-top{
-
    margin-top:0;
+
        margin-top:0;
}
}
#center-content{
#center-content{
-
    width:550px;  
+
        width:550px;  
}
}
 +
/*The centre content for the Timeline needs to be a bit wider*/
/*The centre content for the Timeline needs to be a bit wider*/
#center-content .timeline{
#center-content .timeline{
-
    width:800px;
+
        width:800px;
-
    float:none;
+
                  float:none;
}
}
#wide-content{
#wide-content{
-
    width:1075px;
+
        width:1075px;
}
}
#left-sidebar, #right-sidebar{
#left-sidebar, #right-sidebar{
-
    width:198px;
+
  margin-top:160px;
 +
        width:198px;
}
}
/*Need Timeline to start at left*/
/*Need Timeline to start at left*/
#left-sidebar .Timeline{
#left-sidebar .Timeline{
-
    width:0px;
+
        width:0px;
}
}
#left-sidebar{
#left-sidebar{
-
    margin-right:20px;
+
        margin-right:20px;
}
}
#right-sidebar{
#right-sidebar{
-
    border:none;
+
        border:none;
-
    margin-left:20px;
+
                  margin-left:20px;
-
 
+
-
/*  position: absolute;
+
-
    right: 0px;
+
-
    width: 190px;
+
-
    border-left: 3px solid gray;
+
-
    font-size: 95%;
+
-
    line-height: 90%;*/
+
}
}
#tourbar-back{
#tourbar-back{
-
    clear:both;
+
        clear:both;
-
    height: 3px;
+
                  height: 3px;
-
    width: 100%;
+
                              width: 100%;
-
    background-color: #EEEEEE;
+
                                        background-color: #EEEEEE;
}
}
/* the tourbar */
/* the tourbar */
#tourbar{
#tourbar{
-
    clear:both;
+
        clear:both;
-
    height:5em;
+
                  height:5em;
-
    margin:173px auto 4em;
+
                            margin:173px auto 4em;
-
    width:788px;
+
                                        width:788px;
}
}
#tourbar a{
#tourbar a{
-
    background:none repeat scroll 0 0 #CCCCCC;
+
        background:none repeat scroll 0 0 #CCCCCC;
-
    color:black;
+
                      color:black;
-
    display:block;
+
                                display:block;
-
    float:left;
+
                                            float:left;
-
    height:1em;
+
                                                      height:1em;
-
    padding:3em 0;
+
                                                                  padding:3em 0;
-
    text-align:center;
+
                                                                              text-align:center;
-
    vertical-align:middle;
+
                                                                                  vertical-align:middle;
-
    font-weight: bold;
+
                                                                                      font-weight: bold;
-
    width:100px;
+
                                                                                          width:100px;
-
    margin-right:5px;
+
                                                                                                    margin-right:5px;
-
    margin-left:5px;
+
                                                                                                        margin-left:5px;
-
    -moz-border-radius: 10px;
+
                                                                                                            -moz-border-radius: 10px;
-
    border-radius: 10px;
+
                                                                                                                border-radius: 10px;
}
}
#tourbar a:hover{
#tourbar a:hover{
-
    text-decoration: none;
+
        text-decoration: none;
-
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
+
            filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
-
    -moz-opacity: 0.5;
+
                      -moz-opacity: 0.5;
-
    opacity: 0.5;
+
                          opacity: 0.5;
}
}
#tourbar a.selected{
#tourbar a.selected{
-
    margin-top:1em;
+
        margin-top:1em;
}
}
#tourbar a.left{
#tourbar a.left{
-
    background-color:white;
+
        background-color:white;
-
    background-image:url("/wiki/images/d/da/Team-alberta-left-arrow.png");
+
            background-image:url("/wiki/images/d/da/Team-alberta-left-arrow.png");
-
    background-repeat:no-repeat;
+
                background-repeat:no-repeat;
-
    width:54px;
+
                    width:54px;
}
}
#tourbar a.right{
#tourbar a.right{
-
    background-color:white;
+
        background-color:white;
-
    background-image:url("/wiki/images/6/6f/Team-alberta-right-arrow.png");
+
            background-image:url("/wiki/images/6/6f/Team-alberta-right-arrow.png");
-
    background-repeat:no-repeat;
+
                background-repeat:no-repeat;
-
    width:54px;
+
                    width:54px;
}
}
/* the info boxes on homepage */
/* the info boxes on homepage */
#main-info-box,#info-box1,#info-box2,#info-box3,#info-box4{
#main-info-box,#info-box1,#info-box2,#info-box3,#info-box4{
-
    height:250px;
+
        height:250px;
-
    padding:18px;
+
                  padding:18px;
-
    z-index:-1;
+
                              z-index:-1;
-
    float:left;
+
                                  float:left;
}
}
#info-box1 ol,#info-box2 ol,#info-box3 ol,#info-box4 ol {
#info-box1 ol,#info-box2 ol,#info-box3 ol,#info-box4 ol {
-
    margin-left: 1em;
+
        margin-left: 1em;
}
}
#main-info-box {
#main-info-box {
-
    width:550px;
+
        width:550px;
-
    overflow:hidden;
+
                  overflow:hidden;
-
    padding:0;
+
                              padding:0;
-
    height:286px;
+
                                          height:286px;
-
    position: relative;
+
                                                      position: relative;
-
    z-index: 10;
+
                                                                    z-index: 10;
}
}
#tinted-info-box {
#tinted-info-box {
-
    width:100%
+
        width:100%
-
    overflow:hidden;
+
                      overflow:hidden;
-
    padding:10px;
+
                  padding:10px;
-
    height:286px;
+
                              height:286px;
-
    clear:both;
+
                                        clear:both;
-
    background-color: #00F2BC;
+
                                                  background-color: #00F2BC;
-
   
+
                                                     
}
}
#left-gray-box {
#left-gray-box {
-
    width:100%;
+
        width:100%;
-
    padding-left: 10px;
+
                  padding-left: 10px;
-
    background-color: #e6e6e6;
+
                      background-color: #e6e6e6;
}
}
#info-box1,#info-box2,#info-box3,#info-box4 {
#info-box1,#info-box2,#info-box3,#info-box4 {
-
    background-color:#00CDD0;
+
        background-color:#00CDD0;
-
    color:#282560;
+
            color:#FFFCD5;
-
    overflow:hidden;
+
                      overflow:hidden;
-
    width:228px;
+
                                  width:228px;
-
    margin-top: 18px;
+
                                            margin-top: 18px;
-
    cursor: pointer;
+
                                                cursor: pointer;
-
    -moz-border-radius: 10px;
+
                                                            -moz-border-radius: 10px;
-
    border-radius: 10px;
+
                                                                border-radius: 10px;
}
}
#info-box1 h2,#info-box2 h2,#info-box3 h2,#info-box4 h2{
#info-box1 h2,#info-box2 h2,#info-box3 h2,#info-box4 h2{
-
    color:#282560;
+
        color:#FFFCD5;
-
    text-align:center;
+
                  text-align:center;
-
    text-transform:uppercase;
+
                      text-transform:uppercase;
}
}
#info-box1 p,#info-box2 p,#info-box3 p,#info-box4 p{
#info-box1 p,#info-box2 p,#info-box3 p,#info-box4 p{
-
    color:#000
+
        color:#000
}
}
.right-info-box{
.right-info-box{
}
}
.center-info-box{
.center-info-box{
-
    float:left;
+
        float:left;
}
}
/* software */
/* software */
#tourbar a.software{
#tourbar a.software{
-
    background-color:#B5FFEE;
+
        background-color:#B5FFEE;
}
}
#info-box1{
#info-box1{
-
    margin-top:0;
+
        margin-top:0;
-
/*    background-color:#00cdd0;*/
+
        /*    background-color:#00cdd0;*/
-
    background-color:#B5FFEE;
+
            background-color:#B5FFEE;
-
    margin-left:12px;
+
                margin-left:12px;
}
}
#info-box1:hover {
#info-box1:hover {
-
    background-color: #93DDB4
+
        background-color: #93DDB4
}
}
/* kit box */
/* kit box */
#tourbar a.kit {
#tourbar a.kit {
-
    background-color:#b8fed1;
+
        background-color:#b8fed1;
}
}
#info-box2{
#info-box2{
-
    /*background-color: # b8fed1;*/
+
        /*background-color: # b8fed1;*/
-
    background-color:#D6FFE2;
+
        background-color:#D6FFE2;
}
}
#info-box2:hover {
#info-box2:hover {
-
    /*background-color:#9AC2FD;*/
+
        /*background-color:#9AC2FD;*/
-
    background-color:#A6FFC0;
+
        background-color:#A6FFC0;
}
}
/* achievments boxes*/
/* achievments boxes*/
#tourbar a.achievements{
#tourbar a.achievements{
-
    background-color:#B4FFC9;
+
        background-color:#B4FFC9;
}
}
#info-box3{
#info-box3{
-
/*    background-color:# 7 3FF9A;*/
+
    /*    background-color:# 7 3FF9A;*/
-
    background-color:#B4FFC9;
+
        background-color:#B4FFC9;
-
    margin-left:17px;
+
            margin-left:17px;
}
}
#info-box3:hover {
#info-box3:hover {
-
    background-color:#93DDb8;
+
        background-color:#93DDb8;
}
}
/* biobytes boxes */
/* biobytes boxes */
#tourbar a.biobytes{
#tourbar a.biobytes{
-
    background-color:#BCD7FF;
+
        background-color:#BCD7FF;
}
}
#info-box4 {
#info-box4 {
-
/*    background-color:#00F2BC;*/
+
    /*    background-color:#00F2BC;*/
-
    background-color:#BCD7FF;
+
        background-color:#BCD7FF;
-
    margin-left:18px;
+
            margin-left:18px;
}
}
#info-box4:hover {
#info-box4:hover {
-
/*    background-color:#33f5f6;*/
+
    /*    background-color:#33f5f6;*/
-
    background-color:#9AC2FD;
+
        background-color:#9AC2FD;
}
}
Line 407: Line 519:
#mytable  
#mytable  
{
{
-
width: 100%;
+
        width: 100%;
-
padding: 0;
+
                padding: 0;
-
margin: 0;
+
                            margin: 0;
}
}
#mytable th  
#mytable th  
{
{
-
  background-color:#282560;
+
      background-color:#FFFCD5;
-
  color:#fff;
+
        color:#fff;
-
  padding:6px 6px 6px 12px;
+
                padding:6px 6px 6px 12px;
-
  text-align:left;
+
                          text-align:left;
}
}
#mytable td  
#mytable td  
{
{
-
background: #ccc;
+
        background: #ccc;
-
padding: 0.3em 0.3em 0.3em 0.7em;
+
                        padding: 0.3em 0.3em 0.3em 0.7em;
-
color: #282560;
+
                                    color: #FFFCD5;
}
}
Line 430: Line 542:
#mytable td.alt  
#mytable td.alt  
{
{
-
background: #ffffff;
+
        background: #ffffff;
-
color: #282560;
+
                        color: #FFFCD5;
}
}
#mytable th.spec  
#mytable th.spec  
{
{
-
background: #a5a5a5 no-repeat;
+
        background: #a5a5a5 no-repeat;
-
font: bold 1em "Trebuchet MS", Times;
+
                        font: bold 1em "Trebuchet MS", Times;
-
        color: #ffffff;
+
                                      color: #ffffff;
}
}
#mytable th.specalt  
#mytable th.specalt  
{
{
-
background: #ffffff no-repeat;
+
        background: #ffffff no-repeat;
-
font: bold 1em "Trebuchet MS", Times;
+
                        font: bold 1em "Trebuchet MS", Times;
-
color: #656565;
+
                                color: #656565;
}
}
#mytable a:visited, #mytable a:link, #mytable a:hover{
#mytable a:visited, #mytable a:link, #mytable a:hover{
-
    color:#282560;
+
        color:#FFFCD5;
-
    text-decoration:underline;
+
                  text-decoration:underline;
}
}
#mytable a:hover {
#mytable a:hover {
-
    color:#00F2BC;
+
        color:#00F2BC;
}
}
Line 459: Line 571:
#toctitle, span.tocnumber {
#toctitle, span.tocnumber {
-
  display:none;
+
      display:none;
}
}
.toclevel-1{
.toclevel-1{
-
  margin-bottom:1em;
+
      margin-bottom:1em;
}
}
.toclevel-2{
.toclevel-2{
-
  display:none;
+
      display:none;
}
}
span.toctext {
span.toctext {
-
  color: #282560;
+
      color: #3C2415;
-
  font-size:14px;
+
              font-size:14px;
-
  line-height:14px;
+
                line-height:14px;
}
}
#footer-box{
#footer-box{
-
  background-color:#E6E6E6;
+
      background-color:#E6E6E6;
-
  border:none;
+
        border:none;
-
  margin:100px auto 0;
+
                margin:100px auto 0;
-
  padding:5px;
+
                          padding:5px;
-
  width:965px;
+
                                    width:965px;
}
}
 +
body {
body {
-
  background-color:#FFFFFF;
+
      background-color:#F7941E;
-
  background-image:url("https://static.igem.org/mediawiki/2010/3/36/Team-Alberta-topStrip.png");
+
      background-image:url("https://static.igem.org/mediawiki/2011/7/74/TeamAlberta-strip2.png");
-
  background-repeat:repeat-x;
+
      background-repeat:repeat-x;
 +
      font-family:corbel;
 +
      text-align:justify;
}
}
#thanks-footer{
#thanks-footer{
-
    position: relative;
+
        position: relative;
-
    width: 1032px;
+
                      width: 1032px;
-
    left: 0px;
+
                                left: 0px;
-
    clear:both;
+
                                          clear:both;
-
    background-color: #DDDDDD;
+
                                                    background-color: #DDDDDD;
-
    top: 12px;
+
                                                        top: 12px;
-
    border-radius: 10px;
+
                                                                  border-radius: 10px;
-
    -moz-border-radius: 10px;
+
                                                                      -moz-border-radius: 10px;
-
    text-align: center;
+
                                                                          text-align: center;
}
}
Line 501: Line 616:
h1, h2, h3, h4, h5, h6 {
h1, h2, h3, h4, h5, h6 {
-
    color: #9D2063;
+
        color: #3c2415;
-
    border:none;
+
                  border:none;
 +
font-family:eurostile;
}
}
h2 {
h2 {
-
    line-height:125%;
+
        line-height:125%;
}
}
h3{
h3{
-
  font-size:100%;
+
      font-size:100%;
-
  font-weight:normal;
+
          font-weight:normal;
-
  position:relative;
+
            position:relative;
-
  top:-1em;
+
                        top:-1em;
-
  color: #282560;
+
                                color: #3c2415;
-
  font-style: italic;
+
                                          font-style: italic;
-
  margin-bottom: -0.5em;
+
                                            margin-bottom: -0.5em;
}
}
span.editsection, span.editsection a{
span.editsection, span.editsection a{
-
    color:#ccc;
+
        color:#ccc;
}
}
body{
body{
-
    background-color:#fff;
+
        background-color:#fff;
}
}
#content{
#content{
-
    border:none;
+
        border:none;
-
    width:975px;
+
 
-
    padding-left:0;
+
                            padding:0;
-
    padding-right:0;
+
background:none;
 +
 
 +
 
}
}
#menubar li a, #menubar .selected a, #menubar li a:visited{  
#menubar li a, #menubar .selected a, #menubar li a:visited{  
-
    color: #888;
+
        color: #888;
}
}
#menubar li a:hover{
#menubar li a:hover{
-
    color: #00F2BC;
+
        color: #00F2BC;
}
}
Line 542: Line 660:
/* table of contents */
/* table of contents */
#toc{
#toc{
-
    background-color: #EEEEEE;
+
        background-color: #FFFCD5;
-
    border:none;
+
            border:solid;
-
    width:100%;
+
border-color:#3C2415;
-
    padding-top: 14px;
+
height:150px;
-
    -moz-border-radius: 10px;
+
                      width:100%;
-
    border-radius: 10px;
+
                                margin-top: 30px;
 +
                                    -moz-border-radius: 10px;
 +
                                        border-radius: 10px;
 +
      border-width: 1px;
}
}
/*timeline stuff*/
/*timeline stuff*/
Line 554: Line 675:
#May{
#May{
-
background-color: Orange;
+
    background-color: Orange;
height: 500px;
height: 500px;
width: 780 px;
width: 780 px;
Line 561: Line 682:
ul.rolodex{
ul.rolodex{
-
    list-style-type: none;
+
        list-style-type: none;
-
    list-style-image: none;
+
            list-style-image: none;
}
}
ul.rolodex li{
ul.rolodex li{
-
    color: #282560;
+
        color: #FFFCD5;
}
}
ul.rolodex li:hover {
ul.rolodex li:hover {
-
    color: #00F2BC;
+
        color: #00F2BC;
-
    cursor: pointer;
+
                  cursor: pointer;
}
}
.startimage:hover {
.startimage:hover {
-
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
+
        filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
-
    -moz-opacity: 0.5;
+
                  -moz-opacity: 0.5;
-
    opacity: 0.5;
+
                      opacity: 0.5;
}
}
div#horiz-line {
div#horiz-line {
-
    height: 3px;
+
        height: 3px;
-
    width: 100%;
+
                    width: 100%;
-
    background-color: #282560;
+
                              background-color: #39b54a;
-
    margin-top: -1em;
+
                                  margin-top: -1em;
-
    margin-bottom: 1em;
+
                                      margin-bottom: 1em;
}
}
-
#highschool4 {
+
#manual {
-
    position: relative;
+
        position: relative;
-
    top: 468px;
+
                      top: 2500px;
 +
right:-50px;
 +
}
 +
 
 +
#waste {
 +
        position: relative;
 +
                      top: 500px;
 +
right:-20px;
 +
}
 +
 
 +
#labelledflask {
 +
        position: relative;
 +
                      top: 800px;
 +
left:-30px;
 +
}
 +
 
 +
#part1 {
 +
        position: relative;
 +
top:50px;
 +
left:-20px;
 +
}
 +
 
 +
#part2 {
 +
        position: relative;
 +
top:50px;
 +
right:-20px;
 +
}
 +
 
 +
div.submenu {
 +
    position: absolute;
 +
    top: 175px;
 +
    left: 50px;
 +
}
 +
 
 +
a.submenu {
 +
    float: left;
 +
    text-align: center;
 +
    border-style: solid;
 +
    border-radius: 10px;
 +
    border-width: 2px;
 +
    border-color: #000000;
 +
    background-color: #5BB567;
 +
    width: 200px;
 +
    padding:20px;
 +
    margin: 8px;
 +
    text-decoration: none;
 +
    color: #000000;
 +
    font-size: 16px;
 +
}
 +
 
 +
a.submenu:hover {
 +
    background-color: #FFFCD5;
}
}

Latest revision as of 23:57, 24 August 2011

/* NOTE This is an edited version of the MediaWiki 'monobook' style sheet 

*      edited by Team Alberta 2010 for their wiki
*/

div#test{ 

   background-color:red;

width:100px; height:100px; }

div#preload { display: none; }

/* things we want to hide */

  1. info-box1 h2 .editsection, #info-box2 h2 .editsection, #info-box3 h2 .editsection, #info-box4 h2 .editsection{

display:none; } h1.firstHeading { display:none; }

  1. p-logo{ 
     display:none;

}

/* rearrange the topsection bar */

  1. top-section{ 
       height:0;

}

  1. menubar{ 
       top:0;

}

  1. search-controls{ 
       top:4px;
               left:547px;
                        width:0;

}

  1. searchInput{ 
       border:1px solid white;
                  position:absolute;

}


  1. searchGoButton{ 
     display:none;

}

  1. mw-searchButton{ 
     background-color:#3C2415;
       border:1px solid white;
                color:transparent;
                        height:19px;
                                 left:124px;
                                        position:absolute;
                                                   top:-1px;
                                                         width:24px;
                                                                 cursor:pointer;
                                                                          background-image:url("Team-alberta-search-glass.png");
                                                                            background-position:center center;
                                                                              background-repeat:no-repeat;

}

  1. catlinks{

display:none; }


/******** things we added ****************/

  1. tour-link{ 
     -moz-border-radius:10px 10px 10px 10px;  
       -webkit-border-radius:10px 10px 10px 10px;  
         background-color:#FFFCD5;  
           position: absolute;
                       bottom: 0px;
                                 left: 0px;
                                         padding:28px;
                                                   width: 89%;
                                                            text-align:center;
                                                              z-index: 10;

}

  1. tour-link:hover{ 
     background-color:#403B9D;
       cursor: pointer;

}

  1. tour-link p { 
     margin: 0;
               color:#FFFFFF;
                       font-weight:bold;
                         font-size:30px;

}

div#igem-logo-link{ 

 background-color:transparent;
 background-image:url("TeamAlberta_IGEMLOGO_100x77.png");
 height:77px;
 margin:0;
 position:absolute;
 width:100px;
 left:870px;
 top:33px;

}

div#igem-logo-link a{ 

 color:transparent;
 display:block;
 height:77px;
 width:100px;

}

  1. second-nav{

background-color:#F7941E; position:absolute; top:155px; left:150px; height:28px; font-size:11px; }

  1. second-nav ul { 
      list-style:none;
      /* list-style-type:none;*/

margin:0; padding:0; /*overflow:hidden;*/ /* for IE */ 

 filter:alpha(opacity=96);
 /* CSS3 standard */
 opacity:0.96;

}

  1. second-nav ul li{

border-style: solid; border-color: #000; border-width: 1px; 

       float:left;
      position:relative;

}

  1. second-nav ul li a:visited,#second-nav ul li a:link{

display:block; width:150px; height:28px; color:#FFFFFF; background-color:#F7941E; text-align:center;

}

  1. second-nav ul li a:hover,#second-nav ul li a.selected {

background-color:#3C2415; text-decoration:none; //left:auto;


}

  1. second-nav li.headlink ul{ 
       display:none;

list-style:none; background-color:#3C2415; 

                                              text-align:center;
                                                  padding:6px,0px;
                                                 
                                                                  position:absolute;

}

  1. second-nav li.headlink ul li{ 
        float:center;

}


  1. top-strip{ 
      /* background-color:#FFFCD5; */
           clear:both;
                     display:block;
                               /*  height:200px;*/
                                                    position:absolute;
                                                                 top:30px;
                                                                         width:900px;

}

  1. top-strip h2{ 
       color:#000000;
                 display:inline;
                             font-size:70px;
                                 font-weight:bold;
                                     left:200px;
                                              line-height:79px;
                                                  position:relative;
                                                               top:32px;

}

/*** position the genomikon logo ***/

  1. top-strip a img{ 
       position:absolute;
                    top:38px;
                            left:0;
                                     width:auto;
                                               height:79px;

}

/*** navbar styling **/

  1. navbar {

width:1050px; 

       position:absolute;
       top:16px;

left:-25px; font-size:11px; }

  1. navbar ul { 
       list-style:none;
      /* list-style-type:none;*/

margin:0; padding:0; /*overflow:hidden;*/ /* for IE */ 

 filter:alpha(opacity=96);
 /* CSS3 standard */
 opacity:0.96;

}

  1. navbar ul li{ 
       float:left;
      position:relative;

}

  1. navbar ul li a:visited,#navbar ul li a:link{

display:block; width:150px; height:28px; color:#FFFFFF; background-color:#F7941E; text-align:center;

}

  1. navbar ul li a:hover,#navbar ul li a.selected {

background-color:#3C2415; text-decoration:none; left:auto;


}

  1. navbar li.headlink ul{ 
       display:none;

list-style:none; background-color:#3C2415; 

                                              text-align:center;
                                                  padding:6px,0px;
                                                 
                                                                  position:absolute;

}

  1. navbar li.headlink ul li{ 
        float:center;

}


/* div#navbar { 

    width: 900px;

}

  1. navbar { 
       position:absolute;
       top:20px;

}

  1. navbar ul { 
       list-style:none;
           width:100%;

}

  1. navbar ul li{ 
       float:left;
       position:relative;

}

  1. navbar ul li a:visited,#navbar ul li a:link{ 
       margin-right:30px;
           color:#fff;

}

  1. navbar ul li a:hover,#navbar ul li a.selected { 
 text-decoration: underline;
 font-weight: bold;
       color:#3C2415;
                 text-decoration:none;

}

  1. navbar li.headlink ul{ 
       display:table;
                   display:none;
                               background-color:#F7941E;
                                              text-align:left;
                                                  padding:10px;
                                                              z-index:20;
                                                                  position:absolute;
                                                                               left:-10px;
                                                                                        width:100%;

}

  1. navbar li.headlink ul li{ 
        float:center;

}

  • /


/* make a content area in center and a sidebar on each side*/

  1. left-sidebar, #right-sidebar, #center-content, #wide-content{ 
       float:left;
                 /* leave space for header */
                 margin-top:160px;
                     min-height:1em;

}

  1. left-sidebar.not-top, #right-sidebar.not-top, #center-content.not-top, #wide-content.not-top{ 
       margin-top:0;

}

  1. center-content{ 
       width:550px;

}

/*The centre content for the Timeline needs to be a bit wider*/

  1. center-content .timeline{ 
       width:800px;
                 float:none;

}

  1. wide-content{ 
       width:1075px;

}

  1. left-sidebar, #right-sidebar{ 
 margin-top:160px;
       width:198px;

} /*Need Timeline to start at left*/

  1. left-sidebar .Timeline{ 
       width:0px;

}

  1. left-sidebar{ 
       margin-right:20px;

}

  1. right-sidebar{ 
       border:none;
                  margin-left:20px;

}

  1. tourbar-back{ 
       clear:both;
                 height: 3px;
                             width: 100%;
                                        background-color: #EEEEEE;

} /* the tourbar */

  1. tourbar{ 
       clear:both;
                 height:5em;
                            margin:173px auto 4em;
                                       width:788px;

}

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

}

  1. tourbar a:hover{ 
       text-decoration: none;
           filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
                      -moz-opacity: 0.5;
                          opacity: 0.5;

}

  1. tourbar a.selected{ 
       margin-top:1em;

}

  1. tourbar a.left{ 
       background-color:white;
           background-image:url("/wiki/images/d/da/Team-alberta-left-arrow.png");
               background-repeat:no-repeat;
                   width:54px;

}

  1. tourbar a.right{ 
       background-color:white;
           background-image:url("/wiki/images/6/6f/Team-alberta-right-arrow.png");
               background-repeat:no-repeat;
                   width:54px;

} /* the info boxes on homepage */

  1. main-info-box,#info-box1,#info-box2,#info-box3,#info-box4{ 
       height:250px;
                  padding:18px;
                              z-index:-1;
                                  float:left;

}

  1. info-box1 ol,#info-box2 ol,#info-box3 ol,#info-box4 ol { 
       margin-left: 1em;

}

  1. main-info-box { 
       width:550px;
                 overflow:hidden;
                              padding:0;
                                          height:286px;
                                                     position: relative;
                                                                   z-index: 10;

}

  1. tinted-info-box { 
       width:100%
                     overflow:hidden;
                 padding:10px;
                             height:286px;
                                        clear:both;
                                                  background-color: #00F2BC;

}

  1. left-gray-box { 
       width:100%;
                 padding-left: 10px;
                     background-color: #e6e6e6;

}

  1. info-box1,#info-box2,#info-box3,#info-box4 { 
       background-color:#00CDD0;
           color:#FFFCD5;
                     overflow:hidden;
                                  width:228px;
                                            margin-top: 18px;
                                                cursor: pointer;
                                                            -moz-border-radius: 10px;
                                                                border-radius: 10px;

}

  1. info-box1 h2,#info-box2 h2,#info-box3 h2,#info-box4 h2{ 
       color:#FFFCD5;
                 text-align:center;
                     text-transform:uppercase;

}

  1. info-box1 p,#info-box2 p,#info-box3 p,#info-box4 p{ 
       color:#000

} .right-info-box{ } .center-info-box{ 

       float:left;

} /* software */

  1. tourbar a.software{ 
       background-color:#B5FFEE;

}

  1. info-box1{ 
       margin-top:0;
       /*    background-color:#00cdd0;*/
           background-color:#B5FFEE;
               margin-left:12px;

}

  1. info-box1:hover { 
       background-color: #93DDB4

}

/* kit box */

  1. tourbar a.kit { 
       background-color:#b8fed1;

}

  1. info-box2{ 
       /*background-color: # b8fed1;*/
       background-color:#D6FFE2;

}

  1. info-box2:hover { 
       /*background-color:#9AC2FD;*/
       background-color:#A6FFC0;

}

/* achievments boxes*/

  1. tourbar a.achievements{ 
       background-color:#B4FFC9;

}

  1. info-box3{ 
   /*    background-color:# 7 3FF9A;*/
       background-color:#B4FFC9;
           margin-left:17px;

}

  1. info-box3:hover { 
       background-color:#93DDb8;

}

/* biobytes boxes */

  1. tourbar a.biobytes{ 
       background-color:#BCD7FF;

}

  1. info-box4 { 
   /*    background-color:#00F2BC;*/
       background-color:#BCD7FF;
           margin-left:18px;

}

  1. info-box4:hover { 
   /*    background-color:#33f5f6;*/
       background-color:#9AC2FD;

}


/* parts table */

  1. mytable

{ 

       width: 100%;
               padding: 0;
                           margin: 0;

}

  1. mytable th

{ 

     background-color:#FFFCD5;
       color:#fff;
               padding:6px 6px 6px 12px;
                         text-align:left;

}

  1. mytable td

{ 

       background: #ccc;
                       padding: 0.3em 0.3em 0.3em 0.7em;
                                   color: #FFFCD5;

}


  1. mytable td.alt

{ 

       background: #ffffff;
                       color: #FFFCD5;

}

  1. mytable th.spec

{ 

       background: #a5a5a5 no-repeat;
                       font: bold 1em "Trebuchet MS", Times;
                                     color: #ffffff;

}

  1. mytable th.specalt

{ 

       background: #ffffff no-repeat;
                       font: bold 1em "Trebuchet MS", Times;
                               color: #656565;

}

  1. mytable a:visited, #mytable a:link, #mytable a:hover{ 
       color:#FFFCD5;
                 text-decoration:underline;

}

  1. mytable a:hover { 
        color:#00F2BC;

}

/********* things we changed ***********/


  1. toctitle, span.tocnumber { 
     display:none;

} .toclevel-1{ 

     margin-bottom:1em;

} .toclevel-2{ 

     display:none;

} span.toctext { 

     color: #3C2415;
              font-size:14px;
                line-height:14px;

}

  1. footer-box{ 
     background-color:#E6E6E6;
       border:none;
                margin:100px auto 0;
                         padding:5px;
                                   width:965px;

}

body { 

     background-color:#F7941E;
     background-image:url("TeamAlberta-strip2.png");
     background-repeat:repeat-x; 
     font-family:corbel;
     text-align:justify;

}

  1. thanks-footer{ 
       position: relative;
                     width: 1032px;
                                left: 0px;
                                          clear:both;
                                                    background-color: #DDDDDD;
                                                        top: 12px;
                                                                 border-radius: 10px;
                                                                     -moz-border-radius: 10px;
                                                                         text-align: center;

}

/* new colors */

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

       color: #3c2415;
                  border:none;

font-family:eurostile; }

h2 { 

       line-height:125%;

}

h3{ 

      font-size:100%;
         font-weight:normal;
            position:relative;
                        top:-1em;
                               color: #3c2415;
                                         font-style: italic;
                                            margin-bottom: -0.5em;

}

span.editsection, span.editsection a{ 

       color:#ccc;

} body{ 

       background-color:#fff;

}

  1. content{ 
       border:none;

                            padding:0;

background:none;


}

  1. menubar li a, #menubar .selected a, #menubar li a:visited{ 
       color: #888;

}

  1. menubar li a:hover{ 
       color: #00F2BC;

}


/* table of contents */

  1. toc{ 
       background-color: #FFFCD5;
           border:solid;

border-color:#3C2415; height:150px; 

                      width:100%;
                                margin-top: 30px;
                                    -moz-border-radius: 10px;
                                        border-radius: 10px;
      border-width: 1px;

} /*timeline stuff*/

/*months and their overlaying divs*/

  1. May{ 
   background-color: Orange;

height: 500px; width: 780 px;

}

ul.rolodex{ 

       list-style-type: none;
           list-style-image: none;

}

ul.rolodex li{ 

       color: #FFFCD5;

} ul.rolodex li:hover { 

       color: #00F2BC;
                  cursor: pointer;

}

.startimage:hover { 

       filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
                  -moz-opacity: 0.5;
                      opacity: 0.5;

} div#horiz-line { 

       height: 3px;
                   width: 100%;
                              background-color: #39b54a;
                                  margin-top: -1em;
                                      margin-bottom: 1em;

}

  1. manual { 
       position: relative;
                     top: 2500px;

right:-50px; }

  1. waste { 
       position: relative;
                     top: 500px;

right:-20px; }

  1. labelledflask { 
       position: relative;
                     top: 800px;

left:-30px; }

  1. part1 { 
       position: relative;

top:50px; left:-20px; }

  1. part2 { 
       position: relative;

top:50px; right:-20px; }

div.submenu { 

    position: absolute;
    top: 175px;
    left: 50px;

}

a.submenu { 

    float: left;
    text-align: center;
    border-style: solid;
    border-radius: 10px;
    border-width: 2px;
    border-color: #000000;
    background-color: #5BB567;
    width: 200px;
    padding:20px;
    margin: 8px;
    text-decoration: none;
    color: #000000;
    font-size: 16px;

}

a.submenu:hover { 

    background-color: #FFFCD5;

}

Retrieved from "http://2011.igem.org/Team:Alberta/sample.css"