/*
 Theme Name:     2Special
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    2Special customizations
 Author:         Elegant Themes
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.0
*/

@import url("../Divi/style.css");

/* =Theme customization starts here
------------------------------------------------------- */

/* ------------------------------ START BASICS ------------------------------*/


html,
body, p {
    color: #5a5a59;
    font-weight: 500;
	line-height:1.5rem;
    font-size: 15px!important;
}

body {
	
}

a {
    color: var(--color-first);
}

strong {
    font-weight: 700;
}

@font-face {
	font-family: 'ElegantIcons';
	src:url('fonts/ElegantIcons.eot');
	src:url('fonts/ElegantIcons.eot?#iefix') format('embedded-opentype'),
		url('fonts/ElegantIcons.woff') format('woff'),
		url('fonts/ElegantIcons.ttf') format('truetype'),
		url('fonts/ElegantIcons.svg#ElegantIcons') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face{font-family:ETmodules;font-display:block;src:url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/modules/all/modules.eot);src:url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/modules/all/modules.eot?#iefix) format("embedded-opentype"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/modules/all/modules.woff) format("woff"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/modules/all/modules.ttf) format("truetype"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/modules/all/modules.svg#ETmodules) format("svg");font-weight:400;font-style:normal}
@font-face{font-family:FontAwesome;font-style:normal;font-weight:400;font-display:block;src:url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-regular-400.eot);src:url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-regular-400.eot?#iefix) format("embedded-opentype"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-regular-400.woff2) format("woff2"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-regular-400.woff) format("woff"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-regular-400.ttf) format("truetype"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-regular-400.svg#fontawesome) format("svg")}@font-face{font-family:FontAwesome;font-style:normal;font-weight:900;font-display:block;src:url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-solid-900.eot);src:url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-solid-900.eot?#iefix) format("embedded-opentype"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-solid-900.woff2) format("woff2"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-solid-900.woff) format("woff"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-solid-900.ttf) format("truetype"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-solid-900.svg#fontawesome) format("svg")}@font-face{font-family:FontAwesome;font-style:normal;font-weight:400;font-display:block;src:url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-brands-400.eot);src:url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-brands-400.eot?#iefix) format("embedded-opentype"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-brands-400.woff2) format("woff2"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-brands-400.woff) format("woff"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-brands-400.ttf) format("truetype"),url(//digiflex.development.2special.nl/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-brands-400.svg#fontawesome) format("svg")}


:root {

    /*------------------- DEFINE COLORS IN RGB ----------------*/
    --RGB-color-first: 208, 49, 71;
    /*DARK RED*/

    --RGB-color-second: 95, 191, 237;
    /*LIGHT BLUE*/

    --RGB-color-third: 0, 77, 147;
    /*DARK BLUE*/

    --RGB-color-fourth: 83, 170, 71;
    /*GREEN*/
	
    --RGB-color-fifth: 178, 178, 178;
    /*GREY*/	

    /*--------------- DEFINE COLORS SHORTCODE -----------------*/
	
    --color-first: rgb(var(--RGB-color-first));
    --color-second: rgb(var(--RGB-color-second));
    --color-third: rgb(var(--RGB-color-third));
    --color-fourth: rgb(var(--RGB-color-fourth));
    --color-fifth: rgb(var(--RGB-color-fifth));	

    /*---------- DEFINE OPACITY STEPS COLOR PRIMARY -----------*/
	
    --color-first-10: rgba(var(--RGB-color-first), .1);
    --color-first-20: rgba(var(--RGB-color-first), .2);
    --color-first-30: rgba(var(--RGB-color-first), .3);
    --color-first-40: rgba(var(--RGB-color-first), .4);
    --color-first-50: rgba(var(--RGB-color-first), .5);
    --color-first-60: rgba(var(--RGB-color-first), .6);
    --color-first-70: rgba(var(--RGB-color-first), .7);
    --color-first-80: rgba(var(--RGB-color-first), .8);
    --color-first-90: rgba(var(--RGB-color-first), .9);
    --color-first-95: rgba(var(--RGB-color-first), .95);

    /*---------- DEFINE OPACITY STEPS COLOR second ----------*/
    --color-second-10: rgba(var(--RGB-color-second), .1);
    --color-second-20: rgba(var(--RGB-color-second), .2);
    --color-second-30: rgba(var(--RGB-color-second), .3);
    --color-second-40: rgba(var(--RGB-color-second), .4);
    --color-second-50: rgba(var(--RGB-color-second), .5);
    --color-second-60: rgba(var(--RGB-color-second), .6);
    --color-second-70: rgba(var(--RGB-color-second), .7);
    --color-second-80: rgba(var(--RGB-color-second), .8);
    --color-second-90: rgba(var(--RGB-color-second), .9);
    --color-second-95: rgba(var(--RGB-color-second), .95);

    /*---------- DEFINE OPACITY STEPS COLOR third ----------*/
    --color-third-10: rgba(var(--RGB-color-third), .1);
    --color-third-20: rgba(var(--RGB-color-third), .2);
    --color-third-30: rgba(var(--RGB-color-third), .3);
    --color-third-40: rgba(var(--RGB-color-third), .4);
    --color-third-50: rgba(var(--RGB-color-third), .5);
    --color-third-60: rgba(var(--RGB-color-third), .6);
    --color-third-70: rgba(var(--RGB-color-third), .7);
    --color-third-80: rgba(var(--RGB-color-third), .8);
    --color-third-90: rgba(var(--RGB-color-third), .9);
    --color-third-95: rgba(var(--RGB-color-third), .95);

    /*---------- DEFINE OPACITY STEPS COLOR fourth ----------*/
    --color-fourth-10: rgba(var(--RGB-color-fourth), .1);
    --color-fourth-20: rgba(var(--RGB-color-fourth), .2);
    --color-fourth-30: rgba(var(--RGB-color-fourth), .3);
    --color-fourth-40: rgba(var(--RGB-color-fourth), .4);
    --color-fourth-50: rgba(var(--RGB-color-fourth), .5);
    --color-fourth-60: rgba(var(--RGB-color-fourth), .6);
    --color-fourth-70: rgba(var(--RGB-color-fourth), .7);
    --color-fourth-80: rgba(var(--RGB-color-fourth), .8);
    --color-fourth-90: rgba(var(--RGB-color-fourth), .9);
    --color-fourth-95: rgba(var(--RGB-color-fourth), .95);
	
    /*---------- DEFINE OPACITY STEPS COLOR fifth ----------*/
    --color-fifth-10: rgba(var(--RGB-color-fifth), .1);
    --color-fifth-20: rgba(var(--RGB-color-fifth), .2);
    --color-fifth-30: rgba(var(--RGB-color-fifth), .3);
    --color-fifth-40: rgba(var(--RGB-color-fifth), .4);
    --color-fifth-50: rgba(var(--RGB-color-fifth), .5);
    --color-fifth-60: rgba(var(--RGB-color-fifth), .6);
    --color-fifth-70: rgba(var(--RGB-color-fifth), .7);
    --color-fifth-80: rgba(var(--RGB-color-fifth), .8);
    --color-fifth-90: rgba(var(--RGB-color-fifth), .9);
    --color-fifth-95: rgba(var(--RGB-color-fifth), .95);	

    --border-radius: 2rem;
	--border-radius-s: calc(var(--border-radius) / 2);
	--icon-size: 26px;

  /*-------------------- grids ------------------*/
	
	
	
	
  /*------------------ colomns ------------------*/
	
  --gapsize: clamp(15px, 1.5dvw, 28.8px);	

  --column-count-1: repeat(auto-fill, minmax(100%, 1fr));
  --column-count-1-gap: .5rem;	
	
  --column-count-2: repeat(auto-fill, minmax(45%, 1fr));
  --column-count-2-gap: .5rem;

  @media only screen and (max-width: 980px) {
    --column-count-2: repeat(auto-fill, minmax(100%, 1fr));
    --column-count-2-gap: .5rem;
  }
	
  --column-count-3: repeat(auto-fill, minmax(27%, 1fr));
  --column-count-3-gap: .5rem;

  @media only screen and (max-width: 980px) {
    --column-count-3: repeat(auto-fill, minmax(45%, 1fr));
    --column-count-3-gap: .5rem;
  }	
}

/*------------------ end colomns ------------------*/
/*-------------------- end grids ------------------*/
	

/*------------------ START TRANSITIONS--------------*/
  
.transition-all, .transition-all:hover{
	transition: all .5s;
}

.transition-bg-color, .transition-bg-color:hover {
	transition: background-color 0.5s ease;
}

/*------------------ END TRANSITIONS--------------*/

/*-------------------- start border-radius ------------------*/	

.border-radius-top, .border-radius-top img { border-radius: var(--border-radius-s) var(--border-radius-s) 0 0 }
.border-radius-top-left { border-radius: var(--border-radius) 0 0 0 }
.border-radius-top-right { border-radius: 0 var(--border-radius) 0 0 }
.border-radius-bottom { border-radius: 0 0 var(--border-radius) var(--border-radius) }
.border-radius-bottom-left { border-radius: 0 0 0 var(--border-radius) }
.border-radius-bottom-right { border-radius: 0 0 var(--border-radius) 0 }

/*--------------------- end border-radius ------------------*/	


/*----------------- DEFINE TEXT SIZES ----------------------*/


h1,
h2,
h3,
h4 {
    padding-bottom: unset;
}


h1, .h2-size-l h2 {
    font-size: clamp(24px, 3vw, 3rem)!important;
    font-weight: 600;
    line-height: 120%;
}



.h1-arrow,
.h1-arrow h1,
.h1-arrow .et_pb_text_inner {
    width: 100%;
}


.h1-size-l h1 {
    font-size: clamp(2.25rem, 9vw, 9vw);
}



.h1-size-s h1 {
    font-size: clamp(2.5rem, 2vw, 2vw);
}


h2, .h1-size-m h1 {
    font-size: clamp(24px, 2vw, 2rem)!important;
	/*margin-bottom: clamp(1rem, 1.5vw, 1.5rem) !important;*/
    font-weight: 600;
    line-height: 120%;

}




.h2-size-m h2 {
    font-size: clamp(1.125rem, 1.25vw, 1.5rem)!important;
}

.h2-size-s h2 {
    font-size: clamp(1.125rem, 1.125vw, 20px)!important;
    /*text-transform: uppercase;
    letter-spacing: 1.1px;*/
    line-height: 120%;
}

.h2-underline .et_pb_text_inner{
    display: flex;
    justify-content: center;
}

.h2-underline h2:after {
    content: "";
    position: relative;
    display: flex;
    width: 80%;
    height: 2px;
    bottom: 0;
    left: 10%;
    background-color: var(--color-first);
    border-radius: 100px;
    margin-top: .65rem;
}


h3 {
    font-size: 18px !important;
    line-height: 150%;
	font-weight:700;
	margin-top:1rem;

}

.h3-size-s h3 {
    font-size: clamp(1.25rem, 1vw, 1vw) !important;
    font-weight: 600;
    line-height: 150%;
}

h4 {
    font-size: clamp(18px, 1.5vw, 24vw) !important;
    font-weight: normal;
	line-height: 150%;
}


.p-size-xl p, .p-size-xl {
    font-size: clamp(1rem, 1.4vw, 1.4rem);
	line-height:130%;
	font-weight:300;
}

.p-size-l p {
    font-size: clamp(16px, 1.125vw, 18px);
}


.p-size-s p, .p-size-s, .link-size-s a {
    font-size: clamp(0.9rem, 0.9vw, 0.9rem);
}

.p-uppercase p, .p-uppercase, .link-uppercase a {
	text-transform:uppercase!important;
}

.text-align-center h1,
.text-align-center h2,
.text-align-center h3,
.text-align-center h4,
.text-align-center h5,
.text-align-center p,
.text-align-center span,
.text-align-center a {
    text-align: center;
}



.text-semibold {
    font-weight: 600;
}

.text-bold {
    font-weight: 700;
}

.border-radius, .border-radius.et_pb_image img {
	border-radius: var(--border-radius);
	overflow: hidden;
}

.border-radius-s, .border-radius-s.et_pb_image img, .custom-button.border-radius-s a {
	border-radius: var(--border-radius-s)!important;
	overflow: hidden;
}

/*---------------DEFINE TEXT COLORS -------------------------*/

.h1-color-first h1,
.h2-color-first h2,
.h3-color-first h3,
.h4-color-first h4,
.span-color-first span,
.link-color-first a,
.text-color-first p,
.text-color-first {
    color: var(--color-first) !important;
}

.h1-color-second h1,
.h2-color-second h2,
.h3-color-second h3,
.h4-color-second h4,
.span-color-second span,
.link-color-second a,
.text-color-second p,
.text-color-second,
.text-strong-color-second strong{
    color: var(--color-second) !important;
}

.h1-color-third h1,
.h2-color-third h2,
.h3-color-third h3,
.h4-color-third h4,
.span-color-third span,
.link-color-third a,
.text-color-third p,
.text-color-third,
.text-strong-color-third strong{
    color: var(--color-third) !important;
}

.h1-color-fourth h1,
.h2-color-fourth h2,
.h3-color-fourth h3,
.h4-color-fourth h4,
.span-color-fourth span,
.link-color-fourth a,
.text-color-fourth p,
.text-color-fourth,
.text-strong-color-fourth strong{
    color: var(--color-fourth) !important;
}

.h1-color-fifth h1,
.h2-color-fifth h2,
.h3-color-fifth h3,
.h4-color-fifth h4,
.span-color-fifth span,
.link-color-fifth a,
.text-color-fifth p,
.text-color-fifth,
.text-strong-color-fifth strong{
    color: var(--color-fifth) !important;
}

.h1-color-white h1,
.h2-color-white h2,
.h3-color-white h3,
.h4-color-white h4,
.span-color-white span,
.link-color-white a,
.text-color-white,
.text-color-white p {
    color: white;
}

.h1-color-black h1,
.h2-color-black h2,
.h3-color-black h3,
.h4-color-black h4,
.span-color-black span,
.link-color-black a,
.text-color-black,
.text-color-black p {
    color: black;
}





/*--------------------  START BACKGROUND COLORS ----------------------------*/
.bg-none {
    background-color: rgba(0,0,0,0)!important;
}

.bg-color-first {
    background-color: var(--color-first);
}

.bg-color-first-20 {
    background-color: var(--color-first-20);
}

.bg-color-second {
    background-color: var(--color-second);
}
.bg-color-second-10 {
    background-color: var(--color-second-10);
}

.bg-color-second-90 {
    background-color: var(--color-second-90);
}
.bg-color-second-80 {
    background-color: var(--color-second-80);
}
.bg-color-second-70 {
    background-color: var(--color-second-70);
}

.bg-color-third {
    background-color: var(--color-third);
}
.bg-color-third-10 {
    background-color: var(--color-third-10);
}

.bg-color-fourth {
    background-color: var(--color-fourth);
}

.bg-color-fourth-90 {
    background-color: var(--color-fourth-90);
}
.bg-color-fourth-80 {
    background-color: var(--color-fourth-80);
}
.bg-color-fourth-70 {
    background-color: var(--color-fourth-70);
}

.bg-color-fifth {
    background-color: var(--color-fifth);
}

.bg-color-fifth-90 {
    background-color: var(--color-fifth-90);
}
.bg-color-fifth-80 {
    background-color: var(--color-fifth-80);
}
.bg-color-fifth-70 {
    background-color: var(--color-fifth-70);
}
.bg-color-fifth-60 {
    background-color: var(--color-fifth-60);
}
.bg-color-fifth-50 {
    background-color: var(--color-fifth-50);
}
.bg-color-fifth-40 {
    background-color: var(--color-fifth-40);
}
.bg-color-fifth-30 {
    background-color: var(--color-fifth-30);
}
.bg-color-fifth-20 {
    background-color: var(--color-fifth-20);
}
.bg-color-fifth-10 {
    background-color: var(--color-fifth-10);
}

.bg-color-white {
    background-color: rgba(255,255,255,1)!important;
}

.bg-color-black {
    background-color: rgba(0,0,0,1)!important;
}

.bg-color-white-80 {
    background-color: rgba(255,255,255,.8)!important;
}


.bg-gradient {
	    background-image: linear-gradient(90deg,var(--color-second) 66%,white 66%)!important;
}

/* -------------------- start template styles --------------------------*/

/*header {
	z-index:9;
	
}*/

.et_pb_section {
    padding-top: clamp(1.85rem, 3vw, 48px) !important;
    padding-bottom: clamp(1.85rem, 3vw, 48px) !important;
	width:100%;
}


	
.et_pb_row {
    padding-top: clamp(1.85rem, 3dvw, 48px) !important;
    padding-bottom: clamp(1.85rem, 3dvw, 48px) !important;
   /* width: 100% !important;*/
    padding-left: clamp(32px, 12.5dvw, 240px)!important;
    padding-right: clamp(32px, 12.5dvw, 240px)!important;
	max-width: 1440px;
}

.et_pb_section .et_pb_row {
	padding-left:0!important;
	padding-right:0!important;
}

.et_pb_section .et_pb_row.template-blog {
	padding:5rem!important;

}

@media only screen and (max-width: 980px) {
	.et_pb_row {
    padding-top: clamp(1.85rem, 3dvw, 48px) !important;
    padding-bottom: clamp(1.85rem, 3dvw, 48px) !important;
    padding-left: clamp(24px, 5dvw, 240px)!important;
    padding-right: clamp(24px, 5dvw, 240px)!important;
	max-width: 90%;
    width: 90%!important;	
	}
	
	.et_pb_section .et_pb_row.template-blog {
	padding:1rem!important;

}
}

.et_pb_row.row-header:after {
	display:none;
}

.row-full {
	max-width:100%!important;
	width:100%;
}

@media only screen and (min-width: 981px) {
	.row-m{
		max-width: clamp(800px, 90%, 1280px)!important;
		margin:auto;
		max-width:1280px;
	}
	
	.row-s{
		max-width: 800px!important;
		margin:auto;
	}
		.row-xs {
		max-width: clamp(500px, 50%, 1200px)!important;
		margin:auto;
	}
	

}

.no-gap {
	gap:0!important;
}

.gap-0\.5 {
	gap: 0.5rem!important;
}

.gap-1 {
	gap: 1rem;!important;
}






/*START HEADER ****************************** HEADER **************************/

/*custom margin max screen size*/

.section-main-menu.bg-transparent {
	background-color: rgba(255,0,0,0)!important;
}

.section-main-menu .et_pb_menu {
	background-color: rgba(255,0,0,0)!important;
}

.section-main-menu .et_pb_menu .et-menu {
    margin-left: 0px;
    margin-right: 0px;
}

.section-main-menu .et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li {
    margin-top: 0px;
	margin-left:0.4vw;
	font-size:16px;
}

.section-main-menu .et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li:first-child {
margin-left:0!important;	
}

.section-main-menu .et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li>a {
    padding-bottom: 0px;
}

.section-main-menu .et_pb_menu .et-menu-nav>ul, .et_pb_menu--without-logo .et_pb_menu__menu>nav>ul  {
	padding-left:0!important;
}

.section-main-menu .et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li.highlight>a {
    padding: 1rem;
	background: var(--color-first);
	color:white;
}

.main-menu ul li a{
	display:flex;
	flex-direction: column;
	margin-top:.25rem!important;
	transition: all .4s ease-in-out!important;
}

.main-menu ul li:not(.menu-item-has-children) a:after {

  content: "";
    position: relative;
    display: flex!important;
    width: 100%;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: rgba(0,0,0,0);
    border-radius: 100px;
    margin-top: .25rem;
transition: all .4s ease-in-out!important;
	
}

.et-menu .current-page-parent.menu-item-has-children>a:first-child{
	color:var(--color-first);
} 

 


.main-menu ul li.current_page_item a:after {
	/*color:var(--color-second)!important;
	  width: 100%;
    background-color: var(--color-second);*/

}

.et-menu .menu-item-has-children>a:first-child:after{
	top:-2px;
}

.main-menu ul li:not(.menu-item-has-children) a:hover::after, .main-menu ul li:not(.menu-item-has-children).current-menu-item a:after {
	
width: 80%;
    background-color: var(--color-first);

}

.main-menu ul li:hover a {
	opacity: 1;
}

.section-main-menu .et_mobile_nav_menu {
	display:none!important;
}

.section-main-menu .et_pb_menu__menu {
	display:flex!important;
}

.section-main-menu .main-menu a {
	display: flex;
    align-items: center;
    padding-bottom: 0;
	font-weight:600;
}

.section-main-menu .et-menu .menu-item-has-children>a:first-child:after {
    display: flex;
    align-items: center;
    height: 100%;
}

.section-main-menu .et_pb_menu .nav li ul.sub-menu {
	background-color:var(--color-second)!important;
	box-shadow: none;
	border: none;
    top: calc(100% - 0px) !important;
}

.section-main-menu .et_pb_menu .nav li ul.sub-menu a {
	color:white!important;
}
@media only screen and (min-width: 981px) {
.section-main-menu {
	/*padding-left: clamp(32px, 5dvw, 80px) !important;
    padding-right: clamp(32px, 5dvw, 80px) !important;
    max-width: 1920px;*/
	}


.section-main-menu .et_pb_row {
	padding-left: 0!important;
    padding-right: 0!important;
    max-width: 1920px;
	width:90%;
	}
}

.top-menu ul li {
	border-radius: 0 0 .5rem .5rem;
	padding:0!important;
}

.top-menu ul li a {
	padding: 30px 20px 20px 20px !important;
	font-weight:600;
}

.top-menu ul li a:before {
	font-family: FontAwesome !important;
	margin-right:.5rem;
	font-weight:500;
}

.top-menu ul li.cart a:before{
	font-family: ElegantIcons !important;
content:'';
}

.top-menu ul li.phone a:before{
	font-family: ElegantIcons !important;
content:'';
}

.top-menu ul li.login a:before{
content:'';
		font-family: FontAwesome !important;
	font-weight: 400 !important;

}


.section-top-menu.et_pb_sticky .et_pb_row{
	padding-bottom:1rem!important;
}

.section-top-menu.et_pb_sticky .top-menu ul li a {
	padding: 10px 20px 10px 20px !important;
}


.hide-scrollbar {
	overflow:hidden;
  }
  
.logo .et_pb_image_wrap {
    width:clamp(150px, 14.375vw, 230px);
	width:250px!important;
  }  

@media only screen and (max-width: 980px) {
	.logo .et_pb_image_wrap {
    width:clamp(100px, 100vw, 150px);
  	} 
	
	.et_pb_social_media_follow_0_tb_header li a.icon {
    height: 24px!important;
    width: 24px!important;
	}
}
  
.line {
  display: block;
  height: 3px;
  width: 100%;
  background: var(--color-first);
  opacity: 1;
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  margin-bottom: 10px;

}

.line-2 {
	/*top: clamp(10px, 0.75vw, 0.75vw);*/
}

.line-3 {
	margin-bottom: 0;
}
.hamburger.open .line {
	background:white;	
}

.hamburger.open .line-1 {
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	transform: rotate(135deg);
  margin-bottom: 0;
  position: absolute;
  /*background: var(--color-first);*/
}

.hamburger.open .line-2 {
	opacity:0;
  	height:0;
  	margin:0;
  	/*margin-bottom: 0;*/
  	transition-delay: 100ms;
   transition: all 0.5s ease;
}

.hamburger.open .line-3 {
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
  margin-bottom: 0;
  position: absolute;
 /* background: var(--color-first);*/
}  


.slide-in-menu-container {
  -webkit-transition: all 0.3s ease !important;
  -moz-transition: all 0.3s ease !important;
  -o-transition: all 0.3s ease !important;
  -ms-transition: all 0.3s ease !important;
  transition: all 0.3s ease !important;
  opacity: 0;
  height:100vh;
  left:100%!impomrtant;
  
  overflow-y:scroll;
  padding:5rem!important;
  padding-bottom:10rem;
  width:100%;
  padding-right: clamp(32px, 12.5dvw, 240px) !important;
	
	position:fixed;
	z-index:4;
}

.section-slide-in {
    height: 100vh;
    display: flex;
    z-index: 4;
	-webkit-transition: all 0.3s ease !important;
  	-moz-transition: all 0.3s ease !important;
  	-o-transition: all 0.3s ease !important;
  	-ms-transition: all 0.3s ease !important;
  	transition: all 0.3s ease !important;
  	opacity: 0.5;
  	height:100vh;
  	left:100%!important;
  	overflow-y:scroll;
  	padding:5rem!important;
  	padding-bottom:10rem;
  	width:100%;
	top:0!important;	
	position:fixed;
	z-index:4;
	scrollbar-width:none;
	padding-top: 10rem !important;
}

@media only screen and (max-width: 980px) {
.section-slide-in {
	background-color: black!important;
	}
	
.section-slide-in .et_pb_module, .section-slide-in .custom-menu ul li {
	padding-right:0!important;
	}
}

@media only screen and (min-width: 981px) {
.section-slide-in {
	background-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, #000000 50%) !important;
	background-color: RGBA(255, 255, 255, 0) !important; */
	}
}

.section-slide-in .et_pb_row {
	padding:0!important;
	width:100%!important;
	max-width: 1920px;
}

.section-slide-in .et_pb_row {
	/*margin-right: 0;
	width:300px!important;*/
}

.section-slide-in .et_pb_row .et_pb_column {
/*display: flex;
    flex-direction: column;
    align-items: flex-end;*/
}

.section-slide-in .et_pb_row .et_pb_module{
margin-right: 0;
	/*width:100%!important;
	padding-left:2rem;*/
}



@media only screen and (max-width: 1920px) {
	.section-slide-in {
		max-width: 1920px;
	  	padding-right: clamp(32px, 12.5dvw, 240px) !important;
  		padding-left: clamp(32px, 12.5dvw, 240px) !important;		
	}
}

@media only screen and (min-width: 1921px) {
	.section-slide-in .et_pb_row {
		width: 1440px !important;
    	margin: auto;
		display: flex;
	}
	.section-slide-in .et_pb_row .et_pb_column{
		width: 300px !important;
    	margin: auto;
	}
}

@media only screen and (max-width: 980px) {
	.slide-in-menu-container {
		width:100%;
	}
}

.slide-in-menu-container .et_pb_menu .et_pb_menu__menu {
    display: block !important;
}

.slide-in-menu-container .et_pb_menu .et_pb_menu__menu .et-menu li {
	width:100%;
	display: flex;
	justify-content: flex-end;
	padding-right: 0;
}

.slide-in-menu-container .et_pb_menu .et_pb_menu__menu .et-menu li>a {
	font-size:clamp(1rem, 1.5vw, 22px);
	margin-bottom:0.5rem;
	font-weight:400;
	letter-spacing:2px;
}

.slide-in-menu-container  .et_pb_menu .et_mobile_nav_menu {
    display: none !important;
}
  
.slide-in-menu-open {
  opacity: 1 !important;
  left:0%!important;
}

.slide-in-menu-container .sub-menu {
	padding-left:2rem!important;
}

.slide-in-menu-container {
	padding-left:clamp(2rem, 4vw, 4rem);!important;
}



@media (max-width: 980px) {  
	.slide-in-menu-open {
		left:0!important;
	}
	.socials a:before {
		font-size:18px!important;
	}
}
  
.hamburger {
  width: clamp(40px, 4.5vw, 40px);
  height: clamp(40px, 4.5vw, 40px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background:rgba(255, 255, 255, 0);
  padding:clamp(0px, 0vw, 0px);
  cursor: pointer;
  margin-left:2rem;
}

.socials {
height: 48px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  background:rgba(255, 255, 255, 0);
  padding:clamp(0px, 0vw, 0px);
  cursor: pointer;
  margin-left:2rem;
	transition: all .5s;
}

.socials-white .et_pb_social_icon .icon:before {
	color:white!important;
	transition: all .5s;
}

.socials-white ul.et_pb_social_media_follow {

    display: flex;
    justify-content: flex-end;

}


.socials li {
margin-bottom:0;	
	height: 48px!important;
}

.socials-white .et_pb_social_media_follow{
		margin-top:1rem!important;
	margin-bottom:1rem!important;
}

  
  

  
.hidden {
    opacity: 0;

}

@media (max-width: 980px) {  
	
.hidden-screensize-m {
    opacity: 0;
    /*transition: all .5s;*/
}	
/*.row-mobile-1_2 .et_pb_column {
		width:50%!important;		    
  }  
 /* .hamburger {
    background:none;
    padding:0;
    width:24px;
    height:25px;
  }  */

  .line {
 /* background: white;*/
  
}
	/*.hamburger:before {
		content:"menu";
		display: block;
		float:left;
		
		background:red;
	}*/
	
  }

.section-header-image-home {
	
}

.section-header-image-content {
	
}

@media (min-width: 981px) {  
	.section-header-image-home{
	height:28.75vw;
	min-height:250px;
	}
	
	.section-header-image-content {
	height:25vw;
	min-height:130px;
	max-height:480px;	
	}
}

@media (max-width: 640px) { 
	.section-header-image .et_pb_row{
	flex-direction:column;	
	}
	
	.section-header-image h1 {
		margin-bottom:0.5rem;
	}
}

.section-header-image:after {
    content: '';
    /* background: red; */
    width: 100% !important;
    /* display: flex; */
    /* margin: 0 !important; */
    /* padding: 0 !important; */
    position: absolute;
    height: 100%;
    background-image: linear-gradient(90deg, rgba(31, 52, 11, 0.75) 30%, #ffffff 30%, #ffffff 31%, rgba(136, 187, 72, 0.75) 31%, rgba(136, 187, 72, 0.75) 55%, #ffffff 55%, #ffffff 56%, rgba(131, 131, 131, 0.75) 56%, rgba(131, 131, 131, 0.75) 70%, #ffffff 70%, #ffffff 71%, rgba(31, 52, 11, 0.75) 66%) !important;
	
	background-image: url("https://novumnetwork.development.2special.nl/wp-content/uploads/2024/03/Novum-header-img-bg.png")!important;
	background-size: contain;
}
	




.custom-menu.et_pb_menu .et-menu-nav>ul, .et_pb_menu--without-logo .et_pb_menu__menu>nav>ul {
	padding-left: 0!important;
    margin-left: 0!important;
}

.custom-menu ul li {
	padding-left:0!important;
	padding-right:1rem!important;
}

.custom-menu ul li a {
	display: flex;
    font-size:1rem;
    align-items: center;
	color:white;
	line-height: 110%;
	font-weight:300;
}

/*.custom-menu ul li a:before {
	display: block;
    content: '';
    /* min-width: clamp(26px, 2vw, 2vw); */
    /* height: 10px; */
    -webkit-mask-size: cover;
    -webkit-mask: url(https://novumnetwork.development.2special.nl/wp-content/themes/Divichild/images/bullit.svg) no-repeat 50% 50%;
    mask: url(https://novumnetwork.development.2special.nl/wp-content/themes/Divichild/images/bullit.svg) no-repeat 50% 50%;
    -webkit-mask-size: contain;
    /* mask-size: cover; */
    background-color: var(--color-fourth);
    /* transform: rotate(-90deg); */
    width: 26px;
    height: 26px;
	min-width:26px;
	margin-right:0.5rem;
}*/

.custom-menu-bullits-color-first ul li a:before {
	background-color: var(--color-first);
}

.custom-menu-bullits-color-white ul li a:before {
	background-color: var(--color-first);
}


.custom-menu-vertical ul li {
	width:100%;
}

.custom-menu-vertical.et_pb_menu .et_pb_menu__wrap {
    justify-content: flex-start!important;
}

.section-slide-in .et_pb_social_media_follow {
	border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
    padding-bottom: 1rem;
    padding-top: 0.5rem;
}

.section-main-menu li.custom-button {
	align-items: center!important;
	display: flex!important;
}

@media (max-width: 640px) { 
	.section-header-image .custom-menu ul li	{
		width:100%!important;
	}
	
	.section-header-image .custom-menu 	{
		margin-bottom:2rem!important;
	}
}

/*@media (min-width: 981px) { 
.section-main-menu li {
	height: 120px;

}
}*/

.section-main-menu li ul li {
	height: unset;

}

.section-main-menu li ul li a {
	padding-bottom:6px!important;

}

.custom-menu.et_pb_menu .et_pb_menu__menu, .slide-in-menu-container .et_pb_menu .et_pb_menu__menu {
  	display: block !important;
}

.custom-menu.et_pb_menu .et_mobile_nav_menu, .slide-in-menu-container .et_mobile_nav_menu {
  	display: none !important;
}



/* -------------------------------------------------------------------***** END HEADER ***** */

/*START BODY ****************************** BODY **************************/

/*#et-main-area {
	z-index: 1;
    position: relative;
}


@media (max-width: 980px) {  
	.et_pb_section_0, .bodysection-projects {
	margin-top:clamp(88px, 11.22dvw, 110px)!important;
}
}
*/
.section-body .et_pb_section {
	width:100%;
}

/*.section-body .et_pb_section .et_pb_row {
	padding-left:0!important;
	padding-right:0!important;
}*/

.intro-text, .intro-text p{
	font-size:1.125rem!important;
	line-height:160%!important;
	font-weight:500!important;
}

.checkmarks ul {
    list-style-type: none!important;
    padding: 0!important;
    padding-bottom: clamp(16px, 1.75vw, 1.75vw)!important;
    float: left;
}

.checkmarks ul li {  
    margin-bottom: 8px!important;
    margin-right: 2vw;
    min-height: 28px;
    display: flex;
    align-items: center;
    width: 100%;
    clear: both;
    line-height: 140%!important;
}

.checkmarks li:before {
 
    background-color: var(--color-first);
    display: block;
    content: '';
    /* min-width: 1.65vw; */
    min-width: 24px!important;
    height: 20px!important;
    float: left;
    margin-right: clamp(8px, 0.5vw, 0.5vw)!important;
}

.checkmarks-color-white li:before {
	background-color: white;
}

.et_pb_blurb_content {
	/*display:flex!important;*/
}

.et_pb_main_blurb_image {
/*margin-top: auto;
    margin-bottom: auto;
	    display: flex;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;*/
}



/*.section-diensten h2 {
	margin-bottom:1.5rem!important;
}

.section-diensten p {
	padding-bottom:1rem!important;
}*/





.section-diensten-details {
    
}

.section-diensten .et_pb_row:hover {
	opacity:0.7;
}



.section-diensten .et_pb_row:hover .custom-button-color-white a, .section-diensten .et_pb_row:hover .custom-button-color-white span {
	color: var(--color-first)!important;
	border: solid 2px white;
	background:white;
	opacity:1;
}

/*----- START BLOG OVERVIEW NEW DIVI 5 -----------*/
@media (max-width: 980px) { 
    .blog-overview-grid  {
        flex-direction:column;
    }
    
}

.blog-overview .et_pb_row:hover {
    
}

.blog-overview-list-flip .et_pb_row:nth-child(odd) .et_pb_row {
    flex-direction: row-reverse;
}

.blog-overview-readmore .et_pb_row, .blog-overview-grid .et_pb_column, .section-diensten-details .et_pb_row .et_clickable {
    opacity:1;    
}

.section-diensten-details .et_pb_row .custom-button-read-more {
    display:none;
}

.section-diensten-details .et_pb_row .et_clickable .custom-button {
    display:block;
}


.blog-overview-readmore .et_pb_row:hover, .blog-overview-grid .et_pb_column:hover, .section-diensten-details .et_pb_row .et_clickable:hover {
	/*opacity:0.75;    */
}



.blog-overview-readmore .et_pb_row:hover .et_pb_column .custom-button .et_pb_text_inner span, .blog-overview-readmore.et_pb_row:hover .et_pb_column .custom-button .et_pb_text_inner span {
	background:var(--color-first)!important;
	color:white!important;
}

.section-diensten-details .et_pb_row .et_clickable:hover .et_pb_column .custom-button-solid-color-first .et_pb_text_inner span {
     color:var(--color-first);
    background-color: white!important;
}



/*----- END BLOG OVERVIEW NEW DIVI 5 ------------*/


/*.blog-overview article {
	border-radius: 12px 12px 0 0;
	
}

.blog-overview h2, .blog-overview .dp-dfg-meta.entry-meta  {
	padding-top: 24px;
	padding-left:24px;
	padding-right:24px;
}

.blog-overview .dp-dfg-primary {
	padding:0!important;
}

.blog-overview .dp-dfg-content {
	padding-top: 8px;
	padding-left:24px;
	padding-right:24px;
}

.blog-grey .dp-dfg-primary {
	background-color: rgba(0,0,0,0.05)!important;
}

.blog-overview.blog-overview-readmore .dp-dfg-content.entry-summary:after {
	content:'lees meer';
	display:flex;
	border:2px solid var(--color-first);
	line-height: 100% !important;
    text-align: center !important;
    transition: all 300ms ease 0ms !important;
    height: fit-content !important;
    width: fit-content;
    font-size: 14px;
    padding: .75rem 1rem;
    font-weight: 600;
	letter-spacing:3px;
	border-radius:20px;
	color:var(--color-first);
	margin: 0;
	margin-top:1rem;
}

.blog-overview-list .dp-dfg-content.entry-summary:after {
	margin-left:0;
}

.blog-overview article{
	transition: all .5s;
}

.blog-overview-list article {
	    border-bottom: 1px solid var(--color-first)!important;
	padding-left:0!important;
	padding-right:0!important;
	
	    column-gap: 3rem!important;
	border-radius:0!important;
}



.blog-overview-list article h2, .blog-overview-list article .dp-dfg-content, .blog-overview-list article .dp-dfg-header {
	padding:0!important;
}



.blog-overview-list-flip article:nth-child(even) .dp-dfg-header, .blog-overview-list-flip article:nth-child(even) .dp-dfg-content {
	grid-column: 1 / 3;
}

.blog-overview-list-flip article:nth-child(even) figure {
	grid-column: 3;
}

.blog-overview-readmore article:hover {
	opacity:0.75;
}

.blog-overview-readmore article:hover .dp-dfg-content.entry-summary:after {
	background:var(--color-first);
	color:white
}

.blog-overview-list article figure{

    padding-bottom: 3rem!important;
}


.blog-overview-list .dp-dfg-items {
    grid-row-gap: 3rem!important;
}

*/

.parts .dp-dfg-items {
grid-template-columns: repeat(2, 1fr);
}

.parts .dp-dfg-items h2 {
	font-size:22px!important;	
}
.parts .dp-dfg-items article {
	grid-template-columns: minmax(150px, 33%) 1fr!important;
	column-gap: 1.5rem!important;
	padding-top: 0;
}

.parts .dp-dfg-items article .dp-dfg-custom-content {
	padding-bottom:0;
}

.parts .dp-dfg-items article .dp-dfg-cf-subtitle span {
	font-weight:600;
}

figure.dp-dfg-image.entry-thumb {
    padding-bottom: 1rem !important;
}

.owl-stage {
	display: flex;
    align-items: center;
}
.owl-carousel .owl-item{
    background-color: white;
    padding: 1rem;
    border-radius: 10px;
}

.owl-carousel .owl-item img {
    display: block;
    width: auto!important;
    max-height: 150px;
}

.owl-item a {
	display: flex;
    justify-content: center;
	pointer-events: none;
}

.owl-item {
	opacity:1!important;
}

.timeline ul li, .timeline ul li span {
	font-size:15px!important;
	font-weight:500!important;
	color:#000!important;
}

.timeline h3 {
	text-transform:uppercase;
	font-weight:300;
	font-size:18px!important;
	color:#999!important;
}

.timeline h5 {
padding-bottom:0!important;
}

.referentie-list .dp-dfg-items {
	display:grid;
	gap:0.25rem;
}

.referentie-list article h2 {
	font-size: 15px;
	font-weight:500!important;
        color: white!important;
}

.referentie-list article {
width: 100%;
    position: relative;
    padding: 0.5rem 1rem;
    border: 1px solid black;
    border-radius: var(--border-radius);
    transition: all 300ms ease 0ms !important;
    background: black;
align-items: center;
    display: flex;
    gap:20px;
}

.referentie-list article a:hover {
	
	background:var(--color-fifth);
	border-color:var(--color-fifth)
}

.referentie-list article p {
	padding-bottom:0!important;	
}

.referentie-list article .dp-dfg-meta {
	float: right;
    display: block;
	font-size:12px;
	font-weight:600;
}
.referentie-list article  .dp-dfg-meta{
	display: flex;
  /*  flex-direction: row-reverse;*/
    gap: 1rem;
	z-index: 2;
    position: relative;
}
.referentie-list article  .dp-dfg-meta span.terms {
        gap: 5px;
    display: flex;
}


.referentie-list article  .dp-dfg-meta span.terms span{
    border-radius: 5px;
    padding: 2px 6px;
    color: white;
    background:var(--color-first);
}

.referentie-list article  .dp-dfg-meta span.terms span.term-separator {
    display:none;
}

.referentie-list article  .dp-dfg-meta .taxonomy-category {
	padding:3px 10px;
	color:white;
	border-radius: var(--border-radius-s);
}

.referentie-list article  .dp-dfg-meta .camerasystemen{
	background:var(--color-third);
}

.referentie-list article  .dp-dfg-meta .elektro-en-domotica {
	background:var(--color-first);
}

.referentie-list article .alarmsystemen {
	background:var(--color-second);
}

.referentie-list article .internet-en-voip {
	background:var(--color-fourth);
}


.referentie-list article .dp-dfg-header{
	z-index: 1;
    position: relative;
}

.referentie-list .dp-dfg-search-icon {
	display: none;
}

.referentie-list .dp-dfg-search {
	display: flex;
    justify-content: center;
}

.referentie-list .dp-dfg-search input {
	padding: 10px 20px;
    border: none;
    background: #dedede;
    border-radius: var(--border-radius);
}
.referentie-list  .dp-dfg-cf-product_groups {
background: var(--color-first);
    font-size: 13px;
    padding: 3px 10px 4px;
    border-radius: 14px;
    color: white;
}

.dp-dfg-cf-article_number {
	font-size: 13px;
	padding-top:3px;
}

.referentie-list ul {
	display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    margin: 0 0 2em;
}

.referentie-list ul li {
	list-style-type: none;
    margin-top: -1px;
}

.referentie-list ul li a {
	color: #666;
    font-size: 1.4em;
    line-height: 1em;
    display: block;
    overflow: hidden;
    height: 100%;
    margin: -1px -1px 0 0;
    padding: 0.5rem 1rem;
    border: 1px solid #e2e2e2;
    background-color: #fff;
    -webkit-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}


.referentie-list ul li a.active {
    color: var(--color-first)!important;
}

.referentie-list ul li a:hover {
   background-color: #e2e2e2;
}

ul.dp-dfg-level.dp-dfg-taxonomy-level-0.dp-dfg-taxonomy-all {
    gap: 0.5rem;
}

.dp-dfg-filter a{
	border-radius:7px;
}

.dp-dfg-pagination .pagination a, .dp-dfg-skin-default .dp-dfg-filter a, .et-l .dp-dfg-pagination .pagination a.pagination-link, .et-l .dp-dfg-skin-default .dp-dfg-filter a.dp-dfg-filter-link {
	padding: 0.5rem 1rem;
}

.dp-dfg-skin-default .dp-dfg-filter a.active, .dp-dfg-skin-default .pagination li.active a, .et-l .dp-dfg-skin-default .dp-dfg-filter a.active, .et-l .dp-dfg-skin-default .pagination li.active a {
	color:var(--color-first);	
}

/* -------------------------------------------------------------------***** END BODY ***** */

/*START FOOTER ****************************** FOOTER **************************/


.footer-menu.et_pb_menu ul li, .footer-menu .et_pb_menu__menu {
  	width: 100% !important;
	padding-left:0!important;
}

.footer-menu.et_pb_menu .et_pb_menu__menu, .slide-in-menu-container .et_pb_menu .et_pb_menu__menu {
  	display: block !important;
}

.footer-menu.et_pb_menu .et_mobile_nav_menu, .slide-in-menu-container .et_mobile_nav_menu {
  	display: none !important;
}

.list li {

    list-style: none;
    padding-top: 1px;
    padding-bottom: 1px;
    font-family: 'Open Sans';
    font-size: 14px;
    line-height: 24px;
 
    border: none;
}

.list.simple li span {
    float: left;
    min-width: 40%;
}

ul.list.simple  {
    padding-left:0!important;
}

/*.section-footer p {
	font-size:15px;
}*/

.section-footer h3 {
	margin-top:0;
}

.section-footer .et_pb_column:last-child {
	/*min-width:200px;*/
}

.section-footer .et_pb_column:nth-child(2) {
	/*min-width:255px;*/
}
/* -------------------------------------------------------------------***** END FOOTER ***** */


/* ***** START CUSTOM BUTTONS *****--------------------------------------------------------- */

/*.custom-form .gform_button {
    background: var(--color-first) !important;
    color: white !important;
    border: 0 !important;
	width:fit-content;
	border-radius:100px!important;
	margin-top:1rem!important;
	
}

.custom-form input.gform_button  {
	min-width:0;
	font-family: 'ancient_adregular'!important;
}

.gform_button:hover {
	background-color: var(--color-first) !important;
	cursor:pointer;
}*/

a.custom-button,
.custom-button a, .custom-form input.gform_button, .custom-button span {
	line-height: 100% !important;
    text-align: center !important;
    display: inline-block !important;
    transition: all 300ms ease 0ms !important;
    height: fit-content !important;
    width: fit-content;
    content: 'See more';
    
    font-size: 14px;
    padding: .75rem 1rem;
    
  /*  text-transform: uppercase;*/
    font-weight: 600;
	
	border-radius:20px;
}

a.custom-button-wide,
.custom-button-wide a {
    width:100%;
	
}

.custom-button-color-first a, .custom-form input.gform_button, a.custom-button-color-first, .custom-button-color-first span {
	background-color:white!important;
	color: var(--color-first)!important;
    border: solid 1px var(--color-first)!important;
}

.custom-button-solid-color-first a,  .custom-button-solid-color-first span{
	background-color:var(--color-first);
	color: white;
    border: solid 2px var(--color-first);
}

.custom-button-solid-color-first a:hover, .custom-button-solid-color-first span:hover {
	background-color:var(--color-first);
	color: white;
}



.custom-button-color-first a:hover, a.custom-button-color-first:hover, .custom-button-color-first span:hover, .custom-form input.gform_button:hover {
	background-color:white!important;
	color: var(--color-first)!important;
}

.custom-button-color-white a, .custom-button-color-white span {
    color: white!important;
	border: solid 2px white;
}

.custom-button-color-white a:hover{
    color: var(--color-first)!important;
	border: solid 2px white;
	background:white;
}


a.custom-button:hover,
.custom-button a:hover {
    /*opacity: 0.6;*/
}

.button-wide {
    width: 100%;
}

a.custom-button-icon, .custom-button-icon a {
	display: flex !important;
    align-items: center;
	padding: .25rem 1rem;
	font-size:14px!important;
}

.custom-button-icon a:before{
    display: inline-block;
    content: '';
    /* min-width: clamp(26px, 2vw, 2vw); */
    /* height: 10px; */
    -webkit-mask-size: cover;
    -webkit-mask: url(https://digiflex.development.2special.nl/wp-content/themes/Divichild/images/arrow.svg) no-repeat 50% 50%;
    mask: url(https://digiflex.development.2special.nl/wp-content/themes/Divichild/images/arrow.svg) no-repeat 50% 50%;
    -webkit-mask-size: contain;
    /* mask-size: cover; */
    background-color: white;
    /* transform: rotate(-90deg); */
    width: var(--icon-size);
    height: var(--icon-size);
	margin-right:0.5rem;
	
	transition: all .5s;
}

.custom-button-icon a:hover {
	background:white;
	color:var(--color-first);
}

.custom-button-icon a:hover::before{
		background-color: var(--color-first);
}

.custom-button-icon-contact a:before{
	width: var(--icon-size);
    height: var(--icon-size);
    color: var(--color-fourth);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    font-size: 15px;
	background-color:var(--color-first)!important;
	margin-right:8px;
}

a.custom-button-icon-phone:before{
	font-family: FontAwesome !important;
	font-weight: 900 !important;
	content: "\f095"!important;
	transform: rotate(90deg);
}

a.custom-button-icon-mail:before{
	font-family: FontAwesome !important;
	font-weight: 900 !important;
	content: "\f0e0"!important;
	
}



.custom-button-color-second a {
    background: var(--color-second);
    color: var(--color-first)!important;
}


a.button-color-second:before,
.custom-button-color-second a:before {
	background-color: var(--color-first);
	
}

a.button-color-second:hover,
.custom-button-color-second a:hover {
    background: var(--color-second-70);
}

a.button-color-third,
.custom-button-color-third a {
    background: var(--color-third);
    color: white;
}

a.button-color-third:hover,
.custom-button-color-third a:hover {
    background: var(--color-third-70);
}

a.button-color-fourth,
.custom-button-color-fourth a {
    background: var(--color-fourth);
    color: var(--color-first)!important;
}


a.button-color-fourth:before,
.custom-button-color-fourth a:before {
	background-color: var(--color-first);
	
}

a.button-color-fourth:hover,
.custom-button-color-fourth a:hover {
    background: var(--color-fourth-70);
}

.custom-button-download a {
	padding: 8px 16px!important;
    margin-bottom: 0.5rem;
    font-size: 15px;
	font-weight: 500;
	background-color:#ddd!important;
	color:#333!important;
	justify-content: space-between;
}

.custom-button-download a:after{
	/*width: var(--icon-size);
    height: var(--icon-size);*/
  
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    font-size: 15px;

		font-family: FontAwesome !important;
	font-weight: 900 !important;
	content: "\f019"!important;
}







.link-button-arrow a:after,
.link-button-arrow span:after {
    display: inline-block;
    content: '';
    width: 13px;
    margin-left: 5px;
    height: 10px;
    -webkit-mask-size: cover;
    -webkit-mask: url(https://spiegellicht.nl/wp-content/themes/Divichild/images/arrow.svg) no-repeat 50% 50%;
    mask: url(https://spiegellicht.nl/wp-content/themes/Divichild/images/arrow.svg) no-repeat 50% 50%;
    -webkit-mask-size: contain;
    mask-size: cover;
    background-color: var(--color-first);
}

.link-button-arrow-down a:after,
.link-button-arrow-down span:after {
   transform: rotate(0deg);
}

.link-button-arrow-right a:after,
.link-button-arrow-right span:after {
   transform: rotate(-90deg);
}

.link-button-back a:before {
   /* display: block;
    content: '';
    width: clamp(26px, 2vw, 2vw);
    height: clamp(1rem, 1.15vw, 1.15vw);
    -webkit-mask-size: cover;
    -webkit-mask: url(https://spiegellicht.nl/wp-content/themes/Divichild/images/arrow.svg) no-repeat 50% 50%;
    mask: url(https://spiegellicht.nl/wp-content/themes/Divichild/images/arrow.svg) no-repeat 50% 50%;
    mask-size: cover;
    background-color: white;
    float: left;
    margin-right: 0.75vw;
    transform: rotate(180deg);
    z-index: 999999999;*/
}

.link-button-back a:hover::before {
    background-color: var(--color-primary);
}


.border-right {
    border-right: 2px solid white;
}

.border-left {
    border-left: 2px solid white;
}

.border-top {
    border-top: 1px solid white;
}

.border-bottom {
    border-bottom: 1px solid var(--color-first);
	/*width: 95%!important;
    max-width: 1520px;*/
    margin: auto;
	
}

.et_pb_posts_nav span.meta-nav{display:none;}

.single-project.et_pb_pagebuilder_layout .nav-single {
    width: 100%;
    max-width: 100%;
    margin: 10px auto;
}

.et_pb_posts_nav a {
	min-width: 110px;
}

/* ------------------------------ ***** END CUSTOM BUTTONS ***** ------------------------- */

/* ------------------------------ ***** START CUSTOM FORMS ***** ------------------------- */

.custom-form .gform-theme--foundation .gform_fields{
grid-row-gap: 1rem;
}


.custom-form p.gform_required_legend {
	display:none;
}

.custom-form .gform-theme--framework .gform-field-label>.gfield_required {
   
}

.gf_login_links a:first-child {
	display:none;
}

.gform_heading {
    display: none !important;
}
.custom-form input,
.custom-form textarea {
    border:none!important;
	background:white;
	background: #ddd!important;
	box-shadow:none!important;
}



.custom-form input[type=text], .custom-form input[type=email], .custom-form input[type=tel], .custom-form input[type=password]{
    height: clamp(40px, 3.125vw, 50px)!important;
	padding: 0 16px!important;
	border-radius:3px;
	width:100%;
}

.custom-form input::placeholder {

  color: black;
}

.custom-form .gform_wrapper.gravity-theme .gfield_required {
    color: #999;
}



.gform_footer, .gform_wrapper.gravity-theme .gform_page_footer {
    margin: 0!important;
    padding: 8px 0!important;
}

.custom-form label {
	font-size:1rem!important;
	/*color: var(--color-second)!important;*/
}

.gform-theme--framework input[type=radio]:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)):before {
	background: var(--color-fourth)!important;
}

.gform-theme--framework input[type=checkbox]:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme--framework input[type=radio]:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
    --gf-local-height: var(--gf-ctrl-choice-size);
    --gf-local-display: inline-grid;
    --gf-local-line-height: var(--gf-ctrl-choice-size);
    --gf-local-padding-y: 0;
    --gf-local-padding-x: 0;
    --gf-local-width: var(--gf-ctrl-choice-size);
    accent-color: var(--color-first)!important;
    align-content: center;
    justify-content: center;
    opacity: 1;
    place-content: center;
}



.owl-nav.arrow_size_small .owl-next:before, .owl-nav.arrow_size_small .owl-prev:before {
    font-size: 22px;
    background: black;
    color: white;
    display: flex;
    width: 22px;
    height: 22px;
    justify-content: center;
    line-height: 100%;
	border:1px solid black;
	transition: all .5s;
}

.owl-next, .owl-prev {
    opacity: 1;
}

.owl-next:hover::before, .owl-prev:hover::before {
    color:black!important;
	background:white!important;
}

@media (min-width: 769px) {  

a.dp_ocp_lightbox_image {

max-height: clamp(100px, 16.25vw, 260px) !important;
    overflow: hidden;
    display: inline-grid;

    align-content: center;
	min-width: 100% !important;
}


.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    min-width: 100% !important;
}}

/*------------------------------- END CUSTOM FORMS ------------------------------*/


/* ------------------------------ START MARGINS ------------------------------*/

/* ------------------------------ > START Manuel template margins --------------------------*/

/*padding-0*/
.p-0, #page-container .p-0 { padding: clamp(0rem, 0vw, 0rem) !important;}
.pt-0, #page-container .pt-0 { padding-top: clamp(0rem, 0vw, 0rem) !important;}
.pb-0, #page-container .pb-0 { padding-bottom: clamp(0rem, 0vw, 0rem) !important;}
.pr-0, #page-container .pr-0 { padding-right: clamp(0rem, 0vw, 0rem) !important;}
.pl-0, #page-container .pl-0 { padding-left: clamp(0rem, 0vw, 0rem) !important;}
.px-0, #page-container .px-0 { padding-left: clamp(0rem, 0vw, 0rem) !important; padding-right: clamp(0rem, 0vw, 0rem) !important;}
.py-0, #page-container .py-0 { padding-top: clamp(0rem, 0vw, 0rem) !important; padding-bottom: clamp(0rem, 0vw, 0rem) !important;}

/*margin-0*/
.m-0, #page-container .mt-0 { margin: clamp(0rem, 0vw, 0rem) !important;}
.mt-0, #page-container .mt-0 { margin-top: clamp(0rem, 0vw, 0rem) !important;}
.mb-0, #page-container .mb-0 { margin-bottom: clamp(0rem, 0vw, 0rem) !important;}
.mr-0, #page-container .mr-0 { margin-right: clamp(0rem, 0vw, 0rem) !important;}
.ml-0, #page-container .ml-0 { margin-left: clamp(0rem, 0vw, 0rem) !important;}
.mx-0, #page-container .mx-0 { margin-left: clamp(0rem, 0vw, 0rem) !important; margin-right: clamp(0rem, 0vw, 0rem) !important;}
.my-0, #page-container .my-0 { margin-top: clamp(0rem, 0vw, 0rem) !important; margin-bottom: clamp(0rem, 0vw, 0rem) !important;}

:root {
	--05-min: 0.5rem;
	--05-var: 0.5vw;
	--05-max: 1rem;
}

/*padding-0.5*/
.p-0\.5, #page-container .pt-0\.5 { padding: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.pt-0\.5, #page-container .pt-0\.5 { padding-top: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.pb-0\.5, #page-container .pb-0\.5 { padding-bottom: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.pr-0\.5, #page-container .pr-0\.5 { padding-right: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.pl-0\.5, #page-container .pl-0\.5 { padding-left: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.px-0\.5, #page-container .px-0\.5 { padding-left: clamp(var(--05-min), var(--05-var), var(--05-max)) !important; 
								   padding-right: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.py-0\.5, #page-container .py-0\.5 { padding-top: clamp(var(--05-min), var(--05-var), var(--05-max)) !important; 
								   padding-bottom: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}

/*margin-0.5*/
.m-0\.5, #page-container .mt-0\.5 { margin: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.mt-0\.5, #page-container .mt-0\.5 { margin-top: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.mb-0\.5, #page-container .mb-0\.5 { margin-bottom: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.mr-0\.5, #page-container .mr-0\.5 { margin-right: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.ml-0\.5, #page-container .ml-0\.5 { margin-left: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.mx-0\.5, #page-container .mx-0\.5 { margin-left: clamp(var(--05-min), var(--05-var), var(--05-max)) !important; 
								   margin-right: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.my-0\.5, #page-container .my-0\.5 { margin-top: clamp(var(--05-min), var(--05-var), var(--05-max)) !important; 
								   margin-bottom: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}

:root {
	--1-min: 1rem;
	--1-var: 1vw;
	--1-max: 2rem;
}
/*padding-01*/
.p-1, #page-container .p-1 { padding: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.pt-1, #page-container .pt-1 { padding-top: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.pb-1, #page-container .pb-1 { padding-bottom: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.pr-1, #page-container .pr-1 { padding-right: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.pl-1, #page-container .pl-1 { padding-left: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.px-1, #page-container .px-1 { padding-left: clamp(var(--1-min), var(--1-var), var(--1-max)) !important; 
							   padding-right: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.py-1, #page-container .py-1 { padding-top: clamp(var(--1-min), var(--1-var), var(--1-max)) !important; 
							   padding-bottom: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}

/*margin-1*/
.m-1, #page-container .m-1 { margin: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.mt-1, #page-container .mt-1 { margin-top: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.mb-1, #page-container .mb-1 { margin-bottom: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.mr-1, #page-container .mr-1 { margin-right: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.ml-1, #page-container .ml-1 { margin-left: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.mx-1, #page-container .mx-1 { margin-left: clamp(var(--1-min), var(--1-var), var(--1-max)) !important; 
							   margin-right: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.my-1, #page-container .my-1 { margin-top: clamp(var(--1-min), var(--1-var), var(--1-max)) !important; 
							   margin-bottom: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}

