/* 20240617233015 - v2 */
.gui,
.gui-block-linklist li a {
  color: #333333;
}

.gui-page-title,
.gui a.gui-bold,
.gui-block-subtitle,
.gui-table thead tr th,
.gui ul.gui-products li .gui-products-title a,
.gui-form label,
.gui-block-title.gui-dark strong,
.gui-block-title.gui-dark strong a,
.gui-content-subtitle {
  color: #333333;
}

.gui-block-inner strong {
  color: #848484;
}

.gui a {
  color: #e3432f;
}

.gui-input.gui-focus,
.gui-text.gui-focus,
.gui-select.gui-focus {
  border-color: #e3432f;
  box-shadow: 0 0 2px #e3432f;
}

.gui-select.gui-focus .gui-handle {
  border-color: #e3432f;
}

.gui-block,
.gui-block-title,
.gui-buttons.gui-border,
.gui-block-inner,
.gui-image {
  border-color: #8d8d8d;
}

.gui-block-title {
  color: #333333;
  background-color: #ffffff;
}

.gui-content-title {
  color: #333333;
}

.gui-form .gui-field .gui-description span {
  color: #333333;
}

.gui-block-inner {
  background-color: #f4f4f4;
}

.gui-block-option {
  border-color: #ededed;
  background-color: #f9f9f9;
}

.gui-block-option-block {
  border-color: #ededed;
}

.gui-block-title strong {
  color: #333333;
}

.gui-line,
.gui-cart-sum .gui-line {
  background-color: #cbcbcb;
}

.gui ul.gui-products li {
  border-color: #dcdcdc;
}

.gui-block-subcontent,
.gui-content-subtitle {
  border-color: #dcdcdc;
}

.gui-faq,
.gui-login,
.gui-password,
.gui-register,
.gui-review,
.gui-sitemap,
.gui-block-linklist li,
.gui-table {
  border-color: #dcdcdc;
}

.gui-block-content .gui-table {
  border-color: #ededed;
}

.gui-table thead tr th {
  border-color: #cbcbcb;
  background-color: #f9f9f9;
}

.gui-table tbody tr td {
  border-color: #ededed;
}

.gui a.gui-button-large,
.gui a.gui-button-small {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large.gui-button-action,
.gui a.gui-button-small.gui-button-action {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large:active,
.gui a.gui-button-small:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui a.gui-button-large.gui-button-action:active,
.gui a.gui-button-small.gui-button-action:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui-input,
.gui-text,
.gui-select,
.gui-number {
  border-color: #8d8d8d;
  background-color: #ffffff;
}

.gui-select .gui-handle,
.gui-number .gui-handle {
  border-color: #8d8d8d;
}

.gui-number .gui-handle a {
  background-color: #ffffff;
}

.gui-input input,
.gui-number input,
.gui-text textarea,
.gui-select .gui-value {
  color: #000000;
}

.gui-progressbar {
  background-color: #e3432f;
}

/* custom */
/* test */
#top ul#uspmessages.list-inline li:before{
content:initial;
display:none;
}

#top ul#uspmessages.list-inline li span.usp-icon:before {
    font-family: FontAwesome;
    content: "\f058";
}

#top ul#uspmessages.list-inline li span.usp-icon {
    display: inline-block;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
    width: 20px;
    margin-right: 4px;
}
#top ul#uspmessages.list-inline li span.usp-icon {
    color: #E3432F;
}


a.variant {
    font-size: 18px;
    color: #333333;
    margin: 0 3px;
}
a.variant.active {
    font-weight: bold;
    padding: 2px;
  border:2px solid #333333;
}
a.variant.no-stock{
    text-decoration: line-through;
    color: #909090;
}
.variant-button-wrapper{
    position: relative;
    overflow: visible;

}

.variant-wrapper{
    background-color:  #FFFFFF;
    position: absolute;
    height: 0;
    width: 100%;
    top:0;
  opacity:0;
transition:top .3s,height .3s,opacity .3s;
  display:none;
}
.has-variants .variant-wrapper{ display:block;}
.variant-button-wrapper.has-variants .btn:hover+.variant-wrapper, .variant-button-wrapper.has-variants .variant-wrapper:hover{
  top:-40px;
  height: 40px;
  opacity:1;
}


#topmenu>*{
  padding:0;
}
#accounts,#topmenu{
  margin-top: 5px;
  margin-bottom: 5px;
}



.wrapper-title {
    margin-top: 1.5em;
}
.wwk--sidebar {
    bottom: 50px;
    top: initial!important;
}
.wwk--betterbar-top{
     bottom: 0px;
    top: initial!important;
}
#maattable {display:none;
    display: none;
    position: fixed;
    top: 250px;
    margin: 0 AUTO;
    left: 0;
    right: 0;    
    max-width: 1000px;
    width: 80%;
    Z-INDEX: 100;
      border: 1px solid #909090;
    padding: 5px;
    background-color: #fff;
}
#maattable::before {
    display: block;
    position: absolute;
    right: -10px;
    border: 1px solid #909090;
    top: -10px;
    height: 26px;
   width: 26px;
    padding: 4px 7px;
    border-radius: 12.5px;
    background-color: #fff;
    color: #909090;
    font-size: 14px;
}
#maattable div{
height:100%;
  width: 100%;
overflow:auto;
}
#maattable div img{
 width: 100%;
    min-width: 750px;
    max-width: initial;
}
.maattabel-wrapper{
    margin-bottom: .5em;}

.maattabel-wrapper a{    text-decoration: underline;
    color: rgb(51, 51, 51);
}

