/* Copyright www.digiplek.nl */
/*
							STANDAARD							LICHTER								DONKERDER
	ORANJE:					#D98C00 / rgba(217,140,0,1.0)		#ffa600 / rgba(255,166,0,1.0)		#b37400 / rgba(179,116,0,1.0)
	WIT:					#f5f5f5 / rgba(245,245,245,1.0)		#ffffff / rgba(255,255,255,1.0)		#dbdbdb / rgba(219,219,219,1.0)
	LICHT-GRIJS:			#cccccc / rgba(204,204,204,1.0)		#e3e3e3 / rgba(227,227,227,1.0)		#444444 / rgba(68,68,68,1.0)
	ZWART:					#1e1e1e / rgba(30,30,30,1.0)		#2b2b2b / rgba(43,43,43,1.0)		#000000 / rgba(0,0,0,1.0)
*/

/* AANVULLEND LETTERTYPE */
/* Haal weg indien niet nodig @import url(''); */

/* Gebruik deze opmaak voor de betreffende onderdelen maar niet bij de sections of containers met de class dp_no-text-decor. */
.dp_text-decor a:link,
.dp_text-decor a:visited,
.dp_text-decor a:hover,
.dp_text-decor a:active,
.dp_text-decor a:focus,
#sp-main-body a:link,
#sp-main-body a:visited,
#sp-main-body a:hover,
#sp-main-body a:active,
#sp-main-body a:focus,
#sp-right a:link,
#sp-right a:visited,
#sp-right a:hover,
#sp-right a:active,
#sp-right a:focus,
#sp-dp-prefooter a:link,
#sp-dp-prefooter a:visited,
#sp-dp-prefooter a:hover,
#sp-dp-prefooter a:active,
#sp-dp-prefooter a:focus,
#sp-bottom a:link,
#sp-bottom a:visited,
#sp-bottom a:hover,
#sp-bottom a:active,
#sp-bottom a:focus {
	text-decoration:underline solid #D98C00 3px;
	-webkit-text-decoration-line:underline; /* Safari */
	-webkit-text-decoration-color:#D98C00; /* Safari */
	text-decoration-thickness:2px; /* Safari */
	/* Voor een enkele hyperlink gebruik je de bootstrap class text-decoration-underline */
}
.dp_no-text-decor a:link,
.dp_no-text-decor a:visited,
.dp_no-text-decor a:hover,
.dp_no-text-decor a:active,
.dp_no-text-decor a:focus,
a.dp_no-text-decor:link,
a.dp_no-text-decor:visited,
a.dp_no-text-decor:hover,
a.dp_no-text-decor:active,
a.dp_no-text-decor:focus {
	text-decoration:none !important;
	-webkit-text-decoration-line:none !important; /* Safari */
	/* Voor een enkele hyperlink gebruik je de bootstrap class text-decoration-none */
}
/* END */

/* TAGS: AANGEPASTE OPMAAK */
strong {
	font-weight:600;
}
/* END */

/* HEADER */
#sp-header {
	/* background-color:rgba(245,245,245,0.95); */
}
#sp-logo img.logo-image { /* Header: Begin custom logo opmaak. */
	padding-top:13px;
}
#sp-logo .logo a {
	padding:7px;
	padding-top:0;
	background-color:rgba(245,245,245,1.00);
	border-bottom-right-radius:5px;
	border-bottom-left-radius:5px;
}
#sp-menu .sp-megamenu-wrapper { /* Header: End custom logo opmaak. */
	margin-top:-26px;
}
/* END */

