Team:Dundee/global.css

From 2011.igem.org

(Difference between revisions)
 
(23 intermediate revisions not shown)
Line 1: Line 1:
-
/*
+
3@charset "utf-8";
-
Author : Rachel Montague
+
-
Date: May 2011
+
-
*/
+
-
* {
+
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;
-
        width: 100%;
+
font-size: 82.5%;
-
font-size: 62.5%;
+
font-family:'Droid Sans', arial, sans-serif;
font-family:'Droid Sans', arial, sans-serif;
color: #44444;
color: #44444;
}
}
-
#header {
 
-
width: 100%;
 
-
height: 190px;
 
-
align: center;
 
-
background: #6f4048;
 
-
background-image:url(https://static.igem.org/mediawiki/2011/b/ba/Dundee-iGemHeader.jpg)
 
-
}
 
-
h1, h2, h3, h4, h5, h6 {
+
a:link,
-
        border-bottom: 0;
+
a:visited {
-
        margin: 0;
+
color:#21759b;
-
        padding: 0;
+
text-decoration:none;
}
}
-
#content {
+
a:hover,
-
      border-left: 0;
+
a:active {
-
      border-right: 0;
+
color:#d54e21;
-
      width: 100%;
+
text-decoration:underline;
-
      padding: 0;
+
-
      margin: 0;
+
}
}
-
#catLinks {
+
h1, h2, h3, h4, h5, h6 {
-
      border: none;
+
margin-bottom:18px;
 +
text-transform:uppercase;
}
}
-
ul {
+
h1 {
-
      padding: 0;
+
font-size:36px;
-
      margin: 0;
+
line-height:27px;
-
      list-style-type: none;
+
-
      list-style-image: none;
+
-
      font-size: 0.8em;
+
}
}
-
#top-section {
+
h2 {
-
    border: none;
+
font-size:32px;
-
    margin-top: 5px;
+
line-height:24px;
-
    margin-bottom: 0;
+
-
    height: 5px;
+
}
}
-
#menubar a {
+
h3 {
-
    color: grey;
+
font-size:27px;
-
    background-color: white;
+
line-height:20px;
}
}
-
#menubar a:hover {
+
h4 {
-
    text-decoration: underline;
+
font-size:24px;
}
}
-
#menubar:hover {
+
h5 {
-
    background-color: white;
+
font-size:20px;
}
}
-
/* Nav bar */
+
h6 {
-
#nav {
+
font-size:18px;
-
width: 1000px;
+
-
margin: 0 auto;
+
-
font-family: 'Droid Sans', arial, serif;
+
-
font-size: 1.6em;
+
}
}
-
#nav ul li {
+
p {
-
float: left;
+
margin-bottom:18px;
-
list-style-type: none;
+
-
min-width: 100px;
+
-
height: 60px;
+
}
}
-
#nav li a {
+
table {
-
color: white;
+
width:100%;
-
text-decoration: none;
+
border-collapse:collapse;
-
display: block;
+
text-align:center;
-
padding: 30px 30px;
+
margin-bottom:16px;
}
}
-
#nav li a:hover {
+
table th,
-
text-decoration:underline;
+
table td {
 +
padding:6px 0;
}
}
-
#nav li a:active {
+
table th {
-
        border: none;
+
background:#EEE;
 +
font-weight:bold;
}
}
-
#nav .current {
+
#header {
-
height: 56px;
+
height:100px;
-
color: white;
+
}
}
-
#nav .current a {
 
-
text-decoration:underline;
 
-
}
 
-
/* Title */
+
#footer {
-
#title {
+
position:relative;
-
width: 900px;
+
width:940px;
-
float:left;
+
margin:0 auto;
-
margin: 30px;
+
-
margin-top: 20px;
+
-
color: #895a6e;
+
-
padding-bottom: 10px;
+
-
border-bottom: 2px solid;
+
-
border-bottom-color: #895a6e;
+
-
+
}
}
-
#title h1 {
+
#pages {
-
font-size: 3em;
+
position:relative;
-
color: #4a3242;
+
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 */
-
#title h2 {
+
#navi {
 +
width: 960px;
 +
margin: 0 auto;
font-size: 1.2em;
font-size: 1.2em;
-
color: #895a6e;
+
font-family:'Droid Sans', arial, sans-serif;
}
}
-
#title h3 {
+
#navi ul li {
-
font-size: 0.8em;
+
float: left;
-
margin-top: 5px;
+
list-style-type: none;
 +
min-width: 120px;
 +
height: 40px;
}
}
-
#title a {
+
#navi li a {
 +
    color:#FFFFFF;
text-decoration: none;
text-decoration: none;
-
color: white;
+
display: block;
-
padding: 0;
+
padding: 0px 10px;
}
}
-
#title a:hover {
+
#navi li a:hover {
-
color: black;
+
text-decoration:underline;
}
}
-
#title a img {
+
#navi .current {
-
width: 32px;
+
height: 56px;
-
height: 32px;
+
    text-decoration:underline;
