body { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; z-index: 0; }
p, input, h1, h2, h3, h4, h5, h6, h7, ul, li, a, img { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font-family: arial, verdana, sans-serif;}
ins { text-decoration: none; }
.clearMe { clear: both; }


/* ---------------------------------- Structure ---------------------------------- */


body { 
	z-index: 0;
	background-color: #453d3a;
}



#wrapper {
	position: relative;
	z-index: 0;
	background-color: #453d3a;
	width: 100%; height: 100%;
}

#topBG {
	position: absolute; top: 0px; left: 0px;
	z-index: 1;
	width: 100%; height: 573px;
	background-color: #adadad;
}

#bottomBG {
	position: absolute; top: 573px; left: 0px;
	z-index: 1;
	width: 100%; height: 128px;
	background-color: #453d3a;
}

#centeredContainer {
	/* position: absolute: top: 0px; */
	position: relative;
	padding-top: 15px;
	margin-left: auto; margin-right: auto;
	z-index: 2;
	width: 916px;
}

#container {
	position: relative;
	width: 902px;
	padding: 0px 7px 0px 7px;
	background-image: url(../images/containerSlice6.png);
	background-repeat: repeat-y;
	z-index: 3;
	font-family: verdana, arial, sans-serif;
}

/*(old comments)
	Height of blue before the rounded corners is 66px
	Total height of blue is 76px
	Height of whole page before the blue is 940px.

	Container has the side dropshadow, so it needs to be 940 + 64 = 1004px high.
	Then the blue should be positioned at the bottom of it, but dropping down below the container by 12px (rounded corner + bottom drop shadow).
*/

#containerBottom {
	position: absolute; bottom: -46px; left: 0px;
	width: 916px; height: 46px;
	background-image: url(../images/bottom_bar6.png);
	z-index: 11;
	margin-left: auto; margin-right: auto;
}




/* ----- Top Area ----- */

#topArea {}

#headerArea {
	position: relative;
	width: 100%; height: 96px;
	background-color: #3668A5;
}

#topper {
	position: absolute; top: -5px; left: 0px;
	width: 902px; height: 5px;
	background-image: url(../images/topper2.gif);
}

#contactBlock {
	position: absolute; top: 20px; right: 35px;
	font-family: verdana, arial, sans-serif;
	font-size: 12px; color: white;
}

#mainLogo {
	position: absolute; top: 3px; left: 9px;
	width: 203px; height: 111px;
	z-index: 10;
	border: 0px;
}


#stripeSep {
	width: 100%; height: 6px;
	background-color: #335885;
}


/* ---- Nav ---- */

	#navArea { position: relative; }

	#mainNav {
		position: absolute; top: 43px; right: 50px;
		list-style-type: none;
		width: 640px; height: 28px;
		padding-left: 60px;
		background-color: #A6A296;
	}

	#grayTriangle {
		position: absolute; top: 0px; right: -25px;
		width: 25px; height: 28px;
		background-image: url(../images/gray_triangle.png); 
	}

	#mainNav li {
		float: left;
		height: 12px;
		margin: 0px 0px 0px 0px;
		padding: 7px 20px 9px 20px;
		font-family: verdana, arial, sans-serif;
		font-size: 12px;
		border-left: 1px solid white;
	}


	#mainNav li a:link { text-decoration: none; color: black; }
	#mainNav li a:visited { text-decoration: none; color: black; }
	#mainNav li a:hover { text-decoration: none; color: steelblue; }
	#mainNav li a:active { text-decoration: none; color: yellow; }

	.selectedMainNav {
		background-color: #453D3A; /* #295F9D; */
	}

	.selectedMainNav a:link { text-decoration: none; color: white !important; }
	.selectedMainNav a:visited { text-decoration: none; color: white !important; }
	.selectedMainNav a:hover { text-decoration: none; color: steelblue; }
	.selectedMainNav a:active { text-decoration: none; color: yellow; }




	.subNavList {
		position: absolute; top: 78px; right: 0px;
		list-style-type: none;
		width: 685px; height: 18px;
		background-color: black;
	}

	#blackTriangle {
		position: absolute; top: 0px; left: -23px;
		width: 23px; height: 18px;
		background-image: url(../images/black_triangle.png); 
	}

	.subNavList li {
		float: left;
		height: 12px;
		margin: 0px 0px 0px 0px;
		padding: 2px 32px 4px 32px;
		font-family: verdana, arial, sans-serif;
		font-size: 12px;
		border-left: 1px solid white;
	}

	.subNavList li a:link { text-decoration: none; color: white; }
	.subNavList li a:visited { text-decoration: none; color: white; }
	.subNavList li a:hover { text-decoration: none; color: steelblue; }
	.subNavList li a:active { text-decoration: none; color: yellow; }


	#selectedSubNav { 
		background-color: #453D3A; 
	}






