
* {
font-family: "Lato", sans-serif;
box-sizing:border-box;

}


h2 {
font-family: "Lato", sans-serif;
color:#007C88;
font-size:25px;
width:100%;
float:left;
margin-top:0px;
margin-bottom:30px;
}

body, html {
  color: #333;
  line-height: 1.8;
  margin:0px auto;
}

.navi {
height:140px;
padding:25px;
padding-bottom:0px;
background-image:url('navibg.png');
background-position:bottom left;
background-size:cover;
position:fixed;
font-size:18px;
position:absolute;
z-index:100;
}

.navi a {
margin-right:30px;
}

.navi i {
margin-right:10px;
}

.centered {
text-align:center;
}

.fleft {
float:left;
}

.w80 {
padding-left:20%;
padding-right:20%;
float:left;
}

.w100 {
width:100%;
float:left;
}

.mtb30 {
margin-top:30px;
margin-bottom:30px;
}

a {
color:#007C88;
text-decoration:none;
}


p {
text-align:left;
font-size:20px;
width:100%;
display:block;
float:left;
}

p img {
				-webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0); 
				box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0);
				width:350px; height:auto;margin-bottom:30px; 
}


.imgleft {
float:left; 
margin-right:50px; 
cursor:pointer;
}

.imgright {
float:right;
margin-left:50px; 
cursor:pointer;
}






.dark {
background-color:#007C88 !important;
color:#fff;
float:left;
}



.contact {
top:40vh;
margin-top:-250px;
width:530px;
min-height:500px;
position:fixed;
right:-5px;
background-color:#fff;
z-index:2000000;
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
font-size:18px;
transition: transform 0.5s ease-in-out;
overflow-x:hidden;
overflow-y:auto;
padding-bottom:30px;
transform: translateX(100%);
}

	.contop {
	background-color:#007C88;
	color:#fff;
	padding:20px;
	}
	
	.conbottom {
	padding:20px;
	}

.overlay {
width:100vw;
height:100vh;
position:fixed;
top:0px;
left:0px;
background-color:rgba(0,0,0,0.8);
z-index:1000000;
display:none;
}

.imgcontainer {
width:90vw;
height:90vh;
position:fixed;
top:5vh;
left:5vw;
display:none;
background-position:center;
background-size:contain;
background-repeat:no-repeat;
z-index:2000000;
}

.formheading {
	width:100%;
	float:left;
	margin-top:10px;
	margin-bottom:5px;
}

input, select, textarea {
padding:5px;
font-size:17px;
width:45%;
margin-right:5px;
margin-bottom:5px;
}

textarea {
width:93%;
}

form {
margin-top:-30px;
}

.sendit {
	background-color:#007C88;
	color:#fff;
	border:0px;
	cursor:pointer;
	margin-top:15px;
}






.borderbottom {
border-bottom:1px solid #ddd;
width:60%;
height:10px;
float:left;
margin-left:20%;
margin-bottom:30px;
}




.mobilenavicon {
top:15px;
right:15px;
position:fixed;
background-color:#fff;
padding:5px;
padding-top:3px;
color:#007C88;
font-size:25px;
width:50px;
height:50px;
text-align:center;
border-radius:30px;

display:none;
}

.mobilenavi {
padding:30px;
position:fixed;
top:0px;
height:100vh;
width:80vw;
background-color:#fff;
left:0px;
font-size:25px;
				-webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0); 
				box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0);

transform: translateX(-110%);
transition: transform 0.5s ease-in-out;

display:none;
}

.mobilenavi a {
width:100%;
float:left;
margin-bottom:10px;
border-bottom:1px solid #ddd;
padding-bottom:10px;
font-size: 22px;
}

.mobilenavi a i {
margin-right:15px;
}


@media (orientation: portrait) {

		.navi {height:140px;}
		.pic1 {margin-top:25px !important; margin-bottom: 0px !important;}
		.navi {
		display:none;
		}

		.imgleft, .imgright {
		width:100%;
		margin-left:0px;
		margin-right:0px;
		}
		
		h2 {
		margin-bottom:10px;
		margin-top:20px;
		transform: scale(0.9);
		margin-left:3%;
		}
		
		.contact {
		width:100vw;
		height:100vh;
		top:0vh;
		margin-top:0px;
		}
		
		.mobilenavicon, .mobilenavi {
		display:block;
		}
		
		.w80 {
		padding-left:10%;
		padding-right:10%;
		}
		
		.borderbottom {
		margin-top:30px;
		width:90%;
margin-left:5%;
		}

}


.subtitle {
font-size:16px;
display:block;
position:relative;
margin-top:-10px;
color:#666;

}

.icon-A {
font-size: 61px;
    position: absolute;
    margin-top: 6px;
    margin-left: -80px;
}

.quote {
border-left:5px solid #24A28B;
display:block;
text-align:left;
float:left;
padding-left:20px;
margin-top:20px;
width:100%;
margin-bottom:30px;
}

.quoteperson {
display:block;
font-weight:bold;
}


p strong {
	color:#24A28B;
}
