/**
 * If using a CSS pre-processor, tell it to overwrite this file. If not, place
 * your custom CSS modifications here.
 */

 
 /*
 * Reset Bootstrap
 */
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, .well, .list-group-item {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	border: none;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.navbar-default {
	margin-top: 0;
	border: none;
	border-radius: 0;
	background: transparent;
}
.nav > li > a {
	padding: 0;
}
.nav > li > a:hover,
.nav > li > a:focus {
	background: transparent;
}
.nav-tabs > li > a {
	padding: .6rem 1rem;
}

.alert {
  border-radius: 0;
 }

.footer {
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 0;
  border-top: none;
 }


/* Bootstrap paragraphs */
.paragraph>.paragraph__column {
	padding: 0;
}
.paragraph>.paragraph__column h2 {
	margin-top: 2rem;
}
.paragraph--color--primary .paragraph__column {
	background: #B34923;
}

.paragraph--color--secondary .paragraph__column {
	background: #146243;
}
.paragraph--color .paragraph__column {
	padding-left: 30px !important;
	padding-right: 30px !important;
	margin-top: 30px;
	margin-bottom: 30px;
	
	color: #FFF;
}
.paragraph--color .paragraph__column h2,
.paragraph--color .paragraph__column a {
	color: #FFF;
}

.navbar.container, .navbar.container-fluid {
	margin-top: 0;
}


/*
	Default 
*/
body {
	font-family: source-sans-pro, sans-serif;
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 170%;
	color: #141A21;
}
h1, h2, h3, h4, h5, h6, .views-field-title {
	font-family: mundial, sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 15px;
	line-height: 140%;
}
h1 {
	font-size: 32px;
} 
h2, h3, h4, h5 {
	font-size: 26px;
}

.page-header {
	border: none;
	margin-bottom: 30px;
}
ul,
ol {
	margin-top: 10px;
	margin-bottom: 18px;
	margin-left: 24px;
}
small {
	font-size: 1.1rem;
	line-height: 100%;
}

.wrapper {
	width: 100%;
	padding: 6rem 1.6rem;
}
@media (min-width: 768px) {
	.wrapper {
		padding-left: 6rem;
		padding-right: 6rem
	}
	.region-afspraak,
	.region-postcontent,
	.region-content {
		padding-right: 16rem;
	}
}

.btn-cta,
.webform-button--submit,
body:not(.path-user) .button {
	font-family: mundial, sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	display: inline-block;
	padding: 8px 40px;
	font-size: 18px;
	border-radius: 50rem;
	border: 3px solid #B34923;
	background: transparent;
	color: #141A21;
	margin-top: 15px;
	transition: all .1s ease-in;
}
.btn-cta:hover,
.btn-cta:focus,
.webform-button--submit:hover,
.webform-button--submit:focus,
body:not(.path-user) .button.button:hover,
body:not(.path-user) .button.button:focus,
.menu--account li a:hover,
.menu--account li a:focus {
	color: #FFF;
	text-decoration: none;
	background: #B34923;
}
p {
	margin-bottom: .8rem;
 }
strong {
	font-weight: 700;
}

/*
	Navbar
*/
.navbar {
	min-height: auto;
	margin-bottom: 0;
}
.navbar-nav {
	margin: 0;
	margin-top: 1rem;
}
.navbar-collapse {
	padding: 0;
	border: none;
}
.navbar .menu--main > li > a {
	text-decoration: none;
	font-size: 15px;
	color: #141A21;
	padding: 10px 10px;
}
.navbar.container {
	margin-top: 0;
}
.navbar-header {
	box-shadow: none;
	padding-bottom: 1rem;
}
  

.navbar-default {
	background: #141A21;
	padding: 1.8rem 1.8rem;
}
@media (min-width: 768px) {
	.navbar-default {
		padding: 1.8rem 6rem;
	}
}

.logo {
	width: 18rem;
	margin: 0;
}

.navbar .menu--main > li > a {
	font-family: mundial, sans-serif;
	font-weight: 700;
	letter-spacing: 1px;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 1.1rem;
	color: #EDDED4;
	padding: 10px 15px;
}

@media (min-width: 768px) {
	.navbar .menu--main > li > a {
		transition: all .1s ease-in;
	}
	.navbar .menu--main > li > a:hover,
	.navbar .menu--main > li > a:focus,
	.navbar .menu--main > li > a.active-trail {
		color: #FFF !important;
		background: transparent !important;
	}
}
@media (min-width: 1200px) {
	.navbar .menu--main {
		float: right;
	}
}

/* Mobile nav */
@media (max-width: 767px) {
	.navbar-toggle {
		margin-top: 48px;
	}
	.navbar .navbar-default .navbar-nav {
		margin-top: 20px;
	}
	.navbar .navbar-default .navbar-nav > li,
	.navbar .menu--header-menu li {
		margin-bottom: 14px;
	}
	.navbar .navbar-default .navbar-nav > li > a,
	.navbar .menu--header-menu li a {
		text-decoration: none;
		font-weight: 400;
		color: #FFF;
		padding: 6px 8px;
	}
	.navbar .menu--header-menu {
		border-top: 1px solid #141A21;
		padding-top: 20px;
		margin-top: 20px;
	}
	.dropdown-backdrop {
		display: none;
	}
}
@media (max-width: 460px) {
	.navbar-toggle {
		margin-top: 11px;
		margin-right: 8px;
	}
	.logo {
		width: 15rem;
	}
}

/*
	Hero
*/
.wrapper.hero {
	padding: 0;
}
.hero, .hero h1 {
	color: #FFF;
}
.hero .views-row {
	position: relative;
	min-height: 50vh;
	height: 100%;
	display: flex;
	padding: 6rem 1.8rem 4rem;
	flex-direction: column;
	justify-content: center; /* Centers the content vertically */
}
@media (min-width: 768px) {
	.hero .views-row {
		padding: 6rem 6rem 4rem;
	}
}
.path-frontpage .hero .views-row {
	min-height: 90vh;
}
.page-node-type-specialiteiten .hero .views-row,
.page-node-type-team .hero .views-row {
	background: #EDDED4;
	color: #141A21;
}
.hero .views-row .field-content {
	height: 100%;
}

.hero .views-field-title,
.hero .views-field-field-intro,
.hero .views-field-field-opleiding,
a {
	position: relative;
	display: inline-block;
	z-index: 1;
	text-align: left; /* Align the text to the left */
	max-width: 66rem; /* Optional: Limit the width of the content */
	word-wrap: break-word;
	word-break: break-word;
	hyphens: auto;
}
.hero .views-field-title {
	font-size: 2rem;
	letter-spacing: 2px;
	margin-bottom: 2px;
}
.hero .views-field-field-functie {
	color: #141A2180;
}
.hero .views-field-field-intro {
	font-size: 1.5rem;
}

.hero .views-field-field-image,
.hero .views-field-field-foto {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}
.hero .views-field-field-image::before,
.hero .views-field-field-foto::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4); /* 60% dark overlay */
}
.hero .views-field-field-image img,
.hero .views-field-field-foto img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	max-height: 100%;
}

