@media screen and (max-width: 700px) {
    /* Scroll bar */
    /* Width */
    ::-webkit-scrollbar {
        width: 5px;
    }

    /* Track */
    ::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    /* Handle */
    ::-webkit-scrollbar-thumb {
        background: white;
    }

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: white;
    }

    .text_logo {
        position: relative;
        display: inline-block;
        vertical-align: top;
        top: 2px;
        font-size: 25px;
    }

    header {
        /*width: 100%;*/
        padding: 3px;
        position: sticky;
        top: 0;
        z-index: 22;
        height: 82px;
        box-shadow: 0px 0px 10px 0px #00000026;
        overflow: unset;
        display: block;
    }

    header .logo h3 {
        margin: 21px 21px;
    }

    header .logo img {
        width: 225px;
        height: auto;
        margin: -14px 0 0;
    }

    .mobile_home {
        display: block;
        position: absolute;
        top: 6px;
        right: 14px;
        padding: 10px;
        font-size: 40px;
        font-weight: 800;
        color: white;
    }

    header .head_txt {
        display: none;
        position: absolute;
        width: 73%;
        z-index: 9;
        background: #4c54af;
        border: 3px solid white;
        padding: 50px 41px;
        text-align: center;
        left: 50%;
        transform: translate(-50%);
        border-radius: 20px;
        overflow: auto;
    }

    .mobile_close {
        display: block;
    }

    .add_height {
        height: 480px !important;
        transition: 0.3s;
    }

    .main img {
        width: 100%;
        position: absolute;
        top: 0;
        height: 100%;
        left: 0;
    }

    header .head_txt h3 {
        margin: 10px;
        font-weight: 500;
        padding: 14px 41px;
        cursor: pointer;
        font-size: 17px;
        letter-spacing: -0.4px;
    }

    .main .main_txt p {
        font-size: 15px;
        font-weight: 500;
        margin: 41px 8px;
    }

    .display_flex {
        display: block;
        padding: 40px 6px;
        text-align: justify;
    }

    .side1,
    .side2 {
        width: 100%;
        padding: 0;
        text-align: center;
        margin: 0;
    }

    .side2 h1 {
        font-weight: 600;
        text-align: center;
        font-size: 37px;
        text-transform: capitalize;
    }

    .side2 h3 {
        font-size: 15px;
        line-height: 1.6;
        font-weight: 500;
        margin: 12px;
        text-align: center;
    }

    .side1 img {
        width: 113px;
        height: 209px;
    }

    #imgd2 {
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        box-shadow: 0px 0px 20px 0px #524f4f8c;
        top: 38px;
    }

    .row_backimg {
        background: linear-gradient(0deg, white, #2196F3, #16a1a9, #ffffff);
        padding: 50px 13px;
        overflow: hidden;
        text-align: center;
    }

    .row_backimg .flex_box {
        display: block;
    }

    .row_features h1 {
        text-align: center;
        font-size: 30px;
        font-weight: 600;
        margin: 0 auto;
    }

    .row_features {
        padding: 50px 5px;
        text-align: center;
    }

    .cont_share_boxes {
        width: 37%;
        display: inline-grid;
        font-size: 16px;
        margin: 5px 2px;
        text-align: center;
        padding: 13px 13px 26px;
        font-weight: 500;
        height: 138px;
    }

    .row_bottom {
        color: white;
        padding: 30px 6px;
    }

    .row_bottom .side1 {
        text-align: left;
        padding: 20px 3px 20px 25px;
        color: white;
        width: 100%;
    }

    .row_bottom .side2 {
        margin: 46px 0;
    }

    .row_bottom .side2 input,
    .row_bottom .side2 textarea {
        width: 100%;
        padding: 14px;
        background: #00000038;
        border: 1px solid #cec0c0de;
        margin: 3px;
        color: white;
        font-size: 13px;
        outline: none;
    }

    .row_backimg h1 {
        font-size: 34px;
        margin: 20px 0 56px;
        width: 100%;
    }

    .row_backimg .flex_box .flex_boxin {
        margin: 15px;
        width: 100%;
        transform: rotate(0deg);
        padding: 25px 24px;
    }

    .row2 {
        padding: 10px 0;
    }

    .row2 h1 {
        text-align: center;
        font-size: 34px;
        font-weight: 500;
        color: white;
        margin: 0;
    }

    .flex_pricingin li {
        background: white;
        padding: 13px 11px;
        list-style-type: none;
    }

    .w_l_f ul li {
        padding: 13px;
        text-align: left;
    }

    .w_l_f img {
        width: 89%;
    }

    .row_contact h1 {
        font-size: 21px;
        font-weight: 500;
    }

    #servicesh2 {
        text-align: center;
        font-size: 31px;
        font-weight: 700;
        margin: -20px 0 1px;
    }

    .row_bottom input[type="submit"] {
        width: 100%;
        font-size: 20px;
        padding: 11px;
        background: linear-gradient(45deg, #1c1c6f, #0e55bf, #10105a);
        border-radius: 30px;
    }

    .row_bottom .side1 h1 {
        display: flex;
        margin: 24px 0;
        padding: 0;
        font-size: 24px;
        font-weight: 600;
    }

    .main .main_txt {
        margin: 14% 2% 6%;
        text-align: center;
        z-index: 4;
        width: 100%;
        color: white;
    }

    .demo_card_side {
        display: none;
    }

    .main {
        overflow: hidden;
        padding: 0 0 30px;
        height: auto;
    }

    .temp_preview h1 {
        text-align: center;
        font-weight: 600;
        margin: 0 0 10px;
        font-size: 26px;
        padding-bottom: 14px;
    }

    .w_l_f {
        width: auto;
        margin: 0 auto;
        text-align: center;
    }

    .w_l_f ul {
        vertical-align: top;
        padding: 0;
    }

    .w_l_f h1 {
        margin: 0;
        padding: 20px 39px;
        font-weight: 400;
        background: linear-gradient(45deg, #1c1c6f, #0e55bf, #10105a);
        color: white;
        font-size: 18px;
        text-align: center;
    }

    .temp_pre {
        display: inline-grid;
        margin: 10px 7px;
        text-align: center;
    }

    .temp_pre img {
        width: 116px;
        height: 223px;
    }

    .temp_preview {
        padding: 24px;
        text-align: center;
    }

    .scroll_cont {
        width: 1100px;
        position: relative;
        padding: 0;
    }

    .services {
        padding: 20px;
        text-align: center;
        display: block;
        width: auto;
    }

    .services_box {
        width: 200px;
        height: auto;
        padding: 27px;
        text-align: center;
        margin: 10px 4px;
        display: inline-block;
        box-shadow: 0px
}
.changer{
        box-shadow: 0 4px 8px rgb(10 0 20);
}
 footer p {
    margin: -14px;
    padding: 7px;
    text-align: center;
    font-size: 10px;
}   
    
    
    
}