html,
body {
	padding: 0;
	margin: 0;

}

body {
	background: #e3e4e5;
	font-family: 'Open sans', sans-serif;
	position: relative;
	-webkit-text-size-adjust: none;
}

@media all and (min-width : 1400px) {
	body {
		width: 70%;
		margin: 0 15%;
		
	}
}

body * {
	text-shadow: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: 1.2;
	margin: 20px 0 10px 0;
}

h1 {
	padding: 12px 5% 0px 5%;
	margin: 0px;
	font-weight: 600;
	font-size: 2.3em;
	letter-spacing: .1em;
 
}

h2 {
	font-size: 1.6em;
	color: #8FA066;
	padding: 0px 5% 16px 5%;
	margin: 0;
	font-weight: 600;
	line-height: 1.6em;
   }

h3 {
	font-size: 1.2em;
	line-height: 1.9em;
	padding: 0 5%;
	font-weight: 600;
	color: #788752;
	
}

h4 {
	font-size: 1em;
	padding: 0 0 0 5%;
	color: #aaa; line-height: 1.8em;
	font-weight: 400;
}

p {
	font-size: 1.08em;
	padding: 0 5% 12px 5%;
	margin: 0px;
	font-weight: normal;
	color: #6c6c6c;
	line-height: 1.8em
}



@media only screen and (max-width: 480px) {
	h1 {
		font-size: 2em;
		line-height: 1em;
		padding: 4px 0% 0 1%;
	}

	h2 {
		font-size: 1.6em;
		padding: 40px 3% 10px 3%;
	
	}

	h3 {
		font-size: 1.08em;
		line-height: 1.4em;
		padding: 0 3% 0 3%;
		font-weight: 700;
	  
	}

	p {
		padding: 0 4% 0 4%;
		font-size:1.08em;
	}
}


img {
	margin: 0;
	padding: 0 32px 12px 0;
	max-width: 100%;
	height: auto;

}

.big {
	color: #002395;
	font-size: .9em;
	opacity: .9;
	line-height: 1em;
	padding: 0;
}

.red {
	color: #ED2939;
	font-size: .8em;
	opacity: .5;
	line-height: .8em;
	font-family: 'Open Sans', sans-serif;
	border-bottom: 60px solid;
	padding: 0 0 23px 0;
	text-shadow: 0 0 0;
}

.quote {
	background: transparent url(quote.png) no-repeat 4% 50%;
}

@media only screen and (max-width: 480px) {
	.big {
		font-size: 1.2em;
		opacity: .9;
		line-height: .8em;
	}

	.red {
		color: #ED2939;
		font-size: .8em;
		opacity: .5;
		line-height: .8em;
		font-family: 'Open Sans', sans-serif;
		border-bottom: 0;
		padding: 0 0 23px 0;
		text-shadow: 0;
	}
}

.sml {
	font-size: .67em;
	padding: 0 0 0 290px;
}

.sml2 {
	font-size: .67em;
	padding: 0 0 0 3%;
}

.cta {background: #DDE29F; border: 4px solid #fff; padding: 9px 15px; color: #51612E; font-size: 1.4em;}
.cta:hover {background:  #51612E; color: #DDE29F;}

.spacer {
  clear: both;;
  height: 8px;
  color: transparent; }
  

  .split {float: left; background: transparent; width: 40%; padding: 0 5%; height: 300px;}
   

@media only screen and (max-width: 600px) {
	
	.split {float: left;  width: 90%; padding: 0 5%; }
	
	}


.fab, .far {padding: 12px 15px 10px 0 ; }
.fas{padding: 12px 25px 10px 10px ; }



.col {
  column-count: 2;
  column-gap: 40px;
padding: 0 0 0 7%;
font-weight: 600;
border-left: solid 40px #eee;
}

@media only screen and (max-width: 600px) {
	

.col {
  column-count: 1;
  column-gap: 40px;
padding: 0 0 0 15%;
}	
	
}


a,
a:link,
a:active,
a:visited,
a:hover {
	color: #51612E;
	border-bottom: 2px solid  #51612E;;
	text-decoration: none;
	outline: none;
    padding: 4px;
	font-weight: 600;
}

a {
	outline: none;
}

a:hover {
	
	text-decoration: none;
	outline: none;
	color: white;
	background: #799737;
}

a:active {background: #fff; border: 0; color: #799737;}


.ar a {border-bottom: 0 !important;}




ul li {
	list-style-type: disc;
	margin: 0px 0 0 8%;
	padding: 0;
	color: #399;
}


/* menu stuff g'wan 'ere */
nav:not(.mm-menu) {
	display: noneX;
}

#menu p {
	color: #ffc;
	padding: 20px;
	font-size: 1em;
	background: transparent;
	font-weight: normal;
}

#menu h3 {
	font-size: 1.2em;
}


#menu a {
	color: #fff;
}

