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

@font-face {
    font-family: 'Avenir-bold';
	src: local('../fonts/AvenirLTStd-Black'), url('../fonts/AvenirLTStd-Black.woff') format('woff');
}

@font-face {
    font-family: 'Avenir-book';
	src: local('../fonts/AvenirLTStd-Book'), url('../fonts/AvenirLTStd-Book.woff') format('woff');
}

body{
	margin:0px;	
}

h1, h3{
	font-family: 'Avenir-bold';
}

p, a{
	font-family: 'Avenir-book';	
	line-height:24px;
}

a{
	text-decoration:none;	
}

.header{
    border-bottom: 1px solid #e9e9e9;	
}

.container{
	width:80%;
	margin:0 auto;	
}

.header-left{
	width:30%;
	display:inline-block;	
	margin-top: 1%;	
}

.header-left img{
	width:80%;	
}

.header-right{
	width:69%;
	display:inline-block;	
	vertical-align:top;
}

.nav{
	text-align:right;	
}

.nav li{
	display:inline-block;
	list-style:none;
	margin:2%;	
}

.nav li a{
	text-decoration:none;
	font-weight:600;	
	color:grey;
}

.nav li a:hover{
	color:black;
}

.mobile-nav{
	display:none !important;	
}

.slides img{
	position:relative;
}

.flex-caption{
    position: absolute;
    top: 100px;
    padding-left: 1.5%;
    color: white;	
	width: 460px;
}

.flex-caption p{
	margin-bottom:8%;	
}

.read{
	text-decoration: none;
    color: white;
    background-color: #0083fd;
    padding: 3% 6%;	
}

.read:hover{
	background:#0074e1;
}

.flex-direction-nav a{
	line-height:40px;	
}

.about{
	margin:6% 0% 10%;	
}

.about-left{
	width:50%;
	display:inline-block;	
	margin-right:5%;
	vertical-align:top;
}

.about-left p{
	width:86%;	
	margin-bottom:5%;
}

.about-left a{
	text-decoration:none;	
	font-weight: 800;
    color: black;
}

.arrow{
	width:5%;
	margin: 2%;
    vertical-align: middle;	
}

.about-right{
	width:40%;
	display:inline-block;	
}

.about-right img{
	width:100%;	
}

.feature{
	background-image:url('../images/fea-banner.jpg');
	background-size: cover;	
	text-align:center;	
}

.feature-field{
	padding:4% 0% 8%;
	color:white;	
}

.feature-box{
	display:inline-block;
	width:26%;
	vertical-align: top;
    height: 220px;
	margin:1%;	
	padding:5% 2%;
	background:rgba(255, 255, 255, 0.16);
}

.feature-box:hover{
	background:rgba(255, 255, 255, 0.06);	
	transition:0.6s;
	cursor:pointer;
}

.feature-box img{
	width:36%;	
}

.service{
	margin:6% 0%;	
}

.service-left{
	width:50%;
	display:inline-block;	
	margin-right:8%;
	vertical-align:top;
}

.service-left a{
	text-decoration:none;
	font-weight: 800;
    color: black;	
}

.service-right{
	width:40%;
	display:inline-block;	
}

.msc-box{
	box-shadow: 0px 5px 10px 3px #d4d4d4;
    float: right;
    width: 85%;
}

.msc-box img{
	width:100%;	
}

.contact{
	background-image:url('../images/con-banner.jpg');
	background-size: cover;	
	text-align:center;	
	color:white;
	padding:3% 0% 5%;
}

#name, #email, #contact, #subject{
	width:42%;
	margin:1.5%;
	padding:1.5% 1%;
	background:rgba(81, 81, 81, 0.73);
	border:none;
	color:white;
}

#captcha{
	width:50%;
	margin:1.5%;
	padding:3.5% 3%;
	background:rgba(81, 81, 81, 0.73);
	border:none;
	color:white;
}

#div-captcha{
	float:left;
	width:47%;
	text-align:left;
	padding:1.5% 1%;
}

#siimage{
	float:right;
}

#message{
	width:89%;
	background:rgba(81, 81, 81, 0.73);
	padding:1.5% 1%;	
	margin-left:3px;
	margin-top:1.5%;
	border:none;
	color:white;
	font-family:'Avenir-book';
}

