/* DROPDOWN  */



@media not all and (min-resolution:.001dpcm) { @media {

  .tool-wizard-container .col-xl {
    flex-basis: 1;
  }

}}



.dropdown-selector{
  position: relative;
}
[data-application][role="button"] {
    cursor: pointer;
}

.hero-text .tool-search-btn {
  font-size: 15px;
  /* border: 1px solid #FFF; */
  background-color: rgba(226,36,38,0.8);
}

.product-search-container .dropdown-selector[data-field][data-has-selection="yes"] .dropdown-toggle::after ,
.wizard-filter-container .dropdown-selector[data-field][data-has-selection="yes"] .dropdown-toggle::after {
  background-image: none;
}

.product-search-container .dropdown-selector__wrap,
.wizard-filter-container .dropdown-selector__wrap {
  display: inline-block;
  position: relative;
  max-width: 100%;
}

.product-search-container .dropdown-selector--reset,
.wizard-filter-container .dropdown-selector--reset {
  background: transparent;
  border: 0;
  width: 11px;
  height: 16px;
  margin-left: 1.255em;
  position: absolute;
  color: #c73834;
  right: 16px;
  top: 6px;
}

.product-search-container .filters .dropdown-selector__wrap,
.product-search-container .filters .dropdown-toggle,
.wizard-filter-container .filters .dropdown-selector__wrap ,
.wizard-filter-container .filters .dropdown-toggle {
  max-width: 100%;
  width: 100%;
}
.wizard-filter-container .filters .dropdown-selector__wrap {
    position: relative;
}

.product-search-container .filters .dropdown-toggle,
.wizard-filter-container .filters .dropdown-toggle {
  text-align: left;
  text-overflow: ellipsis;
  overflow-x: hidden;
  display: inline-block;
}

.wizard-filter-container .wizard-filter-container .dropdown-selector {
  margin-right: 0;
}

.product-search-container .dropdown-menu.show,
.wizard-filter-container .dropdown-menu.show {
  display: block;
  z-index: 9999;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  border: 1px solid #efefef;
  box-shadow: 1px 1px 8px rgba(228,228,228,0.9);
}


/* PRODUCT SEARCH BAR */
.product-search-container{
  position: relative;
  width: 100%;
  transform: translate(0, -100%);
  -moz-transform: translate(0, -100%);
  -webkit-transform: translate(0, -100%);
  padding-left: 29px;
  padding-right: 4px;
  margin-bottom: -58px;
  z-index: 999;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .product-search-container{
    margin-top: -6px;
  }
}


@media only screen and (max-width: 1200px){
  .product-search-container{
    margin-bottom:-98px;
  }
}

.product-search-container:after{
  content: "";
  background-color: #000;
  clip-path: polygon(100% 100%, 100% 0, 0 107%);
  -webkit-clip-path: polygon(100% 100%, 100% 0, 0 111%);
  width: 29px;
  height: 59px;
  position: absolute;
  left: 1px;
  bottom: 0;
}

.product-search-container .product-search-bar{
  position: relative;
  padding: 10px 9px;
  background-image: linear-gradient(to right, rgba(0,0,0,1),rgba(0,0,0,0.9), rgba(0,0,0,0));
}

.product-search-container .product-search-bar .dropdown-selector{
  display: inline-block;
}

.product-search-container .product-search-bar .dropdown-toggle{
  background:transparent;
  border: 1px solid #C1C1C1;
  color: #FFFFFF;
  font-size: 14px;
  text-transform: uppercase;
  padding: 7px 35px 7px 10px;
  display: inline-block;
  width: 100%;
  position: relative;
}

.product-search-container .product-search-bar .dropdown-toggle::after{
  border: 0;
  width: 17px;
  height: 10px;
  margin-left: 1.255em;
  margin-bottom: -4px;
  background: url('/common/images/red-chevron-down.svg') no-repeat;
  -moz-background-size: 17px 10px;
  -webkit-background-size: 17px 10px;
  background-size: 17px 10px;
  position: absolute;
  right: 10px;
  top: 12px;
}

