/* Document Settings _______________________________________________________________*/

@import url('https://fonts.googleapis.com/css?family=Crimson+Text|Work+Sans&display=swap');


body {
	font-family: 'Work Sans', sans-serif;
	font-weight: normal;
	font-size: 17px;
	padding: 0;
	margin: 0;
	line-height: 170%;
	background-color: #FFF;
	color: #333;
	none-webkit-animation-delay: 0s;
	animation-delay: 0s;
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	
}

.container { width:80%; margin-left:auto; margin-right:auto; position:relative}

.wow{ visibility:hidden; -webkit-animation-duration: 1s;-moz-animation-duration: 1s;animation-duration: 1s;-webkit-animation-delay: 1s;-moz-animation-delay: 0.1s;animation-delay: 0.1s;}
html,body { height: 100%; margin: 0px; padding: 0px; }

h1 {
	font-size: 260%;
	line-height: 100%;
	font-family: 'Crimson Text', serif;
	font-weight: normal;text-align:center;
	padding-top: 8px; color:#737375;
	 margin-top:0px !important
}

h2 {
	font-size: 180%;
	line-height: 95%;
	font-family: 'Crimson Text', serif;
	color: #2C6DB0; 
}

h3 {
	font-size: 22px;
	font-family: 'Work Sans', sans-serif;
	margin-top: 5px;
	color: #2C6DB0; font-weight:normal;
}
img{ border:none}

  
p {
	margin-top: 0.5em;
	color: #000000;
}

.highlight-text{ font-size:160%}



#body{
	width: 100%;
	position: relative;
	float: left;
	padding-top: 20px;
	padding-bottom: 50px;
}
#body ul{ padding:0px; margin:0px;}
#body ul li{ list-style:none; padding-left:40px; background-image:url(../images/tick.svg); background-repeat:no-repeat; background-position:0px 0px; line-height:170%; margin-bottom:5px}

#body ul li{-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;}
#body ul li:hover{ text-indent:5px; cursor:pointer}

#body a{
	color: #333;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	text-transform: none;
	text-decoration: none
	
}
#body a:hover{
	color: #A5893C;
	
}


.logo{
	width: 100%; position:relative;
	float: left;
	padding-top: 20px;
	padding-bottom: 20px; text-align:center
}

.logo img{ display:inline-block; max-width:90%; height:auto}

div{-webkit-transition: all 0.7s ease;
-moz-transition: all 0.7s ease;
transition: all 0.7s ease;
-ms-transition: all 0.7s ease;}

.col{ position:relative; width:50%; float:left;}

.col .inner{ padding-right:50px;}

.effect{
	none-webkit-animation-delay: 1s;
	animation-delay: 1s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;

}

.bottomtext{width: 100%;	position: relative;	float: left;}

#footer{
	width: 100%;
	position: relative;
	float: left;
	background-color: #2C6DB0;
	none-webkit-animation-delay: 1s;
	animation-delay: 1s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
	color:#fff; padding-top:50px; padding-bottom:50px;
}
#footer strong{ text-transform:uppercase; letter-spacing:2px; color:#FFC32C}	
	
.footer1, .footer2{ width:50%; float:left; position:relative}

#footer a, #footer p{ color:#fff}


.tel{ display:inline-block; margin-left:20px; margin-right:20px;}
.address{ display:inline-block;  margin-left:20px; margin-right:20px;}
.email{ display:inline-block;  margin-left:20px; margin-right:20px;}
.designer{display:inline-block;  margin-left:20px; margin-right:20px;}

.footsocial{width:100%; float:left; margin-bottom:30px;}
.social1, .social2, .social3{ display:inline-block; margin-left:10px; margin-right:10px;}

a{
	color: #333
}


@media all and (min-width: 50px) and (max-width: 620px) {
	#body{width:100% !important;}
	h1{ font-size:160%}
	h2{ font-size:130%}
	h3{ font-size:18px;}
	
	.main-title{ width:100% !important; padding:0px !important; text-align:center !important; font-size:140% !important}
	.logo{ width:100% !important; text-align:center !important}
	.logo img{ width:280px !important; height:auto !important }
	.highlight-text{ font-size:130%}
	.footer-bottom{ line-height:40px;}
.vbody{ line-height:160%}

	.col{ width:100%;}
	.col .inner{ padding:0px !important}
	
}
@media all and (min-width: 620px) and (max-width: 1000px) {
	#body{width:100% !important;}
	h1{ font-size:250%}
	h2{ font-size:170%}
	h3{ font-size:20px;}
	.main-title{ padding:0px !important; text-align:center !important; }
	.logo img{ width:340px !important; height:auto !important }
	.footer-bottom{ line-height:55px;}
	
	.col{ width:100%;}
	.col .inner{ padding:0px !important}
	}
}
