﻿/************************************ Start of Rest styles **********************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	}
body {
	line-height: 1.3;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/************************************ End of Rest styles **********************************/
/* 
Double Margins on Floats and Expanding Box problem 
	add display:inline; (place display:inline on your layout divs to fix Double Margins on Floats in IE problem.)
    overflow:hidden; (place overflow:hidden; into the layout divs, the layout won't break in IE6.)
Clearing Floats
	add overflow:auto; or overflow:hidden; in container*/

body {
	font-size:64.5%;
	background:#cfe5f0 url(../images/bg_sli.jpg) repeat-x 0 0;
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
}

.hr {
	margin:0 0 0 8px;
	height:4px;
	width:449px;

}
.hrfull {
	margin:0 0 0 8px;
	height:4px;
	width:575px;
}
.homeimg {
	text-align:center;
}
/********* Font syles ************************/

H1 {font-size:1.8em; color:#007aa9; margin:10px 0; padding:0 0 0 20px;}  /* displayed at 18px */
H2 {font-size:1.8em; color:#007aa9; margin:10px 0; padding:0 0 0 20px;}  /* displayed at 16px */
H3 {font-size:1.5em; color:#007aa9; margin:15px 0 8px 0; padding:0 0 0 20px;}  /* displayed at 15px */
H4 {font-size:1.2em; color:#007aa9; margin:10px 0; padding:0 0 0 20px;}  /* displayed at 12px */

H3 span { color:#333; font-size:80%;}
p{font-size:1.3em; margin:8px 0; padding:0 20px; color:#333333;}
a { color:#b74294; cursor:pointer;}
a:link,	a:visited { text-decoration:none;}
a:hover, a:active { text-decoration:underline;}


/********** Layout styles *******************/
#wrapper{
	width:908px;
	margin:0 auto;
	
	
	
}
#wrappershadow {
	background:url(../images/img_shadow.jpg) repeat-y 0 0;
	height:100%;
	overflow:hidden;
	padding:0 0 0 4px;
	
}

#contentleftshadow{ 
	background:url(../images/img_leftshadow.jpg) no-repeat top;
	height:348px;
	margin:0 0 0 -4px;
	width:4px;
	display:block;
	float:left;
	position:relative;
	display:inline;
	
}
#contentrightshadow{ 
	background:url(../images/img_rightshadow.jpg) no-repeat top;
	width:4px;
	float:right;
	height:348px;
	position:relative;
	display:inline;
}
#header {
	background:url(../images/Img_header.jpg) no-repeat;
	width:900px;
	height:94px;
}
.subnav {
	margin-top:-4px;
}
#content {
	float:left;
	width:890px;
	margin:6px 4px 0 4px;
	background:#f5fafc;
	display:inline;
	background:url(../images/content_bg.gif) repeat-y 0 0;
	
}
.col1 {
	width:231px;
	float:left;
	margin:0 4px 0 0;
	background-color:#FFFFFF;
	padding:0 5px 0 0;
	display:inline;
		
}
.col2 {
	width:600px;
	float:left;
	display:inline;
		
}
.col3 {
	width:183px;
	float:left;
	display:inline;
	position:relative;
		
}
.split {
	width:457px;
	display:inline;
}
#breadcrum{
	font-size:1.1em;
	line-height:36px;
	height:30px;
	padding:0 0 0 20px;
}
#footer {
	
	float:left;
	width:890px;
	border:none;
	display:inline;
	background:#8cc2d1 url(../images/footer_sli.gif) repeat-x;
	height:44px;
	margin:4px 4px 0 4px;
	text-align:center;

}
/******** General styles ************************/

ul {
	list-style:disc; 
	padding:0 0 0 40px;
	font-size:1.2em;
	color:#333333;


}
ol li p {font-size:1em;}
.insdie {
	list-style:disc; 
	padding:0 0 0 40px;
	font-size:1em;
	color:#333333;


}

.statment {
	font-style:italic;
	color:#B74294;

}
ol.styled {
 list-style:decimal; color:#333333; font-size:1.3em; margin-left:40px;
 
}
ol.styled li {
	padding:0 0 7px 0;
}

