:root {
  --primary-color: #003313; /* green */ /* voorheen 00280F*/
  --secondary-color: #E32213; /* rood */
  --seablue-color:#336667; /* blauw/groen */
  --graygreen-color:#A4C7B1; /* grijs groen */
  --lightgrey-color:#F2F2F2;
  --darkgrey-color:#A0A0A0;
  --opensans-font: "Open Sans", serif;
  --rollerscript-font:"rollerscript-smooth", sans-serif;
}

/* algmeen */ 
html, body {scroll-behavior: smooth; overflow-x:hidden; display:inline;}
.clip {clip-path: polygon(0 0, 100% 0, 100% 57%, 57% 98%, 0 77%);}
.rollerscript {font-family:var(--rollerscript-font);}
h2.rollerscript, .rollerscript {font-size:40px; letter-spacing: 1px; line-height: 1;}
.relative {position:relative}
.text-center {text-align:center;}

.row.verandastappen .col .box {
    padding: 20px;
    background: #f2f2f2;
    border-radius: 10px;
    text-align:center;
}

div#page.id-309 section.droom-tot-realisatie a.fw_button {
	display:none;
}

/****/
.slider.main_slider {position:relative;}
#page:has(.product-intro-faq) .slider.main_slider::after {
    position: absolute;
    content: '';
    background-image: url(/files/hero-bg.svg)!important;
    background-position: bottom!important;
    background-repeat: no-repeat!important;
    bottom: -1px!important;
    left: -1px!important;
    z-index: 1!important;
    width: 101%!important;
    height: 400px!important;
    filter: unset!important;
}
#page:has(.product-intro-faq) .product-intro-faq {
	background-color: var(--primary-color);
    color: #fff;
}
#page:has(:not(.product-intro-faq)) .slider.main_slider::after {
    position: absolute;
    content: '';
    background-image: url(/files/hero-bg.svg);
    background-position: bottom;
    background-repeat: no-repeat;
    bottom: -1px;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 400px;
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(306deg) brightness(116%) contrast(102%);
}
@media (max-width:767px) {
	html,body, section {overflow-x:hidden;}
	#page:has(.product-intro-faq) .product-intro-faq .intro {padding: 0px;}
}
/****/

