/*==============================================
GENERAL CSS
================================================*/

html,
body {
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}
body {
  font: 16px/1.6, Constantia;
  font-family: Constantia;
  color: #fff;
  text-align:center;
  background: #222;
  overflow: hidden;
}
body::-webkit-scrollbar { width: 0 !important; }
body { overflow: -moz-scrollbars-none; }
img {
  border: 0;
  max-width: 100%;
}
html {
  -ms-overflow-style: scrollbar;
}
.alltrans,
.social-icons li a,
.owl-nav > button,
.owl-nav > button:after,
.counter-box,
.about-img:after,
.gallery-img img,
.form-control,
.owl-dot,
.subscribe-row,
.close-btn,
.close-btn:before,
.close-btn:after,
.tag-btn,
.btn {
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
a {
  color: #fff;
  text-decoration: none;
}
a:hover,
a:focus {
  color: #fff;
  outline: none;
  text-decoration: underline;
}
@media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) {
  a:active {
    background-color: transparent;
  }
}
p {
  margin: 0 0 20px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.2;
  margin: 0 0 20px;
  font-weight: 600;
  text-transform:uppercase;
}
h1,
h2 {
  font-size: 32px;
}
h3 {
  font-size: 30px;
  font-weight: 600;
}
h4 {
  font-size: 22px;
  font-weight: 600;
}
h5 {
  font-size: 20px;
  margin-bottom: 10px;
  font-weight: 600;
}
h6 {
  font-size: 18px;
  margin-bottom: 10px;
  font-weight: 600;
}
#main {
  padding: 0;
  background: #fff;
}
.no-margin {
  margin: 0 !important;
}
figure {
  margin:0;
}
.opacity-no {
  opacity: 1 !important;
}
nav .logo {
  float: left;
  position: relative;
  margin-left: 30px;
  width: 220px;
  padding-top: 10px;
}
nav {
  height: 0px;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 300;
}
nav .info {
	font-size: 16px;
	padding-top: 20px;
	margin-left: 30%;
	font-family: Verdana;
}
.info ul{
	list-style-type: none;
}
.info ul li{
	float: left;
	padding: 14px 25px;
}
canvas{position: fixed;top:0;left:0;height: 100vh;width: 100%;z-index: -1;}
.shadow{background: rgba(181, 222, 0, 0.2);height: 100vh !important;width: 100% !important;}
/* Menu */

	#page-wrapper {
		-moz-transition: -moz-filter 0.25s ease;
		-webkit-transition: -webkit-filter 0.25s ease;
		-ms-transition: -ms-filter 0.25s ease;
		transition: filter 0.25s ease;
	}

	#menu {
		-moz-align-items: center;
		-webkit-align-items: center;
		-ms-align-items: center;
		align-items: center;
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-justify-content: center;
		-webkit-justify-content: center;
		-ms-justify-content: center;
		justify-content: center;
		-moz-pointer-events: none;
		-webkit-pointer-events: none;
		-ms-pointer-events: none;
		pointer-events: none;
		-moz-transition: opacity 0.35s ease, visibility 0.35s;
		-webkit-transition: opacity 0.35s ease, visibility 0.35s;
		-ms-transition: opacity 0.35s ease, visibility 0.35s;
		transition: opacity 0.35s ease, visibility 0.35s;
		-moz-user-select: none;
		-webkit-user-select: none;
		-ms-user-select: none;
		user-select: none;
		-webkit-tap-highlight-color: transparent;
		background: rgba(46, 49, 65, 0.8);
		cursor: default;
		height: 100%;
		left: 0;
		opacity: 0;
		position: fixed;
		text-align: center;
		top: 0;
		visibility: hidden;
		width: 100%;
	}

		#menu .inner {
			padding: 2.5em 1.5em 0.5em 1.5em ;
			-moz-transform: translateY(0.5em);
			-webkit-transform: translateY(0.5em);
			-ms-transform: translateY(0.5em);
			transform: translateY(0.5em);
			-moz-transition: opacity 0.35s ease, -moz-transform 0.35s ease;
			-webkit-transition: opacity 0.35s ease, -webkit-transform 0.35s ease;
			-ms-transition: opacity 0.35s ease, -ms-transform 0.35s ease;
			transition: opacity 0.35s ease, transform 0.35s ease;
			-webkit-overflow-scrolling: touch;
			background: rgba(215, 70, 140, 0.95);
			border-radius: 10px;
            border: 10px solid skyblue;
			display: block;
			max-width: 100%;
			opacity: 0;
			position: relative;
			width: 18em;
		}

		#menu h2 {
			border-bottom: solid 2px rgba(255, 255, 255, 0.125);
			padding-bottom: 1em;
		}

		#menu .close {
			background-image: url("close.svg");
			background-position: 95% 25%;
			background-repeat: no-repeat;
			background-size: 1em 1em;
			border: 0;
			content: '';
			display: block;
			height: 1em;
			overflow: hidden;
			position: absolute;
			right: 0;
			text-align: center;
			text-indent: 4em;
			top: 0;
			width: 4em;
		}

		#menu .links {
			list-style: none;
			margin-bottom: 1.5em;
			padding: 0;
		}

			#menu .links li {
				padding: 0;
			}

				#menu .links li a {
					border-radius: 5px;
					border: 0;
					display: block;
					font-family: Constantia;
					font-size: 15.5px;
					font-weight: 500;
					letter-spacing: 0.1em;
					line-height: 1.85em;
					padding: 0.75em 0;
					text-transform: uppercase;
				}

					#menu .links li a:hover {
						background: #45558d;
					}

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

			#menu .inner {
				max-height: 100%;
				overflow-y: auto;
				overflow-x: hidden;
			}

				#menu .inner .close {
					background-size: 1.5em 1.5em;
				}

		}

	body.is-menu-visible #page-wrapper {
		-moz-filter: blur(1.5px);
		-webkit-filter: blur(1.5px);
		-ms-filter: blur(1.5px);
		filter: blur(1.5px);
	}

	body.is-menu-visible #menu {
		-moz-pointer-events: auto;
		-webkit-pointer-events: auto;
		-ms-pointer-events: auto;
		pointer-events: auto;
		opacity: 1;
		visibility: visible;
	}

		body.is-menu-visible #menu .inner {
			-moz-transform: translateY(0);
			-webkit-transform: translateY(0);
			-ms-transform: translateY(0);
			transform: translateY(0);
			opacity: 1;
		}
		

