.col-main a {
    color: #003cff;
    text-decoration: underline;
}
 
.col-main a:hover,
.col-main a:focus{
    text-decoration: none;
}
 
.blog-single-main p,
.std p,
.projectDetail .description p,
.tabs-content p{
  margin: 0 0 1em;
}
 
 
/* 
Nomenclature:
In this document I will refer to square or rectangular shaped things that have mixed content (text and images) as "cards".
Sometimes they are list items, sometimes they are divs.
*/
 
/* START card border & shadow */
.apptrian-subcategories-layout-grid li,
.catalog-category-view .products-grid li.item, 
.cms-new-products .products-grid li.item,
.widget-new-products li.item,
.widget.featuredProducts .products-grid li.item,
#upsell-product-table li,
#tab_projects_content .project, 
.projectsWrap .project,
.lastProjectsWrap .project,
.catalogsearch-result-index .products-grid li.item{
  border:1px solid #e4e4e4;
  margin: 0 15px 15px 0;
  -webkit-box-shadow: 6px 6px 16px -9px rgba(0,0,0,0.08);
  -moz-box-shadow: 6px 6px 16px -9px rgba(0,0,0,0.08);
  box-shadow: 6px 6px 16px -9px rgba(0,0,0,0.08);
}
 
/* hover over effect */
.apptrian-subcategories-layout-grid li:hover,
.catalog-category-view .products-grid li.item:hover, 
.cms-new-products .products-grid li.item:hover,
.widget-new-products li.item:hover,
.widget.featuredProducts li.item:hover,
#upsell-product-table li:hover,
#tab_projects_content .project:hover, 
.projectsWrap .project:hover,
.lastProjectsWrap .project:hover,
.widget.featuredProducts .products-grid li.item:hover,
.catalogsearch-result-index .products-grid li.item:hover
{
  border:1px solid #70b836;
}
 
/* END card border & shadow */
 
 
.apptrian-subcategories-layout-grid li,
.catalog-category-view .products-grid li.item, 
.cms-new-products .products-grid li.item,
.widget-new-products li.item,
.widget.featuredProducts .products-grid li.item,
#upsell-product-table li,
#tab_projects_content .project, 
.projectsWrap .project,
.lastProjectsWrap .project,
.catalogsearch-result-index .products-grid li.item{
  border:1px solid #e4e4e4;
  margin: 0 0 15px  20px !important;
  transform: translate(-20px, 0);
  width:calc(20% - 30px) !important; /* 5 col */
  height: auto !important;
  max-height: auto !important;
  min-height: auto !important;
  padding-bottom:4.5em !important;
}
 
.apptrian-subcategories-layout-grid li,
.catalog-category-view .products-grid li.item{
  width:calc(20% - 22px) !important; /* 5 col */
}
 
 
@media(min-width: 1200px) {
  .col2-left-layout .col-main {
      padding-right: 0;
      margin-right: 25px;
      width: 922px;
  }
 
 
  .apptrian-subcategories-layout-grid li,
  .catalogsearch-result-index .products-grid li.item{
    width: calc(19.7% - 20px) !important;/* 5 col */
  }
  .apptrian-subcategories {
    width: 945px;
  }
     
  .projectsWrap {
    width: 976px !important;
    max-width: none !important;
    display: block;
  }
}
 
.category-products .products-grid{
  /*width:calc(100% + 20px) !important;*/ /* 1 col */
  width:calc(100%) !important;
}
 
tab_projects_content .project, 
.projectsWrap .project,
.lastProjectsWrap .project,
.widget-new-products li.item,
#tab_projects_content .project{
    width:calc(25% - 30px) !important;/* 5 col */
}
 
a.product-image > img {
    max-width: 100%;
    height: auto;
}
 
 
/* category page html elements are arranged differently */
ul.apptrian-subcategories-layout-grid > li{
  padding-bottom: 0 !important;
}
 
.apptrian-subcategories-layout-grid li > a{
  padding-bottom: 4.5em !important;
}
/* end category page html elements are arranged differently */
 
 
/* recommended product links have min height as inlince css*/
#upsell-product-table li a{
  min-height: 100% !important;
}
 
/* START card heights */
/* Needed for grid views to line up well vertically */
/* #upsell-product-table li{
  height: 235px;
}
 
.apptrian-subcategories-layout-grid li{
  height: 210px;
}
 
.catalog-category-view .products-grid li.item, .catalogsearch-result-index .products-grid li.item, .cms-new-products .products-grid li.item{
  height: 220px;
} */
/* END card heights */
 
 
/* START special rules to make Featured product cards line up with New products above */
.widget.featuredProducts .products-grid li.item{
  float:left;
  display: block;
  position: relative;
  width:auto;
  margin-right:20px;
  height: 240px;
}
 
.widget.featuredProducts .products-grid,
.widget.featuredProducts .innerWrap{
  display: block;
  padding:0;
  margin: 0;
}
 
 
.widget.featuredProducts .products-grid li.item .product-name{
  margin: 0;
}
 
/* END special rules to make Featured product cards fall in line. */
 
 
/* START card label position rules */
.apptrian-subcategories-layout-grid li a,
.category-products .products-grid li > a{
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}
 
.apptrian-subcategories-layout-grid li span,
.catalog-category-view .products-grid .product-name a,
.catalogsearch-result-index .products-grid .product-name a,
.cms-new-products .products-grid .product-name a,
.products-grid .product-name,
#upsell-product-table .product-name,
#tab_projects_content .project .caption, 
.projectsWrap .project .caption,
.lastProjectsWrap .project .caption,
.apptrian-subcategories-layout-grid li > a > span{
    padding: 0px 15px;
    margin-bottom: 0px;
    left: 0px;
    position: absolute;
    box-sizing:border-box;
    width: 100%;
    max-width:100%;
    box-sizing: padding-box;
    border: 0px none;
    background: transparent;
    bottom:0;
    top:auto;
    z-index: 2;
}
/* END card label position rules */
 
 
/* START special rules for project cards */
 
/* we'll use a white background on labels of project thumbnails since it is more likely 
that the image will fall behind the text, and also they tend to not be isolated images 
(product images are on a white background) */
#tab_projects_content .project .caption, 
.projectsWrap .project .caption,
.lastProjectsWrap .project .caption{
   background: #fff;
}
 
/* the author is unnecessary in the project card */
#tab_projects_content .project .caption .author, 
.projectsWrap .project .caption .author,
.lastProjectsWrap .project .caption .author{
  display: none;
}
 
/* END special rules for project cards */
 
 
/* START some typography for the card labels */
.apptrian-subcategories-layout-grid li span,
.catalog-category-view .products-grid .product-name a,
.catalogsearch-result-index .products-grid .product-name a,
.cms-new-products .products-grid .product-name a,
#upsell-product-table li h3 a,
.products-grid .product-name a,
#tab_projects_content .project .caption .name, 
.projectsWrap .project .caption .name,
.lastProjectsWrap .project .caption .name,
.apptrian-subcategories-layout-grid li > a > span
{
    display: flex ;
    justify-content: center;
    flex-direction: column;
    box-sizing: border-box;
    height: 5em;
    font: 300 16px "Roboto";
    text-align: center;  
    color: #555 !important;
    font-size: 14px;
    text-decoration: none;
    word-wrap: break-word;
}
/* END some typography for the card labels */
 
 
/* to help with "See All >" positioning on the home page in mobile view */
.newProductsWrap {
    position: relative;
    display: block;
    padding: 0;
    margin: 0;
}
a.seeAll {
    right: 0;
    position: absolute;
    top: 0;
}
 
 
/* mobile rules */
.col-main .widget-new-products,
.lastProjectsWrap, .projectsWrap{
  max-width: 100%;
}
 
