/* Cycles of Change master stylesheet
Last updated: 2009-05-06 20:49:16
By Mario Rosero

* {margin:0; padding:0; }

body {
   font:normal 76%/1.7em Arial, Helvetica, sans-serif;
   background-color: #E8E8C9;
   color:#333300;
   margin-top: 0px;
}

/* = ---------------------------------------------------------- */
ul#menu {
  margin:0;
  border-bottom : 1px solid #ccc;
  padding: 2px 10px 19px 0px;
  list-style:none;
  }

ul#menu li {
  float:left;
  display : inline;
  margin : 0;
  padding:0 0 0 0px;
  }

ul#menu li a {
  float:left;
  background : #D3EBC0;
  border : 1px solid #ccc;
  color : #333;
  font-size : 1.1em;
  font-weight : bold;
  line-height : 14px;
  margin-right : 8px;
  padding : 2px 10px 2px 10px;
  text-decoration : none;
   }

ul#menu li a:hover {
   color: #3C791E;
   text-decoration: underline; 
   font-weight: bold; 
   }

ul#menu li a:active {
   background : #657F2B;
   border-bottom : 1px solid #fff;
   color : #333;
}

ul#menu li a:visited {
   border-bottom : 1px solid #fff;
   color : #333;
}

ul#subnav li {
   display: inline;
   position : relative;  
   left : -20px;
   top : -14px; 
   }

ul#subnav li a {
   background : #fff;
   border : none;
   border-left : 1px solid #ccc;
   color : #333;
   font-size : 0.95em;
   font-weight : bold;
   line-height : 10px;
   margin-right : 4px;
   padding : 2px 5px 2px 5px;
   text-decoration : none;
   }
   

/* MARIO: The following two rules are what control the 'you are here' styles for the #menu and #subnav lists. It is a class applied to the A element within the LI item of the the UL lists. It is confusing because there is also a link attribute called active as in A:ACTIVE, which is not the same thing! */
ul#menu li a.activemenu {background:#C6EB74; color:#000;}
ul#subnav li a.activesubnav {background:#C6EB74; color:#000;} 
ul#subnav li.activesubnav a {background:#C6EB74; color:#000;} /* Same as the one directly above, but necessary to assign class to LI rather than A to work around the navigation!! */


ul#subnav li a:hover {
   color: #3C791E;
   text-decoration: underline; 
   font-weight: bold; 
   }

ul#subnav li a:active {
	border-bottom : 1px solid #fff;
	color : #B90100;
}

ul#li a:visited {
	border-bottom : 1px solid #fff;
	color : #000;
}


/* =Layout ------------------------------------------------ */

#accessibility {
   position:absolute;
   top:-10000px;
   }

#wrapper {
   margin: 0 auto;
   width: 720px;
   background:#FAFAFA;
   border: 0px solid #ccc;
   }

#header {
   color: #333;
   width: 720px;
   float: left;
   padding: 0px;
   border: 0px solid #ccc;
   height: 110px;
   margin: 0px 0px 0px 0px;
   background: #E7DBD5;
   }

#menubar {
   float: right;
   width: 548px;
   padding: 10px 0px 0px 0px;
   height: 60px;
   lower-border: 1px solid #ccc;
   margin: 0px 0px 0px 0px;
   background: #FAFAFA;  
   }

#content {
   float: left;
   color: #333;
   border-top: 0px solid #ccc;
   background: #FAFAFA;
   margin: 0px 0px 0px 0px;
   padding: 20px 10px 20px 10px;
   width: 500px;
   display: inline;
   }

#sidebar {
   color: #333;
   border: 1px solid #ccc;
   background: #D2DEAE;
   margin: 0px 0px 0px 0px;
   padding: 3px;
   height: ;
   width: 155px;
   float: left;
   }

#footer {
   width: 700px;
   clear: both;
   color: #333;
   border: 1px solid #ccc;
   background: #fff;
   margin: 0px 0px 10px 0px;
   padding: 10px;
   }

#footer p {
	text-align:center;
	font: 60% Verdana,sans-serif;
	}

/* =Logo ---- */	
h1#logo a:link, h1#logo a:visited {
	position:relative;
	top:0px;
	left:-2%;
	width:126px;
	height:74px;
        margin: 2px;
	padding: 0px 0px 0px 0px;
	display:block;
	background:url(../images/logo.gif) 
no-repeat 0 0;
	text-transform:uppercase;
	font-weight:bold;
	letter-spacing:-0.1em;
	font-size:1.3em;
	border:none;
	text-indent:-1000em;
	}


