/* Main body style; added font info for anything that falls outside of a styled area */



body, html {
	background: #ffbb77 url(../turbex-images/turbex-bkg.jpg) no-repeat center top;
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 12px;
	line-height: 18px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
}


/* container (or wrapper) set for max width of 800; for IE, use the width expression what basically tests if the page is wider than 800 px; if so, set width to 800; otherwise, let it auto size */

#container {
	position: relative;
	text-align: left;
	max-width: 800px;
	width:expression(document.body.clientWidth > 800? "800px": "auto" );
	margin-right: auto;
	margin-left: auto;
	padding: 0px 0 0 0;
	background-color: #ffffff;
	border-right: 1px solid #7788aa;
	border-bottom: 1px solid #7788aa;
	border-left: 1px solid #7788aa;

}

#nav {
	margin: 0px 0px 20px 0px;
}

/* Content div contains both the "left" and "right" divs that hold the main text and images */



#content-top {
	background: url(../turbex-images/content-bg-top.gif) no-repeat center top;
	margin: 0px;
	width: 800px;
}

#content-top img {
	padding-left: 24px;
}

#content {
	background: url(../turbex-images/content-bg.gif) repeat-y center top;
	margin: 0px;
	width: 800px;
	overflow: auto;
}

#content-bottom {
	float: left;
	background: url(../turbex-images/content-bg-bottom.gif) no-repeat center top;
	margin: 0px;
	width: 800px;
	height: 12px;
}



#content hr {
	border: none 0;
	border-top: 1px solid #7788aa;	
	width: 90%;
	height: 1px;
	margin: 0px 0px 10px 40px;
	padding: 0px;
	/* left align in IE, Opera */
	text-align: left;
	clear: left;
}

/* leftside is the left column within the content div */

.leftside {
	float: left;
	clear: left;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	width: 273px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
}

.leftside h1 {
	font: bold 16px Verdana, Arial, Helvetica, Swiss, sans-serif;
	padding: 8px 20px;
	color: #223344;
}

.leftside h2 {
	font: bold 14px Verdana, Arial, Helvetica, Swiss, sans-serif;
	padding: 8px 20px;
	color: #223344;
}

.leftside h3 {
	font: bold 13px Verdana, Arial, Helvetica, Swiss, sans-serif;
	padding: 8px 20px;
	color: #223344;
}
.leftside p {font-size: 12px; line-height: 18px; padding: 8px 20px 4px 40px;
}

