/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
:root {scroll-behavior: smooth;}
body {font-family: "Nunito", sans-serif;color: #86878b;}
a {color: #de3326;text-decoration: none;}
a:hover {color: #de3326;text-decoration: none;}
h1, h2, h3, h4, h5, h6, .heading {font-family: "Bebas Neue", cursive;color: #ffffff;}
.heading-border{position: relative;padding-bottom: 10px;margin-bottom: 40px;line-height: normal;font-size:4rem;}
.heading-border::before{position: absolute;content: '';background: #de3326;width: 74px;height: 2px;bottom: 0;left: 0;}
img{max-width: 100%;}
/*--------------------------------------------------------------
# Sections
--------------------------------------------------------------*/
section {padding: 70px 0;overflow: hidden;}
.section-header {text-align: center;padding-bottom: 40px;}
.section-header p{font-size: 1.5rem;}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {position: fixed;visibility: hidden;opacity: 0;right: 15px;bottom: 15px;z-index: 99999;background: #de3326;width: 40px;height: 40px;border-radius: 4px;transition: all 0.4s;box-shadow: 0 0 10px 1px rgba(255, 255, 255, 0.2);}
.back-to-top i {font-size: 24px;color: #fff;line-height: 0;}
.back-to-top:hover {background: #666;color: #fff;}
.back-to-top.active {visibility: visible;opacity: 1;}

/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
    [data-aos-delay] {  transition-delay: 0 !important;}
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.header {transition: all 0.5s;z-index: 997;padding: 20px 0;}
.header.header-scrolled {background: #fff;padding: 15px 0;box-shadow: 0px 2px 20px rgba(1, 41, 112, 0.1);position: fixed;width: 100%;}
.header .logo {line-height: 0;}
.header .logo img {max-height: 69px;margin-right: 6px;}
.header .logo span {font-size: 30px;font-weight: 700;letter-spacing: 1px;color: #012970;font-family: "Nunito", sans-serif;margin-top: 3px;}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation 
*/
.navbar {padding: 0;}
.navbar ul {margin: 0;padding: 0;display: flex;list-style: none;align-items: center;}
.navbar li {position: relative;}
.navbar a, .navbar a:focus {display: flex;align-items: center;justify-content: space-between;padding: 10px 0 10px 30px;font-family: "Nunito", sans-serif;font-size: 16px;font-weight: 600;color: #000005;white-space: nowrap;transition: 0.3s;text-transform: uppercase;}
.navbar a i, .navbar a:focus i {font-size: 12px;line-height: 0;margin-left: 5px;}
.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a {color: #de3326;}
.navbar .getstarted, .navbar .getstarted:focus {background: #de3326;padding: 18px 20px;margin-left: 30px;border-radius: 0;color: #fff;}
.navbar .getstarted:hover, .navbar .getstarted:focus:hover {color: #fff;background: #666;}
.navbar .dropdown ul {display: block;position: absolute;left: 14px;top: calc(100% + 30px);margin: 0;padding: 10px 0;z-index: 99;opacity: 0;visibility: hidden;background: #fff;box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);transition: 0.3s;border-radius: 4px;}
.navbar .dropdown ul li {min-width: 200px;}
.navbar .dropdown ul a {padding: 10px 20px;font-size: 15px;text-transform: none;font-weight: 600;}
.navbar .dropdown ul a i {font-size: 12px;}
.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {color: #de3326;}
.navbar .dropdown:hover > ul {opacity: 1;top: 100%;visibility: visible;}
.navbar .dropdown .dropdown ul {top: 0;left: calc(100% - 30px);visibility: hidden;}
.navbar .dropdown .dropdown:hover > ul {opacity: 1;top: 0;left: 100%;visibility: visible;}
@media (max-width: 1366px) {
    .navbar .dropdown .dropdown ul {  left: -90%;}.navbar .dropdown .dropdown:hover > ul {  left: -100%;}
}

/**
* Mobile Navigation 
*/
.mobile-nav-toggle {color: #012970;font-size: 28px;cursor: pointer;display: none;line-height: 0;transition: 0.5s;}
.mobile-nav-toggle.bi-x {color: #fff;}

@media (max-width: 991px) {
    .mobile-nav-toggle {  display: block;}
    .navbar ul {  display: none;}
}
.navbar-mobile {position: fixed;overflow: hidden;top: 0;right: 0;left: 0;bottom: 0;background: rgba(1, 22, 61, 0.9);transition: 0.3s;z-index: 9;}
.navbar-mobile .mobile-nav-toggle {position: absolute;top: 15px;right: 15px;}
.navbar-mobile ul {display: block;position: absolute;top: 55px;right: 15px;  left: 15px;padding: 10px 0;border-radius: 10px;background-color: #fff;overflow-y: auto;transition: 0.3s;  }
.navbar-mobile a, .navbar-mobile a:focus {padding: 10px 20px;font-size: 15px;color: #de3326;}
.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {color: #de3326;}
.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus {margin: 15px;color: #fff;}
.navbar-mobile .dropdown ul {position: static;display: none;margin: 10px 20px;padding: 10px 0;z-index: 99;opacity: 1;visibility: visible;background: #fff;box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);}
.navbar-mobile .dropdown ul li {min-width: 200px;}
.navbar-mobile .dropdown ul a {padding: 10px 20px;}
.navbar-mobile .dropdown ul a i {font-size: 12px;}
.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {color: #de3326;}
.navbar-mobile .dropdown > .dropdown-active {display: block;}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.home{color: #ffffff;}
.hero {width: 100%;height: 700px;background: url(../img/banner.jpg) top center no-repeat;background-size:cover; background-color: #000005; }
.hero h1 {  font-size:6rem;  }
.hero h2 {color: #fff;  font-size:1.5rem;font-family:  "Nunito", sans-serif;}
@media (min-width:1400px){
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{width: 1240px;}
}
@media screen and (max-width: 1600px) and (min-width: 1200px) {
    .hero {background-position: 80%;}
}
@media (max-width:1200px) {
    .hero {  height: auto;  padding: 50px 0 50px 0;background-image: url(../img/banner-ipad.jpg);} 
    .hero h1{font-size: 4rem;}
    .heading-border{font-size: 2.2rem;}    
}
@media (max-width: 1023px) {
    .hero {  text-align: center;}
    .hero h1 {  font-size: 2rem;}
    .hero h2 {  font-size: 1.5rem;} 
    .hero .heading-border::before{margin: 0 auto; right: 0;}
    .hero .justify-content-center{background: rgba(0, 0, 0, 0.5); padding: 30px;}
}
@media (max-width:767px) {
    .hero {  height: auto;  padding: 60px 0 60px 0;background-image: url(../img/banner-mob.jpg); background-position: 80%;}     
    .hero h2 { font-size: 1rem}   
}
.who-we-are, .portfolio{background: #de3326;}
.who-we-are .heading-border::before, .portfolio .heading-border::before{background:#e55c51}
.portfolio .heading-border::before, .testimonials .heading-border::before, .get-a-quote .heading-border::before{right: 0; margin: 0 auto;}
section.our-products {background:#131314;padding-bottom: 20px;}
.our-products .feture-tabs .nav-link {background: none;text-transform: uppercase;font-size: 2rem;color: #fff;padding: 12px 0;margin-bottom: -2px;border-radius: 0;font-family: "Bebas Neue", cursive;position: relative;}
.our-products .feture-tabs .nav-link.active {color: #de3326;}
.our-products .feture-tabs .nav li{position:relative; margin-right: 40px;}
.our-products .feture-tabs .nav li:last-child{margin-right:0;}
.our-products .feture-tabs .nav li:last-child::before{display: none;}
.our-products .feture-tabs .nav li::before{content: '/';position: absolute;bottom:10px;right:-25px;color: #fff;font-size: 2rem;font-family: "Bebas Neue", cursive;}
.our-products .bg-color-red{background: #de3326;list-style-type: square;padding: 30px;height: 100%;}
.our-products .bg-color-red li{margin-bottom: 10px;line-height: 1.5;}
.our-products .bg-color-red li:last-child{margin-bottom: 0;}
.our-products .tab-content > .active{display: flex;}
.our-products .tab-content .list-grid{margin-bottom: 40px;}
.our-products .tab-content .text-center{margin-top: 15px;  font-size: 2rem;}
@media (max-width: 991px) {
    .our-products .justify-content-end {
        justify-content: flex-start!important;
    }
    .our-products .feture-tabs .nav-link, .our-products .feture-tabs .nav li::before{
        font-size: 1.5rem;
    }
}
/*--------------------------------------------------------------
# Portfolio
--------------------------------------------------------------*/
.portfolio #portfolio-flters {padding: 0;margin: 0 auto 25px auto;list-style: none;text-align: center;background: white;border-radius: 50px;padding: 2px 15px;}
.portfolio #portfolio-flters li {cursor: pointer;display: inline-block;padding: 8px 20px 10px 20px;font-size: 15px;font-weight: 600;line-height: 1;color: #444444;margin: 0 4px 8px 4px;transition: 0.3s;border-radius: 50px;border: 1px solid #fff;}
.portfolio #portfolio-flters li:hover, .portfolio #portfolio-flters li.filter-active {color: #de3326;border-color: #de3326;}
.portfolio #portfolio-flters li:last-child {margin-right: 0;}
.portfolio .portfolio-wrap {transition: 0.3s;position: relative;overflow: hidden;z-index: 1;background: rgba(255, 255, 255, 0.75);max-height: 220px; }
.portfolio .portfolio-wrap::before {content: "";background: rgba(255, 255, 255, 0.75);position: absolute;left: 30px;right: 30px;top: 30px;bottom: 30px;transition: all ease-in-out 0.3s;z-index: 2;opacity: 0;}
.portfolio .portfolio-wrap img {transition: 1s;}
.portfolio .portfolio-wrap .portfolio-info {opacity: 0;position: absolute;top: 0;left: 0;right: 0;bottom: 0;text-align: center;z-index: 3;transition: all ease-in-out 0.3s;display: flex;flex-direction: column;justify-content: center;align-items: center;max-height: 220px;}
.portfolio .portfolio-wrap .portfolio-info::before {display: block;content: "";width: 48px;height: 48px;position: absolute;top: 35px;left: 35px;border-top: 3px solid rgba(1, 41, 112, 0.2);border-left: 3px solid rgba(1, 41, 112, 0.2);transition: all 0.5s ease 0s;z-index: 9994;}
.portfolio .portfolio-wrap .portfolio-info::after {display: block;content: "";width: 48px;height: 48px;position: absolute;bottom: 35px;right: 35px;border-bottom: 3px solid rgba(1, 41, 112, 0.2);border-right: 3px solid rgba(1, 41, 112, 0.2);transition: all 0.5s ease 0s;z-index: 9994;}
.portfolio p {font-size:1.2rem;  }
.portfolio .portfolio-wrap .portfolio-links {text-align: center;z-index: 4;}
.portfolio .portfolio-wrap .portfolio-links a {color: #fff;background: #de3326;margin: 10px 2px;width: 56px;height: 56px;display: inline-flex;align-items: center;justify-content: center;border-radius: 50%;transition: 0.3s;}
.portfolio .portfolio-wrap .portfolio-links a i {font-size: 24px;line-height: 0;}
.portfolio .portfolio-wrap .portfolio-links a:hover {background: #666;}
.portfolio .portfolio-wrap:hover img {transform: scale(1.1);}
.portfolio .portfolio-wrap:hover::before {top: 0;left: 0;right: 0;bottom: 0;opacity: 1;}
.portfolio .portfolio-wrap:hover .portfolio-info {opacity: 1;}
.portfolio .portfolio-wrap:hover .portfolio-info::before {top: 15px;left: 15px;}
.portfolio .portfolio-wrap:hover .portfolio-info::after {bottom: 15px;right: 15px;}
.glightbox-clean .gdesc-inner{padding-bottom: 0;}
.glightbox-clean .gslide-title{font-family: "Bebas Neue";font-size: 1.5rem;}
.glightbox-clean .gdesc-inner .gslide-desc{margin-bottom: 19px;}
.glightbox-clean .gslide-media img{max-height: 600px !important; width: auto; max-width: 100%;}
@media screen and (max-width: 1024px) and (min-width: 768px) {    
    .portfolio .portfolio-wrap, .portfolio .portfolio-wrap .portfolio-info{max-height: 210px;}
}
@media (max-width: 767px) {
    .glightbox-clean .gslide-media{padding:0 10px;}
}

/*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
section.testimonials{background: #131314;}
.testimonials .testimonial-item {box-sizing: content-box;padding: 30px;margin: 40px 30px;box-shadow: 0px 0 20px rgba(1, 41, 112, 0.1);background: #fff;min-height: 265px;display: flex;flex-direction: column;text-align: center;transition: 0.3s;color: #86878b;}

.testimonials .testimonial-item .testimonial-img {width: 90px;border-radius: 50%;border: 4px solid #fff;margin: 0 auto;}
.testimonials .testimonial-item h3 {font-size: 18px;font-weight: bold;margin: 10px 0 5px 0;color: #111;}
.testimonials .testimonial-item h4 {font-size: 14px;color: #999;margin: 0;}
.testimonials .testimonial-item p {font-style: italic;margin: 0 auto 15px auto;}
.testimonials .swiper-pagination {margin-top: 20px;position: relative;}
.testimonials .swiper-pagination .swiper-pagination-bullet {width: 12px;height: 12px;background-color: #fff;opacity: 1;border: 1px solid #de3326;}
.testimonials .swiper-pagination .swiper-pagination-bullet-active {background-color: #de3326;}
.testimonials .swiper-slide {opacity: 0.3;}
.mySwiper .swiper-button-next, .mySwiper .swiper-button-prev {top: 94%;font-size: 10px;background:rgba(255, 255, 255, 0.8);padding: 25px; transition: all 1s;}
.mySwiper .swiper-button-next:hover, .mySwiper .swiper-button-prev:hover{background:rgba(255, 255, 255, 1);}
.mySwiper .swiper-button-next{right: auto; left: 62px;}
.mySwiper .swiper-button-next::after, .mySwiper .swiper-button-prev::after{font-size:1.8rem; color: #b4180c;}
@media (max-width: 1199px) {
    .testimonials .swiper-slide-active {  opacity: 1;}.testimonials .swiper-pagination {  margin-top: 0;}
}
@media screen and (min-width: 1200px) {
    .testimonials .swiper-slide-next {  opacity: 1;  transform: scale(1.12);}
    .footer .footer-top {
        padding: 250px 0 250px 0 !important;
    }
}

/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
section.get-a-quote{background: url(../img/form_banner.jpg) top center no-repeat;background-size: cover; background-color: #000005;}
.get-a-quote .info-box {color: #444444;padding: 30px;}
.get-a-quote .info-box i {font-size: 38px;line-height: 0;color: #de3326;}
.get-a-quote .info-box h3 {font-size: 20px;color: #012970;font-weight: 700;margin: 20px 0 10px 0;}
.get-a-quote .info-box p {padding: 0;line-height: 24px;font-size: 14px;margin-bottom: 0;}
.get-a-quote .container{max-width: 940px;}
.get-a-quote .php-email-form {  padding: 30px;height: 100%;}
.get-a-quote .php-email-form .error-message {display: none;color: #fff;background: #ed3c0d;text-align: left;padding: 15px;margin-bottom: 24px;font-weight: 600;}
.get-a-quote .php-email-form .sent-message {display: none;color: #fff;background: #18d26e;text-align: center;padding: 15px;margin-bottom: 24px;font-weight: 600;}
.get-a-quote .php-email-form .loading {display: none;background: #fff;text-align: center;padding: 15px;margin-bottom: 24px;}
.get-a-quote .php-email-form .loading:before {content: "";display: inline-block;border-radius: 50%;width: 24px;height: 24px;margin: 0 10px -6px 0;border: 3px solid #18d26e;border-top-color: #eee;-webkit-animation: animate-loading 1s linear infinite;animation: animate-loading 1s linear infinite;}
.get-a-quote .php-email-form input, .get-a-quote .php-email-form textarea {background:rgba(255, 255, 255, 0.3);height: 68px; border-radius: 0;border: 0;box-shadow: none;font-size: 1.4rem;  color: #fff;}
.get-a-quote .php-email-form ::placeholder{color: #fff;}
.get-a-quote .php-email-form input:focus, .get-a-quote .php-email-form textarea:focus {border-color: #de3326;}
.get-a-quote .php-email-form input {padding: 10px 15px;}
.get-a-quote .php-email-form textarea {padding: 12px 15px;height: 120px;}
.get-a-quote .php-email-form button[type=submit] {background: #de3326;border: 0;padding: 25px 30px;color: #fff;transition: 0.4s;border-radius: 0;text-transform: uppercase;font-size: 1rem;font-weight: 600;}
.get-a-quote .php-email-form button[type=submit]:hover {background: #666;}
@-webkit-keyframes animate-loading {0% {  transform: rotate(0deg);}100% {  transform: rotate(360deg);}}
@keyframes animate-loading {0% {  transform: rotate(0deg);}100% {  transform: rotate(360deg);}}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer {background: #b4180c;padding: 0 0 30px 0;font-size: 1.4rem;color: #000;}
.footer a{color: #000;}
.footer .footer-top {background: #d5d5d5;  padding: 60px 0 30px 0;}
.footer .footer-top .footer-info {margin-bottom: 30px;}
.footer .footer-top .footer-info .logo {line-height: 0;margin-bottom: 15px;}
.footer .footer-top .footer-info .logo img {max-height: 116px;margin-right: 6px;}
.footer .footer-top h4 {font-size: 2rem;font-weight: bold;color: #000;text-transform: uppercase;position: relative;padding-bottom: 12px;}
.footer .footer-top .footer-links {margin-bottom: 30px;}
.footer .footer-top .footer-links ul {list-style: none;padding: 0;margin: 0;}
.footer .footer-top .footer-links ul li {padding: 10px 0;display: flex;align-items: center;}
.footer .footer-top .footer-links ul li:first-child {padding-top: 0;}
.footer .footer-top .footer-links ul a {color: #000;transition: 0.3s;display: inline-block;line-height: 1;}
.footer .footer-top .footer-links ul a:hover {color: #de3326;}
.footer .footer-top .footer-contact p {line-height: 26px;}
.footer .copyright {text-align: center;padding-top: 30px;color: #fff;}
.footer .copyright p{margin-bottom: 0;}
.footer .credits {padding-top: 10px;text-align: center;font-size: 13px;color: #000;}
/*******Thankyou page*******/
.thankyou h2{
font-size: 3rem;
}
.thankyou .get-a-quote{min-height: 450px;}