/* @override http://ocsc.dev/styles/global.css */

@import url(reset.css);
@import url(basics.css);
@import url(constants.css);
@import url(nav.css);
@import url(colors.css);
@import url(calendar.css);
@import url(dw_editing.css) tv;
/*=====  STRUCTURE  =====*/

body {
	margin: 0;
	padding: 0;
	background-attachment: fixed;
	background-color: #0E254E;
	background-image: url("/images/_css/bgBody_about.jpg");
	background-repeat: no-repeat;
}

#page_margins,
#navHead,
#navSubHead {
	min-width: 96em;
/*	max-width: 110em;*/
	}

/*===================  header  */

#header {
	height:10em;
	}

#headerBg {
	height:10em;
	margin-bottom: -10em;
	background-color: white;
	padding-bottom: 6px;
	opacity: .6;
	filter: alpha(opacity=60);
	}
	
#logoBg {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 7.5em;
	width: 493px;
	background-image: url("/images/_css/bgHeader.png");
	background-repeat: repeat-y;
	}

#logo {
	position: absolute;
	top: 0px;
	left: 0px;
	}

	#logo a {
		display: block;
		width: 255px;
		height: 75px;
		background: url("/images/_css/bgLogo.gif") no-repeat ;
		}
 
/*===================  Main layout structure  */

/*------- Sticky footer */
html, body {
	height: 100%;
}
#page_margins {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin-bottom: -2.7em; /* the bottom margin is the negative value of the footer's height */
}


#footer {
	height: 2.7em; /* .push must be the same height as .footer */
}
/*-------[END] Sticky footer */
																										


#container {
	position: relative;
	padding-top: 3em;
	padding-bottom: .7em;
	}
#col1 {
	position: absolute;
	right: 0;
	width: 11.5em;
	margin-top: 6px;
	z-index: 800;
	}

#contentFloat {
	width: 100%;
	float:left;
	}
	
#contentWrap {
	position: relative;
	margin: 19px 11.5em 6em 21.5em;
	background-color: white;
	padding: 0px 6px;
	}
	
	#contentWrap .contentHead,
	#contentWrap .contentFoot {
		position: relative;
		left: -6px;
		right: -6px;
		height: 13px;
		margin: 0 1px 0 13px;
		background-color: white;
		}

	#contentWrap .contentHead {
		top: -13px;
		}

	#contentWrap .contentFoot {
		clear: both;
		bottom: -13px;
		}

		#contentWrap .contentHead span,
		#contentWrap .contentFoot span {
			position: absolute;
			top: 0px;
			display: block;
			height: 13px;
			width: 13px;
			}

		#contentWrap .contentHead .w {
			left: -13px;
			background: url("/images/_css/bgRound13_nw.png") no-repeat;
			}

		#contentWrap .contentHead .e {
			right: -13px;
			background: url("/images/_css/bgRound13_ne.png") no-repeat;
			}


		#contentWrap .contentFoot .w {
			left: -13px;
			background: url("/images/_css/bgRound13_sw.png") no-repeat;
			}

		#contentWrap .contentFoot .e {
			right: -13px;
			background: url("/images/_css/bgRound13_se.png") no-repeat;
			}
	
	#content {
		padding: 0 2.4em;
		width: auto;
		min-height:35em;
		}

#col2 {
	position: relative;
	float: left;
	width: 21.5em;
	margin-right: -21.5em;
	margin-top: 6px;
	margin-bottom: 1em;
	}

#footer {
	width: 100%;
	clear: both;
	line-height: 1.2em;
	background: #0E254E url("/images/_css/bgFooter.gif") no-repeat top left;
	}
		

/*===================  Remaining structure  */
	

/*-------------------- callout box with border corners */
/* bottom right corner */
div.callout  {
	background: url("../images/_css/bg_callout_se.gif") no-repeat bottom right;
	background-color: #EAEAEA;
	padding: 0px 10px;
	margin: 0 0 1.5em 0;
	}

	/* top left corner - ie's get their own treatment*/
	div.callout:before{
		display: block;
		margin: 0 0 -10px -10px;
		content: url("/images/_css/bg_callout_nw.gif");
		width: 10px;
		height: 10px;
		}

	/* top right corner */
	div.callout .blockHead {
		background: #2465BF url("/images/_css/bg_callout_ne.gif") no-repeat top right;
		color: white;
		margin: 0 -10px;
		padding-left: 10px;
		}

	/* custom padding/margin for headers to maintain rhythm */
	div.callout h2.blockHead {
		padding-top: .35em;
		padding-bottom: .35em;
		margin-bottom: .45em;
		}
	div.callout h3.blockHead {
		padding-top: .4em;
		padding-bottom: .4em;
		margin-bottom: .46em;
		}


	/* bottom left corner **requires a class of closing on the final element inside callout block */
	div.callout .closing {
		padding-bottom: 1.5em;
		margin-left: -10px;
		padding-left: 10px;
		background: url("/images/_css/bg_callout_sw.gif") no-repeat bottom left;
		}

	/* custom padding/margin for final element to maintain rhythm */
	div.callout h1.closing { padding-bottom: 0.88em; }
	div.callout h2.closing { padding-bottom: 1.15em; }
	div.callout h3.closing { padding-bottom: 1.36em; }
	div.callout p.closing,
	div.callout ul.closing,
	div.callout ol.closing,
	div.callout dl.closing { padding-bottom: 1.36em; }



