﻿html {
  background: #553a60 url(../images/background_body.png) repeat-y top center;
}

body {
  margin: 0;
  padding: 0;
  /*background: url(../images/background_swirl.png) repeat top center;*/ /* 1/6/2012 - swirls removed */
  font: 13px/18px Trebuchet, "Trebuchet MS", Verdana, sans-serif;
}

a {
  color: #452f4e;
}

form {
  margin: 0;
  padding: 0;
}

img {
  border: none;
}

li {
  margin-left: 15px;
}

ul {
  margin-left: 0;
  padding-left: 0;
}

.col0 {
  float: left;
}

.col1 {
  float: right;
}

input.text {
  width: 215px;
  height: 29px;
  padding: 0 0 0 10px;
  font: 20px/26px Trebuchet, "Trebuchet MS", Verdana, sans-serif;
  color: black;
  border: 2px solid #ccccc0;
}

input.button {
  font: 20px Trebuchet, "Trebuchet MS", Verdana, sans-serif;
  color: white;
  background: #38ad3a;
  border: 5px solid #dbd7de;
}

textarea {
  padding: 0 0 0 10px;
  font: 20px/26px Trebuchet, "Trebuchet MS", Verdana, sans-serif;
  color: black;
  border: 2px solid #ccccc0;
}

input.blur,
textarea.blur {
  color: #b4b5a9;
}


#widthContainer {
  width: 1003px;          /* TOO WIDE! */
  margin: 0 auto 0 auto;
  /*background: url(../images/background_widthContainer.png) repeat-y top left;*/
}

#header {
  padding: 11px 22px 0 22px;
  color: white;
}

#header a {
  color: white;
  text-decoration: none;
}

#header a:hover {
  text-decoration: underline;
}

.logoBox {
  float: left;
  display: block;
  width: 197px;
  height: 135px;
  margin: 0 0 0 5px;
}

#utilityNav {
  float: right;
  text-align: right;
}

#utilityNav a {
}

#utilityNav span {
  color: #b283c0;
}

#utilityNav form,
#utilityNav form div {
  display: inline;
}

#query {
  width: 195px;
  margin: 15px 0 0 15px;
}

#eightHundred {
  margin: 7px 0 0 0;
  font-weight: bold;
  font-size: 16px;
  line-height: 14px;
}

#topnav {
  position: relative;
  z-index: 200;
  float: right;
  clear: right;
  width: 729px;
  margin: -8px 0 0 0; 
  padding: 0;
  list-style: none;
  font-size: 17px;
  line-height: 20px;
}

#topnav li {
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
}

#topnav a {
  float: left;
  display: block;
  height: 48px;
  padding: 35px 32px 0 25px;  
  text-align: center;
  background: url(../images/separator_topnav.png) no-repeat top right;
}

#topnav li:hover a,
#topnav a:hover {
  color: #5ae859;
  text-decoration: none;
}

#topnav #findRepNav a {
  padding-right: 25px;
  background: none;
}

#topnav ul {
  display: none;
  position: absolute;
  top: 80px;
  left: 0;
  float: none;
  clear: both;
  width: auto;
  margin: 0;
  padding: 6px;
  list-style: none;
  font-weight: bold;
  font-size: 15px;
  line-height: 16px;
  background: white;
  border: 3px solid #4abe29;
}

#topnav li:hover ul {
  display: block;
}

#topnav ul li {
  float: none;
  white-space: nowrap;
}

#topnav ul li a {
  float: none;
  height: auto;
  padding: 3px 10px 5px 10px;
  text-align: left;
  color: #653f6c;
  background: none;
}

#topnav li:hover ul a {
  color: #653f6c;
}

#topnav ul li a:hover {
  color: white;
  background: #653f6c;
}





#mainContent {
  clear: both;
  width: 946px;
  margin: 0 auto 0 auto;
  padding: 6px 6px 6px;
  background: url(../images/background_box_green.png) repeat-x top left;
}

#mainContent div.content {
  padding-bottom: 51px;
  background: #c3b1c8;
}

#markets {
  background: url(../images/background_markets.png) no-repeat top left;
}

#markets #slideshow_nav {
  float: left;
  width: 360px;
  padding: 0;
}

#markets #slideshow_nav div.slideshow_nav_link {
  padding: 0 0 5px 20px;
  background: url(../images/background_slideshow_nav.png) no-repeat bottom left;
}

#markets #slideshow_nav div.slideshow_nav_link:last-child,
#markets #slideshow_nav div.slideshow_nav_link.last-child {
  background: none;
}

#markets #slideshow_nav a {
  display: block;
  padding: 0 0 0 20px;
  font-size: 26px;
  line-height: 55px;
  text-decoration: none;
  color: white;
}

