@media only screen and (max-width: 1000px) {
    #side {
        /*display: none;*/
        position: inherit !important;
        float: none !important;
        width: 93% !important;
        margin-right: 0% !important;
        height: auto !important;
        margin-top: 10px;
        padding-top: 5px;
        background-color: #FFF;
        border: none !important;
        border-radius: 10px;
        text-align: center;
    }


    .btn_new_ar_mobile,
    .btn_sys_mng_mobile {
        display: block !important;
    }

    #auth_request_menu {
        display: none;
    }
}

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

    /*======= general and login ==========*/

    body {
        background-color: #fff;
    }

    .contentpage {
        width: 94% !important;
        margin: 0 auto;
    }

    #side {
        float: none !important;
        width: 100% !important;
    }

    #maqueslider {
        display: none;
    }

    #slider {
        display: none;
    }

    .messi-wrapper {
        width: 300px !important;
        margin-right: 100px !important;
    }

    .animatedtabs ul {
        margin-left: 0px !important;
    }

    .animatedtabs li {
        font-size: 0.9em !important;
    }

    #connected {
        right: 3px !important;
        font-size: 0.8em !important;
    }

    #header {
        margin: auto !important;
        width: 96% !important;
        margin-top: 10px !important;
        border-bottom: 1px solid navy;
        border-radius: 0px !important;
    }

    .header_content {
        text-align: center !important;
        padding-top: 30px !important;
        box-sizing: border-box !important;
    }

    .header_trans {
        border: none !important;
    }

    .logo {
        top: 0 !important;
        right: 0 !important;
    }

    #sys_title {
        width: 80% !important;
        margin: 32px 16px auto;
        position: relative;
        right: 60px;
    }

    .rightside_content {
        margin: 0 auto !important;
        margin-top: 20px !important;
        float: none !important;
    }

    #main {
        width: 100% !important;
        margin-right: 0px !important;
        border: none !important;
        box-sizing: border-box;
    }

    .login_elements {
        width: auto !important;
    }

    #login_container {
        width: 98% !important;
        height: 600px !important;
        overflow: auto;
    }

    .userlogin_img {
        display: none;
    }

    .welcome_container {
        display: none;
    }

    .welcome_text {
        width: 281px !important;
    }

    #userlogin_img {
        display: none;
    }

    .greenbar_420px {
        width: 96% !important;
        height: 30px !important;
        box-sizing: border-box;
    }

    .logo_mobile {
       /* display: block !important;
        text-align: right;*/
    }

        .logo_mobile > img {
            max-width: 210px !important;
            margin-right: 10% !important;
        }

    .login_par {
        width: 260px !important;
    }

    .signin_header {
        width: 296px !important;
        top: -1px !important;
    }

    .signin_container {
        width: 296px !important;
        height: 180px !important;
        margin-right: 20px !important;
    }

    .register_container, .register_header {
        width: 296px !important;
    }

    #txt_username, #txt_password {
        width: 160px !important;
    }

    .instructions_text {
        padding: 0px 10px 10px 10px !important;
        display: block !important;
        width: 250px !important;
        font-size: 0.9em !important;
    }

        .instructions_text > h3 {
            font-size: 1em !important;
        }

    /* registration */
    .reg_form_container {
        width: 257px !important;
        float: right !important;
        margin: 3px 8px 15px 9px !important;
        font-size: 12px !important;
        padding-right: 0px !important;
    }

    .reg_td_form {
        padding-right: 15px !important;
        display: inline-block !important;
        width: 160px !important;
        font-size: 0.9em !important;
    }


    .reg_inputitem {
        padding-top: 0px !important;
        float: right !important;
        margin-right: 10px !important;
    }

    #reg_contact_email, #reg_contact_phone, #reg_authority_address, #reg_authority_tz_hp, #reg_authority_phone {
        width: 200px !important;
    }

    #reg_btn {
        margin-right: 10px !important;
        position: relative !important;
        bottom: 55px !important;
        border: 2px solid black !important;
        height: 40px !important;
        width: 180px !important;
    }

    #btn_back {
        float: left !important;
        margin: 15px 0px !important;
        position: relative !important;
        top: 20px !important;
    }

    /*======= main list ==========*/
    .div_cover {
        float: right;
        width: 96% !important;
        border: 2px ridge #39739d;
        text-align: right;
        padding: 15px 0px !important;
        box-sizing: border-box;
        /*overflow: auto;*/
    }

    .cover_mob {
        padding: 15px !important;
    }

    #txt_auth_num {
        margin-bottom: 15px !important;
        width: 50px !important;
        margin-right: 0px !important;
        margin-left: 0px !important;
    }

    #dd_auth_status {
        width: 120px !important;
        margin-left: 0px !important;
        margin-bottom: 15px !important;
    }

    .dd_work_type_search {
        width: 190px !important;
        margin-right: 0px !important;
    }

    #street_name {
        width: 182px !important;
        margin-top: 15px !important;
        margin-bottom: 15px !important;
    }

    .dd_select_search {
        width: 150px !important;
        margin-right: 0px !important;
    }

    .waiting_for_my_approval_check {
        bottom: 18px !important;
        font-size: 0.9em !important;
    }

    /* .btn_search {
        float: left !important;
        margin: 15px 10px 20px 8px !important;
    }*/

    #btn_clear_fields {
        left: 23px !important;
        bottom: 7px !important;
    }

    /*=========== auth request form ==============*/
    #auth_reqs_list_raws {
        width: 96% !important;
        overflow: auto !important;
        display: block !important;
        border: 1px dashed navy !important;
        box-sizing: border-box !important;
    }

    #auth_request_form {
        /* margin-top: 40px; */
        width: 310px !important;
        overflow: auto !important;
        margin-right: 10px !important;
    }

    .titlebar {
        width: 280px !important;
    }

    .auth_date_container {
        float: right !important;
        margin: 10px !important;
    }

    .row_div {
        width: 290px !important;
    }

    #contact_fullname {
        width: 200px !important;
        margin-bottom: 10px !important;
    }

    #contact_tz_hp {
        width: 203px !important;
        margin-bottom: 10px !important;
    }

    #from_authority_name {
        width: 230px !important;
    }

    #contact_phone_mob {
        margin-top: 15px !important;
        display: inline-block !important;
    }

    #contact_email {
        width: 260px !important;
    }

    #contact_phone {
        width: 215px !important;
        margin-top: 15px !important;
    }

    /* authority for */

    #authority_name {
        width: 200px !important;
        margin-bottom: 10px !important;
    }

    #authority_tz_hp {
        width: 204px !important;
        margin-bottom: 10px !important;
    }

    #authority_phone {
        width: 215px !important;
    }

    #authority_address {
        width: 260px !important;
        margin-bottom: 10px !important;
    }

    #authority_email {
        width: 260px !important;
    }

    .auth_request_contact_constructor_selection,
    .auth_request_contact_planner_selection,
    .auth_request_contact_supervisor_selection {
        width: 100% !important;
        padding-right: 30px !important;
        box-sizing: border-box !important;
        margin: 0px !important;
    }


    /* constructor */

    #constructor_name {
        width: 197px !important;
        margin-bottom: 10px !important;
    }

    #constructor_tz_hp {
        width: 204px !important;
        margin-bottom: 10px !important;
    }

    #constructor_phone {
        width: 215px !important;
    }

    #constructor_address {
        width: 260px !important;
        margin-bottom: 10px !important;
    }

    #constructor_email {
        width: 260px !important;
    }

    /* planner */

    #planner_name {
        width: 197px !important;
        margin-bottom: 10px !important;
    }

    #planner_tz_hp {
        width: 204px !important;
        margin-bottom: 10px !important;
    }

    #planner_phone {
        width: 215px !important;
    }

    #planner_address {
        width: 260px !important;
        margin-bottom: 10px !important;
    }

    #planner_email {
        width: 260px !important;
    }


    /* supervisor */

    #supervisor_name {
        width: 197px !important;
        margin-bottom: 10px !important;
    }

    #supervisor_tz_hp {
        width: 204px !important;
        margin-bottom: 10px !important;
    }

    #supervisor_phone {
        width: 215px !important;
    }

    #supervisor_address {
        width: 260px !important;
        margin-bottom: 10px !important;
    }

    #supervisor_email {
        width: 260px !important;
    }


    /* work details */

    #work_description {
        width: 260px !important;
    }

    #dd_work_types {
        width: 270px !important;
    }

    #digging_length {
        width: 178px !important;
        margin-bottom: 10px !important;
    }

    #digging_depth {
        width: 177px !important;
        margin-bottom: 10px !important;
    }

    #digging_width {
        width: 178px !important;
    }

    #comments {
        width: 260px !important;
        margin-right: 10px !important;
        /*margin-top: -10px !important;*/
    }

    .inside_div {
        width: 96% !important;
        box-sizing: border-box !important;
        overflow: auto !important;
    }

    #ar_docs_list {
        width: 300px !important;
    }

    .open_docs_btn {
        float: right !important;
        margin: 5px 20px 10px 24px !important;
        width: 100px !important;
        height: 28px !important;
    }

    #btn_open_viewprint {
        display: none;
    }

    .back_btn {
        float: right !important;
    }

    #arrow_left_anim {
        display: none !important;
    }

    .btn_continue {
        float: right !important;
        border: 4px solid #14b325 !important;
    }

    .ar_actions_buttons {
        float: right !important;
        text-align: right !important;
    }

        .ar_actions_buttons > select {
            width: 140px !important;
        }


    .ui-dialog {
        width: 350px !important;
    }

    .top_container {
        width: 274px !important;
    }

    #box {
        width: 267px !important;
    }

    .input_search {
        width: 256px !important;
    }

    .filter_bar {
        width: 275px !important;
        overflow: auto;
    }

    .ui-dialog .ui-dialog-titlebar-close span {
        display: block !important;
        margin: 1px !important;
        zoom: 1.3 !important;
        position: relative !important;
        top: -3px !important;
        right: 3px !important;
        border: 1px solid black !important;
        border-radius: 6px !important;
    }

    /* APPROVERS PART */

    .approver_div_part {
        width: 276px !important;
    }

    #request_rem_option {
        width: 280px !important;
    }

    #approve_comments {
        width: 200px !important;
    }

    .approver_notification_msg {
        text-align: right !important;
        margin-top: 47px !important;
        margin-right: 0px !important;
        display: flex !important;
    }

    /* PROTOCOL */
    #coordination_protocol_container {
        float: right !important;
        width: 332px !important;
        box-sizing: border-box !important;
        overflow: auto !important;
        border: 1px dashed navy !important;
    }

    #coordination_protocol {
        width: 330px !important;
    }

    .cp_bar_header {
        width: 329px !important;
    }

    .cp_content_container {
        padding: 15px 0px !important;
    }

    .cp_titlebar {
        width: 300px !important;
    }

    .cp_actions {
        height: 235px !important;
        width: 200px !important;
    }

    .action_btn_container {
        width: 300px !important;
    }

    .cp_action_btn {
        width: 245px !important;
    }

    .cp_new_msg_btn {
        margin-right: 60px !important;
    }

    .new_msg_container {
        position: relative;
    }

    .msg_box {
        width: 305px !important;
    }

    .msg_response_box {
        margin: 0px 20px 10px 6px !important;
        width: 290px !important;
    }

    .new_response_msg_container {
        margin: 0px 20px 20px 0px !important;
        padding: 5px 5px !important;
        width: 290px !important;
    }

    #cke_msg_content {
        width: 250px !important;
    }

    .send_msg_btn {
        float: right !important;
        width: 150px !important;
    }

    .cancel_btn_container {
        display: block;
        width: 100% !important;
        float: right;
    }

    .inputitem {
        padding-top: 30px !important;
        display: inline-block;
    }

        .inputitem > input {
            width: 240px !important;
        }

        .inputitem > select {
            width: 250px !important;
        }

    .cp_td_form {
        position: absolute !important;
    }

    .extra_bottom_padding {
        padding-top: 30px !important;
    }

    /* PROTOCOL work details */

    .update_section {
        width: 100% !important;
    }

    .cp_update_title {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .cp_action_btn {
        width: 200px !important;
    }

    #tbl_days_and_times {
        width: 100%;
        display: table-caption;
    }

    #muni-conditions {
        max-width: 255px !important;
    }

    .conditions_check_container {
        max-width: 260px !important;
    }

    .msg_work_permit_request {
        position: relative !important;
        width: 100% !important;
        float: right !important;
        text-align: right !important;
        font-size: 0.7em !important;
        margin: 20px !important;
    }

    .work_permit_pending {
        width: 85% !important;
    }

    .work_permit_not_allowed {
        width: 76% !important;
    }

    .add_files_btn {
        margin-right: 20px;
    }

    .delivery_protocol_pending {
        width: 80% !important;
    }

    .work_completion_approval_pending {
        width: 76% !important;
    }

    /* PROTOCOL CONTACTS */
    #contact_list_container {
        width: 96% !important;
        font-size: 0.8em !important;
    }

    #tbl_contacts {
        min-width: unset !important;
    }

    /*end-css*/
}