/*-------------------- columns - define margins between columns here */
div.s2col .colA .body,    div.s4col .colB .body,    div.s2col-25-75 .colA .body,    div.s2col-75-25 .colA .body,    div.s2col-33-66 .colA .body,    div.s2col-66-33 .colA .body  { padding-right: .5em; }/* .5 x desired margin */
div.s2col .colB .body,    div.s4col .colC .body,    div.s2col-25-75 .colB .body,    div.s2col-75-25 .colB .body,    div.s2col-33-66 .colB .body,    div.s2col-66-33 .colB .body  { padding-left: .5em; }/* .5 x desired margin */
div.s3col .colB .body,    div.s4col .colB .body,    div.s2col-25-75 .colB .body { padding-left: .25em; }/* .25 x desired margin */
div.s3col .colB .body,    div.s4col .colC .body,    div.s2col-75-25 .colA .body { padding-right: .25em; }/* .25 x desired margin */
div.s3col .colA .body,    div.s4col .colA .body,    div.s2col-25-75 .colA .body { padding-right: .75em; }/* .75 x desired margin */
div.s3col .colC .body,    div.s4col .colD .body,    div.s2col-75-25 .colB .body { padding-left: .75em; }/* .75 x desired margin */

div.fL2col-sm .colA { width: 13em; }
div.fL2col-sm .colB { margin-left: 13em; }

div.fR2col-sm .colA { margin-left: -13em; }
div.fR2col-sm .colA .body { margin-left: 13em; }
div.fR2col-sm .colB { width: 13em; }


div.fL2col-md .colA { width: 26em; }
div.fL2col-md .colB { margin-left: 26em; }

div.fR2col-md .colA { margin-left: -26em; }
div.fR2col-md .colA .body { margin-left: 26em; }
div.fR2col-md .colB { width: 26em; }


/*-------------------- "bar links" h2 links that fill the content column and have a colored, rounded bg */
.barLinkL_1,
.barLinkL_2,
.barLinkL_3,
.barLinkL_4,
.barLinkL_5,
.barLinkR_1,
.barLinkR_2,
.barLinkR_3,
.barLinkR_4,
.barLinkR_5 {
	height: 1.92em;
	padding: 0;
	margin: 0;
	margin-bottom:1.34em;
	border-top:.19em solid white;
}

	.barLinkL_1 a, .barLinkL_1 span,
	.barLinkL_2 a, .barLinkL_2 span,
	.barLinkL_3 a, .barLinkL_3 span,
	.barLinkL_4 a, .barLinkL_4 span,
	.barLinkL_5 a, .barLinkL_5 span,
	.barLinkR_1 a, .barLinkR_1 span,
	.barLinkR_2 a, .barLinkR_2 span,
	.barLinkR_3 a, .barLinkR_3 span,
	.barLinkR_4 a, .barLinkR_4 span,
	.barLinkR_5 a, .barLinkR_5 span {
		display: block;
		height: 1.92em;
		line-height: 1.92em;
		color: white;
		}
	.barLinkL_5 a, .barLinkL_5 span,
	.barLinkR_5 a, .barLinkR_5 span {
		color: #0E254E;
		}
	.barLinkR_1 a:hover,
	.barLinkL_1 a:hover,
	.barLinkR_2 a:hover,
	.barLinkL_2 a:hover {
		color: #9CB7E3;
		}
	.barLinkL_3 a:hover,
	.barLinkR_3 a:hover,
	.barLinkL_4 a:hover,
	.barLinkR_4 a:hover,
	.barLinkL_5 a:hover,
	.barLinkR_5 a:hover {
		color: #2465BF;
		}
	