#markets #slideshow_nav div.activeSlide a,
#markets #slideshow_nav a:hover {
  background: url(../images/background_green_arrow.png) no-repeat bottom left;
}

#markets #slideshow {
  float: right;
  width: 586px;
  height: 327px;
  margin: 0;
  padding: 0;
  list-style: none;
}

#markets #slideshow li {
  display: none;
  position: relative;
  width: 586px;
  height: 327px;
  margin: 0;
  padding: 0;
}

#markets #slideshow li div.link_text {
  display: none;
}

#markets #slideshow li div.caption {
  position: absolute;
  top: 173px;
  left: 28px;
  width: 469px;
  height: 80px;
  padding: 20px 30px 30px 25px;
  background: white;
  opacity: 0.8;
}

#markets #slideshow li p.caption {
  position: absolute;
  top: 173px;
  left: 28px;
  width: 469px;
  height: 80px;
  margin: 0;
  padding: 20px 30px 30px 25px;
  font-size: 20px;
  line-height: 28px;
  color: #653f6d;
}

#markets #slideshow li p.caption a {
  color: #653f6d;
}

#markets #slideshow li p.caption a:hover {
  color: black;
}



#getStarted {
  position: relative;
  z-index: 100;
  float: left;
  width: 540px;
  margin: -29px 0 0 15px;
  padding: 6px 6px 6px;
  background: url(../images/background_box_purple.png) repeat-x top left;
}

#getStarted div.content {
  min-height: 210px;
  padding: 10px 0 0 20px;
  background: #c3b1c8 url(../images/background_content_box.png) repeat-x top left;
}

#getStarted h1 {
  float: left;
  margin: 0 15px 0 0;
  font-weight: normal;
  font-size: 35px;
  line-height: 52px;
  color: #ff5f02;
}

#getStarted p {
  margin: 0;
  padding: 10px 0 0 0;
  line-height: 16px;
}

#contact {
  clear: both;
}

#contact input.text {
  width: 230px;
  margin: 5px 5px 0 0;
}

#contact #zip {
  float: left;
  width: 100px;
}

#contact textarea {
  float: left;
  width: 258px;
  height: 57px;
  margin: 5px 5px 0 0;
}

#contact #submit {
  width: 100px;
  height: 60px;
  margin: 6px 0 0 0;
  border-color: white;
}

#body_contact_form_warning {
  clear: both;
  margin: 5px 0 5px 0;
  font-weight: bold;
  font-size: 18px;
  color: #452f4e;
}




#learnMore {
  position: relative;
  z-index: 100;
  float: right;
  width: 337px;
  margin: -29px 15px 0 0;
  padding: 6px 6px 6px;
  background: url(../images/background_box_purple.png) repeat-x top left;
}

#learnMore div.content {
  min-height: 210px;
  padding: 10px 0 0 25px;
  background: #c3b1c8 url(../images/background_content_box.png) repeat-x top left;
}

#learnMore h2 {
  margin: 0;
  font-weight: normal;
  font-size: 30px;
  line-height: 52px;
  color: #33cc33;
}

#learnMore ul {
  margin: 0;
}

#learnMore li {
  margin-bottom: 3px;
}



#carouselContainer {
  margin: 0 15px 15px 15px;
}

#carouselLeft {
  float: left;
  margin-top: 50px;
}

#carouselRight {
  float: right;
  margin-top: 50px;
}

#carouselWidthContainer {
  width: 800px;
  margin: 0 auto 0 auto;
  padding: 0 7px 7px 7px;
  background: #a598ab;
}

#carouselContainer h3 {
  margin: 0;
  padding: 5px 0 6px 0;
  font-weight: normal;
  font-size: 15px;
  line-height: 14px;
  color: white;
}


#carousel {
  width: 801px;
  height: 86px;
  padding: 7px 0 7px 0;
  font-size: 14px;
  color: #231f20;
  background: white;
  overflow: hidden;
}

#carousel ul {
  margin: 0;
  padding: 0;
  list-style: none;
}


#carousel li {
  float: left;
  width: 250px;
  height: 76px;
  margin: 0;
  padding: 5px 6px 5px 10px;
  border-right: 1px solid #f3d8f3;
}

#carousel li img {
  display: block;
  float: right;
  margin: 0 5px 0 20px;
}

#carousel li a {
  color: #231f20;
  text-decoration: none;
}

#carousel li a:hover {
  text-decoration: underline;
}




#footer {
  margin: -51px 0 0 0;
  padding: 0 0 50px 0;
  color: white;
}

#footer a {
  color: white;
}



#footer .ui-tabs {
}

