/* Standard style */

@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,700;1,400;1,700&display=swap');

:root {
	--mainColor: #23398B;
	--mainHoverColor: #111C46;
	--secondaryColor: #EA5D0B;
	--secondaryHoverColor: #993706;
	--fontColorLight: #fff;
	--fontColorDark: #212529;
	--focusShadowRGB: 133,182,253;
	--focusSecondaryShadowRGB: 255,134,62;
	--alertColor: #FF534E;
	--okayColor: #29A746;
	--darkOrLightSade: 0,0,0;
	--imageFilter: brightness(0) invert(0);
	--imageFilterInvert: brightness(0) invert(1);
}

html {
	line-height: 1.5;
}

html, body {
	position: relative;
	font-family: Rubik,"Helvetica Neue",Helvetica,Arial,sans-serif;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-align: left;
	margin: auto;
	overflow-y: auto;
	overflow-x: hidden;
	width: 100%;
	height: 100%;
	font-size: 15px;
}

.hidden {
	visibility: hidden;
	display: none;
}

.main-wrapper {
	display: flex;
	flex-direction: column;
	position: relative;
	padding: 0;
	height: 100%;
	min-height: 100vh;
}

.main-wrapper.hp.landing-page {
	background-color: #f5f5f5;
}

.bg-image {
    background-color: #999;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
	width: 100%;
}

.bg-secondary-l-light {
	background-color: #adb5bd;
}

.bg-secondary-m-light {
	background-color: #dee2e6!important;
}

.bg-secondary-light,
.file-upload.vp:focus {
	background-color: #f1f1f1;
}

#ViewMessagesModal .row {
	max-height: 50vh;
}

.highlight {
	background: var(--mainColor);
	color: var(--fontColorLight);
}

@media only screen and (max-device-width: 800px) {
	.show-mobile-800 {
		display: block;
	}
	.hide-mobile-800 {
		display: none;
	}
}

@media only screen and (min-device-width: 801px) {
	.show-mobile-800 {
		display: none;
	}
	.hide-mobile-800 {
		display: block;
	}
}

/* bootstrap, you missed one: */
.user-select-text {
	user-select: text;
}

/* Generic info dialog in home page START */
.genericPopUpBackground {
	background-color: var(--secondaryColor);
	color: var(--fontColorLight);
}

.genericPopUpBackground .btn-close {
	background: transparent url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'><path d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/></svg>") center/1em auto no-repeat
}
/* Generic info dialog in home page END */

h1, h2, h3, h4, h5, h6 {
	word-break: break-word;
}

h4 .glyphicon {
	font-size: 14px;
}

a {
	transition: all .0s;
	text-decoration: none;
}

.btn-default,
.btn-primary,
.btn-secondary,
.btn-success,
.btn-danger,
.btn-warning,
.btn btn-info,
.btn btn-light,
.btn btn-dark,
.btn-next,
.btn-link-default {
	border: 0;
}

.btn-next {
    --bs-btn-color: var(--fontColorLight);
    --bs-btn-bg: var(--secondaryColor);
    --bs-btn-border-color: var(--secondaryColor);
    --bs-btn-hover-color: var(--fontColorLight);
    --bs-btn-hover-bg: var(--secondaryHoverColor);
    --bs-btn-hover-border-color: var(--secondaryHoverColor);
    --bs-btn-focus-shadow-rgb: var(--focusSecondaryShadowRGB);
    --bs-btn-active-color: var(--fontColorLight);
    --bs-btn-active-bg: var(--secondaryHoverColor);
    --bs-btn-active-border-color: var(--secondaryHoverColor);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--fontColorLight);
    --bs-btn-disabled-bg: var(--secondaryColor);
    --bs-btn-disabled-border-color: var(--secondaryColor);
}

.btn-default {
    --bs-btn-color: var(--fontColorLight);
    --bs-btn-bg: var(--mainColor);
    --bs-btn-border-color: var(--mainColor);
    --bs-btn-hover-color: var(--fontColorLight);
    --bs-btn-hover-bg: var(--mainHoverColor);
    --bs-btn-hover-border-color: var(--mainHoverColor);
    --bs-btn-focus-shadow-rgb: var(--focusShadowRGB);
    --bs-btn-active-color: var(--fontColorLight);
    --bs-btn-active-bg: var(--mainHoverColor);
    --bs-btn-active-border-color: var(--mainHoverColor);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--fontColorLight);
    --bs-btn-disabled-bg: var(--mainColor);
    --bs-btn-disabled-border-color: var(--mainColor);
}

.btn-outline-default {
    --bs-btn-color: var(--mainColor);
    --bs-btn-border-color: var(--mainColor);
    --bs-btn-hover-color: var(--fontColorLight);
    --bs-btn-hover-bg: var(--mainColor);
    --bs-btn-hover-border-color: var(--mainColor);
    --bs-btn-focus-shadow-rgb: var(--focusShadowRGB);
    --bs-btn-active-color: var(--fontColorLight);
    --bs-btn-active-bg: var(--mainColor);
    --bs-btn-active-border-color: var(--mainColor);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--mainColor);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--mainColor);
    --bs-gradient: none;
}

.btn-link-default {
    --bs-btn-color: var(--mainColor);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: var(--mainHoverColor);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: var(--mainHoverColor);
    --bs-btn-active-border-color: transparent;
    --bs-btn-disabled-color: #6c757d;
    --bs-btn-disabled-border-color: transparent;
    --bs-btn-box-shadow: none;
    --bs-btn-focus-shadow-rgb: var(--focusShadowRGB);
    text-decoration: underline;
}

.text-capitalize-first:first-letter {
  text-transform: capitalize
}

.object-fit-cover {
	object-fit: cover;
}

.w-33 {
	width: 33.3% !important;
}

.company-info iframe {
	width: 100%;
}

.line-bottom {
	background-color: var(--mainColor);
	margin-bottom: 2rem;
	display: block;
	width: 50px;
	height: 4px;
}

tr.dir-paginate:hover
 {
	color: #337ab7;
}

.home-cta-title,
footer .footer-top-bg,
.pColorBg,
.pagination .active>.page-link,
.steps-line,
.fancybox__progress  {
	background-color: var(--mainColor);
	color: var(--fontColorLight);
}

.pagination .active>.page-link {
	border-color: var(--mainColor);
}

footer .footer-bottom-bg,
#wizard-content-container button.selected,
#wizard-content-container .quick-choice .wrapper .choice .panel-heading:hover {
	background-color: var(--mainHoverColor);
	color: var(--fontColorLight);
}

h4,
.hp h3,
a,
a:focus,
.umbraco-forms-fieldset legend,
.form-group h2,
.pColor,
.page__header,
.pagination :not(.disabled):not(.active) .page-link {
	color: var(--mainColor);
}

p a:not(.btn) {
	font-weight: bold;
	text-decoration: underline;
}

a:hover,
.contactmoments__list-item a {
	color: var(--fontColorDark);
}

a:focus-visible {
	z-index: 0;
}

.ezsearch-message p {
	margin: 0;
}

.reparatie-panel .header, .list__item {
	margin-left: 15px;
}

.accordion {
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23111C46'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	--bs-accordion-btn-focus-border-color: var(--mainColor);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--focusShadowRGB), 0.25);
    --bs-accordion-active-color: var(--mainHoverColor);
}

.accordion .button-toolbar {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    border: 0;
    border-radius: 0;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,border-radius .15s ease;
}

.search .accordion-button:after {
    order: -1;
    margin-left: 0;
    margin-right:0.5em;
}

.search .accordion-button.collapsed::after {
	transform: rotate(-90deg);
}

.accordion .show-more.ng-hide {
	opacity: 0;
}

