


.menu-link {
			color: #7ca2d5;
		}
		
		#header {
			--cnvs-primary-menu-hover-color: #fff;
		}
		
		.dark {
   			--cnvs-header-bg: var(--cnvs-themecolor);
    		--cnvs-header-sticky-bg: var(--cnvs-themecolor);
		}
		
		/*	@-moz-document url-prefix() {
	# {
		letter-spacing: -4px;
	}
}	*/

	/*
	body h1, h2  {
		letter-spacing: -1px;
	} 
	*/
	
	body h1, h2  {
		font-weight: 700;
		letter-spacing: -3px;
	}
	
	body h3  {
		letter-spacing: -0.3px;
	}	
	
	
	@-moz-document url-prefix() {
    .menu-link {
        line-height:1;
	padding-top:1.5rem;
    }

    .btn-blue {
	line-height:1.2rem;
	padding-top:1.3rem !important;
    }
    i.fa-caret-down {
  top: 0px !important;
    }
    i.fa-caret-right {
  top: 0px !important;
    }
    i.fa-wind {
  top: 0px !important;
    }	
		
}

@media (max-width: 991px) {
  .header-misc {
	display: none !important;
	/* margin-right:100px; */
  }
}

@media (max-width: 1199px) {
  .is-expanded-menu .menu-link {
	--cnvs-primary-menu-padding-x: 10px;
  }
  .contact-number {
	margin-right: 0 !important;
  }
  .header-misc {
	margin-right: -10px;
  }
}

.header-misc {
  /* margin-left: 200px; */
  /* margin-left:300px; */
}

.contact-number {
  margin-right: -20px;
}

.nummer-mobiel {
  display: inline-block;
  float: right;
  color: #fff;
}



/* ----------------------------------------------------------------

-----------------------------------------------------------------*/


:root {
	--cnvs-themecolor-darker: #2b3f8d;
	--cnvs-themecolor: #3e57b6;
}


span#rent-label:hover {
	transform-origin: top center !important;
    	animation-name: swing !important;
	animation-duration: 1s !important;
    	animation-duration: var(--cnvs-animate-duration) !important;
    	animation-fill-mode: both !important;
}

.cnvs-hamburger .cnvs-hamburger-inner, .cnvs-hamburger .cnvs-hamburger-inner::before, .cnvs-hamburger .cnvs-hamburger-inner::after {
	background-color: #82a8db;
}


/* zwevende ballonnen (hero "huren")
   De drie ballon/airco-combinaties zijn losse transparante afbeeldingen; ze
   staan op de plek waar ze in de oorspronkelijke montage zaten (bron 1000x959)
   en zweven elk met een eigen tempo. */

	.ballonnen-stage {
		position: relative;
		aspect-ratio: 1000 / 959;
	}

	.ballonnen-stage .ballon {
		position: absolute;
		height: auto;
		transform-origin: 50% 100%;
		will-change: transform;
		animation: ballon-zweef var(--zweef-duur) ease-in-out var(--zweef-start) infinite alternate;
	}

	.ballon-links {
		left: 2.9%;
		top: 36.6%;
		width: 20.9%;
		--zweef-duur: 5.5s;
		--zweef-start: -1.8s;
		--zweef-hoogte: -3%;
		--zweef-hoek: 0.9deg;
	}

	.ballon-midden {
		left: 25.7%;
		top: 21.17%;
		width: 38.4%;
		--zweef-duur: 7s;
		--zweef-start: 0s;
		--zweef-hoogte: -1.6%;
		--zweef-hoek: 0.5deg;
	}

	.ballon-rechts {
		left: 59.2%;
		top: 4.9%;
		width: 22.3%;
		--zweef-duur: 6.2s;
		--zweef-start: -3.4s;
		--zweef-hoogte: -2.4%;
		--zweef-hoek: 0.7deg;
	}

	@keyframes ballon-zweef {
		from {
			transform: translate3d(0, 0, 0) rotate(calc(var(--zweef-hoek) * -1));
		}
		to {
			transform: translate3d(0, var(--zweef-hoogte), 0) rotate(var(--zweef-hoek));
		}
	}

	@media (prefers-reduced-motion: reduce) {
		.ballonnen-stage .ballon {
			animation: none;
		}
	}

