/*--------------------------------------------------------------
Above the fold CSS only, including:
 - headers
 - page layout containers
 - main fonts
--------------------------------------------------------------*/
:root {
	--brand-color-bright-green: #AAD900;   
    --brand-color-green: #1A393F;
    --brand-color-dark-grey: #242424;
    --brand-color-teal: #009FAB;
	--brand-color-light-grey:#EFEFEF;
}

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  font-size: 56.3%; /* adjust global font size base */
  /*
  font-size:50.0% gives 1.0rem = 8px
  font-size:56.3% gives 1.0rem = 9px - better corolation with XD sizes
  font-size:62.5% gives 1.0rem = 10px - (62.5/100) * 16px = 10px
  */
};

/* Smooth scrolling on the whole document */
html {scroll-behavior: smooth;}
@media screen and (prefers-reduced-motion: reduce) {
    html {scroll-behavior: auto;}
}

body {margin: 0;background: #FFF;}
#page{background:#FFF;position: relative;}
main {display: block;}

/* Correct the font size and margin on `h1` elements within `section` and `article` contexts in Chrome, Firefox, and Safari. */
h1 {font-size: 2em; margin: 0.67em 0;}

a {background-color: transparent;}

button,input,optgroup,select,textarea {font-family: inherit;font-size: 100%;line-height: 1.15;margin: 0;}
button,input {overflow: visible;}
button,select {	text-transform: none;}
button,[type="button"],[type="reset"],[type="submit"] {	-webkit-appearance: button;}
button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {	border-style: none;	padding: 0;}
button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}
fieldset {padding: 0.35em 0.75em 0.625em;}
legend {box-sizing: border-box;	color: inherit;	display: table;	max-width: 100%;padding: 0;	white-space: normal;}
progress {vertical-align: baseline;}
textarea {overflow: auto;}
[type="checkbox"],[type="radio"] {box-sizing: border-box;padding: 0;}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {height: auto;}
[type="search"] {-webkit-appearance: textfield;	outline-offset: -2px;}
[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
::-webkit-file-upload-button {-webkit-appearance: button;font: inherit;}
*,*::before,*::after {box-sizing: inherit;}
html {box-sizing: border-box;}

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #000;
	font-family:  "gravita-hum-variable", Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-weight: 400;
	font-size: 1.9rem;
	line-height: 1.4;
}
h1,h2,h3,h4,h5,h6 {clear: both; margin: 1.2rem 0 0.8rem; font-size: 4.0rem; line-height: 1.2}
p {	/*margin-bottom: 1.5em;*/margin:1em 0;}
h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child,p {margin-top:0;}
p:last-child {margin-bottom:0;}
ul,ol {
    margin: 0 0 1.5em 0;
}
ul {list-style: disc;}
ol {list-style: decimal;}
li > ul,li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}
img {height: auto;max-width: 100%;}
figure {margin: 0;}
body {margin: 0; background: #999}

/* Links
--------------------------------------------- */
a {color: var(--brand-color-green)}
a:visited {color: var(--brand-color-green)}
a:hover, a:focus, a:active {color: var(--brand-color-green)}
a:focus {outline: thin dotted}
a:hover,a:active {outline: 0}

/* Navigation
--------------------------------------------- */

.main-navigation {display: flex; justify-content: space-between; padding-top: 15px}
.main-navigation ul {display: none; list-style: none; margin: 0; padding-left: 0}
.main-navigation li {position: relative; display: flex; align-items: center;}
.main-navigation a {align-items: center; text-decoration: none;}
.main-navigation a:hover, 
.main-navigation a:active, 
.main-navigation a:focus {color: var(--brand-color-bright-green)}
.main-navigation li.current-menu-item a {color: var(--brand-color-teal)}

.nav-l {display: flex; background: var(--brand-color-green); border-radius: 8px; align-items: center; padding: 20px 50px 20px 25px;height: 100px;justify-content: space-between;}
.nav-l img {margin-right: 85px}
.nav-l a {color: #FFF; font-size: 15px; line-height: 1; text-transform: uppercase}
.nav-r {padding: 20px; background: var(--brand-color-dark-grey); border-radius: 8px; display: flex; align-items: center;height: 100px;}

/* maxi menu */
.nav-l .mega-sub-menu .textwidget {padding-top:210px;}
.nav-l .sub-mm {font-size: 35px; font-weight: 300; padding: 0 /*170px*/ 35px 55px 25px; display: block; transition: transform 250ms; float: left}
.nav-l .sub-mm:hover {color: #009fab; transform: translateX(10px);}
.logged-in.page-membership #mega-sub-menu-66 { /* visibility: visible!important; */ } 
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-megamenu > ul.mega-sub-menu {
  top: -40px !important;
  z-index: -1 !important;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {display: block;}
.menu-main-menu-container {/*position: absolute;right: 0;top: 85px*/}
.nav-button-bg {display: flex; align-items: center; gap: 30px; height: 45px; padding: 3px 30px 0 30px; border-radius: 150px;background-color: rgba(20,20,20,0.5);backdrop-filter: blur(10px);}
.menu-toggle {width:30px;height: 30px;border:none;background: transparent;position: relative;padding:0;border-radius: 0;z-index: 30;cursor:pointer;color: transparent;}
.menu-toggle span {position: absolute; top: 1px; left: 0; width: 30px; height: 2px; background: #fff;
	-webkit-transition: transform 0.5s ease;
	-moz-transition: transform 0.5s ease;
	-o-transition: transform 0.5s ease;
	transition: transform 0.5s ease;
}
.menu-toggle span.bar1 {transform-origin:top right;}
.menu-toggle span.bar2 {top:12px;background: #fff;left:auto;right:0;
	-webkit-transition: width 0.5s ease;
	-moz-transition: width 0.5s ease;
	-o-transition: width 0.5s ease;
	transition: width 0.5s ease;
}
.menu-toggle span.bar3 {top:23px;background: #fff;transform-origin:bottom right;}
.toggled .menu-toggle span.bar1 {transform: rotate(-45deg);}
.toggled .menu-toggle span.bar2 {width:0;}
.toggled .menu-toggle span.bar3 {transform: rotate(45deg);}
.sub-menu-blur {border:1px solid red;position: absolute;opacity: 1;}
.sub-menu-blur:hover {border:1px solid green;opacity:1;}

/* Large screen menu (set width as appropriate) */
@media screen and (min-width: 1366px ) { 
	.menu-toggle, .nav-button-bg {display: none}
	.main-navigation ul {display: flex; align-items: center; gap: 28px; padding: 0}
	.main-navigation .nav-r ul {gap: 8px}
	.menu-main-menu-container {position: relative; right: 0; top: 0}
}


/* Posts and pages
--------------------------------------------- */
.page-content,.entry-content,.entry-summary {margin:0;}
.custom-logo-link {display: inline-block;margin-right:20px;}
/* Text meant only for screen readers. */
.screen-reader-text {border: 0;clip: rect(1px, 1px, 1px, 1px);clip-path: inset(50%);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute !important;width: 1px;word-wrap: normal !important;}
.screen-reader-text:focus {background-color: #f1f1f1;border-radius: 3px;box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);clip: auto !important;clip-path: none;color: #21759b;display: block;font-size: 0.875rem;font-weight: 700;height: auto;left: 5px;line-height: normal;padding: 15px 23px 14px;text-decoration: none;top: 5px;width: auto;z-index: 100000;}
#primary[tabindex="-1"]:focus {outline: 0;}

/* ================================================================================================================
   ______           __                  ________________
  / ____/_  _______/ /_____  ____ ___  / ____/ ___/ ___/
 / /   / / / / ___/ __/ __ \/ __ `__ \/ /    \__ \\__ \ 
/ /___/ /_/ (__  ) /_/ /_/ / / / / / / /___ ___/ /__/ / 
\____/\__,_/____/\__/\____/_/ /_/ /_/\____//____/____/  
                                                                                                        
-------------------------------------------------------------------------------------------------------------------
	--brand-color-gold: #B19254;  
    --brand-color-green: #21460F;

Image references in critical.css need full path as styles appear relative to page url not css file url 
================================================================================================================ */

/* Structure */
.contentmaxwidth, 		/* max-size of website - restrict max screen width for super wide screens - applied to page div */
.contentinnerfull, 		/* full content width images need this without the padding */
.contentinner, 			/* the standard inner width */
.entry-content > .wp-block-group > .wp-block-group__inner-container, 
.contentinner-lg,   /* the design sometimes need a larger inner width */
.contentinner-md,   /* the design sometimes need a medium inner width */
.contentinner-sm,   /* the design sometimes need a smaller inner width */
.contentinner-smd,
.contentinner-xs
{
	/* default width (also of group block contents) */
	width:1860px;padding: 0 20px 0 20px!important; margin: 0 auto; max-width: 100%; position: relative;
}
.entry-content > .wp-block-group.p-0 > .wp-block-group__inner-container {padding: 0 !important}

.contentinnerfull {width: 1920px;width: 1880px; padding: 0 !important;} /* (if different from above) no padding as its full width, even on mobile */
.contentinner-lg {width: 1840px; padding: 0 20px;} /* padding included at start so spacing ready for mobile. width = actual require width + padding. */
.contentinner-md {width: 1480px; padding: 0 20px;} /* padding included at start so spacing ready for mobile. width = actual require width + padding. */
.contentinner-smd {width: 1440px; padding: 0 20px;}
.contentinner-sm {width: 1240px; padding: 0 20px;} /* padding included at start so spacing ready for mobile. width = actual require width + padding. */
.contentinner-xs {width: 940px; padding: 0 20px;} /* padding included at start so spacing ready for mobile. width = actual require width + padding. */
.entry-content > .wp-block-group.contentinnerfull > .wp-block-group__inner-container {width: 100%;padding: 0 !important;}

.site-header {position: sticky; top:0; height: 115px; z-index: 10; padding: 0 10px; max-width: 1820px; margin: 0 auto} 

a.btn, p.btn a, li.btn a, .wp-block-button .wp-block-button__link {position: relative;text-transform: uppercase !important;  padding: 20px 30px; text-decoration: none; color: #fff;  font-size: 14px; border-radius: 4px !important}
a.btn.btn-green, p.btn.btn-green a {background-color: var(--brand-color-green)}
a.btn.btn-green::after, a.btn.btn-bright-green::after, a.btn.btn-teal::after {content: url(/wp-content/uploads/2026/05/arrow-light.svg); right: 10px; position: absolute; bottom: 2px}
p.btn.btn-green a::after, p.btn.btn-bright-green a::after, p.btn.btn-teal a::after {content: url(/wp-content/uploads/2026/05/arrow-light.svg); right: 10px; position: absolute; bottom: 2px}

a.btn.btn-bright-green, p.btn.btn-bright-green a, li.btn.btn-bright-green a {background-color: var(--brand-color-bright-green) !important; color: var(--brand-color-dark-grey)}

a.btn.btn-bright-green:hover, p.btn.btn-bright-green a:hover, 
a.btn.btn-teal:hover, p.btn.btn-teal a:hover, li.btn.btn-teal a:hover {color: var(--brand-color-dark-grey); background: #FFF !important}

a.btn.btn-green:hover, p.btn.btn-green a:hover, li.btn.btn-green a:hover  { background: var(--brand-color-teal) !important}

a.btn.btn-bright-green::after, p.btn.btn-bright-green a::after {content: url(/wp-content/uploads/2026/05/arrow-dark.svg); right: 10px; position: absolute; bottom: 5px}
a.btn.btn-teal, p.btn.btn-teal a, li.btn.btn-teal a {background-color: var(--brand-color-teal) !important}
a.btn.btn-green:hover::after, 
a.btn.btn-teal:hover::after {content: url(/wp-content/uploads/2026/05/arrow-dark.svg);}

a.btn-sm, p.btn-sm a {padding: 15px; display: block; text-align: center}
a.btn-wide {padding: 20px 50px}
.btn-scroll a {bottom: 26px; position: relative; right: 12px; padding: 20px 100px 20px 50px !important}
.btn-scroll a::after {content: url(/wp-content/uploads/2026/05/arrow-dark.svg); right: 10px; position: absolute; top: 5px}

.fs-14 {font-size: 1.5rem; line-height: 1.4}
.fs-16 {font-size: 1.8rem; line-height: 1.4}
.fs-17 {font-size: 1.75rem; line-height: 1.4}
.fs-18 {font-size: 1.85rem; line-height: 1.4}
.fs-24 {font-size: 2.4rem; line-height: 1.4} 
.fs-28 {font-size: 2.8rem; line-height: 1.4} 
.fs-40 {font-size: 4.0rem; line-height: 1.1} 
.fs-50 {font-size: 5.0rem; line-height: 1.1}
.fs-60 {font-size: 6.5rem; line-height: 1.1}

.lh-18 {line-height: 1.8!important}
.lh-20 {line-height: 2!important}
.lh-30 {line-height: 3!important}

#primary{margin-top: -115px;}
.sp-header{height: 130px;}/* 115px + 15px */

/* Footer */
.site-footer {background: var(--brand-color-dark-grey) ; min-height: 500px;display: flex; flex-direction: column; justify-content: space-between; padding: 30px 0 40px 30px; color: #FFF}

.site-footer .menu { margin: 0; padding: 0}
.site-footer .menu li { list-style-type: none}
.site-footer .menu li a {color:#FFF; padding-left: 10px; text-decoration: none}
.site-footer .menu li::before {content: "-";  color: #aad900}
.site-footer .menu li a:hover { color:#aad900; text-decoration: none;}

.foot-socials {font-size: 9vw; line-height: 0.8; margin-left: 30%; font-weight: 350}
.foot-socials ul {margin: 0; padding: 0; list-style: none;width: 95%;}
.foot-socials li {margin: 0; padding: 0}
.foot-socials a {color: #868686; transition: transform 250ms; display: block; text-decoration: none}
.foot-socials a:hover {color: #009FAB; transform: translateX(10px)}
.foot-cols {margin: 70px 60px 20px; font-size: 15px}
.foot-cols-l {display: flex; justify-content: space-between; gap: 20px}
.foot-cols1, .foot-cols2, .menu-footer-container {width: 33%}

/* Window */
.window {/*height: 80vh;min-height: 80vh;*/overflow: hidden;}
.fainttext {font-size:19vw; line-height:19vw;font-weight: 700; color: #fff;opacity:0.15;left: -1.1vw; position: relative; padding: 14vw 0;letter-spacing: 0.05em;}
.windowtext {font-size: 4rem;line-height: 1;padding: 250px 20px;text-align: center;color: #fff;font-weight: bold;}

.mobshow {display: none !important}

/* homepage */
.text1 {display: flex; align-items: flex-end; padding: 0 50px 30px;border-bottom:1px solid #fff;}

.homegradbox {
	
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: #000000;
  background: -webkit-linear-gradient(180deg,rgba(0, 0, 0, 0) 20%, rgba(36, 36, 36, 0.71) 75%, rgba(36, 36, 36, 1) 100%);
  background: -moz-linear-gradient(180deg,rgba(0, 0, 0, 0) 20%, rgba(36, 36, 36, 0.71) 75%, rgba(36, 36, 36, 1) 100%);
  background: linear-gradient(180deg,rgba(0, 0, 0, 0) 20%, rgba(36, 36, 36, 0.71) 75%, rgba(36, 36, 36, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#000000", endColorstr="#000000", GradientType=0 );
z-index: -1;
}

.stickimgtobot {display: flex; height: 96vh; align-items: flex-end}

@media only screen and (min-width: 1800px) {
	.fainttext {font-size:342px; line-height:342px;left: -20px; padding-top: 252px;}
	.windowtext {font-size: 4rem;line-height: 1;}
}


/* styles manually added in gutenberg - copy to blocks.css */



@media only screen and (max-width: 1680px) { 
	.fs-60 {font-size: 6rem}
	a.btn-sm, p.btn-sm a {padding: 16px 10px}
	a.btn, p.btn a, .wp-block-button .wp-block-button__link {font-size: 14px}
	a.btn-wide {padding: 15px 35px}
}

@media only screen and (max-width: 1620px) { 
	.nav-l img {margin-right: 45px}
	.main-navigation ul {gap: 20px}
	.nav-l a {font-size: 14px}
	a.btn-wide {padding: 20px}
}

@media only screen and (max-width: 1510px) { 
	.nav-l {width: 100%}
	.nav-r  {display: none !important}
	.mobshow {display: block !important}
    .mobshow.btn.btn-teal, .mobshow.btn.btn-bright-green {margin: 0 10px !important; display: inline-block !important}
}

@media only screen and (max-width: 1410px) { 
 .main-navigation ul {gap: 10px}
}

@media only screen and (max-width: 1366px) { /* laptop tweaks */
    .nav-l img {margin-right: 0; max-width: 90%}
	/*.nav-r ul {display: none !important}*/
	.fs-16 {font-size: 1.5rem}
	.fs-24 {font-size: 2rem}
	.fs-28 {font-size: 2.2rem}
	.fs-50 {font-size: 3.8rem}
	.fs-60 {font-size: 4rem}
	.gap-250 {gap: 200px}
	.foot-cols1 {width: 400px}
	.foot-cols1 img {width: 300px}
	.foot-cols {font-size: 13px}
	.col3-img {width: 60% !important}
}

@media only screen and (max-width: 1280px) {
	a.btn, p.btn a, .wp-block-button .wp-block-button__link {font-size: 13px}
}

@media only screen and (max-width: 1200px) {
	.nav-l .sub-mm {font-size: 15px;  padding: 0 10px 5px;  display: block;  float: none;  margin: 15px 5px}
}

@media only screen and (max-width: 834px) { 
	.foot-cols {font-size: 12px; margin: 20px}
	.foot-cols1 {width: 230px}
	.foot-cols1 img {width: 160px}
	.foot-cols3 {width: 250px}
	.fs-16 {font-size: 1.4rem}
	.fs-17 {font-size: 1.55rem}
	.fs-28 {font-size: 2.1rem}
	.fs-40 {font-size: 3.2rem} 
	.fs-50 {font-size: 3rem}
	.fs-60 {font-size: 4rem}
	.homeheader.contentinnerfull {padding: 0 !important}
	.stickimgtobot {height: 65vh}
}

@media only screen and (max-width: 410px) { 
	.contentinner-md {padding: 0 10px !important}
	.nav-l {padding: 20px 25px; height: 70px; max-width: 100%}
	.nav-l img {max-width: 75%}
	.pad-40 {padding: 20px}
	.pad-3040 {padding: 20px 15px}
	.fs-24 {font-size: 1.6rem}
	.fs-28 {font-size: 1.8rem}
	.fs-60 {font-size: 3rem}
	.fs-40 {font-size: 2.8rem} 
	.sp-200	{height: 75px !important}
	.site-footer {min-height: 400px}
	.foot-cols {margin: 50px 20px}
	.foot-cols-l {flex-direction: column}
	.foot-cols1, .foot-cols2, .menu-footer-container {width: 99%}
	.foot-cols1 {order: 1}
	.foot-cols2 {order: 3}
	.menu-footer-container {order: 2}
	.foot-cols3 {display: none}
	.btn-scroll a {padding: 10px 50px 10px 25px !important; left: 6px; bottom: 12px}
	.foot-socials {font-size: 12vw; line-height: 0.9; margin-left: 6%}
}