/* CSS Document for the Live Power Site */

/* Color Specifications:

	background: #A9A879
	nav-color, news background: #CC9
	selected topic: #A9A879
	content-background: #FFCC66;
	about section, topic title: #900
	about, Events background: #B34040
	apprentice section, topic title: #030
	apprentice, Reflections background: #406640
	school section, topic title: #336;
	school, Opportunities background: #66668C
	CSA section, topic title: #930
	CSA, Archives background: #B36640
	
*/

/* BODY AND BACKGROUND */

html { height: 100%; margin-bottom: 1px; } /* forces scrollbar even when not needed so page doesn't jump */

body { 
	margin: 0;
	padding: 0 10px;
	background-color: #A9A879 ;
	font-family: Arial, Helvetica, sans-serif ;
	font-size: 11px;
}

body#About {
	background-color: #B34040 ;
}

#About #nav div.selected a {
	color: #900;
}

body#Apprentice {
	background-color: #406640 ;
}

#Apprentice #nav div.selected a {
	color: #030;
}

body#School {
	background-color: #66668C ;
}

#School #nav div.selected a {
	color: #336;
}

body#CSA {
	background-color: #B36640 ;
}

#CSA #nav div.selected a {
	color: #930;
}
/* TEXT */

a {
	color: #000066;
}

a:hover {
	color: #990000;
}	

.quote {
	font-style: italic;
}

.attribution {
	text-align: right;
}

/* CONTAINER */

#container {
	height: 100%;
	margin:0px auto;
	padding: 0px 0px;
	background-color: #A9A879;
	border-right: 2px solid #222;
	border-left: 2px solid #222;
	border-bottom: 2px solid #222;
	width: 799px;
	overflow: hidden;
}

/* POP UP */

#pop_up {
	height: 100%;
	margin: 0 auto;
	padding: 17px 1px;
	background-color: #A9A879;
	width: 600px;
	overflow: hidden;
}

#pop_up #sidebar {
	width: 120px;
	background-color: #CC9;
	float: right;
	clear: right;
	margin: 3px 0px 3px 17px;
	padding: 16px;
	border: 1px solid #A9A879;
}

#sidebar h2 {
	font-size: 110%;
}

#sidebar ul {
	list-style: none;
	margin: 0;
	padding: 0;
	line-height: 150%;
}


/* COLUMNS */

.left-column {
	width: 144px;
	float: left;
	clear: left;
}

.right-column {
	width: 639px;
	float: right;
	clear: right;
}

/* HEADER */

#header { 
	height: 144px;
	margin-bottom: 17px;
	clear: both;
}

#header .right-column {
	padding-top: 22px;
	padding-left: 17px;
}

html>body #header .right-column {
	padding-top: 22px;
	padding-left: 0;
}


/* SECTION NAVIGATION */

#top-nav {
	height: 55px;
	padding: 0;
	margin: 9px 0 0;
	background: url(/img/page_elements/orange-bar.gif) no-repeat 0px 10px;
}

#top-nav div {
	margin-right: 18px;
	float: left;
}

/* MAIN */

	/* TOPIC NAVIGATION */

#main .left-column {
	background-color: #D3D2A7;
}

#About #main .left-column {
	background: url(/img/page_elements/fade_About.png) top left repeat-x #9b0706;
}

#Apprentice #main .left-column {
	background: url(/img/page_elements/fade_Apprentice.png) top left repeat-x #0B3B09;
}

#School #main .left-column {
	background: url(/img/page_elements/fade_School.png) top left repeat-x #333366;
}

#CSA #main .left-column {
	background: url(/img/page_elements/fade_CSA.png) top left repeat-x #9C3A08;
}

#nav {
	padding: 0;
	margin: 0;
	list-style-type: none;
	width: 144px;
	font-size: 12px;
}

#nav div {
	display: block;
	margin: 0 ;
}

#nav div.selected a, #nav a:hover  {
	background-color: #FFCC66;
}