#submit{
    color: white;
    background-color: #0083fd;
    padding: 1.5% 4%;	
	border:none;
	cursor:pointer;
	-webkit-appearance: none;
}

#submit:hover{
	background:#0074e1;
}

.footer{
	background:#3f3f3f;
	text-align:center;
	color:white;	
	padding:2% 0%;
}

.footer a{
	text-decoration:none;
	color:white;	
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: white;
  font-family:'Avenir-book';
}
::-moz-placeholder { /* Firefox 19+ */
  color: white;
  font-family:'Avenir-book';
}
:-ms-input-placeholder { /* IE 10+ */
  color: white;
  font-family:'Avenir-book';
}
:-moz-placeholder { /* Firefox 18- */
  color: white;
  font-family:'Avenir-book';
}

.social-box img{
    margin: 1% 1% 2.5%;
    width: 4%;	
}

.link-box a{
	margin:1%;	
}

.link-box a:hover{
	color:grey;
	transition:0.4s;
}

.copyright-box p{
	color:#afafaf;	
}

.show-menu {
	font-family: 'Avenir-bold';
	text-decoration: none;
	color: #fff;
	background: #F0F0F0;
	text-align: center;
    padding: 0;
	display: none;
	cursor:pointer;
}

/*Hide checkbox*/
input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #nav{
    display: block;
}

.criteria{
    margin: 3% 0% 5%;	
}

.criteria-right{
	width:54%;
	display:inline-block;	
}

.criteria-left{
	width:42%;
	vertical-align: top;
	display:inline-block;	
	margin-left: 3%;
}

.criteria-box{
    box-shadow: 0px 5px 10px 3px #d4d4d4;
    width: 90%;	
    padding: 5% 10%;
}

.cri-box{
	padding:4%;
	background:whitesmoke;	
}

.procedure{
    background: #191919;
    padding: 3% 0% 1%;	
	color:white;
	text-align:center;
}

.procedure-field{
    margin-bottom: 5%;	
}

.procedure-box{
    width: 19%;
    background: #414141;
    display: inline-block;
    margin: 1% 1% 1% 0%;
    padding: 0% 2%;
    height: 80px;
    vertical-align: top;
    color: white;
    text-align: left;
}

.faq-field{
	padding: 4% 0% 10%;	
}

.faq-field h1{
	text-align:center;	
	margin-bottom:5%;
}

.toggle {
	padding:0; 
	list-style:none; 
	width: 94%;
	margin: 0 auto;
}

.toggle li {
    position: relative;
    background:#f6f6f6;
    cursor: pointer;
    margin-top: 1.5%;
    padding: 1% 2%;
    -webkit-animation: slide 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: slide 1s; /* Firefox < 16 */
        -ms-animation: slide 1s; /* Internet Explorer */
         -o-animation: slide 1s; /* Opera < 12.1 */
            animation: slide 1s;
}

.toggle h3 {
	margin:0;
	padding: 18px; 
	color: #3e3e3e; 
	font-size: 18px;
}

.toggle span {
    position: absolute;
    top: 21px;
    right: 21px;
    width: 43px;
    height: 100%;
    color: #3e3e3e;
    font-size: 30px;
    font-weight: 600;
    text-align: center;
}

.panel {
	display:none; 
    position: relative;
    padding: 10px 43px 10px 10px;
    background: rgba(255, 255, 255, 0);
}

.toggle .panel p {
    margin: 0px 8px 10px;
}

.contact-left{
    display: inline-block;
    width: 40%;
    padding: 3% 5%;
	vertical-align:top;	
}

.contact-right{
    display: inline-block;
    width: 49.5%;
	vertical-align:top;	
	height: 450px;
}

.contact-info{
	margin: 4% 0%;	
}

.contact-info img{
    display: inline-block;
	vertical-align:top;	
	width:5%;
}

.contact-info p{
    display: inline-block;
	vertical-align:top;	
	margin:0%;
	margin-left:3%;
}

.content-box {
	display: none;
	padding: 2%;
	border-radius: 8px;
	background:white;
	height: 300px;
}

.active {
    display: inline-block;
    width: 69%;
    margin: 4%;
    vertical-align: middle;
}