#menu a:hover {
	color: #ff0;
}


.header {
	background: khaki;
	font-weight: normal;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	top: 0;
	height: 46px;
	padding: 0 50px;
	position: fixed;
	opacity: .8;
}



@media all and (min-width : 1400px) {
	.header {
		width: 80%;
		margin 0 10%;
	}
}

.header a {
	background: center center no-repeat transparent;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC );
	display: block;
	width: 40px;
	height: 40px;
	position: absolute;
	top: 4px;
	left: 12px;
}



.header2 {
	background: #000;
	font-weight: normal;
	color: #fff;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	top: 0;
	height: 50px;
	opacity: .9;
	padding: 7px 0 0 0;
	position: fixed;
}


@media only screen and (min-width: 480px) {
	.header {
		width: 10%;
		background: transparent;
	}

	.header2 {
		display: none;
	}

	.header FixedTop {
		display: none
	}

	.header a {
		display: none;
	}
}



.header.fixed {
	position: fixed; top: 0;	left: 0;
}


/*==========content ===============*/

.content,
.footer {

	background: #fffaf0;
}



#contain {
	height: auto;
	width: auto;

	background: #fff;
}



#banner{
	background: #44704a;
	height: 500px; width: 100%;
	padding: 0;
}

#banner h1{padding: 300px 7.5% 0px 5%;  margin: 0px;   font-size:5em; 	font-family: 'Abril Fatface', cursive; opacity: .95; text-shadow: 1px 10px 1px #b00 !important;}
#banner h2 {font-size: 1.4em;  padding: 0 7.5% 0 5% !important;  color: #DDE29F; margin: 0; font-weight: 400; letter-spacing: .08em; text-shadow: 2px 2px 1px #111;}

#banner a { color: white; background: transparent; border:0;}
#banner a:hover {color: #D6CB56;}

#banner img {border: 0 !important; width: auto !important;}


@media only screen and (min-width: 1024px) 
{ #banner h1 {font-size: 7em; padding: 290px 0 10px 5%;}
}

@media only screen and (max-width: 480px) 
{ #banner h1 {padding: 130px 0 50px 3%;} 
  #banner h2  {font-size: 1.4em; padding: 0 3% 20px 5% !important; line-height: 1.25em; letter-spacing: .2em;}
}



#first {
	height: auto;
	width: 100%;
 background:snow;
}

#first h1 {
	text-shadow: 0 0 0 ;
 letter-spacing: .023em !important;
 padding: 32px 5% 32px 5% ; line-height:1.8em;
	font-family: 'Open sans', sans-serif;
color: #4E6D61; font-weight: 400;
}


@media only screen and (max-width: 480px) {
#first h1 { font-size: 2em !important; padding: 23px 2% !important;}
#first h3 {line-height: 1.9em;}	
}


#first img {padding: 48px 32px 32px 5%;}


#second {
height: auto; 
	background:#799737 ;
	padding: 5% 2%;
	margin: 0 3%;
  border-radius: 8px;
  border: solid 8px white;
}

#second h2, #second h3, #second p {
	color: white;
}

#second a{color: #ffc; border-bottom: 2px solid #ffc;}
#second a:hover{color: #fff; border: 0; background: #799737; }



#third {
	height: auto;
	background: white;
	width: auto;
}


#half1 {
	width: 50%;
	height: auto;
	float: left;
}

#half2 {
	width: 50%;
	height: auto;
	float: right;
}

@media only screen and (max-width: 768px) {
	#half1 {
		width: 100%;
		height: auto;
		float: left;
	}

	#half2 {
		width: 100%;
		height: auto;
		float: right;
	}
}



#four {
	height: auto;
	background: transparent;
	width: 100%;
}

#four h2 {	padding: 20px 10% 20px 10%;}

#map {background: lavender;}

iframe {margin: 4% 2% 2% 2%; box-shadow: 0px 0px 20px rgba(23, 23, 23, 0.2);}

#textarea {background: #DDE29F;}
#textarea:hover {background:white;}

/* footer ********************/

.footer {
	background: #799737 !important;
	font-weight: normal;
	width: 100%;
	height: 700px;
	padding: 0 0 40px 0;
	margin: 0;
	}
	
.feet1 {width: 40%; height: 700px; float: left; padding: 20px 0 0 0;}
.feet2 {width: 57%; height: 700px; float: left; padding: 30px 0 0px 2%; }