/* ---- Mid Area ---- */

#midArea {
	position: relative;
	width: 100%; height: 210px;
}

#midPic {
	width: 902px; height: 210px;
	border: 0px;
}

#midOverlay {
	position: absolute; bottom: 0px; left: 0px;
	width: 100%; height: 44px;
	background-image: url(../images/textBar.png);
	z-index: 500;
}

#midOverlay p {
	width: 100%;
	padding: 9px 0px 0px 0px;
	color: white; font-size: 18px;
	text-align: center;
}

.taglineP { } /* same as #midOverlay P */


/* ---- Content Area ---- */

/*

#contentArea {
	position: relative;
	width: 100%; height: 305px;
	background-color: #515151;
}

#sideNav {
	position: absolute; top: 0px; left: 0px;
	width: 210px; height: 100%;
	background-color: #71716F;
	background-image: url(../images/sideBar_bg.jpg);
	background-repeat: no-repeat;
}

#mainContent {
	position: absolute; top: 0px; left: 210px;
	width: 692px; height: 100%;
	background-color: white;
}

*/



#contentArea {
	position: relative;
	width: 100%; min-height: 277px;

	background-color: #515151;
	background-color: #71716F;
}

/*	Could maybe put a fixed-px min-height on the sideNav equal to the sideBar_bg.jpg's height. 
	Also do the same with main-content...?
	*/
#sideNav {
	float: left;
	width: 210px; height: auto; height: 100%; min-height: inherit;

	background-color: #71716F;
	background-image: url(../images/sideBar_bg.jpg);
	background-repeat: no-repeat;
}

#mainContent {
	position: relative;
	float: right;
	padding-bottom: 40px;
	width: 692px; height: auto; height: 100%; min-height: inherit;
	background-color: white !important;
	z-index: 600;
}








#mainContentSep {
	width: 100%; height: 2px;
	background-color: #305582;
}

#contactInfo {
	/* To position immediately under the page title: position: absolute; top: 44px; left: 27px; */
	position: absolute; bottom: 15px; right: 25px;
}
#contactInfo p {
	font-family: verdana, arial, sans-serif;
	color: steelblue;
	font-size: 14px;
}
#contactInfo p a:link { text-decoration: none; color: steelblue; }
#contactInfo p a:visited { text-decoration: none; color: steelblue; }
#contactInfo p a:hover { text-decoration: none; color: red; }
#contactInfo p a:active { text-decoration: none; color: yellow; }



/* ----- BOTTOM / FOOTER ----- */


#legal {
	position: absolute; top: 50px; left: 0px;
	width: 100%;
}
#legal p {
	font-family: verdana, arial, sans-serif;
	color: white;
	font-size: 12px;
	text-align: center;
}
#footer {
	position: relative;
	margin: 10px 0px 0px 0px;
}
.footerLinksRow {
	margin: 5px 0px 0px 0px;
	width: 100%;
	font-family: verdana, arial, sans-serif;
	color: white;
	font-size: 12px;					
	text-align: center;
}
.footerLinksRow a {
	margin: 0px 15px 0px 15px;
}
.footerLinksRow a:link { text-decoration: none; color: white; }
.footerLinksRow a:visited { text-decoration: none; color: white; }
.footerLinksRow a:hover { text-decoration: none; color: red; }
.footerLinksRow a:active { text-decoration: none; color: yellow; }