.leftside a:link {color:#515b6d;}

.leftside a:hover {color:#ff8811; font-style: italic;}

.leftside a:visited {color:#7788aa;}

.leftside img {
	border: 1px solid #7788aa;
	margin: 5px 0px 5px 40px;
	padding: 0px;
}

.leftside object {
	margin: 5px 0px 5px 40px;
}

.leftside hr {
	border: none 0;
	border-top: 1px solid #004400;	
	width: 89%;
	height: 1px;
	margin: 0px 0px 0px 20px;
	padding: 0px;
	/* left align in IE, Opera */
	text-align: left;
}

.leftside table {
	margin-left: 20px;
}


/* rightside is the right column within the content div */

.rightside {
	float: left;
	margin: 0px;
	padding: 0px;
	width: 525px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
}

.rightside h1 {
	padding: 0px 20px; 
	color: #555555;
	font-weight: bold;
	font-size: 14px;
	line-height: 19px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;}
	
.rightside h2 {
	padding: 0px 20px; 
	color: #555555;
	font-weight: bold;
	font-size: 12px;
	line-height: 16px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;}

.rightside p {
	padding: 0px 40px 4px 20px;
	color: #000000;
	font-size: 12px;
	line-height: 16px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;}

.rightside a:link {color:#515b6d; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

.rightside a:hover {color:#ff8811; font-style: italic; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

.rightside a:visited {color:#7788aa; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

/* Feature Area: used to highlight an area of content*/

#feature {
	float: left;
	width: 800px;	
}

/* Footer Area */

#footer-top {
	float: left;
	background: url(../turbex-images/footer-bg-top.gif) no-repeat center top;
	margin: 20px 0px 0px 0px;
	width: 800px;
}

#footer {
	float: left;
	background: url(../turbex-images/footer-bg.gif) repeat-y center top;
	margin: 0px;
	padding: 0px;
	width: 800px;
}

#footer p {color: #ffffff; font-size: 10px; line-height: 16px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif; padding-left: 16px;}

#footer a:link {color:#ffffff; font-size: 10px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

#footer a:hover {color:#ff8811; font-size: 10px;font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

#footer a:visited {color:#eeeeee; font-size: 10px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

.footer-contact {
	float: left;
	width: 246px;
	margin: 0px 10px 10px 20px;
}

.footer-contact p {padding-left: 20px;}

.footer-links {
	float: left;
	width: 246px;
	margin: 0px 10px 10px 0px;
}

.footer-links p {padding-left: 10px;}

.footer-bmd {
	float: left;
	width: 246px;
	margin: 0px 0px 10px 0px;
}

#footer-bottom {
	float: left;
	background: url(../turbex-images/footer-bg-bottom.gif) no-repeat;
	margin: 0px 0px 20px 0px;
	width: 800px;
	height: 12px;
}


/* Lists styles, generally apply same style to all types; however these could be placed in areas such as "Content" or "Side" to have different styles for lists in different areas */

ul, li, ol {margin: 0px 0px 0px 20px; padding: 0px 10px 5px 5px;  line-height: 17px; font-size: 12px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

/* uses letters instead of nos for ordered lists */

ol.alpha {list-style-type: lower-alpha;}

/* Styles for information in tables */

table {padding-left: 20px;}

td.info {border-bottom: 1px solid #223344;}

p.data {font-size: 11px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif; padding: 0px 10px 0px 10px;}


/* Floating boxes, good for photos with captions or similar */


div.floatl {
  float: left;
  }
  
div.floatl p {
   text-align: left;
   width: 265px;
   }

div.floatr {
  float: right;
  }
  
div.floatr p {
   text-align: center;
   width: 265px;
   }

div.container {
  border: 2px dashed #333;
  background-color: #ffe;
  }
div.spacer {
  clear: both;
  }


/* For image captions; border line not necessary, only the float and width; done as
<div class="pictr">
  <p><img src="image.jpg" width="136"
    height="200" alt="My Image">
  <p>This is my image caption
</div>
 */
 
/* For images floated right */

div.pictr {
  float: right;
  width: 50%
  margin: 15px;
  padding: 15px;
}
div.pictr p {
  text-align: center;
  line-height: 10px;
  font-size: 10px;
}

/* For images floated left */

div.pictl {
  float: right;
  width: 50%
  margin: 15px;
  padding: 15px;
}
div.pictl p {
  text-align: center;
  line-height: 10px;
  font-size: 10px;
}


/* special items as needed */

#scrollbox {
width:400px;
height:300px;
overflow: auto
}


.sml {
	font-size: 10px;
}

.ovrstrk {text-decoration:line-through; line-height: 16px; font-size: 12px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;}

/* for automatic back2top.js script--styles the link */

.bak2top {
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
	font-size: 10px;
	color: #ffffff;
	background-color: #223344;
	border: 1px solid;
	border-color: #7788aa;
	padding: 6px;
	z-index: 1200
}

/* Highlighting elements such as rules, pull quotes and similar */


.quotboxb {border-color: #2C69B6; border-style: double; border-width: 3px; margin-top: 20px; margin-bottom: 20px; margin-left: 30px; margin-right: 30px; padding-top: 5px; padding-bottom: 5px; padding-left: 10px; padding-right: 10px; background-color: #B9CAF5}

.quotbox { margin-top: 10px; margin-bottom: 10px; margin-left: 50px; margin-right: 15px; padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; background-color: #ff8822; font-size: 12px; font-weight:bold; font-family: Georgia,'Times New Roman',Times, serif}

.quotex {

	border-top: 2px solid #ba1e11; 
	border-bottom: 2px solid #ba1e11;
	margin: 15px 30px 15px 30px; 
	padding: 10px 10px 10px 10px; 
	background-color: #ffffff; 
	font-size: 14px; 
	font-weight:bold; 
	font-style: italic; 
	font-family: Georgia,'Times New Roman',Times, serif;
}

.quotxt {

	float: right;
	width: 325px;
	border-top: 2px solid #ba1e11; 
	border-bottom: 2px solid #ba1e11;
	margin: 15px 10px 15px 10px; 
	padding: 10px 10px 10px 10px; 
	font-size: 12px;
	font-style: italic;
}

.pbox {border: 1px solid #a1a5a9; padding: 5px 5px 5px 5px; margin: 5px 5px 5px 5px;}


/* Adds background color to text */

.shablue {margin: 5px 5 5 5; padding: 5px 5 5 5; background-color: #dce3f5;}

.shagold {margin: 5px 5 5 5; padding: 5px 5 5 5; background-color: #f7f0ae;}

/* Styles for Mal's e-commerce tables currently in most of my Excel TDF masters; probably should revisit these on site-by-site basis */

.ptcol {text-align: center; font-size: 11px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

.pthdr1 {text-align: center; font-size: 14px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}


/* Adds nice border and title box around a section. If you use a dotted border, it runs right through the legend on IE, so stick w solid */

.wr_fieldset {
width: 440px; 
margin: 12px 0 12px 0;
padding: 0; }

.wr_fieldset fieldset {
border: solid 1px #223344; }

.wr_fieldset legend {
margin: 0 10px 0 10px;
padding: 0 5px 0 5px;
color: #555555;
font-size: 12px;
font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif; }

.wr_fieldset_pad {
margin: 0;
padding: 8px; }

.tblborder {
	border-left: 1px dotted #722100;
	border-collapse: collapse;
}


/* Styles for tables */

/* Applies global padding and paragraph styles to entire table. Normally used for forms or tabular data within the main layout table so you do not need to add paragraph or other styles to each td */

table.frm td {
	padding: 1px; 
	font-size: 12px;
	line-height: 15px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;}
	
.tblborder {
	border: 1px solid #338BA6;
	border-collapse: collapse;
}

	
/* Add following as a table class="cellbkgrnd" for applying table cell backgrounds using tablestyle name="Alt Background By Style w/o formatting */

.cellbkgrnd {background-color: #cc0000;}

/* Adding bkground images to table cells or divs for announcement boxes or similar; commented out below until needed */

/* .bg1 {background: white url(images/divheader.gif) no-repeat top left; width: 236px; padding: 48px 10 10 10; border: 1px solid #548dab; border-collapse: collapse; text-align: left;} */

/* Hyperlink styles that include hover and visited styles - sml reduces text size and is good for link to BMD or footer links; whtlink produces white links on dk backgrounds */

a:link {color:#515b6d; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

a:visited {color:#7788aa; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

a:hover {color:#ff8811; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

a.sml:link {color:#515b6d; font-size: 10px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

a.sml:visited {color:#7788aa; font-size: 10px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

a.sml:hover{color:#ff8811;  font-size: 10px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

/* a.wht:link {color:#ffffff;}

a.wht:hover {color:#f2f2f2;} */

a.whtlnk:link  {
color:#ffffff;
font-size: 11px;
font-weight:bold;
font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
}

a.whtlnk:visited {
color:#f1f1f1;
font-size: 11px;
font-weight:bold;
font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
}

a.whtlnk:hover {
color:#ffff66;
font-size: 11px;
font-weight:bold;
font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
}