Difference between revisions of "Template:Washington"

Line 28: Line 28:
 
/* Creates the container for the menu */
 
/* Creates the container for the menu */
 
#menuContainer  {  
 
#menuContainer  {  
float:right;
+
float: left;
width: 150px;
+
width: 980px;
background-color: #4B2E83;
+
background-color: #e8e3d3;
height: 100%;
+
height: 60px;
border-top: 6px solid #b48a27;
+
border-bottom: 6px solid #b48a27;
font-family: "Arial", Helvetica, sans-serif;
+
font-family: "Open Sans", Helvetica, sans-serif;
 
}
 
}
  
Line 39: Line 39:
 
#contentContainer {
 
#contentContainer {
 
background-color: #EEEDEA;  
 
background-color: #EEEDEA;  
width: 810px;
+
width: 980px;
 
float: left;
 
float: left;
 
padding: 10px;
 
padding: 10px;
border-top: 6px solid #B48A27;
 
 
}
 
}
  
Line 75: Line 74:
 
/*Style of the links - links are different inside the menu */
 
/*Style of the links - links are different inside the menu */
 
#contentContainer a {  
 
#contentContainer a {  
 +
                font-family: "Open Sans", sans-serif;
 
font-weight: bold;
 
font-weight: bold;
 
color: #85754d;
 
color: #85754d;
Line 113: Line 113:
 
     background-color: #e8d5b7;
 
     background-color: #e8d5b7;
 
     }
 
     }
 +
           
 +
                #contentContainer div {
 +
                    display: inline-block;
 +
                    position: relative;
 +
                    width: 450px;
 +
                    height: 450px;
 +
                    float: inherit;
 +
                }
 +
           
 +
                #contentContainer div p {
 +
                    text-align: right;
 +
                    padding-top: 10px;
 +
                    padding-bottom: 10px;
 +
                }
 +
           
 +
                #contentContainer div a {
 +
                    font-size: 24px;
 +
                    font-weight: bold;
 +
                    font-family: "Encode Sans Normal";
 +
                    color: #4b2e83;
 +
                    text-decoration: none;
 +
                }
 +
           
 +
                #contentContainer div a:hover {
 +
                    font-size: 36px;
 +
                }
  
  
Line 118: Line 144:
  
 
/*Styling for the links in the menu */
 
/*Styling for the links in the menu */
#menuContainer a {
+
#menuContainer ul a {
color: #EEEDEA;
+
color: #4b2e83;
 
text-decoration:none;
 
text-decoration:none;
font-weight: bold;
+
                font-weight: bold;
 +
                font-size: 12px;
 
}
 
}
  
 
/* Sets the style for lists inside menuContainer  */
 
/* Sets the style for lists inside menuContainer  */
#menuContainer ul {  
+
#menuContainer > ul {  
width:100%;
+
 
list-style: none;
 
list-style: none;
margin: auto;
+
margin-left: auto;
padding-top: 10px;
+
                margin-right: auto;
padding-bottom: 10px;
+
                margin-bottom: 0px;
 +
                margin-top: 0px;
 +
                padding-left: 0px;
 +
                padding-right: 0px;
 +
                text-align: center;
 +
                z-index: 1;
 +
                width: 600px;
 +
                background: #ffffff;
 +
                font-style: italic;
  
 
}
 
}
Line 136: Line 170:
 
/*Styles the list items to become menu buttons */
 
/*Styles the list items to become menu buttons */
 
#menuContainer ul li {
 
#menuContainer ul li {
display: block;
+
display: inline-block;
position: relative;
+
                width: 100px;
padding: 10px;
+
padding: 21px 5px 19px 5px;  
margin-bottom:5px;
+
                position: relative;
padding-left: -20px;
+
 
 
}
 
}
  
 
#menuContainer ul li:hover {
 
#menuContainer ul li:hover {
background: #85754d;
+
background: #d9d9d9;
color: #0e232f;
+
 
}
 
}
  
  
 
/*HIde the submenus and removes the padding */
 
/*HIde the submenus and removes the padding */
#menuContainer li ul {
+
#menuContainer ul li ul {
 
display: none;
 
display: none;
padding-top:15px;
+
                margin-top: 20px;
margin-left: -9px;
+
                position: absolute;
 +
                margin-left: -5px;
 +
                z-index: 1;
 +
                font-style: normal;
 
}
 
}
  
 
/*Shows the submenus once you hover*/
 
/*Shows the submenus once you hover*/
#menuContainer li:hover ul {
+
#menuContainer ul li:hover ul {
display: block;  
+
display: block;
 
}
 
}
  
 
/*style the submenu buttons*/
 
