﻿
/**** General Styles ****/
h1 {
  font-size: 24px;
  color: #4FA600;
  font-weight: bold;
  margin: 0px;
  padding: 0px;
}

a {
	color: #336699;
	text-decoration: none;
}
a:hover {
	color: #336699;
	text-decoration: underline;
}
a.allLink {
	font-weight: bold;
}

body {
  text-align: left;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{
  margin:0 auto;
  padding:0;
}

/**** Two Columns Layout Styles ****/
.twoColumnsMainDiv{
	width: 1000px;
	text-align: left;
}

.twoColumnsMainDiv .leftColumn{
	float: left; 
	width: 200px;
	padding-top: 40px;
}

.twoColumnsMainDiv .rightColumn{
	float: right; 
	width: 785px;
	min-height: 500px;
}

/**** One Columns Layout Styles ****/
.oneColumnsMainDiv{
	width: 1000px;
	padding-top:20px;
	text-align: left;
}

/**** Two Rows Layout Styles ****/
.twoRowsMainDiv {
  width: 1000px;
  padding-top:20px;
  text-align: left;
}

.twoRowsMainDiv .upperRow {
  width:100%;
  clear: both;
}

.twoRowsMainDiv .bottomRow {
  width:100%;
  clear: both;
}

/*** Use underline, For IE6 only, resolve the menu z-index issue ***/
#headerContainer{
	_position:relative;
	_z-index:999;
}

/***  moduleBreadcrumb Styles ***/
#breadCrumb {
	width: 1000px;
	/*border-top: 2px solid #4FA600;*/
	background: url(img/green_arrow_breadcrumb.gif) no-repeat 0 7px;
	height: 35px;
	text-align: left;
}

#breadCrumb .bc-content {
	padding: 13px 0 0 0;
	margin: 0;
 	color: #626469;
	font-size: 10px;
	font-family:'Arial'; 
	text-decoration: none;
}

#breadCrumb .bc-start {
	color: #4FA600;
	font-size: 11px;
	font-weight: bold;
	font-family:'Arial'; 
	padding: 0 0 0 30px;
}
#breadCrumb a, #breadCrumb #lastNav {	 	
  color: #626469;
	font-size: 10px;
	font-family:'Arial'; 
	text-decoration: none;
}

#breadCrumb a:hover{
  color: #336699;
  font-size: 10px;
	font-family:'Arial'; 
	text-decoration: underline;
}


/*** Filter List Styles ***/
#filterTitle{
	width:100%;
	font-size: 12px;
	color: #626469;
	font-weight: bold;
	margin: 10px 0px 10px 0px;
	padding: 3px 3px 3px 10px;
}
.listTitle{
	background-color: #EAEAEA;
}
.listTitle h2{
	width:183px;
	font-size: 12px;
	color: #626469;
	font-weight: bold;
	padding: 3px 3px 3px 10px;
}
.listValues{
	width: 100%;
	padding-top: 7px;
	font-size: 11px;
}
.listValues ul{
	list-style: none outside none;
    margin: 0px;
    padding: 0px 0px 0px 5px;
}
.listValues ul li{
	background: url("img/green_bullet.gif") no-repeat scroll left 2px transparent;
	color: #336699;
    padding: 0 0 8px 15px;
	cursor: pointer;
	text-decoration: none;
}
.listValues ul li:hover{
	text-decoration: underline;
}
/*** Selected Filter List Styles ***/
#selectedFilter{
	float:left;
	width:100%;
	margin: 10px 0px 10px 0px;
}
#selectedTitle{
	float:left;
	font-size: 12px;
	color: #626469;
	font-weight: bold;
	padding: 0px 0px 0px 10px;
}
#selectedTitleHide h2{
	display:none;
}
#selectedRemove{
	float: right;
	font-size: 11px;
}
#selectedList{
	border-color: #CECED0;
	border-width: 1px;
	border-style: solid;
	font-size: 11px;
}
#selectedList ul{
	list-style: none outside none;
    margin: 0px;
    padding: 5px 0px 0px 5px;
}
#selectedList ul li{
	zoom: 1;  /* special style for IE6 */
	background: url("img/green_bullet.gif") no-repeat scroll left 2px transparent;
    color: #626469;
    padding: 0 5px 8px 15px;
}
#selectedList ul li a{
	zoom: 1;  /* special style for IE6 */
	background: url("img/icon_close_dis.gif") no-repeat scroll right 2px transparent;
	display: block;
}
#selectedList ul li a:hover {
	text-decoration:line-through;
}

