/* here are all the containers used */
/* when doing by CSS; note I have left some tables in the programming for the index page */
/* menu container is in cssbutonsnew.css */
/* main page which is to be centered and for all absolutle positioning */
#container-page {
	position: relative;
	width: 750px;
	height: 500px;
	z-index: 10;
	text-align: center;
	top: 5px;
	margin-right: auto;
	margin-left: auto;
	background-color: #ffffff;
}

#ribbon-container1 {
	position: absolute;
	width: 26px;
	height: 22px;
	top: 67px;
	left: 0px;
	background-color: #FFFFFF;
	background-image: url(images/background/upperleftleft.jpg);
	background-repeat: no-repeat; 
	text-align: left;
	vertical-align: top;
	z-index: 100;

}
#ribbon-container2 {
	position: absolute;
	width: 125px;
	height: 22px;
	top: 67px;
	left: 26px;
	background-color: #197aa3;
	text-align: left;
	vertical-align: top;
	z-index: 100;
}
/* this is the full width blue line for those with no sub-pages */
#ribbon-container3a {
	position: absolute;
	width: 573px;
	height: 22px;
	top: 67px;
	left: 151px;
	background-color: #FFFFFF;
	background-image: url(images/background/bluebarhome.jpg);
	background-repeat: no-repeat; 
	text-align: left;
	vertical-align: top;
}
#ribbon-container3b {
	position: absolute;
	width: 26px;
	height: 22px;
	top: 67px;
	left: 151px;
	background-color: #197aa3;
	}
#ribbon-container4 {
	position: absolute;
	width: 100px;
	height: 22px;
	top: 67px;
	left: 177px;
	background-color: #197aa3;
	}	
#ribbon-container5 {
	position: absolute;
	width: 100px;
	height: 22px;
	top: 67px;
	left: 277px;
	background-color: #197aa3;
	}
#ribbon-container6 {
	position: absolute;
	width: 100px;
	height: 22px;
	top: 67px;
	left: 377px;
	background-color: #197aa3;
	}
#ribbon-container7 {
	position: absolute;
	width: 247px;
	height: 22px;
	top: 67px;
	left: 477px;
	background-color: #197aa3;
	}
#ribbon-container8 {
	position: absolute;
	width: 26px;
	height: 22px;
	top: 67px;
	left: 724px;
	background-color: #FFFFFF;
	background-image: url(images/background/rightsidetop.jpg) ; 
	background-repeat: no-repeat;
	text-align: left;
	vertical-align: top;

}
/* this is the text container which will also contain the pictures; need for background image */
#body-container, #body-indexcontainer {
	position: absolute;
	width: 573px;
	height: 357px;
	top: 89px;
	left: 151px;
	background-repeat: no-repeat;
	padding: 0px 0px 0 0; 
	z-index:60;
	text-align: left;
}
#body-containerstaff {
	position: absolute;
	width: 573px;
	height: 357px;
	top: 75px;
	left: 151px;
	background-repeat: no-repeat;
	padding: 0px 0px 0 0; 
	z-index:60;
	text-align: left;
}/* uses different background image */
#body-container {background-image: url(images/background/body3short.jpg);}
#body-indexcontainer {background-image: url(images/background/bodyhomeshort2.jpg) ;}
#text-container,#container-form {
	position: absolute;
	width: 326px;
	height: 357px;
	top: 0px;
	left: 17px;
	z-index:70;
}
#text-containeroverflow {
	position: absolute;
	width: 330px;
	height: 347px;
	top: 0px;
	left: 17px;
	z-index:70;
	overflow:auto;
	overflow-y:scroll;
	overflow-x:hidden;
}
#pic-container {
	position: absolute;
	width: 230px;
	height: 357px;
	top: 0px;
	left: 343px;
	margin: 0 0 0 0 ;
	z-index:70;
	text-align: center;
}
/* right column picture */
#right-container {
	position: absolute;
	width: 26px;
	height: 351px;
	top: 89px;
	left: 724px;
	background-image: url(images/background/rightsidebottom.jpg) ; 
	background-repeat: no-repeat; 
	z-index: 20;
}
#footer-container {
	position: absolute; 
	width: 425px;
	height: 22px;
	top: 448px;
	left: 117px;
	background-color: #ffffff;
	text-align: center;
	vertical-align: middle;
	z-index: 400;
	color: #898a8b;
	}
/* sometimes need for Ask a Horse */	
#footer-left {
	position: absolute; 
	width: 181px;
	height: 22px;
	top: 448px;
	left: 542px;
	background-color: #ffffff;
	text-align: center;
	vertical-align: middle;
	z-index: 400;
	}
#menucontainerask {
/* The master div to make sure that our popup menus get aligned correctly.  Be careful when playing with this one. */
	position:absolute;
	top: 67px;
	left: 0;
	margin: 0px;
	width: 151px;
	height: 357px;
	text-align: center;
	z-index: 90;
	background-image: url(images/background/leftaskahorse.jpg);
	background-repeat: no-repeat;
	
}