/********* hedaer style **************************/
#header {
	position:relative;

}
#header select {
	position:absolute;
	top:25px;
	right:16px;
	width:200px;
}


/********* Nav Syles ************************/
#nav{
	background:url(../images/nav_sli.gif) repeat-x;
	height:43px;
	width:788px;
	margin:0 5px;
	padding:0 0 0 100px;
	
	
}
ul#nav {
	list-style:none;
}

ul#nav li { 
	float:left;
	padding:0 5px;
	height: 43px;
	position: relative;
	float: left;
	margin:0 2px;
}
ul#nav li a {
	font-family: Arial, Helvetica, sans-serif;
	height: 43px;
	display: block;
	color: #FFF;
	text-transform: uppercase;
	text-decoration: none;
	

}
ul#nav li a:hover {
	
	height: 43px;
	display: block;
	color: #FFF;
	

}
#nav li span {
	display: none;
}
/*HOME NAV LINK*/
/*-------------*/
ul#nav  li#home {
	z-index: 100;
	width: 76px;
	background: url('../images/nav.gif') no-repeat 0 0px;
}
ul#nav li#home:hover {
	background: url('../images/nav.gif') no-repeat 0 -45px;
	}
ul#nav li#home.active {
	background: url('../images/nav.gif') no-repeat 0 -45px;
	}

/*ABOUT NAV LINK*/
/*-------------*/
ul#nav  li#about {
	z-index: 100;
	width: 100px;
	background: url('../images/nav.gif') no-repeat -90px 0;
}
ul#nav li#about:hover {
	background: url('../images/nav.gif') no-repeat -90px -45px;
}
ul#nav li#about.active {
	background: url('../images/nav.gif') no-repeat -90px -45px;
}
/*Programes NAV LINK*/
/*-------------*/
ul#nav  li#programes {
	z-index: 100;
	width: 146px;
	background: url('../images/nav.gif') no-repeat -204px 0;
}

ul#nav li#programes:hover {
	background: url('../images/nav.gif') no-repeat -204px -45px;
}
ul#nav li#programes.active {
	background: url('../images/nav.gif') no-repeat -204px -45px;
}
/*-------------*/

/*freestuff NAV LINK*/
/*-------------*/
ul#nav  li#freestuff {
	z-index: 100;
	width: 105px;
	background: url('../images/nav.gif') no-repeat -364px 0px;
}
ul#nav li#freestuff:hover {
	background: url('../images/nav.gif') no-repeat -364px -45px;
}
ul#nav li#freestuff.active {
	background: url('../images/nav.gif') no-repeat -364px -45px;
}
/*events NAV LINK*/
/*-------------*/
ul#nav  li#events {
	z-index: 100;
	width: 93px;
	background: url('../images/nav.gif') no-repeat -483px 0px;
}
ul#nav li#events:hover {
	background: url('../images/nav.gif') no-repeat -483px -45px;
}
ul#nav li#events.active {
	background: url('../images/nav.gif') no-repeat -483px -45px;
}

/*contact NAV LINK*/
/*-------------*/
ul#nav  li#contact {
	z-index: 100;
	width: 91px;
	background: url('../images/nav.gif') no-repeat -590px 0px;
}
ul#nav li#contact:hover {
	background: url('../images/nav.gif') no-repeat -590px -45px;
}
ul#nav li#contact.active  {
	background: url('../images/nav.gif') no-repeat -590px -45px;
}

/********* sub nav Syles ************************/
ul.subnav {
	list-style:none;
	padding:0px;
	

}
ul.subnav li { 
	height: 40px;
	position: relative;
	background:url(../images/subnav.gif) no-repeat 0 -40px;
	margin:4px 0;
}
ul.subnav li a {
	color:#fff;
	line-height:40px;
	height:40px;
	padding:0 0 0 15px;
	font-size:1.4em;
	text-decoration:none;
	display:block;
}
ul.subnav li:hover {
	background: url(../images/subnav.gif) no-repeat 0 0;
	position: relative;
	height: 40px;
	margin:4px 0;
		
}