.fw_button {
	background-color: var(--primary-color);
    color: #fff;
    border: 2px solid var(--primary-color);
    border-radius:50px;
    padding: 5px 20px;
    -webkit-transition: all .5s ease-in-out;
  -moz-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.fw_button:hover {background-color:transparent; color:var(--primary-color)!important; text-decoration:none;}
.fw_button.secondary {
	background-color: var(--secondary-color);
    color: #fff;
    border: 2px solid var(--secondary-color);
    border-radius:50px;
    padding: 5px 20px;
    -webkit-transition: all .5s ease-in-out;
  -moz-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.fw_button.secondary:hover {background-color:transparent; color:var(--secondary-color)!important; text-decoration:none;}

.button-wrapper {display: inline-flex;}
.button-wrapper a {margin-right:10px;}
.button-wrapper a:last-of-type {margin-right:0px;}

.calendar-icon {
	background-image: url(/files/calendar-month-white.svg);
    background-position: 10px;
    background-size: 20px;
    background-repeat: no-repeat;
    padding-left: 40px !important;
}
.calendar-icon:hover {
	background-image: url(/files/calendar-month-black.svg);
}

.transition-eio {
 -webkit-transition: all .5s ease-in-out;
  -moz-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}

span.subtitle {
	color:var(--secondary-color);
	font-weight:100;
	font-size:20px;
	text-transform:uppercase;
}
strong span.subtitle {font-weight:600;}

.slider {max-width:100%;}

@media (min-width:768px) and (max-width:1530px) {
	.header .menu ul li:last-of-type ul {left: unset!important;}
}
@media (min-width:1400px) {
	.container {
	    width:100%;
	    max-width:1400px;
	}
	.slider.main_slider {max-width: 100%;}
	/*.slider.main_slider {margin:auto}*/
}
@media (min-width:1280px) and (max-width:1399px) {
	.container {
	    width:100%;
	    max-width:1280px;
	}
	/*.slider {max-width: 1280px;}*/
	.slider {max-width: 100%;}
	.slider.main_slider {margin:auto}
}
@media (min-width:768px) and (max-width:1279px) {
	.header2025 .brand .logo {padding:10px!important;}
	.header2025 .brand .logo img {width:145px;}
}
@media (min-width:1024px) and (max-width:1279px) {
	.header2025 .menu a {font-size:14px; padding: 5px 6px!important;}
}
@media (min-width:768px) and (max-width:1023px) {
	.header2025 .menu a {font-size:12px; padding: 5px 5px!important;}
}
@media (max-width:1023px) {
	.header2021.header2025 .menubar {z-index:20; position:relative;}
}
@media (min-width:768px) {
	.header2025 .desktop-only {display:flex!important;}
	.header2025 .mobile-only {display:none!important;}
	.header2025 .brand .logo {position:absolute; left:0; top:0; padding:19px; margin:0px; background:var(--primary-color); transition:.5s all ease-in-out;}

	.header2025 .menu .fw_main_wrapper { width:95%!important; display:grid;}
	.header2025 .menu.sticky .fw_main_wrapper { width:90%!important}
	.header2025 .menu .fw_main_wrapper ul {justify-self: end!important;}
	.header2025 .menu.sticky .fw_main_wrapper ul {justify-self: center!important;}
	
	.header2025 .menu li.fw_page_16.fw_subs a span {
	    color: #fff;
	    border-radius: 50px;
	    height: auto;
	    outline: 2px solid var(--secondary-color);
	    padding: 0px 10px 2px 10px;
	    outline-offset:-1px;
	}
	.header2025 .menu li.fw_page_16.fw_subs .fw_subs_wrapper a span {
	    border: unset;
	    background-color: unset;
	    padding: 0px;
	    outline:unset;
	    color: #000;
	}
	.header2025 .menu li.fw_page_567 a span {
	    color: #fff;
	    background:var(--secondary-color);
	    border-radius: 50px;
	    height: auto;
	    outline: 2px solid var(--secondary-color);
	    padding: 0px 10px 2px 10px;
	    outline-offset:-1px;
	}
	.header2025 .menu li.fw_page_567 .fw_subs_wrapper a span {
	    border: unset;
	    background-color: unset;
	    padding: 0px;
	    outline:unset;
	    color: #000;
	}
}
@media (max-width:767px) {
	.header2025 .desktop-only {display:none!important;}
	.header2025 .mobile-only {display:flex!important;}
	.header2025 .mobile-only .menubar {justify-content: end; transform: translate(0px, 0px)!important;}
	.header2025 .brand .logo {position:relative; padding:10px 20px 5px 20px; margin:0px; /*background:var(--primary-color);*/ transition:.5s all ease-in-out;}
	.header2025 .mobile-cta {display:inline-block; width:100%}
	.header2025 .mobile-cta a {display:inline-block;}
}

/* // algemeen */

.header2025 {z-index:300; position:sticky;}
.header2025 .brand { z-index:20; position:relative; margin:0px!important; transition:.5s all ease-in-out;}


/*.header2025 .menu {margin:0px 0px 0px 0px;}*/
/*.header2025 .menubar {display: inline-flex; justify-content: space-evenly; width: 100%; transform: translate(0px, 15px);}*/
/*.header2025 .menubar a {color:var(--seablue-color); height: fit-content;}*/
/*.header2025 .menu span {font-weight:300;}*/
/*.header2025 .menu a {padding:0px 10px}*/
/*.header2025 a.button {padding: 5px 20px; transform: translate(0px, -9px)!important;}*/


.header2025.sticky .brand .logo {padding:10px 20px; transition:.5s all ease-in-out;}
.header2025.sticky .brand .logo img {max-width: 75%; margin: auto; transition:.5s all ease-in-out;}


@media (min-width:768px) and (max-width:1023px) {
	.header2025 a.button span {display:none!important;}
}


/* Home: Hoofdproduct/category slider */
section.hoofdproducten-slider {padding:56px 0px;}
section.hoofdproducten-slider .slider {opacity:0; visibility:hidden; max-height:0.1px; max-width: 100%; width: 100%; display: grid;}
section.hoofdproducten-slider .slider.show {opacity:1; visibility:visible;  max-height:100%}
/*section.hoofdproducten-slider .slider {opacity:1; visibility:visible;  max-height:100%}*/
section.hoofdproducten-slider ul.filter, section.hoofdproducten-slider ul.fw_list_filters {display:inline-flex; margin:20px auto 40px auto!important; }
section.hoofdproducten-slider ul.filter li, section.hoofdproducten-slider ul.fw_list_filters li {list-style:none; }
section.hoofdproducten-slider ul.filter li.filter-btn, section.hoofdproducten-slider ul.fw_list_filters li {background-color:var(--lightgrey-color); color:var(--darkgrey-color); padding:12px 7px; }
section.hoofdproducten-slider ul.filter li.filter-btn span, section.hoofdproducten-slider ul.fw_list_filters li span {padding:10px 20px; border-radius:50px;}
section.hoofdproducten-slider ul.filter li.filter-btn.active-filter span, section.hoofdproducten-slider ul.fw_list_filters li.fw_active span {background:var(--secondary-color); color:#fff; transition: .5s all ease-in-out; border-radius:50px}
section.hoofdproducten-slider ul.filter li.filter-btn:hover span, section.hoofdproducten-slider ul.fw_list_filters li:hover span {background:var(--secondary-color); color:#fff; cursor:pointer; transition: .5s all ease-in-out; border-radius:50px}

section.hoofdproducten-slider ul.filter li.filter-btn:first-of-type, section.hoofdproducten-slider ul.fw_list_filters li:first-of-type {border-top-left-radius:50px; border-bottom-left-radius:50px;}
section.hoofdproducten-slider ul.filter li.filter-btn:last-of-type, section.hoofdproducten-slider ul.fw_list_filters li:last-of-type {border-top-right-radius:50px; border-bottom-right-radius:50px;}

section.hoofdproducten-slider .slick-slide, section.hoofdproducten-slider .slick-slide .col {position:relative;}
section.hoofdproducten-slider .slick-slide, section.hoofdproducten-slider .slick-slide img {border-radius: 10px; object-fit:cover;}
section.hoofdproducten-slider .slick-slide .box {position:absolute; bottom:0px; left:0; width:100%; height:100%; text-align:center; overflow: hidden; border-radius:10px; padding-bottom: 20px;}
section.hoofdproducten-slider .slick-slide .box h2 {text-transform:uppercase; color:#fff; font-weight:300; font-size:16px; z-index:20; z-index: 20; height: 100%; align-content: end; position: relative;}
section.hoofdproducten-slider .slick-slide .box::after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background: linear-gradient(180deg, rgba(255,255,255,0) 50%, rgba(0,51,19,1) 100%);}

@media (min-width:1400px) {
	section.hoofdproducten-slider .slick-slide img {min-height:400px;}
}
@media (max-width:767px) {
	section.hoofdproducten-slider ul.filter, section.hoofdproducten-slider ul.fw_list_filters {display:block;}
	section.hoofdproducten-slider ul.filter li.filter-btn, section.hoofdproducten-slider ul.fw_list_filters li {display:inline-block; margin:0px 0px 5px 0px; border-radius:50px; padding: 5px 5px;}
	section.hoofdproducten-slider .slick-slide, section.hoofdproducten-slider .slick-slide img {width:100%; object-position:top;}
	section.hoofdproducten-slider ul.filter li.filter-btn span, section.hoofdproducten-slider ul.fw_list_filters li span {padding:5px 10px;}
}
/* //Home: Hoofdproduct/category slider */

/***/
.reviews-slider {background-color:var(--graygreen-color); padding:56px 20px; position:relative; overflow:hidden}
/*section.reviews-slider::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    right: 0;*/
/*    top: 0;*/
/*    width: 55%;*/
/*    height: 90%;*/
    /*background-image:url('/files/reviews-image-willemwierda.jpg');*/
    /*background-size:cover;*/
    /*background-repeat:no-repeat;*/
    /*background-position:bottom right;*/
    /*z-index: 0;*/
    /*border-bottom-left-radius: 50px;*/
    /*clip-path: polygon(0 0, 100% 0, 100% 57%, 20% 100%, 0 0%);*/
/*}*/
.reviews-slider .introduction {margin-bottom:30px;}
.reviews-slider .item .inside {background-color:rgba(255,255,255,.6); backdrop-filter: blur(10px); padding:40px; margin:10px; border-radius:20px; min-height: 100px;}
.reviews-slider .prev, .reviews-slider .next {position:relative; background:transparent; color:#fff;}
.reviews-slider .slider {padding-bottom:30px; z-index:2}
.reviews-slider ul.slick-dots {display:inline-flex; position: absolute;}
.reviews-slider ul.slick-dots li {list-style:none;}
.reviews-slider ul.slick-dots li button {display: block; width: 10px; height: 10px; padding: 0; border: none; border-radius: 100%; background-color: #fff; text-indent: -9999px; margin-right:5px;}
.reviews-slider ul.slick-dots li:last-of-type button {margin-right:0px;}
.reviews-slider ul.slick-dots li.slick-active button {background-color: var(--primary-color);}

.reviews-slider .image {
	position: absolute;
    max-width: 50%;
    right: -50px;
    top: -100px;
    transform: rotate(-10deg);
    height: 100%;
    border-bottom-left-radius: 75px;
    overflow: hidden;
    height: 100%;
    width: 100%;
    background: var(--primary-color);
}
.reviews-slider .image img {
	transform: rotate(10deg);
    height: 150%;
    width: 150%;
    margin-left: -75px;
    object-fit: cover;
}


@media (min-width:1280px) {
	.reviews-slider .prev {left:20%;}
	.reviews-slider .next {left:30%;}
	.reviews-slider .slick-list{margin-left:-20% !important;}
	.reviews-slider ul.slick-dots {left: 33%; bottom: -6px;}
}
@media (min-width:1024px) and (max-width:1279px) {
	.reviews-slider .prev {left:20%;}
	.reviews-slider .next {left:30%;}
	.reviews-slider .slick-list{margin-left:-20% !important;}
	.reviews-slider ul.slick-dots {left: 32%; bottom: -6px;}
}
@media (min-width:991px) and (max-width:1023px) {
	.reviews-slider .prev {left:20%;}
	.reviews-slider .next {left:33%;}
	.reviews-slider .slick-list{margin-left:-20% !important;}
	.reviews-slider ul.slick-dots {left: 32%; bottom: -6px;}
}
@media (min-width:768px) and (max-width:990px) {
	.reviews-slider .prev {left:unset;}
	.reviews-slider .next {left:13%;}
	.reviews-slider .slick-list{margin-left:0% !important;}
	.reviews-slider ul.slick-dots {left: unset; bottom: -6px;}
	section.reviews-slider::after {display:none}
	section.reviews-slider .image {display:none}
}
@media (max-width:767px) {
	.reviews-slider .prev, .reviews-slider .next {display:none!important;}
	.reviews-slider .slick-list{margin-left:0% !important;}
	.reviews-slider ul.slick-dots {left: unset; bottom: -6px;}
	.reviews-slider .slider {overflow:visible;}
	section.reviews-slider::after {display:none}
	section.reviews-slider .image {display:none}
}
/***/


/* Van Droom tot Realisatie */
section.droom-tot-realisatie {padding:56px 20px;}
section.droom-tot-realisatie .intro .box {font-size:18px; font-weight:300; line-height:1.7; color:var(--primary-color); padding:0px 20px}
section.droom-tot-realisatie .intro .box .fw_button {margin-top:10px; display: inline-block; font-size:14px; color:#fff;}
section.droom-tot-realisatie .stap {flex-wrap: nowrap; margin-bottom:10px;}
section.droom-tot-realisatie .icon {justify-items: flex-end;}
section.droom-tot-realisatie .icon img {
	max-width: 50px;
    max-height: 50px;
    height: 100%;
    border: 1px solid var(--primary-color);
    border-radius: 50%;
    overflow: visible;
    padding: 15px;
}

section.droom-tot-realisatie .stap .content h4 {font-weight:400; color:var(--primary-color); font-size:18px;}

@media (min-width:1400px) {
	section.droom-tot-realisatie .icon img {padding:20px;}
}
@media (min-width:1280px) {
	section.droom-tot-realisatie .intro .box {padding:0px 100px;}
}
@media (min-width:1024px) {
	section.droom-tot-realisatie .heading {margin-bottom:60px;}
}
@media (min-width:768px) {
	section.droom-tot-realisatie .stap .content {padding-top:20px}
}
@media (max-width:767px) {
	section.droom-tot-realisatie .intro {margin-bottom:60px!important; text-align:center;}
}
/* //Van Droom tot Realisatie */

/* Onze toppers uitgelicht */
section.onze-toppers-uitgelicht {padding:56px 20px; background-color:var(--graygreen-color); color:var(--primary-color); background-image: url(/files/tak.png); background-repeat: no-repeat; background-position: bottom right; background-size: contain;}
section.onze-toppers-uitgelicht .row.heading {margin-bottom:60px;}
section.onze-toppers-uitgelicht .left {padding:0px 80px;}
section.onze-toppers-uitgelicht .left, section.onze-toppers-uitgelicht .right {display:grid; }
section.onze-toppers-uitgelicht .quote {padding: 0px 70px; font-size: 20px; font-weight: 300; line-height: 1.5; margin-bottom:30px;}
section.onze-toppers-uitgelicht img {border-radius:50px;}
section.onze-toppers-uitgelicht .bezoek-ons {margin-top:30px; padding:0px 40px}
section.onze-toppers-uitgelicht .bezoek-ons h4 {text-transform:uppercase;}
section.onze-toppers-uitgelicht .bezoek-ons .button-wrapper {margin-top:15px;}

@media (max-width:767px) {
	section.onze-toppers-uitgelicht .left {padding:0px 15px; margin-bottom:30px;}
	section.onze-toppers-uitgelicht .quote {padding: 0px 0px;}
	section.onze-toppers-uitgelicht .bezoek-ons {padding: 0px 0px;}
	section.onze-toppers-uitgelicht .bezoek-ons .button-wrapper {display: inline-grid}
	section.onze-toppers-uitgelicht .bezoek-ons .button-wrapper a.fw_button {margin-bottom:10px;}
}
/* //Onze toppers uitgelicht */


/**/
section.video-banner {position:relative; max-height:600px;}
section.video-banner .transparent-link {position:absolute; left:0; top:0; width:100%; height:100%; text-indent:-99999999px; z-index:10}
section.video-banner::before {
	position:absolute;
	content:'\f04b';
	font-family:'Font Awesome 5 Free';
	font-weight:600;
	text-align:center;
	/*width:50px;*/
	/*height:50px;*/
	font-size:24px;
	padding: 20px 20.5px 20px 24.5px;
	border-radius:50%;
	border:1px solid #fff;
	background-color:rgba(0,0,0,.5);
	color:#fff;
	left:50%;
	top:50%;
	transform:translate(-50%, -50%);
}
/**/


/* Slider - Main slider*/
.slider.main_slider ul li {}
.slider.main_slider ul li .bx_title {position:absolute; left:50%; top:53%; width:100%; text-align:center; transform:translate(-50%, -50%); color:#fff; font-family:var(--rollerscript-font); font-size:42px; background: radial-gradient(rgba(0,0,0,.2) 0%, rgba(0,0,0,0) 50%);}
.slider.main_slider ul li .bx_sub_title {position:absolute; left:50%; top:46%; width:100%; text-align:center; transform:translate(-50%, -50%); color:#fff; text-transform:uppercase; font-weight:500; background: radial-gradient(rgba(0,0,0,.2) 0%, rgba(0,0,0,0) 50%);}
@media (max-width:767px) {
	.slider.main_slider ul li .bx_title {font-size:20px; top:57%; line-height:1;}
	.slider.main_slider ul li .bx_sub_title {top: 39%; font-size: 12px !important; text-transform:none!important}
}



/**/

/* product intro FAQ */

.product-intro-faq {
    padding: 60px 0 60px 0;
    line-height: 2;
}

.product-intro-faq .subtitle {
    color: var(--secondary-color);
}

.product-intro-faq h1 {
    margin-bottom: 20px!important;
    font-size: 40px;
    line-height: 1;
    color: var(--secondary-color);
}

.product-intro-faq .intro .heading {
    margin-bottom: 30px;
}

.product-intro-faq .intro p {
    margin-bottom: 20px;
}

.product-intro-faq .faq {padding:30px; background-color:var(--graygreen-color); position:relative;}
.product-intro-faq .faq .inside {position:sticky; top:65px;}
section.product-intro-faq .faq h2 {color:#fff; margin-bottom:24px; font-size:24px;}

@media (min-width:1024px) {
	.product-intro-faq .faq::after {
	    content: '';
	    position: absolute;
	    left: 0;
	    top: 0;
	    width: 150%;
	    height: 100%;
	    background-color: var(--graygreen-color);
	    z-index: -1;
	}
}
/* FAQ */

ul.accordion-aside {background-color:var(--graygreen-color);}
ul.accordion-aside ul {background-color:transparent; box-shadow:none; padding:10px;}
ul.accordion-aside li {border-bottom:1px solid #fff;}
ul.accordion-aside li ul {padding:0px;}
ul.cd-accordion-menu.accordion-aside ul {box-shadow: none; padding: 0px; background: transparent;}
ul.accordion-aside li ul li {border:none;}
ul.accordion-aside label {padding:10px 10px 10px 20px;}
ul.accordion-aside label::before, ul..accordion-aside label::after {top:20px}
ul.accordion-aside input[type=checkbox]:checked + label::after {padding-bottom:3px;}
ul.accordion-aside label::after {left:0px!important}
ul.accordion-aside input[type=checkbox]+label {background-color:transparent; color:#fff; border:none; text-transform:none;}
ul.accordion-aside input[type=checkbox]:checked+label {background-color:transparent; border:none;}
ul.accordion-aside ul ol li {list-style: auto; margin-bottom: 0px;}
/* //FAQ */


/** inspiratie socials **/
section.inspiratie-socials {background-color:var(--primary-color); color:#fff;}
section.inspiratie-socials .intro {padding:60px 0px; display: grid;}
section.inspiratie-socials .intro .heading {}
section.inspiratie-socials .intro .heading h2.red {font-size: 40px; line-height: 1;}
section.inspiratie-socials .intro .heading h2.rollerscript {padding-left:30px;}
section.inspiratie-socials .intro .bottom {align-content: end;}
section.inspiratie-socials .intro .bottom .socialmedia a {color:#fff; font-size:24px; margin-right:5px;}
/*section.inspiratie-socials .gallery #custom-gallery {max-height:600px; overflow:hidden}*/
section.inspiratie-socials .gallery {max-height:600px; overflow:hidden}
section.inspiratie-socials .gallery::before {content:''; position:absolute; left:0%; top:0; height:100%; width:100%; z-index:1; background: linear-gradient(180deg, rgba(0,51,19,1) 10%, rgba(255,255,255,0) 50%, rgba(0,51,19,1) 90%);}
section.inspiratie-socials .gallery #custom-gallery .row, section.inspiratie-socials .slider {/*columns: 2;*/ column-gap: 3rem; display:inline-block;}
/*section.inspiratie-socials .slider {}*/
section.inspiratie-socials .gallery #custom-gallery .row .item, section.inspiratie-socials .slider .item {display: block;	width: 100%; margin-bottom:10px;}
section.inspiratie-socials .gallery #custom-gallery .row .item img, section.inspiratie-socials .slider .item img {width: 100%; border-radius: 20px;}

section.inspiratie-socials .slider .item.large img {min-height: 300px; object-fit: cover;}
section.inspiratie-socials .slider .slick-slide div .item:nth-child(2) {transform: translate(15px, -100px);}
section.inspiratie-socials .slider .slick-list {overflow:visible;}
section.inspiratie-socials .slider {}

@media (max-width:767px) {
	section.inspiratie-socials .slider .item {width:95%!important}
}
/** //inspiratie socials **/


/***/
body.project2025 .projectenoverzicht, body.page2025 .projectenoverzicht {padding:56px 0px;}
body.project2025 .projectenoverzicht h1, body.page2025 .projectenoverzicht h1 {font-size:40px;}
body.project2025 .projectenoverzicht .royalSlider {margin-top:30px;}
body.page2025 .projectenoverzicht .project-row {margin-top:30px;}
body.page2025 .projectenoverzicht .project-row a:hover, body.project2025 .projectdetail .project-row a:hover {text-decoration:none;}
body.page2025 .projectenoverzicht .project-row .item, body.project2025 .projectenoverzicht .project-row .item {margin-bottom:30px; }
body.project2025 .projectdetail h2 {font-size: 32px;}
body.project2025 .projectdetail .royalSlider img {height: auto; max-height: 700px; width: 100%; object-fit: cover; max-width: 100%;}
body.project2025 img.rsImg.rsMainSlideImage {margin: 0 !important;  width: 100% !important;}
body.project2025 .fw_rs_slide_wrapper {min-width:100%!important}


body.page2025 .projectenoverzicht .project-row .item, body.project2025 .projectenoverzicht .project-row .item {
    min-height: 450px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 20px;
    color: #fff;
    background-size: cover;
    background-position: center;
    border-radius:20px;
}

@media only screen and (min-width: 1280px) {
	body.project2025 .projectdetail .royalSlider,
	body.project2025 .projectdetail .rsOverflow {
	    width: 100% !important;
	    height: 700px;
	    min-height: 700px;
	    max-height: 700px;
	}
	body.project2025 .projectdetail .royalSlider img {
	    height: auto;
	    max-height: 700px;
	    width: 100%;
	    object-fit: cover;
	    max-width: 100%;
	}
	body.project2025 .projectdetail img.rsImg.rsMainSlideImage {margin: 0 !important; width: 100% !important;}
}

@media (min-width:768px) and (max-width:1279px) {
	body.project2025 .projectdetail .royalSlider,
	body.project2025 .projectdetail .rsOverflow {
	    width: 100% !important;
	    height: 500px;
	    min-height: 500px;
	    max-height: 500px;
	}
	body.project2025 .projectdetail .royalSlider img {
	    height: auto;
	    max-height: 500px;
	    width: 100%;
	    object-fit: cover;
	    max-width: 100%;
	}
	body.project2025 .projectdetail img.rsImg.rsMainSlideImage {margin: 0 !important; width: 100% !important;}
}


@media only screen and (max-width: 767px) {
	body.project2025.projectdetail .royalSlider,
	body.project2025.projectdetail .rsOverflow {
	    width: 100% !important;
	    height: 300px;
	    min-height: 300px;
	    max-height: 300px;
	}
	body.project2025 .projectdetail .royalSlider, body.page2025 .projectdetail .royalSlider,
	body.project2025 .projectdetail .rsOverflow, body.page2025 .projectdetail .rsOverflow {
	    width: 100% !important;
	    height: 300px;
	    min-height: 300px;
	    max-height: 300px;
	}
	body.project2025 .projectdetail .fw_rs_slide_wrapper {margin-top: 0px;}
	body.page2025 .projectenoverzicht .project-row .item, body.project2025 .projectenoverzicht .project-row .item {min-height:300px;}
}
/***/


/*** overgenomen van 2021 stylesheet én aangepast **/

a.button,
.fw_form_submit_link {
    padding: 5px 20px;
    border-radius: 20px;
    box-shadow: unset;
    font-size: 14px;
    font-weight: 300;
    display:inline-block;
}

.footer .button {
    line-height: 1.5em;
}

/** Actiefolder aan/uitzetten **/
/*section.documentencentrum.nr1 .col.col-md-6.col-xs-12.mb-sm-4.mb-md-0 {display: none;}*/




a.button.btn-green-outline {
    border: 2px solid #008000;
    color: #008000;
}




a.button.btn-green-outline:hover {
    border: 2px solid #008000;
    background-color: #008000;
    color: #fff;
}

a.white-outline {
    border: 2px solid #fff;
    color: #fff!important;
    display:inline-block;
}

a.white-outline:hover {
    background: #fff;
    color: #008000!important;
}

a.button-red {
    background: var(--secondary-color);
    color: #fff!important;
    border: 2px solid var(--secondary-color);
    display:inline-block!important;
}

a.button-red span {display:inline-block!important;}

a.button-red:hover {
    background: transparent;
    color: var(--secondary-color)!important;
}

a.button-plain {
    color: #7C7C7C;
    text-decoration: underline;
    background: transparent;
    border-color: transparent;
}

a.button-plain:hover {
    text-decoration: underline!important;
    color: #000;
}

a.button.btn-green,
.fw_form_submit_link {
    background: #008000;
    color: #fff;
    border: 2px solid #008000;
}

a.button.btn-green:hover {
    background: transparent;
    color: #008000;
}

a.green-outline {
    border: 2px solid #008000;
    color: #fff;
}

a.green-outline:hover {
    background: #008000;
}

a.button {
    transition: all 0.3s ease-in-out;
}
a.button:hover {
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}

a.button-white {
    background: #fff;
    border: 2px solid #fff;
    color: #033814!important;
    font-weight: 400;
}

a.button-white:hover {
    background: #033814!important;
    color: #fff!important;
}

.actiebanner a.button-white {
    color: #EE2E25!important;
}

.actiebanner a.button-white:hover {
    background: #EE2E25!important;
    color: #fff!important;
}

.gallery {
    padding-bottom: 30px;
}

.gallery ul {
    padding-left: 0;
}

.gallery ul li {
    padding: 0 5px;
    display: inline-block;
}

ul,
ol {
    list-style-position: inside;
    padding-left: 20px;
}

/* .content ul li:before {
    content: '\f00c';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    color: #00C600;
    margin-right: 10px;
} */
.content ul li::marker, .product-usps ul li::marker {
    content: '\f00c';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    color: #00C600;
    padding-left: 20px;
}


body {
    font: 14px/26px 'Open Sans', sans-serif;
    color: #303231;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1;
    width: 100%;
    display: block;
    font-family: 'Open Sans', sans-serif;
    margin-bottom: 10px;
    background: transparent;
}

.productinformatie h1 {
    font-size: 32px;
    margin-bottom: 20px;
}

.cd-accordion-menu {
    margin-top: 0px!important;
    padding-left: 0;
}

.subtitle {
    display: block;
    letter-spacing: 1px;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 10px;
    color: #008000;
    font-size: 16px;
}

.subtitle.mb-0 {
    margin-bottom: 0px!important;
}

.actiebanner .subtitle {
    color: #fff;
}

.wat-klanten-zeggen .subtitle {
    margin-bottom: 0;
}


.bijpassende-accessoires .subtitle {
    margin-bottom: 0;
}


/* header 2021 */

.header2021 .menubar {
    background: var(--primary-color);
}

.header2021 .menubar .container {
    background: transparent;
}

.header2021 .menubar a {
    color: #fff;
    padding: 10px 10px;
}

.header2021 .menu {
    margin-bottom: 0;
}

.header2021 .fw_subs_wrapper ul li a {
    color: #000;
}

.header2025 .bel a,
.header2025 .mail a {
    color: #000;
    width: 100%;
    line-height: 1.5em;
    padding:10px;
}

.header2021 .menu.sticky {
    left: 0;
    background: var(--primary-color);
}

.header2021 .reviews .socials a {
    color: #008000;
    font-size: 23px;
    margin-right: 5px;
    float: right;
}

.usps-header {
    padding: 10px 0;
    color: #7C7C7C;
}

.usps-header img {
    float: left;
    margin-right: 5px;
    max-width: 16px;
    padding: 2px 0 2px 0;
}

.header2021 .menu .home-btn p {
    text-indent: -99999999px;
}

.header2021 .menu .home-btn {
    display: flex;
    float: left;
    background: #008000;
}

.header2021 .menu .home-btn svg {
    font-size: 20px;
}

.header2021 .menu .fw_main_wrapper {
    float: left;
}

.header .menu .fw_main_wrapper li:first-child {
    margin: 0 2px;
}

.header2021 .menu .phone-btn {
    display: none;
    float: right;
    font-size: 0.5em;
    text-indent: -9999999px;
}

.header2021 .menu.sticky .phone-btn {
    display: flex;
}

.header2021 .menu .phone-btn svg {
    color: #008000;
}


/* footer 2021 / 2025 */

.footer {
    background-color: var(--primary-color);
}

.footer .container {
    background: transparent;
}

/* .footer .row {
    display: block;
} */

.footer .col-sm-5,
.footer .col-sm-7 {
    width: 100%;
    max-width: 100%;
}

@media (min-width: 992px) {
    .footer .col-lg-2 {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .footer .col-sm-5 {
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
    .footer .col-sm-6 {
        flex: 0 0 50%;
        max-width: 50%;
    }
    .footer .col-sm-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }
}


.footer h4 {
    color: #008000;
    text-transform: uppercase;
}
.footer .block .row .col {
    padding-left: 0!important;
}
.bottom-footer {
    background: #008000;
    color: #fff;
    padding: 5px 0;
    font-size: 12px;
}

.bottom-footer .container {
    background: transparent;
}

.bottom-footer a {
    color: #fff;
}

.footer .block {
    font-size: 12px;
}

.footer .block a {
    color: #fff;
}

.footer .block .icons {
    padding-left: 0;
    padding-top: 0;
}



.footer .block3 img {
    max-width: 25px;
    padding-top: 7px;
}

.footer .block1 a {
    color: #fff;
    text-decoration: none;
}

.footer .red, .footer .block .red {color:var(--secondary-color); font-weight:500;}

.footer .block4 .block {
    font-size: 12px;
    line-height: 18px;
}

.footer .block5 p {display:flex;}
.footer .block5 img {margin-right:10px;}

.footer .icons {
    float: left;
}

.cd-accordion-menu input[type=checkbox]:checked+label+ul,
.cd-accordion-menu input[type=checkbox]:checked+label:nth-of-type(n)+ul
    display: flex
}


/* page sliders */

#page.id-45 .slider .bx-wrapper ul li img {
    width: 100%;
    max-height: unset;
    object-fit: cover
}

@media (max-width:767px) {
	.slider .bx-wrapper ul li img {min-height:200px;}
}

/*#page.id-45 .slider .bx-controls {
    display: block;
}*/

#page.id-300 .hcSliderbottom {
    margin-bottom: 30px;
}

#page.id-300 .slider .bx-wrapper ul li img {
    width: 100%;
    max-height: unset;
    object-fit: cover
}

#page.id-300 .slider .bx-controls {
    display: block;
}

.slider .bx-wrapper ul li img {
    width: 100%;
/*  max-height: 435px;*/
    max-height: unset;
    object-fit: cover
}

.slider .bx-controls {
    display: none;
}


/* Reviews */

.stars {
    margin-top: 0.25rem;
}

.reviews .stars img {
    float: left;
    width: 18px;
}

.reviews .stars span {
    color: #7C7C7C;
    font-size: 10px;
    display: inline-grid;
}

.reviews .grade {
    display: flex;
}

.reviews .grade span {
    background: #EE2E25;
    padding: 9px 7px;
    font-size: 14px;
    color: #fff;
}
.footer .reviews a {
    width: 100px;
}

.footer .reviews .stars span {
    color: #fff;
}



/* home main slider */

/*.slider {*/
/*    max-width: 100%!important;*/
/*}*/

.slider.main_slider .bx-wrapper ul li {
    width: 1400px;
    max-width: 100%;
}

body.home2021 .main_slider .bx_text {
    right: 0;
    left: unset;
    background-color: #EE2E25;
    font-size: 14px;
    font-style: normal;
    padding-left: 10px;
    padding-right: 60px;
}

body.home2021 .main_slider .bx_text p {
    padding: 0;
    margin: 0;
    font-weight: 600;
}

body.home2021 .main_slider .bx_text p strong {
    text-transform: uppercase;
    letter-spacing: 1px;
}

body.home2021 .main_slider .bx_text h2 {
    letter-spacing: 0;
    font-size: 30px;
    padding: 0;
    margin: 0;
}


/* home slick slider productblokken */

.categories-slider {
    position: relative;
    padding: 10px 0;
}

.product-slider.slick-slider .col {
    padding: 20px 20px 20px 0;
}

.product-slider.slick-slider img {
    width: 100%;
    max-width: 600px;
    max-height: 400px;
    object-fit: cover;
}

.prev {
    position: absolute;
    left: 0;
    top: 50%;
    font-size: 24px;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, .5);
    padding: 5px 7px;
}

.next {
    position: absolute;
    right: 20px;
    top: 50%;
    font-size: 24px;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, .5);
    padding: 5px 7px;
}
/* datepicker onlineafspraken.nl */
th.prev, th.next {
    position: relative;
    transform: none!important;
}
th.next {
    text-align: right;
    right: 0;
}
/* --- */
.product-slider.slick-slider .col a {
    text-align: center;
    color: #313131;
}

.product-slider.slick-slider .col a:hover {
    text-decoration: none;
}

.product-slider.slick-slider .col h2 {
    margin-bottom: 10px;
}


/* Home showrooms */
section.home-intro-showrooms .hoofdbeeld {position:relative;}
section.home-intro-showrooms .hoofdbeeld::after {position:absolute; content:''; background-image:url('/files/hero-bg.svg'); background-size: contain; background-position: bottom; background-repeat: no-repeat; bottom:-1px; left:0; z-index:1; width:100%; height:300px; /*filter: invert(13%) sepia(14%) saturate(3290%) hue-rotate(101deg) brightness(19%) contrast(107%);*/}
@media (min-width:1600px) {
	section.home-intro-showrooms .hoofdbeeld::after {background-size:cover;}
}

section.home-intro-showrooms .inhoud {z-index:10; padding:0px;}

/* showroom tabs */
section.home-intro-showrooms .showrooms .tabset > input[type="radio"] {
  position: absolute;
  left: -200vw;
}

section.home-intro-showrooms .showrooms .tabset label {border:1px solid #fff; padding:5px 10px; text-transform:uppercase; border-radius:50px; margin-right:5px;}
section.home-intro-showrooms .showrooms .tabset label.active  {background-color:var(--secondary-color);}

section.home-intro-showrooms .showrooms .tabset .tab-panel {
  display: none;
}

section.home-intro-showrooms .showrooms .tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
section.home-intro-showrooms .showrooms .tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
section.home-intro-showrooms .showrooms .tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
section.home-intro-showrooms .showrooms .tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
section.home-intro-showrooms .showrooms .tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
section.home-intro-showrooms .showrooms .tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
  display: block;
}

@media (max-width:767px) {
	.home-intro-showrooms .showrooms {text-align:center;}
	.home-intro-showrooms .showrooms strong, .home-intro-showrooms .showrooms a {padding-left:0px!important;}
}
/* //Showroom tabs */


.home-intro-showrooms {
    background: var(--primary-color);
    padding: 0px 0;
    color:#fff;
}

.home-intro-showrooms p {
    line-height: 30px;
}

.home-intro-showrooms h1 {
    margin-bottom: 30px;
    font-size: 40px;
    line-height: 1;
    color:var(--secondary-color);
}

.home-intro-showrooms span {
    color: #fff;
    letter-spacing: 1px;
    font-weight: 600;
    display: block;
    margin-bottom: 10px;
    font-size:42px;
}
.home-intro-showrooms .showrooms span {
	color:var(--secondary-color);
	font-weight:100;
	font-size:20px;
	text-transform:uppercase;
}

.home-intro-showrooms strong {
    font-size: 18px;
    margin-bottom: 20px;
}

.home-intro-showrooms .showrooms strong,
.home-intro-showrooms .showrooms a {
    display: block;
    width: 100%;
    padding-left: 20px;
}

.home-intro-showrooms .showrooms a {
    color: #7C7C7C;
    text-decoration: underline;
    margin-bottom: 10px;
}

.home-intro-showrooms .showrooms .afb a, .home-intro-showrooms .showrooms .afb .groenebalk {
    padding-left: 0;
    margin-left: 0;
    background: #008000;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    text-decoration: none;
}

.home-intro-showrooms .showrooms .afb a:hover {
    text-decoration: none;
    background: #033814;
}


/* Documentencentrum */

#page.id-45 .documentencentrum {
    background: var(--primary-color);
}


/* Homepage specific */

#page.id-45 .documentencentrum .title {
    display: block;
}

#page.id-45 .documentencentrum .card.actiefolder, .documentencentrum .card.actiefolder {
    background: #fff;
    border-radius:20px;
}


/* .card-body */

.documentencentrum .card .col .inside {
    min-height: 55px;
}

.documentencentrum {
    background: var(--primary-color);
    padding: 60px 0;
}

.documentencentrum .title {
    display: none;
    margin-bottom: 30px;
}

.documentencentrum .title span {
    color: #008000;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.documentencentrum .title h2 {
    color: #fff
}

@media (min-width:1024px) {
    /* .documentencentrum .card.actiefolder {
        padding-right: 10px;
    } */
    
    /* .documentencentrum .card.magazine {
        padding-left: 10px;
    } */
    
    .card.actiefolder .card-body,
    .card.magazine .card-body {
        min-height: 177px;
    }
}

@media (max-width:767px) {
	.documentencentrum .card.actiefolder .col a {display:inline-block;}
	.documentencentrum .card.actiefolder .col a img {max-width:100px;}
	.documentencentrum .card .card-body img {max-width:100px!important; margin-bottom:10px!important;}
}




.documentencentrum .card.magazine {
    background: #008000;
    color: #fff;
    border-radius:20px;
}

.documentencentrum .card.magazine h3 {
    color: #033814;
}

.documentencentrum .card .card-body {
    padding: 20px;
}

.documentencentrum .card .card-body img {
    width: 100%;
    max-width:120px;
    height: auto;
    /*max-height: 177px;*/
    margin:auto;
    object-fit: contain;
    transform: rotate(-10deg);
    transform-origin: center;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, .5);
}

.documentencentrum .card .card-body .row .col:last-of-type span {
    color: #008000;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: bold;
}

.documentencentrum .card.magazine .card-body .row .col:last-of-type span {
    color: #fff;
}

.documentencentrum .card .card-body .row .col:last-of-type {
    padding: 0 20px;
}

.documentencentrum .card .card-body .row .col a {
    margin-top: 1rem;
}

@media (max-width:767px) {
	.documentencentrum .col {
	   margin-bottom: 30px;
	}
	.documentencentrum .col:last-of-type {
	   margin-bottom: 0px;
	}
}


/* product intro usps */

.product-intro-usps {
    padding: 60px 0 30px 0;
    line-height: 2;
}

.product-intro-usps .subtitle {
    color: var(--secondary-color);
}

.product-intro-usps h1 {
    margin-bottom: 20px!important;
    font-size: 32px;
    line-height: 1;
}

.product-intro-usps .intro .heading {
    margin-bottom: 30px;
}

.product-intro-usps .intro p {
    margin-bottom: 20px;
}

.product-usps ul {
    list-style: none;
    /* padding: 0; */
}

/* .product-usps ul li {
    padding-left: 0;
} */

/* .product-usps ul li:before {
    content: '\f00c';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    color: #00C600;
    margin-right: 10px;
} */

.productinformatie {
    padding: 60px 0;
}

@media (min-width:1024px) {
    .productinformatie .left {
        padding-right: 10px;
    }
    .productinformatie .right {
        padding-left: 10px;
    }
}


/* Reviews */

.wat-klanten-zeggen {
    padding: 60px 0px
}

.wat-klanten-zeggen h3 {
    margin-bottom: 30px!important;
    display: block
}


/* Verandatypen */

.verandatypen {
    /*padding: 0 0px 30px 0;*/
    padding: 60px 0px 30px 0;
}

@media (min-width:1024px) {
    .verandatypen .card:nth-child(2), .verandatypen .card:nth-child(5) {
        padding-left: 0;
        padding-right: 10px;
    }
    .verandatypen .card:nth-child(3), .verandatypen .card:nth-child(6) {
        padding-left: 10px;
        padding-right: 10px;
    }
    .verandatypen .card:nth-child(4), .verandatypen .card:nth-child(7) {
        padding-left: 10px;
        padding-right: 0;
    }
    .verandatypen .card .card-body .middle {
        min-height: 255px;
    }
}

@media (min-width:768px) and (max-width:1023px) {
    .verandatypen .card:nth-child(2) {
        padding-left: 0;
        padding-right: 10px;
    }
    .verandatypen .card:nth-child(3) {
        padding-left: 10px;
        padding-right: 10px;
    }
    .verandatypen .card:nth-child(4) {
        padding-left: 10px;
        padding-right: 0;
    }
    .header2021 .menu .fw_main_wrapper {
        width: 95%!important;
    }
    .header2021 .menu .fw_main_wrapper li {
        margin: 0px 0px;
    }
    .content-2col .inhoud {
        margin-top: 1rem;
        display: block;
    }
    .content-2col.reversed .inhoud {
        order: 2
    }
}

@media (min-width:768px) {
    .verandatypen .card {
        margin-bottom: 0;
    }

    .tuinkamertypen .card:nth-child(1) {
        padding-left: 0;
        padding-right: 10px;
    }
    .tuinkamertypen .card:nth-child(2) {
        padding-left: 10px;
        padding-right: 0;
    }
    .tuinkamertypen .card .card-body .middle {
        min-height: 165px;
    }
    .zonweringtypen .card:nth-child(2),
    .zonweringtypen .card:nth-child(4) {
        padding-left: 10px;
        padding-right: 0;
    }
    .zonweringtypen .card:nth-child(1),
    .zonweringtypen .card:nth-child(3) {
        padding-left: 0;
        padding-right: 10px;
        margin-bottom: 20px;
    }
    .zonweringtypen .card .card-body .middle {
        min-height: 160px;
    }
    .carporttypen .card .card-body .middle {
        min-height: 100px!important;
    }
}
.verandatypen .content h2 {
    margin-bottom: 20px!important;
}

.verandatypen ul {
    list-style: none;
}

.verandatypen .card {
    margin-bottom: 30px;
}

.verandatypen .subtitle {
    margin-bottom: 0;
}

.verandatypen .card .card-body {
    padding: 0;
    box-shadow: 0 0px 5px rgba(0, 0, 0, .2);
}

.verandatypen .card .card-body {
    background: #FAFAFA;
}

.verandatypen .card:nth-child(odd) .card-body {
    background: #fff;
}

.verandatypen .card .card-body .top {
    text-align: center;
}

.verandatypen .card .card-body .top span.subtitle {
    display: block;
    padding-top: 10px;
    color: #008000;
}

.verandatypen .card .card-body .top h4 {
    margin-bottom: 0;
    padding-bottom: 10px;
    font-size: 20px;
}

.verandatypen .card .card-body .middle {
    padding: 30px 20px 0 20px;
}

.verandatypen .card .card-body .middle ul {
    list-style: none;
}

.verandatypen .card .card-body .bottom {
    text-align: center;
    padding: 30px 0;
}

.pagina-inhoud {
    margin-bottom: 30px;
}

.pagina-inhoud ul {
    list-style-position: outside;
    margin-left: 20px;
}


/* Actiebanner */

.actiebanner {
    background: #EE2E25;
    color: #fff;
    text-align: center;
    padding: 30px 0;
}

.actiebanner span {
    margin-bottom: 1rem;
}

.actiebanner h2 {
    font-size: 36px;
}

.actiebanner p {
    font-size: 18px;
    font-weight: 500;
}

.actiebanner a.button {
    font-size: 14px;
}


/* onze showrooms */

.showrooms-banner {
    padding: 30px 0;
    background: var(--primary-color);
    color: #fff;
}

.showrooms-banner strong {
    display: block;
    margin-top: 1rem;
    font-size: 18px;
    font-weight: 400;
}

.showrooms-banner .button-plain {
    color: #E8E8E8;
}
.showrooms-banner .subtitle {
    margin-bottom: 0;
}
.showrooms-banner a.button-plain:hover {
    color: #00C600;
}

@media (min-width:1024px) {
    .showrooms-banner .showroom-blokken:nth-child(2) {
        padding-left: 0;
        padding-right: 20px;
    }
    .showrooms-banner .showroom-blokken:nth-child(3) {
        padding-left: 10px;
        padding-right: 10px;
    }
    .showrooms-banner .showroom-blokken:nth-child(4) {
        padding-left: 20px;
        padding-right: 0;
    }
}

/* passende accessoires */

.bijpassende-accessoires {
    background: #033814;
    color: #fff;
    padding: 30px 0;
}

.bijpassende-accessoires .col {
    padding: 0 10px;
}

.bijpassende-accessoires a {
    color: #fff;
}

.bijpassende-accessoires a:hover {
    text-decoration: none;
}

.project-slider .slick-slide {
    padding: 0 20px 0 20px;
}

@media (min-width:1024px) {
    .project-slider .container-offset {
        max-width: unset;
        width: 100%;
        overflow: hidden;
        margin: 0 auto;
        padding-left: 245px;
    }
}

@media (min-width:1200px) {
    .project-slider .container-offset {
        padding-left: 165px;
    }
}

@media (min-width:1724px) {
    .project-slider .container-offset {
        padding-left: 330px;
    }
}

.content-2col {
    padding: 30px 0;
}

.gray-bg {
    background: #FAFAFA;
    padding: 30px 0;
}

#page.id-278 .content-2col.double {
    background: #fafafa;
    margin-top: 30px;
}

#page.id-278 .content-2col.double .inhoud-2 {
    margin-top: auto;
    margin-bottom: auto;
    padding: 0 30px;
}

#page.id-37 .content-2col.double .col {
    padding: 10px;
    display: block;
}

/* OKA pagina */

#page.id-352 .product-intro-usps .usps {
    display: none;
}

