@media (max-width: 1024px) {
	.desktop-only {
		display: none;
	}	
}
/*
  Styles for color selector tool page
*/

#content #inner-content {
  background: #332c29;
  color: #fff;
  padding: 3em 5.5em;
}


/******************************************************************
  Color Selector Images 
******************************************************************/
.color-sel-images {
  position: relative;
  width: 771px;
  height: 416px;
/*   border: 1px solid #403c3b; */
  margin: 0 auto;
}
.agricultural .color-sel-images {
  background: url('../images/color-selector/commercial-base.jpg');
}
.residential .color-sel-images {
  background: url('../images/color-selector/residential-base.jpg');
}
.color-sel-images .image-holder {
  position: absolute;
  top: 0;
  left: 0;
  width: 771px;
  height: 416px;
}
.color-sel-images .image-holder img {
  margin: 0;
}
.color-sel-images .image-holder span {
  position: absolute;
  top: 50%;
  width: 100%;
  color: #fff;
  font-size: 2em;
  text-align: center;
  text-shadow: 1px 1px #444;
}

.agricultural .color-sel-images #trim-img {
  z-index: 1;
}
.agricultural .color-sel-images #wainscot-img {
  z-index: 2;
}
.agricultural .color-sel-images #svcdoor-img {
  z-index: 3;
}
.agricultural .color-sel-images #siding-img {
  z-index: 4;
}
.agricultural .color-sel-images #roof-img {
  z-index: 5;
}

.residential .color-sel-images #trim-img {
  z-index: 1;
}
.residential .color-sel-images #wainscot-img {
  z-index: 2;
}
.residential .color-sel-images #gd-img {
  z-index: 3;
}
.residential .color-sel-images #svcdoor-img {
  z-index: 4;
}
.residential .color-sel-images #siding-img {
  z-index: 5;
}
.residential .color-sel-images #roof-img {
  z-index: 6;
}

/******************************************************************
  Color Selector Controls 
******************************************************************/
.color-sel-controls {
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 5;
  padding: 10px 10px 0;
}
.color-sel-controls .color-sel-icons {
  padding: 0;
}
.color-sel-controls .color-sel-icons span {
  background: #1c1c1c; /* Fallback for web browsers that doesn't support RGBa */
/*   background: rgba(50, 50, 50, 0.5); */ /* RGBa with 0.6 opacity */
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99323232, endColorstr=#99323232);  /* RGBa with 0.6 opacity */
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99323232, endColorstr=#99323232)"; /* For IE 8*/
  margin-right: 15px;
  box-sizing: border-box;
  float: right;
  margin-bottom: 10px;
  padding: 10px;
  width: 50px;
}
.color-sel-controls .color-sel-icons a {
  display: block;
  margin: 0 auto;
/*   opacity: 0.6; */
}
.color-sel-controls .color-sel-icons a:hover {
  opacity: 1;
}
.color-sel-controls .clear-colors {
  background: url('../images/icn-reset.png');
  width: 31px;
  height: 37px;
  background-position: center center;
  background-repeat: no-repeat;
}
.color-sel-controls .print {
  background: url('../images/icn-print.png');
  width: 29px;
  height: 31px;
  background-position: center center;
  background-repeat: no-repeat;
}
.color-sel-text-wrapper {
  background: #1c1c1c; /* Fallback for web browsers that doesn't support RGBa */
/*   background: rgba(50, 50, 50, 0.5); */ /* RGBa with 0.6 opacity */
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99323232, endColorstr=#99323232);  /* RGBa with 0.6 opacity */
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99323232, endColorstr=#99323232)"; /* For IE 8*/
  padding: 10px 0;
  margin-left: -0.625rem !important;
  margin-right: -0.625rem !important;
}
.color-sel-text-wrapper .labels {
	padding: 10px 5px 10px 0;
}
.color-sel-text-wrapper span {
  color: #fff;
  font-size: 12px;
  opacity: 0.5;
/*   padding-right: 0.5em; */
  text-decoration: none;
  text-transform: uppercase;
}

.color-sel-text-wrapper a {
  color: #9b9b9b;
  font-family: 'midietserif_bold';
  background-color: #4a4a4a;
  padding: 13px 10px 10px 10px;;
  font-size: 12px;
/*   opacity: 0.5; */
/*   padding-right: 0.5em; */
  text-decoration: none;
  text-transform: uppercase;
}  

.color-sel-text-wrapper a:hover {
  color: #fff;
}
.color-sel-text-wrapper .bldg-type {
/*   text-align: right; */
}
.color-sel.na .color-sel-text-wrapper .color-set-na,
.color-sel.ne .color-sel-text-wrapper .color-set-ne, 
.color-sel.agricultural .color-sel-text-wrapper .bldg-type-agricultural,
.color-sel.residential .color-sel-text-wrapper .bldg-type-residential {
  color: #fff;
  font-family: 'midietserif_bold';
  background-color: #db5626;
  padding: 13px 10px 10px 10px;;
  font-size: 12px;
}