#selectedList ul li div a{
	zoom: 1;  /* special style for IE6 */
	background: url("img/icon_close_dis.gif") no-repeat scroll right 2px transparent;
	display: block;
}

#selectedList ul li div a:hover {
	text-decoration:underline;
}

#selectedListText{
	padding-right:15px;
}

/*******************************************************************/
#selectedList1Text:hover{
	padding-right:15px;
	text-decoration:none !important;
}
/*******************************************************************/
/*** Landing Page Styles ***/
#landingTitle{
	font-size: 24px;
	color: #4FA600;
	font-weight: bold;
	margin:10px;
}
.rowDiv{
	float:left;
	width:100%;
}
.landingCategory{
	float: left;
	padding:0 5px 10px 20px;
	vertical-align:top;
	width: 21%;
}
.landingCategory h2{
	line-height:12px;
}
.landingCategory img{
	border:1px solid #EAEAEA;
	margin-bottom:0;
	width:55px;
	height:55px;
	cursor: pointer;
}
.landingCategory a{
	font-size:11px;
	font-weight:bold;	
}
.landingCategory a:hover{
	font-size:11px;
	font-weight:bold;	
}
.landingCategory .overlay {
	font-size: 11px;
	font-weight: normal;
	width: 200px;
	margin-left: 10px;
	padding: 2px 2px 2px 0px;
	background: white url('img/arrow1.gif') top left no-repeat;
	position:absolute; 
	float: left;
	visibility:hidden;
}
.landingCategory .overlay ul{
	border: 2px solid #EAEAEA;
	list-style: none outside none;
    margin-top: 6px;
	margin-top: 8px\9; /* special style for IE all versions*/
	border-top-width: 0px;
    padding: 5px 0px 0px 5px;
}
.landingCategory .overlay ul li{
	zoom: 1;  /* special style for IE6 */
	background: url("img/green_bullet.gif") no-repeat scroll left 2px transparent;
    color: #336699;
    padding: 0px 5px 2px 15px;
	cursor: pointer;
	text-decoration: none;
}
.landingCategory .overlay ul li:hover{
	text-decoration: underline;
}
.landingCategory .overlayBottom {
	font-size: 11px;
	font-weight: normal;
	width: 200px;
	margin-left: 10px;
	padding: 2px 2px 10px 0px;
	background: white url('img/arrow2.gif') bottom left no-repeat;
	position:absolute; 
	float: left;
	visibility:hidden;
}
.landingCategory .overlayBottom ul{
	border: 2px solid #EAEAEA;
	list-style: none outside none;
    margin-top: 6px;
	margin-top: 8px\9; /* special style for IE all versions*/
	border-bottom-width: 0px;
    padding: 5px 0px 5px 5px;
}
.landingCategory .overlayBottom ul li{
	zoom: 1;  /* special style for IE6 */
	background: url("img/green_bullet.gif") no-repeat scroll left 2px transparent;
    color: #336699;
    padding: 0px 5px 2px 15px;
	cursor: pointer;
	text-decoration: none;
}
.landingCategory .overlayBottom ul li:hover{
	text-decoration: underline;
}

