*{
	margin: 0;
	padding: 0;
}

h1{
	font-size: 90px;
	margin: 0;
	padding-top: 50px;
	color: blue;
	font-family: 'Sacramento', cursive;
}

h2{
	font-size: 25px;
	color: blue;
	font-weight: normal;
	padding-bottom: 10px;
	font-family: 'Montserrat', sans-serif;
}

h3{
	padding-top: 50px;
	color: blue;
	font-family: 'Montserrat', sans-serif;
}

body{
	position: relative;
	font-family: 'Bree Serif', serif;
}

p{
	line-height: 2;
}

hr{
	border-style: none;
	border-top-style: dotted;
	border-color: grey;
	border-width: 5px;
	width: 5%;
	margin: 100px auto;
}

footer{
	text-align: center;
}
.mymenu .active{
	color: blue;
}

@media screen and (max-width: 1000px){
	h1{
		font-size: 75px;
	}
	h2{
		font-size: 15px;
	}
}

@media screen and (max-width: 750px){
	h1{
		font-size: 50px;
	}
	h2{
		font-size: 15px;
	}
}

@media screen and (max-width: 450px){
	.navbar li{
		width: 50%;
	}
}

/* Navigation Bar Section */

.headermenu .navbar{
	text-align: right;
	background-color: deepskyblue;
	padding-top: 10px;
	padding-left: 10px;
	position: fixed;
	width: 100%;
	z-index: 10000;
}


.navbar li{
	display: inline-block;
	list-style-type: none;
	text-align: center;
	padding: 15px 15px;
	color: #fff;
	font-size: 15px;
}

.navbar li:hover{
	background-color: #66CC00;
	border-radius: 5px;
}

.mymenu{
	margin-right: 5%;
}

.mymenu a{
	text-decoration: none;
	color: #fff;
}

.navbar img{
	float: left;
	padding-bottom: 10px;
	padding-left: 10px;
}

@media screen and (max-width: 750px){
	.navbar li{
		width: 25%;
	}
	.navbar img{
		padding-left: 50px;
	}
}

.mysearchbar{
	float: left;
	margin-top: 12px;
	margin-left: 30px;
	padding: 5px 15px;
	border: 1px solid #0076a3;
	border-right: 0;
	border-top-left-radius: 5px 5px;
	border-bottom-left-radius: 5px 5px;
}

.mysearchbutton{
	float: left;
	margin-top: 12px;
	padding: 5px 15px;
	outline: none;
	cursor: pointer;
	text-decoration: none;
	color: #fff;
	border: 1px solid #006400;
	border-right: 0;
	background-color: blue;
	border-top-right-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
}

.mysearchbutton:hover{
	text-decoration: none;
	background: #66CC00;
}

@media screen and (max-width: 750px) {
	.mysearchbar{
		display: none;
	}
	.mysearchbutton{
		display: none;
 }
}


/* Drop Down Menu */
.drop-content{
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.9);
}

.drop-content a{
	display: block;
	color: black;
	text-decoration: none;
	padding:12px 16px;
	text-align: left;
}

.drop-content a:hover{
	background-color: #f1f1f1;
}

.drop:hover .drop-content{
	display: block;
}

/* Menu Button */

.toggle-btn{
	display: none;
	padding: 10px 10px;
	position: absolute;
	z-index: 100000;
}

@media screen and (max-width: 750px) {

	.toggle-btn-visible {
	  display: block; 
	}

	.toggle-target-hidden { 
		display: none;
		 }

	.toggle-target-expanded {
	 display: block; 
	}

}

/* site Container */
.site-container{
	text-align: center;
}

.top-site{
	background-color: deepskyblue;
	padding-top: 60px;
}

.green-earth{
	height: auto;
	width: 100%;
	border: none;
	display: block;
}

/* middle site */
.first-middle-site{
	width: 50%;
	margin: auto;
}

@media (max-width: 600px) {
	.first-middle-site {
		width: 100%;
	}
}

.our-services{
	width: 50%;
	margin: 100px auto;
	text-align: left;eft;
}

.service-1-img{
	display: block;
	margin: auto;
}

.service-2-img{
	display: block;
	margin: auto;
}

@media screen and (max-width: 750px)
{
	.our-services{
		width: 75%;
	}
}

/* third middle site */
.third-middle-site{
	width: 50%;
	margin: auto;
}




/* CSS Button */
.myButton {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #8ac403), color-stop(1, #6bf700));
	background:-moz-linear-gradient(top, #8ac403 5%, #6bf700 100%);
	background:-webkit-linear-gradient(top, #8ac403 5%, #6bf700 100%);
	background:-o-linear-gradient(top, #8ac403 5%, #6bf700 100%);
	background:-ms-linear-gradient(top, #8ac403 5%, #6bf700 100%);
	background:linear-gradient(to bottom, #8ac403 5%, #6bf700 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8ac403', endColorstr='#6bf700',GradientType=0);
	background-color:#8ac403;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:20px;
	font-weight:bold;
	padding:16px 29px;
	text-decoration:none;
}

.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #6bf700), color-stop(1, #8ac403));
	background:-moz-linear-gradient(top, #6bf700 5%, #8ac403 100%);
	background:-webkit-linear-gradient(top, #6bf700 5%, #8ac403 100%);
	background:-o-linear-gradient(top, #6bf700 5%, #8ac403 100%);
	background:-ms-linear-gradient(top, #6bf700 5%, #8ac403 100%);
	background:linear-gradient(to bottom, #6bf700 5%, #8ac403 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#6bf700', endColorstr='#8ac403',GradientType=0);
	background-color:#6bf700;
}
.myButton:active {
	position:relative;
	top:1px;
}

/* Footer */
.bottom-site{
	background-color: deepskyblue;
	padding: 50px 0 40px;
	margin-top: 20px;
}

.bottom-site a{
	color: blue;
	margin: 5px 5px;
	text-decoration: none;
}

.bottom-site a:hover{
	color: #fff;
}

.copyright{
	color: #EAF6F6;
	font-size: 15px;
	padding: 25px 0;
}







/* Clear Floats */
.clear:before,
.clear:after {
  content: "";
  display: table;
}

.clear:after{
  clear: both;
}

.clear{
  zoom: 1;
}