/* FONTS ================================================== */
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@300;400;600;700;800;900&display=swap');

body{ font-family: 'Titillium Web', sans-serif; font-size: 16px; color: #575757; line-height: 32px; }
h1{ font-size: 26px; font-weight: 700; color: #575757; margin: 0px 0 25px 0; }
h2{ font-size: 24px; font-weight: 700; color: #575757; margin: 20px 0 20px 0; }
h3{ font-size: 22px; font-weight: 700; color: #EB691C; margin: 20px 0 15px 0; }
h4{ font-size: 18px; font-weight: 700; color: #EB691C; margin: 10px 0 5px 0; }
h4{ margin: 20px 0 10px 0; }
h4 a{ font-size: 18px; font-weight: 700; color: #23A159; }
h4 a:hover{ font-size: 18px; font-weight: 700; color: #EB691C; }
a{ color: #EB691C; }
a:hover{ color: #575757; }
.btn{ padding: 8px 25px; border: 2px solid transparent; border-radius: 50px; font-size: 16px; font-weight: 700; }
.btn.btn-primary{ background: #EB691C; border-color: #EB691C; color: #ffffff; }
.btn.btn-primary:hover{ background: #ffffff; border-color: #EB691C; color: #EB691C !important; }

.btn.btn-default{ background: #ffffff; border-color: #575757; color: #575757; }
.btn.btn-default:hover{ background: #575757; border-color: #575757; color: #ffffff; }

.btn.btn-success{ background: #23A159; border-color: #23A159; color: #ffffff; border: 2px solid transparent; }
.btn.btn-success:hover{ background: #ffffff; border-color: #23A159; color: #23A159; }

.btn.btn-warning{ background: #ffc544; border-color: #ffc544; color: #000000; border: 2px solid transparent; }
.btn.btn-warning:hover{ background: #ffffff; border-color: #ffc544; color: #000000; }

.btn.btn-danger:hover{ color: #ffffff; background-color: #111111; border-color: #111111; }

.btn-orange{ color: #EB691C; margin-top: -4px; }

.xzoom{ box-shadow: none !important; }
/* ====== HEADER ====== */
.header{ background: #ffffff; padding: 10px 0; color: #575757; }
.header .logo{ max-width: 250px; }
.header .logo img{ width: 100%; }
.header .col-md-9{ position: relative; }
.header .usps{ margin-top: 10px;}
.header .usps .col-md-4{ display: flex; align-items: center; justify-content: center; line-height: 1.5; }
.header .usps i{ margin-right: 10px; }
.header .usps ul { list-style: none; padding: 0; margin: 0; display: flex; justify-content: space-between; }
.header .usps ul li { margin-left: 15px; }
.header .usps ul li:first-child { margin-left: 0; }
.header .inlog{ text-align: right; font-weight: 700; line-height: 1; }
.header .inlog i{ margin-right: 15px; }
.header .inlog a{ color: #575757; padding: 20px 35px; }
/* .header .inlog a.menuitem{ color: #575757; padding: 20px 0 20px 35px; } */
.header .inlog a.menuitem{ color: #575757; padding: 0; margin-left: 25px; }
.header .inlog a.menuitem:first-child { margin-left: 0; }

.header .lrws-loadsmallcart{  }
.header .lrws-loadsmallcart a{ background: #23A159; border-radius: 30px; padding: 10px 35px; display: inline-block; color: #ffffff; transition: background 0.3s; }
.header .lrws-loadsmallcart a:hover { background: #1a7c44; text-decoration: none; }
.header .lrws-loadsmallcart .number{ background: #ffffff; border-radius: 20px; width: 32px; color: #23A159; text-align: center; padding: 2px 9px; margin-left: 15px; }

.header .search-cart { display: flex; justify-content: space-between; align-items: center; margin-top: 15px; }
.header .search-cart form { flex-grow: 1; display: flex; }
.header .search-cart input[type="text"] { border: 1px solid #707070; border-radius: 100px; padding: 5px 75px 5px 25px; width: 100%; }
.header .search-cart .search-bar-wrap { position: relative; flex-grow: 1; max-width: 400px; margin-right: 50px; display: flex;}
/* .header .search-cart .search-bar-wrap::before { content: '\f002'; font-family: 'Font Awesome 5 Pro'; position: absolute; top: 50%; transform: translateY(-50%); left: 10px; pointer-events: none; } */
.header .search-cart .search-bar-wrap .btn-success { position: absolute; right: 0; height: 100%; }

/* ====== NAVIGATIE ====== */
.navbar{ background: #EC691D !important; }
.navbar ul.nav-normal{ padding-left: 0; margin-bottom: 0; }
.navbar ul.nav-normal li{ list-style: none; }
.navbar ul.nav-normal li a{ font-size: 16px; font-weight: bold; color: #ffffff; text-transform: uppercase; }
.navbar ul.nav-normal ul.dropdown-menu{ background-color: #575757; }

.header-banner { margin-bottom: 25px; padding: 15px; min-height: 250px; margin-top: -30px; background-repeat: no-repeat; background-size: cover; background-position: 0 65%; display: flex; flex-direction: column; justify-content: space-between; }
.header-banner .tilted-title { display: flex; flex-direction: column; transform-origin: bottom left; transform: rotate(-3deg); margin-top: 50px; }
.header-banner .tilted-title h2 { background: #4D4D4C; color: #fff; margin-bottom: 0; margin-top: 0; padding: 10px 75px; display: inline-block; font-size: 46px; text-transform: uppercase; align-self: self-start; }
.header-banner .tilted-title h3 { background: #EC691D; color: #fff; margin-bottom: 0; margin-top: 0; padding: 10px 75px; display: inline-block; font-size: 22px; text-transform: uppercase; align-self: self-start; }
.header-banner .bottom-content { display: flex; justify-content: flex-end; }

/* ====== BREADCRUMBS ====== */
.breadcrumbDiv{ margin-top: -50px; }
.breadcrumb{ line-height: 20px; }
.breadcrumb li.active{ color: #575756; }

/* ====== CONTENT ====== */
.container-fluid > .container { padding-left: 0; padding-right: 0; }

.homepage-title h2 { font-size: 32px; color: #EC691D; text-transform: uppercase; margin-top: 0; }

.light-grey-wall { background: #E8E8E8; padding-top: 50px; padding-bottom: 50px; margin-bottom: 75px; }
.ingangen .item a { position: relative; display: block; overflow: hidden; box-shadow: 1px 1px 7px rgb(0 0 0 / 15%); transition: box-shadow 0.3s; }
.ingangen .item a img { transition: transform 0.3s; }
.ingangen .item a h3 { position: absolute; bottom: 40px; left: 0; text-transform: uppercase; padding: 10px 25px; background: #EB691C; color: #fff; margin: 0; }
.ingangen .item a:hover { box-shadow: 1px 4px 12px rgb(0 0 0 / 15%); }
.ingangen .item a:hover img { transform: scale(1.05); }

/* Homepagina - greenblock */
.greybox .row{ background: #575757; color: #ffffff; border-radius: 0; margin: 0; }
.greybox .grey{ padding: 25px 25px 25px 25px; position: relative; }
.greybox .grey h2{ color: #ffffff; margin: 0 0 15px 0; }
.greybox .grey .btn.btn-primary{ position: absolute; bottom: -20px; right: 25px; z-index: 999; }
.greybox .image{ padding: 0; }
.greybox .image p{ margin: 0; }

/* Productoverzicht*/
.product-wrap { margin-bottom: 30px; }
.col-md-4 .product,
.col-md-6 .product { display: flex; flex-direction: column; padding-bottom: 0; }
.lrws-productview .col-xl-4.col-lg-4.col-sm-6.col-xs-12{ margin-bottom: 30px; }
.product{ width: 100%; padding-bottom: 50px; overflow: hidden; }
.product .imagebox{ border: 1px solid #cccccc; padding: 20px; }
.product .imagebox img{ width: auto; max-width: 100%; height: auto; max-height: 250px; }
.product .product-bot{ padding: 0; display: flex; flex-direction: column; justify-content: space-between; flex-grow: 1; }
.product .titlebar h3.producttitle{ font-size: 18px; font-weight: 600; text-align: left; padding: 0; line-height: 1.4; margin: 10px 0 0; color: #EC691D; font-weight: 700;}
.product .titlebar .small_description{ line-height: 24px; text-align: left; }
.product .titlebar .small_description p{ margin-bottom: 0; color: #828281; font-weight: 300; }
.product .btn.btn-success{ border-radius: 0; }
.product .unitsize { text-align: left; margin-bottom: 10px; font-weight: 700; }

.product .right-wrap { display: flex; align-items: flex-end; justify-content: flex-end; }
.product .right-wrap input[type="number"] { max-width: 50px; border: 1px solid #E7E7E7; text-align: center; border-radius: 10px; }
.product .right-wrap input[type=number]::-webkit-inner-spin-button,
.product .right-wrap input[type=number]::-webkit-outer-spin-button { opacity: 1; }
.product .right-wrap .btn-success { border-radius: 50px; margin-top: 0; padding: 5px 20px; max-width: 100px; margin-left: 10px; color: #fff; }

.currentprice.smallview{ padding: 0; justify-content: space-between; position: static; }
.currentprice.smallview .col-8{ padding: 0; }
.currentprice.smallview .col-4{ padding: 0; }
.currentprice.smallview .stock-msg{ color: #4D4D4C; }
.currentprice.smallview span{ padding-left: 0; }
.currentprice.smallview .priceblock{ margin: 0; }
.price-blue{ font-size: 22px; font-weight: 700; color: #EB691C; }

.orangeblock{ background: #EC691D; color: #ffffff; padding: 25px; border-radius: 0; max-height: 250px;  }
.orangeblock h2,
.orangeblock h3,
.orangeblock h4{ font-weight: 700; color: #ffffff; }
.orangeblock h2{ margin-top: 0; }
.orangeblock a{ color: #ffffff; }

/* Productdetail */
.productdetail .productimage .image-wrap{ position: sticky; top: 25px; }
.productdetail .productimage .image{ border: 1px solid #cccccc;}
.productdetail .productimage img.big_image{ max-width: 300px; width: 100%; }
.productdetail .productinfo h1{ margin-bottom: 0; }
.productdetail .productinfo h2{ color: #EC691D; }
.productdetail .productinfo ul{  }
.productdetail .productinfo ul li{ list-style: none; }
.productdetail .productinfo ul li:before{ content: "\f105"; font-family: 'Font Awesome 5 Pro'; color: #EC691D; margin: 0 10px 0 0; }

.productdetail .usp ul { display: flex; justify-content: space-between; flex-wrap: wrap; }
.productdetail .usp ul li::before { content: '\f00c'; color: #23A159; }

a#cartbtn,.btn-swal-success{ background: #23A159; font-size: 18px; font-weight: 700; color: #ffffff; text-align: center; padding: 8px 2px; border: 2px solid #23A159; border-radius: 50px; }
a#cartbtn:hover{ border: 2px solid #23A159; background: #fff; color: #23A159; cursor: pointer; }

.incl_price{ color: #575757; font-weight: 700; }
.incl_price .price{ font-size: 30px; }
.incl_price .unit{ font-size: 16px; }
.excl_price{ color: #CBCBCB; font-weight: 700; }

.stock-msg{ color: #23A159; }
.stock-msg.error{ color: #dc3545!important;  }

.margin-bot-small{ margin-bottom: 10px; }

.priceblock > .col-md-12{ margin-bottom: 10px; }
.priceblock select{ border-radius: 8px; }
.priceblock input{ border-radius: 8px; }
.priceblock label{ font-weight: 700; text-transform: uppercase; margin-bottom: 0; }

.usp{ padding: 0; }
.std-usp{ font-size: 14px; }
.std-usp ul{ padding-left: 0; text-align: center; }
.std-usp ul li{ display: inline; margin-right: 30px; }
.std-usp ul li:last-child{ margin-right: 0; }
.std-usp ul li:before{ content: "\f00c"; font-family: 'Font Awesome 5 Pro'; color: #23A159; margin-right: 10px; }

.tab-content{ font-family: 'Titillium Web', sans-serif; padding: 0; border: none; }
.tab-content .table tr:nth-child(even){ background: #f5f5f5; }
.table-hover tbody tr:hover{ background-color: transparent; }
.tab-content .table tr td{ padding: 5px 15px; border: none; }

.block.form .btn.btn-default{ background: #EB691C; border-color: #EB691C; color: #ffffff; float: right; }
.block.form .btn.btn-default:hover{ background: #ffffff; border-color: #EB691C; color: #EB691C; }
.block.form .form-group:last-child .col-sm-9{ flex: 0 0 100%; max-width: 100%; }

/* Inloggen */
.pswd-forget{ margin-left: 10px; }

.ingangen {  }
.ingangen img { max-width: 100%; }

.title-block { position: relative; }
.title-block-wrap { margin-top: 50px; margin-bottom: 50px; }
.title-block img { max-width: 100%; }
.title-block .titles { position: absolute; top: 20px; left: 0; display: flex; flex-direction: column; }
.title-block .titles h2 { background: #EC691D; color: #fff; margin-bottom: 0; margin-top: 0; padding: 10px 30px; display: inline-block; font-size: 36px; text-transform: uppercase; align-self: self-start; }
.title-block .titles h3 { background: #4D4D4C; color: #fff; margin-bottom: 0; margin-top: 0; padding: 10px 30px; display: inline-block; font-size: 22px; text-transform: uppercase; align-self: self-start; }

.greybox .grey h2 { background: #EC691D; color: #fff; margin-bottom: 20px; margin-top: 0; margin-left: -25px; max-width: 400px; padding: 10px 30px; display: inline-block; font-size: 22px; text-transform: uppercase; }

/* ====== OVERIGE ====== */
/* Shopping cart */
#sm_shoppingcart span.sc_amount{ background: #23A159; font-weight: 700; }
#sm_shoppingcart span.sc_amount span{ background: #ffffff; border-radius: 20px; width: 32px; color: #23A159; text-align: center; padding: 2px 9px; margin-left: 15px; }
span.sc_amount{ padding: 13px 22px; }
span.sc_price{ font-weight: 700; font-size: 20px; color: #EB691C; }
.small_cart span{ margin-right: 0; margin-top: 0; }
.lrws-deletecart{ color: #cccccc; }
button.amount-min,
button.amount-plus{ padding: 3px 8px; }

label.payoption span.name{ margin-top: 0px; }
label.payoption span.extraprice{ color: #23A159; margin: 0 0 0 10px; }


/* Veel gestelde vragen */
.mainproducts{  }
.card{ cursor: pointer; margin-top: 10px; }

/* ====== FOOTER ====== */
.subfoot{ background: #EEEEEE; font-size: 16px; padding: 50px 0; }
.subfoot h2{ font-size: 20px; font-weight: 700; margin-bottom: 20px; }
.subfoot .phonenumber{ font-size: 20px; font-weight: 700; margin-bottom: 20px; }
.subfoot ul{ padding-left: 0; }
.subfoot ul li{ list-style: none; }
.subfoot i{ margin-right: 10px; }
.subfoot a{ color: #575757; text-decoration: none; }
.subfoot a:hover{ color: #575757; text-decoration: underline; }

.foot{ background: #EB691C; font-weight: 400; color: #ffffff; }

/* #Tablet (Landscape)
================================================== */
@media only screen and (min-width: 1220px){
	.greenbox .image{ padding: 0; overflow: hidden; border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
	.greenbox .image img{ height: 100%; max-height: 435px; width: auto; }
}


/* #Tablet (Landscape)
================================================== */
@media only screen and (min-width: 959px) and (max-width: 1220px){
	body{ font-size: 14px; }
	h4{ width: 90%; line-height: 24px; }
	.btn{ font-size: 14px; padding: 8px 15px; }
	.header .logo{ max-width: 175px; }
	.header .usps{ font-size: 12px; position: relative; margin-top: 15px; }
	.nav.navbar-nav{ width: 90%; }
	ul.nav-normal li a{ padding: 14px 0px; }
	.product .imagebox img{ height: auto; max-height: 100%; width: 100%; }
	.currentprice.smallview{ margin: 0 0 10px 0; bottom: 10px; }
	.currentprice.smallview span{  }
	.currentprice.smallview .stock-msg{ font-size: 13px; }
	.price-blue{ font-size: 16px; }
	.greenbox .green{ padding: 25px; position: relative; line-height: 26px; }
	.greenbox .image{ padding: 0; overflow: hidden; border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
	.greenbox .image img{ height: 100%; max-height: 435px; width: auto; }
	.greenblock h2{ }
	.greenblock h3{ font-size: 18px; margin-bottom: 0; }
	.greenblock h4{ font-weight: 400; margin: 10px 0; }


	.productdetail .productimage img.big_image{ max-width: 100%; width: 100%; }
	.std-usp ul li { font-size: 12px; margin-right: 20px; }
	iframe{ width: 100%; }

	input.amount.bamount{ width: 33px; }
	.table td,
	.table th{ padding: 5px 1px; }

}

/* Tablet (Portrait)
================================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	.btn{ margin-top: 10px; }
	.header .logo{ max-width: 175px; }
	/* .header .col-7.col-md-12.col-lg-9{ margin-top: -40px; } */
	.header .usps{ font-size: 12px; position: relative; margin-top: 25px; }
	.header .usps i { margin-right: 5px; }
	.navbar-light .navbar-toggler{ color: #ffffff; border-color: transparent; }
	.navbar ul.nav-normal{  }
	ul.nav-normal li a{ padding: 14px 15px; line-height: 40px; }
	.product .imagebox img{ height: auto; max-height: 100%; width: 100%; }
	.greenblock{ margin-bottom: 20px; }
	.greenblock h3{ margin-bottom: 0; }
	.greenbox .green .btn.btn-primary{ z-index: 999; }
	.greenbox .image img { border-bottom-left-radius: 10px; border-top-right-radius: 0; }
	.cc-revoke, .cc-window{ font-size: 14px; left: unset; right: 3em; }
	.std-usp ul li { display: block; }
	iframe{ width: 100%; }
	.rightSidebar{ margin-top: 20px; }
	.loadCartView{ margin: 0; }
	.table.table-striped .row{ margin: 0; }
	.list-group-item { padding: .4rem 1.25rem; }
}

/* #Mobile (Landscape)
================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.header .logo{ max-width: 150px; }
	.header .usps{ display: none; }
	.header .inlog{ position: relative; right: 0; }
	.header .inlog i{ margin-right: 5px; }
	.header .inlog a{ padding: 10px 15px; }
	.header .inlog .lrws-loadsmallcart{ padding: 10px 15px; }
	.header .inlog .lrws-loadsmallcart .number{ padding: 2px 7px; margin-left: 5px; font-size: 12px; }
	.navbar-light .navbar-toggler{ color: #ffffff; border-color: transparent; }

	#sm_shoppingcart{ bottom: 30px !important; }
	#sm_shoppingcart > div{ max-width: 100%; width: auto; margin: 0 15px; }
	.cc-revoke, .cc-window{ font-size: 14px; left: unset; right: 3em; }

	iframe{ width: 100%; }
}

@media only screen and (max-width: 1220px) {
  .header .search-cart .search-bar-wrap .btn-success { margin-top: 0; }

  .header-banner .tilted-title h2 { font-size: 32px; padding: 10px 50px; }
  .header-banner .tilted-title h3 { font-size: 16px; padding: 10px 50px; }

  .ingangen .item a h3 { font-size: 18px; }

  .title-block .titles h2 { font-size: 24px; }
  .title-block .titles h3 { font-size: 18px; }
}

@media only screen and (max-width: 991px) {
  .header .search-cart .search-bar-wrap { margin-right: 25px; }

  .header-banner { min-height: 250px; }

  .ingangen .item a h3 { font-size: 14px; padding: 8px 15px; }

  .title-block .titles h2 { font-size: 16px; }
  .title-block .titles h3 { font-size: 14px; }
}

@media only screen and (max-width: 767px) {
  .top-row { position: absolute; right: 15px; }

  .header .lrws-loadsmallcart a { padding: 7px 35px; }
  .header .lrws-loadsmallcart .number { margin: 0; position: absolute; right: 5px; top: 0; border: 1px solid #23A159; display: flex; justify-content: center; align-items: center; height: 32px; border-radius: 50%; }

  .header-banner .tilted-title h2 { font-size: 24px; padding: 10px 35px; }
  .header-banner .tilted-title h3 { padding: 10px 35px; }

  .ingangen .item { margin-bottom: 15px; }
}

@media only screen and (max-width: 575px) {
  .greybox .grey h2 { max-width: none; margin-right: -25px; }
}


/* Mobiel (Portrait)
================================================== */
@media only screen and (max-width: 479px) {
	.col-xs-12{ text-align: left; }
	.btn.btn-default{ width: 100%; max-width: 100%; margin-bottom: 10px; }
	.btn.btn-success{ width: 100%; max-width: 100%; margin-bottom: 10px; }
	.float-left{ float: none !important; }
	.float-right{ float: none !important; }
	.header{ padding: 10px 0; }
	.header .logo{ max-width: 150px; }
	.header .usps{ display: none; }
	.header .inlog{ position: relative; right: 0; bottom: -10px; }
	.header .inlog i{ margin-right: 5px; }
	.header .inlog a{ padding: 10px 15px; }
	.header .inlog .lrws-loadsmallcart{ padding: 10px 15px; border-radius: 30px; }
	.header .inlog .lrws-loadsmallcart .number{ padding: 2px 7px; margin-left: 5px; font-size: 12px; }
	.header .inlog a.menuitem{ padding: 20px 0 20px 0; }
	.navbar-light .navbar-toggler{ color: #ffffff; border-color: transparent; }
	.header .form-group{ margin: 0 -15px; }
	.product{ padding-bottom: 0; margin-bottom: 0; height: auto; }
	.producttitle{ height: auto; min-height: auto; }
	.currentprice.smallview{ font-size: 14px; height: auto; position: relative; margin: 0 0 10px 0; }
	.greenblock{ margin-bottom: 20px; }
	.greenblock h3{ margin-bottom: 0; }
	.greenbox .green .btn.btn-primary{ z-index: 999; }
	.greenbox .image img { border-bottom-left-radius: 10px; border-top-right-radius: 0; }

	#sm_shoppingcart{ bottom: 30px !important; }
	#sm_shoppingcart > div{ max-width: 100%; width: auto; margin: 0 15px; }
	.cc-revoke, .cc-window{ font-size: 14px; left: unset; right: 3em; }

	iframe{ width: 100%; }
	.table td,
	.table th{ padding: .75rem 0; }
	.loadCartView{ margin: 0; }
	.table.table-striped{ max-width: 100% !important; width: 100% !important; }
	.table.table-striped th{ width: 100% !important; }
	.table.table-striped tr{ width: 100% !important; }
	.table.table-striped td{ width: 100% !important; float: left; padding: 0 10px; border: 0; }
	.table.table-striped td:first-child{ margin-top: 10px; }
	.table.table-striped td:last-child{ margin-bottom: 15px; }
	.table.table-striped td .btn{ max-width: 100% !important; width: 100% !important; margin-top: 15px; }
	.table.table-striped .row{ margin: 0; }
	.list-group-item { padding: .4rem 1.25rem; }
	.std-usp ul li{ display: block; }

  .header .lrws-loadsmallcart a { padding: 7px 20px; }
  .header .search-cart .search-bar-wrap { margin-right: 15px; }
  .header .search-cart .search-bar-wrap .btn-success { width: auto; padding: 8px 15px; }

  .header-banner .tilted-title { margin-top: 20px; }
  .header-banner .tilted-title h2 { font-size: 18px; padding: 8px 15px; }
  .header-banner .tilted-title h3 { font-size: 14px; padding: 8px 15px; }

  .product .right-wrap .btn-success { margin-bottom: 0; }

  .title-block .titles h2 { padding: 8px 15px; }
  .title-block .titles h3 { padding: 8px 15px; }
}
