/* site.css */
html{
	font-family: Tw Cen MT, Poppins, Century Gothic, Aprows;
	background-image: linear-gradient(rgba(0, 100, 0, 0.25), rgba(0, 100, 0, 0.75)), url(zzlogo1.png);
	background-repeat: no-repeat, no-repeat;
	background-attachment: fixed, fixed;
	background-size: cover ,30%;
	background-position: center, center;
}

/*header*/
	@media (min-width: 950px){
		html{
			max-width: 100%;
			overflow-x: hidden;
		}

	.dropdown{display: none;}

	.navbar{
		display: flex;
		justify-content: center;
		width: 100%;
		top: 0.5em;
		bottom: 0.5em;
	}

	.navbar a {
		height: 60px;
		width: 11%;
		margin: 1px;
		background-color: rgba(0, 100, 0, 0.5);
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
		cursor: pointer;
		text-decoration: none;
		color: black;
		font-size: 18px;
		text-align: center;
	}

	.navbar a:hover{
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
		background-color: darkgreen;
	}

	.navbtn{
		line-height: 60px;
	}


/*body*/
	.title{
		width: 100%;
		text-align: center;
		font-size: 500%;
		margin-top: 0em;
		margin-bottom: 0em;
	}


	.slogan{
		width: 100%;
		text-align: center;
		font-size: 200%;
		margin-top: 0em;
		margin-bottom: 0em;
	}

	.center{
		display: inline-block;
		text-align: center;
		width: 100%;
		margin-bottom: -30px;
	}

	.section{
		display: inline-block;
		width: 100%;
	}

	.sectiontitle{
		display: inline-block;
		width: 100%;
		text-align: center;
		margin-top: 30px;
		font-size: 300%;
	}

	.part1{
		float: left;
		text-align: center;
		max-width: 35%;
		margin-top: 30px;
	}

	.description1{
		width: 100%;
		text-align: center;
		font-size: 150%;
		margin-top: 30px;
		margin-bottom: 0px;
	}

	.title1{
		width: 100%;
	}

	.title2{
		width: 100%;
		font-size: 250%;
		margin-bottom: 0px;
	}

	.part1 button, .part2 button, .title1 button{
		display: inline-block;
		width: 100%;
		height: 50px;
		background-color: rgba(0,100,0,0.5);
		font-size: 150%;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
		cursor: pointer;
		margin-right: -10px;
	}

	.part1 button:hover, .part2 button:hover, .title1:hover{
		background-color: darkgreen;
	}

	.part2{
		float: right;
		text-align: center;
		max-width: 35%;
		margin-right: 10px;
		margin-top: 30px;
	}

	.img{
		max-width: 100%;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
		margin-left: 0px;
		margin-right: 0px;
		margin-top: -5px;
	}

	.video{
		width: 100%;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
	}

	.img1{
		max-width: 100%;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
		margin-left: 0px;
		margin-right: 0px;
		margin-top: -35px;
		margin-bottom: 50px;
	}

	.contact{
		display: inline-block;
		text-align: center;
		width: 100%;
		font-size: 300%;
		margin-top: 25px;
		margin-bottom: 10px;
	}

	.contact button{
		background-color: rgba(0,100,0,0.5);
		font-size: 100%;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
		cursor: pointer;
	}

	.contact button:hover{
		background-color: darkgreen;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
	}
	
	.reviewsmap{
		width: 99.5%;
		height: 300px;
		margin-top: 25px;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
	}
	
	.about{
		width: 99%;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
		margin-top: 5px;
		text-align: center;
	}

	.aboutimg{
		width: 25%;
		border-width: 5px;
		border-style: ridge;
		border-color: darkgreen;
		margin-left: 10px;
	}

	.aboutbody{
		font-size: 125%;
	}

	.abouthead{
		font-size: 200%;
	}

	.founderbody{
		font-size: 125%;
		width: 100%;
	}

	hr { 
		border-color: darkgreen;
	}

	.footer{
		display: inline-block;
		text-align: center;
		width: 100%;
		margin-bottom: 5px;
	}
}