:root {
	--15-min: 1rem;
	--15-var: 1vw;
	--15-max: 1rem;
}

/*padding-1.5*/
.p-1\.5, #page-container .p-1\.5 { padding: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.pt-1\.5, #page-container .pt-1\.5 { padding-top: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.pb-1\.5, #page-container .pb-1\.5 { padding-bottom: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.pr-1\.5, #page-container .pr-1\.5 { padding-right: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.pl-1\.5, #page-container .pl-1\.5 { padding-left: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.px-1\.5, #page-container .px-1\.5 { padding-left: clamp(var(--15-min), var(--15-var), var(--15-max)) !important; 
							   padding-right: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.py-1\.5, #page-container .py-1\.5 { padding-top: clamp(var(--15-min), var(--15-var), var(--15-max)) !important; 
							   padding-bottom: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}

/*margin-1.5*/
.m-1\.5, #page-container .m-1\.5 { margin: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.mt-1\.5, #page-container .mt-1\.5 { margin-top: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.mb-1\.5, #page-container .mb-1\.5 { margin-bottom: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.mr-1\.5, #page-container .mr-1\.5 { margin-right: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.ml-1\.5, #page-container .ml-1\.5 { margin-left: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.mx-1\.5, #page-container .mx-1\.5 { margin-left: clamp(var(--15-min), var(--15-var), var(--15-max)) !important; 
							   margin-right: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.my-1, #page-container .my-1\.5 { margin-top: clamp(var(--15-min), var(--15-var), var(--15-max)) !important; 
							   margin-bottom: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}