.accordion .show-more.ng-hide-add,
.accordion .show-more.ng-hide-remove {
	transition: all linear 0.5s;
}

@media (max-width: 575.98px) {
	.accordion .button-toolbar {
		display: block;
	}
	.accordion .button-toolbar .btn {
		margin-bottom: 0.5rem;
	}
	.accordion.search-profiles .accordion-button .flex-column {
		width: 60%;	
	}
	.accordion iframe {
		max-width: 100%;
	}
}

.accordion.search-profiles .form-switch {
	z-index: 3;
	right: 3rem;
}

.short-description {
	max-height: 100px;
}

/* Forms */

.form-check-input:checked {
    background-color: var(--mainColor);
    border-color: var(--mainColor);
}

.form-check-input:focus {
    border-color: var(--mainColor);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(var(--focusShadowRGB), 0.5);
}

.form-switch .form-check-input:not(:checked):focus {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
}

form.needs-validation .generic-feedback {
	margin-top: -0.75rem;
}

.field-validation-error {
	color: var(--alertColor);
	font-weight: bold;
}

.field-validation-spacing {
	margin-top: 10px;
}

.validation-summary-errors ul li {
	color: var(--alertColor);
	font-weight: bold;
}

.b-c-current {
	border-color: currentColor !important;
}

.table-striped div.alert {
	width: 100%;
	margin-top: 0;
	margin-bottom: 0;
}

.table.table-striped.details > tbody > tr > th {
	font-weight: unset;
}

.div-striped div {
	padding: 8px;
	border-top: 1px solid #ddd;
}


tr.head,
.div-striped .head {
	border-bottom: 1px solid #ddd;
	border-top: 0;
	font-weight: bold;
	font-size: 16px;
	margin-top: 1em
}

.div-striped .item:nth-of-type(even) {
	background: #f9f9f9;
}


.no-padding {
	padding-left: 0px;
	padding-right: 0px;
}

@media (max-width: 767.98px) {
	.table {
		font-size: 13px;
	}

	.table-striped .w-m-40 {
		width: 35% !important;
	}

	.table-striped w-m-60 {
		width: 65% !important;
	}
}

.text-uppercase {
	text-transform: uppercase;
}

section {
	padding-bottom: 15px;
	padding-top: 15px;
}

section.grid-content {
	margin: 1em 0;
}

.hp .breadcrumb li:first-child,
.hp .breadcrumb li:nth-child(2):before {
	display: none;
}

.hp .breadcrumb li:nth-child(2) {
	padding-left: 0;
}

.page__header {
	margin-top: 20px;
}

.page__header.welcome {
	margin-top: 0;
	margin-bottom: 0;
}

.content-page img,
.search img {
	max-width: 100%;
	height: auto;
}

.inline {
	display: inline-block;
}

.xform-control {
	border-radius: 0;
	height: 32px;
}

.form-group {
	margin-bottom: 2em;
}

.themeBorderBlock {
	display: inline-block;
	color: var(--fontColorLight);
}

.well {
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	background-color: #fefefe;
	border-color: #f3f3f3;
	line-height: 170%;
}

	.well h5 {
		margin-top: 0;
	}

.zaken ul.list-unstyled li:before {
	display: none;
}

.zaken ul {
	list-style: none;
	padding: 0;
	margin-left: 0,5em;
}

.zaken li:before {
	font-family: "Glyphicons Halflings";
	font-size: 10px;
	content: "\e080";
	padding-right: 5px;
}

.zaken li.Afgerond:before, .glyphicon-ok {
	content: "\e013";
	color: green;
}

.dropdown-menu > li > a {
	padding: 8px 20px;
}

.dropdown-item.active,
.dropdown-item:active {
	background-color: #e9ecef;
}

@media (max-width: 991.98px) {
	.navbar-collapse {
		margin-top: 0.5rem;
	}
	.navbar .dropdown-toggle,
	.navbar .logout-button {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.navbar .search {
		margin-bottom: 0.5rem;
	}
	.navbar .dropdown-menu {
		float: none;
		box-shadow: none;
		border-radius: 0;
		margin: 4px 0 0 0;
	}
	.navbar .nav-link.dropdown-toggle.show,
	.navbar .dropdown-menu .nav-item {
		border-bottom: 1px solid #dee2e6;
		transition: width .5s ease, background-color .5s ease;
	}
	.navbar .dropdown-menu .nav-item a {
		white-space: normal;
		padding: 8px 0;
	}
	.card-icon .fa-exclamation-circle {
		font-size: 1.25rem;
	}
}

.navbar .search input {
	border: none;
    border-radius: 0;
    border-bottom: 1px solid var(--fontColorDark);
}

.navbar .navbar-toggler {
	border-color: var(--fontColorDark);
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 0.15rem;
}

.navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 05%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}

.dropdown-menu {
	padding: 0;
	border: 0;
	font-size: 14px;
	background-color: var(--fontColorLight);
	-webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
	box-shadow: 0 6px 12px rgba(0,0,0,.175)
}

.navbar-expand-lg .navbar-nav .level__2.ms-auto.dropdown-menu {
	min-width: 100%;
	z-index: 1030; /* because bootstrap adds a z-index of 1020 to sticky-top */
}

.estimation-wrapper .accordion-button::after {
	display: none;
}

.estimation-wrapper .accordion-button::before {
	color: var(--fontColorLight);
    flex-shrink: 0;
    width: var(--bs-accordion-btn-icon-width);
    height: var(--bs-accordion-btn-icon-width);
	margin-right: 0.5rem;
    content: "";
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: var(--bs-accordion-btn-icon-width);
    transition: var(--bs-accordion-btn-icon-transition);
}

.estimation-wrapper .accordion-button:not(.collapsed)::before {
    transform: rotate(90deg);
}

.estimation-wrapper .accordion-button:focus {
    border-color: #fe86ae;
    box-shadow: 0 0 0 0.25rem rgb(81 85 88 / 43%);
}

.estimation-wrapper .accordion-button:hover,
.estimation-wrapper .accordion-button:not(.collapsed) {
	background-color: #444!important;
}

.listsection input {
	display: none;
}

.listsection label {
	color: #eee;
	display: block;
	cursor: pointer;
	position: relative;
	padding: 12px 0 12px 42px;
	border-radius: 2px;
	background: #666;
	margin-bottom: 2px;
}

.three .listsection label:hover {
	background: #444;
	color: var(--fontColorLight);
}

.listsection input:checked + label {
	background: #444;
}

.listsection label::after {
	content: "\f054";
	font-family: fontawesome;
	font-size: 14px;
	position: absolute;
	left: 0;
	top: 0;
	padding: 12px 12px;
	color: var(--fontColorLight) !important;
}

.listsection input:checked + label::after {
	content: '\f078';
}

.listsection label + .content {
	display: none;
}

	.listsection label + .content .innercontent {
		padding: 12px 10px;
	}

.listsection input:checked + label + .content {
	display: block;
	position: relative;
	margin: 0 0 5px 0;
	border-radius: 2px;
	border: 1px solid #ccc;
}

.flright {
	float: right;
	padding: 0 12px;
}

.fw-50 {
	min-width: 50px;
}

.tar {
	text-align: right;
}

/* Header carousel & gallery carousel */
.carousel .carousel-indicators-toolbar button:focus,
.carousel .carousel-indicators-toolbar button:focus-visible,
.carousel button[class^="carousel-control"]:focus > span,
.fancybox__container button:focus,
body:not(.is-using-mouse) .fancybox__container :focus,
.fancybox__thumbs .carousel__slide .fancybox__thumb::after {
	box-shadow: 0 0 0 2px var(--mainColor), 0 0 0 3px #ffffff;
	outline: 0;
}
.fancybox__container .carousel__dots {
	top: 100%;
}

