/* Main Sections 
------------------------------------------------------------------------- */
 table.datatable {
     width:100%;
     border-collapse: collapse;
     
 }
 
 table.datatable td {
    border:1px solid #000000;
    
    padding:1px 3px 1px 3px;
    margin:0px;

}


tr.datatable_heading{
   background-color: #336699;
   height:40px;
   color: white; 
}


* {
    margin: 0;
    padding: 0;
}
body {
    font-family: Verdana, Helvetica, sans-serif;
    font-size: small;
    text-align: center;
    color: #222;
    background: #ccc;
    /*background: url(images/m2raintanks_bg.png) repeat-x #201c1c;*/

}


h1, h2, h3, h4 {
	font-family: "Trebuchet MS", georgia, helvetica, arial, verdana, sans-serif;
	font-weight: bold;
	margin: .1em 0;
	letter-spacing: .07em;
}
h1 { font-size: 218% ; padding-bottom:3px; border-bottom:0px solid #555; margin-bottom: 10px;color: #003e7e}
h2 { font-size: 164%; }
h3 { font-size: 145%; }
h4 { font-size: 118%; letter-spacing: .15em }

p { padding: 0 0 1em; }

a, a:link { 
    text-decoration: none;
    color: #248;
    border-bottom: 1px dotted #248; 
}
a:visited { color: #448; border-color: #248; }
a:hover { color: #008; border-color: #008; text-decoration: none; }
a:active { color: #248; border-color: #248 }



a img, img {
    border: none;
}




.clear {
    clear: both;
    height: 1px;
    margin: -1px 0 0;
    font-size: 1px;
}


#page {
    width: 900px;
    margin: 0 auto;
    text-align: left;
    padding:2px;
    border: 1px solid #888;
   
    
}

#main_container {
    overflow: hidden;
    width:100%;
    background-image: url('images/page_background.jpg');
    background-repeat:repeat-y;
    background-color: #ffffff;  
}


/* Header 
------------------------------------------------------------------------- */

#header { 
    background: #ffffff url(images/m2_header.jpg) no-repeat top left;
    position: relative;
    height:89px;
    
    
}

#topnavbar {
	background-color: #003d7e;
    width:100%;
	margin: 0 0 5px 0;
	overflow: auto;
    height:100px;
}






/* Sidebar 
------------------------------------------------------------------------- */

#sidebar {
    float: left;
    width:200px;
    background: #eee;
    padding: 0 0 10px 0;
    margin: 0 0 10px 0;
    font-size: 85%;
    line-height: 1.4em;
    color: #999;
    
   
}



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


#content {
    background: #fff;
    text-align: left;
    float: right;
    width:640px;
    margin: 10px ;
    padding: 0;
    line-height: 1.5em;
}

/* Footer 
------------------------------------------------------------------------- */
#footer {
    margin: 0px;
    margin-top: 10px; 
    padding: 6px 0 9px 0;
    font-size: 85%;
    color: #fff;
    background:#003d7e;
    text-align: center;
    overflow:auto;

}

#footer p {
    
    padding: 20px 320px 20px 95px;
    background: url(images/bottom_sash.gif) no-repeat top left;
}

#footer a {border-bottom: none; color:#fff}

/* Product search box */
#psearch {
	background: url(images/search_box_bgd.jpg) repeat-x;
	height: 34px;
	width:200px;
	margin: 4px 0 0 0;
	
}

/* Special text formatting 
------------------------------------------------------------------------------- */
h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
	color: #333;
}

h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, cite {
	text-decoration: none;
}
h2 a:hover, h3 a:hover {
	color: #046;
	border-bottom: 1px dotted #06c;
}

h2.pagetitle {
	margin-top: 30px;
	text-align: center;
}

h4.date-header {
    margin-top: 0;
    padding-left: 14px;
    font-size: 90%;
    color: #f93;
    background: url(images/date_icon.gif) no-repeat 0 50%;
}

blockquote {
    margin: 0 0 0 30px;
    padding: 10px 0 0 20px;
    font-size: 88%;
    line-height: 1.5em;
    color: #666;
    background: url(images/quotes.gif) no-repeat top left;
}

blockquote p { margin-top: 0; }