.wizard-filter-container .filter-inner{
  border-bottom: 1px solid #DFD9D9;
}


.wizard-filter-container .dropdown-selector{
  display: inline-block;
/*  margin-right: 24px;*/
}

.dropdown-toggle{
  background:#FAF9F9;
  border: 1px solid #e4e4e4;
  color: #333;
  font-size: 14px;
  text-transform: capitalize;
  padding: 7px 35px 7px 10px;
  display: inline-block;
  width: 100%;
  position: relative;
}


.dropdown-toggle::after{
  border: 0;
  width: 17px;
  height: 10px;
  margin-left: 1.255em;
  margin-bottom: -4px;
  background: url('/common/images/red-chevron-down.svg') no-repeat;
  -moz-background-size: 17px 10px;
  -webkit-background-size: 17px 10px;
  background-size: 17px 10px;
  position: absolute;
  right: 10px;
  top: 12px;
}


.application-image-container,
.application-title-container{
  position: relative;
  max-width: 173px;
}

.application-image-border{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: transparent;
  /* border-radius: 34px; */
  border-radius: 22%;
  border: 6px solid transparent;
  transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -webkit-transition: all 0.15s linear;
}
#sub-applications-select .application-image-border{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 5px;
  right: 5px;
  background: transparent;
  border-radius: 22%;
  border: 6px solid transparent;
  transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -webkit-transition: all 0.15s linear;
}

#sub-applications-select .application-container[data-application="endmilling"] .application-image-border {
    left: 0;
}

#sub-applications-select .application-container:hover .application-image-border,
.application-container:hover .application-image-border{
  border: 6px solid #0074C8;
  transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -webkit-transition: all 0.15s linear;
}


.application-container:hover  .application-title-container .application-title{
  color: #0074C8;
  transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -webkit-transition: all 0.15s linear;
}

.application-image{
  max-width: 173px;
}

.application-title{
  text-align: center;
  text-transform: uppercase;
    font-size: 0.8rem;
    font-weight: 400;
}

/* SELECTED APPLICATION AREA */
.application-selected,
.sub-application-selected{
  max-width: 69px;
}

.dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #141414;
}

.dropdown-item:focus, .dropdown-item:hover {
  color: #e9ecef;
  text-decoration: none;
  background-color: #dc3545;
}

.application-selected-image-border{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: transparent;
  border-radius: 11px;
  border: 4px solid transparent;
}

.application-selected-image-border.active{
  border: 4px solid #0074C8;
}

.app-image-container{
  position: relative;
}

.app-image-container img:not(.btn-remove-application){
  max-width: 100%;
  height: 70px;
}

.app-text-container p {
  color: #0074C8;
  text-align: center;
  font-size: 0.8em;
  font-weight: 600;
  line-height: 1em;
  padding-top: 5px;
  text-transform: uppercase;
  margin-bottom: 0;
}

.application-selected-holder img.btn-remove-application{
  position: absolute;
  top: -8px;
  right: -10px;
  z-index: 2;
}


/* PRODUCT RESULTS CARD */

.product-card{
  box-shadow: 1px 1px 7px rgba(0,0,0,0.5);
}

.product-card .product-btn {
  width: 100%;
  text-align: right;
}

.product-card .view-pdf{
  font-size: 14px;
  /* width: 100%; */
  /* background-color: #fff; */
    /* margin-bottom: 10px; */
}

.product-card .product-image-container{
  padding: 6px;
  max-width: 36%;
  width: 100%;
  max-height: 250px;
  min-height: 170px;

  /* use flex to center and stretch image to fill */
  justify-content: center;
  overflow: hidden;
  /* min-height: 200px; */
}

.product-card .product-image-container .product-image{
  max-height: 100%;
  display: block;
}

.product-card .product-info{
    background-color: #f2f2f2;
  padding: 10px;
  position: relative;
  width: 100%;
}

.product-card .product-text{
  /* min-height: 100px; */
  margin-bottom: 10px;
}

