/* This is the Documentation to change the colors for a specific site within TKM.*/

/*----------------ACCENT COLOR #1----------------*/

/*----Header Background Color - Navigation Hover Background----*/

header nav ul.nav-main li a:hover,
header nav ul.nav-main li.dropdown:hover a {
   background: #9ecf71 !important;
   background-color: #9ecf71 !important;
}

/*----Dropdown Menu Border----*/

header nav.mega-menu ul.nav-main li.mega-menu-item ul.dropdown-menu {
   border-top-color: #9ecf71 !important;

}


/*----------------ACCENT COLOR #2----------------*/

/*----Page Title Border----*/v

section.page-top h2 {
   border-color: #64828d;
}

/*----Sidebar and Header Fonts----*/

h1, h2, h3, h4, li a {
   color:  #404751;
}

/*----My Account Boxes - Border Top---*/

div.featd-box-secondary div.feat-content {
   border-top-color: #788DA2 !important;
}

/*----Sidebar Menu Background Color - Active----*/

ul.nav-pills > li.active > a, ul.nav-pills > li.active > a:hover, ul.nav-pills > li.active > a:focus {
   background-color: #788DA2 !important;
}

/*----Button Background----*/

.btn-primary {
   background: #324157 !important;
   border: 0px !important;
}

/*---- Page Title & Company Name Font ----*/

section.page-top h2 {
   border-bottom-color:  #64828d !important;
}
 
/*----------------NEUTRAL COLOR #1----------------*/

/*----Footer Background----*/

div.footer-copyright{
   background: #9ecf71;
   color: #fff;
   
}

div.footer-copyright p{
  
   color: #fff;
   
}

/*----Navigation Font----*/

header nav ul.nav-main li a {
   color: #ffffff;
}

/*----Footer Border----*/

div.footer-copyright {
   border-color: #324157;
}

/*----Header Border-Top & Border-Bottom----*/

section.page-top {
  background: #fff;
  border-bottom: medium none;
  border-top: medium none;
}

/*----Sidebar Menu Font Color----*/

.main .container .col-md-3 .nav li a:hover {
   color: #666666 !important;
}

/*----Button Background - Hover State----*/
.btn-primary:hover  {
   background: #9ecf71 !important;
   border: 0px !important;
   text-shadow: 0 0px 0 rgba(0, 0, 0, 0);
}

/*----------------NEUTRAL COLOR #2----------------*/

/*----Footer Menu Font----*/

#sub-menu a,
.nav-pills>li.active>a {
   color: #ffffff !important;
}

/*----Page Title Font----*/

section.page-top h2 {
   color: #ffffff !important;
}





/*--------TKM CUSTOM THEMING--------*/
/*------------DO NOT CHANGE------------*/

.nav-top,
.search, 
.social-icons,
.footer-copyright .container .col-md-1,
.footer-copyright .col-md-7,
footer .container .row {
   display: none !important;
}

.footer-copyright .container .row {
   display: block !important;
}

footer {
   padding: 0px !important;
}

footer .col-md-4 {
    width: 100% !important;
}

div.footer-copyright {
   margin-top: 0px !important;
}

div.footer-copyright nav ul li {
   border-left: 0px !important;
   padding: 0px !important;
}

#sub-menu a:hover {
   text-decoration: none !important;
   color: #324157 !important;
}

@media (min-width: 992px) {
.dropdown-menu {
   min-width: 250px;
   width: 25% !important;
   left: inherit !important;
}
}

@media (min-width: 992px) {
nav.mega-menu .nav, nav.mega-menu .dropup, nav.mega-menu .dropdown, nav.mega-menu .collapse {
   position: relative !important;
}
}

@media (max-width: 991px) {
.dropdown-menu {
   width: 85% !important;
   left: inherit !important;
}
}

.dropdown-menu .col-md-3 {
   width: 105% !important;
}

header nav.mega-menu ul.nav-main li.mega-menu-item ul.dropdown-menu {
   border-radius: 0px !important;
}

header {
   background: rgba(73, 117, 170, 0.66);
   border-top: medium none;
   min-height: 111px;
   padding: 0;
}

footer {
   background: none !important;
   border-top: 0px !important;
}

header h1.logo img {
    max-height: 130px;
    width: auto;
}

.page-top .col-md-12 .title {
   float: left;
}

.page-top .col-md-12 .company {
   float: right;
}

/*--------RAA CUSTOM THEMING--------*/
html, body {
font-family: 'Century Gothic', Helventica, Arial, sans-serif; !important
}
.container{
padding-top: 20px;
}
.product .product-content-name {
  font-size: 1em;
  letter-spacing: normal;
  text-overflow: inherit;
  white-space: normal;
}

@media screen and (max-width: 991px){
.sidebar {
display: none !important;
}
}

a:hover,
a:focus {
  text-decoration: none !important;
}

span.product-content-price {
font-weight: bold;
font-size: 1.15em;
color: #404751;
text-decoration: underline;
}

span.product-content-price::after { 
    content: " / Label";
}

div.product-pricing {
text-align: left !important;
}

.CheckoutTableOptions.item-desc-color {
display: none;
}

.CheckoutTableOptions.item-desc-size {
display: none;
}

.CheckoutTableOptions.item-desc-type {
display: none;
}

.product-id {
display: none;
}

.prod-id-col {
display: none;
}

.prod-sku-col {
display:block!important;
}
.product-content-inventory{
display: none!important;
}

.collapsible {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .collapsible:hover {
  background-color: #ccc;
}

/* Style the collapsible content. Note: hidden by default */
.content {
  padding: 0 18px;
  display: none;
  overflow: hidden;
  background-color: #f1f1f1;
}