#nav div a {
	display: block;
	color: black;
	font-weight: bold;
	display: block;
	padding:  13px 12px 11px;
	margin: 0;
}

#nav a, #nav a:hover, #nav a:active, #nav a:visited {
	text-decoration: none;
}

#nav .sub-topics div a {
	display: block;
	text-transform: uppercase;
	padding-left: 22px;
	font-size: 11px;
}

#nav #home_link a {
	color: #FFC;
}

#nav #home_link a:hover {
	color: black;
}

	/* CONTENT */
	
#main .right-column {
	width: 639px;
}

#content {
	background-color: #FFCC66;
	width: 587px;
	padding: 12px 17px;
}

html>body #content { /* mask this from IE */
	width: 587px;
}

#pop_up #content {
	width: 530px;
}

#content p, #content h1,  #content h2,  #content h3,  #content h4 {
	margin-top: 0;
	margin-bottom: 8px;
}

#content h1 {
	font-size: 14px;
}

#content p {
	font-size: 12px;
	line-height: 140%;
}

#About h1.topic-title {
	color: #900;
}

#Apprentice h1.topic-title {
	color: #030;
}

#School h1.topic-title {
	color: #336;
}


#CSA h1.topic-title {
	color: #930;
}


div.right-side-picture {
	position: relative;
	display: block;
	width: 271px;
	height: 233px;
	margin: 0 0 6px;
	float: right;
}

div.right-side-picture img {
	position: absolute;
	right: -35px;
	top: 5px;
}

/* Posts */

.post p, .post h1 {
	margin: 0 0 8px;
}

.post p {
	font-size: 12px;
}

.post h2 { 
	font-size: 14px;
	margin: 0;
	padding: 10px 0 2px;
}

.post .post-tag {
	font-size: 11px;
}

.post .postmetadata {
	padding-bottom: 16px;
	border-bottom: 1px solid #A9A879;
}

html>body .post .postmetadata {
	border-bottom: 1px dotted #A9A879;
}

.post-content {
	clear: left;
	padding: 8px 0 4px;
	margin: 4px 0;
	border-top:#A9A879 1px dotted;	
	border-bottom:#A9A879 1px solid;	
	font-size:12px;
}

.post-date {
	float: left;
	display: block;
	color: #333;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	text-align: center;
	font-weight: bold;
	margin: 0px 10px 9px 0;
	padding: 8px 3px;
	width: 55px;
	background: #A9A879;
	line-height:1em;
}

.post .post-info {
	margin: 2px 10px;
	display: block;
	float: left;
}

.post .post-info h2 { 
	font-size: 13.5px;
	margin: 0;
	padding: 0;
}


.post-footer {
	padding-top:20px;
	background:url(img/divider.gif) no-repeat center;
}

/* FOOTER */

#footer {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 14px;
	margin-top: 17px;
	text-align: center;
}

img.img-float-right {
	float: right;
	margin: 3px 0 3px 17px;
}

img.img-float-left {
	float: left;
	margin: 3px 17px 3px 0;
}

/* LIVE POWER MODAL DIALOGS */
/* the css declarations that use > are hidden from IE */

#modalMask, #modalContainer {
	position:absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
}

#modalMask {
	background-color: #999;
	opacity: .4;
	background-image:url(/img/page_elements/mask.png); /* required by MSIE to prevent actions on lower z-index elements */
    background-repeat: repeat;
	z-index:9999;
	/* opacity for IE is handled in the script to aviod displaying an error in the Mozilla JS console */
}

#modalContainer {
	background-color: transparent;
	z-index:10000;
}

#modalBox {
	font-family: Arial, Helvetica, sans-serif;
	position:relative;
	width:320px;
	min-height: 100px;
	margin-top: 100px;
	border: 2px solid #030;
	background-color: #FFD479;
	background-repeat: no-repeat;
	background-position: 4px 28px;
	display: none;
	padding: 0;
}

#modalContainer > #modalBox {
	position:fixed;
}

