Template:TU-Delft css

From 2012.igem.org

(Difference between revisions)
 
(82 intermediate revisions not shown)
Line 99: Line 99:
<style type="text/css">
<style type="text/css">
-
#menu-igem {
 
-
width:100%;
 
-
height:40px;
 
-
margin:auto;
 
-
background-color:black;
 
-
}
 
-
#menu, #menu ul {
+
* {
-
list-style:none;
+
  font-family:Century gothic;
-
padding:0;
+
  margin-left:800px;  
-
margin:0;
+
  margin-right:800px;
-
}
+
 
-
#menu li {
+
   
-
float:left;
+
-
position:relative;
+
-
line-height:3.5em;
+
-
width:10em;
+
-
}
+
-
#menu li ul {
+
-
position:absolute;
+
-
margin-top:-1em;
+
-
margin-left:.5em; /* for IE */
+
-
display:none;
+
-
}
+
-
#menu ul li ul {
+
-
margin-top:-3em;
+
-
margin-left:7em;
+
-
}
+
-
/* ******************************************************************* */
+
-
/* SHOW SUBMENU 1 */
+
-
#menu li:hover ul, #menu li.over ul {
+
-
display:block;
+
-
}
+
-
#menu li:hover ul ul, #menu li.over ul ul {
+
-
display:none;
+
-
}
+
-
/* SHOW SUBMENU  2 */
+
-
#menu ul li:hover ul, #menu ul li.over ul {
+
-
display:block;
+
-
}
+
-
/* ******************************************************************* */
+
-
/* STYLING UP THE LINKS */
+
-
#menu a {
+
-
display:block;
+
-
border-right:1px solid #fff;
+
-
background:#AEC245;
+
-
color:#3B3B3B;
+
-
text-decoration:none;
+
-
padding:0 10px;
+
-
}
+
-
#menu a:hover {
+
-
background-color:#5798B4;
+
-
color:#fff;
+
-
}
+
-
#menu ul {
+
-
border-top:1px solid #fff;
+
-
}
+
-
#menu ul a {
+
-
border-right:none;
+
-
border-right:1px solid #fff;
+
-
border-bottom:1px solid #fff;
+
-
border-left:1px solid #fff;
+
-
background:#AEC245;
+
-
}
+
-
/* ******************************************************************* */
 
-
 
-
#menu {
 
-
z-index:1;
 
-
}
 
-
#menu ul {
 
-
z-index:2;
 
-
}
 
-
#menu ul ul {
 
-
z-index:3;
 
}
}
-
/* ******************************************************************* */
+
* { margin: 0px; padding: 0px; }
 +
-
/* Fix IE. Hide from IE Mac \*/
 
-
* html ul li { float: left; height: 1%; }
 
-
* html ul li a { height: 1%; }
 
-
/* End */
 
-
 
+
/* OVERRIDING */
-
 
+
body {
-
.boxWrap
+
-
{
+
-
  border: 1px solid #CCCCCC;
+
-
  background-color: #F5F5F5;
+
-
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
+
-
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* Safari/Chrome */
+
-
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);    /* Old Mozilla Versions */
+
-
  border-radius: 15px;
+
-
  -moz-border-radius: 15px;
+
-
  padding: 15px;
+
-
  text-align:justify;
+
-
}
+
-
 
+
-
.boxWrap
+
-
{
+
-
  max-width: 1000px;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
/*
+
-
 
+
-
 
+
-
 
+
-
Start Format iGEM base
+
-
*/
+
-
body {
+
/* format main-background C0C5CA*/
/* format main-background C0C5CA*/
background-color: #7297BA;
background-color: #7297BA;
Line 231: Line 127:
background-color: #E0F574;
background-color: #E0F574;
}
}
 +
        #contentSub, #catlinks {
 +
                display:none;
 +
                }
.firstHeading {
.firstHeading {
Line 237: Line 136:
}
}
#top-section {
#top-section {
-
/* formats iGEM header div */
+
    background-color: black;
-
border: 0px;
+
    height: 0;
-
height: 0px;
+
    border: none;}
-
}
+
 
