@import url("generic.css");
@import url("top-menu.css");


/*===== GENERIC =*/
::selection {/* WebKit/Blink Browsers */
	background: #8BC243; 
	color:#fff;
}
::-moz-selection {/* Gecko Browsers */
	background: #8BC243; 
	color:#fff;
}

body {
	font-family: "Montserrat", sans-serif;
	font-size:17px;
	line-height:25px;
	font-weight:400;
	color:#888888;
}
a, a:focus,
a:not([href]):not([tabindex]),
a:not([href]):not([tabindex]):hover {color:#8BC243;}
a:hover {color:#3E4346;}

a.moreInfo {color:#8BC243;}
a.moreInfo span {
	left: 0;
	width: 100%;
	border-bottom-color:#8BC243;
}
a.moreInfo:hover span {
	width: 0;
	left:50%;
}

p {
	padding:0;
	margin:0 0 3vh 0;
}

/***** BreadCrumbs */
.BreadCrumbs {
	font-weight:700;
	font-size:13px;
	line-height:16px;
	color:#fff;
	text-transform:uppercase;
	letter-spacing:1px;
	text-align:left;
}
.BreadCrumbs a {
	 margin-right:6px;
	 color:#000;
}
.BreadCrumbs a:after {
	content:'\0276F';
	margin-left:10px;
	font-size:11px;
	position:relative;
	top:-1px;
}

.btn {
	font-size:14px;
	line-height:16px;
	font-weight:600;
	letter-spacing:0.02em;
	padding:12px 20px;
		-webkit-border-radius:4px;
	border-radius:4px;
	text-transform:uppercase;
}
.btn:hover, .btn:focus, .btn.focus, .btn:active:focus {
    box-shadow: none !important;
}
.Theme.btn {
	background:#8BC243;
	color:#fff;
}
.Theme.btn:hover, 
.Theme.btn:focus, 
.Theme.btn.focus {
	background:#3E4346;
	color:#fff;
}

.Theme.btn.Dark {background:#3E4346;}
.Theme.btn.Dark:hover, 
.Theme.btn.Dark:focus, 
.Theme.btn.Dark.focus {background:#8BC243;}

.Theme.btn.AnchorBtn a {
	color:#fff;
	padding:12px 20px;
}

@media All and (max-width:760px) {
	.btn {
		font-size:11px;
		font-weight:700;
		padding:10px 12px;
	}
	.Theme.btn.AnchorBtn a {
		padding:10px 12px;
	}
}

.Theme.btn.Disabled {
    background: #8BC243 !important;
    opacity: 0.5;
}
.Theme.btn.AnchorBtn.Disabled a {
    cursor: not-allowed;
}


/***** Loader */
#preloader { background-color: #fff;}
#status {
    width:80px;
    height:80px;
    margin: -40px 0 0 -40px;
}


.topBtn a {
    	-webkit-border-radius: 6px;
	border-radius: 6px;
}
.topBtn a::before {background: #8BC243;}


.MyCarousel .carousel-indicators {
	margin:0;
	bottom:-40px;
}
.MyCarousel .carousel-indicators li {
	background-color:#333;
}


/****************************************
	Layout
****************************************/
	.MainWrapper {
		max-width:1320px;
		display:block;
		margin:0px auto;
		position:relative;
	}


	/**===== TOP HEADER ==**/
	#TopHead {
		width:100%;
		position:relative;
		z-index:1001;
	}
	#TopHeadHeightFixed { display:none;}


	#TopHead .BotmRow {
		background:#fff;
		border-bottom:1px solid #D6D6D6;
	}

	#TopHead .BotmRow .Logo {
		float:left;
		margin:25px 0;
	}
	#TopHead .BotmRow .Logo img { height:30px;}
	
	#TopBtn {
		float:right;
		margin-top:20px;
	}
	
@media All and (min-width:991px) {
	#TopHead.th_active { }
	#TopHead.th_active .Logo img { }
	
	#TopHead.th_active .BotmRow .Logo {
		margin: 15px 0;
	}
	#TopHead.th_active #TopBtn {
		float: right;
		margin-top: 10px;
	}
	#TopHead.th_active #TopNav {
		margin-top: 10px;
		margin-bottom: 10px;
	}
	#TopHead.th_active #TopNav ul.navbar-nav>li.dropdown .dropdown-menu,
	#TopHead.th_active #TopNav ul.navbar-nav>li.dropdown-submenu .dropdown-menu {
		margin-top: 11px;
	}
}


	/*===== HEADING STYLE ==*/
	.TitleStyle {
		position:relative;
		margin-bottom:3vh;
	}

	.TitleStyle .Top {
		font-size:40px;
		line-height:46px;
		font-weight:700;
		color:#3E4346;
		position:relative;
		margin-bottom:10px;
	}
	
	.TitleStyle p { margin:0;}
	
	.Heading2 {
		font-size:30px;
		line-height:38px;
		font-weight:600;
		color:#3E4346;
		margin-bottom:15px;
	}
	.Heading2 > img { height:40px;}
	
	.Heading3 {
		font-size:20px;
		line-height:26px;
		font-weight:600;
		color:#3E4346;
	}
	
	.Heading4 {
		font-size:18px;
		line-height:24px;
		font-weight:600;
		color:#3E4346;
	}


	/**===== BODY CONTENTS ==**/
	.WhiteWrapper, .LightWrapper {
		position:relative;
		padding:6vh 0;
	}
	.WhiteWrapper { background:#fff;}
	.LightWrapper { background:#F3F8ED;}



	/*===== DESIGN LAYOUT ==*/
	#VideoWrapper {
		overflow:hidden;
		position:relative;
		top:0;
		left:0;
		width:100%;
		height:calc(100vh - 80px);
	}
	#VideoWrapper > div {
		background:rgba(0,0,0,.6);
		width:100%;
		height:100%;
	}
	#VideoWrapper video {
		display: block;
		position:relative;
		top: 0;
		left: 0;
		width: 100vw;
		height:100vh;
		z-index: -1;
		object-fit: cover;
	}
	
	#VideoWrapper .Caption {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		text-align: center;
	}
	
	#VideoWrapper .Title {
		font-size:60px;
		line-height:70px;
		color:#fff;
		font-weight:300;
	}
	#VideoWrapper .Desc {
		font-size:25px;
		line-height:35px;
		font-weight:500;
		color:#fff;
		max-width:900px;
		margin:30px auto 0;
	}
	

	.BoxFlex,
	.BoxInline,
	.BoxSimple {
		border:1px solid #D6D6D6;
		border-radius:10px;
		padding:30px;
		margin-bottom:20px;
		position:relative;
			-webkit-transition: 0.4s ease;
		transition: 0.4s ease;
		overflow:hidden;
	}
	.BoxFlex:hover { border:transparent;}
	.BoxSimple:hover { background:#F3F8ED;}
	
	.BoxFlex::before {
		content: "";
		position: absolute;
		inset: 0;
		background-repeat:no-repeat;
		background-position:center center;
			-webkit-background-size:cover;
		background-size:cover;
		opacity: 0;
			-webkit-transition: opacity 0.5s ease, transform 0.5s ease;
		transition: opacity 0.5s ease, transform 0.5s ease;
		z-index: 0;
	}
	
	.BoxFlex.Application::before {background-image: url(../images/bg_application.png);}
	.BoxFlex.Drone::before {background-image: url(../images/bg_drone.png);}
	.BoxFlex.Aircraft::before {background-image: url(../images/bg_aircraft.png);}
	
	.BoxFlex::after {
		content: "";
		position: absolute;
		inset: 0;
		background: rgba(0,0,0,0.5);
		opacity: 0;
			-webkit-transition: opacity 0.5s ease;
		transition: opacity 0.5s ease;
		z-index: 1;
	}
	
	.BoxFlex img,
	.BoxSimple img {
		margin-bottom:20px;
		height:70px;
	}
	.BoxFlex .Heading3,
	.BoxSimple .Heading3 { margin-bottom:10px;}
	
	.BoxFlex img,
	.BoxFlex h3,
	.BoxFlex p {
		position: relative;
		z-index: 2;
			-webkit-transition: opacity 0.4s ease, transform 0.4s ease;
		transition: opacity 0.4s ease, transform 0.4s ease;
	}
	.BoxFlex p { margin:0;}
	
	.BoxFlex .Caption {
		position: absolute;
		inset: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		opacity: 0;
		z-index: 3;
			-webkit-transition: opacity 0.4s ease, transform 0.4s ease;
		transition: opacity 0.4s ease, transform 0.4s ease;
			-webkit-transform: translateY(30px) scale(0.8);
		transform: translateY(30px) scale(0.8);
	}
	
	.BoxFlex:hover::before {
		opacity: 1; /* Show background image */
			-webkit-transform: scale(1.2); /* Slight zoom */
		transform: scale(1.2); /* Slight zoom */
	}
	.BoxFlex:hover::after {
		opacity: 1; /* Show black overlay */
	}
	
	.BoxFlex:hover img,
	.BoxFlex:hover h3,
	.BoxFlex:hover p {
		opacity: 0; /* Hide icon & text */
			-webkit-transform: translateY(-10px);
		transform: translateY(-10px);
	}
	
	.BoxFlex:hover .Caption {
		opacity: 1; /* Show button */
			-webkit-transform: translateY(0) scale(1); /* Slide up + zoom in */
		transform: translateY(0) scale(1); /* Slide up + zoom in */
	}
	
	
	#Features {
		margin-top:5vh;
	}
	
	.BoxInline .d-flex { margin-bottom:15px;}
	.BoxInline .d-flex > img {
		margin-right:15px;
		height:50px;
	}

	#Testimonials {
		margin-top:5vh;
		margin-bottom:1vh;
	}
	#Testimonials .avatar > img { height:80px;}
	
	#Testimonials .Heading4 {
		margin-bottom:6px;
		margin-top:20px;
	}
	#Testimonials .stars > img {
		height:16px;
		margin-bottom:20px;
	}
	#Testimonials.MyCarousel .carousel-indicators {
		bottom: -20px;
	}
	
	.ImgRadius img {
		width:100%;
			-webkit-border-radius:10px;
		border-radius:10px;
	}
	
	.ExtraPadColum > .row {
		margin-left:-30px;
		margin-right:-30px;
	}
	.ExtraPadColum > .row >* {
		padding-left:30px;
		padding-right:30px;
	}


	/*===== SUBPAGE's DESIGN ==*/
	.PageTitle {
		position:relative;
		padding-top:50px;
	}
	.PageTitle .Inner {
		background:#8BC243;
		padding:31px 30px 36px 30px;
			-webkit-border-radius:10px;
		border-radius:10px;
	}
	
	.PageTitle .TitleStyle { margin-bottom: 0px;}
	.PageTitle .TitleStyle .Top {
		color:#fff;
		margin-bottom:5px;
	}
	
	
	.step {
		display: flex;
		align-items: flex-start;
		position: relative;
		margin-bottom:30px;
	}
	.step::before {
		content: "";
		width: 2px;
		height: 100%;
		background: #8BC243;
		position: absolute;
		left: 30px;
		bottom: -40px;
	}
	.step.Last::before { display:none;}
	
	.step-box {
		height: 60px;
		width: 64px;
		border-radius: 4px;
		background: #88C243;
		color: #fff;
		font-weight: 700;
		font-size: 12px;
		text-align: center;
		position: relative;
		text-transform: uppercase;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-right: 25px;
		line-height: normal;
	}
	
	.step-box span.count {
		font-size: 18px;
		line-height: 1;
		margin-top: 2px;
	}
	.step .Heading4 { margin-bottom:6px;}
	.step .content { width:100%;}
	
	
	#Faqs { min-height:calc(100vh - 265px);}
	
	.Theme.AccordionWrapp .card {
		margin-bottom: 20px;
	}
	.Theme.AccordionWrapp button[data-toggle="collapse"],
	.Theme.AccordionWrapp button[data-toggle="collapse"]:hover {
		font-size: 18px;
		line-height: 22px;
		font-weight: 600;
		color: #8BC243;
		background-color: transparent;
		padding: 20px;
		border: 1px solid #D6D6D6;
		border-bottom-color:transparent;
			-webkit-border-radius: 10px 10px 0 0;
		border-radius: 10px 10px 0 0;
		position:relative;
		letter-spacing:0.01em;
	}
	.Theme.AccordionWrapp button[data-toggle="collapse"].collapsed {
		background-color: transparent;
		color: #3E4346;
		border-color: #D6D6D6;
			-webkit-transition: 0.4s ease;
		transition: 0.4s ease;
			-webkit-border-radius: 10px;
		border-radius: 10px;
	}
	.Theme.AccordionWrapp button[data-toggle="collapse"]:hover.collapsed {
		background-color: #F3F8ED;
		color: #3E4346;
			-webkit-transition: 0.4s ease;
		transition: 0.4s ease;
	}
	
	.Theme.AccordionWrapp button[data-toggle="collapse"] i {
		top: 50%;
		right:20px;
		margin-top:-11px;
		color: #3E4346;
			-webkit-transition: 0.4s ease;
		transition: 0.4s ease;
			-webkit-transform:rotate(-90deg);
		transform:rotate(-90deg);
	}
	.Theme.AccordionWrapp button[data-toggle="collapse"].collapsed i {
		color: #3E4346;
			-webkit-transition: 0.4s ease;
		transition: 0.4s ease;
			-webkit-transform:rotate(90deg);
		transform:rotate(90deg);
	}
	
	.Theme.AccordionWrapp .card-body {
		background: transparent;
		padding: 0 20px 20px 20px;
			-webkit-border-radius: 0 0 10px 10px;
		border-radius: 0 0 10px 10px;
		border: 1px solid #D6D6D6;
		border-top-color: transparent;
	}
	
	.Theme.AccordionWrapp button[data-toggle="collapse"].collapsed i::before {content: '\0276F';}
	.Theme.AccordionWrapp button[data-toggle="collapse"] i::before {content: '\0276F';}
	.Theme.AccordionWrapp button[data-toggle="collapse"] i { font-size:14px;}



	/*===== FOOTER ==*/
	#Footer {
		background:#3E4346;
		font-size:15px;
		line-height:20px;
		color:#D6D6D6;
		padding-top:6vh;
		padding-bottom:5.5vh;
	}

	#Footer a { color:#D6D6D6;}
	#Footer a:hover { color:#8BC243;}

	#Footer .Inline {display: inline-block;}
	#Footer .Hide {
		padding: 0 10px;
		color: #999;
	}