/*
	Content
*/
.views-element-container h2,
.block-block-content h2,
.prefooter .region-prefooter h2,
.postcontent .region-postcontent h2,
.content .field--label {
	font-size: 2.4rem;
	color: #141A21;
	margin-bottom: 4rem;
	text-transform: uppercase;
}
.content .field--label {
	margin-bottom: 1rem;
}

/* Home */
.path-frontpage .wrapper.content {
	display: none;
}

.content .field a,
.specialiteiten li a {
	color: #141A21;
	border-bottom: 1px solid #141A2150;
	text-decoration: none;

	transition: all .1s ease-in;
}
.content .field a:hover,
.content .field a:focus,
.specialiteiten li a:hover,
.specialiteiten li a:focus {
	border-bottom: 1px solid #141A21FF;
}

/* Home: Specialiteiten */
@media (min-width: 992px) {
	.specialiteiten ul {
	    column-count: 3;
	    column-gap: 2rem;
		column-fill: balance;
	}
}
.specialiteiten ul {
	padding: 0;
	margin: 0;
	list-style: none;
}
.specialiteiten ul li {
	display: inline-block;
	padding-bottom: .6rem;
    width: 100%;
}

/* Home: Team */
.view-team [class*="col-"] {
	text-align: center;
	display: inline-block;
	margin-bottom: 4rem;
	padding-right: 15px;
}
@media (min-width: 768px) {
	.view-team [class*="col-"] {
		padding-right: 2rem;
	}
}