:root {
	--2-min: 2rem;
	--2-var: 2vw;
	--2-max: 2rem;
}
/*padding-2*/
.p-2, #page-container .p-2 { padding: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.pt-2, #page-container .pt-2 { padding-top: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.pb-2, #page-container .pb-2 { padding-bottom: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.pr-2, #page-container .pr-2 { padding-right: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.pl-2, #page-container .pl-2 { padding-left: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.px-2, #page-container .px-2 { padding-left: clamp(var(--2-min), var(--2-var), var(--2-max)) !important; 
							   padding-right: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.py-2, #page-container .py-2 { padding-top: clamp(var(--2-min), var(--2-var), var(--2-max)) !important; 
							   padding-bottom: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}

/*margin-2*/
.m-2, #page-container .m-2 { margin: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.mt-2, #page-container .mt-2 { margin-top: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.mb-2, #page-container .mb-2 { margin-bottom: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.mr-2, #page-container .mr-2 { margin-right: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.ml-2, #page-container .ml-2 { margin-left: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.mx-2, #page-container .mx-2 { margin-left: clamp(var(--2-min), var(--2-var), var(--2-max)) !important; 
							   margin-right: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.my-2, #page-container .my-2 { margin-top: clamp(var(--2-min), var(--2-var), var(--2-max)) !important; 
							   margin-bottom: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}

