@charset "utf-8";
/* CSS Document */
:root {
	--bar-width: 30px; --bar-height: 5px; --hamburger-gap: 3px; --foreground: white; --background: black; --animation-timing: 200ms ease-in-out; --hamburger-height: calc(var(--bar-height) * 3 + var(--hamburger-gap) * 2); --hamburger-margin: 8px; --grid-4-column-gap: 8px; --id-green01: #9DC41D; --id-green-02: #819A31; --id-green-03: #626F36; --id-green-04: #3F452D; --id-green-05: #31332A; --id-purple: #614A6B; --id-purple-50: #b0a5b5
}
.bg-fade-70 {
	background-image: url("images/bg-fade-70.png")
}
body {
    font-family: "aileron", sans-serif; font-weight: 400; font-style: normal; color: #424141; font-size: 1em; text-align: center; line-height: 1.5em; margin: 0
}
.bottom-curve {
	clip-path: ellipse(100% 60% at 50% 40%);
}
.div-600 {
	max-width: 600px; margin: 0 auto
}
.div-800 {
	max-width: 800px; margin: 0 auto
}
.div-1000 {
	width: calc(100% - 20px); max-width: 980px; margin: 0 auto; padding: 0 10px
}
.div-1200 {
	max-width: 1200px; margin: 0 auto
}
.div-1600 {
	max-width: 1000px; margin: 0 auto
}
.div-lozenge {
	border-radius: 15px; overflow: hidden
}
.div-lozenge-flat-bottom {
	border-top-left-radius: 15px; border-top-left-radius: 15px; overflow: hidden
}
.div-pad-10 {
	padding: 10px
}
.div-pad-20 {
	padding: 20px
}
.hamburger-menu {
	--x-width: calc(var(--hamburger-height) * 1.41421356237); display: flex; flex-direction: column; gap: var(--hamburger-gap); width: max-content; position: absolute; top: 16px; /*top: var(--hamburger-margin); left: var(--hamburger-margin);*/ right: 8px; z-index: 20; cursor: pointer;
}
.hamburger-menu::before, .hamburger-menu::after, .hamburger-menu input {
	content: ""; width: var(--bar-width); height: var(--bar-height); background-color: var(--foreground);  border-radius: 999px; transform-origin: left center; transition: opacity var(--animation-timing), width var(--animation-timing), rotate var(--animation-timing),  translate var(--animation-timing)
}
.hamburger-menu input {
	appearance: none; padding: 0; margin: 0; outline: none; pointer-events: none
}
.hamburger-menu:has(input:checked)::before {
	rotate: 45deg; width: var(--x-width); translate: 0 calc(var(--bar-height) / -2);
}
.hamburger-menu:has(input:checked)::after {
	rotate: -45deg; width: var(--x-width);  translate: 0 calc(var(--bar-height) / 2);
}
.hamburger-menu:has(input:checked) + .sidebar{
	translate: calc(100vw - 17rem);
}
.hamburger-menu input:checked {
	opacity: 0; width: 0
}
.hero-home {
	background-image:url("images/hero-home-480.jpg"); padding: calc(30% + 30px) 0 0; margin: 0; background-position:top center;
}
.logo {
	height: 40px; width: auto; margin: 20px 0; float: left
}
#main-content {
	max-width: 1920px; margin: 0 auto
}
#main-drop {
	display: none
}
#menu-bar {
	height: 100px; background-image: url("images/menu-gradient.png"); background-repeat: repeat-x; position: absolute; top: 0; left: 0; right: 0; z-index: 20; text-align: left
}
#menu-holder {
    max-width: 1920px; margin: 0 auto; padding: 0 30px; display: block;
}
.menu-items {
	display: none
}
.menu-item a:link, .menu-item a:visited, #main-drop a:link,  #main-drop a:visited{
    color: #FFFFFF; text-decoration: none; margin: 0 20px; font-weight: 100
}
#mobile-holder {
	overflow: hidden; display: block
}
.sidebar {
	margin-top: calc(var(--hamburger-height) + var(--hamburger-margin) + 1rem); background-image: url("images/mobile-menu-gradient.png"); background-size: cover; background-repeat: repeat-x; width: 15rem; padding: 0.5rem 1rem 2rem 0.5rem; transition: translate var(--animation-timing); position: absolute; z-index: 20; translate: -100%; top: 8px; text-align: left; border-left: solid 1px #FFFFFF; border-bottom: solid 1px #FFFFFF; border-bottom-left-radius: 20px
}
.sidebar a:link, .sidebar a:visited {
	color: white; text-decoration: none
}
#sub-menu {
	margin-left: 20px; max-height: 0; overflow: hidden; transition: max-height var(--animation-timing);
}
.text-align-centre {
	text-align: center
}
.text-align-left {
	text-align: left
}
.text-align-right {
	text-align: right
}
.text-align-variable {
        text-align: center
    }
.text-black {
	color: black !important
}
.text-blue {
	color: #0F70B7 !important
}
.text-bold {
	font-weight: 700
}
.text-bold-blue {
	font-weight: 700; color: #0F70B7
}
.text-bold-orange {
	font-weight: 700; color: #EA5B0C
}
.text-bold-italic {
	font-weight: 700; font-style: italic
}
.text-courier {
	font-family: Courier New, serif
}
.text-italic {
	font-style: italic
}
.text-light {
	font-weight: 100
}
.text-orange {
	color: #F39200
}
.text-thin {
	font-weight: 100
}
.text-white {
	color: white !important
}

@media screen and (min-width: 480px) {
	.hero-home {
        background-image:url("images/hero-home-600.jpg"); padding: calc(30% + 30px) 0 0; margin: 0
    }
}

@media screen and (min-width: 600px) {
	.hero-home {
        background-image:url("images/hero-home-800.jpg"); padding: calc(30% + 30px) 0 0; margin: 0
    }
}

@media screen and (min-width: 800px) {
	.hero-home {
        background-image:url("images/hero-home-1000.jpg"); padding: calc(30% + 30px) 0 0; margin: 0
    }
}

@media screen and (min-width: 1000px) {
	.hero-home {
        background-image:url("images/hero-home-1200.jpg"); padding: calc(30% + 30px) 0 0; margin: 0
    }
}

@media screen and (min-width: 1200px) {
	.hero-home {
        background-image:url("images/hero-home-1600.jpg"); padding: calc(30% + 30px) 0 0; margin: 0
    }
}

@media screen and (min-width: 1600px) {
	.hero-home {
        background-image:url("images/hero-home-1920.jpg"); padding: calc(30% + 30px) 0 0; margin: 0
    }
	.menu-items {
        width: 60%; text-align: right; display: flex; justify-content: flex-start; align-items: center; height: 100px; margin-left: 30%;
    }
	#mobile-holder {
		display: none
	}
}

