:root {
	--color-primary: #274e5e;
	--color-secondary: #0f303e;
	--color-light-grey: #e3e8ea;
	--color-grey: #ACC0C8;
	--color-dark-grey: #819CA8;
	--color-light-primary: #3b687a;
	--color-accent: #ffffff;

	--color-primary-rgb: 39, 78, 94;
	--color-secondary-rgb: 15, 48, 62;
	--color-light-grey-rgb: 227, 232, 234;
	--color-grey-rgb: 172, 192, 200;
	--color-dark-grey-rgb: 129, 156, 168;
	--color-light-primary-rgb: 59, 104, 122;
	--color-accent-rgb: 255, 255, 255;

	--opacity: 1;
	--header-height: 120px;
	--menu-item-height: 80px;
	--footer-padding: 40px;
	--block-spacing: clamp(7rem, 5vw, 10rem);
}


/* large view */
@media only screen and (max-width: 1539px) {
	:root {
		--block-spacing: clamp(5rem, 5vw, 8rem);
	}
}

/* tablet view */
@media only screen and (max-width: 1023px) {
	:root {
		--block-spacing: 3rem;
		--header-height: 100px;
		--menu-item-height: 60px;
	}
}

/* mobile view */
@media only screen and (max-width: 767px) {
	:root {
		--block-spacing: 2rem;
	}
}