.view-team .view-header {
	margin-bottom: 75px;
}
.view-team .views-field-field-foto img {
	border-radius: 50%;
	margin-bottom: 30px;
}
.view-team .views-field-title {
	font-size: 1.4rem;
	margin-bottom: 2px;
}
.view-team .views-field-field-functie {
	color: #141A2180;
}
.view-team .views-field-view-node a {
	color: #141A21;
	padding: 12px 0 0;
	display: inline-block;
	border-bottom: 1px solid #141A2150;
	
	transition: .1s all ease-in;
	text-decoration: none;
}
.view-team .views-field-view-node a:hover,
.view-team .views-field-view-node a:focus {
	color: #141A21;

	border-bottom: 1px solid #141A21FF;
}

/*
	Team
*/
.page-node-type-team .main-container .field {
	margin-bottom: 6rem;
}
.page-node-type-team .content .field img {
	width: 400px;
	border-radius: 50%;
	margin-bottom: 60px;
}
@media (min-width: 768px) {
	.page-node-type-team .field--name-field-specialiteiten .field--items {
		margin-top: 10px;
	    column-count: 2;
	    column-gap: 30px;
	}
}
.page-node-type-team .field--name-field-specialiteiten .field--item {
	display:inline-block;
	padding-bottom: .6rem;
	width: 100%;
}


/*
	Domeinen
*/
.domeinen.wrapper {
	background: #EDDED4;
}	
.view-domeinen [class*="col-"] {
	margin-bottom: 5rem;
	padding-left: 0;
	padding-right: 0;
}
@media (min-width: 768px) {
	.view-domeinen [class*="col-"] {
		padding-right: 2rem;
	}
}
.view-domeinen .views-field-title {
	font-size: 24px;
	margin-top: 2rem;
	margin-bottom: 1rem;
}
.view-domeinen .views-field-field-intro {
	margin-bottom: 1rem;
}

.node--type-domeinen .field--name-field-foto {
	margin-bottom: 25px;
}


/*
	Afspraak
*/
.afspraak.wrapper {
	background: #146243;
	color: #FFF;
}

.region-afspraak {
  display: grid;
  grid-template-columns: repeat(2, [col-start] 1fr);
  grid-template-rows: auto;
  column-gap: 30px;
}
.region-afspraak h2 {
	color: #FFF;
}
.region-afspraak .field a {
	color: #FFF;
	border-bottom: 1px solid #FFFFFF80;
	text-decoration: none;

	transition: all .1s ease-in;
}
.region-afspraak .field a:hover,
.region-afspraak .field a:focus {
	border-bottom: 1px solid #FFFFFFFF;
}

#block-afspraakmakencta {
	grid-column: col-start / span 2;
}
#block-eersteafspraak {
	grid-column: col-start 1 / span 1;
}
#block-annulerenofverplaatsen {
	grid-column: col-start 2 / span 1;
}
@media (max-width: 991px) {
	#block-eersteafspraak {
		grid-column: col-start 1 / span 2;
	}
	#block-annulerenofverplaatsen {
		grid-column: col-start 1 / span 2;
	}
	#block-eersteafspraak {
		margin-bottom: 30px;
	}
}

#block-afspraakmakencta {
	margin-bottom: 3rem;
}

#block-eersteafspraak,
#block-annulerenofverplaatsen {
	padding: 3rem;
	border: 1px solid #FFF;
	border-radius: 2rem;
}
#block-eersteafspraak h2,
#block-annulerenofverplaatsen h2 {
	font-size: 1.6rem;
	margin-bottom: 1rem;
}

/*
	Post Content
*/
.wrapper.postcontent {
	padding: 6rem 1.6rem;
}
@media (min-width: 768px) {
	.wrapper.postcontent {
		padding: 6rem 6rem;
	}
}

/*
	Prefooter
*/
.prefooter.wrapper {
	padding: 6rem 1.6rem;
	background: #EDDED4;
}
@media (min-width: 768px) {
	.prefooter.wrapper {
		padding: 6rem 6rem;
	}
}

