@charset "utf-8"; @import url(https://fonts.googleapis.com/css2?family=Anybody:wght@200;400;500;700;800&display=swap); body, form, h1, h2, h3, h4, h5, h6, input, li, p, ul { margin: 0; padding: 0 } .hero-image h1, header .call { text-align: left } header .call, header .email { line-height: 66px; color: #fff } .hide-btn, .rk ul li a { color: #000 } .hide-btn, .lineA, .text-center { text-align: center } .hero-image h1, .hero-image1 h1, .text-drone h1 { font-weight: 800; text-transform: uppercase } .hero-image h1, .hero-image1 h1, .intelligence-sec h1, .rk ul li a, .rk ul li a:hover, .section-bg h1, .text-drone h1 { text-transform: uppercase } html { font-size: 100%; scroll-behavior: smooth } .rk ul li a, .rk ul li a:hover, body, header .call, header .email { font-size: 14px; font-family: Anybody, sans-serif } .collapse, .m-hide, footer, header, nav, section, title { display: block } body { font-weight: 400; font-style: normal; line-height: 15px; -webkit-font-smoothing: antialiased; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; color: #191b30 } img { border: 0 } ul { list-style: none } * { outline: 0 !important } :focus, a:active, a:focus, a:hover, input, input[type=button]:focus, input[type=image] { outline: 0; text-decoration: none } .clearfix:after, .clearfix:before { display: block; content: ""; line-height: 0 } .clearfix:after { clear: both } .btn { outline: 0 } a, button { transition: .5s ease-in-out } .btn-close::after, .btn-open:after { content: ''; transition-property: all .2s linear 0s; -moz-transition: .2s linear; -webkit-transition: .2s linear; -o-transition: .2s linear; position: absolute } .d-hide, .m-tagline { display: none } .head { max-width: 1000px; margin: 0 auto } .bgorg { background: linear-gradient(0deg, #dd6d08 0, #fd9100 100%); width: 85px; height: 66px; position: absolute; right: -1px; border-radius: 0 10px 10px 0 } .hide-btn, header { left: 0; right: 0; margin: 0 auto } header { position: fixed; bottom: 15px; border-radius: 10px; padding: 10px; width: 100%; max-width: 1200px; z-index: 999 } header .email { text-align: right } header .nav-bg { height: 66px; box-shadow: 0 1px 7px 0 rgb(0 0 0 / 10%), 0 7px 9px 0 rgb(0 0 0 / 5%); border-radius: 10px 15px; background: #191b30; padding: 0 15px; line-height: 50px; transform: skew(-20deg, 0deg) } header .nav-logo { float: left; padding: 1px 0 0; display: block; transform: skew(20deg, 0deg) } header .social { float: none; padding-left: 40px } header .social .fa { padding: 5px; font-size: 22px; color: #fff } header .social .fa:hover { padding: 5px; font-size: 22px; color: #ef7f1a } .hide-btn { position: absolute; bottom: -15px; font-size: 22px; z-index: 99999; cursor: pointer; width: 30px; height: 30px; border: 1px solid #fff; background: #fff; border-radius: 50%; line-height: 26px } .button { display: inline; position: absolute; right: 30px; top: 10px; z-index: 999 } .button span { text-decoration: none; cursor: pointer } .btn-open:after { background: url(../images/menu.svg) center top/100% no-repeat; width: 52px; height: 34px; top: 6px; right: -14px } .btn-close::after { background: url(../images/close.svg) center top/100% no-repeat; width: 46px; height: 46px; top: 0; right: -10px } .rkbg { position: absolute; right: -50px; top: 9px; height: 100px; width: 30% } .img-drone img, .map-1 img, .rkh, .rkh1 { width: 100% } .sufferingWrap { padding: 80px 0 60px } .rk { font-family: Anybody, sans-serif } .rk ul { margin-top: 40px; font-family: Anybody, sans-serif; margin-bottom: 20px } .rk ul li { display: inline; border-right: 1px solid #fff; padding: 0 10px; font-size: 12px; color: #848896; font-family: Anybody, sans-serif } .rk ul li:last-child { border-right: 0 solid #848896 } .rk ul li a:hover { color: #fd9100 } .rkh1 { height: 240px } .f-social { padding: 10px; color: #848896; font-size: 24px } .f-social .fa { padding: 6px; color: #848896; font-size: 28px } .f-social .fa:hover { padding: 6px; color: #b79038; font-size: 28px } .scroll-hide-mobile { display: none !important } .pad-100 { padding: 100px 0 } .pad-50 { padding: 50px 0 } .pad-40 { padding: 40px 0 } .pad-top50 { padding-top: 50px } .pt-3, footer { padding-top: 30px } .pt-4 { padding-top: 40px } .pl-3 { padding-left: 40px !important } .f18 { font-size: 16px; line-height: 20px; font-weight: 600; color: #191b30 } .pad-70 { padding: 70px 0 } .hero-image { background-image: url("../images/banner.jpg"); height: 700px; background-position: center; background-repeat: no-repeat; background-size: cover; overflow: hidden } .hero-image h1 { color: #fff; font-size: 72px; line-height: 72px; margin-top: 200px } .hero-image h2, .hero-image h3, .hero-image1 h2 { margin-top: 30px; padding-left: 10px; text-align: left } .hero-image h3 { z-index: 1000000; position: relative } .hero-image h3 a { font-size: 18px; color: #fff; font-weight: 600 } .hero-image h3 a:hover { font-size: 18px; color: #ef7f1a; font-weight: 600 } .dron img { width: 85% } .hero-image1 { background-color: #2f3036; height: 100vh; width: 100% } .hero-image1 h1 { color: #ef7f1a; font-size: 75px; line-height: 62px; text-align: left; margin-top: 100px } .hero-image1 h3 { margin-top: 30px; padding-left: 10px; text-align: left; z-index: 100000000; position: relative } .dron1 { position: absolute; top: -80px; width: 80%; z-index: 100; left: 150px } .img-drone, .lineA { position: relative } .lineA { top: -100px; left: 50%; transform: translate(-50%, -50%); z-index: 100 } .p-0 { padding: 0 } .carousel-control-prev { left: 0; width: 100px } .carousel-control-next { right: 0; width: 100px } .text-drone h1 { font-size: 60px; line-height: 55px; color: #191b30 } .img-drone { top: 50%; left: 50%; transform: translate(-50%, -10%) } .line, .line-top, .line-topp { text-align: center; transform: translate(-50%, -50%); position: relative; z-index: 100 } .custom-small-heading h4 { color: #ef7f1a; font-size: 20px; font-weight: 700 } .custom-small-heading h6 { color: #191b30; font-size: 16px; line-height: 32px } .vision p { padding-top: 20px; line-height: 18px; color: #191b30 } @media screen and (max-width:786px) { .img-drone img { width: 100% } } .section-bg { width: 100%; background: url(../images/sec-3.jpg) center/cover; min-height: 500px; padding: 180px 0 } .section-bg h1 { color: #fff; font-size: 70px; line-height: 65px; font-weight: 700 } .section-bg p { color: #fff; font-size: 14px; line-height: 20px; margin-top: 20px } .line-top { top: -180px; left: 7% } .line-topp { top: 200px; left: 50% } .line { top: 2000px; left: 50% } .org { color: #ef7f1a !important } .pb-1 { padding-bottom: 40px !important } .intelligence-sec { padding: 0; position: relative; background-size: cover } .ib-intelligence { position: absolute; top: 50%; left: 50%; transform: translate; transform: translate(-50%, -50%) } #line, .top-line { top: -10px; position: absolute } .intelligence-sec h1 { color: #191b30; font-size: 60px; line-height: 55px; font-weight: 700; padding-top: 0 } .intelligence-sec p { color: #191b30; font-size: 14px; line-height: 20px; margin-top: 20px } .intelligence-text { color: #fff; padding-bottom: 300px } .ib-hand-d { position: absolute; bottom: 0 } .intelligence-img, .text-right { text-align: right } .intelligence-img img { width: 80%; vertical-align: top; position: relative; top: -74px } .margin-top { margin-top: 150px } .product-sec { text-align: center; justify-content: center; padding-top: 120px } .br1 { padding-left: 32px !important; padding-right: 0 !important } .plp { padding-left: 22px !important; padding-right: 26px !important } .p-card { margin-bottom: 50px; border-radius: 20px; background-color: #fff } .p-card img { position: relative; top: -80px; width: 200px } .product-text { text-align: left; padding: 0 30px 30px } .copyright, .inner-reactngle, .map-1 h4, .vs-div { text-align: center } .product-text .fa { font-size: 20px; color: #ef7f1a; padding: 5px 7px 0 0 } .product-text h6 { color: #ef7f1a; font-size: 20px; margin: 0; padding: 0; font-weight: 700; text-transform: uppercase; } .product-text ul li { font-size: 14px; padding: 0 0 15px } .product-text ul li::before { content: "\f058"; font-family: FontAwesome; display: inline-block; margin-left: -1.3em; width: 1.3em; font-size: 20px; color: #ef7f1a; padding: 5px 29px 0 24px; position: relative; top: 2px } .product-text ul { padding-top: 23px } .product-bg { background-color: #f0f0f0; padding: 70px 0 50px } .product-text .upper-p { color: #ef7f1a; font-weight: 600 } .focus-text h1, .product-text .lower-p { font-weight: 800 } .custom-li { line-height: 22px; display: flex } .focus-section { padding: 90px 0 } .flying-drone { background-repeat: no-repeat; background-size: 100% } .focus-text { padding: 70px 0 0 50px; position: absolute; top: -3px } .focus-text h1 { color: #fff; line-height: 55px; font-size: 60px } .focus-text p { color: #fff; padding-top: 15px; line-height: 20px; font-size: 14px } #line { width: 150px } #video { position: absolute; bottom: 70px; right: -60px } #video img { width: 250px } .focus-drone-upper-div { position: absolute; top: -90px; left: -100px } .focus-text2 { padding-top: 20px; padding-left: 40px } .focus-text2 h3 { color: #f0801a; font-size: 24px; font-weight: 600; padding-bottom: 8px } .focus-text2 p { line-height: 20px; font-size: 14px; padding-bottom: 36px; color: #191b30 } .optimize-section { background-color: #000; padding: 90px 0 } .optimize-row { padding-left: 52px } .optimize-row2 { padding-top: 61px } .optimize-row h1 { font-weight: 800; color: #ef7f1a; font-size: 55px; line-height: 62px } .map-1 h4 { color: #fff; font-size: 13px; padding: 0 0 15px; font-weight: 600 } .map-1 .map1-text h5, .map-1 h5 { color: #fff; font-size: 11px; padding: 0 0 15px } .map1-text { padding-top: 4.5px; display: flex; align-items: center; justify-content: space-between } .reactngle { height: 65px; width: 100%; border: 1px solid #fff } .inner-reactngle { height: 53px; width: 88%; border: 1px solid #fff; align-items: center; margin: 18px auto auto } .vs-div { padding: 40px 0; font-size: 53px; font-weight: 300; color: #fff } .circle { margin-bottom: 42px; height: 113px; width: 113px; border-radius: 50%; border: 8px solid #00a2ff } .contact-section { background: #f0f0f0; padding: 0 15px 250px } .contact-box { max-width: 700px; background: #fff; min-height: 250px; border-radius: 15px; padding: 50px 50px 0 } .contact-box h1 { line-height: 50px; font-size: 40px; font-weight: 700; position: relative; left: -50px; border-left: 10px solid #ef7f1a; margin-bottom: 30px; padding: 5px 0 5px 35px } .contact-box p { line-height: 22px; font-size: 14px; margin-bottom: 15px; } .contact-box .form-control { display: block; width: 100%; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 5px; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; } .btn-warning { color: #fff !important; background: #ef7f1a !important; font-size: 16px !important; border-radius: 50px; padding: 10px 30px !important; top: 22px; left: 40%; position: relative } .custom-rectangle { top: 210px } .rectangle { height: 46px; width: 7.5px; background-color: #ef7f1a; position: absolute; top: 210px; left: 14px } @media screen and (max-width:767px) { .btn-warning { color: #fff !important; background: #ef7f1a !important; font-size: 16px !important; border: 0; padding: 12px 30px !important; top: 22px; left: 30%; position: relative } } #main-menu-bg, .dron, .footer-img, .request-new { position: absolute } .f-drone { background: #191b30 } footer { background-color: #191b30; padding-bottom: 0 } footer .footer-ul li { display: inline; padding: 0; line-height: 30px } footer .footer-ul li:first-child, footer .footer-ul li:nth-child(2) { border-right: 2px solid #fff } footer .footer-ul li a { color: #fff; padding: 0 15px; font-size: 14px } footer .footer-ul li a:hover { color: #ef7f1a; padding: 0 15px; font-size: 14px } footer .social { float: none; text-align: right } footer .social a { padding: 0 5px } footer .social .fa { padding: 5px; font-size: 20px; color: #fff } footer .social .fa:hover { padding: 5px; font-size: 20px; color: #ef7f1a } .social-media-icon { color: #fff; line-height: 54px } .social-media-icon a { color: #fff; padding: 0 5px; font-size: 14px } .social-media-icon a:hover { color: #ef7f1a; padding: 0 5px; font-size: 14px } .footer-img { top: 53%; left: 50%; transform: translate(-50%, -50%) } .footer-img img { width: 600px } .footer-heading { padding: 150px 0 20px } .footer-heading h6 { padding: 10px 0 0; color: #fff; font-size: 14px } .btn-warning { background: linear-gradient(113deg, #191b30 0, #fd9100 100%); border: 0 } .hr1, .hr2 { background-color: #ef7f1a; height: 8px; width: 100% } .hr1 { margin-bottom: -9px } .footer-text { color: #fff; line-height: 24px; font-size: 14px } .footer-address { color: #fff; line-height: 20px } .footer-scan { display: flex; align-items: center } .footer-scan h4 { margin-left: 20px } .footer-scan img { min-height: 68px } .copyright { padding-top: 0; color: #fff; padding-bottom: 0; font-size: 12px } .req-btn, .req-btn:hover { color: #191b30 !important; padding: 10px 20px } .footer-line { height: 23px; margin-top: 15px } .footer-line::before { left: -13px; position: absolute; display: block; content: ""; width: 144px; height: 26px; transform: skew(-30deg); -webkit-transform: skew(-30deg); -moz-transform: skew(30deg); -o-transform: skew(-30deg); background: #191b30 } #main-menu-bg { height: 65px; left: 50%; width: 50%; margin-top: -57px } .request-new { text-align: left; width: auto; font-size: 18px; margin: 50px 10px; z-index: 100 } .req-btn { border-radius: 50px; border: 2px solid #191b30; background: #fffe0 } .req-btn:hover { border-radius: 50px; border: 2px solid #191b30; background: #ef7f1a } .dron { top: -71px; width: 90% !important; z-index: 100; text-align: right; left: 140px } @media screen and (max-width:767px) { .footer-img { position: absolute !important; top: 45% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: 90% !important } .footer-heading { padding: 120px 0 0 !important } footer { padding-top: 0 !important } } @media only screen and (min-device-width:768px) and (max-device-width:1024px) { .intelligence-sec h1 { padding-top: 20px } .intelligence-text { color: #fff; padding-bottom: 20px } .flying-drone { height: 390px } .focus-text2 { padding-top: 0px; padding-left: 40px } .p-card img { position: relative; top: 20px; width: 160px } .product-text { text-align: left; padding: 40px 30px 30px } .product-text ul li { display: flex } } @media screen and (max-width:786px) { .contact-box h1 { line-height: 40px; font-size: 30px; font-weight: 700; position: relative; left: -28px; border-left: 10px solid #ef7f1a; margin-bottom: 24px; padding: 5px 0 5px 22px } .contact-box { max-width: 700px; background: #fff; min-height: 250px; border-radius: 15px; padding: 50px 28px 0 } .zf-name .zf-tempContDiv input[type="text"] { width: 100% } .zf-namemedium .zf-tempContDiv span { width: 100%; margin-left: 0% } .zf-namemedium .zf-tempContDiv span { width: 100% !important; margin-left: 0% !important } }