.widget-new-products .products-grid li.item, .widget.featuredProducts .products-grid li.item{
  margin-right:0 !important;
}
 
.lastProjectsWrap .project{
  border:1px solid #e4e4e4;
}
 
@media (max-width: 650px) {
  .apptrian-subcategories-layout-grid li,
  .catalog-category-view .products-grid li.item, 
  .cms-new-products .products-grid li.item,
  .widget-new-products li.item,
  .widget.featuredProducts .products-grid li.item,
  #upsell-product-table li,
  #tab_projects_content .project, 
  .projectsWrap .project,
  .lastProjectsWrap .project,
  .catalogsearch-result-index .products-grid li.item{
    width:calc(50% - 30px) !important;    
    padding-bottom:4.5em !important;
  }
   
   #tab_projects_content .project,
  .projectsWrap .project,
  .lastProjectsWrap .project{
    height: 30vw !important; 
  }
}
 
 
@media (max-width: 500px) {
   
  .searchautocomplete-placeholder{ 
    position: absolute !important;
    left: 0%;
    top:50px !important;
    width: 95% !important;
    max-width: 1000%;
    margin: 0 0 0 0;
    overflow: hidden;
  }
   
  .apptrian-subcategories-layout-grid li,
  .catalog-category-view .products-grid li.item, 
  .cms-new-products .products-grid li.item,
  .widget-new-products li.item,
  .widget.featuredProducts .products-grid li.item,
  #upsell-product-table li,
  #tab_projects_content .project, 
  .projectsWrap .project,
  .lastProjectsWrap .project,
  .catalogsearch-result-index .products-grid li.item{
    width:calc(100% - 10px) !important;
    max-width: 100%;
    padding-bottom:4.5em !important;
  }
   
  #tab_projects_content .project,
  .projectsWrap .project,
  .lastProjectsWrap .project{
    height: 50vw !important; 
  }
}
 
/* to make sure the SALE and NEW corner banners are on top */
.saleIcon, .newIcon{
  z-index: 100;
}
 
 
/* fix linkless gap between photo and title of project cards by using the unnecessary button that was
only showing up in mobile view*/
.project > .caption > a.viewProject{
  display: block !important;
  position: absolute !important;
  top:-1em;
  left:0;
  height: 100%;
  width:100%;
  overflow: hidden;
  line-height: -999em !important;
  padding-top: 999em !important;
  background-color: transparent !important;
}
 
/* position the images in the cards */
.apptrian-subcategories-layout-grid li img,
.catalog-category-view .products-grid li.item img,
.catalogsearch-result-index .products-grid li.item img,
.cms-new-products .products-grid li.item img{
    margin: 10px auto 0 auto;
    display: block;
    position: relative;
}
 
/* position images in PROJECT cards */
#tab_projects_content.tabs-content .project img, 
.projectsWrap .project img,
.lastProjectsWrap .project img{
  display: block;
   
  position: relative !important;
  margin:0 0 -50% 50%;
   
  transform: translate(-50%, -50%);
  top:50% !important;
   
  min-height: auto !important;
  height: auto !important;
  max-height: auto !important;
   
  min-width: auto !important;
  width: 100.5% !important;
  max-width: none !important;
}
 
#tab_projects_content .project a,
.projectsWrap .project > a,
.lastProjectsWrap .project > a{
  display: block;
  height: 9vw !important; 
  max-height: auto;
  min-height: 100%;
  text-align: center;
  border: 1px solid #fff;
}
 
 
/* add some margin to the top of project cards wrappers */
.projectsWrap, .lastProjectsWrap{
    margin-top:1em;
}
 
/* center product images */
.products-grid .product-image{
    text-align: center;
}
 
 
 
/* CONTENT AREAS
–––––––––––––––––––––––––––––––––––––––––––––––––– */
 
 
/* Video
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
 
/* Images
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.blog-single-main img,
.std img,
.tabs-content img{
  max-width: 100%;
  height: auto;
  position: relative;
  margin: auto;
}
 
 
/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.blog-single-main ul,
.std ul,
.projectDetail .description ul,
.tabs-content ul{
  list-style: inside; 
}
 
.blog-single-main ol,
.std ol,
.projectDetail .description ol,
.tabs-content ol{
  list-style: decimal inside; 
}
 
.blog-single-main ol, .blog-single-main ul,
.std ol, .std ul,
.projectDetail .description ol, .projectDetail .description ul,
.tabs-content ol, .tabs-content ul{
  padding-left: 0;
  margin: 1.5em 0 1.5em 3em !important;
  font-size: 90%; 
}
 
.blog-single-main li,
.std li,
.projectDetail .description li,
.tabs-content li{
  margin-bottom: 1em; 
}
 
 
/* Text
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.blog-single-main,
.std,
.projectDetail .description,
.tabs-content{
  color:#555;
  font-size: 15px;
  line-height: 1.6;
}
 
 
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.blog-single-main a,
.std a,
.projectDetail .description a,
.tabs-content a{
  text-decoration: underline;
}
 
.blog-single-main a:hover, .blog-single-main a:focus,
.std a:hover,.std a:focus,
.projectDetail .description a:hover, .projectDetail .description a:focus,
.tabs-content a:hover, .tabs-content a:focus{
  color:#70b836;
}
 
/* heading spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.blog-single-main h1 + p, .blog-single-main h2 + p, .blog-single-main h3 + p, .blog-single-main h4 + p, .blog-single-main h5 + p, .blog-single-main h6 + p,
.std h1 + p, .std h2 + p, .std h3 + p, .std h4 + p, .std h5 + p, .std h6 + p,
.projectDetail .description h1 + p, .projectDetail .description h2 + p, .projectDetail .description h3 + p, .projectDetail .description h4 + p, .projectDetail .description h5 + p, .projectDetail .description h6 + p,
.tabs-content h1 + p, .tabs-content h2 + p, .tabs-content h3 + p, .tabs-content h4 + p, .tabs-content h5 + p, .tabs-content h6 + p
{
  margin-top:0.25em;
}
 
.blog-single-main p + h1, .blog-single-main p + h2, .blog-single-main p + h3, .blog-single-main p + h4, .blog-single-main p + h5, .blog-single-main p + h6,
.std p + h1, .std p + h2, .std p + h3, .std p + h4, .std p + h5, .std p + h6,
.projectDetail .description p + h1, .projectDetail .description p + h2, .projectDetail .description p + h3, .projectDetail .description p + h4, .projectDetail .description p + h5, .projectDetail .description p + h6,
.tabs-content p + h1, .tabs-content p + h2, .tabs-content p + h3, .tabs-content p + h4, .tabs-content p + h5, .tabs-content p + h6
{
  margin-top:1.5em;
}
 
/* does not appear this element is being used. */
.imagesSpecsWrap{
    display: none;
}
 
 
 
 
/* zebra tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
table.zebra{
  border: 1px solid #e4e4e4;
  font-size: 12px;
  background: #fff;
  width: 100%;
}
 
table.zebra [valign="middle"]{
  vertical-align: middle;
}
 
table.zebra [align="center"]{
  text-align: center;
}
 
table.zebra td{
  padding: 0.25em 1em;
}
 
table.zebra tr:nth-child(odd){
  background: #f6f6f6;
}
 
table.zebra caption{
  text-align: center;
  line-height: 0.75em;
  font-size: 1.20em;
  color:#444;
  font-size:1.25em;
  padding-top:1em;
}
 
table.zebra th {
  background:#555;
  color:#fff;
  padding: 0.25em 1em;
}
 
table.zebra,
table.zebra td{
  border: 1px solid #ddd;
}
 
table.zebra th{
  border: 1px solid #333;
}
 
 
.buyTableBtn{
  display: block;
  position: relative;
  background: #70b836;
  color:#fff !important;
  text-decoration: none !important;
  white-space: nowrap;
  padding: 0.25em 0.75em;
  text-transform: uppercase;
}
 
table.rowHighlight tr:hover{
  background: #ffffb4;
  background: rgba(255,255,100,0.3);
}
 
.buyTableBtn:hover,
.buyTableBtn:focus{
  background: #63a32f;
}
 
/* live search
–––––––––––––––––––––––––––––––––––––––––––––––––– */
 