/****************************************
	MEDIA QUERIES
****************************************/

/***** for 1400px or less ===========*/
@media All and (max-width:1480px) {
	.MainWrapper {
		margin:0px 5%;
		max-width:100%;
	}
	
	#VideoWrapper .Title {
		font-size: 50px;
		line-height: 60px;
	}
	#VideoWrapper .Desc {
		font-size: 20px;
		line-height: 30px;
		margin: 20px auto 0;
	}
	
	.ExtraPadColum > .row {
		margin-left:-15px;
		margin-right:-15px;
	}
	.ExtraPadColum > .row >* {
		padding-left:15px;
		padding-right:15px;
	}
}


/***** for 1280px or less ===========*/
@media All and (max-width:1199px) {
	.MainWrapper { margin:0px 20px;}
}


/***** for 1024px or less ===========*/
@media All and (max-width:991px) {
	#TopHead {
		background:#fff;
		height:50px !important;
		position:fixed;
		border-bottom:1px solid #D6D6D6;
	}
	#TopHeadHeightFixed {
		display:block;
		height:50px;
	}

	#TopHead .BotmRow {
		background: none;
		border:none;
	}
	#TopHead .BotmRow .MainWrapper { margin:0;}
	#TopHead .BotmRow .Logo {
		float:none;
		margin:0;
	}
	#TopHead .BotmRow .Logo img {
		height:20px;
		margin:15px 0 15px 10px;
	}
	#TopBtn {
		float: none;
		margin-top: 0;
		position: absolute;
		top: 8px;
		right: 58px;
	}
	#TopBtn .Theme.btn {
		font-size: 11px;
		font-weight: 700;
		
	}
	#TopBtn .Theme.btn.AnchorBtn a {padding: 9px 12px;}
	
	#VideoWrapper .Title {
		font-size: 40px;
		line-height: 50px;
	}
	
	.TitleStyle .Top {
		font-size:30px;
		line-height:34px;
	}
	
	#Footer {
		font-size:13px;
		line-height:16px;
		padding-top:25px;
		padding-bottom:25px;
	}
	#Footer, #Footer .text-right {
		text-align:center !important;
	}
	#Footer .Copyright .Hide {display: none;}
	#Footer .Copyright .Inline {display: block; margin-top:8px;}
	
	
	.PageTitle {padding-top: 1px;}
	.PageTitle .MainWrapper { margin:0;}
	.PageTitle .Inner {
		padding: 21px 20px 26px 20px;
			-webkit-border-radius: 0;
		border-radius: 0;
	}
	
	.BreadCrumbs {
		font-size: 11px;
		line-height: 14px;
	}
	
	#Faqs { min-height:calc(100vh - 265px);}
}