#page.id-352 .product-intro-usps .intro {
    max-width: 100%;
    flex: 0 0 100%;
}

.oka {
    margin-top: 30px;
    margin-bottom: 30px;
}

.oka:nth-of-type(1) {
    margin-bottom: 0;
}

.oka:nth-of-type(2),
.oka:nth-of-type(3) {
    margin-top: 0;
}

.oka img {
    max-width: 200px;
    max-height: 125px;
    margin: 30px auto;
}

.oka ul:not(:last-child) {
    margin-bottom: 30px;
}

.oka [class^="col"] {
	padding:0;
}

/* Accordion */

.cd-accordion-menu input[type=checkbox]:checked+label {
    background: #008000;
    color: #fff;
    border: 1px solid #008000;
}

.cd-accordion-menu input[type=checkbox]+label {
    background: #FAFAFA;
    color: #7C7C7C;
    border: 1px solid #E8E8E8;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1px;
}

.cd-accordion-menu input[type=checkbox]:checked+ul {
    box-shadow: 0 0px 5px rgba(0, 0, 0, .2)!important;
}

ul.cd-accordion-menu li {
    margin-bottom: 10px;
}

.product-specificaties {
    background: #FAFAFA;
}

/*.product-specificaties h2,*/
.project-slider h2,
.bijpassende-accessoires h3,
.documentencentrum h2 {
    font-size: 30px;
}