/*
	Footer
*/
.footer {
	background: #141A21;
	color: #EDDED4;
}
.footer h2 {
	font-size: 1.8rem;
	color: #EDDED4;
	margin-bottom: 15px;
	text-align: left;
}
.footer img {
	width: 100%;
	height: auto;
	max-width: 20rem;
}
.footer ul{
	margin: 0;
}
.footer ul.menu li {
	display: block;
	float: none;
	margin-bottom: 10px;
}
.footer ul.menu li:last-of-type {
	margin-bottom: 0;
}
.footer ul.menu li a,
.footer .region a:not(.btn-cta) {
	color: #EDDED4;
	color: #EDDED4;
	border-bottom: #EDDED480 1px solid;
	text-decoration: none;
	transition: all .1s ease-in;
}
.footer ul.menu li a:hover,
.footer ul.menu li a:focus,
.footer .region a:not(.btn-cta):hover,
.footer .region a:not(.btn-cta):focus {
	color: #EDDED4;
	border-bottom: #EDDED4FF 1px solid;
}
.footer .navbar-nav {
	margin: 0;
}

.footer .btn-cta {
	color: #EDDED4;
}

@media (max-width: 991px) {
	.footer .region-footer-second,
	.footer .region-footer-third,
	.footer .region-footer-fourth {
		margin-top: 30px;
	}
	.footer ul.menu {
		margin-top: 10px;
	}
}


/*
	Postfooter
*/
.wrapper.postfooter {
	background: #141A21;
	color: #EDDED4;
	padding: 1rem 2rem;
}
@media (min-width: 768px) {
	.wrapper.postfooter {
		padding: 1rem 6rem;
	}
}
.postfooter a {
	text-decoration: none;
	display: inline-block;
}
.postfooter ul {
	margin: 0;
}
.postfooter ul.menu li,
.postfooter .field--name-body ul li {
	font-size: 1.1rem;
	display: inline-block;
	margin-right: 30px;
}
.postfooter ul li a {
	line-height: 110%;
	color: #EDDED4;
	border-bottom: #EDDED480 1px solid;
	display: inline-block;
	transition: all .1s ease-in;
}
.postfooter ul li a:hover,
.postfooter ul li a:focus {
	color: #EDDED4;
	border-bottom: #EDDED4FF 1px solid;
}
@media (min-width: 768px) {
	.region-postfooter-second {
		text-align: right;
	}
}
@media (max-width: 767px) {
	.region-postfooter-second {
		margin-top: 15px;
	}
	.postfooter ul.menu li,
	.postfooter .field--name-body ul li {
		display: block;
		margin-right: 0;
	}
}


/*
 * Cookie compliance banner
 */
#sliding-popup{
	width:100%;
	padding:45px 0 30px 0;
	background:rgba(46,52,64,.9);
	color:#FFF;
	box-shadow:0 -2px 4px rgba(0,0,0,.2);
}
#popup-text {
	max-width:100% !important;
}
#popup-text h2 {
	margin:0;
	font-size:21px;
	text-transform: none;
	font-weight: normal;
	color: #FFF;
}
#popup-text p {
	font-size:16px;
}
#popup-buttons button {
	display: inline-block;
	padding: 8px 40px;
	font-size: 16px;
	border-radius: 0;
	border: 1px solid #FFF;
	background: transparent;
	color: #FFF;
	margin-top: 15px;
	transition: all .1s ease-in;
}
#popup-buttons button:hover,
#popup-buttons button:focus {
	color: #141A21;
	text-decoration: none;
	background: #FFF
}
#popup-buttons button.decline-button,
button.find-more-button {
	background:transparent;
	border:none;
	border-radius:0;
	color:#FFF;
	text-transform:none;
	font-size:14px;
	text-decoration: underline;
	margin-top:10px;
	padding:4px 12px;
}
button.find-more-button,
button.find-more-button:hover,
button.find-more-button:focus {
	font-size: 15px;
	padding: 0;
	margin-bottom: 10px;
	margin-top: 10px;
	background: transparent;
	text-decoration: underline;
}
#popup-buttons {
	float:none !important;
	text-align:left;
}
@media (max-width:991px) {
	#sliding-popup{
		padding:45px 0 90px 0;
	}
	#popup-text{
		max-width:100% !important;
	}
	#popup-buttons {
		float:none !important;
		text-align:left;
	}
}