#modalBox h1 {
	width: 100%;
	font-size: 13px ;
	font-weight: bold;
	margin:0;
	background-color: #CC9;
	color: #000;
	border-bottom: 1px solid #030;
	padding: 3px 0 3px 10px;
}

#modalContainer > #modalBox h1 {
	width: auto;
}

#modalBox p {
	margin: 6px 0 4px;
	font-size: 12px ;
	padding: 0px 16px 0px 8px;
	line-height: 160%;
}

#modalBox input, #modalBox textarea { 
	border: 1px solid #999;
	font-family: monospace;
	padding: 1px;
}

#modalBox p b {
	color: #990000;
}

#modalBox input#promptField {
	width: 198px;
}

#modalBox .checkbox {
	border-width: 0;
}

#modalText {
}

#modalBox .textbuttonright {
	display: block;
	margin-right: 12px;
	margin-bottom: 8px;
}


@media print {
  #modalBox, #modalContainer, #modalMask, .textbuttonright, .textbuttonleft, .textbutton, #return_link, .paging_controls {
  	display: none !important; 
  }
}


/* BUTTONS */
div.textbuttonleft, div.textbuttonright {
	border: black 1px solid;
	margin: 3px 2px 2px;
}

div.textbuttonleft {
	margin-left: 3px;
	float: left;
}

div.textbuttonright {
	margin-right: 3px;
	float: right;
}

div.textbuttonright a, div.textbuttonleft a, div.textbuttonright a:visited, div.textbuttonleft a:visited {
	display: block;
	background-color: #A9A879; 
	border: #ccc 1px solid; 
	padding: 2px 7px 2px 6px; 
	font-family: arial, helvetica, sans-serif; 
	font-weight: bold; 
	font-size: 11px; 
	color: white; 
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
}

div.textbuttonright a.small, div.textbuttonleft a.small, div.textbuttonright a.small:visited, div.textbuttonleft a.small:visited {
	padding: 1px 4px 2px 3px; 
	font-size: 10px; 
	text-transform: none;
	font-variant: normal;
}

div.textbuttonright a:hover, div.textbuttonleft a:hover, span.textbutton a:hover, div.textbuttonright a.small:hover, div.textbuttonleft a.small:hover, span.textbutton a.small:hover  {
	color: white; 
	text-decoration: none;
	background-color: #333333 ;
}

div.textbuttonright a.dim, div.textbuttonleft a.dim, div.textbuttonright a.dim:hover, div.textbuttonleft a.dim:hover,div.textbuttonright a.dim:visited, div.textbuttonleft a.dim:visited, span.textbutton a.dim, span.textbutton a.dim:hover {
	background-color: #C0C0C0; 
	color: white;
	border-color: white;
}

/* CONTACT FORM */

#message_form #contactFormArea {
	padding: 10px;
	font-size: 12px;
}

#message_form #contactFormArea form {
	padding: 0;
	margin: 0;
}

#message_form #loadBar, #message_form #responseMessage { 
	display: none;
	margin-top: 6px;
	font-weight: bold;
	color: #006600;
}

#message_form label { 
	display: block;
	font-weight: normal;
	margin: 2px 2px;
}

#message_form fieldset { 
	border:0;
	margin: 0 0 10px;
	padding:0;
 }
 
.field_element {
 	margin-bottom: 8px;
}

#message_form input.field , #message_form textarea.field { 
	width: 290px;
	font: 12px/14px 'courier new',courier,monospace; 
	color: #222;
	padding:3px;
	margin:1px 0;
	border: 1px solid #666; 
}

#message_form th {
	text-align: right;
	font-weight: bold;
}


div.remediation {
	color: #900;
	text-indent: -12px;
	margin: 4px 6px 6px 30px;
	clear: left;
	display: none;
}

div.error_msg {
	display: block;
	margin: 2px 0;
	padding: 1px 8px 1px 14px;
	background: url(/img/page_elements/red_arrow_right.gif) no-repeat 4px 3px ;
	color: #880000;
	clear: left;
}

