Team:SYSU-Software/tutorial.css

From 2013.igem.org

(Difference between revisions)
Line 11: Line 11:
 +
 +
    /*header images */
 +
    #team-header{
 +
      margin: 0 auto;
 +
      z-index: 100;
 +
 +
      height: 200px;
 +
      width: 980px;
 +
      background-color: white;
 +
 +
      font-family: 'Arial';
 +
    }
 +
    #team-header-logo{
 +
      position: relative;
 +
      left: 20px;
 +
      top:30px;
 +
    }
 +
    #team-header-text{
 +
      position: relative;
 +
      left: 130px;
 +
      top: -67px;
 +
    }
 +
 +
    #boss-header-image{
 +
      position: relative;
 +
      left: 285px;
 +
      top: -85px;
 +
    }
 +
 +
    /*navigation*/
 +
    #navigation{
 +
      float: right;
 +
      height: 40px;
 +
 +
      z-index: 100;
 +
 +
      position: relative;
 +
      top: -37px;
 +
    }
 +
 +
    .navbar {
 +
    margin-bottom: 0px;
 +
    overflow: visible;
 +
    }
 +
 +
    .nav{
 +
      display: inline;
 +
 +
      height: 40px;
 +
      background-color:#A8DBD2;   
 +
    }
 +
       
 +
    .navbar-inverse .nav > li > a{
 +
      font-size: 14px;
 +
      border: none;
 +
      height: 40px;
 +
      padding:0px 20px;
 +
 +
      line-height: 40px;
 +
    }
 +
    #nav-li{
 +
      height: 40px;
 +
    }
 +
   
 +
    .navbar-inverse .nav > li.active > a{
 +
      background-color: #FFE14B;
 +
      height: 40px;
 +
    }
 +
    .navbar-inverse .nav > li.active > a{
 +
      background-color: #FFE14B;
 +
    }
 +
    /*sub navs*/
 +
    #sub-link1{
 +
      width:90px;
 +
      background-color:#A8DBD2;
 +
    }   
 +
    .navbar .nav > li > ul:before {
 +
      border-width: 0px;
 +
    }
 +
 +
    #sub-link2{
 +
      width:100px;
 +
      background-color:#A8DBD2;
 +
    }   
 +
    #sub-link3{
 +
      width:135px;
 +
      background-color:#A8DBD2;
 +
 +
    }   
 +
    #sub-link4{
 +
      background-color:#A8DBD2;
 +
      width:70px;
 +
    }   
/*the tutorial content*/
/*the tutorial content*/
Line 116: Line 209:
   margin: 0 auto;
   margin: 0 auto;
}
}
 +
 +
/*footer*/
 +
    #team-footer{
 +
      width: 980px;
 +
      margin:0 auto;
 +
 +
      position: relative;
 +
      bottom: 0px;
 +
      overflow: hidden;
 +
 +
      background-color: #ebdfd2;
 +
    }
 +
    /*instructions*/
 +
    #team-sub{
 +
      position: relative;
 +
 +
      margin-bottom: 30px;
 +
    }
 +
    #subscribe{
 +
      position: relative;
 +
    }
 +
    #subscribe-header{
 +
      position: relative;
 +
      top: 25px;
 +
      left: 145px;
 +
 +
      font-weight: bolder;
 +
      font-size: 25px;
 +
    }
 +
    #subscribe-content{
 +
      position: relative;
 +
      top: 45px;
 +
      left: 145px;
 +
 +
      font-weight: bold;
 +
      line-height: 10px;
 +
    }
 +
    #link{
 +
      position: relative;
 +
      left: 100px;
 +
    }
 +
    #link-header{
 +
      position: relative;
 +
      top: 20px;
 +
      left: 180px;
 +
 +
      font-weight:bolder;
 +
      font-size: 25px;
 +
    }
 +
    #link-content{
 +
      position: relative;
 +
      top: 34px;
 +
      left: 180px;
 +
    }
 +
 +
    #link-content a{
 +
      text-decoration: none;
 +
    }
 +
    /*bottom image*/
 +
    #bottom-image{
 +
      position: relative;
 +
      bottom: 0px;
 +
    }
 +

Revision as of 08:23, 7 September 2013