.carousel-indicators-toolbar {
	position: absolute;
    right: 0;
    bottom: 3rem;
    left: 0;
    z-index: 15;
    display: flex;
    justify-content: center;
}

.carousel .carousel-caption {
	width: auto;
	top: 47%;
	padding-top: 0;
	padding-bottom: 0;
	text-align: left;
	align-items: flex-start;
	flex-direction: column;
	display: none;
	transform: translateY(-50%)!important;
}

.carousel img.overlay {
	position: absolute;
	width: 30%;
	height: 50%;
	top: 0px;
	right: 0px;
	background-size: cover;
	background-position: center center;
}

.carousel .carousel-item > img {
	object-fit: cover;
}

.content-header {
	position: relative;
	height: 175px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}

.content-header .itemContent {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}

.themeBorderBlock {
	background-color: rgb(0 0 0 / 0.5);
    padding: 0.2em 0.5em;
    border-radius: 0.5rem;
}

.content-header .itemSubtitle {
	line-height: 1.4;
	font-size: 28px;
}

/* Top Bar START */
.warning-section {
	background: #f1f1f1;
	padding: 10px 0;
}

@media (max-width: 991.98px) {
	.warning-section .row div[class^=col]:first-child {
		font-size: 12px;
		line-height: 2;
	}
}
/* Top Bar END */

/* Navbar */
.navbar a:not(.btn) {
	color: var(--fontColorDark);
}

.navbar-brand {
	padding: 0 10px 0 0;
}

.dropdown .dropdown #span-button {
	display: none;
}

.goog-te-gadget .goog-te-combo {
	width: 100%;
	height: 30px;
	margin: 9px 0px !important;
}

#goog-gt-tt .middle div.original-text, .gt-hl-layer { /*more specific then google*/
	text-align: unset !important;
}

/*  Footer START */
footer *,
footer *:hover,
footer *:focus {
	color: var(--fontColorLight);
}

footer a:hover {
	text-decoration: underline;
}