.feet1 h3 {font-size: 1.25em !important; padding: 0 5% 0 0 !important;}
	
.feet2 h4{font-size: 1em; color: white; padding:3% 1% 0 1%; }
.feet2 p {color: #fff; font-size: .9em; padding:0% 32% 0 3%; line-height: 1.5em;}


@media only screen and (max-width: 800px) {
.feet1 {width: 100%; height: 650px !important; background: #799737; text-align: left;}
.feet2 {width: 100%; height: 850px !important;  background: #799737; padding: 30px 0 0px 0; margin: 0;}

.feet1 h3 {padding: 0 5% !important; font-size: 1.6em;}	

.feet2 h4 {padding: 0; }
.feet2 p {padding: 0 5%;  }
}


.where {width: 40%; padding:2% 1% 30px 2%;  height: 200px; float: left; margin: 0 2%; }

@media only screen and (max-width: 800px) {
	.where {width: 100%; padding:2% 2% 2% 0%;  height: 170px; float: left; 
	margin: 0 2%;}
	
	.where h4 {text-align: center;}
}




@media all and (min-width : 1400px) {
	.footer {
		width: 100%;
	}
}

.footer.fixed {
	position: fixed;
	bottom: 0;
	left: 0;
}


.footer a {
	color: #fff;
	border: 0; background: transparent;
}

.footer a:hover {
	color: yellow;
}

.footer h3 {
	font-size: 1.6em;
	line-height: 0.4em;
	margin: 0;
	padding: 28px 0 0px 6%;
	font-weight: normal;
	color: #fff;
	letter-spacing: .05em;
}

@media only screen and (max-width: 480px) {

	.footer {
		position: relative;
		font-weight: normal;
		width: 100%;
		height: 270px;
		margin: 0;
		text-align: center;
		background: #799737 !important;
	}

	.footer h3 {
		font-size: 1.1em;
		line-height: 1.4em;
		margin: 0;
		padding: 0;
		font-weight: normal;
		
	}
}



/* code for gallery on pages  https://galleria.io/ 

.galleria {
	width: 100%;
	height: 800px;
	background: transparent;
	padding: 20px 0 4px 0;
	margin: 0;
	float: left;
}

@media only screen and (max-width: 768px) {
	.galleria {
		height: 500px;
	}
}


@media only screen and (max-width: 480px) {
	.galleria {
		height: 350px;
	}
}


@media only screen and (max-width: 360px) {
	.galleria {
		height: 290px;
	}

}
*/







/* for desktop yada - - - - - - - - - - - - - - - - - -*/
#navcon {width: 100%;  height: 70px; background: #223d25; position:fixed; z-index: 32; padding: 0;}
#navcon a{color: #fff !important; background: transparent;}
#navcon a:hover{color: yellow !important;}

 
 @media all and (min-width : 1400px) {
	#navcon {
		width: 55%;
		margin: 0;
		
	}
}
 
 
   @media only screen and (max-width: 920px) 
{#navcon {width: 100%; padding:0;}
}




/* #nav2 - right side of nav bar */
#nav2 { width: 20%; height: 70px;  margin: 0 0% 0 80%; padding: 0 1% 0 0%; float: right;  
position: fixed; text-align: right !important; background: transparent;  }

#nav2 h2 {font-size: .9em; padding: 8px 0px 0px 0px !important; color: white;}
#nav2 a{border: 0 !important;}

@media all and (min-width : 1400px) {
	#nav2 {width: 14%;
		margin: 0 0% 0 55%;
	background: #223d25; 
	}
}



@media only screen and (max-width: 920px) {
#nav2 {width: 100%; height: auto;  margin: 40px 0 15px 0; padding: 0 ; float: right; position: static;   z-index: 30; text-align:center !important; }
#nav2 h1 {font-size: 1.4em; padding: 0;}
}

@media only screen and (max-width: 480px) {#nav2 {background: #223d25; }	
}



/* nav */
nav { margin:0; width: 67%; position: fixed;   float: left; padding: 0 0 0 1%; height: 70px; position: fixed; z-position: 50; }

@media only screen and (max-width: 920px) {
nav {margin:  0; padding: 0; width: 100%; position: fixed; z-index: 32;  float: left; }}
	
@media only screen and (max-width: 480px) 
{nav {display: noneX;}
}


nav ul li {	list-style-type: none;	margin: 0; padding:0  6px;}


/* code for menu---- http://www.cssscript.com/pure-css-mobile-compatible-responsive-dropdown-menu/ ------*/
 .toggle, [id^=drop] {display: none;}