@media only screen and (max-width: 980px) {
	.m-2-screensize-m, #page-container .m-2-screensize-m { margin: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
}

:root {
	--3-min: 3rem;
	--3-var: 3vw;
	--3-max: 3rem;
}
/*padding-3*/
.p-3, #page-container .p-3 { padding: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.pt-3, #page-container .pt-3 { padding-top: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.pb-3, #page-container .pb-3 { padding-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.pr-3, #page-container .pr-3 { padding-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.pl-3, #page-container .pl-3 { padding-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.px-3, #page-container .px-3 { padding-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important; 
							   padding-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.py-3, #page-container .py-3 { padding-top: clamp(var(--3-min), var(--3-var), var(--3-max)) !important; 
							   padding-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}

/*margin-3*/
.m-3, #page-container .m-3 { margin: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.mt-3, #page-container .mt-3 { margin-top: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.mb-3, #page-container .mb-3 { margin-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.mr-3, #page-container .mr-3 { margin-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.ml-3, #page-container .ml-3 { margin-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.mx-3, #page-container .mx-3 { margin-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important; 
							   margin-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.my-3, #page-container .my-3 { margin-top: clamp(var(--3-min), var(--3-var), var(--3-max)) !important; 
							   margin-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
@media only screen and (max-width: 980px) {
	.mb-3-screensize-m, #page-container .mb-3-screensize-m { margin-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}

}
@media only screen and (max-width: 768px) {
    	.pr-3-screensize-s, #page-container .pr-3-screensize-m { padding-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
    .pl-3-screensize-s, #page-container .pl-3-screensize-m { padding-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
}


