@import url("/styles/TabStrip.Category.css");
@import url("/styles/TabStrip.Box.css");
* /*Set's border, padding and margin to 0 for all values*/
{
padding: 0;
margin: 0;
border: 0;
}
body, html {
color: #3A3A3C; 
}
body {
font-family:Arial, Helvetica, sans-serif;
font-size: 12px;
line-height:17px;
background-image: url(/Images/header_bg.jpg);
	background-repeat: repeat-x;
	background-position: 107px left;
}
p {padding: 7px 0 7px 0;}

a {
color: #3A3A3C; text-decoration:underline
}
a:hover{
color: #000; 
text-decoration:underline
}

.clear { clear: both; }
#mainContainer {
min-height: 300px;
min-width:1000px;
max-width:1300px;
margin:0 auto;
}
* html #mainContainer {
height: 300px; /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}
/**************************
HEADER
**************************/
#header {
min-width:960px;

}
#header #logo{
width:280px; float:left;
}
#header #hometabs{
width:470px; float:left; 
}
#header #banner{
margin-left:725px; text-align:right;
}
/**************************
CONTENT AND COLUMNS
**************************/
.outer {
margin:0 10px;
border-left: 260px solid #fff; /*** This is the width and the color for our left column ***/
border-right: 260px solid #fff; /*** This is the width and the color for our right column ***/
}
* html .outer {
/*** No need for hacking IE on this layout ***/
}
.inner {
width: 100%; 
}
* html .inner {
/*** No need for hacking IE on this layout ***/
}
/*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing
div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid 
blowing the layout apart. IE gets the original 100% width as in the Livingstone layout. It blows 
my mind that all this hacking is being caused by the mighty Gecko engine! (shakes head ruefully)
***/
.float-wrap {
float: left;
width: 100%;
margin-left: -260px; /*** Same length as .outer border-left but with negative value ***/
}
* html .float-wrap {
/*** No need for hacking IE on this layout ***/
}
#content {
float: right;
background: #fff;
margin-right: -260px;  /*** Same length as .outer border-left but with negative value ***/
width: 100%;
position:relative;
}
* html #content {
position: relative;
}
.contentWrap{
padding:0 10px 0px 10px;
}
.contentWrap ol, .contentWrap ul {
margin: 3px 0 5px 35px;
}
.contentWrap li {
padding-bottom: 2px;
}
/**************************
LEFT COLUMN
**************************/
/*** div.left is in div.float-wrap, and when div.float-wrap is neg margined to the left, 
div.left is carried over into the proper position. 
***/
#left {
float: left;
width: 250px;
min-height: 250px;
padding:0 5px;
}
* html #left {
position: relative;  /*** IE needs this  ***/
height: 250px;
}
#left ul {
list-style: none;
padding-bottom: 4px;
}
#left li {
padding-bottom: 2px;
}
/*************************
RIGHT COLUMN
**************************/
#right {

float: right; 
width: 250px;
padding:0 5px;
min-height: 250px;
margin-right: -260px; /** This negative margin-right value is the width of the right column + the padding, in this example 130px. ***/
}
* html #right {
height: 250px;
position: relative;  /*** IE needs this  ***/
}
#right ul {
list-style: none;
padding-bottom: 4px;
}
#right li {
padding-bottom: 2px;
}
/**************************
FOOTER
**************************/
#footer {
border-top:4px solid #3A3A3C;
padding:0px 0 0 0px;
margin:0 10px;
font-size:11px;
color:#666;
font-family:'Rockwell', Arial, Helvetica, sans-serif; 
}
#footer .left{
width:420px; float:left; padding:5px;background-color:#eee;
}
#footer .right{
margin-left:450px; text-align:right; 
}
#footer .right a{
background-color:#eee; line-height:24px; padding:5px 25px 5px 5px;  margin-left:5px; text-decoration:none; color:#999;
}
/**************************
STYLES
**************************/
p{
margin:0; padding:0 0 10px 0; 
}
input,select{
border:1px; font-size:12px; border:1px solid #ccc; padding:2px;
}
.contact td{
color:#00B3DB; font-family:'Rockwell', Arial, Helvetica, sans-serif;
}
.box{
	margin-bottom:20px;
	background-color:#F3F3F5;
	position:relative;
}
.box.brown{
background-color:#F1F6D8;
}
.box .header{
font-size:15px; font-family:'Rockwell', Arial, Helvetica, sans-serif; background-color:#3A3A3C; padding:5px 10px; 
border-bottom:4px solid #fff;
}
.box .header h2{
font-size:13px; margin:0; padding:0; font-weight:normal; line-height:20px;color:#BED73D;
}
.box .boxtabs{
background-color:#fff; padding:0; 
}
.box .info{
background-color:#BEBCB0; padding:5px 10px; color:#fff; font-weight:bold;
}
.box .content{
padding:20px;  
}
.box .content10{
padding:10px;  
}
.box .content0{
position:relative; min-height:410px;
}
.box .content0 .image{
width:200px;position:absolute; top:0; left:0; border-right:5px solid #fff; border-bottom:5px solid #fff;
}
.box .text{
margin-left:205px;
}
.box .content.gray{
background-color:#6D6E72; border:0; color:#fff;
}
.box .footer{
background-color:#DDDCD7; padding:5px 10px; font-size:11px; color:#fff; text-align:right;
}
h1{
font-size:27px; margin:0; padding:0 0 15px 0; font-family:'Rockwell', Arial, Helvetica, sans-serif; color:#E2068C; font-weight:normal; line-height:32px;
}
h2{
font-size:21px; margin:0; padding:5px 0 10px 0; font-family:'Rockwell', Arial, Helvetica, sans-serif; color:#00B3DB; font-weight:normal; line-height:25px;
}
h3{
font-size:14px; margin:0; padding:5px 0 10px 0;  color:#000;  line-height:19px;
}
.content ul{
	margin:0;
	padding:0 0 10px 22px;
	
}
.content ul li{
padding-bottom:5px;
}
.content .spaced li{
padding-bottom:10px;
}
.blue{
color:#209EB9;
}
.purple, .purple a{
color:#E2068C;
}
.font11{
font-size:11px; line-height:16px;
}
.font13{
font-size:13px; line-height:18px;
}
.font14{
font-size:14px; line-height:19px;
}
.font15{
font-size:15px; line-height:20px;
}
.font16{
font-size:16px; line-height:21px;
}
.success
{
    padding: 5px 5px;
    color: #fff;
    margin: 0 0 5px 0;
	display:block;
    background-image: url(/Images/success_bg.gif);
    background-color: #78BE20;
    background-repeat: repeat-x;
    font-weight: bold;
    border: #66CC66 1px solid;
}
.error
{
    border: 1px solid #A21411;
    padding: 5px 5px;
    color: #000;
    margin: 0 0 5px 0;
    background-image: url(/Images/error_bg.gif);
    background-color: #E93933;
    background-repeat: repeat-x;
    display: block;
    font-weight: bold;
}