/* JBC Web Design and Computer Services www.pghpchelp.com
   CSS for the site. */
   
   
/*/////////////////////////////////////////////////////////////////////
---> Education Body, Paragraph Information
/////////////////////////////////////////////////////////////////////*/

body {
	color: #000000;
	margin: 2px auto;
	margin-bottom: 0px;
	overflow: visible;
	}

p {
	padding: 0px 0px 0px 0px; /*If four values are given, they apply to top, right, bottom, and left padding, respectively. If one value is given, it applies to all sides. If two or three values are given, the missing values are taken from the opposite side. */
	margin-top: 0px; /* controls the distance between p1 and p2 sections. Top and bottom. */
	text-align: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 12pt;
	overflow: visible;
	}

#edu-faq-p {
	padding-left: 25px;
	padding-right: 25px;
	color: #000000;
	}

#ho-faq-li1 {
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	list-style: none;
	font-weight:bold;
	color: #000000;
	}

		
#ho-faq-li2 {
	margin-left: 55px;
	list-style: square;
	margin-bottom: 15px;
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	}
	
#index-bottom-p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 12.5pt;
	font-style: normal;
	text-align: left;
	}

/*///////////////////////////////////////////////////////////////////
---> Universal CSS
/////////////////////////////////////////////////////////////////////*/

#container { 
    width: 580px; /* sets the width of the container to keep in body, p, h3's */
	background: #fff url(../images/ml-body.jpg) no-repeat;
	margin: 0px auto; 
	padding-top: 0px;
	overflow: visible;
	}

#pageHeader { 
    width: 580px; 
	height: 89px; 
    background: transparent url(../images/ml-PageHeader.jpg) no-repeat top center;
/*	margin-bottom: -6px;*/
	}
	
#jbc-logo {
	width: 263px;
	height: 86px;
	background: transparent url(../images/ml-jbc-logo.jpg) no-repeat top center;
	float: left;
	}
	
#lips {
	width: 317px;
	height: 87px;
	background: transparent url(../images/ml-lips.jpg) no-repeat top center;
	float: right;
	}	
	
#logo img {
	display: none;
	}

#navBarBackground
	{	
	width: 580px;
	height: 35px;
	background-image: url(../images/ml-navBarBackground.jpg);
	background-position: center;
	background-repeat: no-repeat;
	padding-bottom: 0px;	
	}	
	
#supportingText {
	width: 580px;
    background: url(../images/ml-footer.jpg) no-repeat bottom; 
	}	
	
	
#footer { 
    font-size: 12px;
   	text-align: right; 
	}

#footer a:link, #footer a:visited { 
 	margin-top: 5px;
    color: #003366;
	padding: 0px 0px 0px 10px;	
	}
	

/*#headerContacts {
	width: 223px;
	height: 89px;
	background: transparent url(images/contacts.jpg) no-repeat top center;
	float: right;
	padding-right: 0px;
	}*/
	
/*#headerURL {
	width: 313px;
	height: 19px;
	background: transparent url(images/headerURL.jpg) no-repeat top center;
	float: right;
	clear: left;
	padding-right: 8px;
	}	*/

/*#bodyBorderTopRight {
	width: 156px;
	height: 121px;
	background: transparent url(images/bodyBorderTopRight.jpg) no-repeat;
	position: fixed;
	float: right;
	padding-right: 0px;
	left: 498px;
	top: 146px;
	}	
*/	



	
/*///////////////////////////////////////////////////////////////////
---> Tables, DIV's Information for Images
///////////////////////////////////////////////////////////////////*/

/*---> index.html
///////////////////////////////////////////////////////////////////*/
	
#edu-index-header {
	width: 579px;
	height: 303px; 
	background: transparent url(../images/edu-index-header.jpg) no-repeat top center;
	}
	
#edu-index-bottom1 {
	width: 580px;
	height: 168px; 
	background: transparent url(../images/edu-index-BottomPic1.jpg) no-repeat top center;
	}

#edu-index-bottom2{
	width: 580px;
	height: 168px; 
	background: transparent url(../images/edu-index-BottomPic2.jpg) no-repeat top center;
	}

/*---> services.html
///////////////////////////////////////////////////////////////////*/
	
#edu-services-div-header	{
	width: 580px;
	height: 51px; 
	background: transparent url(../images/edu-services-div-header.jpg) no-repeat top center;
	}
	
#edu-services-div-bckgd {
	width: 580px;
	height: 1100px; 
	background: transparent url(../images/edu-services-div-bckgd.jpg) repeat-y;
	}

#edu-services-div-footer {
	width: 580px;
	height: 29px; 
	background: transparent url(../images/edu-services-div-footer.jpg) no-repeat;
	}