/* live search container shadow */
.searchautocomplete-placeholder{
  -webkit-box-shadow: 0px 10px 20px -4px rgba(0,0,0,0.60);
  -moz-box-shadow: 0px 10px 20px -4px rgba(0,0,0,0.60);
  box-shadow: 0px 10px 20px -4px rgba(0,0,0,0.60);
  z-index: 10000000000;
  position:relative;
  margin-top:9px;
  display: block ;
}
 
/* prevent other content from overlapping the live search */
.main-container{
  position: relative;
  z-index: 5;
}
 
/* title of live search group */
.searchautocomplete .searchautocomplete-placeholder .index-title{
  display: block;
  position: relative;
  margin: 1em 0 0 0;
  padding: 0.25em 0 0.25em 0;
}
 
/* don't bump down the first search group title so much */
.searchautocomplete .searchautocomplete-placeholder div.top + div.index-title{
  margin: -0.5em 0.5em 0 0 !important;
}
 
/* live search result list item */
.searchautocomplete .searchautocomplete-placeholder ul li{
  margin: -1px 0 0 0;
  display: block;
  position: relative;
}
 
/* live search result list item HOVER effect */
.searchautocomplete .searchautocomplete-placeholder ul li:hover{
  border:1px solid #70b836;
  z-index: 100;
  background: #fff;
}
 
/* live search result product image */
.searchautocomplete .searchautocomplete-placeholder ul li .searchautocomlete-image{
  margin: 1em 1em 2.5em 0;
}
 
/* live search result description */
.searchautocomplete .searchautocomplete-placeholder ul li .highlight{
/*   font-weight: 300;
  font-size: 12px;
  padding: 0 1em 0.5em 1em;
  margin: 0;
  color:#777; */
   
  display: none;
}
 
/* live search result title */
.searchautocomplete .searchautocomplete-placeholder ul li a.name.highlight{
  font-weight: 300;
  font-size: 15px;
  padding:0.5em 0.5em 0.5em 1em;
  margin: 0;
  word-break:break-word;
}
 
/* banish extra line breaks */
.searchautocomplete .searchautocomplete-placeholder ul li br{
  display: none;
}
 
/* live search result highlight matching text */
.searchautocomplete .searchautocomplete-placeholder ul li a.name strong{
  font-weight: 300;
  background: #ffffb4;
  background: rgba(255,255,100,0.5);
  color:inherit;
  display: inline;
  padding: 0;
}
 
/* live search result product pricing */
.searchautocomplete .searchautocomplete-placeholder ul li .price-box{
  position: relative;
  display: block;
  margin: 0 auto;
  color:#70b836;
  background: transparent;  
  text-align: center;
  width:100%;
}
 
/* remove border around product price*/
.searchautocomplete .searchautocomplete-placeholder ul li .price-box [id^="product-pric"]{
  border: 0;
 
  display: block;
  width: 100%;
  text-align: center;
}
 
/*.catalog-product-view .availability .row, .catalog-product-view .price-box .row{
  display: block;
}*/
 
/* hide unnecessary stuff */
.searchautocomplete .searchautocomplete-placeholder ul li .price-box .priceLabel,
.searchautocomplete .searchautocomplete-placeholder ul li .price-box a{
  display: none;
}
 
/* All Search Results button*/
.searchautocomplete .searchautocomplete-placeholder .all{
  display: block;
  position: relative;
  margin: 0.5em 0 0 0;
  padding: 0;
  text-align: center;
}
.searchautocomplete .searchautocomplete-placeholder .all a{
  display: inline-block;
  background: #70b836;
  text-align: center;
  margin: 0.5em auto;
  padding: 0.5em 1em;
  color:#fff;
  text-transform: uppercase;
}
.searchautocomplete .searchautocomplete-placeholder .all a:hover,
.searchautocomplete .searchautocomplete-placeholder .all a:focus{
  background:#63a32f;
}
 
.noResults, .notEnoughCharacters{
  display: block;
  position: relative;
  color:#555;
  text-align: center;
  font-family: Roboto;
  font-weight: 300;
  font-size:1.25em;
  padding:1.5em;
}
 
.noResults strong, .notEnoughCharacters strong{
  display: block;
}
 
/* live search spinner */
.searchautocomplete .searchautocomplete-loader{
  -ms-transform: scale(2,2); 
  -webkit-transform: scale(2,2);
  transform: scale(2,2);
  top:15px;
}
 
@-moz-keyframes f_autocomplete_loader {
  0% {
    background-color: #003cff;
  }
  100% {
    background-color: #ffffff;
  }
}
@-webkit-keyframes f_autocomplete_loader {
  0% {
    background-color: #003cff;
  }
  100% {
    background-color: #ffffff;
  }
}
@-ms-keyframes f_autocomplete_loader {
  0% {
    background-color: #003cff;
  }
  100% {
    background-color: #ffffff;
  }
}
@-o-keyframes f_autocomplete_loader {
  0% {
    background-color: #003cff;
  }
  100% {
    background-color: #ffffff;
  }
}
@keyframes f_autocomplete_loader {
  0% {
    background-color: #003cff;
  }
  100% {
    background-color: #ffffff;
  }
}
 
/* arrow at top of live search results box */
.searchautocomplete .searchautocomplete-placeholder::before {
  left:50%;
  display: none;
}
 
@media(min-width: 940px) {
  /* live search container */
  .searchautocomplete .searchautocomplete-placeholder{
    display: block;
    left: -20% !important;
    position: absolute;
    width: 200% !important;
  }
}
 
