#ms-shop-content.loading,
#ms-shop-filters.loading,
#ms-shop-nav.loading {
   opacity: 0.4;
   pointer-events: none;
}





/* NAV */
.ms-nav {
   position: relative;
   
}
.ms-nav .ms-select-icon {
   position: absolute;
   top: 50%;
   right: 10px;
   transform: translateY(-50%);
}
.ms-nav .ms-select-icon i {
   padding: 10px;
   cursor: pointer;
}
.ms-nav ul.ms-nav-list {
   list-style-type: none;
   margin: 0;
   padding: 5px 0;
}
.ms-nav li.ms-select-option {
   padding: 10px 10px 10px 50px;
   text-transform: uppercase;
   background-position: 15px center;
   background-size: 21px;
   background-repeat: no-repeat;
   cursor: pointer;
   box-sizing: border-box;
   border-radius: 5px;
}
.ms-nav li.ms-select-option.active,
.ms-nav li.ms-select-option:hover {
   background-color: #F3F3F3;
}

.ms-nav li.ms-select-option:hover::after {
   content: '\f054';
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   float: right;
}

@media (max-width:767px) {
   #ms-shop-filters {
      flex-direction: column;
  }
  .ms-select:not(:first-child) {
     margin-top: 15px;
  }
}








/* CONTENT */
#ms-shop-content-wrapper {
   display: grid;
}

#ms-shop-content-wrapper .ms-products-category-heading {
   background-size: cover;
   background-position: center center;
   display: flex;
   align-items: flex-end;
   padding: 20px 40px;
   position: relative;
}

#ms-shop-content-wrapper .ms-product-banner-gap {
   position: absolute;
   top: -100px;
}

#ms-shop-content-wrapper .ms-products-category-heading:not(:first-child) {
   margin-top: 50px;
}
#ms-shop-content-wrapper .ms-products-category-title {
   font-size: 38px;
   font-weight: 700;
   color: #fff;
   letter-spacing: -0.03em;
}
#ms-shop-content-wrapper .ms-product {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   border: 1px solid #D2D2D2;
   text-align: center;
}

#ms-shop-content-wrapper .ms-product:hover{
   box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.3);
}

#ms-shop-content-wrapper .ms-product-title a{
   font-family: Manrope;
   font-weight: 400;
   font-size: 15px;
   line-height: 135%;
   color: #1E1E1E;
}
#ms-shop-content-wrapper .ms-product-duration{
   font-family: Manrope;
   font-weight: normal;
   font-size: 15px;
   line-height: 150%;
   color: #1E1E1E;
}
#ms-shop-content-wrapper .amount, #ms-shop-content-wrapper  .ms-product-price{
   font-family: Manrope;
   font-weight: bold;
   font-size: 24px;
   color: #1E1E1E;
   padding-bottom: 5px;
}

#ms-shop-content-wrapper .spacer{
   min-height: 22px;
}

#ms-shop-content-wrapper .aanvraag {
   display: block;
}
#ms-shop-content-wrapper .ms-product-add-to-cart {
   padding-left: 10px;
   padding-right: 10px;
   padding-bottom: 5px;
   position: relative;
}
#ms-shop-content-wrapper .ms_add_to_cart_form {
   display: flex;
   justify-content: space-around;
   align-items: center;
   position: relative;
   z-index: 3;
}
#ms-shop-content-wrapper .ms_internal_link {
   position: absolute;
   height: 100%;
   width: 100%;
   top: 0;
   left: 0;
}

#ms-shop-content-wrapper form.cart {
   display:flex;
   align-items: center;
   justify-content: space-between;
   width: 100%;
}

#ms-shop-content-wrapper .quantity {
   display: none;
}

#ms-shop-content-wrapper .single_add_to_cart_button {
   color: #fff;
   width: 100%;
   font-size: 13px;
   font-weight: bold;
   text-transform: uppercase;
   margin-left: 0px!important;
   background: #445344;
   border-radius: 2px;
   padding: 8px 10px;
   border: none;
   line-height: 22px;
}

#ms-shop-content-wrapper .ms-product-add-to-cart .reveal{
   display: block;
   width: 100%;
   padding: 8px 10px;
   background: #445344;
   border-radius: 2px;
   font-weight: bold;
   font-size: 13px;
   text-transform: uppercase;
   color: #fff;
}

#ms-shop-content-wrapper p.stock.out-of-stock {
   background: #db2d2d;
   color: #fff;
   border-radius: 2px;
   padding: 8px 10px;
   margin: 0px 0px 0px 0px;
   width: 100%;
   font-size: 13px;
   font-weight: bold;
   text-transform: uppercase;
   line-height: 22px;
}

#ms-shop-content-wrapper .tinvwl_add_to_wishlist_button {
   border: 1px solid #C1C1C1;
   box-sizing: border-box;
   border-radius: 6px;
   width: 40px;
   line-height: 22px;
   height: 40px;
   margin: 0px 0px 0px 10px;
}

#ms-shop-content-wrapper .ms-product .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart-plus.no-txt:before, #ms-shop-content-wrapper .ms-product .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart.no-txt:before {
   position: absolute;
   top: 47%;
   left: 45%;
   margin-right: 0;
   font-size: 24px;
}

#ms-shop-content-wrapper .ms-product .ms-product-image img {
   object-fit: cover;
   height: 150px;
   width: 100%;
}
#ms-shop-content-wrapper .ms-product .ms-product-info {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   height: 100%;
}
#ms-shop-content-wrapper .ms-product .ms-product-info h3 {
   margin-top: 10px;
   text-align: center;
   font-weight: 700;
   font-size: 15px;
   height: 24px;
   color: #1E1E1E;
}
#ms-shop-content-wrapper .ms-product .ms-product-info .ms-product-elements {
   text-align: center;
   position: relative;
}
#ms-shop-content-wrapper .ms-product .ms-product-info .ms-product-elements img {
   margin: 0 4px 5px;
}