#edu-services-table-bckgd {
	width: 535px;
	height: 212px; 
	background: transparent url(../images/edu-services-div-table-back.jpg) no-repeat;
	}
	

/*---> eportfolio.html
///////////////////////////////////////////////////////////////////*/

#edu-eportfolio-div-bckgd {
	width: 580px;
	height: 700px; 
	background: transparent url(../images/edu-services-div-bckgd.jpg) repeat-y;
	}
	
#edu-eportfolio-table-background {
	width: 539px;
	height: 679px; 
	background: transparent url(../images/edu-ePort-div-table-backgr.jpg) no-repeat;
	}
	
#edu-specials-div-header	{
	width: 580px;
	height: 51px; 
	background: transparent url(../images/edu-specials-div-title.jpg) no-repeat top center;
	}
	
		
/*---> faq.html
///////////////////////////////////////////////////////////////////*/	

	
#edu-faq-div-bckgd {
	width: 580px;
	height: 950px; 
	background: transparent url(../images/edu-services-div-bckgd.jpg) repeat-y;
	}

#edu-faq-div-header	{
	width: 580px;
	height: 51px; 
	background: transparent url(../images/edu-faq-div-title.jpg) no-repeat top center;
	}		
	
#edu-faq-div-footer {
	width: 580px;
	height: 29px; 
	background: transparent url(../images/edu-services-div-footer.jpg) no-repeat;
	}
	
#edu-faq-div-table-background {
	width: 539px;
	height: 950px;
	margin: 0px 0px 0px 20px;
	background: transparent url(../images/edu-faq-div-table-backgd.jpg) no-repeat;
	}	
	
/*---> contact.html
///////////////////////////////////////////////////////////////////*/

#edu-contact-div-bckgd {
	width: 580px;
	height: 920px; 
	background: transparent url(../images/edu-services-div-bckgd.jpg) repeat-y;
	}

#edu-contact-div-header	{
	width: 580px;
	height: 51px; 
	background: transparent url(../images/edu-contact-div-title.jpg) no-repeat top center;
	}

#edu-contact-div-table-background {
	width: 535px;
	height: 920px;
	margin: 0px 0px 0px 20px;
	background: transparent url(../images/edu-contact-div-table-bg.jpg) no-repeat;
	}

#edu-contact-p {
	text-align: center;
	font-size:20px;
	font-family: "Times New Roman", Times, serif;
	color: #FFFFFF;
	}		



/*///////////////////////////////////////////////////////////////////
---> Navigation Bar Information
///////////////////////////////////////////////////////////////////*/
/* Navbar button widths
This allows the navigation bar to align precisely with the border of the container.
Only need to make first images bigger to align the last imagee link and list-item widths correspond with image widths */

#eduNavBar, #eduNavBarButton, #eduNavBarButton:visited {
	width:140px;
	text-indent: 35px;
	}

#eduServicesNavBar, #eduServicesNavBarButton, #eduServicesNavBarButton:visited {
	width: 130px;
	text-indent: 35px;
	}	

#eduSpecialsNavBar, #eduSpecialsNavBarButton, #eduSpecialsNavBarButton:visited {
	width: 110px;
	text-indent: 22px;
	}
	
#eduFAQNavBar, #eduFAQNavBarButton, #eduFAQNavBarButton:visited {
	width: 90px;
	text-indent: 17px;
	}
	
#educontactNavBar, #educontactNavBarButton, #educontactNavBarButton:visited {
	width: 110px;
	text-indent: 18px;
	}
	
	
/*///////////////////////////////////////////////////////////////////
---> Image Information
///////////////////////////////////////////////////////////////////*/	
	
#edu-eportfolio-image {
	float: left;
	height: auto;
	position: relative;
	visibility: visible;
	z-index: auto;
	top: auto;
	}

#edu-eportfolio-image-right {
	float: right;
	height: auto;
	position: relative;
	visibility: visible;
	z-index: auto;
	top: auto;
	}
	
p img{
	margin: 5px 10px 5px 10px;
	}
	
/*///////////////////////////////////////////////////////////////////
---> Contact Form Information
///////////////////////////////////////////////////////////////////*/	

#ho-contact-mailing-address {
	padding-left: 100px;
	color: #000000;
	}

#ho-contact-p {
	padding-left: 75px;
	padding-right: 50px;
	}
	
.cssform p {
width: 300px;
float: left;
margin: 0;
padding: 5px 0px 8px 0px;
padding-left: 100px; /*width of left column containing the label elements*/
height: 1%;
}

.cssform label{
font-weight: bold;
float: left;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

p.centerAlign {
	padding: 0px 0px 0px 290px;
	}