:root {
	--4-min: 2rem;
	--4-var: 4vw;
	--4-max: 4rem;
}
/*padding-4*/
.p-4, #page-container .p-4 { padding: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.pt-4, #page-container .pt-4 { padding-top: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.pb-4, #page-container .pb-4 { padding-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.pr-4, #page-container .pr-4 { padding-right: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.pl-4, #page-container .pl-4 { padding-left: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.px-4, #page-container .px-4 { padding-left: clamp(var(--4-min), var(--4-var), var(--4-max)) !important; 
							   padding-right: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.py-4, #page-container .py-4 { padding-top: clamp(var(--4-min), var(--4-var), var(--4-max)) !important; 
							   padding-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}

/*margin-4*/
.m-4, #page-container .m-4 { margin: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.mt-4, #page-container .mt-4 { margin-top: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.mb-4, #page-container .mb-4 { margin-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.mr-4, #page-container .mr-4 { margin-right: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.ml-4, #page-container .ml-4 { margin-left: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.mx-4, #page-container .mx-4 { margin-left: clamp(var(--4-min), var(--4-var), var(--4-max)) !important; 
							   margin-right: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.my-4, #page-container .my-4 { margin-top: clamp(var(--4-min), var(--4-var), var(--4-max)) !important; 
							   margin-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
