/*
Yorketowne November 05 2007  CSS by Eugen Luca.
Whole site CSS style sheet.Covers both 1 and 2 colums pages.
Footer stick to botom of viewport browser.Coding from http://ryanfait.com/sticky-footer/
Does not work for IE on Mac.Tested in IE 5 and up, Firefox, Safari and Opera.
*/

* {
margin: 0 auto;
padding: 0;}

html, body {height: 100%;}   /* this is what makes the footer to always stay on the bottom */

body {
background:rgb(2,80,100) url(../html-images/bg.jpg) repeat-y center top;
font: normal 16px "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #000000;}

h1 {  /*red used on main headings */          
margin-bottom: .5em; 
font-size: 150%;
font-weight: normal;
color:#930400;
text-decoration:none;}

h2 { /*black used on tables */
font-size: 85%;     
font-weight: bold;
color:#006699;}

h3 { /*blue used on equipment names */
font-size: 125%;
font-weight: bold;
color:#006699;}

h4 { /*black used on tables */
font-size: 85%;
font-weight: bold;
color:#000000;}
	 	 
h5 {
font-size: 100%;
padding: 5px 0 0 0;
color:#930400;
font-weight:bold;
}	

a {
text-decoration: underline;
color: #930400;
}

a:hover {
text-decoration:none;
color: #fff;
background:#930400;
}

ul li {  /* list with the orange dot  */
line-height:150%;
background: url(../html-images/img07.gif) no-repeat left top ;
padding-left: 1em;
font-size: 85% ; 
color:#000000;
list-style:none; }	

/* Image positioning */
.ISO_images { 
float:none;
padding:20px;}
.image_index { float:none;padding: 10px;margin:auto;}
.image_right { 
float:right; 
margin:0 0 0 10px;}				 		 	 
/*all_products page for logos*/
.image_products {
float: left;
margin: 0 20px 0 0;}					 				 	

/* Page */
#wrapper {
width:800px;
min-height: 100%;
height:auto !important;
height: 100%;
margin: 0 auto -125px; /* this is the negative value of the footer's height.IF YOU CHANGE FOOTER HEIGHT CHANGE THIS ONE TOO */
background:url(../html-images/bgcontent.gif);}

/* Logo */

#logo {
width: 800px;
height: 200px;
margin: 0 auto;
background:url(../html-images/TOP-LOGO.gif);}	

 /* Menu */

#menu { margin: 0;	}

/* Content */

#content_2columns {
float: left;
width: 565px;
margin:0;
padding: 20px 15px 0 20px;
text-align:justify;
background:url(../html-images/bgcontent.gif);}
				   
#content_1column {
width: 760px;
margin:0;
padding: 20px 20px 0 20px;
text-align:justify;
background:#fff;}	
				  
/* Only for 2 columns pages */

#sidebar {
float: right;
margin:0;
width: 180px;
padding:0 5px 0 0px;}

/*Used on sidebar. contains the green header and all other styles */
			
#Sidebar_listings  { 
width: 180px;
float:right;
font size-85%;
font: normal 12px "Verdana", Arial, Helvetica, sans-serif;  
color:#000000;}

.sidebar_styles { }

.sidebar_styles .title { 
background:url(../html-images/prod_hdr_bgn.gif);
margin-top:10px;
margin-bottom:5px;
padding: 0px;
font: bold 12px "Verdana",Arial, sans-serif;
color: #000;
padding:4px;
border: 1px solid #000000;}

.sidebar_styles ul {}

.sidebar_styles ul li {  
padding: 5px;
line-height: 150%;
border-bottom: 1px dotted #CFCFCF;
padding-left: 1em;
list-style:none;}
				
/* image on the sidebar listings,IE7 and Firefox to center image */						
.img_sidebar { 
width: 170px;
margin:0; 
padding-left: 0px;}	/* this was 4px but a red line was showing on left*/		

/* Additional sidebar styles to support side by side photos for two new members */

#NP_Pic_Left {
    float: left;
    width: 77px;
    margin-left: 2px;
    margin-right: 2px;
    border: thin solid black;
}

#NP_Pic_Right {
    float: left;
    width: 77px;
    margin-left: 2px;
    margin-right:6px;
    border: thin solid black;
}

#NP_Pics {
    width: 170px;
}

#NP_LHN {
    text-align: center;
    font-weight: bold;
}

