@media (min-width: 471px) { 
/*this for EXCEPT 470 */
    #nav_mob {
        display: none;
    }
}
@media (max-width: 470px) {

    /*decrease body font*/
    body {
        font-size: 16px !important;
    }

    /*start custom media*/
    #innercontent {
        min-height: calc(100vh - 256px);
    }

    .topmenutitle {
        font-size: 1em;
    }

    img.topmenulogo {
        height: 30px;
    }



    .headertitle h3 {
        padding: 0px;
        margin: 20px 10px;
        font-size: 1em;
    }

    #checkdatemod {
        flex-direction: column;
        border-radius: 0px;
        margin: 0px;
    }

    button#check_this_date {
        width: 100%;
        margin: 10px 0px 10px 0px;
    }

    input#apo_check_date_avlbly {
        width: 100%;
        margin: 0px 10px 0px 10px;
        text-align: center;
    }

    /*search and filter*/

    .left_search,
    .left_search_sbp {
        width: calc(100% - 10px) !important;
        margin: 5px;

    }

    .left_search input,
    .left_search_sbp input {

        border-radius: 4px !important;
        padding: 0px 20px !important;
    }

    .right_filter {
        width: calc(100% - 10px) !important;
        margin: 5px;

        border-radius: 4px !important;
    }

    .hours_slot_wrap {
        flex-direction: column;
    }

    .itemhours {
        width: 150px;
    }

    #logedin_greeting {
        text-align: center;
    }

    .greeting {
        float: unset;
        width: 100%;
        text-align: center;
    }

    #footer_copyright {
        margin-bottom: 74px;
    }

    .logoonslide {
        display: none;
    }

    .itemapposimple {
        justify-content: flex-start !important;
        margin-bottom: 10px !important;
        padding: 10px !important;
    }

    /* Navigasi Mobile start*/
    #nav_mob {
        display: flex ;
        position: fixed;
        bottom: 0px;
        z-index: 100000;
        min-height: 53px;
        width: 100%;
        background: white;
        flex-direction: row;
        align-content: center;
        align-items: stretch;
        justify-content: center;
        flex-wrap: nowrap;
        border-top: 4px solid;
    }

    #nav_mob .btnwrp {
        cursor: pointer;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
        background: #fefefe;
        transition: 0.1s;
        height: 70px;
    }

    #nav_mob .btnwrp_25 {
        width: 25%;
    }

    #nav_mob .btnwrp_50 {
        width: 50%;
    }


    #nav_mob .btnwrp:active {
        /*background: blue;*/
        transform: translateY(-9px);
        border-top: 4px solid;
        border-radius: 10px 10px 0px 0px;
    }

    #nav_mob .btnwrp i {
        font-size: 2em;
    }

    #nav_mob .btnwrp:active i,
    #nav_mob .btnwrp:active .n_rext {
        color: white !important;
    }

    #nav_mob .n_rext {
        font-size: 0.7em;
        color: #676767;
    }
    
    .hiddenState {
        transform: translateY(74px);
        transition: 0.1s;
    }
     .visibleState {
        transform: translateY(0px);
        transition: 0.1s;
    }

    /* Navigasi Mobile end*/

    /*mobile view beuatify adjusdtment*/

    #jadwaltoday h3 {
        text-align: center !important;
    }

    .righttherest {
        flex-direction: column !important;
    }

    .todaysch i {
        justify-content: flex-start !important;
        min-width: 16px !important;
    }

    .righttherest .textfield {
        margin-left: 40px !important;
        text-indent: -18px !important;
    }

    .thepatient .textfield {
        text-indent: -32px !important;
        margin-left: 40px !important;
    }

    .bg_icon_alert {
        font-size: 10em !important;
    }

    .p_inn_wrap h2 {
        font-size: 1.2em !important;
        margin: 10px !important;
    }

    .thedate {
        flex-direction: column !important;
    }


    .pushright {
        position: unset !important;
    }

    .theorder {
        display: unset !important;
    }

    .o3 {

        width: calc(100% - 10px) !important;
        margin: 0px auto 5px auto !important;
    }

    .itemapposimple {
        width: auto !important;
        margin: 5px 10px !important;
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .iconpaketku {
        border-radius: 150px !important;
        margin: 10px !important;
    }

    .item_pasien {
        flex-direction: column !important;
    }

    .item_pasien_left {
        width: 100% !important;
        flex-direction: column !important;
    }

    .item_pasien_right {
        width: 100% !important;
    }

    .rl_sliders.accordion > .accordion-group {
        margin: 5px 10px !important;
    }

    .fw {
        width: calc(100% - 20px) !important;
        margin-left: 10px !important;
    }

    #redate {
        font-size: 0.85em;
        float: unset !important;
        display: inline-grid;
        margin: 5px;
        width: 100%;
        position: initial;
    }

    .namabrand_text {
        background: none !important;
    }

    .listpaket_inner .floatleft {
        float: none !important;
    }

    .nama_paket .floatleft {
        display: block;
    }

    .nama_paket .floatright {
        position: relative;
        display: block;

        right: -1px;
        top: -25px;
    }

    .rsform-button-next {
        margin-top: 30px !important;
        margin-bottom: 160px !important;
    }

    #fitoform_wrap button#submit {
        text-align: right !important;
    }

    /*mobile view beuatify adjusdtment*/


    /*hide mobile nav when input is focused */
    /* fail karena bukan child nya*/
    input:focus div#nav_mob {
        opacity: 0px !important;
        transition: 0.1s !important;
    }

    .step2intro {
        width: 100%;
    }

    .right_filter select#apo_admaprvl_tgl,
    .right_filter select#apo_admaprvl_bln,
    .right_filter select#apo_admaprvl_thn {
        width: 33% !important;

    }

    #fitoform_wrap #submitPrev {
        height: 38px;
    }
    .logbtnfooter {
        display: none;
    }
    /*close tag media*/
}