@media(min-width: 750px) {
  /* live search container */
  .searchautocomplete .searchautocomplete-placeholder{
    display: block;
    left: -10%;
    position: absolute;
    width: 100%;
  }
 
  .searchautocomplete .searchautocomplete-placeholder .index-title,
  .searchautocomplete .searchautocomplete-placeholder ul{
    display: flex !important;
    flex-direction: row;
    position: relative;
    top:0;
    left: 0;
    margin: auto;
  }
   
  .searchautocomplete .searchautocomplete-placeholder ul{
  }
   
  .searchautocomplete .searchautocomplete-placeholder .index-title{
    margin:0.5em 0.5em 0 0;
    text-align: left;
  }
   
  .searchautocomplete .searchautocomplete-placeholder ul li{
    flex-grow: 1;
    width: 15.57% ;
    margin: 0.5em 1% 0  0;
    display: block;
     
    -webkit-box-shadow: 6px 6px 16px -9px rgba(0,0,0,0.08);
    -moz-box-shadow: 6px 6px 16px -9px rgba(0,0,0,0.08);
    box-shadow: 6px 6px 16px -9px rgba(0,0,0,0.08);
  }
   
  /* in rare cases more than 6 items are shown in a cateogry, it messes up the layout so hide items more than 6 */
  .searchautocomplete .searchautocomplete-placeholder ul li:nth-child(7),
  .searchautocomplete .searchautocomplete-placeholder ul li:nth-child(8),
  .searchautocomplete .searchautocomplete-placeholder ul li:nth-child(9),
  .searchautocomplete .searchautocomplete-placeholder ul li:nth-child(10){
    display: none;
  }
   
  /* live search result title */
  .searchautocomplete .searchautocomplete-placeholder ul li a.name.highlight{
    font-weight: 300;
    font-size: 13px !important;
    padding:0.5em 0.5em 0.5em 1em;
    text-align: center;
  }
   
  /* live search result product image */
  .searchautocomplete .searchautocomplete-placeholder ul li .searchautocomlete-image{
    margin: 1em auto 0 auto;
    float:none;
    text-align: center;
    width: 100%;
  }
   
  /* live search result description */
  .searchautocomplete .searchautocomplete-placeholder ul li .highlight{
    margin: 0 0.5em 2.5em 0.5em;
  }
   
 
}/* end media query*/
 
/* Search Results Page
–––––––––––––––––––––––––––––––––––––––––––––––––– */
 
/* live search result product pricing */
.catalogsearch-result-index .price-box{
  position: relative;
  display: block;
  margin: 0 auto;
  color:#70b836;
  background: transparent;  
  text-align: center;
  width:100%;
}
 
.catalogsearch-result-index .price-box .priceLabel,
.catalogsearch-result-index .products-grid .actions,
.catalogsearch-result-index .price-box a,
.catalogsearch-result-index .products-grid br{
  display: none;  
}
 
/* SRP highlight matching text */
.searchindex-highlight{
  font-weight: 300;
  background: #ffffb4;
  background: rgba(255,255,100,0.5);
  color:inherit;
  display: inline;
  padding: 0;
}
 
/* SRP product name */
.catalogsearch-result-index .products-grid .product-name a{
  display: block;
  position: relative;
  top: 50% !important;
  margin: 0;
  height: auto;
  transform: translate(0, -50%);
  bottom: 0;
  vertical-align: middle;
}
.catalogsearch-result-index .products-grid .product-name{
  display: block;
  position: absolute;
  height: 5em;
}
 
 
/* SRP "Pages" results */
.searchindex-result ul:not(.pager) li{
  display: block;
  position: relative;
  margin: 0 0 0.5em 0;
  border-bottom: 1px solid #e4e4e4;
  padding: 0 0 1.0em 0;
}
 
.searchindex-result .title a{
  color:#003cff !important;
  text-decoration: underline;
  font-size: 1.125em !important;
  font-weight: 300 !important;
}
 
.searchindex-result .title a:hover,
.searchindex-result .title a:focus{
  text-decoration: none;
}
 
.searchindex-result .content{
  color:#555 !important;
  font-size: 0.9em;
}
 
/* SRP categories results */
.searchindex-result-category a{
  color:#003cff !important;
/*   text-decoration: underline; */
  font-size: 1.125em !important;
  font-weight: 300 !important;
}
 
.searchindex-result-category a:hover,
.searchindex-result-category a:focus{
  text-decoration: none;
}
 
.searchindex-result-category li{
  color:#fff;
  font-size: 0;
}
 
.searchindex-result-category li a:last-child{
  display: inline-block;
  overflow: hidden;
/*   border:1px solid red; */
  padding:0.5em 0 0 0;
  margin:0;
  height: 2.5em;  
  font-size: 15px !important;
}
.searchindex-result-category li a:last-child:after{
  content:attr(href);
  display: block;
  position: relative;
  color:#777;
  text-decoration: none !important;
  padding: 0;
  margin: -0.5em 0 1em 0;
  font-size: 0.75em;
  left: -11.75em;
}
 
.searchindex-result-category li a:not(:last-child){
  display: none;
}
 
/* search page tabs */
.searchindex-results{
  display: block;
  position: relative;
  margin:0 0 0 -2px;
  border-bottom: 0;
  z-index: 2;
}
 
.searchindex-result/*, .category-products*/{
  border-top:1px solid #e4e4e4;
  margin-top:-1px !important;
}
.searchindex-results li{
  margin: 0 0 0 -1px;  
}
 
.searchindex-results li a{
  border: 1px solid #cfcfcf;
  border-radius:0;
  background: #f3f3f3;
  color: #545454 !important;
  font-weight: 300;
  margin: 0;
  text-transform: uppercase;
  padding: 15px 40px;
  display: inline-block;
  background: #f3f3f3;
  font-size: 20px;
}
 
.searchindex-results li a:hover,
.searchindex-results li a:focus{
  background: #f9f9f9;
  border: 1px solid #cfcfcf;
}
 
.searchindex-results li.active a,
.searchindex-results li.active a:hover,
.searchindex-results li.active a:focus{
  cursor: default;
  background: #fff !important;
  border: 1px solid #cfcfcf !important;
  border-bottom:1px solid #fff !important;
}
 
@media(max-width: 750px) {
   .searchindex-results li a{
     padding: 7px 20px;
     font-size: 15px;
  }
}
 
@media(max-width: 500px) {
  .searchindex-results li {
     display: block;
     float:none;
  }
   .searchindex-results li a{
    display: block
  }
}
 
/* generic button */
.button {
    display: inline-block;
    background: #70b836;
    text-align: center;
    margin: 0.5em auto;
    padding: 0.5em 1em;
    color: #fff !important;
    text-decoration: none !important;
}
 
.button:hover,
.button:focus{
  background: #63a32f;
}
 
/* Add Configured Part to Cart dialog
–––––––––––––––––––––––––––––––––––––––––––––––––– */
 
#buyTableBtnMsg{
  display: block;
  position: fixed;
  width: 200px;
  height: 200px;
  left: 50%;
  top: 50%;
  margin: -100px 0px 0px -100px;
  background: rgb(255, 255, 255) none repeat scroll 0% 0%;
  color: rgb(85, 85, 85);
  text-align: center;
  box-sizing: border-box;
  z-index: 10000;
  padding: 0;
  font-size: 17px;
  -webkit-box-shadow: 0px 10px 20px -4px rgba(0,0,0,0.60);
  -moz-box-shadow: 0px 10px 20px -4px rgba(0,0,0,0.60);
  box-shadow: 0px 10px 20px -4px rgba(0,0,0,0.60);
}
 
 
/* spinner-- well "working on it" cube animation
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.sk-cube-grid {
  width: 100px;
  height: 100px;
  margin: 35px auto 20px auto;
}
 
.sk-cube-grid .sk-cube {
  width: 33%;
  height: 33%;
  background-color: #70b836;
  float: left;
  -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
          animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; 
}
.sk-cube-grid .sk-cube1 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube2 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube3 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s; }
.sk-cube-grid .sk-cube4 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube5 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube6 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube7 {
  -webkit-animation-delay: 0s;
          animation-delay: 0s; }
.sk-cube-grid .sk-cube8 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube9 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
 
@-webkit-keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1); 
  }
}
 
@keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1);
  } 
}
 
/* checkout
–––––––––––––––––––––––––––––––––––––––––––––––––– */
[for="s_method_flatrate_flatrate"]:after{
  content:'';
  display: block;
  margin: 0.5em 0 0.75em 1.75em ;
  font-size: 0.75em;
  color:#666;
}
 
 
#payment_form_checkmo label{
  display: block;
  float:none;
  width:auto;
  text-align:left;
  margin: 1em 0 0.25em 0;
}
 