/* MENU */
a.dp_menu-button.btn { /* Menu: Buttons. */
	color:#f5f5f5;
	background-color:#D98C00;
	border-color:#D98C00;
	transition:all 0.4s ease-in-out;
}
li:has(a.dp_menu-button) { /* Menu: Zorgen dat de buttons goed mogelijk zijn. */
	display:inline;
}
.active a.dp_menu-button.btn,
a.dp_menu-button.btn:hover { /* Menu: Hover en active buttons. */
	color:#1e1e1e;
	background-color:#ffa600;
	border-color:#ffa600;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
	.sp-megamenu-parent > li > a {
		font-size:0.8em !important;
	}
}
.sp-megamenu-parent>li.active>a.dp_menu-button,
.sp-megamenu-parent>li.active:hover>a.dp_menu-button { /* Menu: Active hover buttons. */
	color:#1e1e1e;
}
.offcanvas-menu .offcanvas-inner ul.menu>li a.dp_menu-button,
.offcanvas-menu .offcanvas-inner ul.menu>li a.dp_menu-button span { /* Menu: Offcanvas standaard button kleur. */
	color:#f5f5f5;
}
.offcanvas-menu .offcanvas-inner ul.menu>li a.dp_menu-button:hover,
.offcanvas-menu .offcanvas-inner ul.menu>li a.dp_menu-button:focus,
.offcanvas-menu .offcanvas-inner ul.menu>li a.dp_menu-button span:hover,
.offcanvas-menu .offcanvas-inner ul.menu>li a.dp_menu-button span:focus { /* Menu: Offcanvas hover button kleur. */
	color:#1e1e1e;
}
.offcanvas-menu .offcanvas-inner ul.menu>li.active>a.dp_menu-button,
.offcanvas-menu .offcanvas-inner ul.menu>li.active:hover>a.dp_menu-button { /* Menu: Offcanvas active hover button. */
	color:#1e1e1e !important;
}
.offcanvas-menu .offcanvas-inner ul.menu>li>a,
.offcanvas-menu .offcanvas-inner ul.menu>li>span { /* Menu: Offcanvas tekst doorzichtigheid opheffen. */
	opacity:initial;
}
.offcanvas-menu .offcanvas-inner ul.menu li.active a { /* Menu: Offcanvas kleur probleem oplossen. */
	color:initial !important;
}
.offcanvas-menu .offcanvas-inner ul.menu>li a:hover,
.offcanvas-menu .offcanvas-inner ul.menu>li a:focus,
.offcanvas-menu .offcanvas-inner ul.menu>li span:hover,
.offcanvas-menu .offcanvas-inner ul.menu>li span:focus { /* Menu: Offcanvas kleur probleem oplossen. */
	color:#ffa600 !important;
}
.offcanvas-menu .offcanvas-inner ul.menu>li a.dp_menu-button:hover,
.offcanvas-menu .offcanvas-inner ul.menu>li a.dp_menu-button:focus { /* Menu: Offcanvas kleur probleem oplossen. */
	color:#1e1e1e !important;
}
.offcanvas-menu .offcanvas-inner ul.menu li.active>a { /* Menu: Offcanvas kleur probleem oplossen. */
	color:#d98c00 !important;
}
/* END */

/* SLIDESHOW */
.sppb-addon-sp-slider.dp_hp-slideshow .sp-item.slider-content-vercally-center {
	align-items:end;
}
/* END */

/* VERVOLGPAGINA TITELBALK */
#sp-title .sp-page-title { /* Vervolgpagina titelbalk: achtergrond afbeelding */
	position:relative;
	width:100%;
	height:auto;
	background-image:linear-gradient(90deg, rgba(0,0,0,1.0) 30%, rgba(217,140,0,1.0) 100%);
	background-color:transparent;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:50% 50%;
	background-attachment:fixed;
}
#sp-title div.sp-page-title[style]::after { /* Vervolgpagina titelbalk: gradient overlay als bg afbeelding in inline style aanwezig is */
	position:absolute;
	content:"";
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-image:linear-gradient(90deg, rgba(0,0,0,1.0) 30%, rgba(217,140,0,0.5) 100%);
}
#sp-title .sp-page-title .container { /* Vervolgpagina titelbalk: titel en subtitel bovenop gradient */
	position:relative;
	z-index:1;
}
#sp-title .sp-page-title-heading,
#sp-title .sp-page-title-sub-heading {
	text-align:center;
}
/* END */

/* HOMEPAGE */
.itemid-101 .page-header h1 { /* Homepage: header. */
	text-align:center;
}
#dp_home-overzicht img { /* Homepage: Afgeronde top hoeken in overzicht. */
	border-top-right-radius:20px;
	border-top-left-radius:20px;
}
#dp_home-overzicht .sppb-column-addons .sppb-section { /* Homepage: Afgeronde bottom hoeken in overzicht. */
	border-bottom-right-radius:20px;
	border-bottom-left-radius:20px;
}
/* END */