/* ------------- Side Nav ----------------- */

	#sideNav {
		position: relative;
	}

	.sideNavDivItem {
		position: relative;
		margin-left: 5px; height: 22px;
	}

	.sideNavMainHeader {
		position: absolute; top: 2px; left: 5px;
		color: white;
		font-size: 15px; font-weight: bold;
	}

	.sideNavMainHeader p a:link { text-decoration: none; color: white; }
	.sideNavMainHeader p a:visited { text-decoration: none; color: white; }
	.sideNavMainHeader p a:hover { text-decoration: none; color: steelblue; }
	.sideNavMainHeader p a:yellow { text-decoration: none; color: yellow; }

	.sideNavMainHeader p {
		margin: 4px 0px 0px 10px;
	}

	/* The main header doesn't look good at 22px height, so this is a special-case 24px high.
	*  Note also that it has it's own special selection class, whereas the other items all get the
	*  same selection class. This technique can be used to differentiate the section headers too, if necessary.
	*/
	#selectedSideNavMainHeader {
		width: 205px; height: 24px;
		color: #2F5582;
		background-image: url(../images/finger_selector2.png);
	}

	/* Just so it's a different color when selected */
	#selectedSideNavMainHeader p a:link { text-decoration: none; color: #2F5582; }
	#selectedSideNavMainHeader p a:visited { text-decoration: none; color: #2F5582; }
	#selectedSideNavMainHeader p a:hover { text-decoration: none; color: steelblue; }
	#selectedSideNavMainHeader p a:yellow { text-decoration: none; color: yellow; }




	#selectedSideNav {
		padding-top: 3px;
		width: 205px; height: 19px;
		background-image: url(../images/finger_selector3.png);
	}

	.sideNavSubSectionHeader {
		margin-top: 7px;
	}

	.sideNavSubSectionHeader p {
		margin: 0px 0px 0px 35px;
		font-size: 12px; color: black; font-weight: bold; 
	}

	.sideNavSubSectionHeader p a:link { text-decoration: none; color: black; }
	.sideNavSubSectionHeader p a:visited { text-decoration: none; color: black; }
	.sideNavSubSectionHeader p a:hover { text-decoration: none; color: white; }
	.sideNavSubSectionHeader p a:active { text-decoration: none; color: yellow; }
	
	.sideNavLeafItem {
		margin-top: 4px;
	}

	.sideNavLeafItem p {
		margin: 0px 0px 0px 63px;
		font-weight: normal; font-size: 12px; color: black;
	}

	.sideNavLeafItem p a:link { text-decoration: none; color: black; }
	.sideNavLeafItem p a:visited { text-decoration: none; color: black; }
	.sideNavLeafItem p a:hover { text-decoration: none; color: white; }
	.sideNavLeafItem p a:active { text-decoration: none; color: yellow; }

	/*

	#sideNavLists, #sideNavList div p, #sideNav_lev2, #sideNav_lev2 div p {
		font-family: verdana, arial, sans-serif;
	}

	#sideNavLists {
		margin: 0px 0px 0px 35px;
	}

	.sideNavSubSectionHeader {
		font-size: 12px; color: black; font-weight: bold; 
	}

	.sideNavSubSectionHeader a:link { text-decoration: none; color: black; }
	.sideNavSubSectionHeader a:visited { text-decoration: none; color: black; }
	.sideNavSubSectionHeader a:hover { text-decoration: none; color: white; }
	.sideNavSubSectionHeader a:active { text-decoration: none; color: yellow; }
	
	.sideNav_lev2 {
		list-style-type: none;
		margin: 0px 0px 0px 28px;
	}

	.sideNav_lev2 div p{
		font-weight: normal; font-size: 12px; color: black;
		margin: 4px 0px 0px 0px;
	}

	#sideNavLists div a:link { text-decoration: none; color: black; }
	#sideNavLists div a:visited { text-decoration: none; color: black; }
	#sideNavLists div a:hover { text-decoration: none; color: white; }
	#sideNavLists div a:active { text-decoration: none; color: yellow; }
	*/






	/* ---- Other  ---- */

	#social_links {
		position: absolute; top: -4px; right: 14px;
	}

	.social_area {
		float: left;
		margin-right: 6px;
		width: 32px; height: 32px;
	}

	.social_area a:link { }

	.social_area a img { border: 0px; }


	.buttonLink:link { text-decoration: none; color: #3668a5; }
	.buttonLink:visited { text-decoration: none; color: #3668a5; }
	.buttonLink:hover { text-decoration: none; color: black; }
	.buttonLink:active { text-decoration: none; color: yellow; }


	#contentBox {
		padding: 25px 50px 25px 25px;

	}

	.pageTitle {
		font-family: arial; font-size: 20px; font-weight: bold; color: #3668a5;
		margin: 15px 0 0 25px;
	}

	#nl_link {
		margin: 0px 0px 0px 25px;
	}
	.nl_link a:link { font-size: 14px; color: steelblue; text-decoration: underline; }
	.nl_link a:visited { font-size: 14px; color: steelblue; text-decoration: underline; }
	.nl_link a:hover { font-size: 14px; color: red; text-decoration: underline; }
	.nl_link a:active { font-size: 14px; color: yellow; text-decoration: underline; }

	#newsletterIndexList {
		margin: 0px 0px 0px 25px;
	}

	.newsletterIndexItemTitle { font-family: verdana, arial, sans-serif; font-size: 12px; }
	
	.newsletterIndexItemTitle a:link { font-size: 14px; color: steelblue; text-decoration: underline; }
	.newsletterIndexItemTitle a:visited { font-size: 14px; color: steelblue; text-decoration: underline; }
	.newsletterIndexItemTitle a:hover { font-size: 14px; color: red; text-decoration: underline; }
	.newsletterIndexItemTitle a:active { font-size: 14px; color: yellow; text-decoration: underline; }

	.newsletterBlockHeader { 
		color: steelbue; font-size: 14px; font-weight: bold; 
		margin: 20px 0px 0px 0px;	
	}

	.articleSubtitle {
		margin: 0px 0px 0px 25px;
	}

	.articleReference {
		font-family: arial; font-size: 13px; font-weight: normal; color: #333; font-style: italic;
	}

	.articleDate {
		font-family: arial; font-size: 13px; font-weight: normal; color: #333; font-style: italic;
	}

	#article_content_header {
		font-weight: bold;
	}

	#article_file_ref {
		font-family: arial; font-size: 13px; font-weight: normal; color: #333; font-style: italic;
		margin: 0px 0px 0px 25px;
	}

	.articleIndexItem {
		margin: 0px 0px 0px 25px;
	}

	.articleIndexItemTitle { font-family: verdana, arial, sans-serif; font-size: 12px; }
	
	.articleIndexItemTitle a:link { font-size: 14px; color: steelblue; text-decoration: underline; }
	.articleIndexItemTitle a:visited { font-size: 14px; color: steelblue; text-decoration: underline; }
	.articleIndexItemTitle a:hover { font-size: 14px; color: red; text-decoration: underline; }
	.articleIndexItemTitle a:active { font-size: 14px; color: yellow; text-decoration: underline; }


	
	.articleIndexDetails {
		font-family: verdana, arial, sans-serif;
		font-size: 12px; font-weight: normal; color: #222;
	}

	.text {
		font-family: arial; font-size: 13px; color: black; line-height: 16px;
	}

	.buttonBox {
		width: 220px; height: 250px; float: left;
		margin: 15px 5px 0 0;
	}

	.button {
		background-image: url(../images/button.jpg); 
		width: 201px; height: 44px; 
		margin: 15px 20px 20px;
	}

	.buttonText {
		font-family: arial; font-size: 15px; font-weight: bold; color: #3668a5;
		text-align: center; margin: 15px 0 0 0;
	}

	.truckButton {
		margin: 10px 0px 0px 15px;
		border: 0px;
	}

	.truckLink a:link { border: none; color: white !important; }
	.truckLink a:visited { text-decoration: none; color: white !important; }
	.truckLink a:hover { text-decoration: none; color: steelblue; }
	.truckLink a:active { text-decoration: none; color: yellow; }

	/* DM, 2010-11-26. These shouldn't be floated, their parent container is already floated.
	#box1 {
		float: left; 
	}

	#box2 {
		float: left;
	}

	#box3 {
		float: left;
	}
	*/

	.truckIndexButton { /* DM, 2010-11-26. So we can target truck-buttons specifically. */
		position: relative;
	} 

	.truckIndexText { /* DM, 2010-11-26. So we can target truck-buttons specifically. */
		padding-top: 14px;
	}

    .catBox {
		/* width: 620px; height: 150px;
		margin: 0px 0px 10px 30px; */

		width: 620px;
		margin: 0px 0px 40px 20px;
	}
	.catBoxItemBlocksNoImage { /* DM, 2010-11-28. Allows for automatic handling of item_blocks that don't have images. */
		width: 630px;
		margin: 0px 0px 40px 20px;
	}

	.catBoxRental {
		width: 620px;
		margin: 0px 0px 0px 30px;
	}

	.catHeader {
		font-family: arial; font-size: 18px; font-weight: normal; color: #305582; margin: 0 0 5px 0;
	}

	.catText {
		font-family: arial; font-size: 13px; font-weight: normal; line-height: 16px; color: #222; text-align: justify;
	}

	.picBox {
		float: left;
		margin-right: 20px;
	}

	.picBox img {
		width: 131px; height: 131px;
		border: 1px solid black;
	}

	.textBox {
		float: left; width: 440px; margin: 0px 10px 0 15px;
	}
	.textBoxItemBlocksNoImage { /* DM, 2010-11-28. Allows for automatic handling of item_blocks that don't have images. */
		float: left; width: 630px; margin: 0px 10px 0 0px;
		text-align: justify;
	}

	.textBoxRental {
		float: left; width: 610px; margin: 30px 10px 0px -3px;
	}

	.catBoxLong {
		width: 620px; height: 250px;
		margin: 0px 0px 20px 30px;
	}

	#truckTextBox {
		float: left;
		width: 350px;
		font-family: arial; font-size: 13px; 
		margin: 15px 0 0 0;
	}

	#truckImageBox { /* -DM, 2010-11-26 */
		margin: 10px 30px 10px 25px;
		float: left;
	}
	.truckImage {
		width: 250px; height: 172px; overflow: hidden; /* -DM, 2010-11-26 */
	}

	.truckMainThumb {
		float: left;
		border: 1px solid black;
	}

	.truckLayoutImage { /* -DM, 2010-11-26 */
		width: 450px; height: 196px; overflow: hidden; 
	}

	#truckBox {
		float: right; margin: 20px 20px 0 0;
	}

	#pdfBox {
		width: 180px; float: left;
		border: 2px solid gainsboro;
		margin: 25px 0 0 10px;
		padding: 10px 10px 10px 10px;
	}

	.header {
		text-align: center;
		font-family: 15px; color: #444; font-weight: bold;
	}

	.pdfImage {
		float: left;
	}

	.pdfText {
		font-family: arial; font-size: 16px; color: #444;
		font-weight: bold; margin: 0px 0 5px 15px;
		float: left;
	}

	.pdfItem {
		margin: 0px 0 0 20px;

	}

	.pdfLink:link { text-decoration: none; color: black; }
	.pdfLink:visited { text-decoration: none; color: black; }
	.pdfLink:hover { text-decoration: none; color: red; }
	.pdfLink:active { text-decoration: none; color: yellow; }


	.pageImage {
		margin: 15px 5px 15px 0px;
		border: 1px solid black;
	}
	
	.truckList {
		margin: 10px 0 0 15px;
	}

	.listItem {
		font-size: 12px; margin-top: 6px;
	}



	/* ---------------- MANAGEMENT RELATED CLASSES ----------------- */

	.addNewPageLink { color: darkblue !important; text-decoration: underline !important; }
	.addNewPageLink:link { color: darkblue !important; }
	.addNewPageLink:visited { color: darkblue !important; }
	.addNewPageLink:hover { color: red !important; }
	.addNewPageLink:active { color: yellow !important; }

	.manageEditP {
		color: blue !important; font-size: 10px !important; font-weight: normal !important;
	}

	.manageEditLink:link { color: blue !important; text-decoration: underline !important; font-size: 10px !important; font-weight: normal !important; }
	.manageEditLink:visited { color: blue !important; text-decoration: underline !important; font-size: 10px !important; font-weight: normal !important; }
	.manageEditLink:hover { color: red !important; text-decoration: underline !important; font-size: 10px !important; font-weight: normal !important; }
	.manageEditLink:active { color: yellow !important; text-decoration: underline !important; font-size: 10px !important; font-weight: normal !important; }

	/* General Delete Links */
	.manageDeleteLink:link { color: red !important; text-decoration: underline !important; font-size: 10px !important; font-weight: normal !important; }
	.manageDeleteLink:visited { color: red !important; text-decoration: underline !important; font-size: 10px !important; font-weight: normal !important; }
	.manageDeleteLink:hover { color: purple !important; text-decoration: underline !important; font-size: 10px !important; font-weight: normal !important; }
	.manageDeleteLink:active { color: yellow !important; text-decoration: underline !important; font-size: 10px !important; font-weight: normal !important; }

	/* Just the "Delete Page" Link */
	.manageDeletePageLink:link { color: red !important; text-decoration: underline !important; font-size: 11px !important; font-weight: normal !important; }
	.manageDeletePageLink:visited { color: red !important; text-decoration: underline !important; font-size: 11px !important; font-weight: normal !important; }
	.manageDeletePageLink:hover { color: purple !important; text-decoration: underline !important; font-size: 11px !important; font-weight: normal !important; }
	.manageDeletePageLink:active { color: yellow !important; text-decoration: underline !important; font-size: 11px !important; font-weight: normal !important; }


	#auth_links { position: absolute; bottom: -20px; left: 25px; z-index: 501; }
	
	#auth_links a:link { color: white; font-size: 11px; text-decoration: underline; }
	#auth_links a:visited { color: white; font-size: 11px; text-decoration: underline; }
	#auth_links a:hover { color: red; font-size: 11px; text-decoration: underline; }
	#auth_links a:active { color: yellow; font-size: 11px; text-decoration: underline; }


	#manageLinkSet { /* goes at top right of image, and gets a white bg */
		padding: 2px 7px 7px 12px;
		background-color: white;
		position: absolute; top: -210px; right: 0px;
		z-index: 500;
	}
	
	#coreDataManageSet { /* goes above page title */
		/* position: absolute; top: -1px; left: 26px; */
		margin: 5px 0px 0px 26px;
	}

	#manageLowerLeft {
		/* To position immediately under the page title: position: absolute; top: 44px; left: 27px; */
		position: absolute; bottom: 15px; left: 15px;
	}

	#manageTopRight {
		position: absolute; top: 11px; right: 10px;
	}

	.manageOrdering {
		position: absolute; top: 0px; left: -22px;
		color: darkblue !important;
		font-size: 10px !important;
		font-weight: normal !important;
	}

	.truckIndexTruckEdit {
		position: absolute; bottom: 4px; right: 8px;
	}
	
	#editGalleryTagsBlock {
		font-size: 12px; font-family: verdana, arial, sans-serif; font-weight: normal;
		color: #222;
		position: absolute; top: 160px; right: 30px;
	}

	.manageEditGalleryTagsLink:link { color: blue !important; text-decoration: underline !important; font-size: 12px !important; font-weight: normal !important; }
	.manageEditGalleryTagsLink:visited { color: blue !important; text-decoration: underline !important; font-size: 12px !important; font-weight: normal !important; }
	.manageEditGalleryTagsLink:hover { color: red !important; text-decoration: underline !important; font-size: 12px !important; font-weight: normal !important; }
	.manageEditGalleryTagsLink:active { color: yellow !important; text-decoration: underline !important; font-size: 12px !important; font-weight: normal !important; }

	.leafOrdering { }

	

	/* -------------------- NIVO SLIDER STUFF ----------------------- */

	#slider {
		position:relative;
		width:618px; /* Change this to your images width */
		height:246px; /* Change this to your images height */
		background:url(images/loading.gif) no-repeat 50% 50%;
	}
	#slider img {
		position:absolute;
		top:0px;
		left:0px;
		/* display:none; */
	}
	#slider a {
		border:0;
		display:block;
	}