@media screen and (max-width: 1023px) {
    .slideleft.out {
	    -webkit-transform: translate3d(-100%,0,0);
	    -moz-transform: translateX(-100%);
	    transform: translateX(-100%);
	    -webkit-animation-name: slideouttoright;
	    -moz-animation-name: slideouttoright;
	    animation-name: slideouttoright;
    }

    .slideleft.in {
	    -webkit-transform: translate3d(0,0,0);
	    -moz-transform: translateX(0);
	    transform: translateX(0);
	    -webkit-animation-name: slideinfromright;
	    -moz-animation-name: slideinfromright;
	    animation-name: slideinfromright;
    }
    
    .isMobile {
        overflow-x: hidden;
        overflow-y: auto;
    }

    .content {
        left: 0px;
        right: 0px;
        top: 0px;
        bottom: 0px;
    }

    .content.hidden {
        z-index: 2;
    }

    body {
        padding: 0;
    }

    #ClientList, #ClientCategory, #Upcoming, #Setting, #CategoryList, #Search {
        width: 100%;
    }

    #ClientList .search {
        padding-right: 105px;
    }

    #ClientList .search button#ClientSearchBtn {
        right: 60px;
        border-right: none;
    }

    #ClientList .search button#UpcomingBtn {
        display: block;
    }

    #ClientDetail .title .BtnBack {
        display: block;
    }

    #ClientDetail .title {
        height: 65px;
        border-bottom: 1px #ededef solid;
        padding-bottom: 10px;
        margin-bottom: 15px;
    }

    #ClientDetail .ClientRecords {
        border-top: 5px #ededef solid;
    }

    #ClientDetail .details {
        padding: 60px 0 0 20px;
        border: none;
    }

    #ClientDetail .details .Name {
        border: none;
        width: 100%;
        position: absolute;
        top: 0;
        height: 30px;
        padding: 0;
    }

    #ClientDetail .details .Name span {
        color: #1ec3df;
        font-style: italic;
        font-weight: bold;
    }

    #ClientDetail .details .Name label {
        display: none;
    }

    #ClientDetail .details .Edit {
        height: 30px;
        line-height: 30px;
        width: 100%;
        top: 30px;
        background-color: #efefef;
    }

    #ClientDetail .details .Edit span.pc {
        display: none;
    }

    #ClientDetail .details .Edit span.mobile {
        display: block;
        position: absolute;
        width: 100%;
        top: 0;
        padding-left: 15px;
        font-size: 14px;
        background: url(../images/arrow-right-white.png) center right no-repeat;
    }

    #ClientDetail .details .Gender {
        width: 100%;
        border-right: none;
    }

    #ClientDetail .details .Gender {
        width: 100%;
        border-right: none;
    }

    #ClientDetail .details .Tel {
        width: 100%;
        border-right: none;
    }

    #ClientDetail .details .Birthday {
        width: 100%;
        border-right: none;
    }

    #ClientDetail .details .Category {
        width: 100%;
        border-right: none;
    }

    #ClientDetail .details .Email {
        width: 100%;
        border-right: none;
    }

    #ClientDetail .ClientRecords .title {
        margin-bottom: 0;
        padding-bottom: 0;
        line-height: 65px;
    }

    #Upcoming .title .BtnBack {
        display: block;
    }

    #Search .search-box .search-input {
        padding-left: 50px;
        z-index: 1000;
    }

    #Search .search-box a.BtnBack {
        position: absolute;
        z-index: 1001;
    }
}