/* abonnementen */
		
		/*.col-lg-4 {
			width: 25%;
		} */
		
		#blue-button {
			background-color: #1469f5;
			color: white;
			padding: 5px;
			border-radius: 10px;
			/*float: left;*/
			width: 50%;
			font-family: 'area-normal';
			cursor: none;
		}
	
		/* .button.button-border heeft 2 classes; die extra .button hier houdt
		   de blauwe vulling in stand (was voorheen een id-selector). */
		.button.blue-button-2 {
			background-color: #1469f5;
			color: white;
			padding: 5px;
			border-radius: 6px;
			border-color: transparent;
			width: 100%;
			font-family: 'area-normal';
			font-size: 1rem;
			cursor: pointer;
		}
	
	.abo-names {
		color: #fff;
	}
		
		#new-button {
			background-color: #212529;
			color: white;
			padding: 5px;
			border-radius: 10px;
			/*float: left;*/
			
		}
		
		#new-button:hover {
			color: white;
		}
	
		.abo-pricing {
			font-family: 'filson-pro', 'area-normal';
			color: #fff;
			font-size: 2rem;
		}
	
	.abo-text {
		color: #fff;
	}

		.btn-abo {
			--bs-btn-color: #fff;
			border-radius: 10px !important;
			padding-left: 0px !important;
			text-align: center !important;
  			--bs-btn-bg: #659bdc;
  			--bs-btn-border-color: transparent;
  			--bs-btn-hover-color: #659bdc;
  			--bs-btn-hover-bg: #fff;
  			--bs-btn-hover-border-color: #659bdc;
 			--bs-btn-focus-shadow-rgb: 211, 212, 213;
  			--bs-btn-active-color: #000;
  			--bs-btn-active-bg: #c6c7c8;
  			--bs-btn-active-border-color: #babbbc;
  			--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  			--bs-btn-disabled-color: #000;
  			--bs-btn-disabled-bg: #f8f9fa;
  			--bs-btn-disabled-border-color: #f8f9fa;
  			--bs-btn-border-width: 5px !important;
			
		}

		.kies {
			font-family: 'area-normal';
		}
		
		.card{
			border-color: #171717;
		}
		
	/*
	@media (max-width: 991px) {
 			.col-lg-3 {
				width: 50%;
			}
			.p-5 {
				padding-left: 2rem !important;
				padding-right: 2rem !important;
			}
			
			
		}
	*/
	
	
	@media (max-width: 991px) {
    .rent-bar {
        position: relative !important;
    }
}
	
	
	@media (min-width: 1px) {
		.col-lg-3 {
				width: 50%;
				padding-right: calc(var(--bs-gutter-x) * 0.5) !important;
			}
			.p-5 {
				padding: 1rem !important;
			}
		#remote {
			display: none;
		}
		
		#ballonnen {
			width: 60%;
			top: 100px;
		}
		
		#ballonnen-img {
			width: 120%;
		}
		.col-6 {
			display: none;
		}
		#rent-text {
			padding-bottom: 100px;
		}
		#certified-logo-rent {
			translate: 300% 450%;
		}
		.kies-btn {
			display: block;
		}
		
		.text-abo-list {
			/*color: #fff; */
			color: #fff;
			font-family: 'area-normal';
			font-size: 0.5rem !important;
	}
	
	.text-abo-list span {
	
			font-size: 0.8rem !important;
	}
	
	.text-abo-list i {
	
			color: #C9C9C9 !important;
		
	}
		
		#intro-text {
			width: 120%;
		}
		
	}
	
	
	@media (min-width: 475px) {
		.kies-btn {
			display: none;
	}
	
	@media (min-width: 576px) {
		.col-lg-3 {
			padding: 1rem !important;
			
		}
		#certified-logo-rent {
			translate: 300% 500%;
		}
	}
	
	
	@media (min-width: 768px) {
		.col-lg-3 {
				
			}
			.p-5 {
				padding: 3rem !important;
			}
		#rent-text {
			padding-bottom: 150px;
		}
		
		#ballonnen {
			width: 60%;
			top: 0px;
		}
		#intro-text {
			width: 100%;
		}
		
	}
	
	@media (min-width: 992px) {
		.col-lg-3 {
				
			}
			.p-5 {
				padding: 1rem !important;
			}
		#ballonnen {
			width: 60%;
			transform: translateX(100px);
		}
		#ballonnen-img {
			width: 100%;
		}
		.col-6 {
			display: block;
		}
		#rent-text {
			padding-bottom: 0px;
		}
		#certified-logo-rent {
			translate: 600% 500%;
		}
	}
		
		@media (min-width: 1200px) {	
			/*
			.g-4 {
				padding-left: 50px;
				padding-right: 50px;
			} */
			.g-4 {
				align-content: center;
			}
			.p-5 {
				padding: 1rem !important;
			}
			.col-lg-3 {
				width: 269px !important;
				padding-right: 0px !important;
			}
			
			.display-3 {
				margin-top: 0px;
			}
			
			#rent-text {
			 margin-left:100px;
			}
			
			#ballonnen {
			width: 50%;
				transform: translateX(0px);
		}
			
		}
	
		
		@media (min-width: 1400px) {	
			#remote {
				display: block;
			}
			.display-3 {
				margin-top: -80px;
			}
			
			
		}
	
	
		
		
		.text-abo-list {
			/*color: #fff; */
			color: #fff;
			font-family: 'area-normal';
			font-size: 0.5rem !important;
	}
	
	.text-abo-list span {
	
			font-size: 0.8rem !important;
	}
	
	.text-abo-list i {
	
			color: #C9C9C9 !important;
		
	}
		
		
		.button-red:hover {
			background-color: mediumpurple;
		}

		
		
		
		#airco {
			display: block;
			margin-left: auto;
			margin-right: auto;
		}
		
		#balk-paars {
			max-width: 1000px;
		}
		
		@media (min-width: 1200px) {
 			#airco {
				margin-top: -300px;
			}
		}
		@media (max-width: 1100px) {
 			#airco {
				margin-top:-400px;
			}
		}
		
		