.btn:hover, .btn:focus, .btn:active, #cart-content a.btn:hover {
    background: #F1A197;
    color: #ffffff;
    border-color: #909090;
}
.gui-wishlist .gui-table .gui-image a img {
min-width:50px;
}
#widget-social .widget-wrapper{
text-align:center;
}
#widget-social .widget-wrapper ul{
display: inline;
}

/* newsletter popup
**************************/
.newsletter-popup {
  
      top: 70%;
    background-color:rgba(255,255,255,.9);
  
background-color: rgba(227,67,47,.7);
    z-index: 20;
    position: fixed;
    width: 500px;
    height: 210px;
    text-align: center;
    box-shadow: 0px 0px -1px #000;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
  left:-500px;
      padding: 10px 10px 10px 110px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
  color: #fff;
}
.newsletter-popup.show {
  left:-100px;
  box-shadow: 0px 0px 100px #000;
}
.newsletter-popup h3{
      margin-top: 20px;
    margin-bottom: 10px;
  text-transform:uppercase;
  font-weight: 400;
    letter-spacing: 2px;
  color:inherit;
  font-size:18px;
}
.newsletter-popup p{
  padding: 0;
  font-size:16px;
  margin: 0;
}
#formNewsletter-popup{padding: 10px 0;}
.newsletter-popup input[type="text"]{
  height: 30px; 
  border-width:0px;
}
.newsletter-popup form .btn{
  overflow:hidden;   
  vertical-align: middle;
  position: relative;
  top:-1px;
  height: 30px; 
  right:0;
  margin-bottom:0;
  
    border-color: #c3230f;
}
.newsletter-popup form .btn:hover::before {
    top: 7px;
}
.newsletter-popup form .btn::before {
    left: 0;
    top: -50px;
    position: absolute;
    height: 100%;
    width: 100%;
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
    font-size: 16px;
    text-align: center;
}
.newsletter-popup form .btn:hover span {
    opacity: 0;
}

.mc-close::before, .mc-close::after {
       content: '';
    position: absolute;
    display: block;
    border-top: 1px solid #fff;
    top: 12px;
    right: 1px;
    width: 15px;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
      transform: rotate(45deg);
}
.mc-close::before {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
}
.mc-close {
    position: absolute;
    right: 0;
    border: 0px solid black;
    width: 65px;
    height: 30px;
    right: 6px;
    background-color: transparent;
    color: #fff;
      top: 0;
    padding-right: 20px;
    text-transform: uppercase;
}

.opentab {
    position: absolute;
    right: -2em;
    z-index: 2;
    padding: .3em;
    height: 6em;
    width: 2em;
cursor: pointer;
  background-color: rgba(255,255,255,.8);
  
background-color: rgba(227,67,47,.8);
    border: 1px solid rgba(65, 65, 65,.8);
    border-left-width: 0;
  -webkit-transition:backgound-color .5s ease,border-color .5s ease;
  transition:backgound-color .5s ease,border-color .5s ease;
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px;
}
.opentab span {
  -webkit-transform: rotate(-90deg) translateX(-1.8em) translateY(-2em);
  -ms-transform: rotate(-90deg) translateX(-1.8em) translateY(-2em);
      transform: rotate(-90deg) translateX(-1.8em) translateY(-2em);
    display: inline-block;
}
.show .opentab{
border-color: rgba(227,67,47,.8);
 background-color: rgba(255,255,255,.9);
  
background-color: rgba(227,67,47,.8);
}.newsletter-popup input[type="text"]{
    background-color: #414141;
color:white;
 background-color: #fff;
 
color: #333;
   border:1px solid #c3230f;
}
.newsletter-popup a.btn {
    background-color: #e3432f;
color:white;
  
    line-height: 13px;
    text-transform: uppercase;
}
.newsletter-popup ::-webkit-input-placeholder{
  color:#333;
  opacity: 1;
  text-align:center;
  text-transform:uppercase;
} 
.newsletter-popup :-moz-placeholder{
  color:#333;
  opacity: 1;
  text-align:center;
  text-transform:uppercase;
}
.newsletter-popup ::-moz-placeholder{
  color:#333;
  opacity: 1;
  text-align:center;
  text-transform:uppercase;
}
.newsletter-popup :-ms-input-placeholder {
  color:#333;
  opacity: 1;
  text-align:center;
  text-transform:uppercase;
}
.newsletter-popup .line3{
  font-size:16px;
    
}
.producticon{
  position:absolute;
  top:0;
  leftt:0;
  background-size: cover;
  background-repeat: no-repeat;
  width:50px;
  height:50px;
  z-index:1;
}
.producticon.basis{
  
    background-image: url(icon-basis.jpg);
}
/* product icon
**************************/

/*maat variant aanpassing(workaround ipv design anpassing)
************************/
a.variant {
    font-size: 18px;
    color: #333333;
    margin: 0 3px;
    overflow: hidden;
    max-width: 1.6em;
    display: inline-block;
    height: 1.6em;
    text-indent: -2.7em;
    border: 2px solid transparent;
    padding: 2px;
}

@media (max-width: 767px){


/*news letter popup

******************************/
  
.newsletter-popup {}

.newsletter-popup.show {
    bottom: 0;
}

.newsletter-popup {
   top: initial;
bottom: -275px;
    width: 420px;
    height: 215px;
left:-100px;
   border-bottom-right-radius: 0px;
}

.opentab {
right: initial;
    top: -2em;
    height: 2em;
    width: 6em;    
 border-left-width: 1px;
    border-bottom-width: 0;
    border-bottom-width: 0px;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 3px;
}


.newsletter-popup input[type="text"] {
max-width:160px;
}

.opentab span {
    -webkit-transform: initial;
        -ms-transform: initial;
            transform: initial;
    
}

.newsletter-popup p {
       padding: 0 1em 1em;
}

.newsletter-popup input[type="text"]{
}