/*style the submenu buttons*/
#menuContainer li ul li {
+
#menuContainer ul li ul li {
 +
                display: block;
 
background: #0E232F;
 
background: #0E232F;
width: 100%;
+
                padding: 10px 5px 10px 5px;
 
}
 
}
  
 
#menuContainer li ul li:hover {
 
#menuContainer li ul li:hover {
background: #e8e3d3;  
+
background: #444444;  
 
color: #fff;
 
color: #fff;
 +
}
 +
           
 +
            #menuContainer li ul a {
 +
color: #ffffff;
 +
text-decoration:none;
 +
                font-weight: bold;
 +
                font-size: 12px;
 
}
 
}
  
Line 211: Line 255:
 
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
 
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
 
<ul>
 
<ul>
<a href="https://2015.igem.org/Team:Example2"><li>HOME</li></a>
+
<a href="https://2015.igem.org/Team:Example2"><li>Home</li></a>
 
+
                    <hr style="display: inline">
<a href="https://2015.igem.org/Team:Example2/Team"><li>TEAM</li></a>
+
                    <a href="#"><li>Team
 
+
                        <ul>
 
+
                            <a href="https://2015.igem.org/Team:Example2/Team"><li>Members</li></a>
<a href="#"><li>PROJECT
+
                            <a href="https://2015.igem.org/Team:Example2/Attributions"><li>Attributions</li></a>
            <ul>
+
                            <a href="https://2015.igem.org/Team:Example2/Collaborations"><li>Collaborations</li></a>
 +
                        </ul>
 +
                    </li></a>
 +
                    <hr style="display: inline">
 +
<a href="#"><li>Project
 +
                        <ul>
 
<a href="https://2015.igem.org/Team:Example2/Description"><li>Description</li></a>
 
<a href="https://2015.igem.org/Team:Example2/Description"><li>Description</li></a>
 
<a href="https://2015.igem.org/Team:Example2/Experiments"><li>Experiments & Protocols</li></a>   
 
<a href="https://2015.igem.org/Team:Example2/Experiments"><li>Experiments & Protocols</li></a>   
Line 223: Line 272:
 
</ul>
 
</ul>
 
</li></a>
 
</li></a>
 
+
                    <hr style="display: inline">
<a href="#"><li>PARTS
+
<a href="#"><li>Parts
            <ul>
+
                        <ul>
 
<a href="https://2015.igem.org/Team:Example2/Parts"><li>Team Parts</li></a>
 
<a href="https://2015.igem.org/Team:Example2/Parts"><li>Team Parts</li></a>
 
<a href="https://2015.igem.org/Team:Example2/Basic_Part"><li>Basic Parts</li></a>   
 
<a href="https://2015.igem.org/Team:Example2/Basic_Part"><li>Basic Parts</li></a>   
Line 232: Line 281:
 
</ul>
 
</ul>
 
</li></a>
 
</li></a>
 
+
                    <hr style="display: inline">  
<a href="https://2015.igem.org/Team:Example2/Notebook"><li>NOTEBOOK</li></a>
+
<a href="https://2015.igem.org/Team:Example2/Notebook"><li>Notebook</li></a>
     
+
<a href="https://2015.igem.org/Team:Example2/Attributions"><li>ATTRIBUTIONS</li></a>
+
 
+
<a href="https://2015.igem.org/Team:Example2/Collaborations"><li>COLLABORATIONS</li></a>
+
 
+
<a href="https://2015.igem.org/Team:Example2/Practices"><li>HUMAN PRACTICES</li></a>
+
 
+
<a href="https://2015.igem.org/Team:Example2/Safety"><li>SAFETY</li></a>
+
 
+
<a href="https://2015.igem.org/Team:Example2/Modeling"><li>MODELING</li></a>
+
 
+
<a href="https://2015.igem.org/Team:Example2/Measurement"><li>MEASUREMENT</li></a>
+
 
+
<a href="https://2015.igem.org/Team:Example2/Software"><li>SOFTWARE</li></a>
+
 
+
<a href="https://2015.igem.org/Team:Example2/Entrepreneurship"><li>ENTREPRENEURSHIP</li></a>
+
  
 
</ul>
 
</ul>
Line 257: Line 290:
 
<!-- Start of content -->
 
<!-- Start of content -->
 
<div id="contentContainer"><!--This div will close on the page.-->
 
<div id="contentContainer"><!--This div will close on the page.-->
 +
 +
                         
 
</html>
 
</html>

Revision as of 06:01, 3 September 2015



Add a banner to your wiki!

You can make the image 980px by 200px

Remember to call the file: "Team_Example_banner.jpg"