@media only screen and (max-width: 1300px) {
    .no-data h1 {
        font-size: 25px;
    }

    .no-data img {
        width: 300px;
    }
}

@media only screen and (max-width: 1200px) {
    .sidenav {
        width: 235px;
    }

    .Requests_items .content .content_head {
        flex-wrap: wrap;
        justify-content: flex-start
    }

    .Requests_items .content .content_head p {
        width: calc(100% / 3.1);
    }
}

@media only screen and (max-width: 992px) {

    .footerSignature p {
        font-size: 12px;
    }

    .login_page {
        flex-direction: column;
        gap: 0;
        justify-content: center;
        padding: 0px 20px;
    }

    .login_page .right_contain {
        width: 100%;
    }

    .login_page .left_contain {
        display: none !important;
    }

    .Side_icon,
    .mob_logo {
        display: block;
    }

    #main {
        margin-right: 0px;
    }

    .sidenav {
        width: 0;
    }

    .no-data .left {
        display: none;
    }

    .no-data {
        flex-direction: column;
        min-height: 50vh;
        justify-content: center
    }

    .Requests_items .content .content_head p {
        width: calc(100% / 2.2);
    }

    .Requests_items .content {
        padding: 5px;
    }

    .Requests_items .content .content_head p .titel {
        font-size: 12px;
    }

    .Requests_items .content .content_head p .data {
        font-size: 8px;
    }

    .Requests_items .content::-webkit-scrollbar {
        width: 3px;
    }

    .massage_item .massage_head p,
    .massage_item .massage_data {
        font-size: 10px;
    }

    .Requests_items .head .req_id {
        font-size: 12px;
    }

    .Requests_items .head .req_date {
        font-size: 9px;
    }

    .card-head .right p {
        font-size: 16px;
    }

    .Requests_items .footer .form_send input {
        font-size: 12px;
    }

    .Requests_items .footer .action_button button:first-child,
    .Requests_items .footer .action_button button:last-child {
        font-size: 10px;
        height: 25px;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
    }

    .card-head .head2 h1 {
        font-size: 20px;
    }

    .card-head .head2 p,
    .Registration_form .form-group label {
        font-size: 12px;
    }

    .Registration_form .form-group .form-control {
        font-size: 14px;
    }

    .error_message {
        font-size: 8px;
    }

    .Registration_form .form-group {
        margin-bottom: 15px;
    }

    .citiesContent .item {
        margin-top: 15px;
        padding: 10px 20px;
    }

    .citiesContent .item .cityName {
        font-size: 14px;
    }


}

@media only screen and (max-width: 767px) {
    /* .alerts_content .table tbody tr td p {
        min-width: 500px;
    } */

    #map {
        min-height: 75vh;
    }

    .staff_filter {
        flex-direction: column;
        align-items: flex-start;
    }

    .staff_filter .input_search {
        width: 100%;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px;
    }

    .staff_filter .select_input {
        width: 95%;
    }

    .staff_filter .input_search input {
        font-size: 12px;
        height: 40px;
    }

    .staff_filter .select_input select {
        font-size: 12px;
        height: 40px;
        border-radius: 8px;
    }

    .staff_filter .input_search button {
        height: 40px;
        width: 40px;
        font-size: 15px;
        border-top-right-radius: 8px;
        border-bottom-right-radius: 8px;
    }

    .staff_items .item {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        padding: 10px 20px;
    }

    .choose_notifcation_type {
        padding: 0;
        padding-bottom: 20px;
    }

    .choose_notifcation_type .butons {
        height: 40px;
        gap: 5px;
    }

    .choose_notifcation_type .butons button {
        height: 30px;
        font-size: 14px;
    }

    .subescription_action {
        width: 100%;
    }

    .subescription_action button.Accept_request,
    .subescription_action button.cansel_request {
        width: 50%;
        height: 30px;
        font-size: 14px;
        font-weight: bold;
        border-radius: 12px;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        -ms-border-radius: 12px;
        -o-border-radius: 12px;
    }
}

@media only screen and (max-width: 576px) {
    .card-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        border: none;
    }

    .no-data h1 {
        font-size: 20px;
    }

    .no-data p {
        font-size: 12px;
        margin-top: 20px;
    }

    .form-group.alert_sort .form-select {
        padding: 0px 10px;
        width: 115px;
        font-size: 11px;
        height: 35px;
        margin-left: 10px;
        border-radius: 11px;
        -webkit-border-radius: 11px;
        -moz-border-radius: 11px;
        -ms-border-radius: 11px;
        -o-border-radius: 11px;
    }

    .them_button1,
    .them_button2 {
        font-size: 11px;
        height: 35px;
        padding: 0px 10px;
    }

    .table_footer {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 20px;
    }

    .table_footer .shown_number select {
        padding: 0px 20px;
    }

    .header_of_modal .tittel h1 {
        font-size: 16px;
    }

    .header_of_modal .tittel p,
    .modal_form .form-group label {
        font-size: 12px;
    }

    .modal_form .form-group .form-control {
        font-size: 14px;
    }

    .header_of_modal {
        gap: 10px;
    }

    .header_of_modal .icon svg {
        width: 40px;
        height: 40px;
    }

    .Action_success img {
        width: 130px;
        height: 130px;
    }

    .Action_success h1 {
        font-size: 20px;
    }

    .Delete_Alert .modal_footer button:last-child,
    .Leave_Alert .modal_footer button:last-child,
    .Delete_Alert .modal_footer button:first-child,
    .Leave_Alert .modal_footer button:first-child {
        width: 50%;
        white-space: nowrap;
        font-size: 13px;
    }

    .categories_cards .item h1 {
        font-size: 16px;
    }

    .categories_cards .item {
        min-height: 80px;
        padding: 0px 15px;
    }
}

@media only screen and (max-width: 400px) {
    .f-requst_button {
        margin-left: 10px;
    }
}