@charset "utf-8";
/* CSS Document -  WEBSPICE - Sofie Vandenberghe -  www.webspice.be*/
@font-face {
	font-family:"Poppins";
	src: url('fonts/Poppins.woff2') format('woff2'),
		url('fonts/Poppins.woff') format('woff'),
		 url('fonts/Poppins.ttf')  format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Quattrocento Sans";
	src: url('fonts/QuattrocentoSans.woff2') format('woff2'),
		url('fonts/QuattrocentoSans.woff') format('woff'),
		url('fonts/QuattrocentoSans.ttf')  format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
html {
  scroll-behavior: smooth;
text-rendering: optimizeLegibility !important;
-moz-osx-font-smoothing:grayscale!important;
-webkit-font-smoothing:antialiased!important
}
body{font-family:'Quattrocento Sans';color:#4a4d4e;font-size: 18px;background:#faf9f8;}
h1 , h2 {font-size:55px; line-height:55px;font-family:"Poppins"; color:#6d7275; margin: 0 auto 100px; position: relative;}
h1::after, h2::after{position: absolute; background: #c9c2d2; left:50%;transform: translate(-50%,0); width:93px; height:8px; 	border-radius: 4px; content:''; top:100%; margin-top: 30px; }
h3{ font-size: 36px; margin: 30px 0 5px; font-family:"Poppins";color: #4a4d4e;text-transform: none;}
h4 {font-size: 24px;font-family: "Poppins";color: #4a4d4e;margin: 0 0 20px;line-height: 35px;}
h5{font-size:18px; font-family:"Quattrocento Sans"; color:#4a4d4e; margin: 0 0 30px; line-height:22px;}
h6{font-size:24px; font-family:"Poppins"; font-weight:normal; color:#4a4d4e; margin: 0 0 10px; line-height:30px;}
p{font-size:18px; font-weight:normal; line-height: 24px;margin: 0 0 10px;  }
a, a:hover, a:focus, a:focus, a:active{ text-decoration:none; outline:none; transition: ease-in .3s; color:#4a4d4e}
p a:hover, a:hover{cursor:pointer;text-decoration: underline;color:#bbb7c1}
.inhoud ul {
    margin-left: 30px;
    margin-top: 10px;
    list-style: none;
}
.inhoud ul li::before {
  content: "-";  
  font-weight: bold; 
  display: inline-block; 
  width: 1em; 
  margin-left: -1em; 
}
.breadcrumb {background-color:transparent;border-radius:0;justify-content:flex-start;padding-left:0px;padding-top:10px}
.breadcrumb-item {font-size:12px}
.bgwece{background:#b5b2b8}
#webspice { text-align: right;padding-right:10px}
#webspice a {
font-weight:600;
font-size:12px;
color:#dddddd;
text-decoration:none;
    padding-top: 5px;padding-bottom:5px;
    }
#webspice a:hover{color:#ffffff}
.bol {
color:#D99F15;
font-size:24px
}
.btn {
box-shadow: none !important;
text-decoration:none;
transition: 0.3s;
color: #4a4d4e;
background-color: transparent;
border: 1px solid #4a4d4e;
padding:0 20px;
font-family: 'Poppins';
margin: 20px;
border-radius: 0px;
display:block;
line-height: 54px;
max-width: 270px;

}
.btncondoleren {
	font-size: 18px;
	font-weight: normal;
	position: relative;
	color: #615541!important;
	display: inline-block;
	padding: 10px 20px;
	background-clip: padding-box;
	background-color: #E1D5C2;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width:auto;
	margin-top:0px;
	margin-bottom:5px;
	margin-left:10px;
	margin-right:5px;
	font-family:"montserrat light"
}
.btn:hover, a.btn:hover{text-decoration:none; background-color:#4a4f53;border-color:#4a4f53;color:#fff;}
.nee{display:none}
.ja{display:block}

/*******/

input:focus{ outline:none;}
.form-control::placeholder {color: #959494;}
.form-control, .form-control-file{font-weight: normal;
	padding: 8px 10px;
    border:1px solid #f0f0f0;
 color: #666666;
margin:5px 0}
.form-control:focus {
    color: #333333;
    background-color: #fff;
    border-color: #0f2548;
    outline: 0;
    box-shadow: none;
}

.submit {
    font-family: 'Poppins';
display: block;
line-height: 1.25;
text-align: center;
vertical-align: middle;
text-decoration: none;
text-shadow: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-clip: padding-box;
margin-top: 20px;
font-size: 18px;
padding: 17px;
margin-left: auto;
margin-right: auto;
text-transform:uppercase;
transition: all 0.5s;
width: 250px;
color: #282728;
background-color: #fff;
border: 1px solid #4a4d4e;
border-radius: 0px;
}
.submit:hover {background-color:#4a4f53;border-color:#4a4f53;color:#fff;text-decoration:none }
 iframe.map {height:400px; width:100%;display: block;}
.container {max-width: 1450px;padding: 0 15px;}
/**----Header Css----**/
.navbar-brand {padding:0;}
.top-header{padding:25px 0; position:relative;}
/* nav */
.navi{background-color: #7f8588}
.navbar-toggler:focus,.navbar-toggler:active {outline: 0;}
.navbar-toggler{position:relative;display:none;padding: .75rem .75rem;}
.navbar-toggler span {
display: block;
background-color: #ffffff;
height: 3px;
width: 35px;
margin-top: 4px;
margin-bottom: 4px;
 -webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
 -o-transform: rotate(0deg);
transform: rotate(0deg);
position: relative;
 left: 0;
opacity: 1;
}
.navbar-toggler span:nth-child(1),
.navbar-toggler span:nth-child(3) {
-webkit-transition: transform .35s ease-in-out;
-moz-transition: transform .35s ease-in-out;
 -o-transition: transform .35s ease-in-out;
transition: transform .35s ease-in-out;
}
.navbar-toggler:not(.collapsed) span:nth-child(1) {
position: absolute;
 left: 12px;
top: 10px;
 -webkit-transform: rotate(135deg);
 -moz-transform: rotate(135deg);
-o-transform: rotate(135deg);
transform: rotate(135deg);
 opacity: 0.9;
}
.navbar-toggler:not(.collapsed) span:nth-child(2) {
height: 12px;
visibility: hidden;
 background-color: transparent;
}
.navbar-toggler:not(.collapsed) span:nth-child(3) {
position: absolute;
left: 12px;
top: 10px;
-webkit-transform: rotate(-135deg);
 -moz-transform: rotate(-135deg);
 -o-transform: rotate(-135deg);
 transform: rotate(-135deg);
opacity: 0.9;
}
.navbar { padding-left: 0; padding-right: 0; padding-top: 25px; padding-bottom:25px;}
nav ul{list-style:none; padding-left: 0;max-width: 1530px;    margin: 0 auto;}
.nav-link{ color: #faf9f8; text-decoration: none; font-size: 18px; letter-spacing: 1px; transition: 0.5s; position: relative; padding: 0!important; font-family:"Poppins"; }
.nav-link:focus, .nav-link:hover, .nav-link.active {color: #bbb7c1;text-decoration:none	}
.cont {font-family:"Poppins"; color: #5d6266; padding: 20px 40px; width: max-content;border:1px solid #7f8588;position: absolute;right: 0;bottom: 0;}
.cont a{color:#5d6266; font-family:"Poppins";text-decoration: none;}
/*index*/
.banner { background: url("../fotomateriaal/banner.webp"); background-position: center center; background-repeat: no-repeat; background-attachment:scroll;width:100% ;height:588px;background-size:cover}

.alert { padding: 13px 0;}
.alert-tekst { border: 1px solid #c9c2d2; font-size:20px; font-family:  "Quattrocento Sans"; line-height:34px;padding: 50px 40px 40px; max-width: 95.8%; margin: 30px auto; }
.rouwberichten{padding:70px 0;}
	.rouwberichten .card {border:0!important; border-radius:0!important;box-shadow: 0 0 20px #c9c2d2;}
	.rouwberichten .card p {font-size: 16px;    font-family: "Quattrocento Sans";}
	.rouwberichten .card a.btn ,.rouwberichten .card a.btn:hover {max-width: 100%; height:auto; background: transparent!important; border: 0!important; }
	.card-body {padding: 35px 	19px 0px;}
.card-img-top {height:286px;overflow:hidden}
	h5.card-title { font-size: 22px; font-family: "Quattrocento Sans"; color: #4a4d4e;font-weight:bold }
.card-footer {background-color:transparent;border-top: none;}
.ons-sec{padding:100px 0 100px;}
	.links-ons {  position: relative;}
	.links-ons:before { position: absolute; left: 0px; background: #e1dee6; width: 100%; height:100%; content: ''; top:-68px; }
	.links-ons img { position: relative;    margin: 68px  0 0px 68px; display:block; width:100%;}
	.rechts-ons {padding-left: 85px;}
	.rechts-ons ul li {list-style: none; position: relative; padding-left: 44px; line-height: 24px; margin: 0 0 14px; }
	.rechts-ons ul{margin:44px 0 60px; padding:0;}
	.rechts-ons ul li:before { background: url(../fotomateriaal/arrow-2.webp) no-repeat left; left: 5px; top:4px; content: ''; position: absolute; width:29px; height:14px; }
.afscheidshuys {padding: 100px 0 105px;}
	.bg-color{background:#f8f7f9;}
	.afscheidshuys h2 {margin: 0 auto 60px;}
	.afscheidshuys h2::after {margin-top:20px;}
	.afscheidshuys  p{text-align:justify; margin: 0 auto 58px;}
	.service-box {background:#fff; box-shadow:0 0 20px #c9c2d2; margin:0 0 55px;  height: 312px ; overflow: hidden; }
	.service-box .service-img img{height:100%;}
	.service-box .service-img { height:317px; width: 42%; float: left;overflow:hidden }
	.service-box .service-text { width: 58%; float: right; padding:20px 20px; }
	.service-box .service-text p { margin:0 auto 20px; text-align:left;}
	.lees-btn{margin-top:15px;}
.contact-info{ padding:100px 0 60px; background: url(../fotomateriaal/contact-back.webp); background-position: center center; background-repeat: no-repeat;background-size: cover;
background-attachment: fixed;}
	.contact-info .contact_inner{ max-width:100%; margin:0 auto; background: rgba(255,255,255,0.9); padding: 75px 50px;}
	.contact-info .contact_inner p{margin:0 0 30px;}
	.contact-info h5 {font-size: 24px;}
/*ander pag*/
.telcont{font-size:36px;padding-bottom:50px}
.quote{padding:50px 0}
.quote p {display:inline-block; background: url("../fotomateriaal/quote.webp") no-repeat 10% 0%;}
.galerij figure {height: 199px;overflow: hidden;}
form.bloemen figure p{background-color:#fff}
select#overledenpersoon{
border-radius: 0px;
border: 1px solid;
height: 45px;
background-color: #fff;
padding: 5px;	
}
form#form_0 input{
height: 45px;
margin: 20px;
border-radius: 0px;
display: block;
width: 270px;
box-shadow: none !important;
color: #4a4d4e;
background-color: transparent;
border: 1px solid #4a4d4e;
}
.film {height: 400px;width: 100%;display: block;}
.rounded-pill{background: #e1dee6;}
.badge{color: #000;}
.accordion-button:not(.collapsed) {color: inherit;background-color:#ffffff}
.accordion-collapse.collapse.show{background-color: #FAF9F8}
.accordion-button:focus {border-color: #B5B2B8;box-shadow: 0 0 0 .25rem rgba(181,178,184,.25);
}

/**----Footer Css----**/
	footer {background: #b5b2b8; padding: 70px 0 80px; color: #fff;}
	footer p,	footer ul li,	footer a { 	color: #fff; text-decoration: none; line-height:22px; font-size: 18px; display: block; font-family:'Quattrocento Sans'; }
	footer ul{margin:0; padding:0;}
	footer ul li { padding: 0 0 0px; line-height: 24px; list-style: none;  }
	footer .ftr-left{padding-left:50px;}
	footer hr {margin-top:0}
	footer .ftr-left p:first-child{font-family:"Poppins";}
	footer ul li:hover a, footer a:hover{text-decoration:underline;color:#fff;}
	footer h5 {font-family: 'Quattrocento Sans'; color:#fff;  font-size: 18px; margin:0 0 10px; }
	#btn-back-to-top:hover {background-position: left bottom;} 
	#btn-back-to-top { position: fixed; bottom: 20px; right: 20px; display: none; 	background: url("../fotomateriaal/back-top-btn.png") no-repeat left top; 	text-indent: -999999px; 		transition: ease-in .3s all; 		z-index: 999; 	width: 47px; height: 47px; 	}

/* Responsive */

@media screen and (max-width: 1400px) {	
	.nav-link {font-size:16px;}
	h1,h2{font-size: 36px; line-height: 44px;}
	h1 {margin-bottom: 120px}
	.card h5 {font-size: 20px;}
	.alert-tekst { max-width: 90%; margin: 0 auto;padding: 15px;}
	.container {max-width: 100%; padding:0 25px;}
	.service-box .service-text {padding: 25px;}
	.service-box ,.service-box .service-img {  height: 360px;}
	h5.card-title {font-size: 19px;}
	.afscheidshuys ,.ons-sec { padding: 70px 0 70px; }
	.banner {height: 400px;}
	.galerij figure {height: 180px;overflow: hidden;}
	}
@media screen and (max-width: 1200px) {
	.nav-link {font-size: 18px;}
	.card h5 {font-size: 18px;}
	h4 { font-size: 22px; margin: 0 0 15px; line-height: 25px; }
	footer {padding: 70px 0px 0px;}
	footer h4 {margin: 20px 0 30px; font-size: 30px;}	
.navbar-toggler { display: block!important;}
	.navbar-collapse {flex-basis: 100%; flex-grow: 1; align-items: center;}
	.navbar { padding: 0;}
	.collapse.navbar-collapse {display: none !important;}
	.navbar-collapse.collapse.show {display: block !important;}
	.navbar-nav {display: block !important;padding:15px; }
	.menu_bx { background: #6d7275; width: 58.33333333%;}
	.nav-link{margin-bottom:10px}
	.navbar-expand-lg .navbar-nav .dropdown-menu { position: static; margin: 0 0 15px;}
	.navbar-toggler:focus {box-shadow: 0 0 0 0!important;}
	div#navbarSupportedContent { position: absolute; background: #7f8588; z-index: 999; top: 30px; left: 5px; width: 250px; }
	div#navbarSupportedContent  ul{display:block!important; margin:0; padding:10px 10px 0;}
	.top-header { padding: 15px 0;}
	h5.card-title {font-size: 23.2px; line-height:28px;}
	.card-body span {padding: 12px 0 0;}
	.info-box .info_text { 	font-size: 18px; 	line-height: 24px; 	padding: 20px 20px; 	margin:15px auto; 	}
	h1 , h2 {font-size: 40px;  margin: 0 auto 70px;    line-height:50px;}
	h3 {font-size: 30px;}
	h4 {font-size: 18px;}
	h6 { font-size: 24px; margin: 0 auto 30px; }
	.banner {height: 400px;}
	.contact-info .contact_inner { padding: 40px 20px;}
	.contact-info { padding: 40px 0 40px;    height:auto;}
	footer { padding: 40px 0 30px;}
	footer .row {padding-bottom:30px;}
	.service-box, .service-box .service-img {height: 425px;}
	.galerij figure {height: 165px;overflow: hidden;}
	.card-img-top { height: 266px;overflow: hidden;}
}
@media screen and (max-width: 1100px) {.card-img-top { height: 220px;overflow: hidden;}}
@media screen and (max-width: 992px) {	
	.links-ons img  {  width: 90%; margin:40px 0 40px 40px}
	.links-ons:before {  width: 90%; top:-40px; height: calc(100% - 40px); }
	.rechts-ons {padding-left: 0;}
	.service-box .service-img img {  display: block;    width: 100%;}
	footer .ftr-left {padding-left: 15px;}
	h4 { font-size: 22px;}
	.rouwberichten { padding: 70px 0 40px;}
	.galerij figure {height: 180px;overflow: hidden;}
	.card-img-top {height:350px;overflow:hidden}
	}
@media screen and (max-width: 768px) {	

	.info-box .info_text strong { font-size:24px; line-height: 30px; }
	h1::after, h2::after {margin-top: 15px;}
	h1, h2 { font-size: 36px; margin: 0 auto 40px; line-height: 40px; }
	.afscheidshuys, .ons-sec {padding: 40px 0 40px;}
	.service-box{height:auto; margin:0 auto 30px;max-width: 318px;}
	.service-box .service-img {  height: 250px;   float:none; width: 100%;}
	.service-box .service-text { padding: 15px; float: none; width: 100%; }
	.rouwberichten { padding: 40px 0 10px;}
	.galerij figure {height: 180px;overflow: hidden;}
	}

@media (max-width: 576px){
	.info-box .info_text strong { font-size: 20px; line-height: 26px; }
	.banner { height:260px; }
	.links-ons img { margin: 30px 0 30px 30px;}
	.links-ons:before { top: -30px;    height: calc(100% - 20px);}
	h1, h2 {font-size: 30px;   line-height: 32px;}
	.cont {position:relative;margin-top: 20px;margin-right: auto;margin-left: auto;}
	.banner { height:260px; }
	.galerij figure {height: 180px;overflow: hidden;}
	}
.website-check {
  position: absolute !important;
  left: -99999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}