-
}
+
}
-
#title a:first-of-type {
+
#navi .current a {
-
margin-left: 5px;
+
color: #FFFFFF;
}
}
-
/* Project */
 
#project {
#project {
-
width: 900px;
+
width: 1100px;
-
height: 300px;
+
height: 650px;
float: left;
float: left;
-
margin: 30px;
+
margin: 120px;
margin-top: 5px;
margin-top: 5px;
-
background: white;
 
-
color: black;
 
-moz-border-radius-bottomleft: 20px 20px;
-moz-border-radius-bottomleft: 20px 20px;
-moz-border-radius-topright: 20px 20px;
-moz-border-radius-topright: 20px 20px;
}
}
-
#projectLeft {
+
.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;
-
width: 470px;
+
margin-top: 5px;
-
height: 100px;
+
margin-left:145px;
-
margin-right: 10px;
+
}
}
-
#project h1 {
+
#largeImage img {
-
margin-left: 10px;
+
width: 960px;
-
margin-top: 10px;
+
height: 200px;
-
font-size: 2em;
+
margin-top: 120px;
-
color:#896478;
+
margin: 5px;
}
}
-
#project h2 {
+
.text1 {
-
margin-left: 10px;
+
  position: relative;
-
margin-top: 0px;
+
-
font-size: 1.3em;
+
-
color:#896478;
+
}
}
-
#project p {
+
.text1 h2 {
-
margin-left: 10px;
+
  position: absolute;
-
margin-top: 5px;
+
  margin-left:840px;
-
font-size: 1em;
+
  top: 130px;
-
color:#4a3242;
+
}
}
-
#project ol {
+
.text1 h2 span {
-
margin-left: 50px;
+
  color: white;
-
margin-top: 5px;
+
  letter-spacing: -1px;
-
font-size: 1em;
+
  background: rgb(0, 0, 0); /* fallback color */
-
color:#4a3242;
+
  background: rgba(0, 0, 0, 0.7);
 +
  padding: 10px;
}
}
-
#projectLeft p {
+
 
-
margin-left: 10px;
+
#largeContent {
-
margin-top: 5px;
+
float:left;
-
font-size: 1em;
+
width: 680px;
-
color:#4a3242;
+
 
 +
margin: 5px;
 +
margin-top:50px;
 +
border-right:1px solid #1C100F;
 +
padding:0px 10px 10px 0px;
}
}
-
#projectLeft ol {
+
#largeContent h1 {
-
margin-left: 50px;
+
font-size:1.7em;
-
margin-top: 5px;
+
color:#4a3242;
-
font-size: 1em;
+
margin-left:5px;
-
color:#4a3242;
+
}
}
-
#projectRight {
+
#largeContent p {
-
float: left;
+
font-size:1em;
-
width: 400px;
+
color:#4a3242;
-
height: 100px;
+
margin:5px;
-
margin-left: 10px;
+
}
}
-
#projectRight img {
+
#largeContent img {
-
width: 380px;
+
width: 300px;
-
height: 250px;
+
height: 200px;
-
margin-top: 20px;
+
margin-top: 120px;
-
margin-left: 25px;
+
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;
 +
}
-
#rightSidebar {
+
#rightContent {
-
float:right;
+
float:left;
width: 200px;
width: 200px;
-
margin-right:30px;
+
height:630px;
-
margin-top:120px;
+
margin: 5px;
 +
margin-top:50px;
 +
padding:0px 10px 10px 0px;
 +
font-family:'Droid Sans', arial, sans-serif;
}
}
-
#rightSidebar h1 {
+
#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;
 +
}
-
#rightSidebar ul li {
+
 
-
margin-left:20px;
+
#tweetDate {
 +
margin-left:5px;
margin-top:5px;
margin-top:5px;
margin-bottom:10px;
margin-bottom:10px;
-
color: #897896;
+
color: #4a3242;
-
font-size:1.4em;
+
font-size:1.0em;
-
list-style-type: circle;
+
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;
}
}
-
#rightSidebar li a {
+
#rightContent li a {
-
color: #897896;
+
color: #4a3242;
text-decoration: none;
text-decoration: none;
}
}
-
#rightSidebar a:hover {
+
#rightContent a:hover {
color: #4a3242;
color: #4a3242;
 +
text-decoration:underline;
}
}
#team {
#team {
-
width: 960px;
+
width: 650px;
height: 250px;
height: 250px;
float: left;
float: left;
-
margin: 30px;
+
margin: 5px;
margin-top: 5px;
margin-top: 5px;
background: white;
background: white;
color: black;
color: black;
-
-moz-border-radius-bottomleft: 20px 20px;
+
-moz-border-radius-bottomleft: 10px 10px;
-
-moz-border-radius-topright: 20px 20px;
+
-moz-border-radius-topright: 10px 10px;
}
}
#teamLeft {
#teamLeft {
float: left;
float: left;
-
width: 600px;
+
width: 670px;
height: 100px;
height: 100px;
margin-right: 10px;
margin-right: 10px;
}
}
-
#teamRight {
+
#teamLeft h1 {
-
float: left;
+
margin-top: 10px;
-
width: 300px;
+
font-size: 2.2em;
-
height: 100px;
+
-
margin-left: 10px;
+
-
}
+
-
 
