/* Start of CMSMS style sheet 'Easy Track 3 Column' */
/*****************
browsers interpret margin and padding a little differently, 
we'll remove all default padding and margins and
set them later on
******************/
* {
   margin:0;
   padding:0;
}

/*
Set initial font styles
*/
body {
   text-align: left;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: 75.01%;
   line-height: 1em;
}

/*
set font size for all divs,
this overrides some body rules
*/
div {
   font-size: 1em;
}

/*
if img is inside "a" it would have 
borders, we don't want that
*/
img {
   border: 0;
}

/*
default link styles
*/
/* set all links to have underline and bluish color */
a,
a:link 
a:active {
   text-decoration: underline;
/* css validation will give a warning if color is set without background color. this will explicitly tell this element to inherit bg colour from parent element */
   background-color: inherit; 
   color: #D1E3EF;/*#ffffff #18507C; */
}

a:visited {
   text-decoration: underline;
   background-color: inherit;
  color: #ffffff;                /* a different color can be used for visited links */
}

/* remove underline on hover and change color */
a:hover {
   text-decoration: none;
   /* background-color: #C3D4DF;*/
   color: #ffffff/*#385C72;*/
}

/*****************
basic layout 
*****************/
body {
   background-color: #fff;
   color: #333;
   margin:0em;    /* 1em gives some air for the pagewrapper, 0em none */
}

/* center wrapper, min max width */
div#pagewrapper {
   border: 0px; /* formerly border: 1px solid black; */
   margin: 7em auto;       /* this centers wrapper */
   max-width: 890px;   /* IE wont understand these, so we will use javascript magick */
   min-width: 890px;
   background:url('uploads/images/easytrack/wrapperbg.gif') center top repeat-y #9EA562;
   color: #ffffff;
}


/*** header ***
we will hide text and replace it with a image
we need to assign a height for it so that the image wont cut off
*/
div#header {
  /*  height: 6.8em; */
   background-color: #9DBED6;   
   position:relative;
}

div#header .headerbar {
   background: #FFF url(uploads/images/easytrack/EZTbar.gif) repeat-x;
   height:15px;
}

div#header .headerbarshadow {
   background: #fff url(uploads/images/easytrack/EZTbar_shadow.gif) repeat-x;
   height:4px;
}
div#header h1 {
width:200px;
display:inline;
}
div#header h1 a {
/* you can set your own image here */
   background: #9DBED6 url(uploads/images/easytrack/EZTlogo.gif) no-repeat 0.9em; 
   display: block;
   height: 70px;             /* adjust according your image size */
   width: 200px;/* 50%; */
   text-indent: -999em;  /* this hides the text */
   text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}
div#header div.headerContent {
position:absolute;
top:15px;
right:20px;
}

div#header div.headerContent h2 {
margin-bottom:.8em;
font-size:1.5em;
line-height:1em;
}

div#header div.headerContent a {
text-decoration:none;
color:#18507C;
font-size:.8em;
}

/* position for the shopping cart*/
div#cart {
   background: #9DBED6 url(uploads/images/easytrack/EZTcart.gif) no-repeat; 
   float: right;
   width: 20em;
   text-align: left;
   padding: 0.6em 0 0.2em 0;
   margin: 0 1em;
}

/* position for the search box */
div#search {
   float: right;
   width: 23em;    /* enough width for the search input box */
   text-align: right;
   padding: 0.6em 0 0.2em 0;
   margin: 0 1em;
}

div.breadcrumbs {
   padding: 1em 0 1.2em 0; /* CSS short hand rule first value is top then right, bottom and left */
   font-size: 90%;        /* its good to set sizes to be relative, this way viewer can change their fontsize */
   margin: 0 1em;        /* css shorthand rule will be opened to be "0 1em 0 1em" */
   border-bottom: 1px dotted #000;
}

 div.breadcrumbs span.lastitem { 
   font-weight: bold; 
} 

 div#content {
   margin: 0;  /* margin: 1.5em auto 2em 0;/* leaves some air above and under menu and content */
   /* background:#939B50;*/
}

div#leftsidebar {
   /* background-color: #939B50;*/
   /* height: 32.6em; */
   padding: 0em;
   float: left;        /* set sidebar on the left side. */
   width: 14.2em;     /* sidebar width, if you change this please also change #main margins */
   display: inline;  /* FIX IE double margin bug */
   margin-left: 0;
   margin-top: 0em !important; /* Mozilla */
   margin-top: 0.5em;             /*    IE    */
}

div#rightsidebar {
   /* background-color: #939B50;*/
   color: #FFFFFF;
   padding: 0em;
   /* height: 32.6em; */
   float: right;        /* set sidebar on the right side. */
   width: 14em;     /*13.3 sidebar width, if you change this please also change #main margins */
   display: inline;  /* FIX IE double margin bug */
   margin-right: 0;
   margin-top: 0em !important; /* Mozilla */
   margin-top: 0.8em;             /*    IE    */
   text-align: left;
}

