Team:Dundee/global.css
From 2011.igem.org
Rachmontague (Talk | contribs) |
|||
(54 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | + | 3@charset "utf-8"; | |
- | + | ||
- | + | ||
- | + | ||
- | + | html, body, div, span, applet, object, iframe, | |
+ | h1, h2, h3, h4, h5, h6, p, blockquote, pre, | ||
+ | a, abbr, acronym, address, big, cite, code, | ||
+ | del, dfn, em, img, ins, kbd, q, s, samp, | ||
+ | small, strike, strong, sub, sup, tt, var, | ||
+ | b, u, i, center, | ||
+ | dl, dt, dd, ol, ul, li, | ||
+ | fieldset, form, label, legend, | ||
+ | table, caption, tbody, tfoot, thead, tr, th, td, | ||
+ | article, aside, canvas, details, embed, | ||
+ | figure, figcaption, footer, header, hgroup, | ||
+ | menu, nav, output, ruby, section, summary, | ||
+ | time, mark, audio, video { | ||
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
+ | border: 0; | ||
+ | font-size: 100%; | ||
+ | font: inherit; | ||
+ | vertical-align: baseline; | ||
+ | } | ||
+ | /* HTML5 display-role reset for older browsers */ | ||
+ | article, aside, details, figcaption, figure, | ||
+ | footer, header, hgroup, menu, nav, section { | ||
+ | display: block; | ||
+ | } | ||
+ | body { | ||
+ | line-height: 1; | ||
} | } | ||
body { | body { | ||
background: #fff; | background: #fff; | ||
- | + | font-size: 82.5%; | |
- | font-size: | + | |
font-family:'Droid Sans', arial, sans-serif; | font-family:'Droid Sans', arial, sans-serif; | ||
color: #44444; | color: #44444; | ||
} | } | ||
- | + | ||
- | + | a:link, | |
- | + | a:visited { | |
- | + | color:#21759b; | |
- | + | text-decoration:none; | |
- | + | } | |
+ | |||
+ | a:hover, | ||
+ | a:active { | ||
+ | color:#d54e21; | ||
+ | text-decoration:underline; | ||
} | } | ||
h1, h2, h3, h4, h5, h6 { | h1, h2, h3, h4, h5, h6 { | ||
- | + | margin-bottom:18px; | |
+ | text-transform:uppercase; | ||
} | } | ||
- | + | h1 { | |
- | + | font-size:36px; | |
- | + | line-height:27px; | |
- | + | ||
- | font- | + | |
- | + | ||
} | } | ||
- | + | h2 { | |
- | + | font-size:32px; | |
- | + | line-height:24px; | |
- | + | ||
- | + | ||
} | } | ||
- | + | h3 { | |
- | + | font-size:27px; | |
- | + | line-height:20px; | |
- | + | ||
- | + | ||
} | } | ||
- | + | h4 { | |
- | + | font-size:24px; | |
} | } | ||
- | + | h5 { | |
- | + | font-size:20px; | |
- | + | ||
} | } | ||
- | + | h6 { | |
- | + | font-size:18px; | |
} | } | ||
- | + | p { | |
- | + | margin-bottom:18px; | |
- | + | ||
- | + | ||
- | + | ||
- | margin | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | table { | |
- | + | width:100%; | |
- | + | border-collapse:collapse; | |
+ | text-align:center; | ||
+ | margin-bottom:16px; | ||
} | } | ||
- | + | table th, | |
- | + | table td { | |
- | + | padding:6px 0; | |
} | } | ||
- | # | + | table th { |
+ | background:#EEE; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | #header { | ||
+ | height:100px; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | #footer { | ||
+ | position:relative; | ||
+ | width:940px; | ||
+ | margin:0 auto; | ||
+ | } | ||
+ | |||
+ | #pages { | ||
+ | position:relative; | ||
+ | height:30px; | ||
+ | padding:10px 0 10px 0; | ||
+ | margin-bottom:5px; | ||
+ | background:#1C100F; | ||
+ | -moz-box-shadow:0px 0px 20px #999; | ||
+ | -webkit-box-shadow:0px 0px 20px #999; | ||
+ | box-shadow:0 0 20px #999; | ||
+ | } | ||
+ | /* Services Nav bar */ | ||
+ | #navi { | ||
+ | width: 960px; | ||
+ | margin: 0 auto; | ||
font-size: 1.2em; | font-size: 1.2em; | ||
- | + | font-family:'Droid Sans', arial, sans-serif; | |
} | } | ||
- | # | + | #navi ul li { |
+ | float: left; | ||
+ | list-style-type: none; | ||
+ | min-width: 120px; | ||
+ | height: 40px; | ||
+ | } | ||
+ | |||
+ | #navi li a { | ||
+ | color:#FFFFFF; | ||
text-decoration: none; | text-decoration: none; | ||
- | + | display: block; | |
- | padding: | + | padding: 0px 10px; |
} | } | ||
- | # | + | #navi li a:hover { |
- | + | text-decoration:underline; | |
} | } | ||
- | # | + | #navi .current { |
- | + | height: 56px; | |
- | + | text-decoration:underline; | |
- | } | + | } |
- | # | + | #navi .current a { |
- | + | color: #FFFFFF; | |
} | } | ||
- | |||
#project { | #project { | ||
- | width: | + | width: 1100px; |
- | height: | + | height: 650px; |
float: left; | float: left; | ||
- | margin: | + | margin: 120px; |
margin-top: 5px; | margin-top: 5px; | ||
- | |||
- | |||
-moz-border-radius-bottomleft: 20px 20px; | -moz-border-radius-bottomleft: 20px 20px; | ||
-moz-border-radius-topright: 20px 20px; | -moz-border-radius-topright: 20px 20px; | ||
} | } | ||
- | # | + | .endfooter{ |
+ | clear:both; | ||
+ | width:100%; | ||
+ | height: 80px; | ||
+ | margin-bottom:20px; | ||
+ | text-align:center; | ||
+ | padding:85px 0px 0px 0px; | ||
+ | background-image:url(images/border1.png); | ||
+ | } | ||
+ | |||
+ | #largeImage { | ||
+ | width: 1100px; | ||
+ | height: 200px; | ||
float: left; | float: left; | ||
- | + | margin-top: 5px; | |
- | + | margin-left:145px; | |
- | margin- | + | |
} | } | ||
- | # | + | #largeImage img { |
- | + | width: 960px; | |
- | + | height: 200px; | |
- | + | margin-top: 120px; | |
- | + | margin: 5px; | |
} | } | ||
- | + | .text1 { | |
- | + | position: relative; | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | .text1 h2 { | |
- | + | position: absolute; | |
- | + | margin-left:840px; | |
- | + | top: 130px; | |
- | + | ||
} | } | ||
- | + | .text1 h2 span { | |
- | + | color: white; | |
- | + | letter-spacing: -1px; | |
- | + | background: rgb(0, 0, 0); /* fallback color */ | |
- | + | background: rgba(0, 0, 0, 0.7); | |
+ | padding: 10px; | ||
} | } | ||
- | # | + | |
- | + | #largeContent { | |
- | + | float:left; | |
- | + | width: 680px; | |
- | + | ||
+ | margin: 5px; | ||
+ | margin-top:50px; | ||
+ | border-right:1px solid #1C100F; | ||
+ | padding:0px 10px 10px 0px; | ||
} | } | ||
- | # | + | #largeContent h1 { |
- | + | font-size:1.7em; | |
- | + | color:#4a3242; | |
- | + | margin-left:5px; | |
- | + | ||
} | } | ||
- | # | + | #largeContent p { |
- | + | font-size:1em; | |
- | + | color:#4a3242; | |
- | + | margin:5px; | |
- | + | ||
} | } | ||
- | # | + | #largeContent img { |
- | + | width: 300px; | |
- | + | height: 200px; | |
- | + | margin-top: 120px; | |
- | + | margin: 5px; | |
} | } | ||
+ | #project { | ||
+ | width: 960px; | ||
+ | height: 650px; | ||
+ | float: left; | ||
+ | margin: 145px; | ||
+ | margin-top: 5px; | ||
+ | -moz-border-radius-bottomleft: 20px 20px; | ||
+ | -moz-border-radius-topright: 20px 20px; | ||
+ | } | ||
- | # | + | #rightContent { |
- | float: | + | float:left; |
width: 200px; | width: 200px; | ||
- | margin | + | height:630px; |
- | margin-top: | + | margin: 5px; |
+ | margin-top:50px; | ||
+ | padding:0px 10px 10px 0px; | ||
+ | font-family:'Droid Sans', arial, sans-serif; | ||
} | } | ||
- | # | + | #rightContent h1 { |
font-size:1.7em; | font-size:1.7em; | ||
color:#4a3242; | color:#4a3242; | ||
+ | margin-left:5px; | ||
+ | } | ||
+ | |||
+ | #rightContent p { | ||
+ | font-size:1em; | ||
+ | color:#4a3242; | ||
+ | margin:5px; | ||
+ | } | ||
+ | |||
+ | #title h1 { | ||
+ | font-size: 3.8em; | ||
+ | color: #4a3242; | ||
+ | } | ||
+ | |||
+ | #title h2 { | ||
+ | font-size: 1.6em; | ||
+ | color: #895a6e; | ||
+ | } | ||
+ | |||
+ | #title a { | ||
+ | text-decoration: none; | ||
+ | color: white; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | #title a:hover { | ||
+ | color: black; | ||
+ | } | ||
+ | |||
+ | #title a img { | ||
+ | width: 32px; | ||
+ | height: 32px; | ||
+ | } | ||
+ | |||
+ | #title a:first-of-type { | ||
+ | margin-left: 5px; | ||
+ | } | ||
+ | #lasttweet { | ||
+ | margin-left:5px; | ||
margin-top:5px; | margin-top:5px; | ||
margin-bottom:10px; | margin-bottom:10px; | ||
+ | color: #4a3242; | ||
+ | font-size:1em; | ||
} | } | ||
+ | #lasttweet img{ | ||
+ | width:40px ; | ||
+ | height:29px; | ||
+ | } | ||
- | # | + | |
- | margin-left: | + | #tweetDate { |
+ | margin-left:5px; | ||
margin-top:5px; | margin-top:5px; | ||
margin-bottom:10px; | margin-bottom:10px; | ||
- | color: # | + | color: #4a3242; |
- | font-size:1. | + | font-size:1.0em; |
+ | font-style:italic; | ||
+ | } | ||
+ | |||
+ | #rightContent ul li { | ||
+ | margin-left:0px; | ||
+ | margin-top:5px; | ||
+ | margin-bottom:10px; | ||
+ | color: #4a3242; | ||
+ | font-size:1.0em; | ||
+ | font-family:'Droid Sans', arial, sans-serif; | ||
} | } | ||
- | # | + | #rightContent li a { |
- | color: # | + | color: #4a3242; |
text-decoration: none; | text-decoration: none; | ||
} | } | ||
- | # | + | #rightContent a:hover { |
color: #4a3242; | color: #4a3242; | ||
+ | text-decoration:underline; | ||
} | } | ||
#team { | #team { | ||
- | width: | + | width: 650px; |
height: 250px; | height: 250px; | ||
float: left; | float: left; | ||
- | margin: | + | margin: 5px; |
margin-top: 5px; | margin-top: 5px; | ||
background: white; | background: white; | ||
color: black; | color: black; | ||
- | -moz-border-radius-bottomleft: | + | -moz-border-radius-bottomleft: 10px 10px; |
- | -moz-border-radius-topright: | + | -moz-border-radius-topright: 10px 10px; |
} | } | ||
#teamLeft { | #teamLeft { | ||
float: left; | float: left; | ||
- | width: | + | width: 670px; |
height: 100px; | height: 100px; | ||
margin-right: 10px; | margin-right: 10px; | ||
} | } | ||
- | # | + | #teamLeft h1 { |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
margin-top: 10px; | margin-top: 10px; | ||
font-size: 2.2em; | font-size: 2.2em; | ||
Line 262: | Line 371: | ||
} | } | ||
- | # | + | #teamleft h2 { |
- | font-size: 1. | + | font-size: 1.0em; |
color: #895a6e; | color: #895a6e; | ||
- | |||
} | } | ||
+ | |||
#teamLeft p { | #teamLeft p { | ||
- | |||
margin-top: 5px; | margin-top: 5px; | ||
font-size: 1.2em; | font-size: 1.2em; | ||
color:#4a3242; | color:#4a3242; | ||
+ | text-align:justify; | ||
} | } | ||
- | # | + | #team span img{ |
- | + | position:absolute; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } |
Latest revision as of 10:30, 22 June 2011
3@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; }
body { background: #fff; font-size: 82.5%; font-family:'Droid Sans', arial, sans-serif; color: #44444; }
a:link,
a:visited {
color:#21759b;
text-decoration:none;
}
a:hover, a:active { color:#d54e21; text-decoration:underline; }
h1, h2, h3, h4, h5, h6 { margin-bottom:18px; text-transform:uppercase; }
h1 { font-size:36px; line-height:27px; }
h2 { font-size:32px; line-height:24px; }
h3 { font-size:27px; line-height:20px; }
h4 { font-size:24px; }
h5 { font-size:20px; }
h6 { font-size:18px; }
p { margin-bottom:18px; }
table { width:100%; border-collapse:collapse; text-align:center; margin-bottom:16px; }
table th, table td { padding:6px 0; }
table th { background:#EEE; font-weight:bold; }
- header {
height:100px;
}
- footer {
position:relative; width:940px; margin:0 auto; }
- pages {
position:relative; height:30px; padding:10px 0 10px 0; margin-bottom:5px; background:#1C100F; -moz-box-shadow:0px 0px 20px #999; -webkit-box-shadow:0px 0px 20px #999; box-shadow:0 0 20px #999; } /* Services Nav bar */
- navi {
width: 960px; margin: 0 auto; font-size: 1.2em; font-family:'Droid Sans', arial, sans-serif; }
- navi ul li {
float: left; list-style-type: none; min-width: 120px; height: 40px; }
- navi li a {
color:#FFFFFF;
text-decoration: none; display: block; padding: 0px 10px; }
- navi li a:hover {
text-decoration:underline; }
- navi .current {
height: 56px;
text-decoration:underline;
}
- navi .current a {
color: #FFFFFF; }
- project {
width: 1100px; height: 650px; float: left; margin: 120px; margin-top: 5px; -moz-border-radius-bottomleft: 20px 20px; -moz-border-radius-topright: 20px 20px; }
.endfooter{ clear:both; width:100%; height: 80px; margin-bottom:20px; text-align:center; padding:85px 0px 0px 0px; background-image:url(images/border1.png); }
- largeImage {
width: 1100px; height: 200px; float: left; margin-top: 5px; margin-left:145px; }
- largeImage img {
width: 960px; height: 200px; margin-top: 120px; margin: 5px; }
.text1 {
position: relative;
}
.text1 h2 {
position: absolute; margin-left:840px; top: 130px;
}
.text1 h2 span {
color: white; letter-spacing: -1px; background: rgb(0, 0, 0); /* fallback color */ background: rgba(0, 0, 0, 0.7); padding: 10px;
}
- largeContent {
float:left; width: 680px;
margin: 5px; margin-top:50px; border-right:1px solid #1C100F; padding:0px 10px 10px 0px; }
- largeContent h1 {
font-size:1.7em; color:#4a3242; margin-left:5px; }
- largeContent p {
font-size:1em; color:#4a3242; margin:5px; }
- largeContent img {
width: 300px; height: 200px; margin-top: 120px; margin: 5px; }
- project {
width: 960px; height: 650px; float: left; margin: 145px; margin-top: 5px; -moz-border-radius-bottomleft: 20px 20px; -moz-border-radius-topright: 20px 20px; }
- rightContent {
float:left; width: 200px; height:630px; margin: 5px; margin-top:50px; padding:0px 10px 10px 0px; font-family:'Droid Sans', arial, sans-serif; }
- rightContent h1 {
font-size:1.7em; color:#4a3242; margin-left:5px; }
- rightContent p {
font-size:1em; color:#4a3242; margin:5px; }
- title h1 {
font-size: 3.8em; color: #4a3242; }
- title h2 {
font-size: 1.6em; color: #895a6e; }
- title a {
text-decoration: none; color: white; padding: 0; }
- title a:hover {
color: black; }
- title a img {
width: 32px; height: 32px; }
- title a:first-of-type {
margin-left: 5px; }
- lasttweet {
margin-left:5px; margin-top:5px; margin-bottom:10px; color: #4a3242; font-size:1em; }
- lasttweet img{
width:40px ; height:29px; }
- tweetDate {
margin-left:5px; margin-top:5px; margin-bottom:10px; color: #4a3242; font-size:1.0em; font-style:italic; }
- rightContent ul li {
margin-left:0px; margin-top:5px; margin-bottom:10px; color: #4a3242; font-size:1.0em; font-family:'Droid Sans', arial, sans-serif;
}
- rightContent li a {
color: #4a3242; text-decoration: none; }
- rightContent a:hover {
color: #4a3242; text-decoration:underline; }
- team {
width: 650px; height: 250px; float: left; margin: 5px; margin-top: 5px; background: white; color: black; -moz-border-radius-bottomleft: 10px 10px; -moz-border-radius-topright: 10px 10px; }
- teamLeft {
float: left; width: 670px; height: 100px; margin-right: 10px; }
- teamLeft h1 {
margin-top: 10px; font-size: 2.2em; color:#896478; }
- teamleft h2 {
font-size: 1.0em; color: #895a6e; }
- teamLeft p {
margin-top: 5px; font-size: 1.2em; color:#4a3242; text-align:justify; }
- team span img{
position:absolute; }