.product-specificaties .title p,
.project-slider .title p,
.bijpassende-accessoires .title p,
.documentencentrum .title p,
.accessoire-overzicht .title p,
.accessoire-overzicht .title h3,
.wat-klanten-zeggen .title h3 {
    font-size: 30px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
}

.metalura-template h1 {
    font-size: 32px;
}

.metalura-template h2,
.metalura-template h3 {
    font-size: 30px
}

.metalura-template .balkonbeglazing h3 {
    font-size: 17px
}

ul.cd-accordion-menu ul {
    box-shadow: 0 0px 10px rgb(0 0 0 / 10%);
    padding: 20px;
    background: #fff;
}

.accessoire-overzicht h2 {
    font-size: 30px;
}

.accessoire-overzicht .col {
    padding: 10px;
}

.accessoire-overzicht a {
    color: #000;
}

.accessoire-overzicht a:hover {
    text-decoration: none;
}

.accessoire-overzicht .col a strong {
    background: #fff;
    width: 100%;
    height: auto;
    box-shadow: 0 0px 5px rgba(0, 0, 0, .06);
    display: block;
    padding: 5px 0;
}

.product-specificaties .cd-accordion-menu table {
    border-spacing: 0px!important;
    border-collapse: collapse;
}

.product-specificaties .cd-accordion-menu table tr td {
    padding: 5px 10px;
}

.footer .block3 a:hover,
.footer .block4 a:hover {
    text-decoration: none;
}

a.loket {
	float: none!important;
    display: inline;
    font-size: 14px;
	font-weight: unset;
	text-decoration: underline;
}

@media (min-width:768px) {
    .cta-mobile-bar {
        display: none
    }
    .mobile-btn {
        display: none;
    }
    .header2021 .menu .fw_main_wrapper {
        width: 90%;
    }
    .usps-header .col:nth-child(2) span.mobile {
        display: none;
    }
}

@media (min-width:1024px) {
    .wat-klanten-zeggen .videos .col-md-6 iframe {
        max-width: 95%
    }
    .wat-klanten-zeggen .videos .col-md-6:last-of-type iframe {
        float: right;
    }
}

.wat-klanten-zeggen .referenties {
    background: #f7f7f7;
}


/* form */

.form .fw_form_label label {
    background: unset;
    font-size: inherit;
    border: 0;
}

.form .fw_form_field input,
.fw_form_field textarea {
    border: 1px solid #eee;
    background: #f7f7f7;
}

@media (min-width:768px) and (max-width:1279px) {
    .card.actiefolder .card-body,
    .card.magazine .card-body {
        min-height: 202px;
    }
}

@media (max-width:991px) {
    .product-slider.slick-slider,
    .projecten-slider.slick-slider {
        max-height: 400px;
        max-width: 730px;
        overflow: hidden;
    }
    .product-slider.slick-slider img,
    .projecten-slider.slick-slider img {
        object-fit: cover
    }
    .sa-opties .card .card-body {
        min-height: 80px;
    }
}

@media (min-width:768px) {
    .mobile-cta {
        display: none !important;
    }
}




@media (max-width: 767px) {
    section.corona.extramelding p {
	    font-size: 16px!important;
	    line-height: 1.3!important;
	}
    /*     .header2021 .bel span,
    .header2021 .mail span {
        display: none;
    } */
    .header2021 .bel a,
    .header2021 .mail a {
        text-align: center;
    }
    .header2021 .bel a img,
    .header2021 .mail a img {
        max-width: 25px;
        margin: auto;
    }
    /*     .header2021 .bel,
    .header2021 .mail {
        display: none;
    } */
    .bel span,
    .bel strong,
    .mail span,
    .mail strong {
        display: none;
    }
    .bel,
    .mail {
        position: absolute;
        right: 0;
    }
    .testing {
        justify-content: space-between;
    }
    .testing2 {
        width: unset;
    }
    /*     .brand {
        flex-grow:2;
    } */
    .header2021 .menu .home-btn {
        display: none;
    }
    .cta-mobile-bar .row {
        width: 100%;
        display: inline-flex;
    }
    .cta-mobile-bar .row .col {
        float: left;
        width: auto;
        flex-grow: 1;
    }
    .cta-mobile-bar {
        display: inline-block;
        width: 100%;
        position: fixed;
        bottom: 0;
        left: 0;
        background: #033814;
        z-index: 90;
        box-shadow: 0 0px 5px #eee;
    }
    .cta-mobile-bar .col:nth-child(2) {
        border-left: 1px solid #dcdcdc;
        /* border-right: 1px solid #dcdcdc; */
        background: #008000;
    }
    .cta-mobile-bar a {
        color: #fff;
        display: block;
    }
    .cta-mobile-bar a svg {
        color: #fff;
        font-size: 18px;
        padding: 5px 0 0px 0px
    }
    .cta-mobile-bar .row.text-center {
        padding: 0!important;
    }
    .cta-mobile-bar .container {
        margin: 0!important;
        width: 100%!important;
    }
    .bottom-footer {
        display: none;
    }
    .documentencentrum .actiefolder {
        margin-bottom: 20px;
    }
}




@media (max-width:767px) {
    /* .header2021 .reviews .stars {display:none;} */
    h2.rollerscript, .rollerscript {font-size:30px;}
    .product-intro-faq h1 {font-size:32px;}
    .bottom-footer .col {
        font-size: 8px!important;
        width: 33%;
    }
    .footer .logo {
        margin: 0px!important;
        padding-right: 10px;
    }
    .footer .logo img {
        width: 100%;
        max-width: 200px;
    }
    .usps-header .col:last-of-type {
        display: none;
    }
    .usps-header .col:nth-child(2) span {
        display: none;
    }
    .usps-header .col:nth-child(2) span.mobile {
        display: block;
    }
    .header2021 .menubar {
        padding: 8px 0px 0px 0px;
    }
    .header2021 .menu .btn {
        box-shadow: 0;
        background: #008000;
    }
    .header2021 .menu.sticky {
        padding: 10px 0;
    }
    .header2021 .menu.sticky .btn {
        box-shadow: 0;
        background: #008000;
    }
    .categories-slider .slick-slide .col img {
        max-width: 600px;
        width: 600px;
        max-height: 400px;
        height: 400px;
        object-fit: cover;
    }
    .categories-slider {
        position: relative;
        max-height: 400px;
        overflow: hidden;
        height: 400px;
    }
    .product-slider.slick-slider,
    .projecten-slider.slick-slider {
        max-height: 400px;
        max-width: 450px;
        overflow: hidden;
    }
    /* .header2021 .reviews {display:none;} */
    
    .header2021 .menu.sticky .phone-btn {
        display: none;
    }
    a#toggle_menu {
        float: right;
        box-shadow: unset!important;
        padding: 5px 10px 0 10px!important;
    }
    a#toggle_menu svg {
        font-size: 24px;
    }
    /* .mobile-cta {display:inline-block;} */
    
    .mobile-cta a {
        float: left;
    }
    .mobile-btn {
        display: inline-block;
    }
    .header2021 .mobile-btn {
        float: right;
        margin-bottom: 10px;
    }
    .header2021 .mobile-btn a {
        padding: 0 10px;
    }
    .header .logo {
        padding: 5px 0;
        margin: 0;
    }

    .header2021 .brand img {
        margin: auto;
    }
    .header2021 .mobile-cta span {
        font-size: 10px;
        height: auto;
    }
    .header2021 .mobile-cta .col-md-10 {
        padding-left:0;
        padding-right:0;
    }
    .categories-blocks.nr1 .py-5 {
    	padding-top: 2rem!important;
	}
    .header2021 .mobile-cta a img {
        max-width: 18px;
    }
    .header2021 .mobile-cta {
        width: 80%;
    }
    .header2021 .mobile-cta a {
        width: 41%;
    }
    .header2021 .menu .fw_main_wrapper {
        width: 100%;
    }
    /* .header2021 .menu .fw_main_wrapper ul {border-top: 1px solid #4a4a4a;} */
    
    .header .menu .toggle_submenu {
        background: url('/files/bg-1.png') no-repeat -282px -588px!important;
    }
    .header .menu .fw_subs_wrapper a span {
        color: #fff;
    }
    .header .menu .fw_subs_wrapper a:hover span {
        color: #EE2E25;
    }
    .usps-header .col span {
        font-size: 10px;
    }
    .content-2col .inhoud {
        margin-top: 1rem;
        display: block;
    }
    .content-2col.reversed .inhoud {
        order: 2
    }
    .product-intro-usps {
        padding-top: 30px;
    }
    .product-intro-usps .intro {
        margin-bottom: 1rem;
    }
    .main_slider .bx_text {
        position: relative;
        bottom: 0;
    }
    .main_slider .bx-viewport {
        overflow: unset!important;
        height: unset!important;
    }
    .main_slider .bx_text h2 {
        font-size: 18px!important;
    }
    .footer .block3 .col.col-md-2.col-xs-2 {
        margin-right: 20px;
    }
    .footer .block3 .row {
        margin-bottom: 20px
    }
    section.home-intro-showrooms .inhoud {
        margin-bottom: 10px;
        padding: 0 10px;
    }
    .home-intro-showrooms h2 {
        margin-bottom: 30px;
        font-size: 27px;
        line-height: 1.3;
    }
    a.button, .fw_form_submit_link {
		font-size: 16px;
		padding: 5px 20px;
		border-radius: 15px;
	}
}