footer .footer-top-bg {
	padding: 20px 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

@media (min-width: 768px) {
	footer .footer-bottom-bg .row div:last-child {
		text-align: right;
	}
}

footer .contact-information {
	font-size: 14px;
}

footer .contact-information .contact-title {
	font-weight: bold;
	padding-bottom: 2px;
}

footer .footer-bottom-bg {
	font-size: 13px;
}

footer .footer-bottom-bg .row a {
	padding-right: 10px;
}

footer .footer-bottom-special {
	color: var(--fontColorLight);
}

footer .sitemap .menu--has-child > .menu__item--link {
	font-size: 20px;
	margin-bottom: 0.3rem;
	display: inline-block;
}
/*  Footer END */

/* Template: Property/Project Overview */

.project-form {
	color: unset;
}

.property-area .property-item .property-info p strong {
	font-weight: normal;
}

.property-detail .news-footer {
	border-top: 1px dashed #dee2e6;
}

.property-detail .property-media {
	-webkit-column-count: 4;
	-moz-column-count: 4;
	column-count: 4;
	-webkit-column-gap: 1rem;
	-moz-column-gap: 1rem;
	column-gap: 1rem;
}

.property-detail .property-media .property-media-tile {
	margin-bottom: 1rem;
	transition: all .3s ease;
}

.property-detail .property-media .property-media-tile:hover {
	transform: scale(1.01);
}
.property-detail .summary {
	font-style: italic;
}
.bg-image-thumbnail {
	background-repeat: no-repeat;
	background-size: cover;
	height: 200px;
	-webkit-backface-visibility: hidden;
}

@media all and (max-width: 1024px) {
	.property-detail .property-media {
		-webkit-column-count: 3;
		-moz-column-count: 3;
		column-count: 3;
	}
}

@media all and (max-width: 768px) {
	.property-detail .property-media {
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
	}
}

@media all and (max-width: 480px) {
	.property-detail .property-media {
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 2;
	}
}

/* Template: News Overview */

.featured-news {
	color: #173C7F;
}

	.featured-news ul {
		list-style: none;
		padding: 0;
	}

	.featured-news .featured-intro {
	}

	.featured-news h3, .homepage-title {
		color: #f1662f;
		margin-top: 0;
	}

.homepage-title {
	font-size: 22px;
}

.featured-news .read-more {
	color: #b62f24;
	text-decoration: underline;
}

.featured-news .news-img {
	width: 200px;
	float: left;
	margin: 0 15px 14px 0;
}

.message-area {
	border: 1px solid #EDEDED;
	padding: 8px 20px 0 20px;
}

.message-area .message-item {
	border-bottom: 1px solid #EDEDED;
	padding: 6px 0;
}

/* Component HP Landing page CTA */

.hp.landing-page main {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

@media (min-width: 992px) {
	.hp.landing-page main {
		height: 90vh;
	}
}

.hp.landing-page h1 {
	color: var(--mainColor);
	margin-top: 20px;
}

.hp.landing-page .cta-tiles .cta-content {
	display: flex;
	flex-flow: column nowrap;
	background-color: #fff;
	word-break: break-word;
	padding: 2em;
	height: 100%;
}

.hp.landing-page .cta-tiles .cta-content .icon {
	color: var(--mainColor);
	font-size: 4em;
	margin-bottom: 2rem;
}

.hp.landing-page .cta-tiles .cta-content h4 {
	font-weight: bold;
}

.hp.landing-page .cta-tiles .cta-content a:not(:last-child) {
	margin-bottom: 0.5em;
}

.hp.landing-page .btn-next {
	align-self: center;
	padding: 5px 28px !important;
	margin: 0;
	white-space: inherit;
}

@media (max-width: 991px) {
	.hp.landing-page .cta-tiles > div {
		margin-bottom: 2em;
	}
}

/* Component home CTA */
.home-cta-title {
	padding: 15px;
	font-size: 20px;
}

.home-cta .container > .row {
	position: relative;
	margin-top: -3rem;
	color: var(--fontColorLight);
}

.home-cta .cta-content {
	display: flex;
	align-items: center;
	padding: 1rem;
}

@media (min-width: 1200px) {
	.home-cta .cta-content {
		flex-direction: column;
		padding: 1.5rem;
	}
	.home-cta .cta-content .fa {
		font-size: 4em;
	}
}

.home-cta-all-cells > div:not(.home-cta-title) {
	transition: all .3s;
	height: auto !important;
}

.home-cta-all-cells > div:not(.home-cta-title):hover {
	transform: scale(1.05);
	z-index: 9999;
}

.home-cta-all-cells .cta-0 {
	background: var(--mainColor);
}

.home-cta-all-cells .cta-1 {
	background: linear-gradient(to top,rgba(var(--darkOrLightSade),calc(20 * 0.01)),rgba(var(--darkOrLightSade),calc(20 * 0.01)))var(--mainColor);
}

.home-cta-all-cells .cta-2 {
	background: linear-gradient(to top,rgba(var(--darkOrLightSade),calc(35 * 0.01)),rgba(var(--darkOrLightSade),calc(35 * 0.01)))var(--mainColor);
}

.home-cta-all-cells .cta-3 {
	background: linear-gradient(to top,rgba(var(--darkOrLightSade),calc(55 * 0.01)),rgba(var(--darkOrLightSade),calc(55 * 0.01)))var(--mainColor);
}

.home-cta .cta-content p {
	margin: 0;
	font-size: 15px;
}

.home-cta .cta-content .btn {
	border: 1px solid var(--fontColorLight);
}

.home-cta-all-cells * {
	color: var(--fontColorLight);
}

@media (max-width: 1199.98px) {
	.home-cta-all-cells {
		margin-right: 0.05rem;
	}
}

.home-cta .shortlinks li {
	padding: 0.65em 1em;
}

.home-cta .shortlinks li a {
	color: var(--fontColorDark);
}

/*hovering when there is no button*/
.cta-cell {
	display: inline-block;
	vertical-align: middle;
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: box-shadow;
	transition-property: box-shadow;
}


.cta-cell:hover, .cta-cell:focus, .cta-cell:active {
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}

/* Component home news */
.home-news-item {
	transition: all .3s;
	display: flex;
	align-items: center;
	margin-bottom: 0.5rem;
}

.home-news-item:hover {
	transform: scale(1.05);
}

.home-news-item-content p {
	display: none;
}

.home-news-item img {
	width: 100px;
	height: 90px;
	object-fit: cover;
}

.home-news-item-content * {
	color: var(--fontColorDark);
}

.home-news-item-content h4 {
	font-size: 1.2em;	
}

.home-news .card:hover {
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    z-index: 1;
}

/* Component: Subnavigation */
.sub-navigation img {
	height: 200px;
	object-fit: cover;
}

/* Component: Steps */
.steps-line {
	position: absolute;
	left: 50%;
	height: 100%;
	width: 2px;
}

/* Component: CTAs */
.tile {
	position: relative;
	border-radius: 0.375rem;
	padding: 15px;
	color: var(--fontColorLight);
	transition: all .3s;
	min-height: 130px;
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.tile:hover {
	transform: scale(1.05);
	background-color: var(--mainHoverColor);
}

	@media (max-width: 767.98px) {
		.hp .dynamic-dashboard .dashboard-container  > .row {
			flex-direction: column-reverse;
		}
	}

	.hp .dashboard-filter .filter-results a:hover {
		color: var(--mainColor);
	}

	.hp .dashboard-filter {
		margin: 1em 0;
		position: relative;
	}

	.hp .filter-backdrop {
		background-color: #00000063;
		position: initial;
	}

	.hp .filter-backdrop .no-interaction {
		position: relative;
		z-index: -1;
	}

	.hp .dashboard-filter .filter-results {
		position: absolute;
		z-index: 1;
		width: 100%;
	}

	.hp .dashboard-filter .filter-results a {
		display: flex;
		justify-content: space-between;
		align-items: center;
		text-decoration: none;
	}

	.hp .dashboard-filter input[type=text].form-control {
		border-radius: 1.5rem;
		border-color: #f1f1f1;
		background-color: #f1f1f1;
		padding-left: 2.4rem;
	}

	.hp .dashboard-filter .filter-wrapper {
		position: relative;
	}

	.hp .dashboard-filter .filter-icon {
		position: absolute;
		margin: 0.7em 1em;
	}

	.tile-icon {
		font-size: 40px;
		padding-bottom: 0.6rem;
	}

	.tile-badge {
		font-size: 16px;
		position: absolute;
		top: 2px;
		right: 4px;
	}

	.tile-title {
		word-break: break-word;
	}

	.content-cta a:hover {
		text-decoration: none !important;
	}

	/* Component: Home news */
	.featured-item {
		position: relative;
		transition: all .3s;
	}

		.featured-item:hover {
			transform: scale(1.02);
		}

		.featured-item .bg-image {
			/* Background fallback */
			height: 370px;
		}

		.featured-item .featured-item-image {
			width: 100%;
			height: 350px;
			object-fit: cover;
		}

		.featured-item .featured-item-info {
			position: absolute;
			padding: 15px;
			bottom: 0;
			width: 100%;
			color: var(--fontColorLight);
			background: rgb(0 0 0 / 0.5);
		}

		.featured-item .featured-item-overlay {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
		}

		.featured-item .featured-item-tag {
			position: absolute;
			top: 0;
			right: 0;
			padding: 5px 15px;
			font-size: 14px;
		}

		.featured-item .featured-item-info p strong {
			font-weight: normal;
		}

	/* Component: Kennisbank */

	.kennisbank-items {
		margin: 40px 0;
		border-top: 1px dashed #dcdcdc;
	}

	.kennisbank-panel {
		display: block;
		border: 1px solid #dcdcdc;
		margin-bottom: 10px;
	}

		.kennisbank-panel .header {
			font-weight: bold;
			padding: 10px;
			border-bottom: 1px solid #dcdcdc;
		}

			.kennisbank-panel .header:hover {
				cursor: pointer;
				background: rgba(0,0,0,.06);
			}

		.kennisbank-panel .content {
			display: none;
			padding: 10px;
		}

	.reparatie-panel {
		display: block;
		margin-bottom: 10px;
	}

		.reparatie-panel .header {
			padding: 10px;
		}

			.reparatie-panel .header:hover {
				cursor: pointer;
				background: rgba(0,0,0,.06);
			}

		.reparatie-panel .content:not(.ng-hide) {
			opacity: 1;
			padding: 10px;
			-webkit-transition: all linear 0.5s;
			-moz-transition: all linear 0.5s;
			-o-transition: all linear 0.5s;
			transition: all linear 0.5s;
		}

		.reparatie-panel .content.ng-hide {
			opacity: 0;
			transition: none 0;
		}

		.reparatie-panel .loadingRow {
			text-align: center;
			margin-top: 1em;
		}

		.reparatie-panel .gebrekenInDossier {
			margin-top: 0px;
			padding-left: 0px;
			list-style-type: none;
		}



	.searchresultspopupnotop {
		padding: 0px;
		z-index: 99999 !important;
		background-color: var(--fontColorLight);
		margin-top: 0px;
		padding: 0px;
		list-style: none;
		border: 2px solid #ccc;
		margin-top: 2px;
		overflow-y: scroll !important;
		height: 200px;
	}

		.searchresultspopupnotop > li {
			border-bottom: 1px solid #ccc;
			height: auto;
			padding: 5px 10px;
		}

			.searchresultspopupnotop > li:hover {
				background: #efefef;
				cursor: pointer;
			}

	.searchResults {
		margin-top: 10px;
	}

	/* RVZ */

	.afspraak-day {
		width: 100%;
		text-align: center;
		display: block;
		padding: 5px 0;
		color: #777;
		background-color: #f5f5f5;
		border-left: 1px solid var(--fontColorLight);
	}

		.afspraak-day.vp {
			color: #f5f5f5;
			background-color: #337ab7;
			border-left: 0;
		}

	.afspraak-time {
		padding: 5px 0;
		text-align: center;
		border: 1px solid #efefef;
		border-top: none;
		background: var(--fontColorLight);
	}

		.afspraak-time.vp {
			border: 1px solid #ddd;
			border-top: none;
		}

		.afspraak-time.active {
			background-color: #e6f1f6;
		}

		.afspraak-time:hover {
			background-color: #efefef;
			cursor: pointer;
		}

	@media (max-width: 767.98px) {
		.cc-cookies {
			bottom: auto !important;
			top: 0px !important;
			position: absolute !important;
		}

		.row breadcrumb-wrapper hidden-xs {
			display: block !important;
		}

		.sub-navigation .sub-navigation-links {
			font-weight: bold;
			margin: 15px;
		}

		.navbar-nav .open .dropdown-menu > li > a {
			padding: 10px;
			border-bottom: 1px solid #f1f1f1;
			display: block;
			margin-left: 0;
			padding-left: 20px;
		}

		.row-no-padding > [class*="col-"] {
			padding-left: 0 !important;
			padding-right: 0 !important;
		}

		.content-page {
			margin-top: 0px;
		}

		.navbar-brand {
			margin-top: 0px !important;
		}

		.navbar-brand > img {
			max-height: 45px;
		}

		.content-header {
			height: 135px !important;
		}

		.content-header .itemContent {
			align-items: baseline;
		}

		.content-header .themeBorderBlock {
			margin-top: 3.5em;
		}

		h2.page__header {
			font-size: 20px;
		}

		h2.page__header a {
			margin-right: 10px;
		}

		.img {
			width: 100%;
		}

		.home-news-item-content .page-wrap {
			display: none;
		}

		.tile .tile-icon {
			height: auto;
			font-size: 25px;
			top: 12px;
			right: 10px;
		}

		.tile .tile-badge {
			font-size: 16px;
			position: absolute;
			top: 17px;
			padding-left: 7px;
			right: unset;
		}
	}

	@media (max-width: 368px) {
		.home-news-item-content {
			padding: 5px;
		}
	}

	/* Portal */
	/* lists */
	.list__item {
		background: var(--fontColorLight);
		margin-bottom: 5px;
		padding: 10px;
	}

	.list__title {
		font-weight: bold;
	}

	.list__detail {
		font-size: 12px;
		font-style: italic;
	}

	.list__inactive {
		background: rgba(0, 0, 0, .07);
	}


	/* Forms */

	.field-validation-error {
		font-weight: normal !important;
		color: #a94442 !important;
	}

	.field-validation-spacing {
		margin-top: 10px;
	}

	.validation-summary-errors ul li {
		color: var(--alertColor);
		font-weight: bold;
	}

	.validation-border {
		border-bottom: 2px solid #f00 !important;
	}

	#firstline-validation {
		font-weight: bold !important;
	}

	form:not(.needs-validation) .input-validation-error {
		border: 1px solid #cccc;
		background: var(--fontColorLight);
		border-bottom: 2px solid #f00 !important;
	}

	.umbracoform-validation {
		background-color: #eee;
		border-color: #ddd;
	}

		.umbracoform-validation span {
			color: #777 !important;
		}


	.umbraco-forms-container .form-group input[type=text],
	.umbraco-forms-container > input[type=text].form-control,
	.umbraco-forms-container .form-group input[type=email],
	.umbraco-forms-container > input[type=email].form-control,
	.umbraco-forms-container .form-group input[type=date],
	.umbraco-forms-container > input[type=date].form-control,
	.umbraco-forms-container.form-group select,
	.umbraco-forms-container > select.form-control {
		/*width: 350px;*/
		margin-left: 0px;
	}

	@media (max-width: 769px) {
		form:not(.needs-validation) .form-group input[type=text],
		form:not(.needs-validation) input[type=text].form-control,
		form:not(.needs-validation) .form-group input[type=password],
		form:not(.needs-validation) input[type=password].form-control,
		form:not(.needs-validation) .form-group input[type=email],
		form:not(.needs-validation) input[type=email].form-control,
		form:not(.needs-validation) .form-group input[type=date],
		form:not(.needs-validation) input[type=date].form-control,
		form:not(.needs-validation) .form-group select,
		form:not(.needs-validation) select.form-control {
			width: 100%;
		}

		.form-group {
			max-width: 100%;
		}
	}

	.form-group .checkboxlist label,
	.form-group .radiobuttonlist label {
		font-weight: normal;
		margin-left: 0.25em;
	}

	.form-group .checkboxlist,
	.form-group input[type=checkbox], .form-group input[type=radio],
	#contour fieldset, .contour fieldset, .umbraco-forms-container, fieldset .formset {
		padding: 0 !important;
	}

	.umbraco-forms-fieldset legend {
		font-size: 20px !important;
		font-weight: 400 !important;
		border-bottom: 0;
	}

	fieldset legend {
		margin-left: 0 !important;
	}

	.form-group input[type=checkbox], .form-group input[type=radio] {
		border-color: #ccc !important;
	}

	.umbraco-forms-field textarea {
		height: 120px;
	}

	.umbraco-forms-container {
		padding-left: 0px;
	}

	/* menu {*/

	.desktop.menu__item--link {
		visibility: visible;
		display: block;
	}

	.mobile.menu__item--link {
		visibility: hidden;
		display: none;
	}

	.lowerlevel {
		display: block;
	}

	.menu_item.link {
		font-size: 20px !important;
	}

	.contactmoments__list-item {
		margin-bottom: 20px;
		border-radius: 10px;
		padding: 15px;
	}

	.contactmoments .list-item--left {
		margin-left: 40px;
		background: #DCF8C6;
	}

	.contactmoments .list-item--right {
		margin-right: 40px;
		background: #f1f1f1;
	}

	.contactmoments .list-item__header {
		font-size: 18px;
	}

	.contactmoments .list-item__footer {
		text-align: right;
		font-size: 10px;
	}

	.error_red {
		color: var(--alertColor);
		display: block;
		opacity: 0.7;
	}

		.error_red:hover {
			opacity: 0.9;
		}

	.betalingsregelingdisabled {
		font-style: italic;
		display: block;
		margin-top: 10px;
	}

	.kennisbank-downloads.title {
		font-size: 18px;
	}

	.do-progress-bar {
		margin-top: 5px;
	}

		.do-progress-bar .progress-step {
			display: inline-block;
			position: relative;
			min-height: 40px;
			width: 15%;
			margin-right: 5px;
		}


	/* CUSTOM.CSS port, please refactor!*/

	#provision-agreement {
		width: calc(100% - 20px);
		height: 400px;
		overflow: scroll;
		border: 2px solid #aaa;
		display: block;
		transition: all 0.3s ease-in;
		margin-top: 20px;
	}

	.huurcontract__container {
		margin-bottom: 20px;
	}

	.do-progress-bar {
		margin-top: 5px;
	}

		.do-progress-bar .progress-step {
			display: inline-block;
			position: relative;
			min-height: 40px;
			width: 15%;
			margin-right: 5px;
		}

			.do-progress-bar .progress-step.afgerond {
				border-left: 10px solid #efefef;
				text-decoration: line-through;
			}

			.do-progress-bar .progress-step.inbehandeling {
				border-left: 10px solid #8bc34a;
			}

			.do-progress-bar .progress-step.inactief {
				background: #efefef;
				color: #ccc;
			}

			.do-progress-bar .progress-step.done {
				border-left: 8px solid #ccc;
				text-decoration: line-through;
				color: #aaa;
				background: #efefef;
			}

				.do-progress-bar .progress-step.done .title {
					text-decoration: line-through;
				}

		.do-progress-bar .progress-step {
			background-color: lightgray;
			color: var(--fontColorDark);
		}

			.do-progress-bar .progress-step.active {
				background-color: #8bc34a;
				color: var(--fontColorLight);
			}

			.do-progress-bar .progress-step .title {
				position: absolute;
				top: 18px;
				left: 6px;
				line-height: 16px;
			}

	​​​​

	.do-progress-bar .progress-step .count {
		position: absolute;
		top: 0px;
		left: 15px;
		font-size: 30px;
		font-weight: 500;
	}

	​​​​
	.do-controles {
		background: #eee;
		margin-bottom: 20px;
		width: 800px;
	}

	.do-controles .Afgehandeld,
	.do-controles .Uitgevoerd {
		color: #48b740;
	}

		.do-controles .Afgehandeld:before {
			content: "\4e";
			font-family: 'ElegantIcons';
			color: #48b740;
			padding-right: 5px;
		}

		.do-controles .Uitgevoerd:before {
			content: "\4e";
			font-family: 'ElegantIcons';
			color: #48b740;
			padding-right: 5px;
		}

	.do-controles .Inactief:before {
		content: "\73";
		font-family: 'ElegantIcons';
		color: #f39f37;
		padding-right: 5px;
	}

	.do-controles .Overgeslagen {
		color: #fa6161;
	}

		.do-controles .Overgeslagen:before {
			content: "\4d";
			font-family: 'ElegantIcons';
			color: #fa6161;
			padding-right: 5px;
		}

	.table.do-controles > tbody > tr > td {
		border-bottom: 1px solid var(--fontColorLight) !important;
	}

	.do-samenvatting-veld {
		background: #eee;
		margin-bottom: 15px;
		padding: 10px;
		width: 800px;
		cursor: pointer;
	}

		.do-samenvatting-veld.active {
			background: #E0E6F2;
		}

	.do-controles .table > tbody > tr > td {
		vertical-align: middle !important;
	}

	.do-controles .checkbox {
		margin: 0;
	}

		.do-controles .checkbox input[type=checkbox] + span::after {
			margin-top: -5px;
			margin-right: 0px;
			border: 2px solid #666666;
		}

		.do-controles .checkbox input[type=checkbox]:checked + span::before {
			top: 0;
		}

	/*END CUSTOM.CSS PORT*/


	/* Portrait tablets and small desktops */
	@media (min-width: 768px) and (max-width: 1366px) {
		#span-button {
			padding: 17px 10px;
			margin-right: -10px;
		}

		#span-buttonbrightwonen {
			padding: 17px 12px;
			margin-right: -15px;
		}

		.caret {
			border-top: 6px dashed;
			border-right: 5px solid transparent;
			border-left: 5px solid transparent;
		}
	}

	/* Portrait tablets and small desktops */
	@media (min-width: 1024px) and (max-width: 1366px) {
		.level__1 .dropdown > li > a {
			display: block;
		}
	}

	/* Portrait tablets and small desktops */
	@media (min-width: 768px) and (max-width: 1024px) {
		.navbar .search-form {
			margin-top: 0px;
		}
	}

	@media (max-width: 1024px) {
		.navbar .search-form {
			margin-top: 0px;
		}
	}

	@media (min-width: 768px) and (max-width: 1023px) {
		.field-validation-spacing {
			width: 100% !important;
		}

		.alert.alert-info.customized {
			width: 100% !important;
		}
	}

	/* Landscape phones and portrait tablets */
	@media (max-width: 767.98px) {
		.caret {
			float: right;
			border-top: 6px dashed;
			border-right: 5px solid transparent;
			border-left: 5px solid transparent;
		}

		.navbar .search-form .form-control,
		.navbar .search-form .form-control:focus {
			font-size: 16px !important;
		}

		.navbar .search-form .form-control,
		.navbar .search-form .form-control:focus {
			padding: 0 0px !important;
			margin-left: 2px;
		}

		.lowerlevel > ul > li > a {
			margin-left: 10px;
		}

		.nav .open > a,
		.nav .open > a:focus,
		.nav .open > a:hover {
			background-color: #FBFBFB;
			border-bottom: 2px solid #efefef;
		}

		.nav .open > a:not(.btn),
		.nav .open > a:not(.btn):focus,
		.nav .open > a:not(.btn):hover {
			font-weight: bold;
		}

		#span-button {
			border-left: 1px solid #fafafa;
			float: right;
			padding: 17px 13px;
			margin-top: -10px;
			margin-right: -10px;
		}
		/*
            .nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
                background: linear-gradient(#f1f1f1, #f1f1f1);
                background-position-x: 330px;
                background-repeat: no-repeat;
                font-weight: bold;
            }*/


		.navbar-nav .open .dropdown-menu {
			padding: 0px;
			position: static;
		}

		.navbar-nav li a.btn {
			width: 100%;
		}

		.alert.alert-info {
			width: 100% !important;
		}

		.alert.alert-warning.widget {
			width: 100% !important;
			padding-bottom: 30px;
		}

		.btn.btn-default.primary.betalingsoverzicht {
			word-wrap: break-word;
			max-width: 100%;
			float: left !important;
			margin-top: -15px !important;
		}

		.linebreak {
			display: none;
		}

		.button-homepage.betalingsoverzicht {
			margin-top: 25px;
		}

		.collapsed.reparatieverzoek {
			width: 100% !important;
		}

		.fa.fa-wrench.reparatieverzoek {
			margin-top: -50px !important;
		}
	}

	.dropdown .btn-block {
		margin-left: 0px;
	}

	.fa.fa-eye.showpwd,
	.fa.fa-eye-slash.showpwd {
		position: relative;
		float: right;
		margin-top: -27px;
		font-size: 20px;
		margin-right: 10px;
	}

	/* Hide default eye icon for MS Edge, Chromium based, IE 11 browsers */
	input::-ms-reveal,
	input::-ms-clear {
		display: none;
	}

	.alert.alert-info.customized {
		width: 350px;
		margin-top: 10px;
	}

	.fa.fa-calendar-o {
		float: right;
		margin-top: -27px;
		font-size: 20px;
		margin-right: 10px;
	}

	.nav-item.active .nav-link {
		font-weight: bold;
		border-radius: 0;
	}

	.alert.alert-warning.widget {
		max-width: 600px;
		margin-bottom: 0px;
	}

	.btn.btn-default.primary.betalingsoverzicht {
		float: right;
		margin-top: -47px;
	}

	.login-time {
		font-weight: bold;
		font-size: 14px;
	}

	.collapsed.reparatieverzoek {
		overflow: hidden;
		white-space: nowrap !important;
		text-overflow: ellipsis;
		width: 380px;
	}

	.panel-collapse > .panel-body.reparatieverzoek {
		margin-bottom: 0px;
	}

	.fa.fa-wrench.reparatieverzoek {
		float: right;
		margin-top: -43px;
		font-size: 28px;
		color: var(--fontColorDark);
	}


	#autoHdieMe {
		-moz-animation: autoHide 0s ease-in 5s forwards;
		-webkit-animation: autoHide 0s ease-in 5s forwards;
		-o-animation: autoHide 0s ease-in 5s forwards;
		animation: autoHide 0s ease-in 5s forwards;
		-webkit-animation-fill-mode: forwards;
		animation-fill-mode: forwards;
	}

	@keyframes autoHide {
		to {
			width: 0;
			height: 0;
			overflow: hidden;
			margin: 0;
			border: 0;
			padding: 0;
		}
	}

	@-webkit-keyframes autoHide {
		to {
			width: 0;
			height: 0;
			visibility: hidden;
			margin: 0;
			border: 0;
			padding: 0;
		}
	}


	/* loading circle */
	@-webkit-keyframes spin {
		0% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		100% {
			-webkit-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}

	@keyframes spin {
		0% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		100% {
			-webkit-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}

	.loading {
		text-align: center;
		margin-top: 20px 0;
	}

	.loading-circle {
		margin: 0 auto;
		border-radius: 50%;
		width: 35px;
		height: 35px;
		border: 2px solid rgba(0,0,0,0.2);
		border-top-color: rgb(0,0,0);
		-webkit-animation: spin 1s infinite linear;
		animation: spin .8s infinite linear;
	}

/* loading bar */
.loader-placeholder {
	display: block;
	height: 3px;
	width: 100%;
}

.loading-bar{
    overflow: hidden;
    position: relative;
}

.loading-bar:before{
    content: '';
	width: 100%;
	height: 3px;
	position: absolute;
	bottom: 0;
	left: 0;
    background-color: var(--mainColor);
	animation: loopBorderBar 1.5s infinite;
	animation-timing-function: linear;
	z-index: 100
}


@keyframes loopBorderBar {
	0% {
		transform: translateX(-200px)
	}
	100% {
		transform: translateX(calc(100% + 200px))
	}
}

	/* cards */
	.card.row:focus {
		outline: -webkit-focus-ring-color auto 1px;
	}

	.card.alert-danger {
		background-color: #f2dede;
		border-color: #ebccd1;
	}

	.card.alert-success {
		background-color: #dff0d8;
		border-color: #d6e9c6;
	}

	.card .row[tabindex='0'] {
		cursor: pointer;
	}

	a.card,
	a.card:focus {
		color: var(--fontColorDark);
	 }

	.card-icon .fa.fa-exclamation-circle {
		color: var(--secondaryColor);
	}

	.card-icon .fa.fa-check-circle {
		color: var(--okayColor);
	}

	/*  wizard angularjs */
	@media (max-width: 575.98px)  {
		#wizard-navigation-container {
			flex-direction: column;
		}

		#wizard-content-container .select-defect .step button {
			text-align: left;
		}
	}

	@media (max-width: 767.98px) {
		.repair-request-timetable .flex-table {
			row-gap: 1rem;
		}
	}

	/*  step container begin */
	#step-container {
		line-height: 1.8;
		margin-top: 12px;
	}

	#step-container .selected {
		font-weight: bold;
	}

	#step-container .index {
		width: 24px;
		height: 24px;
		margin-right: 8px;
		position: relative;
		text-align: center;
		float: left;
	}
	
	#step-container .index.completed {
		color: #29a746;
	}

	#step-container li span .selected {
		font-weight: bold;
	}


	#step-container ul {
		line-height: 1.8;
		margin-top: 6px;
	}
	ul li i {
		padding-top: 3px;
	}
	ul li i.fa-check-square {
		color: green;
	}
	ul li i.fa-spinner {
		color: Highlight;
	}
	ul li i.fa-square {
		color: darkgray;
	}


	#wizard-step-container button,
	#wizard-step-container .step-wrapper > span:first-child {
		background-color: transparent;
		border: none;
		line-height: 1.6;
		color: var(--mainColor);
	}

	#wizard-step-container button:first-child {
		padding-left: 0;
	}

	#wizard-step-container .step-wrapper .selected {
		font-weight: bold;
	}

	#wizard-step-container .index {
		font-weight: bold;
		color: var(--fontColorDark);
		width: 24px;
		height: 24px;
		margin-right: 8px;
		border-radius: 16px;
		position: relative;
		text-align: center;
		float: left;
	}

	#wizard-content-container button:focus {
		outline-offset: 0;
	}

	#wizard-content-container .select-contract .wrapper {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	#wizard-content-container .select-contract button {
		width: 100%;
	}

	#wizard-content-container .select-defect .wrapper .step,
	.repair-request-timetable .flex-table {
		display: flex;
		flex-wrap: wrap;
	}

	#wizard-content-container .select-defect .wrapper .step {
		column-gap: 2rem;
	}

	#wizard-content-container .select-defect .wrapper .input-group-btn button {
		height: 34px;
	}

	#wizard-content-container .panel-collapse > .panel-body {
		margin-bottom: 0;
	}

	#wizard-content-container .quick-choice button {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	#wizard-content-container .quick-choice .fa-chevron-down {
		transition: transform .2s ease-in-out;
	}

	#wizard-content-container .quick-choice [aria-expanded="true"] .fa-chevron-down {
		transform: rotate(-180deg);
	}

	#wizard-content-container .quick-choice .card-body {
		background-color: #efefef;
		word-break: break-word;
	}

	#wizard-content-container .select-defect .step button {
		width: 100%;
		height: 100%;
		word-break: break-word;
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		justify-content: space-between;
	}

	#wizard-content-container .select-defect button img {
		width: 15%;
		image-rendering: -webkit-optimize-contrast;
	}

	#wizard-content-container .select-defect button img,
	#wizard-content-container .select-defect button:hover img {
		-webkit-filter: var(--imageFilterInvert);
		filter: var(--imageFilterInvert);
	}

	.repair-request-timetable .flex-header {
		background: var(--mainColor);
		color: var(--fontColorLight)
	}

	@media (max-width: 767.98px) {
		.repair-request-timetable .col-6:last-child,
		#wizard-navigation-container .navigation-buttons button,
		.actions-buttons .btn {
			width: 100%;
		}

		#wizard-navigation-container .navigation-buttons button,
		.actions-buttons button:not(:last-child) {
			margin-bottom: 1rem;
		}

		#wizard-navigation-container {
			padding: 1rem 0;
		}
	}

	.repair-request-timetable .flex-cell:hover {
		cursor: pointer;
		background: #dedede;
	}

	.repair-request-timetable .flex-cell.active {
		background: #dedede;
	}

	#wizard-step-container .completed.index,
	#wizard-step-container .selected .index {
		background-color: var(--secondaryColor);
		color: var(--fontColorLight);
	}

	#wizard-step-container .step-wrapper:not(.mobile) {
		display: none;
	}

	#wizard-step-container .step-progress {
		display: flex;
		height: 10px;
		overflow: hidden;
		border-radius: 4px;
		margin-top: 10px;
	}

	#wizard-step-container .step-progress .bar {
		border-left: 1px solid var(--fontColorLight);
		width: 16.67%;
		height: 100%;
		-webkit-transition: width .6s ease;
		transition: width .6s ease;
	}

	#wizard-step-container .step-progress .bar.completed {
		background-color: var(--secondaryColor);
	}

	#wizard-step-container .step-progress .bar:first-child {
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}

	#wizard-content-container .alert hr {
		border-color: #bebebe;
	}

	#wizard-content-container .alert .fa {
		font-size: 18px;
	}

	#wizard-content-container .badge {
		padding: 5px 7px;
		line-height: 1;
	}

	#wizard-content-container .badge button {
		background-color: transparent;
		color: var(--fontColorLight);
		border: none;
		padding: 0 5px 0 0;
		vertical-align: middle;
	}

	#wizard-content-container .badge button span {
		font-size: 16px;
	}

	#wizard-navigation-container button {
		font-weight: bold;
	}

	#wizard-navigation-container button.cancel {
		background-color: transparent;
		color: var(--alertColor);
		border: 1px solid;
		border-radius: 4px;
	}

	#wizard-navigation-container button.cancel:focus {
		box-shadow: 0 0 0 0.25rem rgb(255 83 78 / 0.35);
	}

	#wizard-navigation-container button.cancel:hover {
		background-color: var(--alertColor);
		border-color: var(--alertColor);
		color: var(--fontColorLight);
	}

	@media (min-width: 768px) {
		#wizard-step-container,
		#wizard-content-container,
		#wizard-navigation-container {
			padding: 10px 0;
		}

		#wizard-content-container .select-contract button {
			min-width: 400px;
			width: auto;
		}

		#wizard-content-container .select-defect button img {
			width: 50%;
		}

		#wizard-content-container .select-defect .step button {
			flex-basis: 15%;
			flex-direction: column;
			justify-content: space-around;
		}

		.hp .dynamic-dashboard .dashboard-container > .row > .column:first-child {
			border-right: 1px solid #dee2e6;
		}
	}

	@media (min-width: 992px) {
		.hp .dynamic-dashboard .dashboard-container > .row {
			--bs-gutter-x: 5rem;
		}
		.navbar .search {
			margin-right: 1rem;
		}
	}

	@media (min-width: 1200px) {
		#wizard-step-container {
			display: flex;
		}

		#wizard-step-container .step-wrapper:not(.mobile) {
			display: flex;
			align-items: center;
		}

		#wizard-step-container .step-wrapper.mobile {
			display: none;
		}

		#wizard-step-container .step-line {
			border-top-width: 1px;
			border-top-style: solid;
			height: 0;
			min-width: 3rem;
			margin-right: 6px;
		}

		.accordion #wizard-step-container .step-line {
			min-width: 2rem;
		}

		#wizard-step-container .step-progress {
			display: none;
		}

		#wizard-content-container .badge {
			margin-bottom: 0;
		}
	}

	@media (min-width: 1400px) {
		#wizard-step-container .step-line,
		.accordion #wizard-step-container .step-line {
			min-width: 5rem;
		}
	}

	/*CASES always show progress bar --START--*/
	#wizard-step-container-cases {
		padding: 10px 0;
	}

	#wizard-step-container-cases button, #wizard-step-container-cases .step-wrapper > span:first-child {
		background-color: transparent;
		border: none;
		line-height: 1.6;
		color: var(--mainColor);
	}

	#wizard-step-container-cases .step-progress {
		display: flex;
		height: 10px;
		overflow: hidden;
		border-radius: 4px;
		margin-top: 10px;
	}

	#wizard-step-container-cases .step-progress .bar:first-child {
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}

	#wizard-step-container-cases .step-progress .bar {
		border-left: 1px solid var(--fontColorLight);
		width: 16.67%;
		height: 100%;
		-webkit-transition: width .6s ease;
		transition: width .6s ease;
	}

	#wizard-step-container-cases .step-progress .bar.completed {
		background-color: var(--secondaryColor);
	}

	#wizard-step-container-cases .step-wrapper .selected {
		font-weight: bold;
	}

	#wizard-step-container-cases .step-progress .bar {
		border-left: 1px solid var(--fontColorLight);
		width: 16.67%;
		height: 100%;
		-webkit-transition: width .6s ease;
		transition: width .6s ease;
	}
	/*CASES always show progress bar --END--*/

	.oh {
		overflow: hidden;
	}

	.alert-border {
		border-left: 6px solid var(--alertColor);
		border-radius: 0.25rem;
	}

	.okay-border {
		border-left: 6px solid var(--okayColor);
	}

	.noalert-border {
		border-left: 6px solid rgba(0, 0, 0, 0);
		border-radius: 0.25rem;
	}

	.file-upload.vp.invalid:focus {
		border-color: #dc3545;
		box-shadow: 0 0 0 0.25rem rgb(220 53 69 / 25%);
	}
	.file-upload.vp.valid:focus {
		border-color: #198754;
		box-shadow: 0 0 0 0.25rem rgb(25 135 84 / 25%);
	}
	.file-upload.vp.is-invalid:focus {
		border-color: #dc3545;
		 box-shadow: 0 0 0 0.25rem rgb(220 53 69 / 25%);
	}
	.file-upload.vp {
		padding: 2rem;
		border: 2px dashed #bbb;
		border-radius: 4px;
		text-align: center;
		font-size: 14px;
		cursor: pointer;
	}

	.file-upload.vp .fa {
		font-size: 3em;
		color: #848484;
	}

	.mw {
		width: 100%;
	}

	.vpreparatieverzoek i.rotate {
		height: 20px;
	}
	.rotate {
		transition: transform .2s ease-in-out;
	}

	.collapsed .rotate {
		transform: rotate(-180deg);
	}