@media only screen and (max-width: 980px) {
	.mb-4-screensize-m, #page-container .mb-4-screensize-m { margin-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
}

:root {
	--5-min: 2.5rem;
	--5-var: 5vw;
	--5-max: 5rem;
}
/*padding-5*/
.p-5, #page-container .p-5 { padding: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.pt-5, #page-container .pt-5 { padding-top: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.pb-5, #page-container .pb-5 { padding-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.pr-5, #page-container .pr-5 { padding-right: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.pl-5, #page-container .pl-5 { padding-left: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.px-5, #page-container .px-5 { padding-left: clamp(var(--5-min), var(--5-var), var(--5-max)) !important; 
							   padding-right: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.py-5, #page-container .py-5 { padding-top: clamp(var(--5-min), var(--5-var), var(--5-max)) !important; 
							   padding-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}

/*margin-5*/
.m-5, #page-container .m-5 { margin: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.mt-5, #page-container .mt-5 { margin-top: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.mb-5, #page-container .mb-5 { margin-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.mr-5, #page-container .mr-5 { margin-right: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.ml-5, #page-container .ml-5 { margin-left: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.mx-5, #page-container .mx-5 { margin-left: clamp(var(--5-min), var(--5-var), var(--5-max)) !important; 
							   margin-right: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.my-5, #page-container .my-5 { margin-top: clamp(var(--5-min), var(--5-var), var(--5-max)) !important; 
							   margin-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
