/******************************************/
/** General                              **/
/******************************************/

:root {
   --primary: #213A8F;
	--secondary: #8C7F1C;
	--secondary-light: #c5b432;
	--light: #FFFCEE;
	--black: #000000;
	--white: #ffffff;
}

*,
*::before,
*::after {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
}

html, body {
	height: 100%;
   min-height: 100vh;
   min-height: 100dvh;
   position: relative;
   color: var(--primary);
	font-family: 'mokoko', sans-serif;
   background-color: var(--light);
}

/******************************************/
/** Utilities & Helpers                  **/
/******************************************/

/* Fonts & Text */

.font-serif {font-family: "arpona", serif !important;}
.font-sans-serif {font-family: "mokoko", sans-serif !important;}

h1, h2, h3, h4, h5, h6,
.h0, .h1, .h2, .h3, .h4, .h5, .h6 {font-family: "arpona", serif;}

.h0 {font-size: 4rem;}

@media (max-width: 768px) {
	.h0 {font-size: 1.6rem;}
}

.fs-7 {font-size: .8rem;}

/* Colors */

.text-primary {color: var(--primary) !important;}
.text-secondary {color: var(--secondary) !important;}

.bg-primary {background-color: var(--primary) !important;}

.border-secondary {border-color: var(--secondary) !important;}
.border-secondary-light {border-color: var(--secondary-light) !important;}
.border-transparent {border-color: transparent !important;}

/* Sizes & Shapes */

.w-fit {width: fit-content;}

.max-w-100 {max-width: 100%;}
.min-h-100 {min-height: 100%;}

@media (max-width: 991px) {
	.max-h-lg-400 {max-height: 400px;}
	.max-h-lg-300 {max-height: 300px;}
}

.size-xs {
	width: 1.2rem;
   height: 1.2rem;
   min-width: 1.2rem;
   min-height: 1.2rem;
}

.size-md {
	width: 2rem;
   height: 2rem;
   min-width: 2rem;
   min-height: 2rem;
}

.size-lg {
	width: 3rem;
	height: 3rem;
	min-width: 3rem;
	min-height: 3rem;
}

/* Dropdowns */

.dropdown-item.active,
.dropdown-item:active {background-color: var(--light) !important;}

/******************************************/
/** Cookies Pop-up                       **/
/******************************************/

.cc-window.cc-banner {
	left: 25px !important;
	right: 25px !important;
	width: auto !important;
	padding: 2em !important;
	bottom: 25px !important;
	border-radius: 35px !important;
}

.cc-btn.cc-allow:hover {background-color: var(--light) !important;}

@media (max-width: 900px) {
	.cc-window.cc-banner {
		align-items: unset !important;
		-ms-flex-align: unset !important;
		flex-direction: column !important;
		-webkit-box-align: unset !important;
		-ms-flex-direction: column !important;
		-webkit-box-orient: vertical !important;
		-webkit-box-direction: normal !important;
	}
	.cc-message {
		margin-right: 0 !important;
		margin-bottom: 20px !important;
	}
	.cc-btn {padding: .4em .6em !important;}
}

@media (max-width: 420px) {
	.cc-window.cc-banner {
		left: 15px !important;
		right: 15px !important;
		padding: 1.25em !important;
		bottom: 15px !important;
	}
	.cc-btn {padding: .4em .6em !important;}
}

.cc-window.cc-banner a {text-decoration: none;}

/******************************************/
/** Navbar                               **/
/******************************************/

#navbarDesktop {
	z-index: 1000;
	transition: all .3s ease-in-out;
}

#navbarDesktop.sticky {
	background-color: var(--white);
	box-shadow: var(--bs-box-shadow);
}

#navbarDesktop button {
	width: 1.76rem;
	height: 1.76rem;
	min-width: 1.76rem;
	min-height: 1.76rem;
}

@media (max-width: 768px) {
	.navbar-logo {width: 150px;}
}

/******************************************/
/** Banner                               **/
/******************************************/

#banner {padding-top: 120px;}

/******************************************/
/** Home                                 **/
/******************************************/

#hero {
	height: 92vh;
	height: 92dvh;
}

.home-food-wrapper {margin-bottom: -275px;}

.home-food-fix {height: 225px;}

/******************************************/
/** Restaurant                           **/
/******************************************/

.restaurant-food-wrapper {margin-top: -275px;}

.restaurant-food-fix {height: 225px;}

/******************************************/
/** Footer                               **/
/******************************************/

footer:not(.alt) {margin-top: 5rem;}

.footer-text {top: -14%;}

@media (max-width: 1200px) {
	.footer-text {top: -10%;}
}

@media (max-width: 991px) {
	.footer-text {top: -6%;}
}

@media (max-width: 768px) {
	.footer-text {top: -2%;}
}