@media (max-width: 767.98px) {
	.hp .umb-grid .vp [class*="col-"] {
			padding-left: 2px;
			padding-right: 2px;
	}
}

/*   ----- woningaanbod start ----   */
.woningaanbod .nav-pills .nav-link.active,
.woningaanbod .nav-pills .show > .nav-link {
	background-color: var(--mainColor);
}

.woningaanbod .nav-link {
	color: var(--mainColor);
}

/* let's just force capitalization for woningaanbod */
.woningaanbod li.list-group-item > .col:first-letter {
	text-transform: capitalize
}


.woningaanbod button.housetype.selected {
	border-color: var(--mainColor);
	background-color: var(--mainColor);
	color: #fff;
}

.woningaanbod button.housetype {
	background-color: #e9ecef;
}

.woningaanbod .card .img-container {
	max-height: 300px;
}
.woningaanbod .card .map-img-container {
	max-height: 250px;
}
@media(max-width: 768px) {
	.woningaanbod .card .map-img-container {
		display: none;
	}
}

.woningaanbod .card img {
	object-fit: cover;
	height: 100%;
	width: 100%;
}

.woningaanbod .list .card .price-overlay {
	background-color: var(--mainColor);
	border-bottom-left-radius: 0.25rem;
}

.woningaanbod .list .card .blocked-overlay {
	background-color: var(--mainColor);
	border-top-left-radius: 0.25rem;
}