#payment_form_banktransfer,
#dd_method_checkmo{
  padding: 0 1em !important;
}
 
#payment_form_banktransfer li{
  margin: 0;
}
 
.checkout-agreements .agreement-content,
#payment_form_checkmo{
  border: 1px solid #ddd;
  background-color: #f6f6f6;
  padding:0.5em 1em;
  height: 10em;
  overflow: auto;
  margin: 1em 0;  
}
 
.sp-methods > dd{
  padding: 1em 0;
}
 
/* checkout success page
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.checkout-onepage-success .col-right.sidebar{
  display: none;
}
 
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.gridContainer {
  position: relative;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box; }
.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box; }
 
/* For devices larger than 400px */
@media (min-width: 400px) {
  .gridContainer {
    width: 85%;
    padding: 0; }
}
 
/* For devices larger than 550px */
@media (min-width: 550px) {
  .gridContainer {
    width: 80%; }
  .column,
  .columns {
    margin-left: 4%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0; }
 
  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%;            }
  .four.columns                   { width: 30.6666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }
 
  .one-third.column               { width: 30.6666666667%; }
  .two-thirds.column              { width: 65.3333333333%; }
 
  .one-half.column                { width: 48%; }
 
  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }
 
  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }
 
  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }
 
}
 
/* make long option names not overrun down arrow button on configurable prodcuts */
.catalog-product-view #product-options-wrapper dd select{
  padding-right:25% !important;
  cursor: pointer;
}
 
 
/* "grey out" disabled options */
.super-attribute-select[disabled=""],
.catalog-product-view #product-options-wrapper dd select.super-attribute-select[disabled=""]{
  opacity: 0.3;
  background:#eee !important;
  cursor: default;
}
 
 
 
/* print
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.page-print .logo{
  max-width: 300px;
  margin:0 20px 20px 0;
}
 
/* homepage slideshow
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.bfm-slideshow-container .slideshow-shopnow{
  display: none;
}
 
 
/* error message
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.error-msg a{
  text-decoration: underline;
}
 
.error-msg a:hover,
.error-msg a:focus{
  text-decoration: none;
}
 
 
/* gift certificate pages
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.giftvoucher-index-index .page-title h1{
  font-size: 0;
}
 
.giftvoucher-index-index .page-title h1:after{
  content:'My Gift Cards';
  display: block;
  position: relative;
  font-size: 30px;
}
 
.giftvoucher-grid-search,
.giftvoucher-search-button .text-right{
  display: none;
}
 
.giftvoucher-search-button .col-sm-6,
.giftvoucher-search-button .col-xs-12{
  width:100%;
  margin: 0 !important;
  position: relative;
   
}
 
.giftvoucher-search-button,
.giftvoucher-search-button .row{
  margin: 0 !important;
  position: relative;
  display: block;
   
}
 
 
/* time zone message */
.giftvoucher-search-button.form-group > .row > div.col-sm-6.col-xs-12 span{
  color:#555 !important;
  font-size: 10px !important;
  font-weight: 300 !important;
  display: block !important;
  width:100% !important;
  float:right !important;
  text-align: right;
  margin: -10px 0 -20px 0;
}
 
.giftvoucher-search-button.form-group{
  float:none;
  margin: -30px 0 0 0 !important;
}
 
a[href$="/giftvoucher/index/history/"]{
  font-size:0;
}
 
a[href$="/giftvoucher/index/history/"]:after{
  content:"My Gift Card History";
  overflow: visible;
  width: auto;
  border: 0;
  margin: 0;
  cursor: pointer;
  padding: 9px 15px;
  display: inline-block;
  background: #2f2f2f;
  font: 12px Arial, Helvetica, sans-serif ;
  color:#fff;
  vertical-align: middle;
  text-align: center;
  font-weight: bold;
}
 
a:hover[href$="/giftvoucher/index/history/"]:after, 
a:focus[href$="/giftvoucher/index/history/"]:after {
    background: #63a32f !important;
}
 
/* my credit balance is...*/
.gift-card > .form-group > .form-group > .row > .col-xs-12.col-sm-6:first-of-type{
  padding-top:1em;
  padding-bottom: 1.5em;
}
 
.gift-card .col-xs-12,
.gift-card .col-sm-6{
  width: 100%;
  float:none;
}
 
.gift-card .addredeem{
  float:left
}
 
.customer-account-giftcard #giftvoucher_grid .gift-voucher-sent-friend{
  background:#fff;
}
.customer-account-giftcard #giftvoucher_grid .gift-voucher-sent-friend:nth-child(2n+1) {
    background-color: #f9f9f9;
}
 
.customer-account-giftcard a:hover,
.customer-account-giftcard a:focus{
  text-decoration: underline;
}
 
/* My Account menu
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.block-account > .block-content > ul > li > a{
  padding: 0.3em 0  !important;
  display: block;
}
 
/* Standard Shipping Message
–––––––––––––––––––––––––––––––––––––––––––––––––– */
 
label[for="s_method_flatrate_flatrate"]:after{
  content:'All Standard Shipping orders under $200 ship via USPS Priority Mail, orders over $200 ship via UPS.';
  display: block;  
  margin: 0 ;
  font-size: 0.75em;
  color:#777;
  position: absolute;
  top: -2em;
  left:-15px;
}
 
.cart-forms label[for="s_method_flatrate_flatrate"]:after{
  top: -4em;
}
 
#s_method_flatrate_flatrate, 
label[for="s_method_flatrate_flatrate"]{
  top:0;
  position: relative;
  margin: 2em 0 1em 0 ;
  display: inline-block;
   
}
 
#s_method_flatrate_flatrate{
  margin: 0 0 0 0;
}
 
label[for="s_method_flatrate_flatrate"]{
  width: 90%;
}
 
 
#payment_form_checkmo label{
  display: none;
}
 
 
/* Shipping Address Fields
–––––––––––––––––––––––––––––––––––––––––––––––––– */
 
/* ideal: city, country, state/province, zip/postal */
 
/* Column: right column */
#shipping-new-address-form fieldset ul > li.fields > .field:nth-of-type(2){
}
 
/* Column: left column */
#shipping-new-address-form fieldset ul > li.fields > .field:nth-of-type(1){
}
 
/* Row: city && state/province */
#shipping-new-address-form fieldset ul > li.fields:nth-of-type(5){
}
 
/* Row: zip/postal code && country */
#shipping-new-address-form fieldset ul > li.fields:nth-of-type(6){
}
 