/***** for 768px or less ===========*/
@media All and (max-width:760px) {
	body {
		font-size: 14px;
		line-height: 20px;
		font-weight:400;
	}
	p { margin-bottom:20px;}

	.WhiteWrapper, .LightWrapper { padding: 30px 0;}

	.TitleStyle {
		margin-bottom: 1.5vh;
	}
	.TitleStyle .Top {
		font-size: 20px;
		line-height: 24px;
	}
	
	.Heading2 {
		font-size: 18px;
		line-height: 26px;
	}
	
	.Heading3 {
		font-size: 16px;
		line-height: 20px;
	}
	
	.Heading4 {
		font-size: 15px;
		line-height: 20px;
	}
	
	#VideoWrapper .Title {
		font-size: 22px;
		line-height: 28px;
		font-weight:500;
	}
	#VideoWrapper .Desc {
        font-size: 15px;
        line-height: 22px;
        margin-top: 10px;
    }
	
	.BoxFlex, .BoxInline {
		padding: 20px;
	}
	.BoxFlex img,
	.BoxSimple img {
		margin-bottom: 10px;
		height: 50px;
	}
	.BoxFlex .Heading3,
	.BoxSimple .Heading3 {
		margin-bottom: 4px;
	}
	
	.BoxFlex::before,
	.BoxFlex::after { display:none;}
	
	.BoxFlex:hover { border:1px solid #D6D6D6;}
	.BoxSimple:hover { background:transparent;}
	
	.BoxFlex .Caption {
		position: relative;
		display: block;
		opacity: 1;
		transition:none;
		transform: none;
		margin-top:20px;
	}
	
	.BoxFlex:hover::before,
	.BoxFlex:hover::after {
		opacity: 0;
	}
	.BoxFlex:hover img,
	.BoxFlex:hover h3,
	.BoxFlex:hover p {
		opacity: 1;
			-webkit-transform: none;
		transform: none;
	}
	.BoxFlex:hover .Caption {
			-webkit-transform: none;
		transform: none;
	}
	
	.BoxInline .d-flex > img {
		margin-right: 10px;
		height: 40px;
	}
	.BoxInline .d-flex {
		margin-bottom: 10px;
	}
	
	#Features {
		margin-top: 2.5vh;
	}
	
	#Testimonials {
		margin-top:1vh;
		margin-bottom:1vh;
	}
	#Testimonials .avatar > img { height:50px;}
	
	#Testimonials .Heading4 {
		margin-bottom:2px;
		margin-top:15px;
	}
	#Testimonials .stars > img {
		height:10px;
		margin-bottom:10px;
	}
	#Testimonials.MyCarousel .carousel-indicators {
		bottom: -30px;
	}
	
	#About .mt-4 {
		margin-top: 10px !important;
	}
	
	.step {
		margin-bottom:20px;
	}
	.step::before {
		left: 17px;
		bottom: -30px;
	}
	.step-box {
		height: 40px;
		width: 44px;
		font-size: 9px;
		margin-right: 15px;
	}
	.step-box span.count {
		font-size: 14px;
	}
	
	#Faqs { min-height:calc(100vh - 255px);}
	
	.Theme.AccordionWrapp button[data-toggle="collapse"],
	.Theme.AccordionWrapp button[data-toggle="collapse"]:hover {
		font-size: 15px;
		line-height: 20px;
		padding: 16px;
	}
	.Theme.AccordionWrapp .card-body {
		padding: 0 16px 16px 16px;
	}
	.Theme.AccordionWrapp .card {
		margin-bottom: 15px;
	}
	
	.Heading2 > img {
		height: 26px;
	}
}