/* .noscript class div is under the flash movies,if flash or Javascript not enabled */
.noscript { 
font: normal 10px "Arial", Helvetica, sans-serif; 
color:#FFFFFF; }
			
.YorkeTowne_text { 
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: bold;
font-size: 18px;
color: #006699;}
				  
/* this is the yellow div.expands the whole window */
.YT    {  
padding:5px 20px 5px 20px;  
margin: 0;
font-size:85%;
background:#FFFFCC;
border:#CCCCCC 1px dashed;}

/* small yellow div,same as above but float to the right */
.YT_small  {  
float:right;
padding: 5px 5px 5px 5px;
text-align:center;
font-size:85%;
width: 300px;
margin: 0;
background:#FFFFCC;
border:#CCCCCC 1px dashed;}	
			
/* small yellow div,same as above but float to the right */			 
.YT_small_left { 
float:left;
padding: 5px 5px 5px 5px;
text-align:center;
font-size:85%;
width: 300px;
margin: 0;
background:#FFFFCC;
border:#CCCCCC 1px dashed;}	

/* small yellow div, on right side,used on Graco guns and Graco Proportioners to send users to tech page*/
.guns_small {margin-top:10px;margin-bottom:5px;font-family: verdana, arial, sans-serif;
font-size: 11px;text-align:center;color: #000;padding:4px;border: 1px dashed #cccccc;background-color: #FFFFCC;}
			
.trybe4buy   { 
float:right;
width:144px;
padding:1px;
margin:0;
background:#990000;}	
			   		
/* Quick Links gray div */

#Links { 
width: 175px;
float: right;
font-size: 75%;
margin-left:20px;}

.quick_links { }

.quick_links .title { 
height:20px;
font-size: 85%;
font-weight: bold;
padding:5px 0 0 10px;
color:#000000;
background:url(../html-images/quick-links-title.gif) }
				  			   
.quick_links ul {}

.quick_links ul li {
padding: 5px;
background:#999999;
border-bottom: 1px dotted #CFCFCF;
padding-left: 1em;
list-style:none;}		  

.quick_links a { 
text-decoration: none;
color: #000000;}
	
.quick_links a:hover {
text-decoration:none;
color: #000000;
background:#cccccc;}

/* Quick Links gray div for 2 columns */

#Links2 { 
width: 175px;
font-size: 75%;}
.quick_links { }
.quick_links .title { 
height:20px;
font-size: 85%;
font-weight: bold;
padding:5px 0 0 10px;
color:#000000;
background:url(../html-images/quick-links-title.gif) }				  			   
.quick_links ul {}
.quick_links ul li {
padding: 5px;
background:#999999;
border-bottom: 1px dotted #CFCFCF;
padding-left: 1em;
list-style:none;}

.quick_links a { 
text-decoration: none;
color: #000000;
}

.quick_links a:hover {
text-decoration:none;
color: #000000;
background:#cccccc;
}

/* this is the background color div on top of Proportioners page */			
.Graco_descript_proportioners  { 
clear:both;
padding: 10px 10px 10px 20px;
margin:0;
background:#9da28c;
color:#FFFFFF;
}		

.clear_div_2columns { 
clear:both;
padding: 5px;
height:2px;
margin: 0;
}	

.clear_div_1column { 
clear:both;
padding:5px;
height:2px;
margin: 0;
background:#fff;
}	   

/* this is to list the YT products on index  and on Graco Proportioners */
.index_products_listing  { 
padding:0px;
margin:10px;
}

/*this used on Coatings page to list coatings products */
.descript { 
padding: 0 40px 0 40px;
margin:20px 0 20px 0;
}

/* Footer */

#footer, .push {height: 125px} /* this has to be the EXACT height of the footer */

#footer {
height: 125px;
width:800px;
margin:0 auto;
clear:both;
background:#930400;
text-align:center;
font-size:85%;
color:#ffffff;
}

#footer { }

#footer a {
text-decoration: none;
color: #cccccc;
font-size:85%;}

#footer a:hover {
text-decoration:none;
color: #000000;
background:#cccccc;}

/* Product Frame for New Product Page */

.PF_ProductFrame{
    float: left;
    width: 760px;
    border: thin solid black;
}

.PF_Left{
    float: left;
    width: 540px;
    /*background-color: teal;*/
    padding: 10px;
}

.PF_Right{
    float: left;
    width: 200px;
    height: 100%;
    /*background-color: brown;*/
}

.PF_Header{
    float: left;
    width: 760px;
 /*   height: 40px;*/
    background-color: grey;
    border-bottom: solid thin black;
}

.PF_Footer{
    float: left;
    width: 760px;
   /* height: 30px;*/
    background-color: rgba(255, 255, 204, 1);
    border: dashed thin grey;
    border-right: none;
    border-left: none;
    margin-bottom: 1px;
    text-align: center;
}

.PF_H_Logo{
    float: Left;
    width: 54px;
    background-color: white;
    border: solid thin black;
    border-top: none;
    border-left: none;
    border-bottom: none;
    padding: 2px;
}


.PF_H_Manufacturer{
    color: blue;
}

.PF_H_Title{
    float: left;
    margin-left: 10px;
    margin-top: 12px;
    font-size: xx-large;
}

.PF_L_Desciption{
    float: left;
    width: 100%;
}

.PF_L_Features{
    float: left;
    width: 100%;
}

.PF_R_PictureBar{
    /* Make sure to set the negative left and top margin */
    float: left;
    width: 100%;
    height: 100%;
    margin: 0px;
    margin-top: 0px;
    margin-left: 0px;
}

.PF_R_PB_PicFrame{
    float: left;
    width: 100%;
    height: 100%;
}

.PF_R_PB_PF_Pic{
    float: left;
    width: 196px;
    border: solid thin black;
    margin: 1px;
}