#p-logo {
#p-logo {
/* removes iGEM logo */
/* removes iGEM logo */
Line 253: Line 152:
font-family:"Trebuchet MS","Verdana",Arial,sans-serif;
font-family:"Trebuchet MS","Verdana",Arial,sans-serif;
font-size:85%;
font-size:85%;
-
height: 22px;
+
height: 24px;
}
}
#menubar li a {
#menubar li a {
Line 275: Line 174:
z-index: 8;
z-index: 8;
}
}
 +
        #menubar.left-menu:hover {
 +
                background-color: transparent;}
#search-controls {
#search-controls {
Line 319: Line 220:
text-decoration: underline;
text-decoration: underline;
}
}
 +
        .right-menu li a {
 +
                background-color: transparent;
 +
                }
#footer-box {
#footer-box {
Line 339: Line 243:
End Format iGEM base
End Format iGEM base
*/
*/
 +
/* --- OVERRIDING, RÖR INTE ÖVER --- */
-
/*
+
body {font-family: "Verdana", arial, sans-serif; font-size: 12px;}
-
Start Format ETHZ_Basel
+
-
*/
+
-
#header{
+
#wrapper { width: 960px; margin: 10px auto; padding: 6px; }
 +
#header{
/* position logo */
/* position logo */
width: 975px;
width: 975px;
Line 352: Line 256:
}
}
-
#navigation{
+
#header h1 { line-height: 120px; color: #fff; font-family : "Georgia", sans-serif; margin: 0 10px; }
-
/* main div for navigation */
+
 
-
width: 945px;
+
#nav {
-
position: relative;
+
    margin: 0;
-
left: -5px;
+
    background:#AEC245;
-
padding: 5px 15px 0 15px;
+
    line-height: 35px;
-
background:#336699;
+
    border-bottom: 0px solid #6699cc;
-
border-bottom: #000000 1px solid;
+
    color: #3b3b3b;
-
}
+
}
-
ul#simple-menu{
+
 
-
list-style-type:none;
+
#nav li {
-
width:100%;
+
    float: left;
-
position:relative;
+
    position: relative;
-
height:28px;
+
    list-style: none;
-
font-family:"Trebuchet MS",Arial,sans-serif;
+
}
-
font-size:13px;
+
 
-
font-weight:bold;
+
 
-
margin:0;
+
/* main level link */
-
padding:11px 0 0 0;
+
#nav li a {
-
}
+
    color: #fff;
-
ul#simple-menu li{
+
    text-decoration: none;
-
display:block;
+
    display: block;
-
float:left;
+
    margin: 0 20px; /* ändra avstånd mellan meny alternativ. */
-
margin:0 0 0 4px;
+
    padding: 0px 28px; /* ändra höjd på meny alternativ. */ /* 22px utan stylesheet */
-
height:27px;
+
    margin: 0;
-
}
+
    border-right: 1px solid #2d2d2d; /* Avskiljare i länkarna. */
-
ul#simple-menu li.left{
+
    font-variant: small-caps; /* Ta bort hela för "vanliga" bokstäver. */
-
margin:0;
+
}
-
}
+
 
-
ul#simple-menu li a{
+
#nav li a:hover {
-
display:block;
+
    background: #336699;  
-
float:left;
+
    color: #fff;
-
color:#fff;
+
  font-size:20px;
-
background:#073515;
+
}
-
line-height:27px;
+
 
-
text-decoration:none;
+
 
-
padding:0 17px 0 18px;
+
/* sub levels link hover */
-
height:27px;
+
#nav ul li:hover a, #nav li:hover li a {
-
border: #000000 1px solid;
+
    background: #AEC245; /* Huvudbakgrund för dropdown. */
-
border-bottom: #000000 1px solid;
+
    border: none;
-
}
+
    color: #fff;
-
ul#simple-menu li a.current, ul#simple-menu li a.current:hover{
+
}
-
color: #FFFFFF;
+
#nav ul a:hover {
-
background:#073515;
+
    background: #336699!important; /* <- musöver på dorpdown. TA INTE BORT !IMPORTANT*/
-
border-bottom: #073515 1px solid;
+
    color: #fff !important;
-
}
+
}
-
ul#simple-menu li a.introduction{
+
 
-
background:#6BD37A;
+
/* dropdown */
-
}
+
#nav li:hover > ul {
-
ul#simple-menu li a.introduction_current, ul#simple-menu li a.introduction_current:hover{
+
    display: block;
