/** CONFIGURATOR STYLES **/

#ConfiguratorContainer {width: 100%; padding: 5px; font: 11px verdana;}
#ConfiguratorContentContainer {width: 100%; border-bottom: 7px; clear: both;}
#ConfiguratorContentHead {width: 100%; font: bold 14px verdana; color: #FFCC00; margin-top: 5px; margin-bottom: 7px; clear: both;}

.ConfiguratorButton {font: 10px arial; color: #000; background-color: #FFCC00; border: solid 1px #678988; padding: 2px; width: 180px;}
.ConfiguratorButtonOver {font: 10px arial; color: #fff; background-color: #678988; border: solid 1px #FFCC00; padding: 2px; cursor: hand; width: 180px;}
	.ConfiguratorSelectedButtonContainer ConfiguratorButton {width: 100%;}
/** CONFIGURATOR NAVIGATION STYLES **/

#ConfiguratorNavigation {clear: both; width: 100%; padding-bottom: 10px;}

.ConfiguratorNavigationItem {float: left; font: bold 12px arial; color: #678988; padding: 5px;   border-bottom: 1px solid #678988; border-right: 1px solid #678988; padding: 5px; BACKGROUND: #EEE;}
.ConfiguratorNavigationItem A {font: bold 12px arial; color: #678988;}
.ConfiguratorNavigationItem A:hover {font: bold 12px arial; color: #678988;}

.ConfiguratorNavigationInactive {float: left; font: bold 12px arial; color: #B7B7B7; padding: 5px;  border-bottom: 1px solid #B7B7B7; border-right: 1px solid #B7B7B7; padding: 5px; BACKGROUND: #FFF;}
.ConfiguratorNavigationInactive A {font: bold 12px arial; color: #B7B7B7;}
.ConfiguratorNavigationInactive A:hover {font: bold 12px arial; color: #B7B7B7;}

.ConfiguratorNavigationActive {float: left; font: bold 12px arial; color: #FFFFFF; border-bottom: 1px solid #FFCC00; border-right: 1px solid #FFCC00; padding: 5px; BACKGROUND: #FFCC00;}
.ConfiguratorNavigationActive A {font: bold 12px arial; color: #3F3E39;}
.ConfiguratorNavigationActive A:hover {font: bold 12px arial; color: #3F3E39;}


/** STEP 1 - Select a Model **/

#ConfiguratorModelContainer {width: 100%;}
.ConfiguratorCategoryHeader {clear: both; width: 100%; background: #FFCC00; font: bold 12px verdana; color: #000; padding: 5px;}
.ConfiguratorModelLink {width: 33%; float: left; margin-right: 8px; margin-top: 8px; height: 125px; width: 160px; text-align: center;}
.ConfiguratorModelLink A {font: 12px arial; color: #FFCC00;}
.ConfiguratorModelLink A:hover {font: 12px arial; color: #3F3E39;}

/** STEP 2 - Select a Color **/


#ConfiguratorSelectedColorContainer {width: 100%; padding-top: 8px;}
#ConfiguratorSelectedColorTitle {font: bold 16px tahoma; color: #000; padding-bottom: 4px;}
#ConfiguratorSelectedMSRP {font: bold 16px tahoma; color: #000; padding-bottom: 4px;}
#ConfiguratorSelectedColorImage {text-align: center; border: solid 1px #666;}
#ConfiguratorSelectedColorImage IMG {}

#ConfiguratorSelectedNotes {font: 12px tahoma; color: #666; padding-top: 3px;}

#ConfiguratorSelectedButtonContainer {width: 100%; text-align: left; padding-top: 10px;}


#ConfiguratorColorList {padding: 3px; padding-top: 8px; width: 120px; float: left;}
.ConfiguratorSwatchContainer {padding: 2px; clear: both;}
.ConfiguratorSwatchTitle {font: 12px arial; color: #fff; }
.ConfiguratorSwatch {border: solid 2px #999; height: 30px; width: 30px; margin: 3px; cursor: hand;  float: left;}
.ConfiguratorSwatchOn {border: solid 2px black; height: 30px; width: 30px; margin: 3px; cursor: hand;  float: left;}

/*** STEP 3 - Select an Option ***/

.ConfigTable {width: 100%; font: 11px verdana; color: #000;}
	.configtable td {padding: 5px;}
.ConfigTableHead {font: bold 12px arial; color: #3F3E39; border-bottom: solid 1px #3F3E39; padding-top: 7px;}
.ConfigStart {color: #fff; font: 12px arial;border-bottom: solid 1px #fff;}
.ConfigHover {background-color: #eeeeee; font: 12px arial; color: #000000; border-bottom: solid 1px #B7B7B7;}

.ConfigOptionHead {font: bold 12px verdana; color: #000; background: #FFCC00; padding: 5px;}
.ConfigOptionItem {margin-left: 12px; font: 12px arial;}

.ConfigBoldText {font: bold 13px verdana; color: #fff; padding-left: 10px; padding-bottom: 2px;}
.ConfigDetailBlock {}
.ConfigImageBlock {}
.ConfigReviewHeadBlock {width: 100%; padding-bottom: 10px;}

.configuratorSidebar {float: right; width: 200px; padding: 5px;}
	.configuratorSidebar td {font: 10px verdana; padding: 5px;}
	.configSidebarBlock {}

.configuratorBody {float: left; width: 325px; padding-right: 10px; border-right: 1px solid #eeeeee;}