.barLinkL_1,
.barLinkL_2,
.barLinkL_3,
.barLinkL_4,
.barLinkL_5,
	.barLinkR_1 a, .barLinkR_1 span,
	.barLinkR_2 a, .barLinkR_2 span,
	.barLinkR_3 a, .barLinkR_3 span,
	.barLinkR_4 a, .barLinkR_4 span,
	.barLinkR_5 a, .barLinkR_5 span { background-position: right center; background-repeat: no-repeat; }

.barLinkR_1,
.barLinkR_2,
.barLinkR_3,
.barLinkR_4,
.barLinkR_5,
	.barLinkL_1 a, .barLinkL_1 span,
	.barLinkL_2 a, .barLinkL_2 span,
	.barLinkL_3 a, .barLinkL_3 span,
	.barLinkL_4 a, .barLinkL_4 span,
	.barLinkL_5 a, .barLinkL_5 span { background-position: left center; background-repeat: no-repeat; }

.barLinkR_1,
.barLinkL_1 { background-image: url("/images/_css/bgBarLink1.gif"); }
.barLinkR_2,
.barLinkL_2 { background-image: url("/images/_css/bgBarLink2.gif"); }
.barLinkR_3,
.barLinkL_3 { background-image: url("/images/_css/bgBarLink3.gif"); }
.barLinkR_4,
.barLinkL_4 { background-image: url("/images/_css/bgBarLink4.gif"); }
.barLinkR_5,
.barLinkL_5 { background-image: url("/images/_css/bgBarLink5.gif"); }

	.barLinkL_1 a, .barLinkL_1 span,
	.barLinkL_2 a, .barLinkL_2 span,
	.barLinkL_3 a, .barLinkL_3 span,
	.barLinkL_4 a, .barLinkL_4 span,
	.barLinkL_5 a, .barLinkL_5 span { padding-left: 25px; }
	
	.barLinkR_1 a, .barLinkR_1 span,
	.barLinkR_2 a, .barLinkR_2 span,
	.barLinkR_3 a, .barLinkR_3 span,
	.barLinkR_4 a, .barLinkR_4 span,
	.barLinkR_5 a, .barLinkR_5 span { padding-right: 25px; text-align: right;}
	
	.barLinkL_1 a, .barLinkL_1 span { background-image: url("/images/_css/bgBarLink1L.gif"); }
	.barLinkL_2 a, .barLinkL_2 span { background-image: url("/images/_css/bgBarLink2L.gif"); }
	.barLinkL_3 a, .barLinkL_3 span { background-image: url("/images/_css/bgBarLink3L.gif"); }
	.barLinkL_4 a, .barLinkL_4 span { background-image: url("/images/_css/bgBarLink4L.gif"); }
	.barLinkL_5 a, .barLinkL_5 span { background-image: url("/images/_css/bgBarLink5L.gif"); }
	
	.barLinkR_1 a, .barLinkR_1 span { background-image: url("/images/_css/bgBarLink1R.gif"); }
	.barLinkR_2 a, .barLinkR_2 span { background-image: url("/images/_css/bgBarLink2R.gif"); }
	.barLinkR_3 a, .barLinkR_3 span { background-image: url("/images/_css/bgBarLink3R.gif"); }
	.barLinkR_4 a, .barLinkR_4 span { background-image: url("/images/_css/bgBarLink4R.gif"); }
	.barLinkR_5 a, .barLinkR_5 span { background-image: url("/images/_css/bgBarLink5R.gif"); }



/*=====  TYPOGRAPHY  =====*/
/*colors for category and page titles defined in colors.css */

.categoryTitle {
	position: relative;
	top: -20px;
	left: 0px;
	right: 0px;
	height: 10em;
	}

	.categoryTitle h1
	{
		padding: .2em 1em;
		font-size: 1.7em;
		font-weight: bold;
		color: white;
		letter-spacing: -.02em;
		background-image: url("/images/_css/bgContentH1_w.png");
		background-repeat: no-repeat;
		border-bottom: 6px solid white;
	}

h1.pageTitle
{
	position: relative;
	top: -20px;
	left: 0px;
	right: 0px;
	padding: .2em 1em;
	font-size: 1.7em;
	font-weight: bold;
	color: white;
	letter-spacing: -.02em;
	-moz-border-radius: .4em .4em 0em 0em;
    -webkit-border-radius: .4em .4em 0em 0em;
    -khtml-border-radius: .4em .4em 0em 0em;
    border-radius: .4em .4em 0em 0em;
}