+
-
#teamRight img {
+
-
width: 200px;
+
-
height: 200px;
+
-
margin-top: 5px;
+
-
margin-left: 25px;
+
-
}
+
-
 
+
-
 
+
-
#team h1 {
+
-
margin-left: 5px;
+
-
margin-top: 5px;
+
-
font-size: 2em;
+
color:#896478;
color:#896478;
}
}
-
#team h2 {
+
#teamleft h2 {
-
font-size: 1.4em;
+
font-size: 1.0em;
color: #895a6e;
color: #895a6e;
-
margin-left: 10px;
 
}
}
 +
#teamLeft p {
#teamLeft p {
-
margin-left: 10px;
 
margin-top: 5px;
margin-top: 5px;
-
font-size: 1em;
+
font-size: 1.2em;
color:#4a3242;
color:#4a3242;
 +
text-align:justify;
}
}
-
#lasttweet {
+
#team span img{
-
margin-left:5px;
+
position:absolute;
-
margin-top:5px;
+
-
margin-bottom:10px;
+
-
color: #897896;
+
-
font-size:1.2em;
+
-
}
+
-
 
+
-
#tweetDate {
+
-
margin-left:5px;
+
-
margin-top:5px;
+
-
margin-bottom:10px;
+
-
color: #897896;
+
-
font-size:1.0em;
+
-
font-style:italic;
+
}
}

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; }

  1. header {

height:100px;

}


  1. footer {

position:relative; width:940px; margin:0 auto; }

  1. 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 */

  1. navi {

width: 960px; margin: 0 auto; font-size: 1.2em; font-family:'Droid Sans', arial, sans-serif; }

  1. navi ul li {

float: left; list-style-type: none; min-width: 120px; height: 40px; }

  1. navi li a { 
   color:#FFFFFF;

text-decoration: none; display: block; padding: 0px 10px; }

  1. navi li a:hover {

text-decoration:underline; }

  1. navi .current {

height: 56px; 

   text-decoration:underline;

}

  1. navi .current a {

color: #FFFFFF; }

  1. 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); }

  1. largeImage {

width: 1100px; height: 200px; float: left; margin-top: 5px; margin-left:145px; }

  1. 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;

}


  1. largeContent {

float:left; width: 680px;

margin: 5px; margin-top:50px; border-right:1px solid #1C100F; padding:0px 10px 10px 0px; }

  1. largeContent h1 {

font-size:1.7em; color:#4a3242; margin-left:5px; }

  1. largeContent p {

font-size:1em; color:#4a3242; margin:5px; }

  1. largeContent img {

width: 300px; height: 200px; margin-top: 120px; margin: 5px; }

  1. project {

width: 960px; height: 650px; float: left; margin: 145px; margin-top: 5px; -moz-border-radius-bottomleft: 20px 20px; -moz-border-radius-topright: 20px 20px; }

  1. rightContent {

float:left; width: 200px; height:630px; margin: 5px; margin-top:50px; padding:0px 10px 10px 0px; font-family:'Droid Sans', arial, sans-serif; }

  1. rightContent h1 {

font-size:1.7em; color:#4a3242; margin-left:5px; }

  1. rightContent p {

font-size:1em; color:#4a3242; margin:5px; }

  1. title h1 {

font-size: 3.8em; color: #4a3242; }

  1. title h2 {

font-size: 1.6em; color: #895a6e; }

  1. title a {

text-decoration: none; color: white; padding: 0; }

  1. title a:hover {

color: black; }

  1. title a img {

width: 32px; height: 32px; }

  1. title a:first-of-type {

margin-left: 5px; }

  1. lasttweet {

margin-left:5px; margin-top:5px; margin-bottom:10px; color: #4a3242; font-size:1em; }

  1. lasttweet img{ 
width:40px ;
height:29px;
}


  1. tweetDate {

margin-left:5px; margin-top:5px; margin-bottom:10px; color: #4a3242; font-size:1.0em; font-style:italic; }

  1. 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;

}

  1. rightContent li a {

color: #4a3242; text-decoration: none; }

  1. rightContent a:hover {

color: #4a3242; text-decoration:underline; }

  1. 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; }

  1. teamLeft {

float: left; width: 670px; height: 100px; margin-right: 10px; }

  1. teamLeft h1 {

margin-top: 10px; font-size: 2.2em; color:#896478; }

  1. teamleft h2 {

font-size: 1.0em; color: #895a6e; }


  1. teamLeft p {

margin-top: 5px; font-size: 1.2em; color:#4a3242; text-align:justify; }

  1. team span img{

position:absolute; }

Retrieved from "http://2011.igem.org/Team:Dundee/global.css"