@media only screen and (max-width: 361px) {
    /*start 361px*/

    #more_locations_input_num_range {
        display: block !important;
    }

    .search_row.bottom_search_row {
        width: 200px;
    }

    .search_btns_container {
        display: block !important;
        padding: 20px 0 0 0 !important;
    }

    #btn_search_auth_req {
        position: inherit !important;
        display: inline-block !important;
        padding: 0;
        margin: 0 !important;
    }

    #btn_clear_fields {
        display: inline-block !important;
        position: inherit !important;
    }

    #request_form_container {
        margin: 0 !important;
    }

    .input_stage_name {
        width: 150px !important;
    }

    .ar_stage_value_container {
        padding: 5px 0;
    }

    .input_stage_desc {
        width: 150px !important;
    }

    #accept_ar_request {
        position: static !important;
    }

    #dd_auth_status {
        width: 104px !important;
    }

    #dd_sorting_by {
        width: 162px !important;
    }

    .dd_work_type_search {
        width: 108px !important;
    }

    #street_name {
        width: 145px !important;
    }

    .dd_select_search {
        width: 130px !important;
    }

    /* .btn_search {
        width: 60px !important;
    }*/

    /* auth_request */
    #auth_request_form {
        margin-right: 0px !important;
    }

    /* protocol messages*/

    #cke_msg_content {
        width: 250px !important;
    }


    /*end 361px*/
}

