Team:UNIK Copenhagen/template
From 2013.igem.org
(Difference between revisions)
SigneKarlsen (Talk | contribs) |
SigneKarlsen (Talk | contribs) |
||
Line 25: | Line 25: | ||
body{ | body{ | ||
- | background-color: #cccccc; | + | background-color: #cccccc; |
- | background-image: url("https://static.igem.org/mediawiki/2013/b/ba/UNIK_Copenhagen_bg.png"); | + | background-image: url("https://static.igem.org/mediawiki/2013/b/ba/UNIK_Copenhagen_bg.png"); |
width: 100%; | width: 100%; | ||
margin: 0 auto; | margin: 0 auto; | ||
position: relative; | position: relative; | ||
- | background-attachment: fixed; | + | background-attachment: fixed; |
} | } | ||
#top-section { | #top-section { | ||
Line 40: | Line 40: | ||
margin: 0px; | margin: 0px; | ||
padding: 5px; | padding: 5px; | ||
- | width: 100%; | + | width: 100%; |
} | } | ||
#menubar.left-menu ul{ | #menubar.left-menu ul{ | ||
- | margin-left: -5px; | + | margin-left: -5px; |
- | padding: 5px 3px 3px 5px; | + | padding: 5px 3px 3px 5px; |
- | background: white; | + | background: white; |
- | border-bottom-left-radius: 5px; | + | border-bottom-left-radius: 5px; |
- | border-bottom-right-radius: 5px; | + | border-bottom-right-radius: 5px; |
- | box-shadow: 0px 0px 5px #888888; | + | box-shadow: 0px 0px 5px #888888; |
- | -webkit-box-shadow: 0px 0px 5px #888888; | + | -webkit-box-shadow: 0px 0px 5px #888888; |
- | -moz-box-shadow: 0px 0px 5px #888888; | + | -moz-box-shadow: 0px 0px 5px #888888; |
} | } | ||
#menubar.left-menu{ | #menubar.left-menu{ | ||
Line 56: | Line 56: | ||
} | } | ||
#menubar.right-menu ul{ | #menubar.right-menu ul{ | ||
- | padding: 5px 6px 3px 3px; | + | padding: 5px 6px 3px 3px; |
} | } | ||
#footer-box{ | #footer-box{ | ||
Line 71: | Line 71: | ||
font-size: 12px; | font-size: 12px; | ||
} | } | ||
- | #footer{width: 900px; margin: 0px auto} | + | #footer{ |
- | #footer a{color: white;} | + | width: 900px; |
+ | margin: 0px auto | ||
+ | } | ||
+ | #footer a{ | ||
+ | color: white; | ||
+ | } | ||
/*-------------------------------------------------------*/ | /*-------------------------------------------------------*/ | ||
- | /* | + | /* Wrapper CSS */ |
/*-------------------------------------------------------*/ | /*-------------------------------------------------------*/ | ||
#wrapper{ | #wrapper{ | ||
- | display: block; | + | display: block; |
- | position: relative; | + | position: relative; |
width:964px; | width:964px; | ||
- | min-height: 1000px; | + | min-height: 1000px; |
margin: 45px auto -5px auto; | margin: 45px auto -5px auto; | ||
- | padding: 0px 10px 60px 10px; | + | padding: 0px 10px 60px 10px; |
z-index: 95; | z-index: 95; | ||
- | background: white; | + | background: white; |
- | top:-10px; | + | top:-10px; |
- | border-radius: 5px; | + | border-radius: 5px; |
- | box-shadow: 0px 0px 5px #888888; | + | box-shadow: 0px 0px 5px #888888; |
-webkit-box-shadow: 0px 0px 5px #888888; | -webkit-box-shadow: 0px 0px 5px #888888; | ||
-moz-box-shadow: 0px 0px 5px #888888; | -moz-box-shadow: 0px 0px 5px #888888; | ||
} | } | ||
+ | /*-------------------------------------------------------*/ | ||
+ | /* Navigation Bar CSS */ | ||
+ | /*-------------------------------------------------------*/ | ||
#nav{ | #nav{ | ||
- | display: block; | + | display: block; |
- | width: 940px; | + | width: 940px; |
- | height: 38px; | + | height: 38px; |
- | margin: 0 auto; | + | margin: 0 auto; |
- | border-bottom: 1px solid #cccccc; | + | border-bottom: 1px solid #cccccc; |
- | border-top: 1px solid #cccccc; | + | border-top: 1px solid #cccccc; |
} | } | ||
#nav li{ | #nav li{ | ||
Line 117: | Line 125: | ||
visibility: hidden; | visibility: hidden; | ||
z-index: 95; | z-index: 95; | ||
- | margin:1px 0px 0px 0px; | + | margin:1px 0px 0px 0px; |
- | background: white; | + | background: white; |
- | box-shadow: 0px 0px 2px #888888; | + | box-shadow: 0px 0px 2px #888888; |
- | -webkit-box-shadow: 0px 0px 2px #888888; | + | -webkit-box-shadow: 0px 0px 2px #888888; |
- | -moz-box-shadow: 0px 0px 2px #888888; | + | -moz-box-shadow: 0px 0px 2px #888888; |
} | } | ||
#nav ul ul li{ | #nav ul ul li{ | ||
- | border: none; | + | border: none; |
} | } | ||
#nav ul li a{ | #nav ul li a{ | ||
Line 132: | Line 140: | ||
text-decoration: none; | text-decoration: none; | ||
display: block; | display: block; | ||
- | height: 30px; | + | height: 30px; |
color: #333333; | color: #333333; | ||
padding: 0px 12px 0px 12px; | padding: 0px 12px 0px 12px; | ||
Line 152: | Line 160: | ||
} | } | ||
#nav li:hover{ | #nav li:hover{ | ||
- | border-bottom: 1px solid #990000; | + | border-bottom: 1px solid #990000; |
- | border-top: 1px solid #990000; | + | border-top: 1px solid #990000; |
} | } | ||
#nav li:hover a{ | #nav li:hover a{ | ||
Line 159: | Line 167: | ||
} | } | ||
#nav li li:hover{ | #nav li li:hover{ | ||
- | border: none; | + | border: none; |
} | } | ||
#nav ul li:hover ul li a{ | #nav ul li:hover ul li a{ | ||
Line 251: | Line 259: | ||
/*-------------------------------------------------------*/ | /*-------------------------------------------------------*/ | ||
#two_logos{ | #two_logos{ | ||
- | height: 140px; | + | height: 140px; |
} | } | ||
#our_logo{ | #our_logo{ | ||
- | display: inline-block; | + | display: inline-block; |
- | position: relative; | + | position: relative; |
- | float: left; | + | float: left; |
margin: 30px 0px 0px 15px; | margin: 30px 0px 0px 15px; | ||
} | } | ||
#iGEM_logo{ | #iGEM_logo{ | ||
- | display: inline-block; | + | display: inline-block; |
- | float: right; | + | float: right; |
position:relative; | position:relative; | ||
margin: 15px 15px 0px 0px; | margin: 15px 15px 0px 0px; | ||
- | top: 0px; | + | top: 0px; |
} | } | ||
#iGEM{ | #iGEM{ | ||
Line 285: | Line 293: | ||
-webkit-transition-duration: 1s; | -webkit-transition-duration: 1s; | ||
- | + | -moz-transition-duration: 1s; | |
- | + | -o-transition-duration: 1s; | |
- | + | transition-duration: 1s; | |
-webkit-transform: rotate(0deg); | -webkit-transform: rotate(0deg); | ||
Line 294: | Line 302: | ||
-ms-transform: rotate(0deg); | -ms-transform: rotate(0deg); | ||
- | + | -webkit-transition-property: -webkit-transform; | |
- | + | -moz-transition-property: -moz-transform; | |
- | + | -o-transition-property: -o-transform; | |
- | + | transition-property: transform; | |
} | } | ||
#no_wheel:hover + #wheel{ | #no_wheel:hover + #wheel{ | ||
- | -webkit-transform: rotate(360deg); | + | -webkit-transform: rotate(360deg); |
- | -moz-transform: rotate(360deg); | + | -moz-transform: rotate(360deg); |
- | -o-transform: rotate(360deg); | + | -o-transform: rotate(360deg); |
- | -ms-transform: rotate(360deg); | + | -ms-transform: rotate(360deg); |
z-index: -1; | z-index: -1; | ||
} | } |
Revision as of 08:37, 30 September 2013