:root {
    --black: #000000;
    --fadeblue: #18254a;
    --red: red;
    --wihite: #fff;
    --deepwhite: #ffffff;
    --cyano: #007a9f;
    --blue: #002259;
    --body-back-color-1: #007a9f0a;
    --body-back-color-2: #00225912;
    --body-back-color-3: rgb(240 242 255);

    --sans-serif: Arial, Helvetica, sans-serif;
    /* --font-family-1: popins;
    --font-family-2: roboto; */

    --font-sz22: 22px;
    --font-sz21: 21px;
    --font-sz23: 23px;
    --font-sz15: 15px;
    --font-sz16: 16px;
    --font-sz17: 17px;
    --font-sz18: 18px;
    --font-sz19: 19px;
    --font-sz20: 20px;
    --font-sz13: 13px;
}

@media (max-width: 768px) {
    .main-heading h2 {
        color: var(--blue);
        text-align: center;
        font-weight: 600;
        font-family: serif;
        font-size: 20px;
    }
}

/************************************ HEADER  SECTION  *****************************************/
@media (min-width: 992px) and (max-width: 1260px) {
    .navbar_top_header li a {
        text-decoration: none;
        font-size: 14px !important;
        transition: 0.3s ease;
    }
}

@media (min-width: 992px) {
    .nav-toggle {
        display: none !important;
    }

}

@media (max-width: 992px) {
    .remove_sideBar {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        position: absolute;
        top: 53px;
        left: 0;
        height: 100vh;
        width: 300px;
        background-color: var(--white);
        box-shadow: 0 40px 60px rgba(0, 0, 0, 0.1);
        transition: 0.7s;
        opacity: 0;
        visibility: hidden;
    }
    #navbar li {
        margin-bottom: 15px;
    }
    #navbar {
        /* background-color: rgb(0 34 89);
        color: var(--deepwhite); */
        height: 100vh;
        width: 70%;
        z-index: 999;
    }

    #close {
        display: initial;
        position: absolute;
        top: 30px;
        left: 30px;
        color: var(--dark);
        font-size: 24px;
    }

    #lg-bag {
        display: none;
    }
    #about_section .content-heading h2 {
        font-weight: 600;
        font-size: var(--font-sz18);
        color: var(--blue);
        /* font-family: serif; */
    }
    .topheadericon {
        display: none;
    }
}

@media (max-width: 768px) {
    .active_sideBar {
        /* display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        position: fixed;
        top: 66px;
        right: 4px !important;
        height: 100vh;
        width: 45%;
        background-color: #007a9ff0 !important;
        box-shadow: 0 40px 60px rgba(0, 0, 0, 0.1);

        transition: 0.3s; */

        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        position: fixed;
        top: 50px;
        left: 0;
        height: 100vh;
        width: 300px;
        background-color: var(--white);
        box-shadow: 0 40px 60px rgba(0, 0, 0, 0.1);
        transition: 0.9s;
        opacity: 1;
        visibility: visible;
    }

    #header .searchbox {
        display: none;
    }

    #header {
        padding: 0px 4px !important;
        /* background-color: var(--blue); */
    }

    .inner-header {
        list-style: none;
        position: relative;
        top: 9px;
        right: 10px;
    }
    /* #header {
        display: none !important;
    } */
}

@media (min-width: 768px) {
    .active_sideBar {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        position: fixed;
        top: 80px;
        right: 4px !important;
        height: 100vh;
        width: 40%;
        background-color: #007a9ff0 !important;
        box-shadow: 0 40px 60px rgba(0, 0, 0, 0.1);
        /* padding: 80px 0 0 10px; */
        transition: 0.3s;
        /* margin-top: 63px !important; */
    }

    .navbar_top_header {
        display: flex;
        align-items: center;
        justify-content: end;
        /* margin-top: 9px; */
    }
}

/*********************************** js-counter SECTION***************************** */

/* @media (min-width: 1281px) and (max-width: 1800px) {
    .large-section {
        max-width: 1400px;
    }
} */

@media (min-width: 1800px) {
    .large-section {
        max-width: 1800px;
    }
    #js-counter .counter {
        width: 300px !important;
    }
}
@media (max-width: 281px) {
    #js-counter .container .row .col-6 {
        max-width: 100% !important;
    }
}

/*********************************** Price SECTION***************************** */

@media only screen and (max-width: 990px) {
    .pricingTable {
        margin: 0 15px 40px;
    }
}

@media (max-width: 768px) {
    #price .container {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
}

/* SMART BUSINESS SECTION START ****************   */
/* @media (max-width: 768px) {
    .smarter-bussiness h3 {
        color: var(--blue);
        font-weight: 600;
        font-size: var(--font-sz20);
    }
} */

/* TESTIMONIAL SECTION CSS  */
@media only screen and (max-width: 480px) {
    .testimonial-review img {
        margin-left: 15px;
        margin-right: 10px;
    }
}