nav:after {
  content: "";
  display: table;
  clear: both;
}

nav ul {padding: 0;  margin: 0;  list-style: none;  position: relative;  text-align:left;padding: 10px 0 0 0; font-weight: 400;}

@media only screen and (max-width: 920px) {	nav ul {text-align:center;}	}


nav ul li {  margin: 0px; display: inline-block; float: left;  z-index: 20; /* here for 2nd part of menu */
  	list-style-type: none; }

nav ul li:hover { opacity: .9; }

nav a {  display: block;   padding: 0 12px; color: #fff !important; line-height: 50px; text-decoration: none;}

nav a:hover { border-bottom: 0;}

nav ul li ul li:hover {color: #000; }

nav ul ul {
  display: none;
  position: absolute;
  top: 50px; 
}

nav ul li:hover > ul { display: inherit;  }

nav ul ul li {
  width:210px; background: #223d25;; border-bottom: 0;
  float: none;
  display: list-item;
  position: relative; opacity: 1;
}
	
nav ul ul ul li {
  position: relative;
  top: -60px;
  left: 210px;
  width:270px;
}

nav ul ul ul li:hover {   background: yellow;}

li > a:after { content: ' '; }

li > a:only-child:after { content: ''; }


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 920px) {


.toggle + a,
 .menu { display: none; }

.toggle {
  display: block; 
  background-color: #223d25;; /* colour of mobile device menu */
  padding: 0;
  color: #fff;
   line-height: 50px;
  text-decoration: none; width: 100%;
  border: none; margin:  0; text-align: center; 
}

.toggle:hover {  color: yellow; }

[id^=drop]:checked + ul { display: block; }

nav ul li {  display: block;  width: 100%; background: #223d25;; padding: 0;}

nav ul ul .toggle,
 nav ul ul a { padding: 20px; }

nav ul ul ul a { padding: 0; }

nav a:hover,  nav ul ul ul a { background-color: #223d25;; color: #fff !important; }

nav ul li ul li .toggle,  nav ul ul a { background-color: #111; color: #fff !important;}

nav ul ul {  float: none;  position: static;  color: #fff !important; background-color:#223d25;; }

nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }

nav ul ul li {  display: block;  width: 100%;}

nav ul ul ul li { position: static;}

nav ul ul li:hover {color:#f00;}

}


@media all and (max-width : 330px) {

nav ul li {  display: block;  width: 100%;}
}







@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap");

/* 
  CONTACT FORM EXAMPLE FOR FORMCARRY

  IMPORTANT NOTE:
  PLEASE ADD formcarry-form class to your form element
  to apply the styles.
*/

.formcarry-container * {
  box-sizing: border-box;
	font-family: "Inter", sans-serif;

  /* colors */
  --color-blue: #2552d0;
  --color-light-blue: #3266e3;
  --color-gray: #e5e7eb;
  --color-dark-gray: #9da3ae;
  --color-pink: #edadd2;
}

.formcarry-container {
  /* container */
  --c-width: 50%;
  --c-max-width: 500px;

  width: var(--c-width);
  max-width: var(--c-max-width);
  display: block;
  margin: 10vh auto 0 auto;
}

.formcarry-form label {
  display: block;
  padding: 12px 0 2px 0;
  letter-spacing: -0.2px;
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
}

.formcarry-form input,
.formcarry-form textarea {
  font-size: 16px;
  display: block;
  width: 100%;
  padding: 10px;
  background-color: var(--color-gray);
  border: none;
  border: 4px solid var(--color-gray);
  outline: none;
  border-radius: 8px;
  color: var(--color-dark-gray);
}

.formcarry-form input:focus,
.formcarry-form textarea:focus {
  background-color: #fff;
  color: var(--color-dark-gray);
}

.formcarry-form input:focus:required:invalid {
  border-color: var(--color-pink);
  background-color: #fff;
}

.formcarry-form button {
  display: block;
  margin-top: 12px;
  width: 100%;
  padding: 12px 20px;
  border-radius: 8px;
	border-color: transparent;
  background-color: var(--color-blue);
  color: #fff;
  font-weight: 700;
  font-size: 18px;

  transition: 300ms all;
}

.formcarry-form button:hover {
  background-color: var(--color-light-blue);
}

.formcarry-alert {
  padding: 12px;
  border-radius: 10px;
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  margin-top: 12px;
  display: none;
}

.formcarry-alert.visible {
  display: block;
}

.formcarry-alert.success {
  background: #69cf9d;
}

.formcarry-alert.error {
  background: #de524c;
}