@media (max-width:1023px) {
    .header2021 {
        font-size: 12px;
    }
    .header2021 .bel,
    .header2021 .mail {
        padding: 0 5px;
    }
    /* .documentencentrum .card.actiefolder {
        margin-bottom: 20px;
        padding: 20px;
    }
    .documentencentrum .card.magazine {
        padding: 20px;
    } */ 
    .wat-klanten-zeggen .videos iframe {
        margin-bottom: 20px;
    }
    .social {
        display: none;
    }
    
}

@media (max-width:499px) {
    .header2021 .brand img {
        max-width: 60%;
    }
    .header2021 .brand,
    .header2021 .social {
        float: right;
        width: 50%;
    }
    /* .header2021 .mobile-cta img {display:none;} */
    .usps-header .col {
        width: 50%;
    }
    .onmobile.footer-blocks {
        display: none;
    }
    /* .header2021 .menu {width:100%} */
    .footer .col {
        width: auto;
    }
    .wat-klanten-zeggen .referenties {
        min-height: 400px;
        margin-top: 30px;
    }
    #page .container .row {
        padding-left: 5px;
        padding-right: 5px;
    }
    .content,
    .content_home {
        margin: inherit;
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        line-height: 1.5;
    }
    .product-specificaties .cd-accordion-menu table tr td {
        padding: 0;
    }
    .gallery ul {
        width: 100%;
    }
    .gallery ul li {
        max-width: 45%;
        float: left;
        margin-bottom: 10px;
        display: block;
    }
}
@media (max-width:320px) {
	.header2021 .mobile-cta a:last-of-type {display:none;}
}

/*bootstrap 4*/

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col,
.col-auto,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm,
.col-sm-auto,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md,
.col-md-auto,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg,
.col-lg-auto,
.col-xl-1,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl,
.col-xl-auto {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

.col-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
}

.col-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
}

.col-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}

.col-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

.col-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
}

.col-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

.col-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
}

.col-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}

.col-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
}

.col-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
}

.col-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
}

.col-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.d-none {
    display: none !important;
}

.m-0 {
    margin: 0 !important;
}

.mt-0,
.my-0 {
    margin-top: 0 !important;
}

.mr-0,
.mx-0 {
    margin-right: 0 !important;
}

.mb-0,
.my-0 {
    margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
    margin-left: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.mt-1,
.my-1 {
    margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
    margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
    margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
    margin-left: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.mt-2,
.my-2 {
    margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
    margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
    margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
    margin-left: 0.5rem !important;
}

.m-3 {
    margin: 1rem !important;
}

.mt-3,
.my-3 {
    margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
    margin-right: 1rem !important;
}

.mb-3,
.my-3 {
    margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
    margin-left: 1rem !important;
}

.m-4 {
    margin: 1.5rem !important;
}

.mt-4,
.my-4 {
    margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
    margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
    margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
    margin-left: 1.5rem !important;
}

.m-5 {
    margin: 3rem !important;
}

.mt-5,
.my-5 {
    margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
    margin-right: 3rem !important;
}

.mb-5,
.my-5 {
    margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
    margin-left: 3rem !important;
}

.p-0 {
    padding: 0 !important;
}

.pt-0,
.py-0 {
    padding-top: 0 !important;
}

.pr-0,
.px-0 {
    padding-right: 0 !important;
}

.pb-0,
.py-0 {
    padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
    padding-left: 0 !important;
}

.p-1 {
    padding: 0.25rem !important;
}

.pt-1,
.py-1 {
    padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
    padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
    padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
    padding-left: 0.25rem !important;
}

.p-2 {
    padding: 0.5rem !important;
}

.pt-2,
.py-2 {
    padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
    padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
    padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
    padding-left: 0.5rem !important;
}

.p-3 {
    padding: 1rem !important;
}

.pt-3,
.py-3 {
    padding-top: 1rem !important;
}

.pr-3,
.px-3 {
    padding-right: 1rem !important;
}

.pb-3,
.py-3 {
    padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
    padding-left: 1rem !important;
}

.p-4 {
    padding: 1.5rem !important;
}

.pt-4,
.py-4 {
    padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
    padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
    padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
    padding-left: 1.5rem !important;
}

.p-5 {
    padding: 3rem !important;
}

.pt-5,
.py-5 {
    padding-top: 3rem !important;
}

.pr-5,
.px-5 {
    padding-right: 3rem !important;
}

.pb-5,
.py-5 {
    padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
    padding-left: 3rem !important;
}

.m-n1 {
    margin: -0.25rem !important;
}

.mt-n1,
.my-n1 {
    margin-top: -0.25rem !important;
}

.mr-n1,
.mx-n1 {
    margin-right: -0.25rem !important;
}

.mb-n1,
.my-n1 {
    margin-bottom: -0.25rem !important;
}

.ml-n1,
.mx-n1 {
    margin-left: -0.25rem !important;
}

.m-n2 {
    margin: -0.5rem !important;
}

.mt-n2,
.my-n2 {
    margin-top: -0.5rem !important;
}

.mr-n2,
.mx-n2 {
    margin-right: -0.5rem !important;
}

.mb-n2,
.my-n2 {
    margin-bottom: -0.5rem !important;
}

.ml-n2,
.mx-n2 {
    margin-left: -0.5rem !important;
}

.m-n3 {
    margin: -1rem !important;
}

.mt-n3,
.my-n3 {
    margin-top: -1rem !important;
}

.mr-n3,
.mx-n3 {
    margin-right: -1rem !important;
}

.mb-n3,
.my-n3 {
    margin-bottom: -1rem !important;
}

.ml-n3,
.mx-n3 {
    margin-left: -1rem !important;
}

.m-n4 {
    margin: -1.5rem !important;
}

.mt-n4,
.my-n4 {
    margin-top: -1.5rem !important;
}

.mr-n4,
.mx-n4 {
    margin-right: -1.5rem !important;
}

.mb-n4,
.my-n4 {
    margin-bottom: -1.5rem !important;
}

.ml-n4,
.mx-n4 {
    margin-left: -1.5rem !important;
}

.m-n5 {
    margin: -3rem !important;
}

.mt-n5,
.my-n5 {
    margin-top: -3rem !important;
}

.mr-n5,
.mx-n5 {
    margin-right: -3rem !important;
}

.mb-n5,
.my-n5 {
    margin-bottom: -3rem !important;
}

.ml-n5,
.mx-n5 {
    margin-left: -3rem !important;
}

.m-auto {
    margin: auto !important;
}

.mt-auto,
.my-auto {
    margin-top: auto !important;
}

.mr-auto,
.mx-auto {
    margin-right: auto !important;
}

.mb-auto,
.my-auto {
    margin-bottom: auto !important;
}

.ml-auto,
.mx-auto {
    margin-left: auto !important;
}

.offset-1 {
    margin-left: 8.333333%;
}

.offset-2 {
    margin-left: 16.666667%;
}

.offset-3 {
    margin-left: 25%;
}

.offset-4 {
    margin-left: 33.333333%;
}

.offset-5 {
    margin-left: 41.666667%;
}

.offset-6 {
    margin-left: 50%;
}

.offset-7 {
    margin-left: 58.333333%;
}

.offset-8 {
    margin-left: 66.666667%;
}

.offset-9 {
    margin-left: 75%;
}

.offset-10 {
    margin-left: 83.333333%;
}

.offset-11 {
    margin-left: 91.666667%;
}

.h-100 {
    height: 100% !important;
}

.card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
}
.center {
    text-align: center;
}

/* bootstrap-sm */

@media (min-width: 576px) {
    .d-sm-none {
        display: none !important;
    }
    .col-sm {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }
    .col-sm-auto {
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }
    .col-sm-1 {
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%;
    }
    .col-sm-2 {
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
    .col-sm-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
    .col-sm-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    .col-sm-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
    .col-sm-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .col-sm-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }
    .col-sm-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }
    .col-sm-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }
    .col-sm-10 {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }
    .col-sm-11 {
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%;
    }
    .col-sm-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .m-sm-0 {
        margin: 0 !important;
    }
    .mt-sm-0,
    .my-sm-0 {
        margin-top: 0 !important;
    }
    .mr-sm-0,
    .mx-sm-0 {
        margin-right: 0 !important;
    }
    .mb-sm-0,
    .my-sm-0 {
        margin-bottom: 0 !important;
    }
    .ml-sm-0,
    .mx-sm-0 {
        margin-left: 0 !important;
    }
    .m-sm-1 {
        margin: 0.25rem !important;
    }
    .mt-sm-1,
    .my-sm-1 {
        margin-top: 0.25rem !important;
    }
    .mr-sm-1,
    .mx-sm-1 {
        margin-right: 0.25rem !important;
    }
    .mb-sm-1,
    .my-sm-1 {
        margin-bottom: 0.25rem !important;
    }
    .ml-sm-1,
    .mx-sm-1 {
        margin-left: 0.25rem !important;
    }
    .m-sm-2 {
        margin: 0.5rem !important;
    }
    .mt-sm-2,
    .my-sm-2 {
        margin-top: 0.5rem !important;
    }
    .mr-sm-2,
    .mx-sm-2 {
        margin-right: 0.5rem !important;
    }
    .mb-sm-2,
    .my-sm-2 {
        margin-bottom: 0.5rem !important;
    }
    .ml-sm-2,
    .mx-sm-2 {
        margin-left: 0.5rem !important;
    }
    .m-sm-3 {
        margin: 1rem !important;
    }
    .mt-sm-3,
    .my-sm-3 {
        margin-top: 1rem !important;
    }
    .mr-sm-3,
    .mx-sm-3 {
        margin-right: 1rem !important;
    }
    .mb-sm-3,
    .my-sm-3 {
        margin-bottom: 1rem !important;
    }
    .ml-sm-3,
    .mx-sm-3 {
        margin-left: 1rem !important;
    }
    .m-sm-4 {
        margin: 1.5rem !important;
    }
    .mt-sm-4,
    .my-sm-4 {
        margin-top: 1.5rem !important;
    }
    .mr-sm-4,
    .mx-sm-4 {
        margin-right: 1.5rem !important;
    }
    .mb-sm-4,
    .my-sm-4 {
        margin-bottom: 1.5rem !important;
    }
    .ml-sm-4,
    .mx-sm-4 {
        margin-left: 1.5rem !important;
    }
    .m-sm-5 {
        margin: 3rem !important;
    }
    .mt-sm-5,
    .my-sm-5 {
        margin-top: 3rem !important;
    }
    .mr-sm-5,
    .mx-sm-5 {
        margin-right: 3rem !important;
    }
    .mb-sm-5,
    .my-sm-5 {
        margin-bottom: 3rem !important;
    }
    .ml-sm-5,
    .mx-sm-5 {
        margin-left: 3rem !important;
    }
    .p-sm-0 {
        padding: 0 !important;
    }
    .pt-sm-0,
    .py-sm-0 {
        padding-top: 0 !important;
    }
    .pr-sm-0,
    .px-sm-0 {
        padding-right: 0 !important;
    }
    .pb-sm-0,
    .py-sm-0 {
        padding-bottom: 0 !important;
    }
    .pl-sm-0,
    .px-sm-0 {
        padding-left: 0 !important;
    }
    .p-sm-1 {
        padding: 0.25rem !important;
    }
    .pt-sm-1,
    .py-sm-1 {
        padding-top: 0.25rem !important;
    }
    .pr-sm-1,
    .px-sm-1 {
        padding-right: 0.25rem !important;
    }
    .pb-sm-1,
    .py-sm-1 {
        padding-bottom: 0.25rem !important;
    }
    .pl-sm-1,
    .px-sm-1 {
        padding-left: 0.25rem !important;
    }
    .p-sm-2 {
        padding: 0.5rem !important;
    }
    .pt-sm-2,
    .py-sm-2 {
        padding-top: 0.5rem !important;
    }
    .pr-sm-2,
    .px-sm-2 {
        padding-right: 0.5rem !important;
    }
    .pb-sm-2,
    .py-sm-2 {
        padding-bottom: 0.5rem !important;
    }
    .pl-sm-2,
    .px-sm-2 {
        padding-left: 0.5rem !important;
    }
    .p-sm-3 {
        padding: 1rem !important;
    }
    .pt-sm-3,
    .py-sm-3 {
        padding-top: 1rem !important;
    }
    .pr-sm-3,
    .px-sm-3 {
        padding-right: 1rem !important;
    }
    .pb-sm-3,
    .py-sm-3 {
        padding-bottom: 1rem !important;
    }
    .pl-sm-3,
    .px-sm-3 {
        padding-left: 1rem !important;
    }
    .p-sm-4 {
        padding: 1.5rem !important;
    }
    .pt-sm-4,
    .py-sm-4 {
        padding-top: 1.5rem !important;
    }
    .pr-sm-4,
    .px-sm-4 {
        padding-right: 1.5rem !important;
    }
    .pb-sm-4,
    .py-sm-4 {
        padding-bottom: 1.5rem !important;
    }
    .pl-sm-4,
    .px-sm-4 {
        padding-left: 1.5rem !important;
    }
    .p-sm-5 {
        padding: 3rem !important;
    }
    .pt-sm-5,
    .py-sm-5 {
        padding-top: 3rem !important;
    }
    .pr-sm-5,
    .px-sm-5 {
        padding-right: 3rem !important;
    }
    .pb-sm-5,
    .py-sm-5 {
        padding-bottom: 3rem !important;
    }
    .pl-sm-5,
    .px-sm-5 {
        padding-left: 3rem !important;
    }
    .m-sm-n1 {
        margin: -0.25rem !important;
    }
    .mt-sm-n1,
    .my-sm-n1 {
        margin-top: -0.25rem !important;
    }
    .mr-sm-n1,
    .mx-sm-n1 {
        margin-right: -0.25rem !important;
    }
    .mb-sm-n1,
    .my-sm-n1 {
        margin-bottom: -0.25rem !important;
    }
    .ml-sm-n1,
    .mx-sm-n1 {
        margin-left: -0.25rem !important;
    }
    .m-sm-n2 {
        margin: -0.5rem !important;
    }
    .mt-sm-n2,
    .my-sm-n2 {
        margin-top: -0.5rem !important;
    }
    .mr-sm-n2,
    .mx-sm-n2 {
        margin-right: -0.5rem !important;
    }
    .mb-sm-n2,
    .my-sm-n2 {
        margin-bottom: -0.5rem !important;
    }
    .ml-sm-n2,
    .mx-sm-n2 {
        margin-left: -0.5rem !important;
    }
    .m-sm-n3 {
        margin: -1rem !important;
    }
    .mt-sm-n3,
    .my-sm-n3 {
        margin-top: -1rem !important;
    }
    .mr-sm-n3,
    .mx-sm-n3 {
        margin-right: -1rem !important;
    }
    .mb-sm-n3,
    .my-sm-n3 {
        margin-bottom: -1rem !important;
    }
    .ml-sm-n3,
    .mx-sm-n3 {
        margin-left: -1rem !important;
    }
    .m-sm-n4 {
        margin: -1.5rem !important;
    }
    .mt-sm-n4,
    .my-sm-n4 {
        margin-top: -1.5rem !important;
    }
    .mr-sm-n4,
    .mx-sm-n4 {
        margin-right: -1.5rem !important;
    }
    .mb-sm-n4,
    .my-sm-n4 {
        margin-bottom: -1.5rem !important;
    }
    .ml-sm-n4,
    .mx-sm-n4 {
        margin-left: -1.5rem !important;
    }
    .m-sm-n5 {
        margin: -3rem !important;
    }
    .mt-sm-n5,
    .my-sm-n5 {
        margin-top: -3rem !important;
    }
    .mr-sm-n5,
    .mx-sm-n5 {
        margin-right: -3rem !important;
    }
    .mb-sm-n5,
    .my-sm-n5 {
        margin-bottom: -3rem !important;
    }
    .ml-sm-n5,
    .mx-sm-n5 {
        margin-left: -3rem !important;
    }
    .m-sm-auto {
        margin: auto !important;
    }
    .mt-sm-auto,
    .my-sm-auto {
        margin-top: auto !important;
    }
    .mr-sm-auto,
    .mx-sm-auto {
        margin-right: auto !important;
    }
    .mb-sm-auto,
    .my-sm-auto {
        margin-bottom: auto !important;
    }
    .ml-sm-auto,
    .mx-sm-auto {
        margin-left: auto !important;
    }
    .offset-sm-0 {
        margin-left: 0;
    }
    .offset-sm-1 {
        margin-left: 8.333333%;
    }
    .offset-sm-2 {
        margin-left: 16.666667%;
    }
    .offset-sm-3 {
        margin-left: 25%;
    }
    .offset-sm-4 {
        margin-left: 33.333333%;
    }
    .offset-sm-5 {
        margin-left: 41.666667%;
    }
    .offset-sm-6 {
        margin-left: 50%;
    }
    .offset-sm-7 {
        margin-left: 58.333333%;
    }
    .offset-sm-8 {
        margin-left: 66.666667%;
    }
    .offset-sm-9 {
        margin-left: 75%;
    }
    .offset-sm-10 {
        margin-left: 83.333333%;
    }
    .offset-sm-11 {
        margin-left: 91.666667%;
    }
}