/* Wrapper */

	#wrapper > header {
		padding: 11em 0 2.25em 0 ;
	}

		#wrapper > header .inner {
			margin: 0 auto;
			width: 55em;
		}

		#wrapper > header h2 {
			border-bottom: solid 2px rgba(255, 255, 255, 0.125);
			font-size: 2em;
			margin-bottom: 0.8em;
			padding-bottom: 0.4em;
		}

		#wrapper > header p {
			font-family: Raleway, Helvetica, sans-serif;
			font-size: 1em;
			font-weight: 200;
			letter-spacing: 0.1em;
			line-height: 2;
			text-transform: uppercase;
		}

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

		#wrapper > header {
			padding: 9em 0 6.25em 0 ;
			background-color: #2e3141;
			background-image: linear-gradient(to top, rgba(46, 49, 65, 0.8), rgba(46, 49, 65, 0.8)), url("../../images/bg.jpg");
			background-size: auto, cover;
			background-position: center, 0% 30%;
			margin-bottom: -6.5em;
		}

	}

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

		#wrapper > header {
			padding: 11em 3em 7.375em 3em ;
			background-size: auto, cover;
			background-position: center, 0% 0%;
			margin-bottom: -4.75em;
		}

			#wrapper > header .inner {
				width: 100%;
			}

	}

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

		#wrapper > header {
			padding: 6.5em 2em 3em 2em ;
			background-size: auto, 125%;
			margin-bottom: -2.5em;
		}

			#wrapper > header h2 {
				font-size: 1.25em;
			}

			#wrapper > header p {
				font-size: 0.8em;
			}

	}