/* Row: telephone && fax */
#shipping-new-address-form fieldset ul > li.fields:nth-of-type(7){
}
 
/* Cell: city */
#shipping-new-address-form fieldset ul > li.fields:nth-of-type(5) > .field:nth-of-type(1){
}
 
/* Cell: telephone */
#shipping-new-address-form fieldset ul > li.fields:nth-of-type(7) > .field:nth-of-type(1){
}
 
/* Cell: fax */
#shipping-new-address-form fieldset ul > li.fields:nth-of-type(7) > .field:nth-of-type(2){
}
 
@media(min-width: 650px) {
  /* Cell: state/province */
  #shipping-new-address-form fieldset ul > li.fields:nth-of-type(5) > .field:nth-of-type(2){
    transform: translate(-100%,140%);
  }
 
  /* Cell: zip/postal code */
  #shipping-new-address-form fieldset ul > li.fields:nth-of-type(6) > .field:nth-of-type(1){
    transform: translate(100%,0);
  }
 
  /* Cell: country */
  #shipping-new-address-form fieldset ul > li.fields:nth-of-type(6) > .field:nth-of-type(2){
    transform: translate(0,-135%);
  }
}
 
@media(max-width: 650px) {
  /* Cell: state/province */
  #shipping-new-address-form fieldset ul > li.fields:nth-of-type(5) > .field:nth-of-type(2){
    transform: translate(0,135%);
  }
 
  /* Cell: zip/postal code */
  #shipping-new-address-form fieldset ul > li.fields:nth-of-type(6) > .field:nth-of-type(1){
    transform: translate(0,115%);
  }
 
  /* Cell: country */
  #shipping-new-address-form fieldset ul > li.fields:nth-of-type(6) > .field:nth-of-type(2){
    transform: translate(0,-270%);
  }
   
  /* Cell: city */
  #shipping-new-address-form fieldset ul > li.fields:nth-of-type(5) > .field:nth-of-type(1){
     transform: translate(0,0);
  }
 
}
 
 
 
/* wrap long part numbers in parts list on projects */
.projects-view-project .partsList div.pn{
  word-break: break-all;
}
 
/* fix lack of labels in checkout ... weirdly set to 0 font size in default.css*/
#paypal-saved-accounts label, #creditcard-saved-accounts label{
  font-size: 14px;
  font-weight: 300;
}
 
/* style PayPal button */
#paypal-complete{
  position: relative;
  display: block;
  clear:left;
  top:1em;
  border: 1px solid #ccc;
  overflow: hidden;
  float:none;
  text-align: center;
  padding: 0 0 1em 0;
  margin: 1em;
}
 
#paypal-complete label{
  display: block;
  position: relative;
  float:none;
  padding: 0 !important;
  height: auto;
  overflow: hidden
}
 
#paypal-container > div{
  margin:0 auto !important;
  width: 8em;
}
 
/* hide unecessary timezone box on gift card form*/
#giftvoucher-receiver .timezone-box{
  display: none;
}
 
h2{
  font-weight: 700;
  color:#333;
}
#checkoutSteps h2{
  color: #eee;
  font-weight: 300;
}
 
hr{
  border:0;
  border-top:1px solid #ccc;
  display: block;
  position: relative;
  padding: 0;
  margin: 1.5em 0;
}
 
img.floatLeft{
  float: left;
  display: block;
  position: relative;
  margin: 0 1.5em 1.5em 0;
}
 
img.floatRight{
  float: right;
  display: block;
  position: relative;
  margin:0 0 1.5em 1.5em;
}
 
/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; 
}
 
/* Support Menu */
.supportNav{
  z-index: 1000000000;
  display: inline-block;
}
.supportNav,
.supportNav ul.itemparent,
.supportNav ul.itemchildren{
  
  position: relative;
  border: 1px solid #ccc;
  margin: 0 !important;
  padding: 0;
   
}
.supportNav .listwrap{
  padding: 0 !important;
  margin: 0 !important;
   
}
 
.supportNav li{
  display: block;
  position: relative;
  list-style: none;
  margin:0;
  padding: 0;
}
 
.supportNav a{
  display: block;
  position: relative;
  padding: 0.5em 1em;
  background: #fff;
  white-space: nowrap;
  text-decoration: none;
  font-size: 12px;
}
 
.supportNav a:hover,
.supportNav a:focus{
  color:#fff;
  background:#003cff;
}
 
.supportNav li ul li ul.itemchildren{
  position: absolute;
  left: 100%;
  top:0;
  border: 1px solid green;
}
 
.supportNav ul ul{
  display: none;
}
 
a.product_tabs, a.link-wishlist{
  text-decoration: none;
}
 
/* identify images with absolute url*/
/*.blog-single-main img[src^="http"],
.std img[src^="http"],
.projectDetail .description img[src^="http"],
.tabs-content img[src^="http"]{
  border-bottom:1px dashed #eee;
  padding-bottom:5px;
}*/
 
/* identify images with servocity.com url*/
/*.blog-single-main img[src*="servocity.com"],
.std img[src*="servocity.com"],
.projectDetail .description img[src*="servocity.com"],
.tabs-content img[src*="servocity.com"]{
  border-bottom:1px dotted #ccc;
  padding-bottom:5px;
}*/
 
 
/* 
   If there is just one product image: 
   Do not say “1 of 1"
   Do not show the thumbnail below the medium product image
   hide next/back arrows in modal (large product image)
*/
html.oneImage .fancyboxInner .arrowLeft,
html.oneImage .fancyboxInner .arrowRight,
html.oneImage .product-img-box .more-views,
html.oneImage .product-img-box .imgNav{
  display: none;
}
html.oneImage .product-essential{
  padding-bottom: 0;
}
 
/* allow tabs to move over if one is missing*/
@media(min-width: 871px) {
  .col2-left-layout .main .product-collateral a.product_tabs{
    width: 200px;
    padding-left:0 !important;
    padding-right:0 !important;
    text-align:center;
  }
 
  .product-collateral .product-tabs-container a.product_tabs:nth-of-type(1) {
      left: 0 !important ;
  }
 
  .product-collateral .product-tabs-container a.product_tabs:nth-of-type(2) {
      left: 200px !important;
      margin-left:-1px;
  }
 
  .product-collateral .product-tabs-container a.product_tabs:nth-of-type(3) {
      left: 400px !important;
      margin-left:-1px;
  }
 
  .product-collateral .product-tabs-container a.product_tabs:nth-of-type(4) {
      left: 600px !important;
      margin-left:-1px;
  }
}
 
/* hide the X in the search bar for IE and Edge */
.input-text.UI-SEARCH::-ms-clear {
    display: none;
}
 
/* a little breathing room under the product names */
.product-name{
  margin-bottom: 1em;
}
 
/* fix option text going above drop down menu button */
/*.catalog-product-view #product-options-wrapper .input-box:after{
  z-index: 1000;
}
*/
/* a little breathing room under the social media icons on product pages*/
.product-collateral{
  padding-top:1.5em;
}
 
/* hide for now, I will finish this later*/
.supportNav{
  display: none;
}
 
/* make the home page a little more compact */
.widget.featuredProducts, 
.col-main .widget-new-products{
  margin-top: 0;
}
 