/* bootstrap-md */

@media (min-width: 768px) {
    .d-md-none {
        display: none !important;
    }
    .d-md-block {
        display: block !important;
    }
    .col-md {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }
    .col-md-auto {
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }
    .col-md-1 {
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%;
    }
    .col-md-2 {
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
    .col-md-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
    .col-md-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    .col-md-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
    .col-md-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .col-md-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }
    .col-md-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }
    .col-md-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }
    .col-md-10 {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }
    .col-md-11 {
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%;
    }
    .col-md-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .m-md-0 {
        margin: 0 !important;
    }
    .mt-md-0,
    .my-md-0 {
        margin-top: 0 !important;
    }
    .mr-md-0,
    .mx-md-0 {
        margin-right: 0 !important;
    }
    .mb-md-0,
    .my-md-0 {
        margin-bottom: 0 !important;
    }
    .ml-md-0,
    .mx-md-0 {
        margin-left: 0 !important;
    }
    .m-md-1 {
        margin: 0.25rem !important;
    }
    .mt-md-1,
    .my-md-1 {
        margin-top: 0.25rem !important;
    }
    .mr-md-1,
    .mx-md-1 {
        margin-right: 0.25rem !important;
    }
    .mb-md-1,
    .my-md-1 {
        margin-bottom: 0.25rem !important;
    }
    .ml-md-1,
    .mx-md-1 {
        margin-left: 0.25rem !important;
    }
    .m-md-2 {
        margin: 0.5rem !important;
    }
    .mt-md-2,
    .my-md-2 {
        margin-top: 0.5rem !important;
    }
    .mr-md-2,
    .mx-md-2 {
        margin-right: 0.5rem !important;
    }
    .mb-md-2,
    .my-md-2 {
        margin-bottom: 0.5rem !important;
    }
    .ml-md-2,
    .mx-md-2 {
        margin-left: 0.5rem !important;
    }
    .m-md-3 {
        margin: 1rem !important;
    }
    .mt-md-3,
    .my-md-3 {
        margin-top: 1rem !important;
    }
    .mr-md-3,
    .mx-md-3 {
        margin-right: 1rem !important;
    }
    .mb-md-3,
    .my-md-3 {
        margin-bottom: 1rem !important;
    }
    .ml-md-3,
    .mx-md-3 {
        margin-left: 1rem !important;
    }
    .m-md-4 {
        margin: 1.5rem !important;
    }
    .mt-md-4,
    .my-md-4 {
        margin-top: 1.5rem !important;
    }
    .mr-md-4,
    .mx-md-4 {
        margin-right: 1.5rem !important;
    }
    .mb-md-4,
    .my-md-4 {
        margin-bottom: 1.5rem !important;
    }
    .ml-md-4,
    .mx-md-4 {
        margin-left: 1.5rem !important;
    }
    .m-md-5 {
        margin: 3rem !important;
    }
    .mt-md-5,
    .my-md-5 {
        margin-top: 3rem !important;
    }
    .mr-md-5,
    .mx-md-5 {
        margin-right: 3rem !important;
    }
    .mb-md-5,
    .my-md-5 {
        margin-bottom: 3rem !important;
    }
    .ml-md-5,
    .mx-md-5 {
        margin-left: 3rem !important;
    }
    .p-md-0 {
        padding: 0 !important;
    }
    .pt-md-0,
    .py-md-0 {
        padding-top: 0 !important;
    }
    .pr-md-0,
    .px-md-0 {
        padding-right: 0 !important;
    }
    .pb-md-0,
    .py-md-0 {
        padding-bottom: 0 !important;
    }
    .pl-md-0,
    .px-md-0 {
        padding-left: 0 !important;
    }
    .p-md-1 {
        padding: 0.25rem !important;
    }
    .pt-md-1,
    .py-md-1 {
        padding-top: 0.25rem !important;
    }
    .pr-md-1,
    .px-md-1 {
        padding-right: 0.25rem !important;
    }
    .pb-md-1,
    .py-md-1 {
        padding-bottom: 0.25rem !important;
    }
    .pl-md-1,
    .px-md-1 {
        padding-left: 0.25rem !important;
    }
    .p-md-2 {
        padding: 0.5rem !important;
    }
    .pt-md-2,
    .py-md-2 {
        padding-top: 0.5rem !important;
    }
    .pr-md-2,
    .px-md-2 {
        padding-right: 0.5rem !important;
    }
    .pb-md-2,
    .py-md-2 {
        padding-bottom: 0.5rem !important;
    }
    .pl-md-2,
    .px-md-2 {
        padding-left: 0.5rem !important;
    }
    .p-md-3 {
        padding: 1rem !important;
    }
    .pt-md-3,
    .py-md-3 {
        padding-top: 1rem !important;
    }
    .pr-md-3,
    .px-md-3 {
        padding-right: 1rem !important;
    }
    .pb-md-3,
    .py-md-3 {
        padding-bottom: 1rem !important;
    }
    .pl-md-3,
    .px-md-3 {
        padding-left: 1rem !important;
    }
    .p-md-4 {
        padding: 1.5rem !important;
    }
    .pt-md-4,
    .py-md-4 {
        padding-top: 1.5rem !important;
    }
    .pr-md-4,
    .px-md-4 {
        padding-right: 1.5rem !important;
    }
    .pb-md-4,
    .py-md-4 {
        padding-bottom: 1.5rem !important;
    }
    .pl-md-4,
    .px-md-4 {
        padding-left: 1.5rem !important;
    }
    .p-md-5 {
        padding: 3rem !important;
    }
    .pt-md-5,
    .py-md-5 {
        padding-top: 3rem !important;
    }
    .pr-md-5,
    .px-md-5 {
        padding-right: 3rem !important;
    }
    .pb-md-5,
    .py-md-5 {
        padding-bottom: 3rem !important;
    }
    .pl-md-5,
    .px-md-5 {
        padding-left: 3rem !important;
    }
    .m-md-n1 {
        margin: -0.25rem !important;
    }
    .mt-md-n1,
    .my-md-n1 {
        margin-top: -0.25rem !important;
    }
    .mr-md-n1,
    .mx-md-n1 {
        margin-right: -0.25rem !important;
    }
    .mb-md-n1,
    .my-md-n1 {
        margin-bottom: -0.25rem !important;
    }
    .ml-md-n1,
    .mx-md-n1 {
        margin-left: -0.25rem !important;
    }
    .m-md-n2 {
        margin: -0.5rem !important;
    }
    .mt-md-n2,
    .my-md-n2 {
        margin-top: -0.5rem !important;
    }
    .mr-md-n2,
    .mx-md-n2 {
        margin-right: -0.5rem !important;
    }
    .mb-md-n2,
    .my-md-n2 {
        margin-bottom: -0.5rem !important;
    }
    .ml-md-n2,
    .mx-md-n2 {
        margin-left: -0.5rem !important;
    }
    .m-md-n3 {
        margin: -1rem !important;
    }
    .mt-md-n3,
    .my-md-n3 {
        margin-top: -1rem !important;
    }
    .mr-md-n3,
    .mx-md-n3 {
        margin-right: -1rem !important;
    }
    .mb-md-n3,
    .my-md-n3 {
        margin-bottom: -1rem !important;
    }
    .ml-md-n3,
    .mx-md-n3 {
        margin-left: -1rem !important;
    }
    .m-md-n4 {
        margin: -1.5rem !important;
    }
    .mt-md-n4,
    .my-md-n4 {
        margin-top: -1.5rem !important;
    }
    .mr-md-n4,
    .mx-md-n4 {
        margin-right: -1.5rem !important;
    }
    .mb-md-n4,
    .my-md-n4 {
        margin-bottom: -1.5rem !important;
    }
    .ml-md-n4,
    .mx-md-n4 {
        margin-left: -1.5rem !important;
    }
    .m-md-n5 {
        margin: -3rem !important;
    }
    .mt-md-n5,
    .my-md-n5 {
        margin-top: -3rem !important;
    }
    .mr-md-n5,
    .mx-md-n5 {
        margin-right: -3rem !important;
    }
    .mb-md-n5,
    .my-md-n5 {
        margin-bottom: -3rem !important;
    }
    .ml-md-n5,
    .mx-md-n5 {
        margin-left: -3rem !important;
    }
    .m-md-auto {
        margin: auto !important;
    }
    .mt-md-auto,
    .my-md-auto {
        margin-top: auto !important;
    }
    .mr-md-auto,
    .mx-md-auto {
        margin-right: auto !important;
    }
    .mb-md-auto,
    .my-md-auto {
        margin-bottom: auto !important;
    }
    .ml-md-auto,
    .mx-md-auto {
        margin-left: auto !important;
    }
    .offset-md-0 {
        margin-left: 0;
    }
    .offset-md-1 {
        margin-left: 8.333333%;
    }
    .offset-md-2 {
        margin-left: 16.666667%;
    }
    .offset-md-3 {
        margin-left: 25%;
    }
    .offset-md-4 {
        margin-left: 33.333333%;
    }
    .offset-md-5 {
        margin-left: 41.666667%;
    }
    .offset-md-6 {
        margin-left: 50%;
    }
    .offset-md-7 {
        margin-left: 58.333333%;
    }
    .offset-md-8 {
        margin-left: 66.666667%;
    }
    .offset-md-9 {
        margin-left: 75%;
    }
    .offset-md-10 {
        margin-left: 83.333333%;
    }
    .offset-md-11 {
        margin-left: 91.666667%;
    }
}


/* bootstrap-lg */

