@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css");

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
    background-color: white;
    color: color;
   
}

p {
    font-family: sans-serif system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.container,
.container-lg,
.container-md,
.container-sm,
.container-xl {
    width: 1230px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

/* COLORS  */
:root {
    --tgrey: #1B1B26;
    --tred: #DE302E;
}

/*======== HEADER SECTION START =========*/
.header-logo h2 {
    color: var(--tred);
    text-align: center;
    padding-top: 25px;
}

.header-logo::before {
    content: '';
    position: absolute;
    width: 104%;
    height: 157%;
    background-repeat: no-repeat;
}

.logo-img::before {
    background-image: url(../images/logo.png);
    left: 206px;
    top: -7px;
}

.header-logo {
    position: relative;
    left: 10px;
}

.icon-rw {
    background-color: var(--tgrey);
    color: white;
    padding-top: 10px;
    padding-left: 25px;
}

.icon-box2 {
    margin-left: -45px;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;
}

.icon-box1 {
    display: flex;

}

.icon-box1>p {
    margin-left: 20px;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;
}

.icon-box1>p:hover {
    color: var(--tred);
}

.icon-box1>p>img {
    width: 15%;
}

.icon-box2>i {
    margin-left: 5px;
    font-size: 18px;
}

.icon-box2>i:hover {
    color: var(--tred);
}

.inner {
    margin-top: -9px;
}

.inner>li>a {
    color: black !important;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 400;
    transition: 0.3s ease-in-out;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;
}

.inner>li>a:hover {
    color: var(--tred) !important;
}

.btn_red {
    text-decoration: none;
    color: white;
    text-transform: uppercase;
    background-color: var(--tred);
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 14px;
    transition: 0.8s ease-in-out;
    box-shadow: inset 0 0 0 0 white;

}

.nav-btn {
    margin-top: -8px;
}

.btn_red:hover {
    color: var(--tred);
    border: 1px solid var(--tred);
    font-weight: 600;
    box-shadow: inset 120px 0 0 0 white;
}

.call-icon {
    width: 4%;
    margin-top: -9px;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;
}

.call {
    margin-top: -13px;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;
}

.call>span {
    font-size: 12px;
    font-weight: 600;
}

.call>span:hover {
    color: #DE302E;
}

.nav-rw {
    padding-right: 100px;
    padding-left: 50px;
    margin-bottom: 13px;
}

/*======== HEADER SECTION END =========*/
/*======== HERO SECTION START =========*/
.hero-sec {
    background-image: url(../images/hero.webp);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-top: -21px;
}

.hero-box {
    color: white;
    width: 52%;
    margin-left: 606px;
    margin-top: 97px;
    margin-bottom: 150px;
}

.hero-box h1 {
    font-size: 54px;
    font-weight: 750;
    line-height: 57px;
}

.hero-box p {
    font-size: 17px;
    line-height: 29px;
    padding-top: 12px;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;

}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-o-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.btn_red_ {
    text-decoration: none;
    color: white;
    text-transform: uppercase;
    background-color: var(--tred);
    padding: 11px 45px;
    border-radius: 5px;
    font-size: 16px;
    transition: 0.8s ease-in-out;
    box-shadow: inset 0 0 0 0 white;
}

.btn_red_:hover {
    color: var(--tred);
    border: 1px solid var(--tred);
    font-weight: 600;
    box-shadow: inset 170px 0 0 0 white;
}

.btn_white {
    text-decoration: none;
    color: black;
    text-transform: uppercase;
    background-color: white;
    padding: 11px 45px;
    border-radius: 5px;
    font-size: 16px;
    letter-spacing: 1px;
    transition: 0.8s ease-in-out;
    margin-left: 15px;
    box-shadow: inset 0 0 0 0 var(--tgrey);
}

.btn_white:hover {
    color: white;
    font-weight: bold;
    box-shadow: inset 170px 0 0 0 var(--tgrey);
    border: 1px solid white;
}

.hero-btn {
    margin-top: 30px;
}

/*======== HERO SECTION END =========*/
/*======== FORM SECTION START =========*/
.form-sec {
    background-image: url(../images/form.webp);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    color: white;
    margin-top: -55px;
}

.form-box {
    margin-top: 67px;
    margin-bottom: 36px;
    margin-left: -17px;
}

.form-box p {
    font-size: 13px;
    line-height: 28px;
}

.form-box input {
    width: 95%;
    height: 35px;
    border: 1px solid white;
    border-radius: 3px;
}

.form-box input::placeholder {
    color: black;
    font-size: 12px;
    font-weight: 300;
    padding-left: 10px;
}

.form-btn {
    margin-top: 139px;
}

.form-btn .btn_red {
    padding: 10px 30px;
    margin-left: -29px;
}

/* @keyframes middle-box1 {
    from{
       transform: translateX(-250px);
    }
    to{
        transform: translateX(0);
    }
}
@keyframes form-btn {
    from{
       transform: translateX(250px);
    }
    to{
        transform: translateX(0);
    }
} */
/*======== FORM SECTION END =========*/
/*======== MIDDLE SECTION START =========*/
.middle-sec {
    padding-top: 60px;
    margin-bottom: 30px;
}

.middle-box1::before {
    content: '';
    position: absolute;
    width: 104%;
    height: 157%;
    background-repeat: no-repeat;
}

.middle-line::before {
    background-image: url(../images/line.webp);
    left: 255px;
    top: 1px;
}

.middle-box1::after {
    content: '';
    position: absolute;
    width: 104%;
    height: 157%;
    background-repeat: no-repeat;
}

.middle-line::after {
    background-image: url(../images/line.webp);
    left: 1px;
    top: 1px;
}

.middle-box1 {
    position: relative;
    left: 10px;
    margin-right: 60px;
}

.middle-box1 h6 {
    text-transform: uppercase;
    color: var(--tred);
    margin-left: 34px;
    font-weight: 500;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;
}

.middle-box1 h2 {
    font-size: 32px;
    font-weight: 700;
    padding-top: 10px;
}

.middle-box1 p {
    color: #707070;
    line-height: 27px;
    font-size: 15px;
    font-weight: 100;
    padding-bottom: 15px;
}

.ppp {
    display: flex;
}

.middle-icon {
    display: flex;
}

.m-icn1 img {
    width: 95%;
}

.m-icn2 h5 {
    font-size: 15px;
    font-weight: 550;
}

.m-icn2 p {
    font-size: 12px;
    line-height: 20px;
}

.middle-box2 img {
    width: 100%;
}

/*======== MIDDLE SECTION END =========*/
/*======== EXPERT SECTION START =========*/
.expert-sec {
    padding-top: 15px;
    margin-bottom: 50px;
}

.expert-rw1 {
    padding-bottom: 200px;
    padding-top: 50px;
    background-image: url(../images/map.webp), linear-gradient(rgb(0 0 0), #000000cf);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.expert-box::before {
    content: '';
    position: absolute;
    width: 104%;
    height: 157%;
    background-repeat: no-repeat;
}

.expert-box::before {
    background-image: url(../images/line.webp);
    left: 638px !important;
    top: 1px;
}

.expert-box::after {
    content: '';
    position: absolute;
    width: 104%;
    height: 157%;
    background-repeat: no-repeat;
}

.expert-box::after {
    background-image: url(../images/line.webp);
    left: 405px !important;
    top: 1px;
}

.expert-box {
    position: relative;
    left: 10px;
    margin-right: 60px;
}

.expert-box h6 {
    text-align: center;
    text-transform: uppercase;
    color: var(--tred);
    font-weight: 500;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;
}

.expert-box h3 {
    text-align: center;
    text-transform: uppercase;
    padding-top: 7px;
    font-size: 30px;
    font-weight: 500;
    color: white;
}

.expert-box p {
    font-size: 15px;
    text-align: center;
    padding-top: 5px;
    line-height: 24px;
    color: white;
    padding-right: 120px;
    padding-left: 120px;
}

.expert-rw2 {
    margin-top: -148px;
}

.exp-style {
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    box-shadow: 1px 4px 9px #808080a6;
    background-color: white;
    border-radius: 10px;
}

.exp-style:hover {
    padding-top: 50px;
    border: 2px solid var(--tred);
    transition: 0.5s ease-in-out;
}

.top-img {
    display: flex;
    justify-content: center;
}

.img img {
    width: 93%;
    margin-top: -42px;
}

.content {
    padding-top: 18px;
}

.content i {
    font-size: 12px;
    color: var(--tred);
}

.content h6 {
    font-size: 12px;
    font-weight: 600;
}

.exp-style p {
    padding-top: 25px;
    padding-bottom: 20px;
    font-size: 12px;
}

.exp-btn {
    text-align: center;
}

/*======== EXPERT SECTION END =========*/
/*======== PAYMENT SECTION START =========*/
.payment-sec {
    padding-top: 50px;
    margin-bottom: 30px;
}

.payment-box1 {
    margin-right: 40px;
}

.payment-box1 h3 {
    font-size: 35px;
    font-weight: 600;
    padding-bottom: 6px;
}

.payment-box1 p {
    font-size: 15px;
    line-height: 28px;
}

.payment-box2 {
    margin-left: 15px;
}

.payment-box2 img {
    width: 100%;
}

/*======== PAYMENT SECTION END =========*/
/*======== COUNTER SECTION END =========*/
.counter-sec {
    padding-top: 50px;
    margin-bottom: 30px;
}

.counter-rw {
    background-color: var(--tgrey);
    color: white;
    padding: 24px 83px;
}

.counter-box h2 {
    font-weight: 700;
    font-size: 36px;
    padding-bottom: 10px;
}

.counter-box p {
    font-size: 13px;
    border: 1px solid var(--tred);
    margin-right: 58px;
    text-align: center;
    padding: 5px 5px;
}

/*======== COUNTER SECTION END =========*/
/*======== SLIDER SECTION START =========*/
.slider-sec {
    margin-bottom: 30px;
}

.slick-next,
.slick-prev {
    top: 27%;
    width: 29px;
    height: 20px;
}

.slick-next:before {
    font-size: 32px;
    opacity: 1;
}

.slick-prev:before {
    font-size: 32px;
    opacity: 1;
}

.slider-box img {
    width: 70%;
}

.slider-box p {
    font-size: 14px;
    text-align: center;
    padding-right: 38px;
    text-transform: uppercase;
    padding-top: 20px;
}

.slick-prev:before {
    color: var(--tred);
}

.slick-next:before {
    color: var(--tred);
}

/*======== SLIDER SECTION END =========*/
/*======== SECOND CONTENT SECTION START =========*/
.Scontent-sec {
    padding-top: 30px;
    margin-bottom: 30px;
}

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

.Scontent-box2 h6 {
    text-transform: uppercase;
    color: var(--tred);
    margin-left: 34px;
    font-weight: 500;
}

.Scontent-box2::before {
    content: '';
    position: absolute;
    width: 5%;
    height: 157%;
    background-repeat: no-repeat;
}

.Scontent-box2::before {
    background-image: url(../images/line.webp);
    left: 255px;
    top: 1px;
}

.Scontent-box2::after {
    content: '';
    position: absolute;
    width: 104%;
    height: 5%;
    background-repeat: no-repeat;
}

.Scontent-box2::after {
    background-image: url(../images/line.webp);
    left: 1px;
    top: 1px;
}

.Scontent-box2 {
    position: relative;
    left: 10px;
    margin-right: 60px;
}

.Scontent-box2 h2 {
    font-size: 30px;
    padding-top: 4px;
    font-weight: bold;
    letter-spacing: 1px;
    font-family: roboto;
}

.Scontent-box2 h4 {
    color: var(--tred);
    font-size: 17px;
    font-weight: 700;
    padding-top: 18px;
}

.Scontent-box2 p {
    font-size: 12px;
}

.Scontent-btn {
    margin-top: 30px;
}

.btn_white_ {
    text-decoration: none;
    color: white;
    text-transform: uppercase;
    background-color: var(--tgrey);
    padding: 11px 45px;
    border-radius: 5px;
    font-size: 16px;
    letter-spacing: 1px;
    transition: 0.8s ease-in-out;
    margin-left: 15px;
    box-shadow: inset 0 0 0 0 var(--tgrey);
}

.btn_white_:hover {
    color: rgba(222, 144, 0, 0.971);
    font-weight: bold;
    box-shadow: inset 170px 0 0 0 white;
    border: 1px solid rgba(222, 144, 0, 0.971);
}

/*======== SECOND CONTENT SECTION END =========*/
/*======== OFFER SECTION START =========*/
.offer-sec {
    padding-top: 30px;

}

.offer-rw {
    background-image: url(../images/d5.webp);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.offer-box {
    color: white;
    margin-left: 60px;
    margin-top: 22px;
    margin-right: 250px;
}

.offer-box h6 {
    font-size: 15px;
    border: 1px solid rgb(155, 151, 151);
    margin-right: 344px;
    padding: 5px 6px;
    border-radius: 6px;
    box-shadow: 1px 4px 9px #808080a6;
}

.offer-box p {
    font-size: 15px;
    line-height: 25px;
}

.box2 {
    display: flex;

}

.box2 img {
    width: 12%;
    height: 14%;
}

.box2 p {
    font-size: 13px;
    margin-left: 15px
}

.calloffer-box {
    margin-left: -11px;
    margin-bottom: -55px;
}

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

.call-icon1 {
    width: 10% !important;
}

.call-icon1 {
    position: relative;
    left: 179px;
    top: -65px;
}

.icon1 {
    position: relative;
    left: 215px;
    top: -102px;
    font-size: 12px;
    color: white;
}

/*======== OFFER SECTION END =========*/
/*======== PARTNERS SECTION START =========*/
.partners-sec {
    padding-top: 50px;
    margin-bottom: 30px;
}

.partners-box2 img {
    width: 100%;
}

.partners-box1 {
    padding-top: 25px;
    padding-bottom: 25px;
    margin-right: 30px;
}

.partners-box1 h3 {
    font-size: 37px;
    font-weight: 700;
    padding-bottom: 14px;
}

.partners-box1 p {
    font-size: 15px;
    line-height: 29px;
    padding-bottom: 24px;
}

.partners-box1 img {
    width: 85%;
}

/*======== PARTNERS SECTION END=========*/
/*======== COMMENT SLIDER SECTION START=========*/
.comment-sec {
    margin-top: 50px;
    margin-bottom: 30px;
}

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

.comment-rw {
    background-image: url(../images/d9.png), linear-gradient(#1C1C27, #1C1C27);
    background-blend-mode: overlay;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.comment-box {
    padding: 72px 63px;
    padding-right: 0px;

}

.comment-box::before {
    content: '';
    position: absolute;
    width: 104%;
    height: 157%;
    background-repeat: no-repeat;
}

.comment-box::before {
    background-image: url(../images/line.webp);
    left: 311px;
    top: 73px;
}

.comment-box::after {
    content: '';
    position: absolute;
    width: 104%;
    height: 157%;
    background-repeat: no-repeat;
}

.comment-box::after {
    background-image: url(../images/line.webp);
    left: 70px;
    top: 73px;
}

.comment-box {
    position: relative;
}

.comment-box h6 {
    text-transform: uppercase;
    color: var(--tred);
    margin-left: 34px;
    font-weight: 500;
    animation: fadein 5s;
    -moz-animation: fadein 5s;
    -webkit-animation: fadein 5s;
    -o-animation: fadein 5s;
}

.comment-box h4 {
    font-size: 30px;
    padding-top: 25px;
    color: white;
    font-weight: 750;

}

.comment-box h4>span {
    font-size: 30px;
    padding-top: 25px;
    color: var(--tred);
    font-weight: 750;
}

.comment-box p {
    color: white;
}

.brand-btn {
    padding-top: 25px;
}

.Cslider-box {
    margin-top: 45px;
    margin-bottom: -32px;
}

.Cslider-box img {
    width: 78% !important;
    margin-bottom: 19px;
    margin-left: 10px;
    transition: 0.5s ease-in-out;
}

.Cslider-box1 {
    background-image: url(../images/B-icon1.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin: 81px 35px;
    padding: 43px 39px;
}

.image2 {
    background-image: url(../images/B-icon2.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin: 81px 35px;
    padding: 43px 39px;
}

.image3 {
    background-image: url(../images/B-icon3.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin: 81px 35px;
    padding: 43px 39px;
}

.image4 {
    background-image: url(../images/B-icon4.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin: 81px 35px;
    padding: 43px 39px;
}

.image5 {
    background-image: url(../images/B-icon5.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin: 81px 35px;
    padding: 43px 39px;
}

.Cslider-box1>p>i {
    font-size: 14px;
}

.Cslider-box1 p {
    font-size: 13px;
    line-height: 22px;
}

.Cslider-box1 h6 {
    font-size: 21px;
    padding-bottom: 20px;
}

.Cslider-box {
    display: block !important;
}

.Cslider-box img {
    float: none !important;
}

.Cslider-box img:hover {
    border: 2px solid var(--tred);
    border-radius: 50px;
    width: 85% !important;
}

.Cslider-box .slick-track {
    width: 76px !important;
    transform: translate3d(-36px, 0px, 0px) !important;
    margin-bottom: -552px !important;
}

.Cslider-box .slick-slide {
    overflow: hidden !important;
}

/*======== COMMENT SLIDER SECTION END=========*/
/*======== TOOLS SECTION START=========*/
.tools-sec {
    padding-top: 50px;
    margin-bottom: 30px;
}

.tools-box2 img {
    width: 100%;
}

.tools-box1 {
    padding-top: 20px;
    margin-right: 20px;
}

.tools-box1 h3 {
    font-size: 35px;
    font-weight: 600;
}

.tools-box1 p {
    font-size: 15px;
    line-height: 27px;
}

/*======== TOOLS SECTION END=========*/
/*======== FOOTER SECTION START=========*/
.footer-sec {
    margin-top: 50px;
    padding-top: 60px;
    padding-bottom: 50px;
    color: white;
    background-color: var(--tgrey);
}

.footer-box1 {
    padding-right: 39px;
}

.footer-box1 h2 {
    font-size: 35px;
    font-weight: 100;
    padding-bottom: 20px;
    text-transform: uppercase;
}

.footer-box1 p {
    font-size: 13px;
    line-height: 25px;
}

.footer-box2 {
    padding-left: 20px;
}

.footer-box2 h4 {
    padding-bottom: 20px;
    font-size: 25px;
    letter-spacing: 1px;
    font-weight: 500;
}

.footer-box2>a {
    text-decoration: none;
}

.footer-box2>a>p {
    color: white;
    font-size: 16px;
    font-weight: 600;
    line-height: 25px;
}

.bi {
    color: #DE302E;
    font-size: 21px;
}

.footer-box2 .icn1 {
    color: var(--tred);
    font-size: 20px;
}

.footer-box2>a>p:hover {
    color: var(--tred);
}

.footer-box2 .icn2>p {
    display: flex;
}

.footer-box2 .icn2>p>a>i {
    color: var(--tgrey);
    font-size: 15px;
    border: 1px solid var(--tred);
    border-radius: 50px;
    background-color: var(--tred);
    margin: 3px;
    padding: 5px;
}

.footer-box2 .icn2>p>a>i:hover {
    color: var(--tred);
    border: 1px solid var(--tred);
    background-color: var(--tgrey);
}

.footer {
    background-color: var(--tred);
    color: white;

}

.footer-cl2 p {
    font-size: 12px;
    padding-top: 9px;
}

.p>p {
    text-align: right;
}

/*======== FOOTER SECTION END=========*/
/*======== POP-UP SECTION START=========*/
.popup-content {
    background-image: url(../images/map.webp), linear-gradient(rgb(0 0 0), #000000cf);
    background-repeat: no-repeat;
    background-size: cover;
}

.popup-header h5 {
    margin-left: 78px;
    color: white;
    font-weight: 600;
    font-size: 26px;
}

.popup-body::before {
    content: '';
    position: absolute;
    width: 38%;
    height: 94%;
    background-repeat: no-repeat;
}

.popup-content .modal-content {
    width: 103%;
}

.popup-body::before {
    background-image: url(../images/popup.png);
    left: 301px;
    top: 48px;
}


.popup-body {
    position: relative;
}

.form-popup {
    width: 67%;
    margin-top: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
}

.form-popup input::placeholder {
    color: black;
    font-size: 14px;
    font-weight: 400;
    padding-left: 10px;
}

.form-popup>input {
    width: 87%;
    height: 47px;
    border-radius: 6px;
    margin-bottom: 20px;
}

.popup-btn {
    text-decoration: none;
    width: 87%;
    color: white;
    border: none;
    text-transform: uppercase;
    background-color: var(--tred);
    padding: 14px 20px;
    border-radius: 8px;
    font-size: 14px;
    transition: 0.8s ease-in-out;
    box-shadow: inset 0 0 0 0 white;
}

.popup-btn:hover {
    color: var(--tred);
    border: 2px solid var(--tred);
    font-weight: 700;
    box-shadow: inset 270px 0 0 0 white;
}

/*======== POP-UP SECTION END=========*/