*{
     padding:0px;
     margin: 0px;
   }
   body {
     height: 100%;
     width: 100%;
     background-color: #CCC;
     font-family: 'Arial';
   }


   /*header images */
   #team-header{
     margin: 0 auto;
     z-index: 100;
     height: 200px;
     width: 980px;
     background-color: white;
     font-family: 'Arial';
   }
   #team-header-logo{
     position: relative;
     left: 20px;
     top:30px;
   }
   #team-header-text{
     position: relative;
     left: 130px;
     top: -67px;
   }
   #boss-header-image{
     position: relative;
     left: 285px;
     top: -85px;
   }
   /*navigation*/
   #navigation{
     float: right;
     height: 40px;
     z-index: 100;
     position: relative;
     top: -37px;
   }
   .navbar {
   margin-bottom: 0px;
   overflow: visible;
   }
   .nav{
     display: inline;
     height: 40px;
     background-color:#A8DBD2;     
   }
       
   .navbar-inverse .nav > li > a{
     font-size: 14px;
     border: none;
     height: 40px;
     padding:0px 20px;
     line-height: 40px;
   }
   #nav-li{
     height: 40px;
   }
   
   .navbar-inverse .nav > li.active > a{
     background-color: #FFE14B;
     height: 40px;
   }
   .navbar-inverse .nav > li.active > a{
     background-color: #FFE14B; 
   }
   /*sub navs*/
   #sub-link1{
     width:90px;
     background-color:#A8DBD2; 
   }    
   .navbar .nav > li > ul:before {
     border-width: 0px;
   }
   #sub-link2{
     width:100px;
     background-color:#A8DBD2; 
   }    
   #sub-link3{
     width:135px;
     background-color:#A8DBD2; 
   }    
   #sub-link4{
     background-color:#A8DBD2; 
     width:70px;
   }    

/*the tutorial content*/

  1. tutorial-container{
 width: 980px;
 margin: 0 auto;
 height: 100%;
 background-color: #544444;

}

.subnav{

 float: right;
 padding-right: 4px;
 padding-top: 15px;
 font-size: 15px;

} .subnav a{

 color: white;

}

  1. tutorial-header{
 padding-top: 30px;
 padding-bottom: 30px; 
 font-size: 39px;
 color: white;
 font-weight: 900;
 text-align: center;

}

  1. tutorial-list{
 position: relative;
 left: 51px;
 padding-top: 10px;

}

  1. list-header{
 font-size: 23px;
 color: white;
 padding-bottom: 10px;

}

  1. tutorial-list ul{
 position: relative;
 left: -22px;
 list-style: none;
 padding-bottom: 70px;

} .mainnav li a{

 font-size: 15px;
 color: white;

}

  1. part-header{
 font-size: 23px;
 color: white;
 padding-bottom: 7px;

}

  1. part-content{
 width: 878px;
 height: 690px;
 padding-top: 17px;

}

  1. part-text{
 padding-top: 40px;
 padding-bottom: 220px;
 width: 720px;
 margin: 0 auto;
 font-size: 18px;
 color: white;

}

  1. part1{
 width: 880px;
 height: 100%;
 margin: 0 auto;

}

  1. part2{
 width: 880px;
 height: 100%;
 margin: 0 auto;

}

  1. part3{
 width: 880px;
 height: 100%;
 margin: 0 auto;

}

  1. part4{
 width: 880px;
 height: 100%;
 margin: 0 auto;

}

  1. part5{
 width: 880px;
 height: 100%;
 margin: 0 auto;

}

/*footer*/

   #team-footer{
     width: 980px;
     margin:0 auto;
     position: relative;
     bottom: 0px;
     overflow: hidden;
     background-color: #ebdfd2;
   }
   /*instructions*/
   #team-sub{
     position: relative;
     margin-bottom: 30px;
   }
   #subscribe{
     position: relative;
   }
   #subscribe-header{
     position: relative;
     top: 25px;
     left: 145px;
     font-weight: bolder;
     font-size: 25px;
   }
   #subscribe-content{
     position: relative;
     top: 45px;
     left: 145px;
     font-weight: bold;
     line-height: 10px;
   }
   #link{
     position: relative;
     left: 100px;
   }
   #link-header{
     position: relative;
     top: 20px;
     left: 180px;
     font-weight:bolder;
     font-size: 25px;
   }
   #link-content{
     position: relative;
     top: 34px;
     left: 180px;
   }
   #link-content a{
     text-decoration: none;
   }
   /*bottom image*/
   #bottom-image{
     position: relative;
     bottom: 0px;
   }


   a:focus{
     outline-color:#544444; 
   }