/* @override http://chapelhillcompounding.dev/stylesheets/chc_layout.css */

/* ::: PAGE LAYOUT :::
=============================== */

BODY {
	background: #f3f3f3 url(../images/bg_gradient.gif) top left repeat-x;
	text-align: center; }
	
#pageContainer {
	width: 780px;
	margin: 0 auto;
	text-align: left;
	background: transparent url(../images/bg_pagecontainer.gif) 0 0 repeat-y;  }

/* @group Masthead */

/* ::: MASTHEAD :::
=============================== */

#masthead {
	float: left;
	clear: left;
	height: 89px;
	width: 100%; }
	
	#masthead H1 {
		float: left;
		margin: 0;
		padding: 0;
		height: 89px;
		width: 300px;
		text-indent: -5000px;
		background: transparent url(../images/logo.gif) top left no-repeat;	}
		
	#masthead .tel {
		float: right;
		width: 129px;
		height: 89px;
		text-indent: -5000px;
		background: transparent url(../images/mst_phone.gif) 0 0 no-repeat; }

/* @end */

/* @group Menu */

/* ::: MENU :::
=============================== */

#menu {
	float: left;
	width: 100%;
	height: 31px;
	display: inline;
	background: #46166b url(../images/menu.png) no-repeat 0 -31px; }
	
	#menu UL {
		list-style: none;
		margin: 0;
		padding: 0 0 0 24px; }
		
		#menu LI {
			margin: 0;
			padding: 0 16px 0 0;
			float: left; }
			
			#menu A {
				display: block;
				height: 31px;
				background: transparent url(../images/menu.png) 0 0 no-repeat;
				text-indent: -5000px; }
				
			#menu A:hover { background-image: none !important; }
			
BODY.home #menu-home A:hover,
BODY.about #menu-about A:hover,
BODY.contact #menu-contact A:hover,
BODY.services #menu-services A:hover,
BODY.faq #menu-faq A:hover,
BODY.resources #menu-resources A:hover,
BODY.refills #menu-refills A:hover {
	background-image: url(../images/menu.png) !important; }
			
#menu-home A {
	width: 63px;
	background-position: -24px 0; }	
BODY.home #menu-home A { background-position: -24px -62px; }
	
#menu-about A {
	width: 150px;
	background-position: -103px 0; }
BODY.about #menu-about A { background-position: -103px -62px; }
BODY.about #menu-about A:hover { background-image: url(../images/menu.png) !important; }
	
#menu-contact A {
	width: 97px;
	background-position: -269px 0; }
BODY.contact #menu-contact A { background-position: -269px -62px; }
	
#menu-services A {
	width: 76px;
	background-position: -382px 0; }
BODY.services #menu-services A { background-position: -382px -62px; }
	 
#menu-faq A {
	width: 63px;
	background-position: -474px 0; }
BODY.faq #menu-faq A { background-position: -474px -62px; }
	
#menu-resources A {
	width: 92px;
	background-position: -553px 0; }
BODY.resources #menu-resources A { background-position: -553px -62px; }
	
#menu-refills A {
	width: 61px;
	background-position: -661px 0; }
BODY.refills #menu-refills A { background-position: -661px -62px; }

/* @end */

/* @group Content */

/* ::: CONTENT :::
=============================== */
	
#contentContainer {
	float: left;
	clear: left;
	width: 100%;
	background: transparent url(../images/bg_content.png) 0 0 no-repeat;
	padding-top: 12px; }

#content {
	float: left;
	clear: left;
	display: inline;
	width: 454px;
	margin-left: 48px; }
	
	#content H2 {
		margin: 0 0 12px -12px;
		width: 478px;
		height: 44px;
		text-indent: -5000px;
		background: transparent url(../images/ti_about.gif) 0 0 no-repeat; }
		
BODY.about #content H2 { background-image: url(../images/ti_about.gif); }
	
	
IMG.left {
	margin: 2px 12px 3px -18px;
	float: left;
	clear: none;
	display: inline;
	position: relative; }

/* @end */

/* @group Submenu */

/* ::: SUBMENU :::
=============================== */

#submenu {
	float: right;
	display: inline;
	width: 242px;
	margin-right: 24px;
	padding-bottom: 150px; }
	
.sbimage {
	margin: 0 0 16px 12px; }
	
#submenu A {
	text-decoration: none;
	color: #3e301c; }
	
#submenu UL {
	margin: 0 0 12px 0;
	padding: 0;
	list-style: none; }
	
	#submenu LI {
		margin: 0;
		padding: 0; }
		
	#submenu LI A {
		display: block;
		width: 218px !important;
		width /**/: 242px;
		height: 25px;
		line-height: 25px;
		padding-left: 24px; }
		
		#submenu LI.selected A {
			color: #fff;
			line-height: 23px;
			background: transparent url(../images/bg_sbmenu_over.gif) 0 0 no-repeat; }
			
		#submenu A:hover { text-decoration: underline; }
		#submenu LI.selected A:hover { text-decoration: none; }
	