/* push address validation modal down a little */
.iwd_modal_container{
  top:180px !important;
}
 
 
/* when there is a large table or some need to side scroll.. let's allow side scrolling*/
body{
  overflow-x: auto;
}
 
 
/* help tooltips on project form not be in the way*/
#submitProject .moreInfoText{
  top:auto;
  bottom:15px;
  left:15px;
}
 
#submitProject .moreInfo{
  cursor: help;
}
 
 
/* prevent "Part" from being selected in chrome when you double click to select part number*/
.partLabel{
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
 
 
/* lines up in chrome a little better this way */
/*.catalog-product-view .priceLabel, .catalog-product-view .partLabel, 
.catalog-product-view .availabilityLabel,
.catalog-product-view  #product-options-wrapper dt {
    width: 35.75%;
}
*/
 
 
.account-login .registered-users p, 
.account-login .new-users p {
    font-style: normal;
    color: #a0a0a0;
    margin-top: -15px;
    font-family: "Roboto";
    font-size: 14px;
    display: block;
    position: relative;
}
 
.account-login .registered-users .required{
  margin: 0;
}
 
/* fix a css bug on Saved Payment Info Page */
.my-account .fieldset h2.legend{
  float: none;
  display: inline-block;
  position: relative;
  background: #fff;
  color: #555;
  border: 0;
  border-bottom: 1px solid #ccc;
  width: 100%;
  margin: 1em 0px 0px;
}
 
/* fix zindex bug on  My Gift Cards page */
.customer-account-giftcard .gift-card .form-group{
  z-index: 4;
  position: relative;
}
.customer-account-giftcard .gift-card .giftvoucher-search-button.form-group{
  z-index: 3;
}
 
/* fix some disproportional images in fancybox modal */
.fancyboxOverlay .fancyboxInner img{
  width:auto !important;
  height: auto !important;
  max-width: 80vw !important;
  max-height: 80vh !important;
  margin: 0 auto;
}
 
.zebra.compact{
  line-height: 1em;
  font-size: 0.75em;
}
 
.zebra.compact p{
  padding: 0;
  margin: 0;
}
 
 
table.zebra.compact, table.zebra.compact td {
  border-bottom: 1px solid #aaa;
  border-top: 1px solid #aaa;
  border-left: 1px solid #efefef;
  border-right: 1px solid #efefef;
  padding-top:5px;
  padding-bottom:5px;
}
 
.zebra.compact th{
  line-height: 1.25em;
}
 
.zebra.centerContent,
.zebra.centerContent p,
.zebra.centerContent th,
.zebra.centerContent td{
  text-align: center;
  vertical-align: middle;
}
 
.zebra.compact caption{
  text-align: left;
  font-size: 1.5em;
  line-height: 0.2em;
  margin-top:0.4em;  
}
 
 
.cms-home .bannersHomePage {
  position: relative;
  display: block;
}
 
.cms-home .bannersHomePage p{
  display: block;
  text-align: center;
  justify-content:center;
}
 
.cms-home .bannersHomePage a {
  margin: 0;
  flex:1;
}
.cms-home .bannersHomePage a img{
  width: 100%;
  margin: 0 auto ;
 
  /* graceful degradation for ie9 */
  max-width: 447px;
  float: left;
}
 
.cms-home .bannersHomePage p a:nth-child(1){
  padding-bottom:0.5em;
  display: block;
  position: relative;
}
 
@media(min-width: 500px) {
  .cms-home .bannersHomePage p{
    display: flex;
  }
  .cms-home .bannersHomePage p a:nth-child(1){
    padding-bottom:0;
  }
  .cms-home .bannersHomePage p a:nth-child(1){
    padding-right:11px;
  }
  .cms-home .bannersHomePage p a:nth-child(2){
    padding-left:11px;
  }
}
 
.cms-home .bannersHomePage {
  width: 100% !important;
}
 
@media(min-width: 1200px) {
  .cms-home .bannersHomePage {
      width: calc(100% - 30px) !important;
  }
}
 
 
.bfm-slides1 > li{
  max-height: 225px;
  overflow: hidden;
}
 
.bfm-slides1_nav{
  top:35%;
}
 
.newProductsWrap a.seeAll{
  top:1.5em;
  color:#fff;
  text-decoration: none;
  background:#70b836;
  padding: 0.25em 0.5em;
  margin-bottom: -1.5em;
  display: none;
}
 
.widget-new-products li.item,
.widget.featuredProducts .products-grid li.item{
  width: calc(100% - 30px) !important;
}
 
@media(min-width: 260px) {
  .widget-new-products li.item,
  .widget.featuredProducts .products-grid li.item{
    width: calc(50% - 30px) !important;
  }
}
 
@media(min-width: 400px) {
  .widget-new-products li.item,
  .widget.featuredProducts .products-grid li.item{
    width: calc(33.333% - 30px) !important;
  }
}
 
@media(min-width: 650px) {
  .widget-new-products li.item,
  .widget.featuredProducts .products-grid li.item{
    width: calc(25% - 30px) !important;
  }
}
 
@media(min-width: 750px) {
  .widget-new-products li.item,
  .widget.featuredProducts .products-grid li.item{
    width: calc(16.66666666666667% - 30px) !important;
  }
}
 
 
.widget-new-products li.item,
.widget.featuredProducts .products-grid li.item{
  padding-bottom: 3em !important;
}
 
.widget-new-products .products-grid .product-name a,
.widget.featuredProducts .products-grid .product-name a{
  height: 4em;
  font-size: 12px;
  letter-spacing: 0.04em;
}
 
.widget-new-products ul.products-grid > li .newIcon span,
.widget.featuredProducts ul.products-grid > li .newIcon span{
  font-size: 12px;
  width:70px;
  margin-left:-15px;
  margin-top:10px;
  display: block;
  position: absolute;
  background-color:#70b836;
  padding: 4px 0 3px 0;
  line-height: 1em;
  -moz-transform:  perspective(1px) translateZ(0) rotate(-45deg) translate3d( 0, 0, 0);
  letter-spacing: 0.05em;
}
 
 
.widget-new-products ul.products-grid > li .newIcon,
.widget.featuredProducts ul.products-grid > li .newIcon{
  background: none;
  height: 0;
  overflow: visible;
}
 
.widget-new-products ul.products-grid > li,
.widget.featuredProducts ul.products-grid > li{
  overflow: hidden;
}
 
.widget-new-products ul.products-grid:nth-child(1) > li:nth-child(1) .newIcon{
  opacity: 1;
}
  
.widget-new-products  ul.products-grid:nth-child(1) > li:nth-child(2) .newIcon{
  opacity: 0.95;
}
  
.widget-new-products ul.products-grid:nth-child(1) > li:nth-child(3) .newIcon{
  opacity: 0.90;
}
  
.widget-new-products ul.products-grid:nth-child(1) > li:nth-child(4) .newIcon{
  opacity: 0.85;
}
  
.widget-new-products ul.products-grid:nth-child(1) > li:nth-child(5) .newIcon{
  opacity: 0.80;
}
  
.widget-new-products ul.products-grid:nth-child(2) >  li:nth-child(1) .newIcon{
  opacity: 0.75;
}
  
.widget-new-products ul.products-grid:nth-child(2) > li:nth-child(2) .newIcon{
  opacity: 0.7;
}
  
.widget-new-products ul.products-grid:nth-child(2) > li:nth-child(3) .newIcon{
  opacity: 0.65;
}
  
.widget-new-products ul.products-grid:nth-child(2) > li:nth-child(4) .newIcon{
  opacity: 0.6;
}
  
.widget-new-products  ul.products-grid:nth-child(2) > li:nth-child(5) .newIcon{
  opacity: 0.55;
}
  
.widget-new-products ul.products-grid:nth-child(3) > li:nth-child(1) .newIcon{
  opacity: 0.50;
}
  
.widget-new-products ul.products-grid:nth-child(3) > li:nth-child(2) .newIcon{
  opacity: 0.45;
}
  
.widget-new-products ul.products-grid:nth-child(3) > li:nth-child(3) .newIcon{
  opacity: 0.4;
}
  
.widget-new-products ul.products-grid:nth-child(3) > li:nth-child(4) .newIcon{
  opacity: 0.35;
}
  
.widget-new-products ul.products-grid:nth-child(3) > li:nth-child(5) .newIcon{
  opacity: 0.3;
}
  
.widget-new-products ul.products-grid:nth-child(4) > li:nth-child(1) .newIcon{
  opacity: 0.25;
}
  
.widget-new-products ul.products-grid:nth-child(4) > li:nth-child(2) .newIcon{
  opacity: 0.20;
}
  
.widget-new-products ul.products-grid:nth-child(4) > li:nth-child(3) .newIcon{
  opacity: 0.15;
}
 
 
/* begin 10 column main category thumbnail nav */
.tenColumn{
  margin: 0;
  padding: 0;
  display: block;
  list-style: none;
  -webkit-column-count: 5;
  -moz-column-count: 5;
  column-count: 5;
}
 
.tenColumn > li{
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
  display: block;
   
  /* graceful degradation for IE9 */
  max-width: 82px;
}
 
.tenColumn > li{
  margin-bottom:10px;
}
 
@media(min-width: 500px) {
  .tenColumn {
    -webkit-column-count: 10;
    -moz-column-count: 10;
    column-count: 10;
  }
  .tenColumn > li{
    margin-bottom:0;
  }
  .tenColumn{
    margin: 0 0 1em 0;
  }
  .tenColumn > li:last-child{
    padding-right:1.5px;
  }
}
 
.tenColumn > li > a{
  margin: 0;
  padding: 0;
  font-size: 10px;
  text-decoration: none;
  color:#555;
  text-align: center;
  display: block;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
}
 
.tenColumn > li > a:hover img,
.tenColumn > li > a:focus img{
  border: 1px solid #70b836 !important;
}
 
.tenColumn > li > a:hover,
.tenColumn > li > a:focus{
  color: #70b836;
}
 
.tenColumn > li > a > img,
.cms-home .bannersHomePage .tenColumn img{
  margin: 0 auto;
  padding: 0;
  border: 1px solid #ccc;
  display: block;
  position: relative;
}
 
/* end 10 column main category thumbnail nav */
 
/* begin 7 column display */
.sevenColumn,
.std ul.sevenColumn{
  margin: 0 0 1em 0 !important;
  padding: 0;
  display: block;
  list-style: none;
  -webkit-column-count: 4;
  -moz-column-count: 4;
  column-count: 4;
}
 
.sevenColumn > li{
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
  display: block;
   
  /* graceful degradation for IE9 */
  max-width: 150px;
  display: inline;
}
 
.sevenColumn > li{
  margin-bottom:10px;
}
 
@media(min-width: 500px) {
  .sevenColumn,
.std ul.sevenColumn {
    -webkit-column-count: 7;
    -moz-column-count: 7;
    column-count: 7;
  }
  .sevenColumn > li{
    margin-bottom:0;
  }
  .sevenColumn{
    margin: 0 0 1em 0;
  }
  .sevenColumn > li:last-child{
    padding-right:1.5px;
  }
}
 
 
 
.sevenColumn > li > a{
  margin: 0;
  padding: 0;
  font-size: 14px;
 
  color:#555;
  text-align: center;
  display: block;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
}
 
 
.sevenColumn > li > a:hover img,
.sevenColumn > li > a:focus img{
/*   border: 1px solid #70b836 !important; */
}
 
.sevenColumn > li > a:hover,
.sevenColumn > li > a:focus{
  color: #70b836;
}
 
.sevenColumn > li > a > img,
.cms-home .bannersHomePage .sevenColumn img{
  margin: 0 auto;
  padding: 0;
  border: 1px solid #fff;
  display: block;
  position: relative;
}
 
/* end 7 column display */
 
html{
  min-width: 314px;
}
 
.red{
  color:#ee4009 !important;
}
 
a.anchor,
a:not([href]){
  margin-top:-1em;
  display:block;
  position:absolute;
}
 
/*------------- start table sort css -------------*/
 
th[data-sort]{
  cursor: pointer;
  -webkit-touch-callout: none; 
  -webkit-user-select: none;  
  -khtml-user-select: none;    
  -moz-user-select: none;     
  -ms-user-select: none;       
  user-select: none;  
}
 
th[data-sort]:hover{
  background: #70b836;
}
 
 
th[data-sort]{
  position: relative;
  display: table-cell;
  padding-right:15px !important;
  padding-left:5px !important;
  background-clip:padding-box !important;
}
 
th[data-sort]:before,
th[data-sort]:after{
  opacity: 0.45;
}
 
th[data-sort]:before,
th[data-sort]:after{
  content:'';
  position: absolute;
  right:5px;
  top:50%;
  width: 0;
  height: 0;
  border-style: solid;
}
 
th[data-sort]:before{
  margin: 2px 0 0 0;
  border-width: 4px 4px 0 4px;
  border-color: #ffffff transparent transparent transparent;
}
 
th[data-sort]:after{
  margin: -8px 0 0 0;
  border-width: 0 4px 4px 4px;
  border-color: transparent transparent #ffffff transparent;
}
 
th.sorting-desc:before,
th.sorting-asc:after{
  opacity: 1;
}
 
/*------------- end table sort css -------------*/
 
 
/* fix a safari bug */
.widget-new-products .products-grid li.item,
.widget.featuredProducts .products-grid li.item{
  min-height: 100%;
}
 
/* make links visible in image description of fancybox overlays */
.fancyboxOverlay a {
  color: #fff;
  text-decoration: underline;
}
 
.fancyboxOverlay a:hover,
.fancyboxOverlay a:focus {
  color: #fff;
  text-decoration: none;
}
/* sale banners -- fix styles since js moves products and categories into same area*/
.apptrian-subcategories-layout-grid li,
.catalog-category-view .products-grid li.item{
  overflow: hidden;
}
.saleIcon {
    top: -6px;
    left: -5px;
}
 .products-grid .saleIcon span{
  margin-left: -34px !important;
  margin-top: 19px !important;
}

.saleIcon span,
.apptrian-subcategories.apptrian-subcategories-layout-grid .saleIcon span{
    font: 14px "Roboto" !important;
    font-weight: 700 !important;
    color: #fff !important;
    display: block !important;
    -ms-transform: rotate(-45deg) !important;
    -webkit-transform: rotate(-45deg) !important;
    transform: rotate(-45deg) !important;
    margin-left: -30px !important;
    margin-top: 15px !important;
    text-align: center !important;
    background: transparent !important;
    border: 0;
    width: 109px !important;
    max-width: 1000px !important;
    padding-top: 0 !important;
    height: 0;
    top: 3px;
}