div#rightsidebar div {
background:transparent;
}

div#rightsidebar .newsitems {  /*  All of this to create 'pseudo' "hr"s   */
   border-top-color: #FFF;
   border-left-color: #939B50;
   border-right-color: #939B50;
   border-bottom-color: #939B50;
   border-style: solid;  
   border-width: 0px;  
}

div#rightsidebar .msg {
   background: url(uploads/images/easytrack/EZTarrow.jpg) no-repeat 1em 1em; /* Xem Yem */
   margin-top:1em;
   padding: 1em 1em 1.2em 2.3em; /* Ordering is: top, right, bottom, left */
   border-bottom:1px solid #fff;
   line-height:1.2em;
}

div#rightsidebar .msg a {
   color: #D1E3EF/*#FFF*/;
}

div#rightsidebar .msg a:hover {
   text-decoration: none;
   /* background-color: #C3D4DF;*/
   color:#ffffff /*#385C72*/;
}

/* Flash Box - Homepage */
div#flash_homepage {
position:absolute;
top:3px;
right:173px;
display:none;
}

div#main {
   /* background-color: #939B50;*/
   margin-left: 173px; /* this will give room for sidebar to be on the sides */
   margin-right: 165px; /* ...make sure these spaces are bigger than sidebar widths! */
   padding-top:0px;
   color:#fff;
   position: relative;
}
div#main_inside {
   /* background-color: #939B50;*/
   margin-left: 16em; /* this will give room for sidebar to be on the sides */
   margin-right:16em; /* ...make sure these spaces are bigger than sidebar widths! */
   padding-top:10px;
   color:#fff;
   position: relative;
}

div#toekick {
   height: 36px;    /* adjust according your image size */
   background-color: #9DBED6;     
   clear:both;      
}

div#blurb {
   color: #18507C;
   background-color: #FFF;
   border-top-color: #18507C;
   border-left-color: #FFF;
   border-right-color: #FFF;
   border-bottom-color: #18507C;
   border-style: solid;  
   border-width: 2px;  
   clear:both;
}

div#blurb a {
color:#18507C;
}

div#footer {
   clear: both;       /* keep footer below content and menu */
   color: #18507C;
   background-color: #ffffff;
   padding:8px;
}


div#footer_inside {
   clear: both;       /* keep footer below content and menu */
   color: #18507C;
   background-color: #9DBED6;
   padding:8px;
}

/* Fix Links for Footers */
div#footer a, div#footer_inside a {
color:#18507C;
font-size:.8em;
text-decoration:none;
}

div#footer a:hover, div#footer_inside a:hover {
background:transparent;
text-decoration:underline;
}

.blurbheading {
   color:#47749E;
   font-family:verdana,arial,helvetica,sans-serif;
   font-size:11px;
   font-weight:normal;
   letter-spacing:normal;
   text-transform:none;
}

.blurbtext {
   color:#808284;
   font-family:verdana,arial,helvetica,sans-serif;
   font-size:10px;
   font-weight:normal;
   letter-spacing:normal;
   text-transform:none;
}

div#footer p, div#footer_inside p {
   font-size: 0.8em;
   /*padding: 1.5em;        some air for footer */
   /*text-align: center;   centered text */
   margin: 0;
}

div#footer p a {
   color: #18507C; /* needed becouse footer link would be same color as background otherwise */
}

/*** Product List Displays ***/
div#product_detail {
margin-top:5px;
}
div#product_detail h4, div#product_detail p {
padding-left:108px;
}
div.product_image {
width:100px;
float:left;
}
/*** Walk-in Closet Page ***/
div.walk-in_img {
float:left;
}
div#walk-in p {
padding-left:175px;
}
/* as we hid all hr for accessibility we create new hr with extra div element */
div.hr {
   height: 1px;
   /* padding: 1em;*/
   border-bottom: 1px dashed #ffffff;
   margin:1em 0;
}

/* relational links under content */
div.left49 {
  width: 49%; /* 50% for both left and right might lead to rounding error on some browser */
}

div.right49 {
  float: right;
  width: 49%;
  text-align: right;
}

div.starter_kits img {
float:left;
margin:0 10px 10px 0;
}

div.starter_kits p {
}

/********************
CONTENT STYLING
*********************/
div#content {   
   padding-top: 0em !important; /* Mozilla */
   padding-top: 8px;             /*    IE    */
}

/* HEADINGS */
div#content h1 {
   font-size: 2em; /* font size for h1 */
   line-height: 1em;
   margin: 0;
}
div#content h2 {
	color: #ffffff/*#D1E3EF  #294B5F*/; 
	font-size: 1.5em; 
	text-align: left; 