#pageModal{top: 0 !important;max-height: 100%;height: 100% !important;width: 100%;}
#pageModal .row{margin-bottom: 0;}
.close{border-width: 3px;font-size: 50px;width: 50px;color: #000000; margin-left: 95%;}
#pageModal .modal-content{ padding: 0px 0 !important;
    min-height: 100%;
    border: 0 !important;
    border-radius: 0;
    background-clip: border-box;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
    color: #000000;
    font-weight: 300;
	font-size: 14px;
	font-family: Verdana;}
 #pageModal .modal-body{margin-bottom: 100px;}
#pageModal img.img-responsive.img-rounded{width: 450px;height: 300px;border-radius: 10px;}
.img-responsive{width: 100% !important;}
#pageModal .modal-header{margin-left: 47%;}
#pageModal .modal-title{text-transform: uppercase;text-align: center;}
#pageModal #team-image{width: 100%;border-radius: 10px;}
@keyframes come-left {
  to { transform: translateX(0); }
}
.come-right {transform: translateX(-350px);animation: come-right 1s ease forwards;}
.come-right:nth-child(odd) {animation-duration: 1s; /* So they look staggered */}
@keyframes come-right {
  to { transform: translateX(0); }
}


/**** Start Main Body Section ****/

.service{margin-top: 10%;}
.menu {
  *zoom: 1;
}
.menu:before, .menu:after {
  content: "";
  display: table;
}
.menu:after {
  clear: both;
  overflow: hidden;
}

.menu, .drop-menu {
  margin: 0;
  padding: 0;
  list-style: none outside none;
}

.menu a {
  color: #fff;
  text-decoration: none;
  text-align: center;
	font-family: Verdana;
  font-size: 15px;
}

.menu a:hover {
	color: #fff;
}

.menu {
  width: 360px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: -o-fit-content;
  width: -ms-fit-content;
  width: fit-content;
  margin: 3% auto 0 45%;
}

.menu > li {
  background: rgba(0, 0, 0, 0.4);
  float: left;
  position: relative;
  -webkit-transform: skewX(-25deg);
  -moz-transform: skewX(-25deg);
  -o-transform: skewX(-25deg);
  -ms-transform: skewX(-25deg);
  transform: skewX(-25deg);
  -webkit-backface-visibility: hidden;
}

.menu a {
  display: block;
}

.menu li:hover {
  background: rgb(2, 214, 177,0.5);
}

.menu > li > a {
  padding: 1em 2em;
  -webkit-transform: skewX(25deg);
  -moz-transform: skewX(25deg);
  -o-transform: skewX(25deg);
  -ms-transform: skewX(25deg);
  transform: skewX(25deg);
  -webkit-backface-visibility: hidden;
}
	
/*News*/

.slider-wrap {
  height: 100%;
  width: 100%;
}
.slider-wrap .slider {
  position: absolute;
  width: 100%;
  left: 50px;
  top: 50px;
  margin-top: 35%;
}

.slider-item {
  width: 470px;
  height: 200px;
  padding: 35px 0 25px 65px;
  border-radius: 100px;
  background-color: #ffffff;
  display: flex;
  justify-content: flex-start;
  position: absolute;
  opacity: 0;
  z-index: 0;
  box-shadow: 0 4px 9px #f1f1f4;
  position: absolute;
  left: 0;
  top: 0;
}
.slider-item .animation-card_content {
  width: 100%;
  max-width: 374px;
  margin-left: 26px;
  font-family: Constantia;
}
.slider-item .animation-card_content .animation-card_content_description {
  color: #696d74;
  font-family: Constantia;
  font-size: 12px;
  font-weight: 300;
  letter-spacing: normal;
  line-height: 16px;
  margin: -15px 15px 0 -50px;
}
	