blockquote cite {
	margin: 5px 0 0;
	display: block;
}
code {
	font: 1em/2.5em 'Courier New', Courier, monospace;
	color: #444;
	white-space: pre; 
    width: 350px;
    height: auto;
	overflow: auto;
    display: block;
    border: 1px solid #999;
    border-width: 2px 0;
    padding: 1em;
    margin: 0 0 1em 0;
    background-color: #fafafa;
}
li code { width: 330px }

acronym, abbr, span.caps {
	font-size: 90%;
	letter-spacing: .07em;
	cursor: help;
	border-bottom: 1px dotted #3f3f3f;
}

.center { text-align: center;}
.alignright { float: right; }
.alignleft { float: left; }

/*hr { display: none; } */


.error, .message {
    padding: 12px;
    background-color: red;
    color: #fff;
}
.message {
    background-color: green;
}

/* Special handling for images & alignment 
------------------------------------------------------------------------------- */

p img {
	padding: 0;
	max-width: 100%;
}

img.centered {
	display: block;
	margin: 0 auto;
}
img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
}
img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
}

/* Fixes for RichText widgets
------------------------------------------------------------------------------- */
.MODX_RichTextWidget {
	float: left;
}

.MODX_RichTextWidget a {
	border: 0px;
}

#brandlisttable {
 	width:580px;
 	border: 1px dashed #eee;
}
#brandlisttable .row0 {background: #eef}
#brandlisttable .row1 {background: #eee}
#brandlisttable .tablespacer {padding-top:12px; padding-bottom: 12px; border-bottom: 1px dashed #cce}

/* Product Buy page styling */
#sectionname {font-size:120%;font-weight:bold;padding-bottom:6px;border-bottom:1px solid #037; margin-bottom: 10px;color: #037}
#brandname{float:left;}
#productgroupname {}
#productname {margin-top:10px; font-weight:bold; font-size:100%;color:#333} 
.qtyinputbox {width:3em;}

.product_container {
   border-left: 0px solid #666;
   border-bottom: 4px solid #666;
   border-right: 0px solid #666;
   margin-bottom: 0px;
}
.productlisttable {width: 100%; }
table.productlisttable td {padding-right:3px; vertical-align:top}

table.productlisttable th {background:#666;color:#fff;font-weight: normal;font-size:12px}
.phead {height:30px;}
table.productlisttable tr.phead th{font-size:120%;background: #444;padding:3px}
table.productlisttable td.cl , table.productlisttable th.cl {padding-left:3px}
table.productlisttable td.cr , table.productlisttable th.cr {padding-right: 3px}
table.productlisttable tr.row0 {background:#eee}
table.productlisttable tr.row1 {background:#ddd}
table.productlisttable tr.row_selected {background:#ccf}
  
.submitbutton { border:1px solid #333;width:120px}
.alignRight {text-align: right}

/* tank_chart_table styling */
#tank_chart_table {border: 1px solid #666; width:98%}
#tank_chart_table th {height:30px;vertical-align:top;}
#tank_chart_table .cl {width:140px;padding-left: 3px}
#tank_chart_table .cr {padding-right: 3px}
#tank_chart_table .row1 {background:#ddd} 
.highlightrow {background:yellow}

/* cart table styling */
#cart_table {border: 1px solid #666; width:98%}
#cart_table input.textbox {border: 1px solid #333; width:2em}
#cart_table .row1 {background:#ddd}
#cart_table td.c1 {padding-left:3px}
#cart_table td.c4 {text-align: right;padding-right:3px}
#cart_table th {padding-left: 3px;background:#0055aa;color:#fff;font-weight: normal;font-size:12px}

#qtable tr th {background:#333; color: white} 

/* General form styling */
.formerror {border:1px solid red}
.formerrormessage {margin-top:6px; margin-bottom:12px; padding:10px; background: red; color: white}
label{float:left; width:200px; text-align: right; }
.formfield {float:left;width:300px}
input {margin-top:3px;padding: 1px; width:280px;}
.clear {clear: both}
 .pspacer {height:12px;background: #fff }/* spacer between product listing */
 
 .border_bottom {border-bottom: 1px dashed #ccc}
 
 #tankselector { width: 96%; background: #eee; padding: 5px; margin-bottom: 10px; border: 1px solid #ccc}
 #tankselector input.radio {width:20px; margin-left: 80px;}
 #tankselector input.button {width: 80px;}
 #tankselector span.checked {font-weight: bold}
 
 /* make products (view nn items) link sytle */
 a.products_link, a:visited.products_link { font-size: 125%; font-weight: bold}