/* add typekit @font-face here if required 

 font-family: "neue-haas-grotesk-display", sans-serif;
    Neue Haas Grotesk Display Pro 25 Thin
        font-weight: 200;
    Neue Haas Grotesk Display Pro 45 Light
        font-weight: 400;
    Neue Haas Grotesk Display Pro 55 Roman
        font-weight: 500;
    Neue Haas Grotesk Display Pro 65 Medium
        font-weight: 600;
    Neue Haas Grotesk Display Pro 75 Bold
        font-weight: 700;
*/


/*--------------------------------------------------------------
Above the fold CSS only, including:
 - headers
 - page layout containers
 - main fonts
--------------------------------------------------------------*/
:root {
	--brand-color-yellow: #EBEB05;   
    --brand-color-grey-dark: #393939;
    --brand-color-grey-extra-dark: #2F2F2F;
    --brand-color-grey-light: #E2E2D7;
    --brand-color-grey-pale: #EFEFEA;
    --brand-color-uni-green-light: #40B38B;
    --brand-color-uni-green-dark: #113D3C;
}

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  font-size: 62.5%; /* 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;}
main {display: block;}

h1 {font-size: 2em;margin: 0.67em 0;}

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:  "neue-haas-grotesk-display", Arial, "Helvetica Neue", Helvetica, sans-serif; /* -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; */
	font-weight: 500;
	font-size: 1.75rem;
	line-height: 1.2;
}
h1,h2,h3,h4,h5,h6 {clear: both; margin: 20px 0 10px; line-height: 1.2; font-weight: 500}
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;}

/* Links
--------------------------------------------- */
a {
	color: var(--brand-color-green); text-decoration: none
	
}
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;}

/* Forms
--------------------------------------------- */

select {border: 1px solid #ccc}
textarea {width: 100%}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {margin: 0 0 1.5em}

.posts-navigation .nav-links,
.post-navigation .nav-links {display: flex}

.posts-navigation .nav-previous,
.post-navigation .nav-previous {flex: 1 0 50%}

.posts-navigation .nav-next,
.post-navigation .nav-next {text-align: end; flex: 1 0 50%}


/* Posts and pages
--------------------------------------------- */
.page-content,.entry-content,.entry-summary {margin:0;}
/* Make sure logo link wraps around logo image. */
.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 */
{
	/* default width (also of group block contents) */
	width: 1800px;padding:0px 20px 0 20px;margin:0 auto; max-width: 100%;position: relative;
}
.contentmaxwidth,
.entry-content > .contentmaxwidth.wp-block-group > .wp-block-group__inner-container  {width:1880px;padding:0;} /* no padding required */
.contentinnermax {width: 100%}
.entry-content > .contentinnermax > .wp-block-group__inner-container {width: 100%; padding: 0}
.contentinner1700 {width: 1800px; padding: 0 20px; margin: 0 auto; max-width: 100%}
.contentinnerfull {width:1800px;padding:0 20px;} /* (if different from above) no padding as its full width, even on mobile */
.contentinner-lg {width:1640px;padding:0px 20px 0 20px;} /* padding included at start so spacing ready for mobile. width = actual require width + padding. */
.contentinner-md {width:1440px;padding:0px 20px 0 20px;} /* padding included at start so spacing ready for mobile. width = actual require width + padding. */
.contentinner-sm {width:1240px;padding:0px 20px 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;}

.site-header {display: flex; position: sticky; top: 0; height: 90px; background: #fff; z-index: 10; justify-content: space-between; padding: 0 20px; align-items: flex-start; box-shadow: 0 70px 70px rgba(0,0,0,0.1)}
.site-branding {padding: 6px 0; display: flex; height: 90px; align-items: center}

a.btn, p.btn a, .wp-block-button .wp-block-button__link {letter-spacing: 1px; padding: 15px 60px; text-decoration: none; color: #000;  font-size: 1.6rem; background-color: var(--brand-color-grey-light); display: inline-flex;  align-items: center; border: none; border-radius: 50px; font-weight: 600}
a.btn-dark, p.btn-dark a, .wp-block-button .wp-block-button__link {background: var(--brand-color-grey-extra-dark); color: var(--brand-color-grey-light)}
a.btn.btn-small, p.btn.btn-small a, .wp-block-button.btn-small .wp-block-button__link {padding: 6px 35px 6px 20px;  font-size: 1.3rem}
a.btn:hover, a.btn:focus,
p.btn a:hover, p.btn a:focus,
.wp-block-button .wp-block-button__link:hover, .wp-block-button .wp-block-button__link:focus {
	background-color: var(--brand-color-uni-green-dark); color: #FFF;
}
a.btn.btn-green:hover, a.btn.btn-green:focus,
p.btn.btn-green a:hover, p.btn.btn-green a:focus,
.wp-block-button.btn-green .wp-block-button__link:hover, .wp-block-button.btn-green .wp-block-button__link:focus {background-color:#000}

#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link {font-weight: 500 !important; line-height: 1.2 !important; padding: 35px 50px 0 12px !important;}
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item.mmep > a.mega-menu-link {padding-top: 54px !important; border-right: none}
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link:hover {border-color: inherit !important}

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

.anchor-target {scroll-margin-top: 115px}



@media only screen and (max-width:1500px) { 
	#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link {padding: 35px 20px 0 12px !important;}
}

@media only screen and (max-width:1366px) {
	.menu-wre {width: 130px !important}    
	#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link {padding: 35px 10px 0 12px !important;}
}

@media only screen and (max-width: 990px) {
	#mega-menu-wrap-menu-1 .mega-menu-toggle .mega-toggle-block-1 .mega-toggle-animated-inner, 
	#mega-menu-wrap-menu-1 .mega-menu-toggle .mega-toggle-block-1 .mega-toggle-animated-inner::before, 
	#mega-menu-wrap-menu-1 .mega-menu-toggle .mega-toggle-block-1 .mega-toggle-animated-inner::after {background: #FFF}
	#mega-menu-wrap-menu-1 .mega-menu-toggle {margin-top: 20px}
	#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link {padding: 10px 0 0 20px !important}
	#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link span {display: none}
	#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item.mmep > a.mega-menu-link {padding-top: 0 !important}
	.site-branding {padding: 0 !important; width: 110px}
	.menu-wre {width: inherit !important}    
}

@media only screen and (max-width:991px) { /* bootstrap breakpoint (good for a single breakpoint between tablet landscape & portrait) */
	
}

@media only screen and (max-width:781px) { /* wp columns inline at this point */

}

@media only screen and (max-width:768px) { /* tablet portrait (and below) */
	
}

@media only screen and (max-width:575px) {
	a.btn, p.btn a, .wp-block-button .wp-block-button__link {padding: 10px 40px; font-size: 1.4rem}
}