.msg-icon {
  position: relative;
  top: -20px;
  left: 7%;
  z-index: 300;
  display: inline-block;
  width: 80px;
  height: 80px;
  cursor: pointer;
  z-index: 7;
}
.msg-icon i {
  color: #ffff80;
  font-size: 40px;
}	

/*Contact Us*/

.popup-icon {
  position: relative;
  top: -20px;
  left: -10%;
  z-index: 300;
  display: inline-block;
  width: 80px;
  height: 80px;
  cursor: pointer;
}

.popup-icon i{font-size: 40px; color: #ffcccc;}

.popup-icon button {
  background-color: transparent;
  outline: none;
  border: 5px;
}

.modal-btn img {
  width: 60px;
  height: 60px;
}
.modal {
  background-color: rgba(46,121,129,1);
  display: none;
  overflow: auto;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: all 1.8s;
  overflow: scroll;
}
.modal::-webkit-scrollbar {
  display: none;
}
.modal-content {
  text-align: center;
  position: relative;
  top: 0;
  width: 100%;
  margin: 0 auto 0 auto;
  background-color: transparent;
}
.modal-animated-in {
  animation: totop-in .6s ease;
}
.modal-animated-out {
  animation: totop-out .6s ease forwards;
}
.modal-header {
  border-bottom: none;
}
.modal-header h3 {
  color: #fff;
  font-weight: 400;
  letter-spacing: 1px;
  font-size: 64px;
  margin-top: 50%;
  border-bottom: none;
  margin-bottom: 50px;
}
.modal-header em {
  font-style: normal;
  font-weight: 200;
}
.modal-content .close-btn {
  position: absolute;
  z-index: 99999999;
  color: #fff;
  right: 35px;
  top: 50px;
  width: 40px;
  height: 40px;
  border: 3px solid white;
  border-radius: 5px;
  text-align: center;
  cursor: pointer;
}
::-webkit-input-placeholder {
  color:#fff !important;
  opacity:1;
}
::-moz-placeholder {
  color:#fff !important;
  opacity:1;
}
:-ms-input-placeholder {
  color:#fff !important;
  opacity:1;
}
:-moz-placeholder {
  color:#fff !important;
  opacity:1;
}
.input-field {
  margin-bottom:15px;
}
.form-control {
  height: 50px;
  color:#fff;
  border: none;
  background:rgba(250,250,250,0.05);
  border: 1px solid rgba(250,250,250,0.5);
  border-radius: 10px;
  padding:4px 22px;
  font-family: Verdana;
  font-size:14px;
  margin-bottom: 30px;
}
.form-control:focus {
  box-shadow:none;
  outline:none;
  background:rgba(0,0,0,0.05);
  border: 1px solid rgba(250,250,250,1);
  color:#fff;
}
.index .form-control.form-control-dark {
  background: rgba(250,250,250, 0.75);
  color: #fff;
}
.index .form-control.form-control-dark:focus {
  background: rgba(54, 40, 158, 0.85);
  color: #fff;
}
.index .form-control.form-control-dark::-webkit-input-placeholder {
  color: #fff !important;
}
.index .form-control.form-control-dark::-moz-placeholder {
  color:#fff !important;
}
.index .form-control.form-control-dark:-ms-input-placeholder {
  color:#fff !important;
}
.index .form-control.form-control-dark:-moz-placeholder {
  color:#fff !important;
}
.form-control.form-control-dark:focus {
  background: rgba(0, 0, 0, 0.2);
}
.form-control.form-control-dark {
  background: rgba(0, 0, 0, 0.1);
  color: #222;
  border: none;
}
.form-control.form-control-dark::-webkit-input-placeholder {
  color:#222 !important;
  opacity:0.7;
}
.form-control.form-control-dark::-moz-placeholder {
  color:#222 !important;
  opacity:0.7;
}
.form-control.form-control-dark:-ms-input-placeholder {
  color:#222 !important;
  opacity:0.7;
}
.form-control.form-control-dark:-moz-placeholder {
  color:#222 !important;
  opacity:0.7;
}
textarea.form-control {
  height:123px;
  padding-top:15px;
}
.contact-section .btn {
  width:100%;
}
.contact-box {
  text-align:left;
}
.contact-box h4 {
  font-size:24px;
}
.contact-box h4:after {
  content:'';
  display:block;
  width:50px;
  height:2px;
  background:#fff;
  margin:12px 0;
}
.contact-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 30px;
  background: rgba(250,250,250,0.25);
  border-radius: 10px;
  padding: 25px;
  font-family: Verdana;
  font-size: 14px;
  font-weight: 300;
}
.contact-row i {
  width:55px;
  font-size: 30px;
  display:block;
}
.contact-row i.fa-envelope {
  font-size: 25px;
}

