Template:Nevada Header CSS

From 2011.igem.org

(Difference between revisions)
m
m
 
(37 intermediate revisions not shown)
Line 6: Line 6:
body {
body {
background-image: url(https://static.igem.org/mediawiki/2011/1/12/UNR_Background1.JPG);
background-image: url(https://static.igem.org/mediawiki/2011/1/12/UNR_Background1.JPG);
-
background-repeat: no-repeat;
+
background-repeat: repeat;
-
background-position: 100% 85%;
+
background-position: 90% 75%;
}
}
Line 14: Line 14:
   top: 0px;
   top: 0px;
   left: 0px;
   left: 0px;
-
   height: 200px;
+
   height: 210px;
   width: 955px;
   width: 955px;
   display: block;
   display: block;
Line 34: Line 34:
   top: 0px;
   top: 0px;
   left: -2px;
   left: -2px;
-
   height: 200px;
+
   height: 210px;
   width: 957px;
   width: 957px;
   display: block;
   display: block;
Line 116: Line 116:
   top: 20px;
   top: 20px;
   left: 25px;
   left: 25px;
-
   height: 25px;
+
   height: 35px;
   width: 900px;
   width: 900px;
 +
  cursor: pointer;
   text-align: center;
   text-align: center;
   background-color: rgba(0,51,0,0.8);
   background-color: rgba(0,51,0,0.8);
Line 141: Line 142:
     color: #C20074;
     color: #C20074;
     font-family: "Times New Roman";
     font-family: "Times New Roman";
-
     font-size: 16px;
+
     font-size: 22px;
     font-weight: bold;
     font-weight: bold;
-
     line-height: 25px;
+
     line-height: 35px;
     text-align: center;
     text-align: center;
}
}
Line 149: Line 150:
#banner-buttons a{
#banner-buttons a{
   color: #C20074;
   color: #C20074;
 +
  //color: #FF3DB1;
}
}
-
#Nevada-MainContent{
+
/* Navigation */
-
  position: relative;
+
ul {
-
  float: left;
+
  list-style: none;
-
   top: 159px;
+
  padding-top: -1px;
-
   left: -5px;
+
  margin-top: -1px;
-
   height: 100%;
+
}
-
   width: 943px;
+
ul.top-level li{
-
   display: block;
+
    float: left;
-
   border-left: rgba(0,0,0,1) groove 4px;
+
    text-decoration: none;
-
   border-right: rgba(0,0,0,1) ridge 4px;
+
}
-
  /*background-color: rgba(100,100,100,1);*/
+
 
-
   /* Color Background */
+
ul.sub-level {
-
   background-color: transparent !important;
+
    display: none;
-
   /*background: -moz-linear-gradient(bottom, #858585 97%, rgba(0,0,26,1), #25324e); */
+
}
-
   padding: 10px;
+
li:hover{
-
   padding-right: 2px !important;
+
    position: relative;
 +
}
 +
 
 +
li:hover .sub-level {
 +
    //background: #C20074;
 +
    background: #FF3DB1;
 +
    border: #000 solid;
 +
    border-width: 3px;
 +
    display: block;
 +
    position: absolute;
 +
    left: -20px;
 +
    top: 33px;
 +
    padding-left: 5px;
 +
    text-align: left;
 +
   /* Border Styling */
 +
  -moz-border-radius-topright: 15px;
 +
  -moz-border-radius-topleft: 0px;
 +
  -webkit-border-top-right-radius: 15px;
 +
   -webkit-border-top-left-radius: 0px;
 +
  border-top-right-radius: 15px;
 +
   border-top-left-radius: 0px;
 +
   -moz-border-radius-bottomright: 15px;
 +
   -moz-border-radius-bottomleft: 0px;
 +
   -webkit-border-bottom-right-radius: 15px;
 +
  -webkit-border-bottom-left-radius: 0px;
 +
   border-bottom-right-radius: 15px;
 +
  border-bottom-left-radius: 0px;
 +
}
 +
ul.sub-level li {
 +
    border: none;
 +
    float: left;
 +
    width: 175px;
 +
    cursor: pointer;
 +
}
 +
 
 +
 
 +
ul.sub-level a{
 +
    color: rgba(0,51,0,1) !important;
 +
}
 +
 
 +
ul.sub-level a:hover, ul.sub-level li:hover{
 +
    background: rgba(0,51,0,1) !important;
 +
    color: #C20074 !important;
 +
   /* Border Styling */
 +
   -moz-border-radius-topright: 15px;
 +
   -moz-border-radius-topleft: 0px;
 +
  -webkit-border-top-right-radius: 15px;
 +
  -webkit-border-top-left-radius: 0px;
 +
  border-top-right-radius: 15px;
 +
  border-top-left-radius: 0px;
 +
  -moz-border-radius-bottomright: 15px;
 +
  -moz-border-radius-bottomleft: 0px;
 +
  -webkit-border-bottom-right-radius: 15px;
 +
   -webkit-border-bottom-left-radius: 0px;
 +
   border-bottom-right-radius: 15px;
 +
  border-bottom-left-radius: 0px;
}
}
/* Navigation */
/* Navigation */
-
ul#nav{
+
 