/*** Category Title Styles ***/
#categoryTitle{
	float:left;
	width:100%;
	margin: 0px 0px 10px 0px;
}
#categoryTitle .title{
	float:left;
	font-size: 24px;
	color: #4FA600;
	font-weight: bold;
	margin:10px;
	min-height: 56px;  
  padding-left: 58px;
}
#categoryTitle .description{
	float: left;
	width: 98%;
	margin: 0px 0px 0px 12px;
	font-family:'Arial'; 
	color:#626469; 
	font-size:11px;
}
/*** Sub-Category Title on Category page Styles ***/
#categorySubCategoryTitle{
	float:left;
	width:100%;
	margin: 10px 0px 10px 0px;
}
#categorySubCategoryTitle .title{
	float:left;
	margin: 0px 10px 0px 10px;
}
#categorySubCategoryTitle .title a{
	font-size: 14px;
	color: #4FA600;
	font-weight: bold;
}
#categorySubCategoryTitle .greenline{
	background-color: #87D300;
	height: 5px;
	margin-top: 6px;
	overflow:hidden;
}
/*** Range on Category page Styles ***/
.categoryRange{
	float: left;
	padding:0 5px 20px 10px;
	vertical-align:top;
	width: 30%;
}
.categoryRange img{
	border:1px solid #EAEAEA;
	margin-bottom:0;
	width:55px;
  height:55px;
}
.categoryRange a{
	font-size:11px;
	font-weight:bold;	
}
.categoryRange a:hover{
	font-size:11px;
	font-weight:bold;	
}
.categoryRange .image{
	float: left;
}
.categoryRange .title{
	float: left;
	margin-left:5px;
	width: 160px;
}
.categoryRange .description{
	float: left;
	margin-left:5px;
	width: 160px;	
	font-family:'Arial'; 
	color:#626469; 
	font-size:11px;
}

/*** Range Page Styles ***/

/* Gallery */
.rangePictureGallery {
  float: left;
  padding-left: 10px;
}

.rangePictureGallery .mainPicture IMG {
  border:1px solid #cccccc;
  min-width: 170px;
  min-height: 170px;
}
.rangePictureGallery .galleryIcon .plusButton {
  background: url("img/green_plus_button.png") top left no-repeat;
  width: 23px;
  height: 23px;
  margin-top: 3px;  
  float: left;
}

.rangePictureGallery .galleryIcon .galleryText {
  font-size: 11px;
  font-weight: bold;
  padding-left: 28px;
  padding-top: 4px;
}
/* light box */
#galleryLightBoxContainer {
  min-width:763px;
  min-height:321px;
  background-color: white;
}

#galleryLightBoxOverlay {
  background-color:#404040;
}

.galleryLightBox {
	display: none;
}

.galleryLightBox .se_title {
  margin: 20px 0 0 15px;
  color: #4FA600;
  font-size: 17px;
  vertical-align: top;
  font-weight: bold;
  clear: both;
}

.galleryLightBox .se_title .titlePlacement2 {
  background-color: white;
  float: left;
  padding-right: 10px;
  margin-top: 0px;
}

.galleryLightBox .se_title .titlePlacement2 .greenBar {
  color: #4FA600;
  display: inline;
  font-weight: bold;
  background-color: white;
  font-family: 'Arial';
  color: #4FA600;
  font-size: 21px;
}

.galleryLightBox .se_title .greenLineHeader2 {
  background-color: #87D300;
  height: 4px;
  margin-top: 10px;
  width: 82%;
  float: left;
}

.galleryLightBox .se_title .closeButton {
  float: left;
  margin-left: 5px;
  cursor: pointer;
}


.galleryLightBox .headerText{
  clear: both;
  padding-top: 20px;
  font-weight: bold;
  margin-left: 20px;
  color: #626469;
  font-size: 13px;
}

.galleryLightBox .galleryGrid {
  clear:left;
  float:left;  
  width: 180px;
  margin-left: 20px;
  margin-top: 15px;
}

.galleryLightBox .galleryGrid .galleryGridItemWrapper {  
  float: left;
  width: 54px;
  margin-left: 2px;
  margin-top: 4px;
  height: 54px;
}