.active {
	background: url(../images/subnav.gif) no-repeat 0 0;
	position: relative;
	
}
/********* Inner sub nav Syles ************************/

ul.innersubnav {
	background-color:#e5f1f6;
	margin:0 0 9px 0;
	padding:0 0 5px 0;
	list-style:none;
}
ul.innersubnav li, ul.innersubnav li:hover { 
	height: 25px;
	position: relative;
	background:none;
	margin:4px 0;
	margin-left:14px;
	display:block;
}

ul.innersubnav li a {
	color:#7d1478;
	font-size:1.2em;
	line-height:30px;
	
	display:block;
}
ul.innersubnav li a:hover {
	text-decoration:underline;
	display:block;

}
/********* breadcrum Syles ************************/
#breadcrum{
	color:#9d519b;
}

/********* col3 Syles ************************/
.col3 img {
	margin:0 0 5px 10px;

}

.col3 p.quote {
	position:absolute;
	bottom:0;
	left:0;
	color:#FFFFFF;
	padding:0 0px 0 10px;
	margin-left:13px;
	font-style:italic;
	text-align:right;
	width:160px;
	

}
/********* footer Syles ************************/
#footer {
	font-size:90%;

}
#footer p{
	color:#FFFFFF;
	margin:17px 0 0 0;
}
#footer a {
	color:#FFFFFF;
} 


/********* underfooter Syles ************************/
#underfooter {
	font-size:90%;
	text-align:center;
}
#underfooter p { 
	color:#1a86b0;
}
#underfooter a { 
	color:#1a86b0;
}


/********* homepage Syles ************************/


a#home1 {
	background: url('../images/homepagebuttons.gif') no-repeat -6px -4px;
	width:209px;
	height:69px;
	display:block;
	float:left;
	margin:0 0px 8px 20px;
	display:inline;
	position:relative;
	
}
a#home1:hover {
	background: url('../images/homepagebuttons.gif') no-repeat -6px -155px;
	text-decoration:none;
	border:none;
	float:left;
	display:inline;
	position:relative;
}
a#home2 {
	background: url('../images/homepagebuttons.gif') no-repeat -221px -4px;
	width:209px;
	height:69px;
	display:block;
	float:left;
	display:inline;
	position:relative;
}
a#home2:hover {
	background: url('../images/homepagebuttons.gif') no-repeat -221px -155px;
	text-decoration:none;
	border:none;
	float:left;
	display:inline;
	position:relative;
}
a#home3 {
	background: url('../images/homepagebuttons.gif') no-repeat -5px -80px;
	width:209px;
	height:69px;
	display:block;
	float:left;
	margin:0 0px 8px 20px;
	display:inline;
	position:relative;
}
a#home3:hover {
	background: url('../images/homepagebuttons.gif') no-repeat -5px -231px;
	text-decoration:none;
	border:none;
	float:left;
	display:inline;
	position:relative;
}
a#home4 {
	background: url('../images/homepagebuttons.gif') no-repeat  -221px -80px;
	width:209px;
	height:69px;
	display:block;
	float:left;
	display:inline;
	position:relative;
	
}
a#home4:hover {
	background: url('../images/homepagebuttons.gif') no-repeat  -221px -231px;
	text-decoration:none;
	border:none;
	float:left;
	display:inline;
	position:relative;
}
/********* site map Syles ************************/
ul#sitemap, ul#sitemap ul  { font-size:12PX; list-style:none;}
/********* Forms styles **************************/
#formholder { float:left;}
#contactus {
	background-color:#e5f1f6;
	color:#007aa9;
	font-size:1.1em;
	padding:0 0 4px 0;
}
#contactus .title {
	color:#7d1478;
	font-weight:bold;
	
	padding:0 0 0 14px;

}
#contactus strong {
	padding:0 0 0 14px;
}	
#contactusa {
	background-color:#e5f1f6;
	color:#007aa9;
	font-size:1.1em;
	padding:0 0 4px 0;
}
#contactusa .title {
	color:#7d1478;
	font-weight:bold;
	
	padding:0 0 0 14px;

}
#contactusa strong {
	padding:0 0 0 14px;
}	
.linebox {
	border:1px solid #a5aeb2;
	
	margin:0 0 0 7px;
	width:130px;
}
.fullbox { width:250px;}
#contactus td { vertical-align:bottom;}
#contactus tr {
	line-height:30px;
	height:30px;
	vertical-align:middle;
}
#contactSubmit{
	background: url(../images/imgsubmit.gif) no-repeat 0 0;
	width:102px;
	height:30px;
	border:none;
}
#contactSubmit:hover {
background: url(../images/imgsubmit.gif) no-repeat 0 -30px;
	width:102px;
	height:30px;
}