@media (min-width: 992px) {
    .d-lg-none {
        display: none !important;
    }
    .col-lg {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }
    .col-lg-auto {
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }
    .col-lg-1 {
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%;
    }
    .col-lg-2 {
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
    .col-lg-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
    .col-lg-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    .col-lg-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
    .col-lg-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .col-lg-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }
    .col-lg-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }
    .col-lg-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }
    .col-lg-10 {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }
    .col-lg-11 {
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%;
    }
    .col-lg-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .m-lg-0 {
        margin: 0 !important;
    }
    .mt-lg-0,
    .my-lg-0 {
        margin-top: 0 !important;
    }
    .mr-lg-0,
    .mx-lg-0 {
        margin-right: 0 !important;
    }
    .mb-lg-0,
    .my-lg-0 {
        margin-bottom: 0 !important;
    }
    .ml-lg-0,
    .mx-lg-0 {
        margin-left: 0 !important;
    }
    .m-lg-1 {
        margin: 0.25rem !important;
    }
    .mt-lg-1,
    .my-lg-1 {
        margin-top: 0.25rem !important;
    }
    .mr-lg-1,
    .mx-lg-1 {
        margin-right: 0.25rem !important;
    }
    .mb-lg-1,
    .my-lg-1 {
        margin-bottom: 0.25rem !important;
    }
    .ml-lg-1,
    .mx-lg-1 {
        margin-left: 0.25rem !important;
    }
    .m-lg-2 {
        margin: 0.5rem !important;
    }
    .mt-lg-2,
    .my-lg-2 {
        margin-top: 0.5rem !important;
    }
    .mr-lg-2,
    .mx-lg-2 {
        margin-right: 0.5rem !important;
    }
    .mb-lg-2,
    .my-lg-2 {
        margin-bottom: 0.5rem !important;
    }
    .ml-lg-2,
    .mx-lg-2 {
        margin-left: 0.5rem !important;
    }
    .m-lg-3 {
        margin: 1rem !important;
    }
    .mt-lg-3,
    .my-lg-3 {
        margin-top: 1rem !important;
    }
    .mr-lg-3,
    .mx-lg-3 {
        margin-right: 1rem !important;
    }
    .mb-lg-3,
    .my-lg-3 {
        margin-bottom: 1rem !important;
    }
    .ml-lg-3,
    .mx-lg-3 {
        margin-left: 1rem !important;
    }
    .m-lg-4 {
        margin: 1.5rem !important;
    }
    .mt-lg-4,
    .my-lg-4 {
        margin-top: 1.5rem !important;
    }
    .mr-lg-4,
    .mx-lg-4 {
        margin-right: 1.5rem !important;
    }
    .mb-lg-4,
    .my-lg-4 {
        margin-bottom: 1.5rem !important;
    }
    .ml-lg-4,
    .mx-lg-4 {
        margin-left: 1.5rem !important;
    }
    .m-lg-5 {
        margin: 3rem !important;
    }
    .mt-lg-5,
    .my-lg-5 {
        margin-top: 3rem !important;
    }
    .mr-lg-5,
    .mx-lg-5 {
        margin-right: 3rem !important;
    }
    .mb-lg-5,
    .my-lg-5 {
        margin-bottom: 3rem !important;
    }
    .ml-lg-5,
    .mx-lg-5 {
        margin-left: 3rem !important;
    }
    .p-lg-0 {
        padding: 0 !important;
    }
    .pt-lg-0,
    .py-lg-0 {
        padding-top: 0 !important;
    }
    .pr-lg-0,
    .px-lg-0 {
        padding-right: 0 !important;
    }
    .pb-lg-0,
    .py-lg-0 {
        padding-bottom: 0 !important;
    }
    .pl-lg-0,
    .px-lg-0 {
        padding-left: 0 !important;
    }
    .p-lg-1 {
        padding: 0.25rem !important;
    }
    .pt-lg-1,
    .py-lg-1 {
        padding-top: 0.25rem !important;
    }
    .pr-lg-1,
    .px-lg-1 {
        padding-right: 0.25rem !important;
    }
    .pb-lg-1,
    .py-lg-1 {
        padding-bottom: 0.25rem !important;
    }
    .pl-lg-1,
    .px-lg-1 {
        padding-left: 0.25rem !important;
    }
    .p-lg-2 {
        padding: 0.5rem !important;
    }
    .pt-lg-2,
    .py-lg-2 {
        padding-top: 0.5rem !important;
    }
    .pr-lg-2,
    .px-lg-2 {
        padding-right: 0.5rem !important;
    }
    .pb-lg-2,
    .py-lg-2 {
        padding-bottom: 0.5rem !important;
    }
    .pl-lg-2,
    .px-lg-2 {
        padding-left: 0.5rem !important;
    }
    .p-lg-3 {
        padding: 1rem !important;
    }
    .pt-lg-3,
    .py-lg-3 {
        padding-top: 1rem !important;
    }
    .pr-lg-3,
    .px-lg-3 {
        padding-right: 1rem !important;
    }
    .pb-lg-3,
    .py-lg-3 {
        padding-bottom: 1rem !important;
    }
    .pl-lg-3,
    .px-lg-3 {
        padding-left: 1rem !important;
    }
    .p-lg-4 {
        padding: 1.5rem !important;
    }
    .pt-lg-4,
    .py-lg-4 {
        padding-top: 1.5rem !important;
    }
    .pr-lg-4,
    .px-lg-4 {
        padding-right: 1.5rem !important;
    }
    .pb-lg-4,
    .py-lg-4 {
        padding-bottom: 1.5rem !important;
    }
    .pl-lg-4,
    .px-lg-4 {
        padding-left: 1.5rem !important;
    }
    .p-lg-5 {
        padding: 3rem !important;
    }
    .pt-lg-5,
    .py-lg-5 {
        padding-top: 3rem !important;
    }
    .pr-lg-5,
    .px-lg-5 {
        padding-right: 3rem !important;
    }
    .pb-lg-5,
    .py-lg-5 {
        padding-bottom: 3rem !important;
    }
    .pl-lg-5,
    .px-lg-5 {
        padding-left: 3rem !important;
    }
    .m-lg-n1 {
        margin: -0.25rem !important;
    }
    .mt-lg-n1,
    .my-lg-n1 {
        margin-top: -0.25rem !important;
    }
    .mr-lg-n1,
    .mx-lg-n1 {
        margin-right: -0.25rem !important;
    }
    .mb-lg-n1,
    .my-lg-n1 {
        margin-bottom: -0.25rem !important;
    }
    .ml-lg-n1,
    .mx-lg-n1 {
        margin-left: -0.25rem !important;
    }
    .m-lg-n2 {
        margin: -0.5rem !important;
    }
    .mt-lg-n2,
    .my-lg-n2 {
        margin-top: -0.5rem !important;
    }
    .mr-lg-n2,
    .mx-lg-n2 {
        margin-right: -0.5rem !important;
    }
    .mb-lg-n2,
    .my-lg-n2 {
        margin-bottom: -0.5rem !important;
    }
    .ml-lg-n2,
    .mx-lg-n2 {
        margin-left: -0.5rem !important;
    }
    .m-lg-n3 {
        margin: -1rem !important;
    }
    .mt-lg-n3,
    .my-lg-n3 {
        margin-top: -1rem !important;
    }
    .mr-lg-n3,
    .mx-lg-n3 {
        margin-right: -1rem !important;
    }
    .mb-lg-n3,
    .my-lg-n3 {
        margin-bottom: -1rem !important;
    }
    .ml-lg-n3,
    .mx-lg-n3 {
        margin-left: -1rem !important;
    }
    .m-lg-n4 {
        margin: -1.5rem !important;
    }
    .mt-lg-n4,
    .my-lg-n4 {
        margin-top: -1.5rem !important;
    }
    .mr-lg-n4,
    .mx-lg-n4 {
        margin-right: -1.5rem !important;
    }
    .mb-lg-n4,
    .my-lg-n4 {
        margin-bottom: -1.5rem !important;
    }
    .ml-lg-n4,
    .mx-lg-n4 {
        margin-left: -1.5rem !important;
    }
    .m-lg-n5 {
        margin: -3rem !important;
    }
    .mt-lg-n5,
    .my-lg-n5 {
        margin-top: -3rem !important;
    }
    .mr-lg-n5,
    .mx-lg-n5 {
        margin-right: -3rem !important;
    }
    .mb-lg-n5,
    .my-lg-n5 {
        margin-bottom: -3rem !important;
    }
    .ml-lg-n5,
    .mx-lg-n5 {
        margin-left: -3rem !important;
    }
    .m-lg-auto {
        margin: auto !important;
    }
    .mt-lg-auto,
    .my-lg-auto {
        margin-top: auto !important;
    }
    .mr-lg-auto,
    .mx-lg-auto {
        margin-right: auto !important;
    }
    .mb-lg-auto,
    .my-lg-auto {
        margin-bottom: auto !important;
    }
    .ml-lg-auto,
    .mx-lg-auto {
        margin-left: auto !important;
    }
    .offset-lg-0 {
        margin-left: 0;
    }
    .offset-lg-1 {
        margin-left: 8.333333%;
    }
    .offset-lg-2 {
        margin-left: 16.666667%;
    }
    .offset-lg-3 {
        margin-left: 25%;
    }
    .offset-lg-4 {
        margin-left: 33.333333%;
    }
    .offset-lg-5 {
        margin-left: 41.666667%;
    }
    .offset-lg-6 {
        margin-left: 50%;
    }
    .offset-lg-7 {
        margin-left: 58.333333%;
    }
    .offset-lg-8 {
        margin-left: 66.666667%;
    }
    .offset-lg-9 {
        margin-left: 75%;
    }
    .offset-lg-10 {
        margin-left: 83.333333%;
    }
    .offset-lg-11 {
        margin-left: 91.666667%;
    }
}


/* bootstrap-xl */

@media (min-width: 1200px) {
    .d-xl-none {
        display: none !important;
    }
    .col-xl {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }
    .col-xl-auto {
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }
    .col-xl-1 {
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%;
    }
    .col-xl-2 {
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
    .col-xl-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
    .col-xl-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    .col-xl-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
    .col-xl-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .col-xl-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }
    .col-xl-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }
    .col-xl-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }
    .col-xl-10 {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }
    .col-xl-11 {
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%;
    }
    .col-xl-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .m-xl-0 {
        margin: 0 !important;
    }
    .mt-xl-0,
    .my-xl-0 {
        margin-top: 0 !important;
    }
    .mr-xl-0,
    .mx-xl-0 {
        margin-right: 0 !important;
    }
    .mb-xl-0,
    .my-xl-0 {
        margin-bottom: 0 !important;
    }
    .ml-xl-0,
    .mx-xl-0 {
        margin-left: 0 !important;
    }
    .m-xl-1 {
        margin: 0.25rem !important;
    }
    .mt-xl-1,
    .my-xl-1 {
        margin-top: 0.25rem !important;
    }
    .mr-xl-1,
    .mx-xl-1 {
        margin-right: 0.25rem !important;
    }
    .mb-xl-1,
    .my-xl-1 {
        margin-bottom: 0.25rem !important;
    }
    .ml-xl-1,
    .mx-xl-1 {
        margin-left: 0.25rem !important;
    }
    .m-xl-2 {
        margin: 0.5rem !important;
    }
    .mt-xl-2,
    .my-xl-2 {
        margin-top: 0.5rem !important;
    }
    .mr-xl-2,
    .mx-xl-2 {
        margin-right: 0.5rem !important;
    }
    .mb-xl-2,
    .my-xl-2 {
        margin-bottom: 0.5rem !important;
    }
    .ml-xl-2,
    .mx-xl-2 {
        margin-left: 0.5rem !important;
    }
    .m-xl-3 {
        margin: 1rem !important;
    }
    .mt-xl-3,
    .my-xl-3 {
        margin-top: 1rem !important;
    }
    .mr-xl-3,
    .mx-xl-3 {
        margin-right: 1rem !important;
    }
    .mb-xl-3,
    .my-xl-3 {
        margin-bottom: 1rem !important;
    }
    .ml-xl-3,
    .mx-xl-3 {
        margin-left: 1rem !important;
    }
    .m-xl-4 {
        margin: 1.5rem !important;
    }
    .mt-xl-4,
    .my-xl-4 {
        margin-top: 1.5rem !important;
    }
    .mr-xl-4,
    .mx-xl-4 {
        margin-right: 1.5rem !important;
    }
    .mb-xl-4,
    .my-xl-4 {
        margin-bottom: 1.5rem !important;
    }
    .ml-xl-4,
    .mx-xl-4 {
        margin-left: 1.5rem !important;
    }
    .m-xl-5 {
        margin: 3rem !important;
    }
    .mt-xl-5,
    .my-xl-5 {
        margin-top: 3rem !important;
    }
    .mr-xl-5,
    .mx-xl-5 {
        margin-right: 3rem !important;
    }
    .mb-xl-5,
    .my-xl-5 {
        margin-bottom: 3rem !important;
    }
    .ml-xl-5,
    .mx-xl-5 {
        margin-left: 3rem !important;
    }
    .p-xl-0 {
        padding: 0 !important;
    }
    .pt-xl-0,
    .py-xl-0 {
        padding-top: 0 !important;
    }
    .pr-xl-0,
    .px-xl-0 {
        padding-right: 0 !important;
    }
    .pb-xl-0,
    .py-xl-0 {
        padding-bottom: 0 !important;
    }
    .pl-xl-0,
    .px-xl-0 {
        padding-left: 0 !important;
    }
    .p-xl-1 {
        padding: 0.25rem !important;
    }
    .pt-xl-1,
    .py-xl-1 {
        padding-top: 0.25rem !important;
    }
    .pr-xl-1,
    .px-xl-1 {
        padding-right: 0.25rem !important;
    }
    .pb-xl-1,
    .py-xl-1 {
        padding-bottom: 0.25rem !important;
    }
    .pl-xl-1,
    .px-xl-1 {
        padding-left: 0.25rem !important;
    }
    .p-xl-2 {
        padding: 0.5rem !important;
    }
    .pt-xl-2,
    .py-xl-2 {
        padding-top: 0.5rem !important;
    }
    .pr-xl-2,
    .px-xl-2 {
        padding-right: 0.5rem !important;
    }
    .pb-xl-2,
    .py-xl-2 {
        padding-bottom: 0.5rem !important;
    }
    .pl-xl-2,
    .px-xl-2 {
        padding-left: 0.5rem !important;
    }
    .p-xl-3 {
        padding: 1rem !important;
    }
    .pt-xl-3,
    .py-xl-3 {
        padding-top: 1rem !important;
    }
    .pr-xl-3,
    .px-xl-3 {
        padding-right: 1rem !important;
    }
    .pb-xl-3,
    .py-xl-3 {
        padding-bottom: 1rem !important;
    }
    .pl-xl-3,
    .px-xl-3 {
        padding-left: 1rem !important;
    }
    .p-xl-4 {
        padding: 1.5rem !important;
    }
    .pt-xl-4,
    .py-xl-4 {
        padding-top: 1.5rem !important;
    }
    .pr-xl-4,
    .px-xl-4 {
        padding-right: 1.5rem !important;
    }
    .pb-xl-4,
    .py-xl-4 {
        padding-bottom: 1.5rem !important;
    }
    .pl-xl-4,
    .px-xl-4 {
        padding-left: 1.5rem !important;
    }
    .p-xl-5 {
        padding: 3rem !important;
    }
    .pt-xl-5,
    .py-xl-5 {
        padding-top: 3rem !important;
    }
    .pr-xl-5,
    .px-xl-5 {
        padding-right: 3rem !important;
    }
    .pb-xl-5,
    .py-xl-5 {
        padding-bottom: 3rem !important;
    }
    .pl-xl-5,
    .px-xl-5 {
        padding-left: 3rem !important;
    }
    .m-xl-n1 {
        margin: -0.25rem !important;
    }
    .mt-xl-n1,
    .my-xl-n1 {
        margin-top: -0.25rem !important;
    }
    .mr-xl-n1,
    .mx-xl-n1 {
        margin-right: -0.25rem !important;
    }
    .mb-xl-n1,
    .my-xl-n1 {
        margin-bottom: -0.25rem !important;
    }
    .ml-xl-n1,
    .mx-xl-n1 {
        margin-left: -0.25rem !important;
    }
    .m-xl-n2 {
        margin: -0.5rem !important;
    }
    .mt-xl-n2,
    .my-xl-n2 {
        margin-top: -0.5rem !important;
    }
    .mr-xl-n2,
    .mx-xl-n2 {
        margin-right: -0.5rem !important;
    }
    .mb-xl-n2,
    .my-xl-n2 {
        margin-bottom: -0.5rem !important;
    }
    .ml-xl-n2,
    .mx-xl-n2 {
        margin-left: -0.5rem !important;
    }
    .m-xl-n3 {
        margin: -1rem !important;
    }
    .mt-xl-n3,
    .my-xl-n3 {
        margin-top: -1rem !important;
    }
    .mr-xl-n3,
    .mx-xl-n3 {
        margin-right: -1rem !important;
    }
    .mb-xl-n3,
    .my-xl-n3 {
        margin-bottom: -1rem !important;
    }
    .ml-xl-n3,
    .mx-xl-n3 {
        margin-left: -1rem !important;
    }
    .m-xl-n4 {
        margin: -1.5rem !important;
    }
    .mt-xl-n4,
    .my-xl-n4 {
        margin-top: -1.5rem !important;
    }
    .mr-xl-n4,
    .mx-xl-n4 {
        margin-right: -1.5rem !important;
    }
    .mb-xl-n4,
    .my-xl-n4 {
        margin-bottom: -1.5rem !important;
    }
    .ml-xl-n4,
    .mx-xl-n4 {
        margin-left: -1.5rem !important;
    }
    .m-xl-n5 {
        margin: -3rem !important;
    }
    .mt-xl-n5,
    .my-xl-n5 {
        margin-top: -3rem !important;
    }
    .mr-xl-n5,
    .mx-xl-n5 {
        margin-right: -3rem !important;
    }
    .mb-xl-n5,
    .my-xl-n5 {
        margin-bottom: -3rem !important;
    }
    .ml-xl-n5,
    .mx-xl-n5 {
        margin-left: -3rem !important;
    }
    .m-xl-auto {
        margin: auto !important;
    }
    .mt-xl-auto,
    .my-xl-auto {
        margin-top: auto !important;
    }
    .mr-xl-auto,
    .mx-xl-auto {
        margin-right: auto !important;
    }
    .mb-xl-auto,
    .my-xl-auto {
        margin-bottom: auto !important;
    }
    .ml-xl-auto,
    .mx-xl-auto {
        margin-left: auto !important;
    }
    .offset-xl-0 {
        margin-left: 0;
    }
    .offset-xl-1 {
        margin-left: 8.333333%;
    }
    .offset-xl-2 {
        margin-left: 16.666667%;
    }
    .offset-xl-3 {
        margin-left: 25%;
    }
    .offset-xl-4 {
        margin-left: 33.333333%;
    }
    .offset-xl-5 {
        margin-left: 41.666667%;
    }
    .offset-xl-6 {
        margin-left: 50%;
    }
    .offset-xl-7 {
        margin-left: 58.333333%;
    }
    .offset-xl-8 {
        margin-left: 66.666667%;
    }
    .offset-xl-9 {
        margin-left: 75%;
    }
    .offset-xl-10 {
        margin-left: 83.333333%;
    }
    .offset-xl-11 {
        margin-left: 91.666667%;
    }
}

