Team:TU-Delft/Templates/Style
From 2013.igem.org
(Difference between revisions)
Line 1: | Line 1: | ||
<html> | <html> | ||
<style> | <style> | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
/* Removing wiki-like stuff */ | /* Removing wiki-like stuff */ | ||
Line 35: | Line 31: | ||
right: auto; | right: auto; | ||
text-align: right; | text-align: right; | ||
- | width: | + | width: 976px; |
z-index: 7; | z-index: 7; | ||
} | } | ||
Line 46: | Line 42: | ||
/* Layout */ | /* Layout */ | ||
/**********/ | /**********/ | ||
- | + | body { | |
- | + | background-color: background: #ADD8E6 url("https://static.igem.org/mediawiki/2013/d/d7/Im04.gif") left no-repeat fixed; | |
- | + | color:#000000; | |
+ | font-family: Verdana, Arial, Helvetica, sans-serif; | ||
+ | font-size: 12px; | ||
+ | margin: 30px 30px; | ||
+ | padding: 0px; | ||
} | } | ||
- | + | .clear{clear:both;} | |
- | + | * { | |
- | + | margin: 0px; | |
- | + | padding: 0px; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | # | + | #container { |
- | + | margin: 0px auto; | |
- | + | text-align: left; | |
- | + | width: 717px; | |
- | + | ||
- | + | ||
} | } | ||
- | + | a{ | |
- | + | font-size:12px; | |
- | + | ||
} | } | ||
- | + | p{ | |
- | + | margin: 15px 0px; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | ul { margin:5px 0px; color:#85a157;} | |
- | + | /********************** Header ***************************/ | |
- | + | #header { | |
- | + | margin: 0px 0px 0px 0px; | |
- | + | background-image:url(images/header.jpg); | |
- | + | width:717px; | |
- | + | height:288px; | |
+ | position:relative; | ||
} | } | ||
- | # | + | #header ul{ |
- | + | background-color:#85a157; | |
+ | width:711px; | ||
+ | border: 3px solid #FFFFFF; | ||
+ | display:block; | ||
+ | top:255px; | ||
+ | position:absolute; | ||
+ | margin: 0px 0px 0px 0px; | ||
+ | height:22px; | ||
+ | padding:5px 0px 0px 0px; | ||
+ | text-align:center; | ||
} | } | ||
- | + | #header li{ | |
- | # | + | display:inline; |
- | + | ||
} | } | ||
- | + | #header ul a{ | |
- | + | text-decoration:none; | |
- | + | color:#FFFFFF; | |
- | + | margin: 0px 15px; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | #header ul a:hover{ | |
- | + | text-decoration:underline; | |
- | + | color:#28556b; | |
- | + | ||
- | #header | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | #logo_w1,#logo_w2 { | |
- | # | + | font-size: 24px; |
- | + | font-style:italic; | |
- | + | color:#FFFFFF; | |
- | + | position:absolute; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | # | + | #logo_w1{ |
- | + | font-size: 30px; | |
- | + | top: 10px; | |
- | + | left:10px; | |
} | } | ||
- | + | #logo_w2{ | |
- | # | + | top:25px; |
- | + | left:540px; | |
} | } | ||
- | + | #header_text { | |
- | # | + | top:35px; |
- | + | left:10px; | |
+ | width:230px; | ||
+ | position:absolute; | ||
} | } | ||
- | # | + | #header_text p{ |
- | + | font-size: 18px; | |
- | + | color:#FFFFFF; | |
- | + | ||
- | + | ||
} | } | ||
- | + | #header_text a{color:#28556b;} | |
- | # | + | #header_text a:hover{color:#c77e0c;} |
- | + | /********************** Content ***************************/ | |
- | + | #content { | |
- | + | background-image:url(images/content_bg.gif); | |
- | + | width:717px; | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | img{ | |
- | + | border-width:0px; | |
- | color: # | + | } |
+ | h1{ | ||
+ | color:#000000; | ||
+ | font-size:14px; | ||
+ | margin: 20px 0px 20px 0px; | ||
} | } | ||
- | + | h2{ | |
- | color: # | + | color:#85a157; |
+ | font-size:14px; | ||
+ | text-align:left; | ||
+ | margin: 10px 0px 10px 0px; | ||
} | } | ||
- | + | h3{ | |
- | + | color:#222; | |
- | + | font-size:12px; | |
- | + | text-align:left; | |
- | + | font-weight:bold; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | .event { | |
- | + | background-color:#efefef; | |
- | + | border:1px dotted #85a157; | |
- | + | padding:10px; | |
- | margin: | + | margin:3px; |
} | } | ||
- | + | div.hour { | |
- | + | text-align:right; | |
- | + | font-size:12px; | |
- | + | border-bottom:1px solid #85a157; | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | .path { | |
- | + | text-align:left; | |
- | + | padding:5px 25px; | |
- | + | font-size:11px; | |
- | + | border:1px solid #efefef; | |
- | + | ||
- | + | ||
} | } | ||
- | + | .path a {color:#85a157; font-size:11px;} | |
- | # | + | .path a:hover {color:#c77e0c; font-size:11px;} |
- | + | #left { | |
+ | float:left; | ||
+ | width:428px; | ||
+ | margin-left:27px; | ||
+ | padding: 0px 10px 30px 0px; | ||
+ | display:inline; | ||
} | } | ||
- | + | #left a{color:#28556b;} | |
- | # | + | #left a:hover{color:#c77e0c;} |
- | + | #photos a{ | |
- | + | margin-right:14px; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
+ | #right { | ||
+ | float:right; | ||
+ | width:210px; | ||
+ | padding: 0px 20px 20px 20px; | ||
+ | margin-top:10px; | ||
+ | border-left: #FFF 2px solid; | ||
- | |||
- | |||
- | |||
} | } | ||
+ | #right a{ | ||
+ | color:#c77e0c; | ||
+ | } | ||
+ | #right a:hover{ | ||
+ | color:#85a157; | ||
+ | } | ||
+ | /********************** Footer ***************************/ | ||
+ | #footerline { | ||
+ | clear:both; | ||
+ | background-image:url(images/footer_bg.gif); | ||
+ | font-size:1px; | ||
+ | height:10px; | ||
+ | } | ||
+ | #footer { | ||
+ | width:717px; | ||
+ | text-align:center; | ||
+ | padding: 20px 0px; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
</html> | </html> |
Revision as of 09:54, 19 April 2013