input {
	color:#333333;
    font-size:1.1em;
	padding:5px 0 5px 5px;
	height:17px;

}









/* SpryFormValidation.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */


/* These are the classes applied on the error messages
 * which prevent them from being displayed by default.
 */ 
.textfieldRequiredMsg, 
.textfieldInvalidFormatMsg, 
.textfieldMinValueMsg,
.textfieldMaxValueMsg,
.textfieldMinCharsMsg,
.textfieldMaxCharsMsg,
.textfieldValidMsg {
	display: none;
}
#sprytextfield1,
#sprytextfield2,
#sprytextfield3,
#sprytextfield4,
#sprytextfield5,
#sprytextfield6,
#sprytextfield7,
#sprytextfield8,
#sprytextfield9,
#sprytextfield10,
#sprytextfield11,
#sprytextfield12,
#sprytextfield13,
#sprytextfield14,
#sprytextfield15,
#sprytextfield16,
#sprytextfield17,
#sprytextfield18,
#sprytextfield19
  { 
  	position:relative;
  }
/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and color for the error text.
 * The state class (e.g. .textfieldRequiredState) is applied on the top-level container for the widget,
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.textfieldRequiredState .textfieldRequiredMsg, 
.textfieldInvalidFormatState .textfieldInvalidFormatMsg, 
.textfieldMinValueState .textfieldMinValueMsg,
.textfieldMaxValueState .textfieldMaxValueMsg,
.textfieldMinCharsState .textfieldMinCharsMsg,
.textfieldMaxCharsState .textfieldMaxCharsMsg
{
	
display: inline;
	color: #CC3333;
	border:1px solid #e7e7e7;
	background:#FFFFFF;
	padding:0 5px;
	position:absolute;
	margin-left:5px;
	top:-10px;
	left:145px;
	width:110px;
	height:30px;
	z-index:100;	
}

span.inputlonger
{
	left:275px!important;
}
/* The next three group selectors control the way the core element (INPUT) looks like when the widget is in one of the states: * focus, required / invalid / minValue / maxValue / minChars / maxChars , valid 
 * There are two selectors for each state, to cover the two main usecases for the widget:
 * - the widget id is placed on the top level container for the INPUT
 * - the widget id is placed on the INPUT element itself (there are no error messages)
 */
 
 /* When the widget is in the valid state the INPUT has a green background applied on it. */
.textfieldValidState input, input.textfieldValidState {
	background-color: #B8F5B1;
}

/* When the widget is in an invalid state the INPUT has a red background applied on it. */
input.textfieldRequiredState, .textfieldRequiredState input, 
input.textfieldInvalidFormatState, .textfieldInvalidFormatState input, 
input.textfieldMinValueState, .textfieldMinValueState input, 
input.textfieldMaxValueState, .textfieldMaxValueState input, 
input.textfieldMinCharsState, .textfieldMinCharsState input, 
input.textfieldMaxCharsState, .textfieldMaxCharsState input {
	background-color: #FF9F9F;
}

/* When the widget has received focus, the INPUT has a yellow background applied on it. */
.textfieldFocusState input, input.textfieldFocusState {
	background-color: #FFFFCC;
}

/* This class applies only for a short period of time and changes the way the text in the textbox looks like.
 * It applies only when the widget has character masking enabled and the user tries to type in an invalid character.
 */
.textfieldFlashText input, input.textfieldFlashText{
	color: red !important;
}