/* =Typography ------------------------------------------------ */

h1,h2, h3, h4, h5, h6 {
	font-family:Arial, Helvetica, sans-serif;
	}
h1 {
	font-weight:normal;
	text-decoration:none;
	font-size:1.2em;
        line-height:1.1em;
	margin-bottom:0.3em; 
	color:#6C3;
	letter-spacing:1px;
	}
h2 {
	font-size:1.1em;
	font-weight:normal;
	color:#6C3;
        line-height:1em;
	letter-spacing:-0.5px;
	margin-bottom:0.2em;
	}
	
h2#slogan {
	font-family:verdana, arial, helvetica, sans-serif;
	font-size:0.9em;
        font-style: oblique; 
	text-align:right;
	margin:0 0 0 120px; 
	padding:0;
	color:#390;
	letter-spacing:normal;
	}

h3 {
	font-size:1em;
	font-weight:normal;
        line-height:1.2em;
	margin-bottom:0.2em;
	letter-spacing:1px;
	color:#6C3;
	}
h4 {
	font-size:0.9em;
	font-weight:normal;
        line-height:1.1em;
	margin-top:0.4em;
	margin-bottom:0.1em;
	color:#2F8D2B;

	}
h5 {
	font-size:0.8em;
        line-height:1.1em;
	margin-top:0.4em;
	font-weight:normal;
	color:#6C3;
	}
h6 {
	font-size:0.7em;
	font-weight:normal;
	text-transform:uppercase;
	}

ul, ol {margin-left:2em;
font-family: Arial, Helvetica, sans-serif;
        font-size:0.85em;
	line-height:1.5em;
        }

dt {font-weight:bold; text-transform:uppercase;}
li, dd {margin-bottom:0.2em;
font-family: Arial, Helvetica, sans-serif;
        font-size:0.85em;
	line-height:1.5em;
        }

blockquote {
	margin-left:20px;
	margin-right:0px;
	}

h1 a:link, h1 a:visited, h2 a, h3 a, h4 a, h5 a, h6 a {
	color:#6C3; 
	text-decoration:none;
	}

a:link {
	/*color:#390;*/
	color:#390;
       text-decoration:underline;
	}
a:visited {
	/*color:#693;*/
	color:#7B9226;
       text-decoration:none;
	}

a:hover, a:active {
	text-decoration:underline;
	}

.caps {
	letter-spacing:0.1em;
	font-size:1em;
	}

#bigreen a:link {
	font-size:0.7em;
	font-weight:bold;
	color:#2F8D2B;
	}


/* =Menu Bar ------------------------------------------------ */



/* =Content  ------------------------------------------------ */
#content p {
	font-family: Arial, Helvetica, sans-serif;
        font-size:0.75em;
	line-height:1.5em;
	text-align:left;
	margin-bottom:0.7em;
	}

/* =Side Bar ------------------------------------------------ */

#sidebar h1 {
font-size: 1em;
}

#search #searchinputbox {
	position:relative;
	left:-2%;
	background: #fff;
	border: solid 1px color=#333;
	color: #333;
	font-weight: normal;
	padding: 2px;
	margin-top: 3px;
	text-align: left;
	width: 110px;
}

#calendar {
	font-weight: normal;
	font-size: 75%;
        left:-2%;
	background: #fff;
	border: solid 1px color=#333;
	color: #333;
	padding: 2px;
	margin-top: 3px;
	text-align: left;
	width: 120px;
  height: 150px;
} 

#sidebar p {
font-size: 65%; 
 line-height:1.1em;
padding-bottom: 0.7em;
}

#event-box {
background: #E3E6DB;
color: ccc;
font-weight: normal;
}

/* =Miscellaneous ------------------------------------------------ */
/* =ContactForm */

.zemContactForm fieldset {
background: #BCFF9A;
border: 1px solid #6ECC3F;
padding: 0 1em 1em;
}

.zemContactForm legend {
font-weight: bold;
}

.zemContactForm #name, .zemContactForm #email, .zemContactForm #message {
font-family: Verdana, sans-serif;
font-size: 1em;
width: 100%;
}

/* =Images */

.floatleft {
	float:left;
	margin-right:1em;
	margin-bottom:4px;
	}

.floatright {
	float:right;
	margin-left:1em;
	margin-bottom:4px;
	}

#content hr {
	color:#ccc;
	width:66%;
	margin-top:2em;
	margin-bottom:2em;
	}

img.divider {
	text-align:center;
	margin-top:2em;
	margin-bottom:2em;
	}