.product-card .product-brand{
  font-size: 0.8rem;
  margin-bottom: 6px;
  text-transform: uppercase;
}

.product-card .product-title{
  font-size: 1rem;
  font-weight: 600;
}

.product-card .product-description{
  font-size: 0.91rem;
}



.product-brand-row .brand-catalogue{
  max-width: 146px;
  position: relative;
}

.product-brand-row .brand-catalogue img{
  border: 3px solid #FFFFFF;
  box-shadow: 0 0 3px #888888;
}

.product-brand-row .brand-catalogue .view-pdf{
  /* background-color: rgba(226,36,38,1); */
  /* color: #fff; */
  color: #333;
  opacity: 0.7;
  font-size: 16px;
  font-weight: 400;
  text-align: center;
  line-height: 1;
  position: absolute;
  padding: 10px 0px;
  margin-bottom: 0;
  left: 50%;
  width: 100%;
  transform: translate(-50%,0);
  -moz-transform: translate(-50%,0);
  -webkit-transform: translate(-50%,0);
  text-transform: uppercase;
  border:none;
}

.product-brand-row .brand-description a,
.product-brand-row .brand-description a:hover{
  color: #D8232D;
  font-weight: 400;
}



@media only screen and (max-width:1200px){
  .product-search-container:after{
    height: 98px;
  }
  .application-image{
    width: 100%;
  }
}

@media only screen and (min-width: 768px) and (max-width:991px){
  .filter-row2 .dropdown-selector,
  .filter-row2 .red-btn{
    width: 23%;
  }
}
@media only screen and (min-width: 768px) and (max-width:1200px){
  .filter-row1 .dropdown-selector{
    width: 46%;
  }
}


@media only screen and (max-width:991px){
  .product-search-container:after{
    height: 148px;
  }

  .hero-content{
    padding-top: 100px;
  }

  .hero-container{
    height: 50vh;
  }

  .hero-text{
    margin: 0 auto;
  }

  .hero-text .red-btn{
    padding: .75rem;
    max-width: 250px;
    margin: 0 auto;
  }

  .product-card .product-image-container{
    max-width: 36%;
  }

}

@media only screen and (min-width:1120px) {
    /* dont let these elements grow too large */
    #sub-applications-select > .col-xl.d-block,
    #applications-select > .col-xl.d-block {
        max-width: 20%;
    }
}

@media only screen and (max-width:767px){
  .product-card .product-image-container{
    max-width: 24%;
  }

  .wizard-filter-container .dropdown-selector{
    display: block;
  }

  .wizard-filter-container .dropdown-menu.show{
    width: 100%;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px){
  .filter-row1 .dropdown-selector{
    width: 46%;
  }
  .filter-row2 .dropdown-selector,
  .filter-row2 .red-btn{
    width: 23%;
  }
}

@media only screen and (min-width: 481px) and (max-width: 575px){
  .filter-row1 .dropdown-selector{
    width: 46%;
  }
  .filter-row2 .dropdown-selector,
  .filter-row2 .red-btn{
    width: 23%;
  }
}


@media only screen and (max-width:575px){

  .product-card .product-image-container{
    max-width: 32%;
  }

  .hero-container .hero-content h1 {
    font-size: 4em;
  }

  .hero-container .hero-content .hero-text-small {
    font-size: 2em;
  }


  .product-search-container {
    padding-left: 0;
  }

  .product-search-container .product-search-bar{
    padding: 10px 20px;
  }

  .product-search-container:after{
    /*height: 182px;*/
    display: none;
  }

  .filter-row1{
    margin-bottom: 0 !important;
  }

  .filter-row1 .dropdown-selector,
  .filter-row2 .dropdown-selector,
  .filter-row2 .red-btn{
    width: 100%;
    margin-bottom: 20px;
  }

  .product-search-container .product-search-bar .dropdown-toggle{
    padding: 12px 35px 9px 10px;
  }

    .application-image-border {
        border-radius: 28px;
    }
}