#ms-shop-content-wrapper .ms-product .ms-product-info .ms-product-duration {
   text-align: center;

}
@media(min-width: 1025px) {
   #ms-shop-content-wrapper {
      grid-template-columns: repeat(4, 1fr);
      grid-row-gap: 20px;
   }
   #ms-shop-content-wrapper .ms-products-category-heading {
      height: 235px;
      grid-column-start: 1;
      grid-column-end: 5;
   }
}

@media(max-width: 1024px) {
   #ms-shop-content-wrapper {
      grid-template-columns: repeat(2, 1fr);
      grid-row-gap: 20px;
   }
   #ms-shop-content-wrapper .ms-products-category-heading {
      height: 130px;
      grid-column-start: 1;
      grid-column-end: 3;
   }
   #ms-shop-content-wrapper .ms-products-category-title {
      line-height: 36px;
  }
}

@media(max-width: 550px) {
   #ms-shop-content-wrapper .ms-product .ms-product-info h3 {
      height: 45px;
   }
   #ms-shop-content-wrapper .spacer{
      min-height: 0px;
   }
}





/* FILTERS */
#ms-shop-filters {
   display: flex;
   flex-wrap: nowrap;
   justify-content: space-between;
}
#ms-shop-filters .ms-select {
   flex-basis: 32%;
}









/* MS SELECT */
.ms-select {
   position: relative;
   
}
.ms-select .ms-select-input {
   padding: 10px;
   border: 1px solid #DBDBDB;
   border-radius: 5px;
}
.ms-select .ms-select-icon {
   position: absolute;
   top: 50%;
   right: 10px;
   transform: translateY(-50%);
}
.ms-select .ms-select-icon i {
   padding: 10px;
   cursor: pointer;
}

.ms-select ul.ms-select-dropdown {
   display: none;
   position: absolute;
   width: 100%;
   list-style-type: none;
   margin: 4px 0 0 0;
   padding: 5px 0;
   background: #FFFFFF;
   box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
   border-radius: 5px;
   z-index: 52;
}
.ms-select li.ms-select-option {
   padding: 10px 10px 10px 50px;
   text-transform: uppercase;
   background-position: 15px center;
   background-size: 21px;
   background-repeat: no-repeat;
   cursor: pointer;
   box-sizing: border-box;
   border-radius: 5px;
}
.ms-select li.ms-select-option.active,
.ms-select li.ms-select-option:hover {
   background-color: #F3F3F3;
}

.ms-select.order li.ms-select-option {
   padding: 10px 10px 10px 15px;
   text-transform: none;
}



/* ELEMENTS TOOLTIP */
.ms-product-elements {
   display: flex;
   justify-content: center;
}
.ms-product-element {
   position: relative;
   display: inline-block;
   padding-bottom: 5px;
   z-index: 50;
}
.ms-product .ms-product-element:before {
   content: '';
   position: absolute;
   top: 30px;
   left: 6px;
   width: 0px;
   height: 0px;
   border-left: 10px solid transparent;
   border-right: 10px solid transparent;
   border-bottom: 10px solid #333;
   transition: opacity 0ms;
   opacity: 0;
}
.ms-product-element:hover:before {
   opacity: 1;
   transition: opacity 200ms;
}
.ms-product-element img {
   cursor: pointer;
}
.element-tooltip {
   /* display: none; */
   position: absolute;
   top: 40px;
   left: -40px;
   width: 290px;
   box-shadow: 0px 7px 46px rgba(0, 0, 0, 0.18);
   color: #fff;
   padding: 10px;
   text-align: left;
   border-radius: 10px;
   font-size: 13px;
   line-height: 1.4em;
   animation: 200ms msFadeIn forwards;
   background: #333;
   text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
   z-index: 10;
}
.element-tooltip a {
   text-decoration: underline;
   display: block;
   margin-top: 10px;
   color: #fff;
   font-weight: bold;
}
.element-tooltip a:hover {
   color: #fff!important;
}
.element-tooltip a:after {
   content: '->';
   position: absolute;
   font-size: 1.7em;
   margin-left: 3px;
   font-weight: normal;
}
@keyframes msFadeIn{
   from {
      opacity: 0;
   }
   to {
      opacity: 1;
   }
}
/* aarde */
.ms-product-element[data-id="85"] .element-tooltip {
   background: #845233;
}
.ms-product-element[data-id="85"]:before {
   border-bottom: 10px solid#845233;
}
/* water */
.ms-product-element[data-id="84"] .element-tooltip {
   background: #00c2ff;
}
.ms-product-element[data-id="84"]:before {
   border-bottom: 10px solid#00c2ff;
}
/* water */
.ms-product-element[data-id="84"] .element-tooltip {
   background: #00c2ff;
}
.ms-product-element[data-id="84"]:before {
   border-bottom: 10px solid#00c2ff;
}
/* vuur */
.ms-product-element[data-id="83"] .element-tooltip {
   background: #ab3d32;
}
.ms-product-element[data-id="83"]:before {
   border-bottom: 10px solid#ab3d32;
}
/* lucht */
.ms-product-element[data-id="82"] .element-tooltip {
   background: #d5a548;
}
.ms-product-element[data-id="82"]:before {
   border-bottom: 10px solid#d5a548;
}
/* ruimt */
.ms-product-element[data-id="81"] .element-tooltip {
   background: #757B8C;
}
.ms-product-element[data-id="81"]:before {
   border-bottom: 10px solid#757B8C;
}