@charset "utf-8";
/* CSS Document */

@viewport {
  width: device-width ;
  zoom: 1.0 ;
}

/* Main Section */

body {
	left: 0;
	margin: 0 auto;
	padding: 0;
}

.title {
	font-family: 'Raleway', san-serif;
	font-weight: 800;
	font-size: 24pt;
	padding-bottom: 1%;
	text-align: left;
	/*color: #08558B;*/
	color: white;
}


.subtitle {
	font-family: 'Raleway', san-serif;
	font-weight: 400;
	font-size: 12pt;
	padding-bottom: 40px;
	text-align: left;
	color: white;
}

.bodytext {
	font-family: 'Raleway', san-serif;
	font-weight: 500;
	font-size: 14pt;
	text-align: left;
	line-height: 17pt;
}

.section-title {
	padding: 50px 0 75px;
	font-weight: 800;
	font-family: 'Raleway', sans-serif;
	font-size: 32pt;
	color: #ccc;
	text-align: center;
	letter-spacing: 5px;
}

/* First Section */

.firstsec-bg {
	position: relative;
	height: 100vh;
	height: 100dvh;
	margin-left: auto;
	background-image: url("imagebg1.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}

.firstsec-container {
	position: relative;
	height: 100%;
}

.firstsec-elements {
	width: 900px;
	margin: 0;
  	position: absolute;
  	top: 45%;
  	left: 50%;
  	transform: translate(-50%, -55%);
}

.logo-img {
	width: 100%;
}

.spacer {
	height: 7em;
}

.quote {
	text-align: center;
}

.quote-words {
	display: inline-block;
	font-family: 'Raleway', sans-serif;
	font-weight: 300;
	font-size: 18pt;
	color: #333;
	background-color: white;
	padding: 15px;
	border-radius: 15px;
	margin: 5px;
	box-shadow: 3px 3px 5px #999;
	border: solid;
	border-width: 1px;
	border-color: #08558B;
}

.scrollicon {
	margin: 0;
	height: 20px;
  	position: absolute;
  	bottom: 4%;
  	left: 50%;
  	transform: translate(-50%, -50%);
}

.scrolltext {
	display: inline-block;
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14pt;
	color: #08558B;
	position: absolute;
  	bottom: 8%;
  	left: 50%;
  	transform: translate(-50%, -50%);
}


/* Second Section */

.secondsec-container {
	background-color: white;
	text-align: center;
	padding-bottom: 125px;
}

.secondsec-elements {
	display: inline-block;
	width: 1200px;
}

.photo {
	float: left;
	width: 35%;
	margin: 0 auto;
	margin-top: 15px;
	text-align: left;
}

.photo img {
	width: 80%;
}

.vert-spacerEXP {
	float: left;
	color: white;
	width: 7.5%;
}

.vert-spacer {
	float: left;
	color: white;
	width: 5%;
}

.profile-textbox {
	float: left;
	width: 57.0%;
	background-color: #F4FAFF;
	background: linear-gradient(to bottom, #08558B 0%, #08558B 17.5%, #F4FAFF 17.5%, #F4FAFF 100%);
	border-radius: 15px;
	box-shadow: 3px 3px 7px #ddd;
	border: solid;
	border-width: 1px;
	border-color: #08558B;
}

.profile-text {
	margin: 20px 30px 30px;
}

/* Third Section */

.thirdsec-container {
	background-color: #F7F7F7;
	text-align: center;
	padding-bottom: 125px;
}

.thirdsec-elements {
	display: inline-block;
	width: 1200px;
}

.my-services {
	float: left;
	width: 60%;
	text-align: left;
}

.other-services {
	float: left;
	width: 35%;
	text-align: right;
}

.thirdsec-title {
	background-color: #08558B;
	text-align: center;
	color: white;
	padding: 12px;
	box-shadow: 3px 3px 5px #888;
	border-radius: 10px;
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	font-size: 14pt;
	margin-bottom: 30px;
}

.thirdsec-bubbles {
	background-color: #F4FAFF;
	border: solid;
	border-width: 1px;
	border-color: #08558B;
	display: inline-block;
	margin: 5px;
	padding: 12px 17px;
	box-shadow: 3px 3px 7px #ddd;
	border-radius: 10px;
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12pt;
	
	/* Fade In/Out */
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.thirdsec-bubbles:hover {
	background-color: #08558B;
	color: white;
	
	/* Fade In/Out */
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.thirdsec-bubbles2 {
	background-color: #F4FAFF;
	border: solid;
	border-width: 1px;
	border-color: #08558B;
	display: inline-block;
	margin: 5px;
	padding: 12px 17px;
	box-shadow: 3px 3px 7px #ddd;
	border-radius: 10px;
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12pt;
	
	/* Fade In/Out */
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.thirdsec-bubbles2:hover {
	background-color: #08558B;
	color: white;
	
	/* Fade In/Out */
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

a {
	color: inherit;
	text-decoration: none;
}

/* Fourth Section */

.fourthsec-container {
	text-align: center;
	padding-bottom: 100px;
}

.fourthsec-elements {
	display: inline-block;
	width: 1200px;
}

.contact-text {
	float: left;
	width: 47.83%;
	margin: 1% 1%;
	background-color: #F4FAFF;
	background: linear-gradient(to bottom, #08558B 0%, #08558B 10%, #F4FAFF 10%, #F4FAFF 100%);
	border-radius: 15px;
	box-shadow: 3px 3px 7px #ddd;
	border: solid;
	border-width: 1px;
	border-color: #08558B;
}

.fourthsec-title {
	font-family: 'Raleway', san-serif;
	font-weight: 400;
	font-size: 16pt;
	padding: 3% 0 3%;
	text-align: centre;
	color: white;
}

.fourthsec-text {
	font-family: 'Raleway', san-serif;
	font-weight: 500;
	font-size: 12pt;
	text-align: left;
	margin: 25px;
	line-height: 15pt;
}

.contact-bubbles {
	float: left;
	width: 34.5%;
}

.contactbox {
	display: inline-block;
	width: 100%;
	color: black;
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12pt;
	letter-spacing: 1px;
	margin: 5px 0;
}

.contact-boximg {
	float: left;
	width: 12.5%;
	display: table;
}

.imagecontainer img {
	max-width: 25px;
	max-height: 25px;
}

.contact-boxtxt {
	float: left;
	width: 87.5%;
	text-align: left;
	
}

.contactemail {
	display: inline-block;
	width: 1160px;
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	color: black;
	padding: 10px;
	margin: 3% 0% 0; 
	background-color: #F4FAFF;
	border-radius: 15px;
	box-shadow: 3px 3px 7px #ddd;
	border: solid;
	border-width: 1px;
	border-color: #08558B;
}

.boldtext {
	font-weight: 600;
	margin: 0.25% 0 0;
}

/* Fifth Section */

.bottombar1 {
	padding: 20px 0;
	background-color: #08558B;
}
.bottombarX {
	font-family: 'Raleway', san-serif;
	font-size: 11pt;
	font-weight: 500;
	text-align: center;
	color: white;
	padding: 2px 0;
}

.bottombar2 {
	background-color: #023554;
	padding: 5px;
}

.bottombar2content {
	max-width: 62.5%;
	margin: 0 auto;
	overflow: hidden;
	color: #0F8AD6;
	font-family: 'Raleway', san-serif;
	font-size: 8pt;
	text-align: center;
}

.bottombar2content2 {
	display: none;
}


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

@media only screen and (max-width: 1250px){

	.firstsec-elements {
		width: 800px;
	}
	
	.quote-words {
		font-size: 15pt;
		padding: 15px;
	}
	
	.secondsec-elements {
		width: 900px;
	}
	
	.photo img {
		width: 90%;
	}
	
	.title {
		font-size: 22pt;
		padding-bottom: 1%;
	}

	.subtitle {
		font-size: 12pt;
		padding-bottom: 30px;
	}

	.bodytext {
		font-size: 12pt;
		line-height: 17pt;
	}
	
	.profile-textbox {
		background: linear-gradient(to bottom, #08558B 0%, #08558B 14%, #F4FAFF 14%, #F4FAFF 100%);
	}
	
	.thirdsec-elements {
		width: 900px;
	}
	
	.fourthsec-elements {
		display: inline-block;
		width: 900px;
	}
	
	.contact-text {
		background: linear-gradient(to bottom, #08558B 0%, #08558B 22%, #F4FAFF 22%, #F4FAFF 100%);
	}
	
	.contactemail {
		width: 860px;
	}
	
	.contact-text {
		width: 47.77%;
		background: linear-gradient(to bottom, #08558B 0%, #08558B 10%, #F4FAFF 10%, #F4FAFF 100%);
	}

}

@media only screen and (max-width: 980px){
	
	.firstsec-elements {
		width: 690px;
	}
	
	.quote-words {
		font-size: 14pt;
		padding: 15px;
	}
	
	.secondsec-elements {
		width: 690px;
	}
	
	.photo img {
		width: 90%;
	}
		
	.photo {
		width: 100%;
		text-align: center;
		margin-bottom: 50px;
	}

	.photo img {
		width: 55%;
	}

	.vert-spacerEXP {
		display: none;
	}
	
	.vert-spacer {
		width: 2%;
	}

	.profile-textbox {
		width: 100%;
		background: linear-gradient(to bottom, #08558B 0%, #08558B 19.5%, #F4FAFF 19.5%, #F4FAFF 100%);
	}
	
	.thirdsec-elements {
		width: 690px;
	}
	
	.other-services {
		width: 38%;
	}
	
	.fourthsec-elements {
		display: inline-block;
		width: 690px;
	}
	
	.contact-bubbles {
		float: left;
		width: 37.5%;
	}
	
	.contact-text {
		width: 100%;
		margin: 2% 0%;
	}
	
	.contactemail {
		width: 670px;
	}
}

@media only screen and (max-width: 736px){
	
	.firstsec-elements {
		width: 470px;
	}
	
	.quote-words {
		font-size: 11.5pt;
		padding: 12px;
	}
	
	.scrollicon {
		height: 15px;
	}
	
	.secondsec-elements {
		width: 470px;
	}
	
	.title {
		font-size: 18pt;
	}
	
	.subtitle {
		font-size: 11.5pt;
	}
	
	.bodytext {
		font-size: 11.5pt;
	}
	
	.profile-textbox {
		width: 100%;
		background: linear-gradient(to bottom, #08558B 0%, #08558B 13.5%, #F4FAFF 13.5%, #F4FAFF 100%);
	}
	
	.thirdsec-elements {
		width: 470px;
	}
	
	.vert-spacer {
		width: 100%;
		height: 40px;
	}
	
	.my-services {
		width: 100%;
	}
	
	.other-services {
		width: 100%;
		text-align: left;
	}
	
	.fourthsec-elements {
		display: inline-block;
		width: 470px;
	}
	
	.contact-bubbles {
		width: 100%;
	}
	
	.contactemail {
		width: 450px;
	}
	
}

@media only screen and (max-width: 480px){
	.firstsec-elements {
		width: 90dvw;
	}
	
	.quote-words {
		font-size: 10pt;
		padding: 10px;
	}
	
	.scrolltext {
		font-size: 9pt;
	}
	
	.secondsec-elements {
		width: 90dvw;
	}
	
	.photo img {
		width: 75%;
	}
	
	.profile-textbox {
		width: 100%;
		background: linear-gradient(to bottom, #08558B 0%, #08558B 14.5%, #F4FAFF 14.5%, #F4FAFF 100%);
	}
	
	.thirdsec-elements {
		width: 90dvw;
	}
	
	.fourthsec-elements {
		width: 90dvw;
	}
	
	.fourthsec-title {
		padding: 4% 0 1%;
	}
	
	.contact-text {
		background: linear-gradient(to bottom, #08558B 0%, #08558B 10%, #F4FAFF 10%, #F4FAFF 100%);
	}
	
	.bottombar2content {
		display: none;		
	}

	.bottombar2content2 {
		display: inline-block;
		width: 100%;
		margin: 0 auto;
		overflow: hidden;
		color: #0F8AD6;
		font-family: 'Raleway', san-serif;
		font-size: 7pt;
		text-align: center;
	}
	
	.subtitle {
		font-size: 11pt;
	}
	
	.contactemail {
		width: 85.25dvw
	}
	
}