@media only screen and (max-width: 980px) {
	.mb-5-screensize-m, #page-container .mb-5-screensize-m { margin-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
	.ml--5-screensize-m { margin-left: clamp-(var(--5-min), -var(--5-var), -var(--5-max)) !important;}
}

@media only screen and (min-width: 981px) {
	.ml--5-screensize-l { margin-left: clamp(-5rem, -5vw, -2.5rem) !important;}
	.mr--5-screensize-l { margin-right: clamp(-5rem, -5vw, -2.5rem) !important;}
}

:root {
	--6-min: 3rem;
	--6-var: 6vw;
	--6-max: 6rem;
}

/*padding-6*/
.p-6, #page-container .p-6 { padding: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.pt-6, #page-container .pt-6 { padding-top: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.pb-6, #page-container .pb-6 { padding-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.pr-6, #page-container .pr-6 { padding-right: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.pl-6, #page-container .pl-6 { padding-left: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.px-6, #page-container .px-6 { padding-left: clamp(var(--6-min), var(--6-var), var(--6-max)) !important; 
							   padding-right: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.py-6, #page-container .py-6 { padding-top: clamp(var(--6-min), var(--6-var), var(--6-max)) !important; 
							   padding-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}

/*margin-6*/
.m-6, #page-container .m-6 { margin: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.mt-6, #page-container .mt-6 { margin-top: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.mb-6, #page-container .mb-6 { margin-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.mr-6, #page-container .mr-6 { margin-right: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.ml-6, #page-container .ml-6 { margin-left: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.mx-6, #page-container .mx-6 { margin-left: clamp(var(--6-min), var(--6-var), var(--6-max)) !important; 
							   margin-right: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.my-6, #page-container .my-6 { margin-top: clamp(var(--6-min), var(--6-var), var(--6-max)) !important; 
							   margin-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}