.galleryLightBox .galleryGrid .galleryGridItemWrapper .galleryGridItemBack{  
  background-color: #cccccc;
  height: 100%;
}

.galleryLightBox .galleryGrid .galleryGridItemWrapper .galleryGridItem {    
  width: 50px;
  height: 50px;
  cursor: pointer;
  margin-top: 2px;
}

.galleryLightBox .galleryGrid .galleryGridItemWrapper .galleryGridItem IMG {
  width: 50px;
  height: 50px;
}

.galleryLightBox .galleryGrid .galleryGridItemWrapper .galleryGridItemBackSelected {
  background-color: #87D300;  
}

.galleryLightBox .enlargePictureSection {
  clear: right;  
  float: left;
  margin-left: 30px;
  width: 500px;
}

.galleryLightBox .enlargePictureSection .previousButtonWrapper {
  float: left;
  width: 95px;
  height: 250px;
}

.galleryLightBox .enlargePictureSection .previousButtonWrapper .previousButton {
  background: url("img/big_green_circle_previous.png") top right no-repeat;
  text-align: right;
  margin-top: 78px;  
  height: 44px;  
  font-size: 34px;
  font-weight: bold;
  color: white;
  padding-right: 14px;
  color: #FFFFFF;
  cursor: pointer;
}

.galleryLightBox .enlargePictureSection .pictureDescription {
	clear: both;
	text-align: center;
	color: #626469;
  font-family: 'Arial';
	margin-top: 20px;
	margin-bottom: 20px;
  float: left;
  width: 100%;
}

.galleryLightBox .enlargePictureSection .previousButtonWrapper .previousButtonGray {
  background: url("img/big_gray_circle_previous.png") top right no-repeat;
}

.galleryLightBox .enlargePictureSection .enlargePicture {
  float:left;
  width:250px;
  height:250px;
  margin-left:30px;
  margin-right:30px;
}

.galleryLightBox .enlargePictureSection .enlargePicture IMG {
  width:250px;
  height:250px;
}

.galleryLightBox .enlargePictureSection .nextButtonWrapper {
  float: left;
  width: 95px;
  height: 250px;
}

.galleryLightBox .enlargePictureSection .nextButtonWrapper .nextButton {
  background: url("img/big_green_circle_next.png") top left no-repeat;
  text-align: left;
  margin-top: 78px;  
  height: 44px;
  font-size: 34px;
  font-weight: bold;
  color: white;
  padding-left: 14px;
  color: #FFFFFF;
  cursor: pointer;
}


.galleryLightBox .enlargePictureSection .nextButtonWrapper .nextButtonGray {
  background: url("img/big_gray_circle_next.png") top left no-repeat;
}

.rangeDataSheet {
  width: 790px;
  float: left;
  margin-left: 13px;
  margin-bottom:10px;
}

.rangeDataSheet .title {
  margin-top: -6px;
  margin-bottom: 0px;  
  font-weight: normal;
  width: 75%;
  margin: 0;
  font-size: 24px;
  color: #4FA600;
}

.rangeDataSheet .title H1 {
  font-weight: normal;
}

.rangeDataSheet .shortDescription {
  color: #626469;
  font-size: 11px;
}

.rangeDataSheet .grayField {
  background-color: #EAEAEA;
  padding-top: 5px;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 5px;
  margin-top: 15px;
}
.rangeDataSheet .grayField .subTitle {
  font-family: 'Arial';
  color: #4FA600;
  font-size: 13px;
  margin-bottom: 5px;
  font-weight: bold;
}

.rangeDataSheet .grayField .content {
  color: #626469;
  font-size: 11px;
  line-height: 18px;
  margin-left: 20px;
}

.rangeDataSheet .grayField .content P:first-line {
  font-size: 11px;
  line-height: 30px;
}

