*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

:root{
    --mid-header:#feffdf;
    --theme-color:#668ba4;
    --theme-green:#97cba9; 
    --theme-yellow:#97cba9; 
    --heading-color:#3b2b2bc9;
    --bg-color:#97cba98c;
}

p{margin-bottom: 0 !important;}
h1, h2 ,h3 ,h4, h5{margin-bottom: 0 !important;}
a{text-decoration: none !important;}
ul{list-style: none; padding-left: 0 !important; margin-bottom: 0!important;}
.heading{margin-bottom: 40px; position: relative; display:block; }


.fourtc-top-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 0;
}
.logo {
    width: 200px;
}
.logo img {
    width: 100%;
}
.fourtc_contact_detail{display: flex;}
.fourtc_contact_detail p:first-child{margin-right: 30px;}

.fourtc-main-menu ul{display: flex;}
.fourtc_mid_header{display: flex; align-items: center; justify-content: space-between; background: linear-gradient(120deg, #d62f43, #e4233a, #f54639, #f5765b, #f58256); padding: 15px 30px; margin-bottom: -30px; z-index: 12; position: relative; border-radius: 8px;}
.fourtc-main-menu ul li{margin-right: 40px;}
.fourtc-main-menu ul li a{color: #fff; font-weight: 700;}
.fourtc_social_icons a{color: #fff; margin-left: 30px; font-size: 20px;}
.fourtc_social_icons {display: flex;}
.fourtc_contact_detail p a{ color: #868686; font-size: 18px; font-weight: 600;}
.fourtc_contact_detail p a svg{margin-right: 6px;}

.banner,.inner_banner{position: relative;}
.banner_inner{position: relative;}
.banner_inner:after{position: absolute; content: ""; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; background: #00000099;}
.banner_inner img{ width: 100%; height: 100%; object-fit: cover;}
.img-banner {height: 450px;}
.banner_text{position: absolute; top: 50%; width: 540px; z-index: 1; transform: translate(-50% , -50%);
    left: 50%;
    text-align: center;}
.banner_text span{background: rgba(255, 255, 255, 0.1); padding: 13px 20px; border-radius: 10px; margin-bottom: 20px; display: inline-block; color: #fff; font-size: 20px; font-weight: 700;}
.banner_text h3 {
    color: #fff;
    font-weight: 800;
    font-size: 50px;
}

.banner_btns{margin-top: 30px;}
.banner_btns a{display: inline-block;
    padding: 10px 30px;
    background: #fff;
    color: #000;
    
    border: 1px solid #ffff;
    border-radius: 30px;
    font-weight: 700; margin-right: 5px;}
    .banner_btns a:last-child{background: #f55644; margin-right: 0; color: #fff;}
    .fourtc_service-row .service_col{
        width: 33.33%;
        border: 1px solid #f55644;
        text-align: center;
    padding: 30px 20px;
    }
    .service_name {
        font-size: 22px;
        font-weight: 600;
    }

    .ico_service svg{font-size: 40px; color: #f55644;}
    .ico_service{margin-bottom: 20px;}
    .service_col:nth-child(1),.service_col:nth-child(2),.service_col:nth-child(3){border-bottom: 0;}
    .service_col:nth-child(1),.service_col:nth-child(2),.service_col:nth-child(4),.service_col:nth-child(5){border-right: 0;}
    .about_t-in {
        display: flex;
    }
    .content_t-in {
        width: 70%;
        background: #f55644bf;
    }
    .content_iE {
        width: 600px;
        padding-left: 40px;
    }
    .iE_image {
        width: calc(30% + 100px);
        margin-left: -100px;
        margin-bottom: -50px;
        margin-top: 50px;
    }
    .iE_image img{width: 100%;     box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;
        border-radius: 10px;}
        .content_iE p {
            text-align: justify;
            line-height: 1.7;
            color: #fff;
            font-size: 1.1rem;
        }

        section.about_t.pt-5 {
            padding-bottom: 100px;
        }
        .content_iE h4 {
            margin-bottom: 30px !important;
            font-weight: 600 !important;
            color: #fff;
        }

        .p60 {
            padding: 60px 0px;
        }

        .content_iE h3 {
            text-transform: uppercase;
            font-weight: 700 !important;
            text-shadow: 1px 3px 3px rgb(62 62 62);
            color: #fff;
            font-size: 44px !important;
        }
        .col_portfolio{width: 33.33% !important;}
        .image_portfolio{position: relative; }

        .portfolio_main{position: absolute; width: 92%; top: 5%;
            left: 4%;
            background-size: 100% , cover;
            background-position: top center;
            padding-top: 51.2%;     background-attachment: scroll;
            transition: background 4s;}
           .portfolio_main:hover{background-attachment: scroll; background-position:bottom center ;}
        .portfolio_image_main img{width:100%;}

        .image_portfolio:hover{transition: 0.5s ease; transform: scale(1.03);}
        .image_portfolio{overflow: hidden;}
        section.sec_portfolio {
            background: linear-gradient(120deg, #d62f43, #e4233a, #f54639, #f5765b, #f58256);
            padding: 50px 0;
        }

        .heading.heading_portfolio h3 {
            color: #fff;
            font-weight: 800;
            font-size: 40px;
        }

        .heading.heading_portfolio span {
            color: #fff;
            font-size: 20px;
            text-transform: uppercase;
            font-weight: 500;
        }

        .logo h2{font-size: 30px;
            font-weight: 800;
            color: #d82e42;
            text-shadow: 0px 2px 3px #cc1a1abd;}

            .services_section{background: #f5f5f5;}
            .need_text{margin-right: 50px;}
            .need_text h3{    font-size: 40px;
                font-weight: 700;
                text-transform: uppercase; color: #db2b40;
                text-shadow: 0px 2px 3px black;}

                .btns_need a{font-size: 20px; font-weight: 700; text-transform: uppercase; color: #000; background: #f54639; padding: 10px 40px; border-radius: 40px; border: 2px solid #d62f43; color: #fff;}

                .need_sec{background: #f5f5f5; padding: 80px 0 !important;}

                footer{background: #222;}

                footer h3, footer h2 , footer p , footer div ,footer a{color: #fff;}

                footer h3, footer h2{margin-bottom: 20px !important; font-weight: 700;}

                footer ul li{line-height: 2;}
                .footer_icon{margin-top: 20px;}
                .footer_icon .fourtc_social_icons a:first-child{margin-left: 0;}
                footer p, footer a , footer li ,.short_desc {
                    opacity: 0.7;
                }

                .end_footer{border-top:1px solid #7a7a7a; background: #313131;}
                .end_footer p{color: #fff; text-align: center; opacity: 0.7;}

                .services_section h3{    font-size: 38px;
                    color: #d72e42;
                    font-weight: 700;
                    text-shadow: 0px 2px 2px black; position: relative; display: inline-block;}

                    .services_section h3:before{
                            content: "O";
                            position: absolute;
                            left: -55px;
                            font-size: 125px;
                            opacity: 0.1;
                            font-weight: 500;
                            top: -70px;
                    }
                    .heading_iE{display: inline-block; position: relative;}
                    .heading_iE::before{     content: "A";
                        position: absolute;
                        left: -38px;
                        font-size: 125px;
                        opacity: 0.1;
                        font-weight: 500;
                        top: -75px;}
                    .services_section{text-align: center;}

                    .heading_portfolio h3{position: relative;}
                    .heading_portfolio h3:before{position: absolute; content: "L";
                        position: absolute;
                        left: -55px;
                        font-size: 125px;
                        opacity: 0.1;
                        font-weight: 500;
                        top: -75px;}
.banner_inner_page img{width: 100%; height: 100%; object-fit: cover;}
.banner_inner_page .img-banner{height: 200px;}

.fields label ,.fields_area label{display: block; padding-bottom: 10px; color: #fff; font-weight: 700;}
.form_in{display: flex; flex-wrap: wrap; justify-content: space-between;}
.fields{width: calc(50% - 10px); margin-bottom: 20px;}
.fields input{width: 100% ; outline: none; padding: 10px;}
.fields_area{width: 100%;}
.fields_area textarea{width: 100%; height:120px;}
.form_input {
    padding: 20px;
    background: #ed353a;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.button_query{text-align: center; margin: 30px 0;}

.button_query button{border:2px solid #fff; background: none; color: #fff; width: 200px; padding:10px 0; border-radius: 8px; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
.text_contact_form h2{    font-weight: 700;
    background: #ffffff29;
    padding: 10px 20px;
    display: inline-block;
    border-radius: 6px;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}

    .text_contact_form{text-align: center;}

    .contact_detail_in {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
    }

    .contact_detail_in .icon_c{margin-right: 20px; width: 65px;
        height: 65px;
        background: linear-gradient(120deg, #d62f43, #e4233a, #f54639, #f5765b, #f58256);
        display: grid;
        place-items: center;
        border-radius: 50%;}

    .contact_details{margin-top: 35px;}

    .contact_detail_in .icon_c svg{font-size: 30px; color: #fff;}

    .fourtcget_in_main{margin-top: 100px;}
.get_in_touch_head h2{
    font-weight: 700;
    color: #f13e39;
    text-shadow: 2px 2px 3px black;
    font-size: 45px;
    position: relative;
}
.get_in_touch_head span{
    font-size: 22px;
    font-weight: 700;
}

.contact_txt h3{    font-size: 24px;
    font-weight: 800;}

    .get_in_touch_head h2:before{position: absolute; content: "F";
        position: absolute;
        left: -55px;
        font-size: 125px;
        opacity: 0.1;
        font-weight: 500;
        top: -75px;}

        .services_inner{display: flex;
           
            width: 90%;
            justify-content: space-between;
            margin: 0 auto 40px; position: relative;}
            .services_inner .sno { font-size: 70px; align-items: flex-start; margin-right: 20px; margin-top: -30px; font-weight: 800; opacity: 0.2; font-style: oblique; }
            .service_main_txt h3{margin-bottom: 10px !important;     font-size: 24px;
                font-weight: 800;
                color: #000;}

                .btn_contact_serv_fourtc {
                    margin-top: 15px;
                }

                .services_inner_line{position: relative;}
                .btn_contact_serv_fourtc a{background: #f13e39; display: inline-block; padding: 8px 30px; color: #fff;}

                .services_inner_line:before{position: absolute; content: ""; right: -30px; width: 2px; background: #ddd; height: 180px;}
                .heading_inner_pg{
                    background: #d6cfcfa3;
                    padding: 50px;
                }
              
                .heading_inner_pg h3{position: relative; font-size: 33px; font-weight: 700; display: inline-block;}

                .heading_inner_pg h3:before{position: absolute; content: "W";
                    position: absolute;
                    left: -55px;
                    font-size: 125px;
                    opacity: 0.1;
                    font-weight: 500;
                    top: -75px;}

                    .heading_abt h3{position: relative;}
                    .heading_abt h3:before{position: absolute; content: "A";
                        position: absolute;
                        left: -55px;
                        font-size: 125px;
                        opacity: 0.1;
                        font-weight: 500;
                        top: -75px;}
                       .about_content_pg .heading_abt span{
                        font-size: 20px;
    font-weight: 700;
    color: #d72f43;}
    
    .about_content_pg .heading_abt h4{
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 15px !important;
    }

    .fourtcVM {
        display: flex;
        padding: 20px;
    }

    .vision_sec {
        width: 50%;
        padding: 30px;
        border: 1px solid #d72e42;
        background: #d72e42;
        border-top-left-radius: 8px;
        border-bottom-left-radius: 8px;
    }

    .mission_sec {
        width: 50%;
        padding: 30px;
        border: 1px solid #d72e42;
        border-top-right-radius: 8px;
        border-bottom-right-radius: 8px;
    }

    .vision_inner{color: #fff;}
    .vision_inner h3{margin-bottom: 15px !important; font-weight: 800;}
    .mission_inner h3{margin-bottom: 15px !important; font-weight: 800;}

    .sec_vm_fourtc {background: #f0f0f0}

    .heading_prflio h3{position: relative;}
    .heading_prflio h3:before{position: absolute; content: "P";
        position: absolute;
        left: -55px;
        font-size: 125px;
        opacity: 0.1;
        font-weight: 500;
        top: -75px;}

        .inner_proj_fourtc .image_portfolio {
            overflow: hidden;
            border-radius: 8px;
            margin-bottom: 20px;
        }
        .title_fortc_proj{
        text-align: center;
    padding: 10px 0;
    background: #747474;
    color: #fff;
    margin-top: 20p;
    border-top: 1px solid #767272;
        }

        .title_fortc_proj a{ color: #fff; font-weight: 700;
            text-transform: uppercase;}

            .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
                content: '\279C' !important;
                width: 50px;
    height: 50px;
    border: 1px solid #fff;
    color: #fff;
    font-size: 25px !important;
    display: grid;
    place-items: center;
    padding: 0 11px;
    border-radius: 50%;
    right: 15px;
    position: absolute;
    background: #f55644;
            }

            .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after{
                content: '\279C' !important;
                transform: rotate(180deg);
                width: 50px;
    height: 50px;
    border: 1px solid #fff;
    color: #fff;
    font-size: 25px !important;
    display: grid;
    place-items: center;
    padding: 0 11px;
    border-radius: 50%;
    left: 15px;
    position: absolute;
    background: #f55644;

            }

            .swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{top: unset !important; bottom: 0;}
            .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
                background: #f55644 !important;
            }

            .hamburgerMenu.fourtc{width: 40px; display: none;}

            .hamburgerMenu.fourtc span{ margin-bottom: 8px; width: 100%; height: 4px; background: #ffffff; display: block; transition: 0.5s ease;}

            .hamburgerMenu.fourtc span:nth-child(2){width: 90%;}
            .hamburgerMenu.fourtc span:nth-child(3){width: 80%; margin-bottom: 0;}

            .activemenu .hamburgerMenu.fourtc span:nth-child(2){opacity: 0;}
            .activemenu .hamburgerMenu.fourtc span:nth-child(1){position: relative; transform: rotate(45deg); top: 14px;}
            .activemenu .hamburgerMenu.fourtc span:nth-child(3){position: relative; transform: rotate(-45deg); bottom: 10px; width: 100%;}
            @media (max-width:991px){
                .about_t-in{flex-direction: column;}
                .content_iE{width: 100%; padding: 20px;}
                .content_t-in{width: 100%; }
                .iE_image {
                    width: 100%;
                    margin-left: 0;
                    margin-bottom: -50px;
                    margin-top: 0;
                }
                .iE_image img{border-radius: 0;}
                .fourtc_service-row .service_col{width: 100%;}
                .service_col:nth-child(1), .service_col:nth-child(2), .service_col:nth-child(4), .service_col:nth-child(5){border-right:1px solid #f55644}
                .service_col:nth-child(1), .service_col:nth-child(2), .service_col:nth-child(3){border-bottom: 1px solid;}
                .need_text h3{font-size: 28px;}

                .need_sec .d-flex{flex-direction: column;}

                .btns_need {
                    width: 100%;
                    text-align: center;
                }
                .btns_need a{display: block; margin-top: 20px;}
                .need_text{margin-right: 0; text-align: center;}
                .need_sec{padding: 40px 0 !important;}
                .col_portfolio{width: 100% !important;}
                .portfolio_image_main {
                    margin-bottom: 20px;
                }

                .fourtc-main-menu ul{display: block;}
                .fourtc-main-menu { position: fixed;
                   
                    left: 0;
                   right: 0;
                   background: #000;
                   padding: 20px 0; 
                    bottom: 0;}
                .fourtc_mid_header{flex-direction: row-reverse;}
               
                .fourtc-main-menu ul li{padding-bottom: 20px;}
                .hamburgerMenu.fourtc{display: block;}

                .fourtc-main-menu {
                    position: absolute;
                    left: -100%;
                    right: 0;
                    padding: 0px 0;
                    /* bottom: 0; */
                    top: 100%;
                    transform: translateX(-100%);
                    text-align: center;
                   transition: 0.5s ease;
                }
                .fourtc-main-menu ul{ background: #000;     padding: 20px 0;}

                .activemenu .fourtc-main-menu{left: 0; transform: translateX(0);}
                .fourtc_contact_detail p a span{display: none;}
                .banner_text{width: 60%;}
                .heading_abt {
                    margin-top: 20px;
                }
                .services_inner_line:before{display: none;}
                .col_p-in{width: 50% !important;}
                .col_p-in .portfolio_image_main{margin-bottom: 0;}
                .title_fortc_proj a{font-size: 19px;}
                .fourtcget_in_main {
                    margin-top: 30px;
                    margin-bottom: 30px;
                }
            }
            @media (max-width:767px){
                .fourtcVM{flex-direction: column;}
                .vision_sec{width: 100%; border-top-left-radius:0; border-bottom-left-radius:0;}
                .mission_sec{width: 100%; border-top-right-radius:0; border-bottom-right-radius:0;}
                .img-banner{height: 360px;}
                .banner_text{width: 80%;}
                .colum_footer_about {
                    margin-bottom: 20px;
                }
                .services_section h3{font-size: 26px;}
                .service_name{font-size: 20px;}
                .content_iE h3{font-size: 38px;}
            }
            @media (max-width:580px){
                .col_p-in{width: 100% !important;}
                .form_in{flex-direction: column;}
                .fields{width: 100%;}
                .banner_text h3{font-size: 30px;}
                .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after{left: 0px;}
                .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{right: 0px;}
                .banner_text {
                    width: 90%;
                }
            }

            @media(max-width:380px){
                .banner_text h3{font-size: 23px;}
                .banner_text{width: 85%;}
                .banner_text span{font-size: 16px;}
            }