-
  position: relative;
+
ul.sub-level2 {
-
  top: -5px;
+
    display: none;
-
  list-style: none;
+
-
  background: transparent; 
+
}
}
-
a, a:link, a:visited{
+
li:hover .sub-level2 {
-
  text-decoration: none;
+
    //background: #C20074;
 +
    background: #FF3DB1;
 +
    border: #000 solid;
 +
    border-width: 3px;
 +
    display: block;
 +
    position: absolute;
 +
    left: -20px;
 +
    top: 33px;
 +
    padding-left: 5px;
 +
    text-align: left;
 +
  /* Border Styling */
 +
  -moz-border-radius-topright: 15px;
 +
  -moz-border-radius-topleft: 0px;
 +
  -webkit-border-top-right-radius: 15px;
 +
  -webkit-border-top-left-radius: 0px;
 +
  border-top-right-radius: 15px;
 +
  border-top-left-radius: 0px;
 +
  -moz-border-radius-bottomright: 15px;
 +
  -moz-border-radius-bottomleft: 0px;
 +
  -webkit-border-bottom-right-radius: 15px;
 +
  -webkit-border-bottom-left-radius: 0px;
 +
  border-bottom-right-radius: 15px;
 +
  border-bottom-left-radius: 0px;
 +
}
 +
ul.sub-level2 li {
 +
    border: none;
 +
    float: left;
 +
    width: 225px;
 +
    cursor: pointer;
}
}
-
ul#nav li{
+
 
-
  display: block;
+
ul.sub-level2 a{
-
  float: left;
+
    color: rgba(0,51,0,1) !important;
}
}
-
#nav li ul{
+
ul.sub-level2 a:hover, ul.sub-level2 li:hover{
-
   display: block;
+
    background: rgba(0,51,0,1) !important;
-
   visibility: hidden;
+
    color: #C20074 !important;
-
   position: relative;
+
   /* Border Styling */
-
   top: 0px;
+
  -moz-border-radius-topright: 15px;
-
   left: 0px;
+
   -moz-border-radius-topleft: 0px;
-
   width: 50px;
+
   -webkit-border-top-right-radius: 15px;
-
   margin: 0px;
+
   -webkit-border-top-left-radius: 0px;
-
   padding: 0px;
+
   border-top-right-radius: 15px;
-
   background: #C20074;
+
  border-top-left-radius: 0px;
 +
   -moz-border-radius-bottomright: 15px;
 +
   -moz-border-radius-bottomleft: 0px;
 +
   -webkit-border-bottom-right-radius: 15px;
 +
  -webkit-border-bottom-left-radius: 0px;
 +
   border-bottom-right-radius: 15px;
 +
  border-bottom-left-radius: 0px;
}
}
-
#nav li ul a, #nav li ul a:link{
+
/* Links for Notebook */
-
  color: rgba(0,51,0,1);
+
ul.sub-level3 {
 +
    display: none;
}
}
-
#nav li:hover ul{
+
li:hover .sub-level3 {
-
  visibility: visible;
+
    //background: #C20074;
-
  background: #C20074;
+
    background: #FF3DB1;
-
  width: 100%
+
    border: #000 solid;
-
   color: rgba(0,51,0,1);
+
    border-width: 3px;
-
   z-index: 101;
+
    display: block;
 +
    position: absolute;
 +
    left: -20px;
 +
    top: 33px;
 +
    padding-left: 5px;
 +
    text-align: left;
 +
   /* Border Styling */
 +
  -moz-border-radius-topright: 15px;
 +
   -moz-border-radius-topleft: 0px;
 +
  -webkit-border-top-right-radius: 15px;
 +
  -webkit-border-top-left-radius: 0px;
 +
  border-top-right-radius: 15px;
 +
  border-top-left-radius: 0px;
 +
  -moz-border-radius-bottomright: 15px;
 +
  -moz-border-radius-bottomleft: 0px;
 +
  -webkit-border-bottom-right-radius: 15px;
 +
  -webkit-border-bottom-left-radius: 0px;
 +
  border-bottom-right-radius: 15px;
 +
  border-bottom-left-radius: 0px;
}
}
 +
ul.sub-level3 li {
 +
    border: none;
 +
    float: left;
 +
    width: 125px;
 +
    cursor: pointer;
 +
}
 +
 +
 +
ul.sub-level3 a{
 +
    color: rgba(0,51,0,1) !important;
 +
}
 +
 +
ul.sub-level3 a:hover, ul.sub-level3 li:hover{
 +
    background: rgba(0,51,0,1) !important;
 +
    color: #C20074 !important;
 +
  /* Border Styling */
 +
  -moz-border-radius-topright: 15px;
 +
  -moz-border-radius-topleft: 0px;
 +
  -webkit-border-top-right-radius: 15px;
 +
  -webkit-border-top-left-radius: 0px;
 +
  border-top-right-radius: 15px;
 +
  border-top-left-radius: 0px;
 +
  -moz-border-radius-bottomright: 15px;
 +
  -moz-border-radius-bottomleft: 0px;
 +
  -webkit-border-bottom-right-radius: 15px;
 +
  -webkit-border-bottom-left-radius: 0px;
 +
  border-bottom-right-radius: 15px;
 +
  border-bottom-left-radius: 0px;
 +
}
 +
