/* CSS Document */
* {margin:0;padding:0}
html {background:#fff}
body {color:#003366;font:100.01%/1.1 Verdana, "Times New Roman", Times, sans-serif}
h1 {font-size:1.2em;
    margin-bottom:10px
    }
h2 {font-size:1.05em;padding-left:5px;margin-top:20px
}
h1,h2 {font-weight:normal}
code {display:block;margin-left:25px;padding-bottom:20px}
ol {margin:8px 0 0 10px}
img {border:0;margin:10px 0}
#sub-section div {text-align:left;}
p {
margin-left : 0;
margin-top : 1em;
margin-bottom : .5em;
}
pre {white-space:normal}
#header,#menu,#content,#sub-section,#footer {padding:10px 0;font-size:.9em}
#sub-section, #content { font-size : .8em; }
#content div { margin : 10px; }
.bold {padding:10px;background:#fff;border:1px dotted #666}
.highlight {background-color:#ffc}

#footer {font-size : .7em;}
/* ------------------------- */

div.wrapper { margin : 0 auto;}
html {background:#9FA4B9;}
#header {
background:#fcc;
background-image : url(../images/layout/top_bar.jpg);
height : 8.5em;

}


#header h1 {
background-image : url(../images/layout/crb_logo.gif);
background-repeat : no-repeat;
height : 7.5em;
margin-left : 1.5em;

}

#content {
background:#fff;
padding : .5em;
border-right : #C5C5C5 1px solid;
padding-bottom : 2em;
}
#sub-section {
background:#fff;
}
#footer {
background:#ccf;
background-image : url(../images/layout/bottom_bar.jpg);
height : 1em;
color : white;
}



/*******************************************************************/
body {width:816px;margin:0 auto;text-align:center;background:url(../images/layout/body-bg.gif);border:1px solid #9FA4B9;}
/* MSIE display:inline-block is to make sure MSIE doesn't paint the backround above the containers, the overflow declaration is to make sure the containers do not drop below siblings if content pushes the width (in modern browsers it doesn't drop, but it spawns an orizontal scrollbar)  */
#header,#menu, #content,#sub-section,#footer {overflow:hidden;display:inline-block;text-align:left}
#header,#footer {width:100%} /* safari and opera need this */
#content,#sub-section {float:left}
#content {width:63%}
#sub-section {width:32%}
#footer {clear:left}


/* ----------------- custom styles ---------------- */
.footer-right {
    margin-left : 14em;
}

.footer-left {
    margin-left : 2em;
}

ul {margin-left:10px;margin-top:10px;}
ul li {margin-left : 20px;margin-right:15px; padding : 2px;}

#menu {
background: transparent;
margin-left : 18.3em;
margin-top : -4.2em;
width : 40.4em;
font-size : .8em;

}


#menu ul {
    height : 2.5em;
    margin : 0;
    display : block;
}

#menu li {
height : 1.7em;
padding : 0;
margin : 0;
margin-right : 3px;
padding-top : 1.5em;
width : 7.8em;
float : left;
background-image : url(../images/layout/left-button.gif);
display : block;
text-align : center;
font-weight : bold;
}


#menu li.selected {
    background-image : url(../images/layout/left-button-selected.gif);
}

#menu {
   
}

#container-left {
padding-left : 33px;
padding-right : 0px;
background-image : url(../images/layout/gradient-left.jpg);
background-repeat : repeat-y;
background-position : 0% 0%;
}

#container-right {
padding-left : 0px;
padding-right : 33px;
background-image : url(../images/layout/gradient-right.jpg);
background-repeat : repeat-y;
background-position : 100% 0%;
}

#sub-section ul li {
 display : list-item;
 list-style-type : square;
 padding-top : .25em;
 padding-bottom : .25em;
 margin-top : 0;
}

#sub-section ul {
 margin-left : 1.4em;
}

#sub-section h2 {
  background-color : #8FA2B0;
  color : white;
  font-weight : bold;
  padding : .3em;
  background-image : url(../images/layout/top-h2.gif);
  background-repeat :  no-repeat;
  background-position : top left;
  font-size : 1em;
  width : 15.7em;
  margin-left : 1em;
 
}



/*  links */