.rangeDataSheet .grayField .content P STRONG {
  font-size: 11px;
  line-height: 18px;
}

.rangeDataSheet .grayField .content UL {
  margin-left: 20px;
}

.rangeDataSheet .grayField .content STRONG {
  margin-left: 0px;
  line-height: 0px;
}

.rangeDataSheet .grayField .presentation1  {
  margin-top:5px;
  margin-bottom:5px; 
}

.rangeDataSheet .grayField .presentation1PartlyView {
  height: 125px;
  overflow: hidden;
}


.rangeDataSheet .grayField .presentation2 {
  margin-top:5px;
  margin-bottom:5px;
  display: none;
}

.rangeDataSheet .grayField .benefits {
  margin-top:5px;
  margin-bottom:5px;
  display: none;
}

.rangeDataSheet .grayField .applications {
  margin-top:5px;
  margin-bottom:5px;
  display: none;
}

.rangeDataSheet .grayField .lessButton {
   display: none;
}

.rangeDataSheet .grayField .buttons {
  margin-top:5px;
  margin-bottom:5px;
}

.rangeDataSheet .plusButton {
  background: url("img/green_plus_button.png") top left no-repeat;
  width: 23px;
  height: 23px;
  margin-top: 3px;  
  float: left;
}

.rangeDataSheet .minusButton {
  background: url("img/green_minus_button.png") top left no-repeat;
  width: 23px;
  height: 23px;
  margin-top: 3px;  
  float: left;
}

.rangeDataSheet .buttonText {
  font-size: 11px;
  font-weight: bold;
  padding-left: 28px;
  padding-top: 4px;
}

.rangeDataSheet .brandIcon {
  float:right;
  margin-top: -5px;
  width: 190px;
}

.additionalContentContainer .tabNavOptionsBack {
  background-color: #AEAFB2;
  float: left;  
}

.additionalContentContainer .tabNavOptionsBack .tabNavOptions {
  width: 200px;
  background-color: #F4F4F4;
  float: left;  
}

.additionalContentContainer .tabNavOptionsBack .tabNavOptions .tabNavTitle {
  color: #4FA600;
  font-size: 16px;
  font-weight: bold;
  padding-top: 20px;
  padding-bottom: 12px;
  margin-left: 20px;
}

.additionalContentContainer .tabNavOptionsBack .tabNavOptions .tabNavOption {
  border-top: 1px solid #EAEAEA;
  margin-left: 8px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-right: 0px solid #AEAFB2;
  overflow: hidden;
}
.additionalContentContainer .tabNavOptionsBack .tabNavOptions .tabNavOptionSelectedBack { 
  background-color: #AEAFB2;
  margin-left: 8px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.additionalContentContainer .tabNavOptionsBack .tabNavOptions .tabNavOptionSelected { 
  background-color: white;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-right:-2px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.additionalContentContainer .tabNavOptionsBack .tabNavOptions  .icon {
  width: 33px;
  height: 24px;
  float: left;
  margin-left: 8px;
}

.additionalContentContainer .tabNavOptionsBack .tabNavOptions  .text {
  font-size: 13px;
  font-weight: bold;
  color: #626469;
  padding-left: 5px;
  float: left;
  padding-top: 4px;
  cursor: pointer;
  width: 140px;
  position: relative;
}

.additionalContentContainer .tabNavOptionsBack .tabNavOptions  .prop24 {
  height: 24px;
  float: right;
  width: 1px;
}

.additionalContentContainer .tabNavOptionsBack .tabNavOptions  .prop34 {
  height: 34px;
  float: right;
  width: 1px;
}

.additionalContentContainer .tabContentBack {
  width: 797px;
  min-height: 500px;
  background-color: #AEAFB2;
  float: left;
  margin-left: -2px;
  margin-bottom: 20px;
}

.additionalContentContainer .tabContent {
  width: 797px;
  min-height: 500px;
  background-color: #FFFFFF;
  float: left;
  padding-bottom: 20px;
}

#productConfiguratorTab .icon {
  background: url("img/prod_configurator.gif") center center no-repeat;
}

#productSelectorTab .icon {
  background: url("img/prod_selector.gif") center center no-repeat;
}