/* Keyframes */

@keyframes totop-in {
  0% {
    top: 600px;
    opacity: 0;
  }
  100% {
    top: 0%;
    opacity: 1;
  }  
}

@keyframes totop-out {
  0% {
    top: 0px;
    opacity: 1;
  }
  100% {
    top: -100%;
    opacity: 0;
  }  
}

/*Background Video Content*/

#video-container  {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1;
}


/*Preloader Content*/

.preloader {
  background: -moz-linear-gradient(top, #4096ee 0%, #39ced6 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #4096ee 0%,#39ced6 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #4096ee 0%,#39ced6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4096ee', endColorstr='#39ced6',GradientType=0 ); /* IE6-9 */
  height: 100%;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 9999;
  text-align: center;
}
.preloader-bounce {
  left: 0;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
}
.preloader-bounce > span {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  margin: 0.3em;
  display: inline-block;
  vertical-align: middle;
  -webkit-animation: bounce 1.8s infinite alternate;
  animation: bounce 1.8s infinite alternate;
  background: #fff;
}
.preloader-bounce > span:nth-child(2){
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
  background: #fff;
}
.preloader-bounce > span:nth-child(3){
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  background: #fff;
}

@-webkit-keyframes bounce {
  from {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  to {
    -webkit-transform: translateY(-1.2em);
    transform: translateY(-1.2em);
  }
}

@keyframes bounce {
  from {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  to {
    -webkit-transform: translateY(-1.2em);
    transform: translateY(-1.2em);
  }
}

#fullpage {
  z-index: 99;
}

/*==============================================
03. SOCIAL ICONS CSS
================================================*/

#social-icons {
  padding:0;
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  right:0;
  z-index: 275;
}
.social-icons {
  margin:0;
  padding:0;
  list-style:none;
}
.social-icons li {
  display: block;
  margin: 1px 0px;
}
.social-icons li a {
  width:50px;
  height:50px;
  display:inline-block;
  line-height:50px;
  text-align:center;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255,255,255,1);
  font-size:18px;
}
.social-icons li a:hover {
  color:#1e1e1e;
  background-color: #fff;
}

@media only screen and (max-width: 600px){
	body{overflow-y: auto;overflow-x: hidden !important;}
	nav .logo {width: 180px; padding-top: 15px;}
	nav .info { display: none !important;}
	.msg-icon {left: 7%;top: 40px;}
	.popup-icon {left: 10%;top: 40px;}
	.menu-item {margin-top: 25%;}
	.service{margin-top: 25%;}
	.menu{margin: 3% auto 0 5%;}
	.social-icons {margin: 0 auto 0 -10%;}
	.slider-wrap .slider {margin-top: 120%;margin-left: -5%;}
	.slider-item {width: 350px;}
	.shadow{background: none;height: 0;width: 0;}
}