/* You can change this file
This css is for anything related to colours of main divs

Paste the brand colours you've been given here: 
    
    #9c7301; /* gold * / 
    #353535; /* gray * /
    */
:root {
	--teal: #4d896a;
	--green: #6dad3d;
	--green-transparent: #6dad3d50;
	--brown: #4e4341;
	--gray: #353535; /* var(--gray) text colour in main */
	--palegrey: #dedede; /* var(--palegrey) */
	--header-background: white;
	--topnav-background: var(--gray);
	--topnav-color: white;
	--transparent-black: #00000070; /* var(--transparent-black) */
	--headergrey: #787878; /* var(--headergrey) */
	--darkgrey: #53514f;  /* var(--darkgrey) */
	--blue: #191970; /* var(--blue) */
	--royalblue: #0047AB; /* var(--royalblue) */
	--button-text: white; /* var(--button-text) */
	--button-background: var(--green); /* var(--button-background) */
	--standard-background: var(--palegrey); /*var(--standard-background)*/
	--footer-background: var(--darkgrey); /*var(--footer-background)*/
	--footer-text: white; /*var(--footer-text)*/
	--newsletter-background: var(--red); /*var(--newsletter-background)*/

}

.brand_colour{ background: white !important;
 color: var(--gray) !important;}


.brand_colour button{ color: var(--button-text) !important;
background: var(--button-background) !important;}

#main { color: var(--gray); }

.gray { background: #dedede !important; }

.red{
	background: var(--green);
}

html, body ,
#header ,
#footer { color: var(--gray);
 background: white; 
 }

#page {
color: inherit;
}

/* Backgrounds */

#page {
background: inherit;    
}

#header {
background: var(--header-background); 
background-size: 100% 100%;       
}

#topnav,#editlisting {
background: white;
color: var(--green);
}

.green {
background: var(--green);
color: white;	
}

#header > #page {
background: transparent !important;
}

#logo {
background: inherit;
}

#sidewrapper #page {
	background: transparent;
}

#nav {
	background:transparent;
color: white; 
}

#nav li a {
background: transparent;    
color: var(--green);   
}

#nav li a:hover {
    color: var(--gray);
}

#gallery {
background: none; 
}

#gallery #fullblock > span {
	color: white;
	text-shadow: 2px 2px 2px black;
}

#gallery .white i, #gallery .white input {
	color: var(--green);
}

#gallery input[type="submit"], #gallery .wp-block-button i  {
	color: white;
	background: transparent;border: none;
}

#gallery #fifthblock {
	color: var(--green);
}

button {
   background: var(--green);
   color: white;
}

#main {
background: white;
}

.section_banner {
color:  white;
}

#halfblock {
background: inherit;
}

#thirdblock {
    background: inherit;
}

#footer {
    background: #2f2f2f; /* gray */
}

/*
#header #sidewrapper button:first-of-type{
	background-color:var(--headergrey);
}

#header #sidewrapper button:last-of-type{
	background-color:var(--green);
} */

#header #logo img{
	background:white;
}

#gallery #gray-background #quarterblock{
	background:var(--gray);
}

#front button{
	background: var(--button-background);
	color: var(--button-text);
}

#halfblock-container{
	background: var(--standard-background);
}

#footer #fullblock:first-of-type{
	background: var(--newsletter-background);
}

#footer #fullblock{
	color: var(--footer-text);
	background:var(--footer-background);
}

#gallery #quarterblock:nth-of-type(1) #inset, #gallery #quarterblock:nth-of-type(3) #inset{
	box-shadow: 20px -22px var(--darkgrey);
}

#halfblock #inset > strong {
	border-bottom:3px solid var(--green);
	display:inline-block;
	width: 100%;
	padding-bottom: 3%;
}

#front #halfblock #inset a{
	margin-bottom:10%;
}

.colourgreen {
color: var(--green);	
}

.wp-block-button:hover, button:hover {
background: var(--brown) !important;
}