.text-white {
    color: #fff !important;
}

.justify-content-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
}

.justify-content-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
}

.justify-content-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

.justify-content-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.justify-content-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
}

.d-flex {
    display: -ms-flexbox !important;
    display: flex !important;
}

.align-items-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
}

.align-items-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
}

.align-items-center {
    -ms-flex-align: center !important;
    align-items: center !important;
}

.align-items-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
}

.align-items-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
}

.align-content-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
}

.align-content-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
}

.align-content-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
}

.align-content-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
}

.align-content-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
}

.align-content-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
}

.align-self-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
}

.align-self-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
}

.align-self-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
}

.align-self-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
}

.align-self-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
}

.align-self-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
}

@media (min-width: 768px) {
    .d-md-inline-block {
        display: inline-block !important;
    }
}

.row {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
}

.relative {
    position: relative;
}

.container {
    background: transparent;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}


/*font awesome*/

.header.header2021 .fa-phone-alt,
.header.header2021 .fa-at {
    color: #008000;
    font-size: 2.5em;
    margin-top: 5px;
}

.usps-header .fa-check-circle {
    color: #00C600;
    font-size: 1.2em;
}


/*categories section*/

.categories-blocks {
    margin-top: 0.5rem;
}

.categories-blocks a h2 {
    color: white;
    position: absolute;
    bottom: .25em;
    font-size: 1em;
    left: 1em;
    z-index: 5;
}

.product-blocks a {
    position: relative;
    display: inline-block;
}

.product-blocks a:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50%;
    display: inline-block;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 1)), color-stop(50%, rgba(0, 0, 0, 0)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
    /* W3C */
}

.product-blocks img {
    max-width: 100%;
    height: auto;
}

.product-blocks {
    box-sizing: border-box;
    position: relative;
    width: 100%;
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

@media (min-width: 768px) {
    .product-blocks {
        box-sizing: border-box;
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    .usps-header .col-sm-4 {
        position: relative;
        width: 100%;
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
}

@media (max-width: 767px) {
    .hide-mobile {
        display: none!important;
    }
    .footer {
        padding: 15px 10px;
    }
    .footer .row .col .block {
        margin: 0;
    }
    .documentencentrum {
        text-align: center
    }
}

@media (min-width: 992px) {
    .product-blocks {
        box-sizing: border-box;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (max-width: 1279px) {
    .header2021 .reviews {
        display: none;
    }
    a.home-btn {
        padding-left: 0!important;
        color: #008000 !important;
    }
    .header2021 .menu .home-btn {
        background: none !important;
    }
}

.icon-white {
    color: #fff;
}

.icon-green {
    color: #008000 !important;
}

.footer .icon-green,
.footer .icon-white {
    font-size: 2.5em;
}

.footer .icon-green a,
.footer .icon-white a {
    padding-right: 10px;
}

.footer .block h4 {
    margin-top: 1em;
}


/*----- video-grid home -----*/

.grid-iframe {
    display: grid;
    grid-template-columns: auto auto;
    /*voor 2 kolommen*/
    grid-gap: 1rem;
}

.grid-iframe>div {
    background: #000;
    padding: 0;
    display: grid;
}

.grid-iframe>div::before {
    content: "";
    padding-bottom: 100%;
    display: block;
}

.grid-iframe>div::before,
.grid-iframe>div>iframe {
    grid-area: 1 / 1 / 2 / 2;
}

.grid-iframe>div>iframe {
    width: 100%;
    height: 100%;
    object-fit: contain;
}


/*-----*/

/* @media (max-width:1023px) {
    .referenties {
        margin-top: 3em;
    }
} */

@media (max-width: 991px) {
    .testing3 {
        width: unset!important;
    }
}

@media (min-width: 1200px) {
    .footer a.button {
        padding: 10px 15px;
    }
}

@media (max-width: 767px) {
    .footer {
        padding-bottom: 150px;
    }
    .brand {
        justify-content: center !important;
        display: flex !important;
    }
    .footer a.button {
        display: none;
    }
}

@media (min-width:1280px) {
    .social {
        display: inline-block!important;
    }
}

.red {
    color: #EE2E25;
}

/* formulieren */
#keuze-image, #kleur-image, #dakbedekking-image, #zonwering-image {
	display: none;
}


/* image-cards */
.image-cards-3col .img-wrapper {
	width: 100%;
	z-index: 10;
}

.image-cards-3col .img {
	width: 100%;
}

.image-cards-3col .img a {
	bottom: 0;
	display: block;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

.image-cards-3col .card-content {
	overflow: visible !important;
	z-index: 20;
}

.image-cards-3col.nr1 {
	background-color: #fff;
	padding: 30px 0 30px;
}

.image-cards-3col.nr1 .block-container {
	min-width: 0;
}

.image-cards-3col.nr1 .row {
	padding: calc(20px);
}

.image-cards-3col.nr1 .card {
	padding: 10px;
}

.image-cards-3col.nr1 .card .card-inner {
	background-color: #e86505;
	border: none;
}

.image-cards-3col.nr1 .card .card-content {
	padding: 10px 30px 10px;
}

.image-cards-3col.nr1 .img {
	padding-top: 100%;
}

.image-cards-3col.nr1 .title {
	margin-bottom: 6px;
}

.image-cards-3col.nr1 .title h2 {
	color: #000;
	/* font-family: "Trebuchet MS", Helvetica, sans-serif; */
    font-family: 'Open Sans', sans-serif;
	font-size: 24px;
	font-weight: 800;
	line-height: 120%;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}

.image-cards-3col.nr1 .text {
	color: #000;
	/* font-family: "Trebuchet MS", Helvetica, sans-serif; */
    font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 160%;
	text-align: center;
	text-decoration: none;
	text-transform: none;
}

.image-cards-3col.nr2 {
	background-color: #e8e8e8;
	padding: 70pxp 0 70px;
}

.image-cards-3col.nr2 .block-container {
	min-width: 0;
}

.image-cards-3col.nr2 .row {
	padding: calc(20px);
}

.image-cards-3col.nr2 .card {
	padding: 10px;
}

.image-cards-3col.nr2 .card .card-inner {
	background-color: #ffffff;
	border: none;
}

.image-cards-3col.nr2 .card .card-content {
	padding: 60px 30px 40px;
}

.image-cards-3col.nr2 .img {
	padding-top: 100%;
}

.image-cards-3col.nr2 .title {
	margin-bottom: 6px;
}

.image-cards-3col.nr2 .title h2 {
	color: #454545;
	/* font-family: "Trebuchet MS", Helvetica, sans-serif; */
    font-family: 'Open Sans', sans-serif;
	font-size: 24px;
	font-weight: 800;
	line-height: 120%;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}

.image-cards-3col.nr2 .text {
	color: #000;
	/* font-family: "Trebuchet MS", Helvetica, sans-serif; */
    font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 160%;
	text-align: center;
	text-decoration: none;
	text-transform: none;
}
.card-content .text.content {
    margin: 0;
}
.card-content {
    padding-top: 15px;
}
ul.check {
    display: block;
    list-style-type: none;
    padding: 0;
}
ul.check li {
    display: block;
    margin: 0;
    padding: 0 0 0 30px;
    position: relative;
}

ul.check li:before {
    background-color: transparent;
    background-image: url(../files/check.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 15px;
    content: '';
    height: 15px;
    left: 0;
    position: absolute;
    top: 6px;
    width: 24px;
    -webkit-background-size: 15px;
}
ul.check li::marker {
    display: none;
}

/*** Werkwijze ***/
/* niet op de pagina Werkwijze zelf */
#page.id-461 .werkwijze {
    display: none;
}
/* // */

.werkwijze {
	padding: 80px 30px;
}

.werkwijze .container {
    padding: 30px 0;
    border: 1px solid #008000;
    border-radius: 30px;
    background-color: #fff;
}

.werkwijze .container .row {
    padding: 5px!important;
}

.werkwijze h2 {
    font-size: 28px;
}

.werkwijze .stap {
    margin-top: 3rem;

}
.werkwijze .stap h3,
.werkwijze .stap .text {
    z-index: 1;
    position: relative;
}

.werkwijze .stap h3 {
    font-weight: 600;
}

.werkwijze .stap:before {
    font-family: 'Open Sans', sans-serif;
    font-size: 6rem;
    line-height: 0.3;
    position: absolute;
    left: -6px;
    font-variant-numeric: lining-nums;
    color: #00800050;
    font-weight: 600;
}
.werkwijze .row > .stap:nth-of-type(1):before {
	content: '1';
	/* left: -3px; */
}

.werkwijze .row > .stap:nth-of-type(2):before {
	content: '2';
}

.werkwijze .row > .stap:nth-of-type(3):before {
	content: '3';
}

.werkwijze .row > .stap:nth-of-type(4):before {
	content: '4';
}

.werkwijze .row > .stap:nth-of-type(5):before {
	content: '5';
}

.werkwijze .row > .stap:nth-of-type(6) {
    padding: 0;
}

.werkwijze .row > .stap:nth-of-type(6) h3 {
	display: none;
}

.werkwijze .row > .stap:nth-of-type(6) .text {
	height: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.werkwijze .row > .stap:nth-of-type(6) .text .fw_button:last-child {
	margin-bottom: 0;
}

@media only screen and (min-width: 768px) {
    .werkwijze {
        padding: 80px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1279px) {
	.werkwijze .row > .stap h3 {
		font-size: 2rem;
	}
}

@media only screen and (min-width: 1024px) {
	.werkwijze .row > .stap {
		padding-right: 80px;
	}
}

@media only screen and (min-width: 1200px) {
    .werkwijze .row > .stap:nth-of-type(6) .text {
        justify-content: flex-start;
    }
}


@media (max-width:767px) {
a.cookiebtn {
	    background: #008000;
	    width: 30px;
	    height: 30px;
	    display: block;
	    border-radius: 50%;
    	position: fixed;
	    bottom: 70px;
	    z-index: 990;
	    left: 25px;
	    text-align:center;
	}
	
	a.cookiebtn svg {
	    color: #fff;
	    width: 16px;
	    margin: auto;
	}
}


@media (min-width:768px) {
a.cookiebtn {
	    background: #008000;
	    width: 44px;
	    height: 44px;
	    display: block;
	    border-radius: 50%;
    	position: fixed;
	    bottom: 50px;
	    z-index: 990;
	    left: 25px;
	    text-align:center;
	}
	
	a.cookiebtn svg {
	    color: #fff;
	    width: 20px;
	    margin: auto;
	}
}