/* some air around the text */
	/* padding-left: 0.5em;*/
	/* padding-bottom: 1px;*/
/* set borders around header */
	/* border-bottom: 1px solid #e7ab0b; */
	/* border-left: 1.1em solid #e7ab0b; */
        line-height: 1.5em;
/* and some air under the border */
        margin: 0 0 0.5em 0;
}
div#content h3 {
   color: #D1E3EF/*#ffffff  #294B5F*/; 
   font-size: 1.2em;
   line-height: 1.3em;
   margin: 0 0 0.5em 0;
}
div#content h4 {
   color:#D1E3EF/*#ffffff  #294B5F*/; 
   font-size: 1.2em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
div#content h5 {
   color: #294B5F; 
   font-size: 1.1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
h6 {
   color: #294B5F; 
   font-size: 1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
/* END HEADINGS */

/* TEXT */
p {
   font-size: 1em;
   margin: 0 0 1.5em 0; /* some air around p elements */
   line-height: 1.4em;
   padding: 0;
}

blockquote {
   border-left: 10px solid #ddd;
   margin-left: 10px;
}

strong, b {
/* explicit setting for these */
   font-weight: bold;
}

em, i {
/* explicit setting for these */
   font-style:italic;
}

/* Wrapping text in <code> tags. Makes CSS not validate */
code, pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
 font-family: "Courier New", Courier, monospace;
 font-size: 1em;
}

pre {
   border: 1px solid #000;  /* black border for pre blocks */
   background-color: #ddd;
   margin: 0 1em 1em 1em;
   padding: 0.5em;
   line-height: 1.5em;
   font-size: 90%;
}

/* Separating the divs on the template explanation page, with some bottom-border */
div.templatecode {
  margin: 0 0 2.5em;
}

/* END TEXT */

/* LISTS */
/* lists in content need some margins to look nice */
div#main ul,
div#main ol,
div#main dl,
div#main_inside ul,
div#main_inside ol,
div#main_inside dl {
   font-size: 1.0em;
   line-height: 1.4em;
   margin: 0 0 1.5em 0;
}

div#main ul li,
div#main ol li, 
div#main_inside ul li,
div#main_inside ol li {
   margin: 0 0 0.25em 3em;
}

/* definition lists topics on bold */
div#main dl dt {
   font-weight: bold;
   margin: 0 0 0 1em;
}

div#main dl dd {
   margin: 0 0 1em 1em;
}

div#main dl {
  margin-bottom: 2em;
  padding-bottom: 1em;
  border-bottom: 1px solid #c0c0c0;
}

/* END LISTS */

/********************
MENU
*********************/
#menu_vert {
   padding-left: 0;
   margin-left: 0;
   margin-right:1px;
   margin-top:15px;
   background:#939B50;
   /* border:1px solid #D6CCA3;*/
}
#menu_vert ul#primary-nav {border:0px;}
/* third level has some padding to have it stand out */
div#menu_vert ul ul ul {
   /* padding-bottom: 0.5em;*/ 
}

/* menu li block */
#menu_vert li {
   list-style: none;
   margin:0;
   border-bottom:0; /*1px solid #DFD9C3; c0c0c0 */
   background:
   display: block;
}

#menu_vert ul ul li {
   border: none;
}

/** fix stupid ie bug with display:block; **/
* html #menu_vert li a { height: 1%; } 
* html #menu_vert li hr { height: 1%; }
/** end fix **/

/* first level links */
div#menu_vert a {
   text-decoration:none; /* no underline for links */
   display: block; /* IE has problems with this, fixed above */
   padding: 0.5em 0.2em 0.5em 1.5em; /* some air for it - was .8,.5,.8,1.5 */   
   color:#ffffff; /* this will be link color for all levels - #564218; 18507C */
   /* background: url(uploads/basethemes/arrow-right.gif) no-repeat 0.5em center #687718; */
   min-height:1em; /* Fixes IE7 whitespace bug */ 
   border-bottom:1px solid #fff;
   margin:0px;
}

/* next level links, more padding and smaller font */
div#menu_vert ul ul a {
   font-size: 90%;
   padding: 0.5em 0.5em 0.5em 2.8em;
   background:#D7DABD;
   color:#8F8250;
}
div#menu_vert ul a:hover {
background:#ffffff;
color:#5F3316;
}
div#menu_vert ul ul a:hover {
background:#ffffff;
color:#5F3316;
}

/* third level links, more padding */
div#menu_vert ul ul ul a {
   padding: 0.3em 0.5em 0.3em 4.3em;
   background:#D7DABD; 
}

