Team:Calgary/static/basicpagedesktop.css
From 2012.igem.org
Line 4: | Line 4: | ||
/***Nav styling***/ | /***Nav styling***/ | ||
- | #nav{ | + | #nav-wrap{ |
+ | height: 0px; | ||
+ | margin-top: -45px; | ||
+ | } | ||
+ | |||
+ | #nav, #nav ul{ | ||
list-style: none; | list-style: none; | ||
- | + | margin: 0; | |
- | + | padding: 0; | |
- | + | width: 965px; | |
- | + | height: 100%; | |
- | + | display: table; | |
+ | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
+ | |||
/*To be moved to JQ block*/ | /*To be moved to JQ block*/ | ||
#menu-icon{ | #menu-icon{ | ||
display: none; | display: none; | ||
} | } | ||
+ | |||
+ | /*menu*/ | ||
#nav li{ | #nav li{ | ||
height: auto; | height: auto; | ||
padding: 0; | padding: 0; | ||
+ | list-style: none; | ||
+ | float: left; | ||
+ | width: auto; | ||
+ | margin: 0; | ||
+ | background: #333333; | ||
+ | position: relative; | ||
} | } | ||
- | + | #nav > li a{ | |
- | #nav li a{ | + | padding: 0 15px; |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | #nav li | + | #nav > li{ |
- | + | background: transparent; | |
- | + | ||
} | } | ||
- | /* | + | |
- | #nav li | + | /*submenu*/ |
+ | #nav li ul { | ||
+ | position: absolute; | ||
+ | width: 200px; | ||
+ | display: none; | ||
+ | } | ||
+ | #nav li:hover ul { | ||
display: block; | display: block; | ||
- | font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif; | + | } |
- | + | /*sub-submenu*/ | |
- | + | #nav li ul ul{ | |
+ | margin-left: 230px; | ||
+ | margin-top: -15px; | ||
+ | } | ||
+ | #nav li:hover ul ul{ | ||
+ | display: none; | ||
+ | } | ||
+ | #nav li:hover ul, #nav li li:hover ul{ | ||
+ | display: block; | ||
+ | } | ||
+ | #nav a{ | ||
+ | display: block; | ||
+ | font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif; | ||
+ | color: white; | ||
+ | } | ||
+ | #nav li a{ | ||
line-height: 1.4em; /*centers the text vertically*/ | line-height: 1.4em; /*centers the text vertically*/ | ||
+ | font-size: 2em; | ||
} | } | ||
- | + | #nav ul li > a{ | |
- | #nav li a | + | width: 200px; |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | #nav li a:hover, #nav li a:hover::after{ | + | /*color change after rollover*/ |
+ | #nav li a:hover, #nav li li a.drop:hover::after{ | ||
display: block; | display: block; | ||
text-decoration: none; | text-decoration: none; | ||
color: #43bbff; | color: #43bbff; | ||
} | } | ||
- | + | #nav li ul li ul{ | |
- | #nav li | + | margin-top: -35px; |
position: absolute; | position: absolute; | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
- | /* | + | /*submenu and sub-submenu*/ |
- | #nav li | + | #nav li ul li ul li a, #nav li ul li a{ |
- | + | font-size: 1.8em; | |
- | + | ||
- | + | ||
} | } | ||
- | + | #nav li li a.drop:after{ | |
- | + | content: '>'; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
padding-left: 20px; | padding-left: 20px; | ||
- | + | color: #BBB; | |
- | + | display: inline; | |
- | + | float: right; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
Line 120: | Line 101: | ||
/***Headerimage***/ | /***Headerimage***/ | ||
#headerimage{ | #headerimage{ | ||
- | width: | + | width: 968px; |
position: relative; | position: relative; | ||
- | left: | + | margin-left: 0px; |
margin-bottom: 10px; | margin-bottom: 10px; | ||
margin-top: -20px; | margin-top: -20px; | ||
Line 145: | Line 126: | ||
width: 260px; | width: 260px; | ||
} | } | ||
- | |||
/***Body styling***/ | /***Body styling***/ |
Revision as of 04:27, 5 September 2012
/*====== Desktop Styling ======*/
/***Nav styling***/
- nav-wrap{
height: 0px; margin-top: -45px; }
- nav, #nav ul{
list-style: none; margin: 0; padding: 0; width: 965px; height: 100%; display: table;
}
/*To be moved to JQ block*/
- menu-icon{
display: none; }
/*menu*/
- nav li{
height: auto; padding: 0; list-style: none; float: left; width: auto; margin: 0; background: #333333; position: relative; } #nav > li a{ padding: 0 15px; } #nav > li{ background: transparent; }
/*submenu*/
- nav li ul {
position: absolute; width: 200px; display: none; } #nav li:hover ul { display: block; } /*sub-submenu*/
- nav li ul ul{
margin-left: 230px; margin-top: -15px; } #nav li:hover ul ul{ display: none; }
- nav li:hover ul, #nav li li:hover ul{
display: block; }
- nav a{
display: block; font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif; color: white; } #nav li a{ line-height: 1.4em; /*centers the text vertically*/ font-size: 2em; } #nav ul li > a{ width: 200px; } /*color change after rollover*/ #nav li a:hover, #nav li li a.drop:hover::after{ display: block; text-decoration: none; color: #43bbff; }
- nav li ul li ul{
margin-top: -35px; position: absolute; } /*submenu and sub-submenu*/ #nav li ul li ul li a, #nav li ul li a{ font-size: 1.8em; }
- nav li li a.drop:after{
content: '>'; padding-left: 20px; color: #BBB; display: inline; float: right; }
/***End nav styling***/
/***Headerimage***/
- headerimage{
width: 968px; position: relative; margin-left: 0px; margin-bottom: 10px; margin-top: -20px; }
- css-full{
display: none; }
- css-mobi{
display: block; top: 0px; }
/***Logo styling***/
- logo{
position: relative; margin-top: -145px; right: 20px; float: right; }
#logo img{ width: 260px; }
/***Body styling***/ h1{ font-size: 2.5em; } h2{ font-size: 1.8em; }
- pagetitle{
border-bottom: 2px solid black; padding-bottom: 10px; }
- bodycontainer h1, #bodycontainer h2, #bodycontainer p{
margin-left: 215px; margin-right: 8px; }
/*Figure captions*/
.figurebox{ max-width: 40%; float: right; } .figureimg, .figureimg img, .figurecaption{ width: 100%; } .figureimg, .figurecaption{ border: 2px solid #888; } .figurecaption{ border-top: 0px; } .figurecaption p{ padding: 5px; margin: 0 !important; /*necessary to override main page margins*/ }