/******************************************************************
  Color Selector Color Options 
******************************************************************/
.color-sel-options {
  margin: 15px auto 20px;
  width: 771px;
}
/* Tabs */
.color-sel-options .nav-tabs {
  border-bottom: 3px solid #f0f0f0;
  margin: 0;
  padding-bottom: 20px;
}
.color-sel-options .nav-tabs > li > a {
/*   background: url('../images/icon-tab.png') 8px 15px  no-repeat; */
  border: none;
  border-radius: 2px;
  color: #9b9b9b;
  font-size: 16px;
  font-weight: 700;
  padding: 6px 18px;
  text-transform: uppercase;
}
.color-sel-options .nav-tabs > li > a:hover, 
.color-sel-options .nav-tabs > li.active > a, 
.color-sel-options .nav-tabs > li.active > a:hover, 
.color-sel-options .nav-tabs > li.active > a:focus {
  background-color: #db5626;
  border: none;
  color: #fff;
}

/* Tab Content */
.color-sel-options .tab-content {
/*   background-color: #2f2524; */
  padding: 20px 15px;
}

.color-sel-options .current-selection {
	padding: 0;
}
/* Current Selection */
.color-sel-options .current-selection h4 {
  color: #a0a0a0;
  font-size: 16px;
  font-family: 'midietserif_bold';
  margin: 0 0 0.2em;
  text-transform: uppercase;
}
.color-sel-options .current-color-swatch {
  display: none;  /* changed to inline-block via jQuery when a color is selected */
  background: transparent;
/*   border: 2px solid #443C38; */
  border-radius: 2px;
  margin: 0 5px;
  width: 35px;
  height: 35px;  
}
.color-sel-options .current-color-name {
  display: none;  /* changed to inline-block via jQuery when a color is selected */
  position: relative;
/*   background: #db5626; */
  font-size: 14px;
  line-height: 38px;
  margin-left: 23px;
  padding: 0 10px 0 5px;
  text-transform: uppercase;
  vertical-align: top;
}
.color-sel-options .current-color-name:after {
  right: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.color-sel-options .current-color-name:after {
  border-color: rgba(209, 34, 41, 0);
  border-right-color: #db5626;
  border-width: 13px;
  top: 50%;
  margin-top: -13px;
}

/* Color Options */
.color-sel-options .color-options {
  margin: 0;
  padding: 0;
}
.color-sel-options .color-options li {
  float: left;
  padding: 3px;
}
.color-sel-options .color-options li a {
  width: 35px;
  height: 35px;
  display: block;
/*   border: 2px solid #443C38; */
  border-radius: 2px;
}

.color-sel-options .svcdoor-options li,
.residential .color-sel-options .gd-options li {
  display: none;
}

.color-sel-options .svcdoor-options .na-white-ne-white,
.color-sel-options .svcdoor-options .na-taupe-ne-clay,
.color-sel-options .svcdoor-options .na-brown,
.residential .color-sel-options .gd-options .na-white-ne-white,
.residential .color-sel-options .gd-options .na-taupe-ne-clay,
.residential .color-sel-options .gd-options .na-brown {
  display: block;
}


/* Mobile */
.color-sel-notify {
  border: 8px solid #716C6A;
  color: #716C6A;
  font-size: 1.4em;
  padding: 80px 10px;
  text-align: center;
}


/******************************************************************
  Print styles
******************************************************************/
@media print {
  a:after,
  a:visited:after,
  a abbr[title]:after,
  a:visited abbr[title]:after {
    content: none !important;
  }

  #header #searchform {
    display: none;
  }

  #content #inner-content {
    padding: 1em;
  }

  .color-sel-wrapper {
    display: block;
  }

  .color-sel-options .nav-tabs {
    width: 30%;
    float: left;
  }
  .color-sel-options .nav-tabs > li {
    float: none;
    height: 40px;
    /*border-bottom: 1px solid #000;*/
    margin: 0;
  }
  .color-sel-options .tab-content {
    width: 70%;
    float: right;
    padding: 0;
  }
  .color-sel-options .tab-content > .tab-pane {
    display: block;
    height: 40px;
    /*border-bottom: 1px solid #000;*/
  }
  .color-sel-options .current-selection {
    width: 100%;
  }
  .color-sel-options .current-selection h4 {
    display: none;
  }
  .color-sel-options .current-color-swatch {
    display: none !important;
  }
  .color-sel-options .current-color-name {
    line-height: 40px;
  }
  .color-sel-options .current-color-name:after {
    display: none;
  }
  .color-sel-options .color-options,
  .color-sel-options .color-options li,
  .color-sel-options .color-options li a {
    display: none !important;
  }

  .mobile-only {
    display: none;
  }

  .testimonial {
    display: none;
  }
}