/* ------ START FLEXBOX STYLES :-)------- */

.grid {
    display:grid!important;
    grid-template-columns: repeat(2, 1fr);
}

.grid-3-columns {
        grid-template-columns: repeat(3, 1fr);
}

.flex {
    display: flex;
}


.justify-content-space-between {
    justify-content: space-between;
}

.align-items-center {
    align-items: center !important;
}

.align-items-flex-start {
    align-items: flex-start!important;
}

.align-items-flex-end {
    align-items: flex-end;
}

.align-content-flex-start {
    align-content: flex-start!important;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-flex-start {
    justify-content: flex-start;
}

.justify-content-flex-end {
    justify-content: flex-end !important;
}

.flex-direction-column {
    flex-direction: column;
}

.flex-direction-row {
    flex-direction: row;
}

.flex-grow-1{
	flex-grow: 1;
}



.flex-wrap-wrap {
    flex-wrap: wrap;
}

.align-content-stretch {
	align-content:stretch;
}
.align-content-space-between {
align-content: space-between;
}

.align-content-space-around {
    align-content: space-around;
}



@media only screen and (min-width: 981px) {
	.flex-screensize-l {
    display: flex;
	}
}

@media only screen and (min-width: 769px) {
	.flex-s {
    display: flex;
	}
}

/* ------ END FLEXBOX STYLES :-)------- */

.custom-blog.et_pb_column {
	margin-right:0!important;
	margin-bottom:0!important;
}

.custom-blog .et_pb_image_wrap {
height:clamp(100px, 15vw, 200px);	
	overflow:hidden;
}
.custom-blog .et_pb_image_wrap img {
	height: 100%;
    object-fit: cover;
	
}

@media only screen and (max-width: 768px) {
	
	.custom-blog .et_pb_image_wrap {
	height: clamp(150px, 50vw, 330px);
	}
	
	#page-container .custom-blog .et_pb_group {
		padding-left:5vw!important;
		padding-right:5vw!important;
	}
	
}

.section-diensten .et_pb_column {
	margin-right:0!important;
}

.et_block_row .et_pb_column {
	margin-right:0!important;
}