-
color: #FFFFFF;
+
}
-
background:#6BD37A;
+
 
-
border-bottom: #6BD37A 1px solid;
+
/* level 2 list */
-
}
+
#nav ul {
-
ul#simple-menu li a.biology{
+
    display: none;
-
background:#41BD54;
+
 
-
}
+
    margin: 0;
-
ul#simple-menu li a.biology_current, ul#simple-menu li a.biology_current:hover{
+
    padding: 0;
-
color: #FFFFFF;
+
    width: 215px; /* ändra bredd på dropdown */
-
background:#41BD54;
+
    position: absolute;
-
border-bottom: #41BD54 1px solid;
+
    z-index:1;
-
}
+
    top: 35px;
-
ul#simple-menu li a.modeling{
+
    left: 0;
-
background:#26913B;
+
    border-bottom: 0px solid #6699cc; /*#4ba6d5;  blåa längst ner på dropdown. */
-
}
+
}
-
ul#simple-menu li a.modeling_current, ul#simple-menu li a.modeling_current:hover{
+
#nav ul li {
-
color: #FFFFFF;
+
    float: none;
-
background:#26913B;
+
    margin: 0;
-
border-bottom: #26913B 1px solid;
+
    padding: 0;
-
}
+
    border-bottom: 1px solid #2d2d2d; /* Avskiljare i dropdown. */
-
ul#simple-menu li a.information{
+
    line-height: 35px;
-
background:#306B3C;
+
}
-
}
+
 
-
ul#simple-menu li a.information_current, ul#simple-menu li a.information_current:hover{
+
 
-
color: #FFFFFF;
+
/* rounded corners of first and last link */
-
background:#306B3C;
+
#nav ul li:first-child > a {
-
border-bottom: #306B3C 1px solid;
+
}
-
}
+
#nav ul li:last-child > a {
-
ul#simple-menu li a.achievements{
+
}
-
background:#0E491F;
+
 
-
}
+
#nav social {
-
ul#simple-menu li a.achievements_current, ul#simple-menu li a.achievements_current:hover{
+
background: none;
-
color: #FFFFFF;
+
margin: 0 1px;
-
background:#0E491F;
+
/*padding: 0 10px;*/
-
border-bottom: #0E491F 1px solid;
+
position: relative;
-
}
+
right: -10px;
-
ul#simple-menu li a.team{
+
font-size: 8px;
-
background:#073515;
+
alt="Join iGEM Chalmers on Facebook!"
-
}
+
title="Join iGEM Chalmers on Facebook!"
-
ul#simple-menu li a.team_current, ul#simple-menu li a.team_current:hover{
+
}
-
color: #FFFFFF;
+
 
-
background:#073515;
+
#nav social2 {
-
border-bottom: #073515 1px solid;
+
background: none;
-
}
+
margin: 0 1px;
-
ul#simple-menu li a.right{
+
/*padding: 0 10px;*/
-
padding-right:19px;
+
position: relative;
-
}
+
right: -10px;
-
ul#simple-menu li a:hover{
+
font-size: 8px;
-
color: #000000;
+
alt="Follow iGEM Chalmers on Twitter!"
-
text-decoration: underline;
+
title="Follow iGEM Chalmers on Twitter!"
-
background:#B6F3BF;
+
}
-
}
+
 
-
+
#nav social3 {
-
#subnavigation{
+
background: none;
-
/* main div for subnavigation */
+
margin: 0 1px;
-
width: 945px;
+
/*padding: 0 10px;*/
-
position: relative;
+
position: relative;
-
left: -5px;
+
right: -10px;
-
padding: 0px 15px 0 15px;
+
font-size: 8px;
-
background:#073515;
+
alt="Look up the iGEM competition!"
-
border-bottom: #000000 1px solid;
+
title="Look up the iGEM competition!"
-
}
+
}
-
#subnavigation.introduction{
+
 
-
background:#6BD37A;
+
#nav:after {
-
}
+
    content: ".";
-
#subnavigation.biology{
+
    display: block;
-
background:#41BD54;
+
    clear: both;
-
}
+
    visibility: hidden;
-
#subnavigation.modeling{
+
    line-height: 0;
-
background:#26913B;
+
    height: 0;