/* hover state for all links */
div#menu_vert a:hover {
   background-color: #fff;/* d6cca3; c3d4df */
  color:#000;
}
div#menu_vert a.activeparent:hover {
   background-color:#ffffff;/*#d6cca3; c3d4df */
   color: #82613B; /*18507c*/
}

/* 
active parent, that is the first-level parent 
of a child page that is the current page 
*/
div#menu_vert li a.activeparent {
   background: url(uploads/basethemes/arrow-down.gif) no-repeat 0.4em center; 
   background-color: #ffffff;/*#D6cca3; 385c72 */
   color: #5F3316;
}

div#menu_vert li.currentpage h3{
background:#fff;
color:#939B50;
font-weight:normal;
padding-top:0.5em;
padding-bottom:0.5em;
}

div#menu_vert ul ul li a.activeparent {
   background-position: 1.5em center; 
   background-color: #ffffff;
   color: #000; /*18507c */
}


/* 
current pages in the default Menu Manager 
template are unclickable. This is for current page on first level 
*/
div#menu_vert ul h3 {
   background: url(uploads/basethemes/arrow-right-active.gif) no-repeat 0.4em center;
   background-color: #d6cca3; /*dark for selection 385c72 */
   display: block; 
   padding: 0.5em 0.2em 0.5em 1.5em;;  /* some air for it */
   color: #939B50;                                 /* this will be link color for all levels */
   font-size: 1em;                           /* instead of the normal font size for <h3> */
   margin: 0;                                  /* as <h3> normally has some margin by default */
}

/* 
next level current pages, more padding, 
smaller font and no background color or bottom border 
*/
div#menu_vert ul ul h3 {
   font-size: 90%;
   padding: 0.3em 0.5em 0.3em 2.8em;
   background-position: 1.4em center;
   background-color: transparent;
   border-bottom: none;
   color: #939B50;     
}

/* current page on third level, more padding */
div#menu_vert ul ul ul h3 {
   padding: 0.3em 0.5em 0.3em 4.3em;
   background: url(uploads/basethemes/arrow-right-active.gif) no-repeat 2.7em center; 
}

/* section header */
div#menu_vert li.sectionheader {
   border-right: none;
   font-size: 130%;
   font-weight: bold;
   padding: 1.5em 0 0.8em 0;
   background-color: #fff;
   line-height: 1em;
   margin: 0;
   text-align:center;
}



/* separator */
div#menu_vert li.separator {
   height: 1px !important;http://cms.orgsystems.com/admin/editcss.php?css_id=67
ORG Solutions - Edit Stylesheet: Easy Track 3 Column
   margin-top: -1px;
   margin-bottom: 0;
   padding:2px 0 2px 0;
   background-color: #000;
   overflow:hidden !important;
   line-height:1px !important;
   font-size:1px; /* for ie */
}

div#menu_vert li.separator hr {
   display: none; /* this is for accessibility */
}

#dealer_search_results div.header { /* change color for this site only */
color:#fff;
}

/* Live Chat / Help Button in Left Column */
div.chat_button {
text-align:center;
padding:20px 0;
}

/* Top-level Product Pages (Closet, Garages, Other) */
div.gallery {
padding-bottom:5px;
}
div.gallery img {
border:1px solid #ffffff;
float:left;
}
span#no_float img {
float:none;
clear:both;
}
div.gallery_thumbs {
float:right;
width:255px;
}
div.gallery_thumbs img {
float:left;
margin:0 10px 10px 0;
}

#titleCaption {
float:left;
font-size:.8em;
padding:5px;
width:230px;
}

/* Override styles to fix Retailer form */
div#easytrack_form div.orgsol_contactform fieldset{
background:#d1e3ef;
border:1px solid #9dbed6;
padding:10px;
color:#18507C;
font-size:.9em;
}

div#easytrack_form div.orgsol_contactform fieldset select {
font-size:.9em;
}

div#easytrack_form div.orgsol_contactform fieldset span.label {
width:40%;
}

div#easytrack_form div.orgsol_contactform fieldset span.inputboxes {
width:50%;
}

div#easytrack_form.narrowlabel div.orgsol_contactform fieldset span.label {
width:25%;
}

div#easytrack_form.narrowlabel div.orgsol_contactform fieldset span.inputboxes {
width:50%;
}

div#easytrack_form div.orgsol_contactform fieldset div.required span.label{
color:#18507C;
}

div#easytrack_form div.submit input {
background:#9DBED6;
border:1px solid #ffffff;
color:#fff;
font-weight:bold;
}

.product_list {
font-size:.8em;
}

div#main_inside table.product_list h2 {
color:#d1e3ef;
line-height:1em;
margin-bottom:4px;
font-weight:normal;
}

.product_list td {
padding:10px;
border-top:1px solid #939B50;
}
/* End of 'Easy Track 3 Column' */