@media only screen and (max-width: 321px) {
    /*start 321px*/

    #m_exit {
        display: none;
    }

    #auth_requests {
        font-size: 0.9em !important;
    }

    #container {
        width: 310px !important;
    }

    .animatedtabs {
        left: 0px !important;
    }

    #connected {
        font-size: 0.8em !important;
        right: 10px;
    }

    #dd_auth_status {
        width: 73px !important;
    }

    .dd_work_type_search {
        width: 98px !important;
    }

    #street_name {
        width: 134px !important;
    }

    .dd_select_search {
        width: 107px !important;
        font-size: 0.9em !important;
    }

    .signin_container {
        width: 262px !important;
        height: 180px !important;
        margin-right: 20px !important;
        margin-right: 10px !important;
    }

    .signin_header {
        width: 262px !important;
        top: -1px !important;
    }

    .register_container {
        width: 262px !important;
        margin-right: 10px !important;
    }

    .register_header {
        width: 262px !important;
    }


    #txt_username, #txt_password {
        width: 130px !important;
    }


    /* MAIN */

    .cover_mob, .cover_mob > input, .cover_mob > select {
        font-size: 0.9em !important;
    }

    .list_col {
        font-size: 0.9em !important;
    }

    #auth_reqs_list_raws > td, #auth_reqs_list_raws > th, .row_field {
        font-size: 0.9em !important;
    }

    /* protocol contacts */

    #contact_list_container {
        width: 90% !important;
        font-size: 0.75em !important;
    }

    .msg_box {
        width: 280px !important;
    }

    .msg_response_box {
        margin: 0px 15px 10px 6px !important;
        width: 270px !important;
    }

    .conditions_check_container {
        max-width: 260px !important;
    }

    /*end 321px*/
}