/* ----- LAYOUT ----- */
/* Website's layout is always a two-column layout, with a top-vertical
* header (id=header) and a bottom-vertical footer (id=footer).
* The two-columns are encapsulated in a page division (id=page) and are
* composed of a fixed side bar (id=sidebar) and a fluid contents (id=contents).
* The entire contents (header, page and footer) is always including
* in a wrapoing division (id=wrapleft if the sidebar is on the left, or
* id=wrapright if the sidebar is on the right)
*
* Layout with left bar:
*
*
*
*
* Layout with right bar:
*
*
*
*/
html {
height:100%;
}
body {
min-width:800px;
height:100%;
margin:0;
padding:0;
}
#wrapleft, #wrapright {
min-height:100%;
margin:auto;
position:relative;
}
* html #wrapleft, * html #wrapright {
height:100%
}
#header {
margin:0;
padding:0;
height:65px;
}
#page {
padding-bottom:50px;
}
#page:after {
content:" ";
display:block;
clear:both;
}
#wrapleft #sidebar {
float:left;
width:450px;
margin:5px;
/*background:red;*/
}
#wrapleft #contents {
position:relative;
margin-left:460px;
padding:15px;
/*background:green;*/
}
#wrapright #sidebar {
float:right;
width:250px;
margin:5px;
/*background:red;*/
}
#wrapright #contents {
position:relative;
margin-right:260px;
padding:15px;
/*background:green;*/
}
#footer {
position:absolute;
bottom:0;
width:100%;
height:35px;
}
/* ----- GENERAL FORMATTING ----- */
body, select, option, form, input {
font:12px Tahoma, Verdana, Arial, Helvetica, sans-serif;
color:#675C2A;
}
p {
margin:5px;
padding:0;
}
h1, h2, h3, h4, h5, h6 {
margin:0;
padding:0;
}
h2 {
font-size:14px;
}
h3{
margin-bottom: 20px;
font-size: 18px;
font-weight: bold;
color: #0E6F0D;
letter-spacing: -1px;
}
h4{
margin-top:10px;
margin-bottom:10px;
font-size:14px;
font-weight:bold;
color:#675C2A;
border-bottom:1px solid #66CC33;
}
h5{
margin-top:10px;
font-size:12px;
font-weight:bold;
color:#0E6F0D;
}
a {
color: #675C2A;
text-decoration: underline;
}
a:visited { color:#675C2A; }
a:hover { color:#333333; text-decoration:none; }
a img {
text-decoration: none;
border:none;
}
/* ----- FORMS FORMATTING ----- */
input, select, textarea {
width: 350px;
}
.button, .radio { width:auto; }
.full { width:100%; }
fieldset {
margin-top: 20px;
padding: 15px;
}
legend {
font-size: 14pt;
padding-left: 5px;
padding-right:5px
}
.formRow1, .formRow2 {margin:3px; padding:7px;}
.formRow1 {background:#F3F3F3;}
.formRow2 {background:#fcfcfc;}
#errormsg {
margin: 5px;
padding:5px;
background: #FF4E4E;
color: white;
border: 1px solid grey;
}
#infomsg {
margin: 5px;
padding: 5px;
background: #B9DAFF;
border: 1px solid grey;
}
/* ----- HEADER FORMATTING ----- */
#header {
background:url(images/page-bgrd.gif) repeat-x;
}
#header #logo {
float:left;
background-image:url(images/cgmLogo.gif);
background-repeat: no-repeat;
height:60px;
width:205px;
text-indent:-9999px;
display:block;
}
#header #logo a {
display:block;
height:60px;
width:200px;
}
#header #tagline {
float: left;
margin-top: 7px;
margin-left: 7px;
padding: 0;
color: #ffffff;
}
#header #tagline h2 {
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 1em;
}
/* ----- PAGE CONTENTS FORMATTING ----- */
#page {
background:#ffffff url(./images/subnavBgrd.gif) top repeat-x;
}
/* ----- SIDE BAR ----- */
#frame {
margin-top: 5px;
margin-bottom: 15px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 10px;
border-left: 1px solid #494949;
border-bottom: 1px solid #494949;
border-right: 1px solid #494949;
}
#displayingDetails {
margin:10px 0 0 0;
color:#999999;
font-size:11px;
}
#frameAddToMap {
display:block;
height: 73px;
width: 250px;
margin-top: 35px;
padding-top: 21px;
background-image: url(images/buttonSuggestSite.gif);
background-repeat: no-repeat;
background-position: top left;
font-family: Georgia;
font-weight: bold;
}
#frameAddToMap a span {
font-size:12px;
}
#frameAddToMap a {
color:#ffffff;
text-decoration:none;
font-size:16px;
margin-left:25px;
}
#frameAddToMap a:hover {
text-decoration:underline;
}
#frameTcft {
display:block;
height: 81px;
width: 250px;
margin-top: 15px;
padding-top: 17px;
background-image: url(images/buttonTCFT.gif);
background-repeat: no-repeat;
background-position: top left;
font-family: Georgia;
font-weight: bold;
text-align: left;
}
#frameTcft a span {
font-size:11px;
}
#frameTcft a {
color: #ffffff;
text-decoration:none;
font-size: 16px;
margin-left: 25px;
}
#frameTcft a:hover {
text-decoration:underline;
}
/* ----- FOOTER FORMATTING ----- */
#footer {
background-color:#ffffff;
padding-top:5px;
font-size:10px;
border-top:1px solid #006321;
}
#footer #left {
float:left;
width:450px;
margin-left:5px;
/*background: red;*/
}
#footer #right {
display:block;
margin-left:460px;
padding-left: 15px;
padding-right: 15px;
/*background: green;*/
}
/* ----- NAVIGATION AND LISTS ----- */
ul, ul li {
margin: 0;
padding: 0;
}
#navigation {
position: absolute;
margin-top: 0;
padding: 0;
right: 0;
}
#subnavigation {
position: absolute;
right: 0;
padding-top: 6px;
padding-bottom: 12px;
padding-left: 15px;
margin-top: 33px;
}
#navigation ul, #subnavigation ul, #footer ul {
margin: 0;
padding: 0;
}
#navigation ul li, #subnavigation ul li, #footer ul li {
list-style-type:none;
float:left;
margin-right:20px;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
}
#navigation ul li {
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 1.2em;
display:block;
}
#navigation ul li a, #navigation ul li a:visited, #navigation ul li a:active {
color:#ffffff;
text-decoration:none;
display:block;
}
#navigation ul li a:hover {
text-decoration:underline;
}
#subnavigation ul li a, #subnavigation ul li a:visited, #subnavigation ul li a:active {
color:#675C2A;
text-decoration:none;
font-weight:lighter;
}
#subnavigation ul li a:hover {
text-decoration:underline;
}
#navigation .off {
padding-bottom:8px;
padding-top:5px;
display:block;
}
#navigation .on {
padding-bottom:8px;
padding-left:7px;
padding-right:7px;
padding-top:5px;
background-image:url(images/tabOn.gif);
background-repeat:repeat-x;
background-position:bottom left;
display:block;
}
#subnavigation .off {}
#subnavigation .on {
font-weight: bolder;
padding-bottom: 6px;
border-bottom: 5px solid #006321;
display: block;
}
#frame ul li {
margin: 0px;
padding: 3px;
padding-left: 20px;
list-style-type: none;
background: url(images/frameNav.gif) no-repeat 0 3px;
}
#frame ul li:hover {
background: #efefef url(images/frameNavOn.gif) no-repeat 0 3px;
}
#frame ul li.on, #frame ul li.ogmSelected, #frame ul li.current-cat {
padding-bottom: 3px;
padding-top: 2px;
background: #efefef url(images/frameNavOn.gif) no-repeat 0 3px;
}
#frame ul li a {
text-decoration: none;
}
#frame ul li a:hover {
text-decoration: underline;
}
#contents ul {
margin: 10px;
}
#contents li {
margin-left: 20px;
padding: 3px;
}
/* ----- HOME PAGE ----- */
#iconStrip ul {
margin-top:15px;
margin-bottom:25px;
padding:0;
}
#iconStrip ul li {
text-indent:-999px;
list-style-type:none;
background-image:url(images/iconStrip.gif);
background-repeat:no-repeat;
height:56px;
width:449px;
}
#homeWelcome {
display:block;
}
#homeWelcome p {
line-height:1.5em;
}
#homeWelcome h3 {
margin-left:0;
}
#homeAddToMap {
display:block;
background-image: url(images/addToCGM.gif);
background-repeat: no-repeat;
background-position: top left;
padding-top:21px;
font-family:Georgia;
font-weight:bold;
height:73px;
width:316px;
margin-top:15px;
}
#homeAddToMap a span {
font-size:12px;
}
#homeAddToMap a {
color:#ffffff;
text-decoration:none;
font-size:16px;
margin-left:25px;
}
#homeAddToMap a:hover {
text-decoration:underline;
}
#homeNews {
clear:right;
display:block;
}
#homeNews p {
font-size:11px;
line-height:1.4em;
}
#homeNewsBody {
margin-bottom:3px;
padding:6px;
background:#E6F3F9;
}
#homeNewsBody p {
}
#homeNewsBody h5 {
margin:3px;
}
#homeNewsAuthor {
color:#675C2A;
font-weight:normal;
font-size:95%;
margin:3px;
}
#homeNewsDate {
color:#675C2A;
font-weight:normal;
font-size:90%;
margin:3px;
}
#homeMembers {
}
#homeMembers p {
}
#homeMembersBody {
display:inline;
float:left;
margin-right:10px;
margin-bottom:10px;
}
#homeMembersBody a {
font-size:10px;
text-decoration:none;
}
/* ----- MAP CONTAINER ----- */
#mapContainer {
width:438px;
height:413px;
margin-top:15px;
margin-left:6px; /* (450 - 438) / 2 */
}
#mapTop {
background-image:url(images/mapTop.gif);
background-repeat: no-repeat;
background-position: bottom;
height:5px;
width:436px;
}
#mapBody {
width:435px;
height:413px;
border-left:1px solid black;
border-right:1px solid black;
margin:0;
padding:0;
}
#mapTools {
height: 25px;
margin-bottom:5px;
}
#mapTools a {
float: right;
height: 25px;
width: 149px;
padding-left: 10px;
padding-top: 5px;
background-image: url(images/viewfullsizeMap.gif);
background-repeat: no-repeat;
display: block;
font: 12px Tahoma;
font-weight: bold;
color: #675C2A;
text-decoration: none;
}
#mapTools a:hover {
text-decoration:underline;
}
#mapStats {
float:left;
margin:0 0 0 5px;
font-size:11px;
}
#mapLastUpdate {
float:right;
margin:0 5px 0 0;
color:#999999;
font-size:11px;
}
#mapBottom {
background-image:url(images/mapBottom.gif);
background-repeat: no-repeat;
height:5px;
width:436px;
}
/* ----- COMMENTS ------ */
#comments ol, #comments ul {
margin: 0;
padding: 0;
color: #675C2A;
font-size: 95%;
}
#comments li {
margin: 0;
margin-bottom: 3px;
padding: 3px;
background: #E6F3F9;
list-style: none;
}
/* ----- CLASSES ----- */
.leftSizeMap, .fullSizeMap, .locatorSizeMap {
border: 1px solid #006321;
}
.leftSizeMap {
width:422px;
height:360px;
margin:5px;
}
.fullSizeMap {
width:100%;
height:480px;
}
.locatorSizeMap {
width: 100%;
height: 400px;
}
.formMandatory {
color:red;
}
.hide {
display:none;
}
.ogmIconCount {
font:10px Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-style: italic;
}
.captionText {
width: 250px;
}
.details {
margin-top: 10px;
padding: 3px;
border: 1px solid #F0F0F0; background:#CCFFCC;
}
.edit {
margin-top: 10px;
padding: 3px;
border: 1px solid #F0F0F0; background:#CCFFCC;
}