/* Main CSS File */
html, body{
	font-family: 'Ubuntu', sans-serif;
	padding: 0px;
	margin: 0px;
	font-size: 16px;
	position: relative;
}
.logo{
	margin: 1.5rem 0rem;
}
#sticky-nav{
	display: none;
	position: fixed;
	top: 0rem;
	width: 100%;
	box-sizing: border-box;
	background-color: #fff;
}
#sticky-nav .logo{
	height: 4rem;
}
nav ul{
    padding:0;
    margin:0;
    list-style: none;
	position: relative;
	text-align: right;
}
@media screen and (max-width: 650px){
	nav ul{
		text-align: center;
	}	
}
nav li{
	display: inline-block
}
nav li a, 
nav li a:visited {
	padding: 0.5rem 1rem;
	color: #00826e;
	text-decoration: none;
	display: block;
}
nav li a:hover{
	color: #005e50;
	border-radius: 0.25rem;
	border: #00826e 1px solid;
}
#welcome{
	min-height: 40vh;
	padding: 2rem;
}
.services-banner{
	background: url("images/slider.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding-top: 7rem;
	padding-bottom: 7rem;
}
.service-block{
	text-align: center;
	margin-top: 2rem;
	margin-bottom: 2rem;
	padding-top: 1rem;
}
.service-icon{
	display: flex;
	height: 8.5rem;
	align-items: center;
	justify-content: center;
}
.service-block h1 {
	font-size: 1.5rem;
}
.service-block a,
.service-block a:visited
.service-block a:active
{
	color: rgba(240, 240, 240, 0.7);
	text-decoration: none;
}
.service-block a svg{
	fill: rgba(240, 240, 240, 0.7);
}
.service-block a:hover {
	color: rgb(240, 240, 240);
}
.service-block a:hover svg{
	fill: rgb(240, 240, 240);
}

.service-section{
	border-top: #ccc solid 1px;
	background-image: url(images/lightBackground.png);
	background-repeat: no-repeat;
	background-position: top center;
	min-height: 100vh;
	padding: 2rem;
}
.service-section h2 {
	width: 100%;
}
.service-section svg {
	height: 4rem;
}

#contact-us{
	background-color: #ccc;
	padding: 5rem;
	text-align: center;
}
form{
	text-align: left;
	margin: 2rem auto;
	position: relative;
	box-sizing: border-box;
}
#contact-form{
	width: 60%;
}
@media screen and (max-width: 650px){
	#contact-form{
		width: 90%;
	}	
}
label{
	display: inline-block;
	margin: 1rem 0rem 0.5rem;
}
input{
	width: 100%;
	padding: 0.5rem;
	border-radius: 0.25rem;
	border: none;
	box-sizing: border-box;
}
input.invalid,
textarea.invalid{
	border: #ff0000 solid 1px;
}
.form-error{
	display: none;
	color: #ff0000;
}
.input-error{
	color: #ff0000;
	font-size: 0.8rem;
}
textarea{
	width: 100%;
	padding: 1rem;
	border: none;
	border-radius: 0.25rem;
	box-sizing: border-box;
}
button{
	padding: 0.5rem;
	border-radius: 0.25rem;
	border: none;
	background-color: #00826e;
	color: #fff;
	min-width: 5rem;
	margin: 1rem 0rem;
}
button:disabled{
	opacity: 0.5;
}
button:hover{
	background-color: #005e50;
}
.serviceBlocks:hover {
	opacity: 0.8;
	text-decoration: none;
}
.serviceBlocks h2{
	color: #ffffff;
	font-size: 1.5rem;
	text-align: center;
	position: relative;
	top: 185px;
}

#contact-us{
	background-color: #cedbda;
	border-top: #00826e solid 1px;
	border-bottom: #00826e solid 1px;
}
#top-btn{
	position: fixed;
	right: 2rem;
	bottom: 2rem;
	display: none;
}
#top-btn.active{
	display: block;
}
#top-btn a{
	color: #fff;
	background-color: #00826e;
	padding: 1rem;
	display: block;
	width: 1rem;
	height: 1rem;
	border-radius: 0.25rem;
}
footer{
	background-color: #E6E6E6;
}
footer p{
	padding: 2rem 1rem;
	text-align: center;
	color: #6b6b6b;
	margin: 0rem;
}
footer a,
footer a:visited{
	color: #6b6b6b;
	text-decoration: none;
}
footer h3 {
	color: #6b6b6b;
	font-size: 1rem;
}
footer ul{
	font-size: 0.8rem;
	padding-left: 0rem;
	margin-left: 0rem;
	list-style-type: none;
}
footer ul li{
	color: #323232;
}