-
}
+
}
-
#subnavigation.information{
+
 
-
background:#306B3C;
+
.boxWrap
-
}
+
{
-
#subnavigation.achievements{
+
  border: 1px solid #CCCCCC;
-
background:#0E491F;
+
  background-color: #F5F5F5;
-
}
+
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
-
#subnavigation.team{
+
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* Safari/Chrome */
-
background:#073515;
+
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);   /* Old Mozilla Versions */
-
}
+
  border-radius: 15px;
-
ul#sub-menu{
+
  -moz-border-radius: 15px;
-
list-style-type:none;
+
  padding: 15px;
-
width:100%;
+
  text-align:justify;
-
position:relative;
+
  max-width: 1000px;
-
height:28px;
+
}
-
font-family:"Trebuchet MS",Arial,sans-serif;
+
 
-
font-size:13px;
+
 
-
font-weight:bold;
+
/* CSS Document */
-
margin:0;
+
#menu, #menu ul {
-
padding:11px 0 0 0;
+
list-style:none;
-
}
+
padding:0;
-
ul#sub-menu li{
+
margin:0;
-
display:block;
+
}
-
float:left;
+
#menu li {
-
margin:0 0 0 4px;
+
float:left;
-
height:27px;
+
position:relative;
-
}
+
line-height:3.5em;
-
ul#sub-menu li.left{
+
width:15em;
-
margin:0;
+
}
-
}
+
#menu li ul {
-
ul#sub-menu li a{
+
position:absolute;
-
display:block;
+
margin-top:-1em;
-
float:left;
+
margin-left:.5em; /* for IE */
-
color:#fff;
+
display:none;
-
line-height:27px;
+
}
-
text-decoration:none;
+
#menu ul li ul {
-
padding:0 17px 0 18px;
+
margin-top:-3em;
-
height:27px;
+
margin-left:7em;
-
border: #fff 1px solid;
+
}
-
border-bottom: none;
+
/* ******************************************************************* */
-
}
+
/* SHOW SUBMENU  1 */
-
ul#sub-menu li a.right{
+
#menu li:hover ul, #menu li.over ul {
-
padding-right:19px;
+
display:block;
-
}
+
}
-
ul#sub-menu li a:hover{
+
#menu li:hover ul ul, #menu li.over ul ul {
-
color:#000000;
+
display:none;
-
text-decoration: underline;
+
}
-
background:#FFFFFF;
+
/* SHOW SUBMENU  2 */
-
border: #000000 1px solid;
+
#menu ul li:hover ul, #menu ul li.over ul {
-
border-bottom: none;
+
display:block;
-
}
+
}
-
ul#sub-menu li a.current{
+
/* ******************************************************************* */
-
color:#000000;
+
/* STYLING UP THE LINKS */
-
background:#FFFFFF;
+
#menu a {
-
border: #000000 1px solid;
+
display:block;
-
border-bottom: #FFFFFF 1px solid;
+
border-right:1px solid #fff;
-
}
+
background:#E0F574;
-
/*
+
color:#3B3B3B;
-
End Format ETHZ_Basel
+
text-decoration:none;
-
*/
+
padding:0 10px;
 +
}
 +
#menu a:hover {
 +
background-color:#5798B4;
 +
color:#fff;
 +
}
 +
#menu ul {
 +
border-top:1px solid #fff;
 +
}
 +
#menu ul a {
 +
border-right:none;
 +
border-right:1px solid #fff;
 +
border-bottom:1px solid #fff;
 +
border-left:1px solid #fff;
 +
background:#AEC245;
 +
}
 +
 
 +
/* ******************************************************************* */
 +
 
 +
#menu {
 +
z-index:1;
 +
}
 +
#menu ul {
 +
z-index:2;
 +
}
 +
#menu ul ul {
 +
z-index:3;
 +
}
 +
 
 +
/* ******************************************************************* */
 +
 
 +
/* Fix IE. Hide from IE Mac \*/
 +
* html ul li { float: left; height: 1%; }
 +
* html ul li a { height: 1%; }
 +
/* End */
 +
 
</style>
</style>
</head>
</head>
</html>
</html>

Latest revision as of 22:42, 4 September 2012

Retrieved from "http://2012.igem.org/Template:TU-Delft_css"