/* SIDEBARS */
#sp-right .sp-module {
	border-image:linear-gradient(135deg, #D98C00 0%, #1e1e1e 100%) 1; /* SIDEBARS: Module rechter kolom border kleur. */
}
#sp-left .sp-module {
	border-image:linear-gradient(225deg, #D98C00 0%, #1e1e1e 100%) 1; /* SIDEBARS: Module linker kolom border kleur. */
}
#sp-right .sp-module .sp-module-title {
    border-image:linear-gradient(90deg, #D98C00 0%, #1e1e1e 100%) 1; /* SIDEBARS: Titel rechter kolom border kleur. */
}
#sp-left .sp-module .sp-module-title {
    border-image:linear-gradient(270deg, #D98C00 0%, #1e1e1e 100%) 1; /* SIDEBARS: Titel linker kolom border kleur. */
}
#sp-right .sppb-testimonial-message p,
#sp-left .sppb-testimonial-message p { /* SIDEBARS:  Afbreken lange reviews.*/
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:3;
	overflow:hidden;
}
/* END */

/* OVERIGE */
.sppb-testimonial-message { /* REVIEWS:  Tekst stylen. */
	font-style:italic;
}
.timeline-panel .title, /* TIMELINE: Datum stylen. */
.timeline-date {
	font-weight:600;
}
.timeline-panel {
	background-color:#ffffff;
}
@media all and (min-width: 768px) and (max-width: 991px) {
	.timeline-panel {
		width:315px !important;
	}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
	.timeline-panel {
		width:274px !important;
	}
}
@media all and (min-width: 1200px) and (max-width: 1399px) {
	.timeline-panel {
		width:335px !important;
	}
}
@media all and (min-width: 1400px) {
	.timeline-panel {
		width:395px !important;
	}
}
#dp_openingsbalk {
	background:rgb(227,227,227,1);
	background:linear-gradient(90deg, rgba(245,245,245,1) 0%, rgba(227,227,227,1) 50%, rgba(245,245,245,1) 100%);
    border-bottom:1px;
    border-bottom-style:solid;
    border-image:linear-gradient(90deg, rgba(245,245,245,1) 5%, rgba(204,204,204,0.4) 20%, rgba(204,204,204,0.4) 80%, rgba(245,245,245,1) 95%) 1;
}
.sp-scroll-up:hover, .sp-scroll-up:active, .sp-scroll-up:focus { /* Overige: naar top icoon */
	background:rgba(217,140,0,1.0);
}
/* End */
.dp_carousel-lightbox .sppb-carousel-extended-item img { /* Overige: Carousel fotos. */
	object-fit:cover;
	border-radius:0 !important;
}
.dp_carousel-lightbox .sppb-carousel-extended-item .sppb-carousel-extended-content-wrap::after { /* Overige: Gradient over fotos. */
	top:0;
	left:0;
	right:0;
	bottom:0;
	content:"";
	position:absolute;
	z-index:-1;
	background:rgba(0,0,0,0);
	background:linear-gradient(0deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 25%);
}
.dp_carousel-lightbox .sppb-carousel-extended-heading,
.dp_carousel-lightbox .sppb-carousel-extended-subheading {
	margin-bottom:5px;
}
.dp_carousel-lightbox .sppb-carousel-extended-heading,
.dp_carousel-lightbox .sppb-carousel-extended-subheading,
.dp_carousel-lightbox .sppb-carousel-extended-description { /* Overige: Tekstschaduw. */
	text-shadow:0px 0px 2px #1e1e1e;
}
/* End */
.pagenavigation .pagination a { /* Overige: Pagina navigatie */
	padding:8px 16px;
}
.pagenavigation a.btn {
	border-color:#f5f5f5;
	border-radius:5px;
}
.pagenavigation a.btn:link,
.pagenavigation a.btn:visited {
	font-size:1.0em;
	text-decoration:none !important;
	color:#f5f5f5;
	background-color:#1e1e1e;
}
.pagenavigation a.btn:hover,
.pagenavigation a.btn:active {
	color:#ffa600;
	background-color:#1e1e1e;
}
/* End */
.dp_bouwbedrijf-regio { /* Overige: opmaak regio menu. */
	font-size:0.6em;
}
.dp_bouwbedrijf-regio li {
	display:inline-block;
	padding:5px;
}
.dp_bouwbedrijf-regio li:first-child {
	padding-left:0;
}
.dp_bouwbedrijf-regio li:last-child {
	padding-right:0;
}
.dp_bouwbedrijf-regio li a:link,
.dp_bouwbedrijf-regio li a:visited {
	/* text-decoration-color:#f5f5f5;
	text-decoration-thickness:1px; */
}
.dp_bouwbedrijf-regio li a:hover,
.dp_bouwbedrijf-regio li a:active,
.dp_bouwbedrijf-regio li a:focus {
	/* text-decoration-color:#D98C00;
	text-decoration-thickness:1px; */
}
.dp_bouwbedrijf-regio li.active a {
	color:#D98C00 !important;
	/* text-decoration-color:#D98C00; */
	cursor:default;
}
/* End */
[id^="custom_captcha_"].h-captcha { /* Overige: Dit element iets naar rechts opschuiven */
	margin-left:15px;
}
/* End */
.grecaptcha-badge { /* Overige: badge altijd zichtbaar */
    z-index:11;
}
:target { /* Overige: Linken naar anchor/anker positie met 100px (fixed header) + 50px (extra speling) = 150px zodat de anchor positie niet deels achter fixed header schuil gaat */
	scroll-margin-top:150px;
}
.coming-soon body,
.error-page body { /* Overige: Onder andere coming soon pagina stylen */
	color:#f5f5f5;
}
/* END */

