Team:Groningen/CSS/DefaultPage
From 2013.igem.org
(209 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
+ | /*FONT LAYOUT*/ | ||
+ | |||
+ | h1{ | ||
+ | color:#002355; | ||
+ | text-align:center; | ||
+ | font-weight:bold; | ||
+ | font-size:35px; | ||
+ | |||
+ | border-bottom: 1px solid #0047AB; | ||
+ | } | ||
+ | |||
+ | h2{ | ||
+ | color:#002355; | ||
+ | border-bottom: 0px solid #aaa; | ||
+ | text-align:left; | ||
+ | font-weight:bold; | ||
+ | font-size:25px; | ||
+ | |||
+ | } | ||
+ | |||
+ | h3{ | ||
+ | color:#0047AB; | ||
+ | text-align:left; | ||
+ | font-weight:bold; | ||
+ | font-size:20px; | ||
+ | |||
+ | } | ||
+ | |||
+ | h4{ | ||
+ | color:#0047AB; | ||
+ | text-align:left; | ||
+ | |||
+ | font-size:18px; | ||
+ | } | ||
+ | |||
+ | h5{ | ||
+ | |||
+ | font-size:15px; | ||
+ | } | ||
+ | |||
+ | h2#special{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | h3#special{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | h4#special{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | h5#special{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | b{ | ||
+ | color:#002355; | ||
+ | } | ||
+ | |||
+ | h1#protocol{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | h2#protocol{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | h3#protocol{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | h4#protocol{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | h5#protocol{ | ||
+ | text-transform:none; | ||
+ | } | ||
+ | |||
+ | |||
+ | p{ | ||
+ | text-align:left; | ||
+ | font-family:"Verdana"; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Table layout*/ | ||
+ | |||
+ | table{ | ||
+ | background-color:transparent; | ||
+ | } | ||
+ | |||
+ | table#normal{ | ||
+ | border-collapse:collapse; | ||
+ | table-layout: fixed; | ||
+ | background: white; | ||
+ | } | ||
+ | |||
+ | |||
+ | table#normal th{ | ||
+ | background-color:#0047AB; | ||
+ | color:white; | ||
+ | |||
+ | overflow: hidden; | ||
+ | text-align:center; | ||
+ | border: 2px solid #002355; | ||
+ | } | ||
+ | |||
+ | table#normal td{ | ||
+ | overflow: hidden; | ||
+ | padding:4px; | ||
+ | text-align:center; | ||
+ | border: 2px solid #002355; | ||
+ | } | ||
+ | |||
+ | table#Frontpage{ | ||
+ | border: none; | ||
+ | background: transparent; | ||
+ | } | ||
+ | table#Frontpage td{ | ||
+ | border: none; | ||
+ | text-align:left; | ||
+ | } | ||
+ | |||
+ | table#layout{ | ||
+ | border: none; | ||
+ | table-layout: auto; | ||
+ | border-collapse:collapse; | ||
+ | table-layout: fixed; | ||
+ | background: white; | ||
+ | } | ||
+ | |||
+ | table#layout td{ | ||
+ | border: none; | ||
+ | overflow: visible; | ||
+ | width: auto; | ||
+ | text-align:left; | ||
+ | border-top: 2px solid #e5e5e5; | ||
+ | } | ||
+ | |||
+ | table#layout th{ | ||
+ | background-color:#fff; | ||
+ | border: none; | ||
+ | overflow: visible; | ||
+ | } | ||
+ | |||
+ | |||
+ | table#sponsors{ | ||
+ | border-collapse:collapse; | ||
+ | table-layout: fixed; | ||
+ | background: white; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | table-layout: fixed; | ||
+ | width:90%; | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | table#sponsors th{ | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | table#sponsors td{ | ||
+ | border: none; | ||
+ | vertical-align:middle; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | /*IMAGE LAYOUT */ | ||
+ | |||
+ | /* images of sponsors in the footer */ | ||
+ | |||
+ | img#sponsors{ | ||
+ | opacity:0.7; | ||
+ | } | ||
+ | img#sponsors:hover{ | ||
+ | opacity:1; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* unvisited link */ | ||
+ | a:link { | ||
+ | color:#0047AB; | ||
+ | } | ||
+ | |||
+ | /* visited link */ | ||
+ | a:visited { | ||
+ | color:#F68924; | ||
+ | } | ||
+ | |||
+ | /* unvisited link */ | ||
+ | a#special:link { | ||
+ | color:#0047AB; !important | ||
+ | } | ||
+ | |||
+ | /* visited link */ | ||
+ | a#special:visited { | ||
+ | color:#F68924; !important | ||
+ | } | ||
+ | |||
+ | /*PAGE LAYOUT*/ | ||
+ | |||
/*Splitting into two columns*/ | /*Splitting into two columns*/ | ||
#header { | #header { | ||
+ | position: abolute; | ||
+ | top: 0px; | ||
+ | left: 0px; | ||
clear:both; | clear:both; | ||
float:left; | float:left; | ||
width:100%; | width:100%; | ||
min-width: 700px; | min-width: 700px; | ||
+ | background:#e5e5e5; | ||
} | } | ||
Line 14: | Line 221: | ||
border-top:1px solid #000; | border-top:1px solid #000; | ||
min-width: 700px; | min-width: 700px; | ||
+ | background:#e5e5e5; | ||
} | } | ||
Line 44: | Line 252: | ||
.mainContent{ | .mainContent{ | ||
position:relative; | position:relative; | ||
- | + | padding:0 0 1em 0; /* no left and right padding on columns, we just make them narrower instead | |
only padding top and bottom is included here, make it whatever value you need */ | only padding top and bottom is included here, make it whatever value you need */ | ||
overflow:hidden; | overflow:hidden; | ||
Line 65: | Line 273: | ||
/* 3 Column settings */ | /* 3 Column settings */ | ||
.threecol { | .threecol { | ||
- | background:# | + | background: #e5e5e5; /* right column background colour */ |
} | } | ||
.threecol .colmid { | .threecol .colmid { | ||
Line 76: | Line 284: | ||
/* width:46%; width of center column content (column width minus padding on either side) */ | /* width:46%; width of center column content (column width minus padding on either side) */ | ||
/* left:0.5%; 100% plus left padding of center column */ | /* left:0.5%; 100% plus left padding of center column */ | ||
- | + | background: #e5e5e5; | |
+ | margin-right:205px; | ||
} | } | ||
.threecol .navigation { | .threecol .navigation { | ||
- | width: | + | width:168px; /* Width of left column content (column width minus padding on either side) */ |
/* left:0.5%; width of (right column) plus (center column left and right padding) plus (left column left padding) */ | /* left:0.5%; width of (right column) plus (center column left and right padding) plus (left column left padding) */ | ||
min-height: 600px; | min-height: 600px; | ||
Line 92: | Line 301: | ||
display: inline-block; | display: inline-block; | ||
} | } | ||
+ | |||
+ | |||
Line 117: | Line 328: | ||
# margin-left: 10px; | # margin-left: 10px; | ||
margin: 0px auto; | margin: 0px auto; | ||
- | padding: | + | padding: 7px 5px 5px 5px;; |
background: white; | background: white; | ||
color: black; | color: black; |
Latest revision as of 03:03, 5 October 2013
/*FONT LAYOUT*/
h1{ color:#002355; text-align:center; font-weight:bold; font-size:35px;
border-bottom: 1px solid #0047AB; }
h2{ color:#002355; border-bottom: 0px solid #aaa; text-align:left; font-weight:bold; font-size:25px;
}
h3{ color:#0047AB; text-align:left; font-weight:bold; font-size:20px;
}
h4{ color:#0047AB; text-align:left;
font-size:18px; }
h5{
font-size:15px; }
h2#special{ text-transform:none; }
h3#special{ text-transform:none; }
h4#special{ text-transform:none; }
h5#special{ text-transform:none; }
b{ color:#002355; }
h1#protocol{ text-transform:none; }
h2#protocol{ text-transform:none; }
h3#protocol{ text-transform:none; }
h4#protocol{ text-transform:none; }
h5#protocol{ text-transform:none; }
p{
text-align:left;
font-family:"Verdana";
}
/* Table layout*/
table{ background-color:transparent; }
table#normal{ border-collapse:collapse; table-layout: fixed; background: white; }
table#normal th{
background-color:#0047AB;
color:white;
overflow: hidden; text-align:center; border: 2px solid #002355; }
table#normal td{ overflow: hidden; padding:4px; text-align:center; border: 2px solid #002355; }
table#Frontpage{ border: none; background: transparent; } table#Frontpage td{ border: none; text-align:left; }
table#layout{ border: none; table-layout: auto; border-collapse:collapse; table-layout: fixed; background: white; }
table#layout td{ border: none; overflow: visible; width: auto; text-align:left; border-top: 2px solid #e5e5e5; }
table#layout th{ background-color:#fff; border: none; overflow: visible; }
table#sponsors{
border-collapse:collapse;
table-layout: fixed;
background: white;
margin-left: auto;
margin-right: auto;
table-layout: fixed;
width:90%;
border: none;
}
table#sponsors th{ border: none; }
table#sponsors td{ border: none; vertical-align:middle; text-align:center; }
/*IMAGE LAYOUT */
/* images of sponsors in the footer */
img#sponsors{ opacity:0.7; } img#sponsors:hover{ opacity:1; }
/* unvisited link */
a:link {
color:#0047AB;
}
/* visited link */ a:visited { color:#F68924; }
/* unvisited link */ a#special:link { color:#0047AB; !important }
/* visited link */ a#special:visited { color:#F68924; !important }
/*PAGE LAYOUT*/
/*Splitting into two columns*/
- header {
position: abolute; top: 0px; left: 0px; clear:both; float:left; width:100%; min-width: 700px; background:#e5e5e5;
}
- footer {
clear:both; width:100%; border-top:1px solid #000; min-width: 700px; background:#e5e5e5;
}
- layoutdims {
clear:both; background:#eee; border-top:4px solid #000; margin:0; padding:6px 15px !important; text-align:right; } /* column container */ .colmask { position:relative; /* This fixes the IE7 overflow hidden bug */ clear:both; float:left; width:100%; /* width of whole page */ overflow:hidden; /* This chops off any overhanging divs */
min-width: 700px;
} /* common column settings */ .colright, .colmid, .colleft { float:left; width:100%; /* width of page */ position:relative; }
.mainContent{ position:relative;
padding:0 0 1em 0; /* no left and right padding on columns, we just make them narrower instead
only padding top and bottom is included here, make it whatever value you need */ overflow:hidden; } .navigation{ float:left; position:relative; padding:0 0 1em 0; /* no left and right padding on columns, we just make them narrower instead only padding top and bottom is included here, make it whatever value you need */ overflow:hidden;
} .widgets { float:left; position:relative; padding:0 0 1em 0; /* no left and right padding on columns, we just make them narrower instead only padding top and bottom is included here, make it whatever value you need */ overflow:hidden; } /* 3 Column settings */ .threecol { background: #e5e5e5; /* right column background colour */ } .threecol .colmid { right:25%; /* width of the right column */ } .threecol .colleft { right:51%; /* width of the middle column */ } .threecol .mainContent { /* width:46%; width of center column content (column width minus padding on either side) */ /* left:0.5%; 100% plus left padding of center column */
background: #e5e5e5; margin-right:205px;
} .threecol .navigation { width:168px; /* Width of left column content (column width minus padding on either side) */ /* left:0.5%; width of (right column) plus (center column left and right padding) plus (left column left padding) */
min-height: 600px; display: inline-block;
} .threecol .widgets {
float: right;
/* Width of right column content (column width minus padding on either side) */ (100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */ background: green;
display: inline-block;
}
/*Suppress iGEM defaults from iGEM 2012 Groningen*/
a[title="Main Page"]{display: none;}
.firstHeading{display: none;}
.noprint{display: none;}
- menubar{
display: block; }
- top-section {
position: relative; height: 0px; width: 99%;
- margin-left: 10px;
margin: 0 auto 0 auto;
border-left: 1px solid #44444; border-right: 1px solid #44444; border-bottom: 1px solid #44444;
}
- content {
position: relative; width: 99%;
- margin-left: 10px;
margin: 0px auto;
padding: 7px 5px 5px 5px;; background: white; color: black; border-left: 1px solid #444444; border-right: 1px solid #444444; line-height: 1.5em; z-index: 2;
}
/* scale back up to a sane default */
- globalWrapper {
position: relative; font-size: 127%; width: 100%; margin: 0; padding: 0; padding-bottom: 10px;
}
- search-controls{display: none;}
- contentSub{display: none;}
- catlinks{display: none;}
- footer-box{display: none;}
- p-logo{display: block;}
/* Remove comments to remove links towards accounts etc */ /*#top-section { display: block; position: relative; height: 98px; width: 975px; margin: -20px auto; TODO put correct colours here! border-left: 1px solid rgb(118,28,17); border-right: 1px solid rgb(118,28,17); border-bottom: 1px solid rgb(118,28,17); }*/
<script type="text/javascript">
$(document).ready(function() { $("p").filter( function() { return $.trim($(this).html()) == ; }).remove() });
</script>