#submenu .vcard {
	width: 196px !important;
	width /**/: 206px;
	height: 89px !important;
	height /**/: 101px;
	margin-left: 24px;
	padding: 12px 0 0 8px;
	background: transparent url(../images/bg_address.gif) 0 0 no-repeat;
	font-size: .85em; }
	
	#submenu .vcard .org,
	#submenu .vcard .tel { display: none; }
	
	#submenu .vcard .adr {
		padding-left: 24px;
		background: transparent url(../images/icn_house.gif) 1px 0 no-repeat;
		margin-bottom: .8em; }
		
	#submenu .vcard .email {
		padding-left: 24px;
		background: transparent url(../images/icn_envelope.gif) 0 1px no-repeat; }
		
	#submenu .vcard A:hover {
		text-decoration: underline; }

/* @end */

/* @group Footer */

/* ::: FOOTER :::
=============================== */

#footer {
	position: relative;
	padding-top: 18px;
	clear: both;
	background: #f3f3f3 url(../images/bg_footer.gif) top left no-repeat;
	width: 100%;
	font-size: .85em;
	color: #808080; }
	
	#footer UL {
		margin: 0 0 2em 28px;
		padding: 0;
		list-style: none; }
		
		#footer LI {
			float: left;
			padding: 0 1em;
			border-left: 1px solid #ccc; }
			
			#footer LI.first {
				padding-left: 0;
				border-left-width: 0; }
			
		#footer A {
			color: #808080;
			text-decoration: none; }
			
		#footer A:hover { text-decoration: underline; }
		
	#footer .copyright {
		clear: left;
		margin-left: 28px; }
		
	#footer .credit {
		float: right;
		margin-right: 28px;
		margin-top: -60px;
		color: #999; }
		
		#footer .credit A {
			color: #999; }

/* @end */

/* @group Home */

BODY.home #contentContainer {
	background-image: url(../images/bg_content_home.jpg);
	position: relative; }
	
BODY.home #submenu {
	padding-bottom: 500px !important; }

	BODY.home #submenu UL,
	BODY.home #submenu .sbimage {
		display: none; }
		
		BODY.home #submenu .vcard {
			position: absolute;
			top: 381px; }
	
BODY.home #content {
	width: 435px;
	margin-left: 64px;
	color: #4a4a4a; }
	
BODY.home #content H2 {
	background: none;
	height: 90px;
	width: 355px; }
	
BODY.home #slideshow {
	position: absolute;
	left: 36px;
	top: 302px; }

/* @end */

/* @group Services */

BODY.services .service-button {
	 height: 84px;
	 background: transparent url(../images/svc_hrt.jpg) 0 0 no-repeat;
	 margin-bottom: 1em;
	 margin-left: -12px;
	 width: 454px !important;
	 width /**/: 466px;
	 padding-right: 12px;
	 font-size: .9em;
	 position: relative; }
	 
	BODY.services .service-button H3 A {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		width: 100%;
		height: 84px;
		text-indent: -5000px; }
		
	BODY.services .service-button P {
		position: absolute;
		top: 28px;
		left: 168px;
		z-index: 2; }


BODY.services .vet { background-image: url(../images/svc_vet.jpg); }
BODY.services .pain { background-image: url(../images/svc_pain.jpg); }
BODY.services .peds { background-image: url(../images/svc_peds.jpg); }
BODY.services .derma { background-image: url(../images/svc_derma.jpg); }
BODY.services .eol { background-image: url(../images/svc_eol.jpg); }

BODY.services .vet P,
BODY.services .peds P,
BODY.services .eol P {
	 left: 12px;
	 width: 290px;}

/* @end */

	
BODY.about #content H2 { background-image: url(../images/ti_about.gif); }
BODY.about_us #content H2 { background-image: url(../images/ti_aboutus.gif); }
BODY.who_compounds #content H2 { background-image: url(../images/ti_whocompounds.gif); }
BODY.quality_assurance #content H2 { background-image: url(../images/ti_qualityassurance.gif); }
BODY.contact #content H2 { background-image: url(../images/ti_contact.gif); }
BODY.directions #content H2 { background-image: url(../images/ti_directions.gif); }
BODY.services #content H2 { background-image: url(../images/ti_services.gif); }
BODY.hrt #content H2 { background-image: url(../images/ti_hrt.gif); }
BODY.vet #content H2 { background-image: url(../images/ti_vet.gif); }
BODY.pain #content H2 { background-image: url(../images/ti_pain.gif); }
BODY.peds #content H2 { background-image: url(../images/ti_peds.gif); }
BODY.derma #content H2 { background-image: url(../images/ti_derma.gif); }
BODY.hospice #content H2 { background-image: url(../images/ti_hospice.gif); }
BODY.eol #content H2 { background-image: url(../images/ti_eol.gif); }
BODY.faq #content H2 { background-image: url(../images/ti_faq.gif); }
BODY.resources #content H2 { background-image: url(../images/ti_resources.gif); }
BODY.refills #content H2 { background-image: url(../images/ti_refills.gif); }




UL.two-col {
	float: left;
	clear: left;
	width: 100%;
	margin-top: .5em;
	margin-left: 1.5em;
	list-style: none; }

UL.two-col LI {
	margin: 0;
	padding: 0;
	width: 50%;
	float: left; }
	
	
.map {
	margin-left: -12px;
	margin-bottom: 1em; }

UL.pdf {
	margin-left: 4px;
	list-style: none; }
	
	UL.pdf LI {
		margin-left: 0;
		margin-bottom: .25em;
		padding-left: 24px;
		background: transparent url(../images/icn_pdf.gif) 0 0 no-repeat;
	}