</style>
</style>
Line 230: Line 368:
</div>
</div>
<div id="banner-buttons" class="buttons-text">
<div id="banner-buttons" class="buttons-text">
-
<ul id="nav">
+
<ul class="top-level">
<li>
<li>
&nbsp;&nbsp;<a href="/Team:Nevada">Home</a>&nbsp;&nbsp;
&nbsp;&nbsp;<a href="/Team:Nevada">Home</a>&nbsp;&nbsp;
Line 236: Line 374:
<li>
<li>
|&nbsp;&nbsp;<a href="/Team:Nevada/Team">Team</a>&nbsp;&nbsp;
|&nbsp;&nbsp;<a href="/Team:Nevada/Team">Team</a>&nbsp;&nbsp;
-
<ul>
+
    <ul class="sub-level">
-
<li><a href="/Team:Nevada/Team">Gallery</a></li>
+
        <li><a href="/Team:Nevada/Team">Nevada's Team</a></li><br>
-
<li><a href="/Team:Nevada/Team">Biographies</a></li>
+
        <li><a href="/Team:Nevada/gallery">Gallery</a></li>
-
</ul></li>
+
  </ul>
 +
</li>
<li>
<li>
|&nbsp;&nbsp;<a href="/Team:Nevada/Project">Project</a>&nbsp;&nbsp;
|&nbsp;&nbsp;<a href="/Team:Nevada/Project">Project</a>&nbsp;&nbsp;
 +
    <ul class="sub-level2">
 +
        <li><a href="/Team:Nevada/Project/Background">Introduction</a></li><br>
 +
        <li><a href="/Team:Nevada/Project/Ecoli">E. coli Project</a></li><br>
 +
        <li><a href="/Team:Nevada/Project/Cyano">Cyanobacteria Project</a></li><br>
 +
        <li><a href="/Team:Nevada/Project/Assay">Assay Development</a></li><br>
 +
        <li><a href="/Team:Nevada/Project/Co-Cult">Co-Cultivation</a></li><br>
 +
        <li><a href="/Team:Nevada/Project/Results">Results Summary</a></li><br>
 +
        <li><a href="/Team:Nevada/Reference">References</a></li><br>
 +
  </ul>
</li>
</li>
<li>
<li>
Line 248: Line 396:
<li>
<li>
|&nbsp;&nbsp;<a href="/Team:Nevada/Notebook/Weeks14">Notebook</a>&nbsp;&nbsp;
|&nbsp;&nbsp;<a href="/Team:Nevada/Notebook/Weeks14">Notebook</a>&nbsp;&nbsp;
 +
    <ul class="sub-level3">
 +
        <li><a href="/Team:Nevada/Notebook/Weeks14">Weeks 1-4</a></li><br>
 +
        <li><a href="/Team:Nevada/Notebook/Weeks58">Weeks 5-8</a></li><br>
 +
        <li><a href="/Team:Nevada/Notebook/Weeks912">Weeks 9-12</a></li><br>
 +
        <li><a href="/Team:Nevada/Notebook/Weeks1316">Weeks 13-16</a></li>
 +
  </ul>
</li>
</li>
<li>
<li>
-
|&nbsp;&nbsp;<a href="/Team:Nevada/gallery">Gallery</a>&nbsp;&nbsp;
+
|&nbsp;&nbsp;<a href="">Human Practices</a>&nbsp;&nbsp;
-
</li>
+
    <ul class="sub-level2">
-
<li>
+
        <li><a href="/Team:Nevada/iGEMcollaborators">iGEM Collaborators</a></li>
-
|&nbsp;&nbsp;<a href="/Team:Nevada/Reference">References</a>&nbsp;&nbsp;
+
        <li><a href="/Team:Nevada/Outreach">Outreach</a></li><br>
 +
        <li><a href="/Team:Nevada/Contributions">Contributions</a></li><br>
 +
        <li><a href="/Team:Nevada/Fundraising">Fundraising</a></li>
 +
  </ul>
</li>
</li>
<li>
<li>
|&nbsp;&nbsp;<a href="/Team:Nevada/Safety">Safety</a>&nbsp;&nbsp;
|&nbsp;&nbsp;<a href="/Team:Nevada/Safety">Safety</a>&nbsp;&nbsp;
-
</li>
 
-
<li>
 
-
|&nbsp;&nbsp;<a href="#">Human Practices</a>&nbsp;&nbsp;
 
-
</li>
 
-
<li>
 
-
|&nbsp;&nbsp;<a href="#">Fundraising</a>&nbsp;&nbsp;
 
</li></ul>
</li></ul>
</div>
</div>
</div>
</div>
</div> <!-- Closing of all content in header -->
</div> <!-- Closing of all content in header -->
-
<div id="Nevada-MainContent">
 
-
<br>
 
</html>
</html>

Latest revision as of 02:27, 29 September 2011


Retrieved from "http://2011.igem.org/Template:Nevada_Header_CSS"