Team:Alberta/base.css
From 2010.igem.org
(17 intermediate revisions not shown) | |||
Line 3: | Line 3: | ||
.firstHeading {display:none;} | .firstHeading {display:none;} | ||
+ | /*The calendars should be centred and no wider than % of the page*/ | ||
+ | |||
+ | #months{ | ||
+ | background-color: red; | ||
+ | |||
+ | width: 50%; | ||
+ | text-align:centre; | ||
+ | |||
+ | } | ||
+ | |||
+ | /* Hopefully will allow images to link to timeline */ | ||
+ | |||
+ | .imagelink_May a{ | ||
+ | width:100px; | ||
+ | height: 100px; | ||
+ | display: block; | ||
+ | text-decoration:none; | ||
+ | background-image: url("https://2010.igem.org/Image:May.JPG") | ||
+ | } | ||
/* styling for btn that pulls down igem menu */ | /* styling for btn that pulls down igem menu */ | ||
Line 12: | Line 31: | ||
top:20px; | top:20px; | ||
} | } | ||
+ | |||
+ | /********** main page styling (might need to move this */ | ||
+ | |||
+ | #logo img { | ||
+ | width:50px; | ||
+ | height:50px; | ||
+ | padding:5px; | ||
+ | float:left; | ||
+ | } | ||
+ | |||
+ | #logo { | ||
+ | background: #ffffff; | ||
+ | float: left; | ||
+ | padding: 0em; | ||
+ | font-size: 41px; | ||
+ | color: #757575; | ||
+ | height: 50px; | ||
+ | line-height:50px; | ||
+ | margin-bottom:5px; | ||
+ | } | ||
+ | |||
+ | /* tabs on home page */ | ||
+ | div.info-tab { | ||
+ | align:left; | ||
+ | } | ||
+ | |||
+ | |||
+ | /************ end of main page styling */ | ||
+ | |||
+ | /* This sets the inner and outer colours of the page. */ | ||
+ | body | ||
+ | { | ||
+ | background-color: #252525; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | border: 0px; | ||
+ | font-family:"Trebuchet MS", arial; | ||
+ | } | ||
+ | |||
+ | #container | ||
+ | { | ||
+ | width: 100%; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | } | ||
+ | |||
+ | #header | ||
+ | { | ||
+ | width: 100%; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | #navbar | ||
+ | { | ||
+ | background: #ffffff; | ||
+ | width:65.5%; | ||
+ | float: right; | ||
+ | padding: 0em; | ||
+ | text-align:right; | ||
+ | font-size: 1em; | ||
+ | color: #a5a5a5; | ||
+ | margin-right:2.5%; | ||
+ | vertical-align: middle; | ||
+ | height: 2.5em; | ||
+ | display: inline; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | #navbar a, #navbar a:active, #navbar a:hover { | ||
+ | text-decoration: none; font-size: 1em;} | ||
+ | #navbar a:link {color: #757575;} | ||
+ | #navbar a:visited {color: #656565;} | ||
+ | |||
+ | #navbar a.selected {text-decoration:underline;} | ||
+ | |||
+ | |||
+ | #highlight | ||
+ | { | ||
+ | background: #fff200; | ||
+ | width:100%; | ||
+ | clear: both; | ||
+ | padding: 0em; | ||
+ | height: 3px; | ||
+ | } | ||
+ | |||
+ | #sidebar | ||
+ | { | ||
+ | width:18em; | ||
+ | float: left; | ||
+ | padding: 2em; | ||
+ | font-size: 1em; | ||
+ | margin: 0em; | ||
+ | height: 12.93em; | ||
+ | height: expression ('18.9em'); | ||
+ | background: #3b3b3b; | ||
+ | color: #bfbfbf; | ||
+ | border: 0; | ||
+ | display: inline; | ||
+ | } | ||
+ | |||
+ | #RandomImageLong | ||
+ | { | ||
+ | width: 52.981em; | ||
+ | /* any IE */ | ||
+ | width: expression('52.981em'); | ||
+ | float: left; | ||
+ | padding: 0em; | ||
+ | margin: 0em; | ||
+ | height: 16.9em; | ||
+ | height: expression ('18.9em'); | ||
+ | position: relative; | ||
+ | background-position: 0% 0%; | ||
+ | border: 0em; | ||
+ | } | ||
+ | |||
+ | #crest | ||
+ | { | ||
+ | background:url(https://static.igem.org/mediawiki/2010/8/82/Alberta_Crest.png) repeat-x scroll 0 0; | ||
+ | height:215px; | ||
+ | float: right; | ||
+ | overflow:hidden; | ||
+ | width:190px; | ||
+ | position:absolute; | ||
+ | top:8.7em; | ||
+ | right:2.1em; | ||
+ | } | ||
+ | |||
+ | |||
+ | p.link | ||
+ | { | ||
+ | colour: #fff200; | ||
+ | background-color: #3b3b3b; | ||
+ | font-size: 1.5em; | ||
+ | font-family: "Trebuchet MS", Times; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .llink1 A:link {text-decoration: none; color: #fff200; font-size: 1.5em;} | ||
+ | .llink1 A:visited {text-decoration: none; color: #fff200; font-size: 1.5em;} | ||
+ | .llink1 A:hover {text-decoration: none; font-size: 1.5em;} | ||
+ | .llink1 A:active {text-decoration: none; font-size: 1.5em;} | ||
+ | |||
+ | #highlightb | ||
+ | { | ||
+ | background: #ffffff; | ||
+ | width:100%; | ||
+ | clear: both; | ||
+ | padding: 0em; | ||
+ | height: 3px; | ||
+ | } | ||
+ | |||
+ | #top | ||
+ | { | ||
+ | background: #ffffff; | ||
+ | width: 100%; | ||
+ | clear: both; | ||
+ | padding: 0em; | ||
+ | height: 100%; | ||
+ | font-family: "Trebuchet MS", Times; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | #bottom | ||
+ | { | ||
+ | width: 100%; | ||
+ | padding: 0em; | ||
+ | /* height: 12.625em; */ | ||
+ | height: 10em; | ||
+ | background: #3b3b3b; | ||
+ | border: 0; | ||
+ | } | ||
+ | |||
+ | #bottomleft | ||
+ | { | ||
+ | width:33em; | ||
+ | float: left; | ||
+ | margin: 1em; | ||
+ | padding: 1em; | ||
+ | font-size: 1em; | ||
+ | /* height: 12.625em; */ | ||
+ | height: 6.93em; | ||
+ | background: #3b3b3b; | ||
+ | color: #bfbfbf; | ||
+ | border-right: 2.5px dotted #a5a5a5; | ||
+ | font-family: "Trebuchet MS", Times; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | #bottomright | ||
+ | { | ||
+ | width:33em; | ||
+ | float: left; | ||
+ | margin: 1em; | ||
+ | padding: 1em; | ||
+ | font-size: 1em; | ||
+ | /* height: 12.625em; */ | ||
+ | height: 6.93em; | ||
+ | background: #3b3b3b; | ||
+ | color: #bfbfbf; | ||
+ | border-left: 2.5px dotted #a5a5a5; | ||
+ | font-family: "Trebuchet MS", Times; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | #footer | ||
+ | { | ||
+ | clear: both; | ||
+ | margin: 0; | ||
+ | padding: .5em; | ||
+ | color: #333333; | ||
+ | background-color: #dddddd; | ||
+ | border-top: 3px solid #333333; | ||
+ | } | ||
+ | |||
+ | .llink3 A:link {text-decoration: underline; color: #757575; font-size: 1em;} | ||
+ | .llink3 A:visited {text-decoration: none; color: #656565; font-size: 1em;} | ||
+ | .llink3 A:hover {text-decoration: none; font-size: 1em;} | ||
+ | .llink3 A:active {text-decoration: none; font-size: 1em;} | ||
+ | |||
+ | .h1 { text-decoration: none; color: #6a7a69; font-size: 2em;} | ||
+ | .h2 { text-decoration: none; color: #fff200; font-size: 1.5em;} | ||
+ | .h3 { text-decoration: none; color: #f0ec72; font-size: 1em} | ||
+ | .h4 { margin-top: 8em; margin-bottom: 3em; color: #fff200; font-size: 2em;} | ||
+ | .h5 { margin-top: 8em; margin-bottom: 3em; color: #fff200; font-size: 2em;} | ||
+ | |||
+ | /*hiding toggle content on initial load*/ | ||
+ | div.hideme { display: none } |
Latest revision as of 03:49, 19 October 2010
/* this file contains css to be included everywhere */
.firstHeading {display:none;}
/*The calendars should be centred and no wider than % of the page*/
- months{
background-color: red;
width: 50%; text-align:centre;
}
/* Hopefully will allow images to link to timeline */
.imagelink_May a{
width:100px; height: 100px; display: block; text-decoration:none; background-image: url("https://2010.igem.org/Image:May.JPG")
}
/* styling for btn that pulls down igem menu */
- show-toolbar-btn {
background-color:#CCCCCC; left:40px; padding:3px; position:absolute; top:20px;
}
/********** main page styling (might need to move this */
- logo img {
width:50px; height:50px; padding:5px; float:left; }
- logo {
background: #ffffff; float: left; padding: 0em; font-size: 41px; color: #757575; height: 50px; line-height:50px; margin-bottom:5px;
}
/* tabs on home page */ div.info-tab { align:left; }
/************ end of main page styling */
/* This sets the inner and outer colours of the page. */ body {
background-color: #252525; margin: 0px; padding: 0px; border: 0px; font-family:"Trebuchet MS", arial;
}
- container
{
width: 100%; margin: 0px; padding: 0px;
}
- header
{
width: 100%; margin: 0px; padding: 0px;
}
- navbar
{
background: #ffffff; width:65.5%; float: right; padding: 0em; text-align:right; font-size: 1em; color: #a5a5a5; margin-right:2.5%; vertical-align: middle; height: 2.5em; display: inline;
}
- navbar a, #navbar a:active, #navbar a:hover {
text-decoration: none; font-size: 1em;}
- navbar a:link {color: #757575;}
- navbar a:visited {color: #656565;}
- navbar a.selected {text-decoration:underline;}
- highlight
{
background: #fff200; width:100%; clear: both; padding: 0em; height: 3px;
}
- sidebar
{
width:18em; float: left; padding: 2em; font-size: 1em; margin: 0em; height: 12.93em; height: expression ('18.9em'); background: #3b3b3b; color: #bfbfbf; border: 0; display: inline;
}
- RandomImageLong
{
width: 52.981em; /* any IE */ width: expression('52.981em'); float: left; padding: 0em; margin: 0em; height: 16.9em; height: expression ('18.9em'); position: relative; background-position: 0% 0%; border: 0em;
}
- crest
{
background:url() repeat-x scroll 0 0; height:215px; float: right; overflow:hidden; width:190px; position:absolute; top:8.7em; right:2.1em;
}
p.link
{
colour: #fff200; background-color: #3b3b3b; font-size: 1.5em; font-family: "Trebuchet MS", Times; text-decoration: none;
}
.llink1 A:link {text-decoration: none; color: #fff200; font-size: 1.5em;} .llink1 A:visited {text-decoration: none; color: #fff200; font-size: 1.5em;} .llink1 A:hover {text-decoration: none; font-size: 1.5em;} .llink1 A:active {text-decoration: none; font-size: 1.5em;}
- highlightb
{
background: #ffffff; width:100%; clear: both; padding: 0em; height: 3px;
}
- top
{
background: #ffffff; width: 100%; clear: both; padding: 0em; height: 100%; font-family: "Trebuchet MS", Times; text-align: left;
}
- bottom
{
width: 100%; padding: 0em;
/* height: 12.625em; */
height: 10em; background: #3b3b3b; border: 0;
}
- bottomleft
{
width:33em; float: left; margin: 1em; padding: 1em; font-size: 1em;
/* height: 12.625em; */
height: 6.93em; background: #3b3b3b; color: #bfbfbf; border-right: 2.5px dotted #a5a5a5; font-family: "Trebuchet MS", Times; text-align: left;
}
- bottomright
{
width:33em; float: left; margin: 1em; padding: 1em; font-size: 1em;
/* height: 12.625em; */
height: 6.93em; background: #3b3b3b; color: #bfbfbf; border-left: 2.5px dotted #a5a5a5; font-family: "Trebuchet MS", Times; text-align: left;
}
- footer
{
clear: both; margin: 0; padding: .5em; color: #333333; background-color: #dddddd; border-top: 3px solid #333333;
}
.llink3 A:link {text-decoration: underline; color: #757575; font-size: 1em;} .llink3 A:visited {text-decoration: none; color: #656565; font-size: 1em;} .llink3 A:hover {text-decoration: none; font-size: 1em;} .llink3 A:active {text-decoration: none; font-size: 1em;}
.h1 { text-decoration: none; color: #6a7a69; font-size: 2em;} .h2 { text-decoration: none; color: #fff200; font-size: 1.5em;} .h3 { text-decoration: none; color: #f0ec72; font-size: 1em} .h4 { margin-top: 8em; margin-bottom: 3em; color: #fff200; font-size: 2em;} .h5 { margin-top: 8em; margin-bottom: 3em; color: #fff200; font-size: 2em;}
/*hiding toggle content on initial load*/ div.hideme { display: none }