.lp_table {
	width: 552px;
	background-color: transparent;
	padding: 19px 0 26px;
	color: #0C0C0C;
}

.lp_table caption {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 8px;
	color: #333;
}
.lp_table table {
	border-collapse: collapse;
	border: 2px solid #444;
	background-color: transparent;
	width: 100%;
}

.lp_table td, .lp_table th {
	border: 1px solid #444;
	font-size: 11px;
	font-weight: bold;
	padding: 4px 8px;
	vertical-align: top;
	line-height: 138%;
	width: 50%;
}

#content .lp_table td p { 
	font-size: 11px;
	line-height: 136%;
	margin: 0;
}

#content .lp_table td ul {
	margin: 0 0 0 8px;
	padding: 0 0 0 8px;
}

#content .lp_table td ul.no-dot {
	margin: 0 4px;
	padding: 0 4px;
	list-style: none;
}

.top_link, p.top_link {
	text-align: right;
	font-size: 9px;
}

/* PLAIN TEMPLATE */

body#events {
	background-color: #B34040 ;
}

body#reflections {
	background-color: #406640 ;
}

body#opportunities {
	background-color: #66668C ;
}

body#Archives {
	background-color: #B36640 ;
}

body#membership {
	background-color: #B36640 ;
}

#turnip {
	background: url(/img/backgrounds/turnip_bkgnd.gif) no-repeat center top;
}

#basket {
	background: url(/img/backgrounds/basket_bkgnd.gif) no-repeat center top;
}

#plow {
	background: url(/img/backgrounds/plow_bkgnd.gif) no-repeat center top;
}

#cabbage {
	background: url(/img/backgrounds/cabbage_bkgnd.gif) no-repeat center top;
}

#events h1.topic-title {

	color: #900;
}
#reflections h1.topic-title {

	color: #030;
}
#opportunities h1.topic-title {

	color: #336;
}

#Archives h1.topic-title {
	color: #930;
}

#membership h1.topic-title {
	color: #930;
}

#container-plain {
	height: 100%;
	padding: 17px;
	background-color: #A9A879;
	border-right: 2px solid #222;
	border-left: 2px solid #222;
	border-bottom: 2px solid #222;
	width: 799px;
	overflow: hidden;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}

#content-plain {
	background-color: #FFCC66;
	width: 765px;
	padding-top: 12px;
	padding-right: 17px;
	padding-bottom: 12px;
	padding-left: 17px;
}

#content-plain h1 {
	font-size: 14px;
}

#content-plain p {
	font-size: 12px;
	line-height: 140%;
}
#content-plain p, #content-plain h1, #content-plain h2, #content-plain h3, #content-plain h4 {

	margin-top: 0;
	margin-bottom: 8px;
}

#events a {
	color: #990000 ! important;
}

#events a:hover {
	color: #000066 ! important;
}

/* PICTURE POPUP TEMPLATE */

#pic {
	background-color: #A9A879;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#pic a {
	text-decoration: none;
}

#pic_footer {
	font-size: 10px;
}

#pic_head {
	padding: 5px 5px 5px 0px;
	font-size: 12px;
}

#pic_pict {
	padding: 0 ;
}

#pic_capt {
	padding: 5px 0 0;
	font-size: 12px;
}

#pic_foot {
	padding: 0 ;
	font-size: 11px;
}

/* ABOUT THIS SITE POPUP TEMPLATE */


body#AboutThisSite {
	margin: 0;
	padding: 0;
	background-color: #FFCC66;
}

#container-popup {
	height: 100%;
	padding: 0px;
	background-color: #FFCC66;
	width: 600px;
	overflow: hidden;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

#content-popup {
	background-color: #FFCC66;
	width: 566px;
	padding-top: 12px;
	padding-right: 17px;
	padding-bottom: 12px;
	padding-left: 17px;
}

#content-popup h1 {
	font-size: 14px;
}

#content-popup p {
	font-size: 12px;
	line-height: 140%;
}