html, body {
	margin: 0;
	padding: 0;
	top:0;
	bottom:0;
	right:0;
	left:0;
	font-family: "Stack Sans Text", sans-serif;
	font-optical-sizing: auto;
	font-weight: 300;
	font-style: normal;
	color:black;		
}

html
{
  scroll-padding-top: 9vw; /* height of sticky header */
}

h1{
	width:100%;
	text-align:center;
	margin:0;
	padding:0;
	position: relative;
}

hr{
	clear: both;
	border: 0;
	height: 1px;
	background-image: linear-gradient(to right,rgba(0,0,0,0),rgba(255,255,255,.75),rgba(0,0,0,0));
	width:50%;
}

body {
	background: #257D5B;
	background: -webkit-linear-gradient(180deg, rgba(37, 125, 91, 1) 0%, rgba(134, 171, 73, 1) 100%);
	background: -moz-linear-gradient(180deg, rgba(37, 125, 91, 1) 0%, rgba(134, 171, 73, 1) 100%);
	background: linear-gradient(180deg, rgba(37, 125, 91, 1) 0%, rgba(134, 171, 73, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#257D5B", endColorstr="#86AB49", GradientType=0);	
}

body input, select{
	cursor:pointer;
}

a {
	box-sizing:border-box;
}

a:link {text-decoration: underline; font-weight:bold; color:white;}
a:visited {text-decoration: underline; font-weight:bold; color:white;}
a:active {text-decoration: underline; font-weight:bold; color:white;}
a:hover {text-decoration: none; font-weight:bold; color:white;}

div {
	box-sizing:border-box;
	position: relative;
}

strong {
	font-weight:800;
}

button {
    background-color: transparent;
    background-repeat: no-repeat;
    border: none;
    cursor: pointer;
    overflow: hidden;
    outline: none;
}

img{
	max-width:100%;
	border:0;
	padding:0;
	margin:0;
}

.social_media_icon {
	max-width:100px;
}

.divider{
	width:100%;
	text-align:center;
	margin-top:45px;
	margin-bottom:25px;
}

.break{
	height:1px;
	width:200px;
	margin-left:auto;
	margin-right:auto;
	background-color:white;
	margin-top:25px;
}

.left{
	float:left;
	box-sizing:border-box;
	padding:10px;
}

.site-info{
	display:none;
}

.entry-title{
	display:none;
}

.site-header{
	display:none;
}

.widget-area{
	display:none;
}

ul, li {
	/*
	list-style-type: square;
	margin-left:25px;
	box-sizing: border-box;
	padding:5px;
	*/
}

.break {
	width:100%;
	height:5px;
	background-color:#649197;
}

.logo {
	font-family:serif;
}

#master {
	/*mask-image: linear-gradient(90deg,rgba(122, 174, 214, 0.8) 0%, rgba(255, 255, 255, 0.9) 2%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0.9) 98%, rgba(122, 174, 214, 0.8) 100%);*/
}

#clouds{ 
	width: 100%;
	position: relative;
}

#clouds img {
	width: 100%;
	position: absolute;
}


#grass{ 
	width: 100%;
	position: relative;
	z-index:999;
}

#grass img {
	width: 100%;
	position: relative;
	display:block;
}

#content {
	
}

.guts{
	position:relative;
	width:100%;
	padding-top:50px;
	margin-left: auto;
	margin-right: auto;	
}

#footer {
	background-color:#72a223;
	padding-bottom:100px;
}

#contact{
	width:100%;	
	background-color:#5e6264;
	background: url('./resources/services_bg.jpg') center no-repeat;
	background-size: cover;	
	padding-top:100px;
	padding-bottom:50px;
	clip-path: polygon(0 100%, 0 20%, 20% 20%, 43% 0, 39% 20%, 100% 20%, 100% 100%);		
	display:flex;	
	position:relative;
	z-index:80;		
}

/* begin form css */

input::placeholder{
	color:#649197;
	font-size:16px;
}

input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:#649197;
	font-size:16px;
}

input::-ms-input-placeholder { /* Microsoft Edge */
	color:#649197;
	font-size:16px;
}

#fname {
	grid-area:fname;
}

#lname {
	grid-area:lname;
}

#email {
	grid-area:email;
}

#phone {
	grid-area:phone;
}

#contact_form {
	width:50%;
	height:100%;
	padding:25px;
	border:0;	
	align-self: center;
}

#contact_form form {	
	display: grid;
	column-gap: 10px;
	row-gap: 10px;		
	grid-template-columns: 50% 50%;
	grid-template-rows: auto;
	grid-template-areas:
	  "fname lname"
	  "email phone"
	  "message message"
	  "submit submit";
}

#message::placeholder {
  display:none;
}

#contact_form input[type="text"] {
	width:100%;
	padding:0;
	margin:0;
	border:0;
	display:block;
	box-sizing: border-box;
	padding:10px;	
    padding-block: 0px;
    padding-inline: 0px;	
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:25px;
	border-radius:5px;
	/*grid-column: 1/2;*/
}

#contact_form input[type="textarea"] {
	width:100%;
	display:block;
	box-sizing:border-box;
	padding:0;
	margin:0;
	border:0;	
	grid-area: message;
	grid-column: 0;
    padding-block: 0px;
    padding-inline: 0px;
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:100px;
	border-radius:5px;	
}

#contact_form input[type="submit"] {
	width:250px;
	height:50px;
	display:block;
	padding:0;
	margin:0;
	border:0;	
	grid-area: submit;
	grid-column: 0;
	margin-left:auto;
	margin-right:auto;
	font-size:20px;
	text-transform:uppercase;
	border-radius:5px;
	font-weight:400;
	background-color:#649197;
}

#contact_bio{
	height:100%;
	justify-content:center;
	align-self:center;
	text-align:center;
	color:white;
	font-size:40px;
	flex:1;
	text-shadow: 3px 3px 0 rgba(0,0,0,.5);
}

#contact_bio h2 {
  
}

/* end form css */

#attributions{
	width:100%;
	text-align:center;
	padding:30px;	
}

#toggle{
	display:none;	
}

#toggle:checked + #reveal {
	display:block;
}

#reveal {
	padding:25px;
    display:none;
}

#attributions label {
    background: #4B720A;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
	display:block;
	width:300px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	cursor:pointer;
}

#credits {
	background-color:#72A223;
}

#powered{
	padding:15px;
}

@media only screen and (min-width : 2100px){

	.guts {
		max-width: 2100px;	
	}

}


@media only screen and (min-width : 1024px) and (max-width : 1200px) {		

}


@media only screen and (min-width : 0px) and (max-width : 1024px) {	

	.guts{
		padding-top:50px;
	}	

	#contact {
		flex-flow: column-reverse;
		padding-top:200px;
	}
	
	#contact_form{
		width:100%;
	}
	
#contact_bio{
	font-size:30px;
}

#contact_bio h2 {
  
}	
	

}