#softwareRegistrationTab .icon {
  background: url("img/software.gif") center center no-repeat;
}

#downloadCenterTab .icon {
  background: url("img/download_center.gif") center center no-repeat;
}

#applicationsTab .icon {
  background: url("img/applications.gif") center center no-repeat;
}

#additionalInformationTab .icon {
  background: url("img/additional_information.gif") center center no-repeat;
}

#supportTab .icon {
  background: url("img/support.gif") center center no-repeat;
}

/* Additional Content Container */
.additionalContentContainer .tabContent .tabContentDetails {
  padding: 1px 8px;
  font-size: 12px;
}
.additionalContentContainer .tabContent .tabContentDetails .tabContentDetailsTitle {
  border-bottom: 1px solid #AEAFB2;
  height: 15px;
  
  padding-bottom: 20px;
  position: relative;
}
.additionalContentContainer .tabContent .tabContentDetails .tabContentDetailsTitle .icon {
  width: 34px;
  height: 34px;
  float: left;
}
.additionalContentContainer .tabContent .tabContentDetails .tabContentDetailsTitle .text {
  font-size: 13px;
  font-weight: bold;
  color: #626469;
  padding-left: 7px;
  padding-top: 9px;
  float: left;
}  
.additionalContentContainer .tabContent .tabContentDetails .tabContentDetailsText .tabContentDetailsIFrame {
  width: 781px;  
  min-height: 420px;
  border: 0px;
  overflow: hidden; 
  margin-bottom: 20px;
}

.addInfoIFrame{ 
  width: 781px;  
  min-height: 420px;
  border: 0px;
  overflow: auto; 
  margin-bottom: 20px;
}

/* Product Selector Tab Content */
#productSelectorTitle .icon {
  background: url("img/prod_selector.gif") center center no-repeat;
}
/* Software Registration Tab Content */
#softwareRegistrationTitle .icon {
  background: url("img/software.gif") center center no-repeat;
}
#softwareRegistration .tabContentDetailsText .tabContentDetailsIFrame {
  min-height: 775px;
  padding-top: 20px;
  margin-bottom: 0px;
}
/* Download Center Tab Content */
#downloadCenterTitle .icon {
  background: url("img/download_center.gif") center center no-repeat;
}
#downloadCenter .tabContentDetailsText .tabContentDetailsIFrame {
  min-height: 400px;
  padding-top: 20px;
  padding-bottom: 0px;
  margin-bottom: 0px;
}
/* Additional Information Tab Content */
#additionalInformationTitle .icon {
  background: url("img/additional_information.gif") center center no-repeat;
}
#additionalInformationLink{
	padding-top: 20px;
}
#additionalInformation .tabContentDetailsText ul{
	list-style: none outside none;
    margin: 0px;
    padding: 0px 0px 0px 9px;
}
#additionalInformation .tabContentDetailsText ul li {
    background: url("img/green_bullet.gif") no-repeat scroll left 3px transparent;
    color: #626469;
    padding: 0 0 8px 20px;
	font-size: 11px;
}
.errorMessageContainer {
  margin-top: 20px;
}

.errorMessageContainer P {
  font-size: 12px;
  color: #626469;
  line-height: 2;
}

.errorMessage {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 1px solid #CCC;
  padding: 10px;
}

.errorHr {
  margin: 0px;
}

#myFrame {
  /* margin-top: -35px; */
}

.initHeightTab {
	background: url('img/corner_tl_seedling.gif') top left no-repeat #87D300 !important;
	color: white !important;
	height: 40px !important;
	top: 0 !important;
}

.initHeightTab A {
	background: url('img/corner_tr_seedling.gif') top right no-repeat !important;
	color: white !important;
}