.content-prev, .content-next{
    border: none;
    color: black;
    cursor: pointer;
    width: 40px;
    height: 40px;
    font-size: 29px;
    margin: 0;
    background: none;
}

button:focus {
	outline:0;
}

.content-box-left{
    width: 49.5%;
    margin-right: 6%;
	display: inline-block;
}

.content-box-right{
    width: 43.5%;
    display: inline-block;
	vertical-align:top;	
	text-align:left;
}

.content-box-left img{
    width: 100%;
}

.container-slider{
    text-align: center;
    width: 100%;	
}

.service-link a{
    text-decoration: none;
    font-weight: 800;
    color: black;	
}

.services-span{
    color: white;
    background: #00377a;
    display: inline-block;
    padding: 1% 4%;
    margin: 0;
    font-size: 13px;
}

.misson{
    color: white;
    padding: 12%;	
}

.dropbtn {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li.dropdown {
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}

.service-box img{
	width:100%;	
}

.service-inside{
    margin: 5% 0% 10%;	
}



@media all and (max-width: 768px) {
	#head-contain{
		width:100% !important;
	}
	
	.header-left img {
		width: 60%;
	}
	
	.show-menu {
		display:block;
	}
	
	.show-menu img{
	    width: 14%;
		margin-top: 1%;	
	}
	
	.show-menu p{
		display: inline-block;
		vertical-align: top;
		margin-top: 4%;
		font-weight: 600;
		color: black;	
	}
	
	 .nav {
		position: static;
		display: none;
		padding: 0;	
		text-align: center;
 	}
	
	.nav li{
		width:100%;	
	}
	
	.mobile-nav{
		display:block !important;	
	}
	
	.dropdown{
		display:none !important;	
	}
	
	.flexslider {
		margin: 0 0 18px !important;
	}
	
	.flex-caption {
		position: initial;
		padding-left: 0;
		color: white;
		width: auto;
		padding: 1% 8% 12%;
		background: #383838;
	}
	
	.flex-caption p{
	    font-size: 14px;	
	}
	
	.flex-caption h1{
		font-size: 30px;	
	}
	
	.header-right{
		width:100%;	
	}
	
	.header-left{
		width:100%;	
		text-align: center;
	}
	
	.about-left{
		width:100%;
		margin-bottom:12%;
	}
	
	.about-right{
		width:100%;	
	}
	
	.about-left p {
		width: 100%;
	}
	
	.misson {
		padding: 1%;
	}
	
	.service-left{
		width:100%;
		margin-bottom:12%;
	}
	
	.service-right{
		width:100%;	
	}
	
	.criteria-right {
		width: 100%;
	}
	
	.criteria-left {
		width: 90%;
		margin: 0;
	}
	
	.procedure-box {
		width: 90%;
		padding: 0% 4%;
		height: 80px;
	}
	
	.feature-box{
		width:90%;	
		padding: 10% 4% 2%;
		margin-bottom: 6%;
		height: 240px;
	}
	
	.msc-box{
		width:100%;	
	}
	
	#name, #email, #contact, #subject, #message{
		width:90%;	
		padding:4%;
	}
	
	#captcha{
		width:96%;	
		padding:4%;
		margin-left:-2%;
	}
	
	#div-captcha{
		width:90%;	
		padding:4%;
	}
	
	#siimage{
		float:left;
	}
	
	#submit{
	  width: 96%;
		margin-top: -5%;
		margin-bottom:5%;	
		padding: 4% 4%;
	}
	
	.social-box img {
		margin: 6% 3% 4%;
		width: 14%;
	}
	
	.link-box a{
		margin: 28%;	
	}
	
	.content-box {
		height: 100%;
		padding: 0%;
		width:60%;
		background:none;
	}
	
	.active {
		margin: 0;
	}
	
	.content-box-left {
		width: 100%;
		margin-right: 0%;
	}
	
	.content-box-right {
		width: 100%;
	}
	
	.services-span {
		display: none;
	}
	
	.content-prev, .content-next {
		width:10% !important;
		height:10% !important;
	}
}

@media all and (max-width: 380px) {
	.link-box a{
		margin: 20%;	
	}
}
