/*
Title: MCC Warwick Family Services
Author: Tome Wilson - tome@creativewebgroup.net
Last Updated: September 10, 2009
*/

/* ---[ css reset ]--------------------- */
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, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, ol, ul {margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline}
:focus {outline: 0}
body {line-height: 1}
ol, ul {list-style: none}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate; border-spacing: 0}
caption, th, td {text-align: left; font-weight: normal}
a {text-decoration: none}

/* ---[ structure ]--------------------- */
html, body {background: #f3f3f3 url(images/shell/background.png) repeat-x; height: 100%; min-width: 760px; text-align: center; color: #000; font: normal 12px/1em Verdana, Arial, Helvetica, sans-serif}
#center-on-page {width: auto; text-align: center}
#container {margin: 0 auto; width: 760px; display: block}

#header, #top-navigation, #photos, #main {display: block; width: 760px; clear: both}
#header {height: 117px}

/* ---[ top navigation rollover buttons ]--------------------- */
#top-navigation {height: 30px; margin: 10px 0}
#top-navigation ul {height: 30px; list-style: none}
#top-navigation li {float: left; /*width: 61px*/ /* needed or else IE and Opera will go nuts */}

#top-navigation a.home, #top-navigation a.about-us, #top-navigation a.programs, #top-navigation a.meet-the-staff, #top-navigation a.access, #top-navigation a.parents-and-guardians, #top-navigation a.career-opportunities {float: left; background: url(images/shell/top-navigation.png) no-repeat; display: block; height: 30px; text-indent: -999999px}

#top-navigation a.home {background-position: 0 0; width: 61px}
#top-navigation a.home:hover {background-position: 0 -30px}
#top-navigation a.about-us {background-position: -61px 0; width: 69px}
#top-navigation a.about-us:hover {background-position: -61px -30px}
#top-navigation a.programs {background-position: -130px 0; width: 73px}
#top-navigation a.programs:hover {background-position: -130px -30px}
#top-navigation a.meet-the-staff {background-position: -203px 0; width: 99px}
#top-navigation a.meet-the-staff:hover {background-position: -203px -30px}
#top-navigation a.access {background-position: -302px 0; width: 176px}
#top-navigation a.access:hover {background-position: -302px -30px}
#top-navigation a.parents-and-guardians {background-position: -478px 0; width: 136px}
#top-navigation a.parents-and-guardians:hover {background-position: -478px -30px}
#top-navigation a.career-opportunities {background-position: -614px 0; width: 146px}
#top-navigation a.career-opportunities:hover {background-position: -614px -30px}

#photos {height: 116px; background: url(images/shell/photos.jpg) no-repeat; margin-top: 10px}

#main {margin-top: 10px}
#left-side {width: 152px; float: left; margin-right: 10px}
#right-side {width: 598px; float: left}

	/* ---[ side navigation ]--------------------- */
	
	.side-navigation-top, .side-navigation-bottom {width: 152px; height: 10px; line-height: 0; font-size: 0; behavior: url("iepngfix.htc")}
	.side-navigation-top {background: transparent url(images/shell/sidebar-top.png) no-repeat}
	.side-navigation-bottom {background: transparent url(images/shell/sidebar-bottom.png) no-repeat}
	#side-navigation, #contact-info {background: #fff url(images/shell/sidebar-background.png) repeat-y; width: 132px; padding: 0 10px; font: normal 11px/1.25em Arial, Helvetica, sans-serif}
	#side-navigation a:link, #side-navigation a:visited {color: #ab0534; display: block; border-bottom: 2px solid #f3f3f3; padding: 7px 0; font: bold 13px/1.35em Arial, Helvetica, sans-serif; letter-spacing: -1px}
	#side-navigation a:hover {color: #ab0534; background: #f3f3f3 url(images/shell/sidebar-rollover.png); border-right: 1px solid #f3f3f3; border-left: 1px solid #f3f3f3}
	#contact-info p {padding: .25em 0; line-height: 1.35em}

.content-top, .content-bottom {display: block; width: 598px; height: 10px; clear: both; line-height: 0; font-size: 0; behavior: url("iepngfix.htc")}
.content-top {background: transparent url(images/shell/content-top.png) no-repeat}
.content {background: #fff url(images/shell/content-background.png) repeat-y; width: 558px; padding: 4px 20px; text-align: left}
.content-bottom {background: transparent url(images/shell/content-bottom.png) no-repeat}


	/* ---[ content styles ]--------------------- */
	em, .em {font-style: italic}
	strong, .strong {font-weight: bold}
	.big {font-size: 115%}
	.small {font-size: 11px}
	.l {float: left}
	.r {float: right}
	.clear {clear: both; display: block}
	.center {text-align: center}
	.none {padding: 0; border: 0 !Important}
	p {padding: .35em 0; line-height: 1.5em}
	.hr {font-size: 1px; border-bottom: 1px dotted #000; margin: 10px 0}

	#content a {color: #ab0534}
	#content a:hover {color: #ab0534; text-decoration: none; border-bottom: 1px dotted #ab0534}
	#content .photoL {float: left; margin: 3px 8px 0 0}
	#content .photoR {float: right; margin: 3px 0 0 10px}
	#content .photoCaptionL {float: left; margin: 1em 8px 0 0; font-size: 75%; text-align: center}
	#content .photoCaptionR {float: right; margin: 1em 0 0 8px; font-size: 75%; text-align: center}
	#content .column1 {float: left; width: 270px; display: block; margin-right: 10px}
	#content .column2 {float: left; width: 270px; display: block}
	#content ul {padding: .35em 0 .35em 1em; line-height: 1.35em; list-style-type: none; text-align: left}
	#content li {padding: .35em 0 .35em 1em; background: transparent url(images/icons/square.gif) 0 .8em no-repeat}
	#content .pdf {background: #fff url(images/icons/pdf.gif) no-repeat top left; padding: 2px 0 2px 2em; margin: .35em 0}
	
	h1 {font: normal 26px/1em Arial, Helvetica, sans-serif; color: #ab0534; padding: 0 0 .15em 0}
	h2 {font: normal 19px/1em Arial, Helvetica, sans-serif; color: #666; padding: .35em 0}
	h3 {font: bold 14px/1.35em Arial, Helvetica, sans-serif; color: #ab0534; padding: .35em 0}

	/* ---[ font colors ]--------------------- */
	.black {color: #000 !Important}
	.white {color: #fff !Important}
	.grey {color: #666 !Important}
	.red {color: #ab0534 !Important}

#footer {font-size: 10px}
#footer a:link, #footer a:visited {color: #98012e}
#footer a:hover {color: #98012e; text-decoration: underline}

	/* ---[ Admin styles ]--------------------- */
table.justlogin {width:75%;margin-left:auto;margin-right:auto;}
table.justlogin th {text-align:left}
td.label {color:#fff;background:#ab0534;font-weight:normal}
table.data_table {width:90%;}
table.data_table thead th {background: #ab0534; color: #fff}
table.data_table tbody th {background: #ab0534}
table.data_table tbody td }
table.data_table tbody td.icon,table.data_table tfoot td.submit {text-align: center}
table.data_table a {color: #ab0534; display: block; padding: 2px 5px; position: relative; text-decoration: none}
table.data_table a:hover {background: #ffffe1; color: #000; text-decoration: none}
.setheight {height: 20px}
table.data_table th.goleft {text-align:left; padding:2px; font: bold 12px verdana; color: #ab0534}
table.data_table thead th.htab a {color: #fff; text-decoration: none}
table.data_table thead th.htab a:hover {color: #000; text-decoration: none}
#Confirm-Email-Address{display:none;}