#footer .ui-tabs .ui-tabs-nav {
  margin: 0;
  padding: 0 0 0 1px;
  list-style: none;
  font-size: 24px;
  line-height: 40px;
}

#footer .ui-tabs .ui-tabs-nav li {
  float: left;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  border-top: 5px solid white;
  border-left: 5px solid white;
}

#footer .ui-tabs .ui-tabs-nav li#tab-space-left,
#footer .ui-tabs .ui-tabs-nav li#tab-space-right {
  height: 40px;
  border-top: 5px solid transparent;
  border-bottom: 5px solid white;
  border-left: none;
}

#footer .ui-tabs .ui-tabs-nav li#tab-space-left {
  width: 22px;
}

#footer .ui-tabs .ui-tabs-nav li#tab-space-right {
  width: 428px;
}

#tab-contact {
  border-right: 5px solid white;
}

#footer .ui-tabs .ui-tabs-nav li a {
  float: left;
  padding: 0 25px 0 25px;
  color: #aaa8ac;
  background: #dad9d5;
  text-decoration: none;
  border-bottom: 5px solid white;
}

#footer .ui-tabs .ui-tabs-nav li.ui-tabs-selected {
}

#footer .ui-tabs .ui-tabs-nav li.ui-tabs-selected a,
#footer .ui-tabs .ui-tabs-nav li.ui-state-disabled a,
#footer .ui-tabs .ui-tabs-nav li.ui-state-processing a {
  cursor: text;
}

#footer .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
  color: #f28f55;
  background: #6f4c79;
  border-bottom: 5px solid #6f4c79;
}


#footer .ui-tabs .ui-tabs-nav li a
#footer .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {
  cursor: pointer;
}

#footer .ui-tabs .ui-tabs-panel {
  display: block;
  float: left;
  width: 729px;
  height: 408px;
}

#footer .ui-tabs .ui-tabs-hide {
  display: none !important;
}

#footer .ui-tabs .ui-tabs-panel p.intro {
  margin: 0;
  font-size: 16px;
  line-height: 22px;
}

#footer .ui-tabs .ui-tabs-panel .col0 {
  width: 408px;
  padding: 50px 0 0 50px;
}

#footer .ui-tabs .ui-tabs-panel .col1 {
  width: 220px;
  padding: 50px 50px 0 0;
}




#panel-findRep {
  background: url(../images/background_panel_findRep.jpg) no-repeat top right;
}

#state_form {
  padding: 15px 0 10px 0;
}

#panel-findRep .col1 p {
  white-space: nowrap;
}




#panel-catalog {
  background: url(../images/background_panel_catalog.jpg) no-repeat top right;
}

#panel-catalog select,
#panel-catalog input {
  display: block;
  margin: 10px 0 0 0;
}



#panel-contact {
  background: url(../images/background_panel_contact.jpg) no-repeat top right;
}

#footer #panel-contact .col0 {
  width: 480px;
}

#panel-contact input.text,
#panel-contact textarea {
  display: block;
  float: left;
  margin: 10px 10px 0 0;
}

#footerZIP {
  width: 100px;
}

#panel-contact textarea {
  width: 330px;
  height: 70px;
  margin-bottom: 10px;
}

#panel-contact label.checkbox {
  clear: both;
  display: block;
  margin: 7px 0 0 0;
  font-size: 14px;
  line-height: 16px;
}

#siteAssessmentLabel {
  font-weight: bold;
  text-shadow: 1px 1px 1px black;  
}

#siteAssessmentLabel span {
  color: #4abe29;
}

#footerSubmit {
  float: left;
  margin: 15px 20px 0 0;
}

#footer_contact_form_warning {
  margin: 20px;
  font-weight: bold;
  font-size: 18px;
  color: #f28f55;
}




#contactInfo {
  float: right;
  width: 250px;
  padding-left: 23px;
}

#contactInfo h3 {
  margin: 40px 0 0 0;
  font-weight: normal;
  font-size: 24px;
  line-height: 18px;
  color: #c5df97;
}

#contactInfo p {
  margin: 25px 0 0 0;
}

#contactInfo span.phoneNumber {
  font-weight: bold;
  font-size: 16px;
}

#contactInfo address {
  margin: 25px 0 0 0;
  font-style: normal;
}

#contactInfo #social {
  margin-left: -3px;
}

#contactInfo #social a {
  margin-right: 6px;
}



#bottomnav {
  clear: both;
  margin: 30px 0 0 40px;
  padding: 0;
  list-style: none;
  color: #b283c0;
}

#bottomnav li {
  margin: 0;
  padding: 0;
  display: inline;
}

#copyright {
  margin: 10px 0 0 40px;
  font-style: italic;
}



.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