.woningaanbod svg {
	max-height: 20px;
	width: 30px;
	position: relative;
	top: -2px;
}
.woningaanbod .attributes-card > .card{
	background-color: #f1f1f1;
	border-color: #f1f1f1;
	top: 10px;
}
svg.fill-white {
	fill: #fff;
}
svg.fill-main {
	fill: var(--mainColor);
}
svg.fill-secondary {
	fill: var(--secondaryColor);
}
svg.fill-okay {
	fill: var(--okayColor);
}
svg.fill-alert {
	fill: var(--alertColor);
}

.woningaanbod .details-img-container .card {
	height: 200px;
	max-width: 322px;
}
.woningaanbod .already-reacted {
	background-color: #e9ecef
}
.woningaanbod .already-reacted .img-container img{
	opacity: 0.4;
	filter: grayscale(1);
}
	.woningaanbod .already-reacted .img-container:after {
		content: "Reactie geplaatst";
		position: absolute;
		top: 70px;
		bottom: 0;
		left: 40px;
		right: 40px;
		font-size: 28px;
		text-align: center;
		color: var(--mainColor);
	}
.woningaanbod .blocked {
	background-color: #e9ecef
}

	.woningaanbod .blocked .img-container img {
		opacity: 0.4;
		filter: grayscale(1);
	}

	.woningaanbod .blocked .img-container:after {
		content: "Geblokkeerd";
		position: absolute;
		top: 70px;
		bottom: 0;
		left: 40px;
		right: 40px;
		font-size: 28px;
		text-align: center;
		color: var(--mainColor);
	}