/* EIGEN OPMAAK CLASSES */
.dp_full-width-row { /* CONTENT: Met rij ontsnappen uit een container zodat de rij full screen breed wordt. */
	width:100vw;
	position:relative;
	left:calc(-1 * (100vw - 100%)/2);
}
.dp_marker, .dp_yellow, dp_bg-yellow {
	background-color:yellow;
}
.dp_red, .dp_bg-red {
	background-color:red;
}
.dp_text-red {
	color:red;
}
.dp_orange, .dp_bg-orange {
	background-color:orange;
}
.dp_green, .dp_bg-green {
	background-color:green;
}
.dp_blue, .dp_bg-blue {
	background-color:blue;
}
.dp_text-shaduw-light {
	text-shadow:0px 0px 10px rgba(245,245,245,0.50);
}
.dp_text-shaduw-light02 {
	text-shadow:2px 2px 0px rgba(245,245,245,0.50);
}
.dp_text-shaduw-dark {
	text-shadow:0px 0px 10px rgba(30,30,30,0.50);
}
.dp_text-shaduw-dark02 {
	text-shadow:2px 2px 0px rgba(30,30,30,0.50);
}
.dp_box-shadow-light {
	box-shadow:0px 0px 4px rgba(245,245,245,0.20);
}
.dp_box-shadow-dark {
	box-shadow:0px 0px 4px rgba(0,0,0,0.20);
}
@media (max-width: 767px) {
	.dp_image-full { /* Afbeelding volle breedte op kleine schermen. */
		width:100% !important;
		height:auto !important;
		margin-right:0 !important;
		margin-left:0 !important;
	}
}
.dp_w-15 { /* Afbeelding 15% breed maken */
	width:15%; /* Of gebruik de standaard B5 classes w-25, w-50 en w-75 */
	height:auto;
}
.dp_w-35 { /* Afbeelding 35% breed maken */
	width:35%;
	height:auto;
}
@media all and (min-width: 768px) and (max-width: 991px) {
	.dp_w-15 {
		width:25% !important; /* Afbeeldingen 25% breed maken op kleinere schermen */
	}
}
img.dp_bw-image,
.dp_bw-image img { /* Afbeelding met grijstint */
	filter:grayscale(100%);
	transition:all 0.4s ease-in-out;
}
a:hover img.dp_bw-image,
.dp_bw-image a:hover img {
	filter:grayscale(0%);
}
a.btn.dp_buttons,
a.btn.dp_buttons:link,
a.btn.dp_buttons:visited { /* Algemeen: afwijkende button opmaak */
	color:rgba(245,245,245,1.0) !important;
	background-color:rgba(30,30,30,1.0);
	text-decoration:none !important;
	border-radius:0;
}
a.btn.dp_buttons:hover,
a.btn.dp_buttons:focus,
a.btn.dp_buttons:active {
	color:rgba(30,30,30,1.0) !important;
	background-color:rgba(217,140,0);
}
.dp_z-index0 { /* Te combineren met de Bootstrap classes position-relative en position-absolute. */
	z-index:0;
}
.dp_z-index1 {
	z-index:1;
}
.dp_list-indent-0 { /* Toevoegen aan UL om lijsten niet te laten uitspringen. */
	padding-left:0;
	list-style-position:inside;
}
/* END */