@media (max-width: 768px) {
    #testimonial {
        padding-bottom: 40px !important;
    }
}

/* Our Superfast Website Features START SECTION START */

@media (min-width: 1290px) {
    #intresting-section .row_1 {
        padding-bottom: 20px !important;
    }
    #intresting-section .row_3 {
        padding-top: 20px !important;
    }
}

/* FOOTER SECTION CSS  */

@media (min-width: 576px) and (max-width: 768px) {
    .sticky_footer_a {
        color: white;
        /* font-size:30px; */
    }
}

@media (max-width: 768px) {
    .sticky_footer {
        position: fixed;
        /* left: -4px !important; */
        bottom: 0;
        width: 100%;
        /* height: 55px; */
        z-index: 9999;
    }
    .footer_ulMain {
        background-color: #007a9f;
        position: relative;
    }
    .sticky_footer_icon {
        font-size: 20px;
        color: #fff !important;
    }
    .sticky_footer_h6 {
        font-size: 14px;
        /* font-weight: bold; */
        /* margin-top: -12px; */
        color: #000000 !important;
    }
}

/* CONTACT SECTION CSS START ******************** */
@media (min-width: 992px) {
    .contact_card_two {
        position: relative;
        right: 35px;
    }

    .contact_card_one {
        border-radius: 30px;
        margin-left: 117px;
        box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
        width: 80% !important;
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    }
}

@media (min-width: 1024px) and (max-width: 1280px) {
    .contact_card {
        border-radius: 10px;
        width: 337px !important;
        height: 450px !important;
        margin-left: -130px;
    }

    .contact_card_one {
        border-radius: 30px;
        margin-left: 130px !important;
        box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
        width: 80% !important;
        box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
    }
}

@media (min-width: 1280px) {
    .contact_card {
        border-radius: 10px;
        width: 400px !important;
        height: 450px !important;
        margin-left: -150px;
    }

    .contact_card_one {
        border-radius: 30px;
        margin-left: 130px !important;
        box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
        width: 80% !important;
        box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
    }
}

@media (min-width: 576px) and (max-width: 768px) {
    .contact_card_one {
        border-radius: 30px;
        margin-left: 0px;
        width: 100%;
    }

    .contact_card_two {
        height: 450px;
        width: 100%;
        margin-left: 0px;
    }
}

@media (max-width: 576px) {
    .contact_card_one {
        border-radius: 30px;
        margin-left: 0px;
        width: 100%;
        margin-bottom: 35%;
    }
    .contact_card {
        border-radius: 10px;
        width: 100%;
        height: auto;
        margin-left: 0px;
    }

    .contact_icon {
        font-size: 17px;
    }
    .contact_card_two {
        /* height: 450px; */
        width: 100%;
        margin-left: 0px;
    }
}

@media (min-width: 1919px) {
    .contact_card_one {
        width: 53%;
    }
}

/* *************************  PROFILE CSS START *********************** */

@media (min-width: 992px) {
    .profile-dropdown {
        width: 340px;
        transform: translate3d(149px, 45px, 0px) !important;
        top: 0px;
        left: 0px;
    }

    .profile-dropdown .profile-details p {
        /* font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
            Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
            sans-serif; */
        font-size: var(--font-sz15);
        font-weight: 600;
    }
}

@media (max-width: 922px) and (min-width: 768px) {
    .profile-dropdown {
        width: 340px;
        transform: translate3d(-142px, 62px, -2px) !important;
        top: 0px !important;
        left: 60px !important;
    }
}

@media (max-width: 767px) {
    .profile-dropdown {
        width: 340px;
        transform: translate3d(-140px, 62px, -2px) !important;
        top: 0px !important;
        left: 60px !important;
    }
}

/* WHY US SESCTION ********************   */

@media (max-width: 992px) {
    #webszetWhyus-main {
        margin-bottom: 60px !important;
    }
}

/* OUR SERVICE SECTION ***********************   */

@media (max-width: 992px) {
    .round {
        position: absolute;
        left: 14px;
        top: 80px;
        width: 300px !important;
        height: 300px !important;
        border: 2px dotted #a733bb;
        border-radius: 100%;
    }
    .contentCircle {
        width: 250px;
        border-radius: 100%;
        color: #222222;
        position: relative;
        top: 125px;
        left: 32%;
        transform: translate(-50%, -50%);
    }
    .dotCircle {
        display: none;
    }
    .holderCircle {
        margin: 0;
    }

    .contentCircle .CirItem i {
        font-size: 142px;
        position: absolute;
        top: 13px;
        left: 57%;
        margin-left: -90px;
        color: #000000;
        opacity: 0.1;
    }
}

/* WHAT WE DO ABOUT PAGE CSS STRAT ********   */
@media (max-width: 992px) {
    #about_what_we_do .sub-heading {
        font-size: var(--font-sz18);
        font-weight: 600;
    }
}

@media (max-width: 992px) {
    #abou_blog_section .vedio_classs_a {
        font-size: var(--font-sz20);
    }
}