.woningaanbod button.active svg {
	fill: #fff;
}
.woningaanbod button .extern svg {
	width: 14px;
	opacity: 0.8;
}

.woningaanbod .progress {
	height: 3px;
}

.woningaanbod .progress .progress-bar {
	background-color: var(--secondaryColor);
}
.woningaanbod .btn-secondary-color {
	background-color: var(--secondaryColor);
	color: #fff;
}
@media(max-width: 991px) {
	.woningaanbod .woningdetail-container {
		flex-direction: column-reverse;
	}
	
	.woningaanbod .filter, .woningaanbod .list {
		flex-shrink: 0;
		width: 100%;
	}
	.woningaanbod .attributes-card {
		flex-shrink: 0;
		width: 100%;
	}
	.woningaanbod .attributes-card > .card {
		width: 100%;
	}
	.woningaanbod .infolist {
		flex-shrink: 0;
		width: 100%;
	}
}

.woningaanbod .attachments-list li button.btn-link {
	color: var(--mainColor);
	text-decoration: none;
}

#map-container {
	height: 600px;
}

.woningaanbod .energielabel svg {
	fill: #006634;
}
	.woningaanbod .energielabel svg.a {
		fill: #006634;
	}
	.woningaanbod .energielabel svg.b {
		fill: #018D37;
	}
	.woningaanbod .energielabel svg.c {
		fill: #92C01F;
	}
	.woningaanbod .energielabel svg.d {
		fill: #FFEB00;
	}
	.woningaanbod .energielabel svg.e {
		fill: #F7B231;
	}
	.woningaanbod .energielabel svg.f {
		fill: #E95A0C;
	}
	.woningaanbod .energielabel svg.g {
		fill: #BC1622;
	}

.woningreacties .img-card{
	height: 92px;
	width: 92px;
}

.hey {
	box-shadow: 0 0 0 0 rgba(var(--focusShadowRGB), 1);
	transform: scale(1);
	animation: pulse 3s infinite;
}

@keyframes pulse {
	0% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(var(--focusShadowRGB), 0.7);
	}

	80% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(var(--focusShadowRGB), 0);
	}

	100% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba( var(--focusShadowRGB), 0);
	}
}
/*   ----- woningaanbod end ----   */