/*	h1.pageTitle span.e,
	.categoryTitle span.e
	{
		position: absolute;
		display: block;
		top: 0px;
		right: 0px;
		width: 7px;
		height: 7px;
		background-image: url("/images/_css/bgContentH1_e.png");
		background-repeat: no-repeat;
	}*/



	.categoryTitle span.flavor {
		display: block;
		float: right;
		height: 10em;
		width: 400px;
		background: white url("/images/_css/about_header.jpg") no-repeat right top;
		border-left: 6px solid white;
	}

div.callout h2.blockHead a:link { color: white; }
div.callout h2.blockHead a:visited { color: white; }
div.callout h2.blockHead a:active { color: white; }
div.callout h2.blockHead a:hover { color: #9CB7E3; }


#footer * {
	margin-bottom: 0em;
	padding-bottom: 0em;
	color: white;
	}


#footer ul {
	padding-left: 2.5em;
	}

#footer li {
	display: inline;
	font-size: 1em;
	line-height: 2.5em;
	}

#footer b {
	font-weight: normal;
	padding: 0 .3em;
	}

#footer a {
	color: #2164BD;
	text-decoration: none;
	}

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


h4.expandomatic {
	font-size: 12px;
	height: 13px;
	padding: 4px 4px 4px 35px;
	}

/*=====  OVERRIDES  =====*/

img.floatRight {
	margin-left: 20px;
	}
	
img.floatLeft {
	margin-right: 20px;
	}

ul.peoplePics {
	text-align: center;
	}
	
ul.peoplePics li{
	display: block;
	float: left;
	width: 10em;
	height: 16.5em;
	text-align: center;
	}


ul.indent {
	margin-left: 2em !important;
	}

ul.bullets  {
	list-style: disc;
	}

ul.opt1,
ul.opt2,
ul.opt3,
ul.opt4 {
	list-style-type: none;
	margin-left: 0;
	}

ul.opt1 li,
ul.opt2 li,
ul.opt3 li,
ul.opt4 li {
	background-repeat: no-repeat;
	list-style-type: none;
	margin-left: 0;
	padding-left: 18px;
	}

ul.opt1 li { background-image: url("/images/_css/bgLiOpt1.gif"); }
ul.opt2 li { background-image: url("/images/_css/bgLiOpt2.gif"); }
ul.opt3 li { background-image: url("/images/_css/bgLiOpt3.gif"); }
ul.opt4 li { background-image: url("/images/_css/bgLiOpt4.gif"); }

.callout ul.opt1 li { background-image: url("/images/_css/bgLiOpt1_callout.gif"); }
.callout ul.opt2 li { background-image: url("/images/_css/bgLiOpt2_callout.gif"); }
.callout ul.opt3 li { background-image: url("/images/_css/bgLiOpt3_callout.gif"); }
.callout ul.opt4 li { background-image: url("/images/_css/bgLiOpt4_callout.gif"); }

.error_text {
	font-size: 1.2em;
	font-weight: bold;
	padding-left: 20px;
	line-height: 1.4em;
	color: #BE3C24;
	background: url("../images/icon_error.gif") no-repeat;
	vertical-align: middle;
	}

.confirm, .confirm_text {
	font-size: 1.2em;
	font-weight: bold;
	padding-left: 20px;
	line-height: 1.4em;
	color: #5BA453;
	background: url("../images/icon_success.gif") no-repeat;
	vertical-align: middle;
	}

#phpDebugInfo {
	background-color: white;
	font-family: "Andale Mono";
	font-size: .9em;
}
#phpDebugErrors {
	position: absolute;
	top: 0px;
	left: 0px;
	padding: 2em 0em;
	background-color: #cc0000;
	color: white;
	font-family: "Andale Mono";
	font-size: 1.2em;
}

#phpDebugInfo li,
#phpDebugErrors li {
	padding: .2em 1em !important;
	margin: 0 !important;
	border-bottom: 1px solid #cccccc;
	white-space: pre;
	}
	
#loginForm input.text {
	width: 12em;
	}

label.error {
	color: red;
	}





/*=====  MEMBERSHIP PACKAGES TABLE


#member_packages {
	margin: 0 auto;
	min-height: 440px;
	}

#member_packages img {
	float:left;
	margin: 10px 5px;
	height: 400px;
    width: 200px;
	/*Transition*
	-webkit-transition: all 0.5s ease;
	   -moz-transition: all 0.5s ease;
	    -ms-transition: all 0.5s ease;
		 -o-transition: all 0.5s ease;
			transition: all 0.5s ease;
}


#member_packages img:hover, #member_packages img:focus {
	height: 420px;
	width: 210px;
	margin-left: 0px;
	margin-top: 0px;
}

  =====*/