/* ----------------------------------------------------------------

-----------------------------------------------------------------*/
		
		
		.btn-check + .btn-white {
            background-color: #fff;
        }
		.btn-check + .btn-black {
            background-color: #000;
			border: 2px solid #fff;
        }
        .btn-check + .btn-alpine {
            background-color: #4D5D4C;
        }
        .btn-check + .btn-silver {
            background-color: #F0F1EC;
        }
        .btn-check + .btn-gold {
            background-color: #F9E6CD;
        }
        .btn-check + .btn-blue {
            background-color: #A3BDD5;
        }
        /* Selectie: blauwe ring met transparante offset — duidelijk op de
           witte én de zwarte cirkel, zonder de cirkel van maat te veranderen. */
        .btn-check + .btn-color {
            cursor: pointer;
        }
        .btn-check + .btn-color:hover {
            outline: 2px solid rgba(255, 255, 255, 0.35);
            outline-offset: 3px;
        }
        .btn-check:checked + .btn-color,
        .btn-check:active + .btn-color {
            outline: 3px solid #659bdc;
            outline-offset: 3px;
            box-shadow: none !important;
        }
        /* Bootstrap's :checked-knopstijl mag de swatch-kleur zelf niet
           overschrijven: de cirkel houdt zijn eigen vulling. */
        .btn-check:checked + .btn-color.btn-white,
        .btn-check:active + .btn-color.btn-white {
            background-color: #fff;
        }
        .btn-check:checked + .btn-color.btn-black,
        .btn-check:active + .btn-color.btn-black {
            background-color: #000;
            border-color: #fff;
        }