/* -------------------------------------------------------------- 
  
   Boilerplate Screen Styles
   * Version:   0.5 (2007-11-19)
   
-------------------------------------------------------------- */

@import "libs/reset.css";
@import "libs/typography.css";
@import "libs/forms.css";
@import "libs/plugins/tabs.css";


/* Colors ---------------------------------------------------- **
Dark Blue: 	#1F3047;	rgba(31,48,71,1);
Med. Blue: 	#73A2BF;	rgba(115,162,191,1);
Lite Blue: 	#ACC5C9;	rgba(172,197,201,1);
Grey:		#D9CEBA;	rgba(217,206,186,1);
Black:		#262626;	rgba(38,38,38,1);
-------------------------------------------------------------- */

/* BODY ------------------------------------------------------ */
body { width: 80em; margin: 0 auto; }
#flash { float: left; width: 100%; height: 2em; color: #73A2BF; font-weight: bold; padding: .5em 0; margin-bottom: -2em; }
#flash a { color: #1F3047; }
#flash a:hover { color: #ACC5C9; }
#flash p { display: inline; }
#dealer-nav, #dealer-nav li { display: inline; margin: 0 0 0 1em; }
#header { width: 100%; float: left; margin-top: 2em; height: 50px; padding: 5px 0; background: #262626; }
#logo { margin: 3px 8px 3px 16px; float: left; }
#navigation { float: left; list-style: none; font-weight: bold; font-style: italic; font-size: 1.25em; margin: 0 0 0 1em; width: 37em; }
#sub-nav { float: left; list-style: none; font-weight: bold; font-style: italic; margin-bottom: 0; width: 65em; font-size: 0.8em; }
#navigation li, #sub-nav li { display: inline; margin-right: 1em; }
#navigation a, #sub-nav a { color: #fff; }
#navigation a:hover, #sub-nav a:hover { color: #73A2BF; text-decoration: none; }
#content { width: 100%; float: left; margin: 2em 0; }
#footer { width: 100%; float: left; background: #FFF; padding-top: .5em; border-top: 1px solid #73A2BF; font-size: .875em; margin: 0 0 1em 0;  }
#footer .vcard { width: 875px; text-align: center; color: #262626; }
#footer a { text-decoration: none; color: #73A2BF; }
#footer a:hover { color: #ACC5C9; }
#footer .vcard * { display: inline; }
#footer ul { text-align: center; margin: 0; }
#footer li { display: inline; margin: 0 .5em 0 0; }
.socialIcon { float: left; margin: 0 10px 10px 0; width: 32px; }
.ihfc { float: right; margin: 0 0 0 10px; width: 140px; }


/* Content Area ---------------------------------------------- */
#full-image { width: 43em; float: right; }
#main_image { width: 60em; float: right; }
#content li:first-letter, #content li span { text-transform: capitalize; }
.sectionButton { width: 18em; margin: 0 1em; float: left; text-align: center; color: #73A2BF; }
.SubsectionButton { width: 24em; margin: 1em 1em 2em 1em; float: left; text-align: center; color: #73A2BF; }
.sectionButton:hover, .SubsectionButton:hover { text-decoration: none; color: #1f3047; }
.SubsectionButton img { max-height: 145px; min-height: 100px; max-width: 100%; }
#featured-item { float: left; margin: 0 0 2em 0; width: 80em; }
#featured-item img { width: 100%; }
#kit { display: none; background: #fff; padding: 2em; position: absolute; top: 10%; left: 32%; width: 33%; border: 3px solid #333; }
#kit img { max-width: 100%; }
.survey { width: 80%; margin: 0 50px 0 50px; text-align: left; border: 1px solid #0099CC; padding: 10px; font-size: 110%; line-height: 1.8em; background: url('../images/grad.jpg') repeat-x; }

/* Google Map ------------------------------------------------ */
#sidebar { overflow: auto; width: 29em; height: 400px; color: #000; float: left; border: 1px solid #333; margin: 1em 0; padding: 0 0.5em; }
#map { overflow: hidden; width: 48em; height: 400px; float: right; border: 1px solid #333; margin: 1em 0; }