a {
  color : #3C93C9;
  text-decoration : none;
  background-color : white;
  font-weight : bold;
    }
a:link {
    color : #3C93C9;
    background-color : white; 
}

a:visited {
    color : #3C93C9;
    }
    
a:hover {
    color : white;
    background-color : #3C93C9;
    }

#menu a {
    color : white;
    background-color : transparent;
    text-decoration : none;
    width : auto;
    height : 1em;
    font-weight : bold;
    display : block;
}

#footer a {
 color : white;
 background-color : transparent;
}



#sub-section li {
    list-style-image : url(../images/layout/tick.gif);
    list-style-position : outside;
    }
    
#sub-section li.links, li.links {
    list-style-image : url(../images/layout/wee-arrow.gif);
    }
    
.blue_box {
    background-color : #ECF5FA;
    border-top : #C4D3DE 1px solid;
    border-bottom : #C4D3DE 1px solid;
    width : 13em;
    margin-left : 1em;
    margin-top : 1em;
    padding : .5em;
}

.blue_box a {
    background-color : transparent;
}

.blue_box a:hover {
    background-color : #3C93C9;
}

.blue_box ul {
    margin-top : 0;
    }

.blue_box li {
    margin-left : 2em;
}

#content h1 {
    border-bottom : #C5C5C5 1px solid;
    width : 99%;
    color : #003366;
    padding-bottom : .4em;
    margin-bottom : .2em;
    font-weight : bold;
}

#content h2 {
    color : #003366;
    font-weight : bold;
    font-size : 1em;
    margin-top : 1em;
    padding : 0;
}


.bounding_box {
    border : #C5C5C5 1px solid;
    padding : .4em;
    }

#search_panel {
    position : absolute;
    margin-top : -10em;
    margin-left : 31em;
    color : white;
    font-size : .8em;
}

.archive {
    margin-left : 1em;
}

.archive_list li, li.direction {
    display : list-item;
    margin : 1em;
    list-style-image : url(../images/layout/wee-arrow.gif);
    
}

#content {
    padding-left : 2em;
}

#map, #map2, #map3 {
    width : 380px;
    height : 250px;
    border : black 1px solid;
    padding : 0em;
}

#map div, #map2 div, #map3 div {
    padding : 0;
    margin : 0;
}

div.contact_right {
    width : 240px;
    border : black 2px solid;
    margin-left : 15em;
    }

.search_button {
margin-top : -2.4em;
margin-left : 22em;
width : 10%;
}

#sub-section p {
    padding-left : 1em;
} 

#mailing_list input {
    padding : .2em;
    margin-top : .2em;
}

#mailing_list form {
    padding : 1em;
    padding-top : 0;
    margin-top : 0;
}
#mailing_list {
    border : #cccccc 1px solid;
    width : 50%;
}

.after_sales {
    margin-left : 1em;
}

.spacer {
    border-bottom : #C5C5C5 1px solid;
    clear : both;
    height : 1.2em;
    padding :0;
    margin : 0;
}

.about_spacer {
    border-bottom : #C5C5C5 1px solid;
    clear : both;
    height : .1em;
    padding :0;
    margin : 0;
 
}

.pagination a {
    padding : .3em;
    border : #C5C5C5 1px solid;
}

.icon {
    margin : 0;
    border : 0;
    margin-right : .2em;
}

#main {
    background-image : url(../images/layout/grey-border.jpg);
    background-repeat : repeat-y;
    float : left;
}



/* -------------------- ie hacks ------------------------- */

* html #main {
    float : none;
    height : 100%;
}

* html #header a {
    background-color : transparent;
}

* html #header a:visited {
    background-color : transparent;
}

* html #header a:active {
    background-color : transparent;
}

* html #sub-section h2 {
    width : 15.7em;
}

* html #search_panel {
    position : relative;
    margin-top : -10em;
    margin-left : 29em;
}

* html #header h1 {
}

* html .search_button {
    margin-left : 23em;
}

* html #menu {
    margin : 0;
    margin-top : 4em;
    margin-left : 9.15em;
    float:left;
    width:40em;
}




* html #menu li {
    margin-right : 2px;
}


* html #sub-section {
    width : 240px;
} 




    