﻿/* mobile device */
/* max-width: 767px */

/* iPads (landscape) */
/* (min-device-width : 768px) 
    and (max-device-width : 1024px) and (orientation : landscape) */

/* iPads (portrait) */
/* (min-device-width : 768px) and (max-device-width : 1024px) 
    and (orientation : portrait) */

/*@media only screen and (max-width: 767px) {*/

/* ipad landscape */
@media only screen and (min-device-width : 768px) 
    and (max-device-width : 1024px) and (orientation : landscape) {
    .datagrid-toolbar .easyui-linkbutton{
        display:block;
        border:solid 1px gray;
        margin:10px 0px 0px 0px;
    }

    .datagrid-toolbar .easyui-linkbutton .l-btn-icon-left {
        margin:0px;
    }
    .article .photo, .article .detail { 
        width:100%;
        float:none;
        margin-left:0px;
    }
    .article .detail div {
        margin-bottom:5px;
    }

    .file-upload-item {
        display:block;
    }
}


/* ipad portrait and mobile landscape*/
@media only screen and (max-width: 1024px){
    .logOnFrame {
        width:100%;
    }

        .logOnFrame fieldset {
            width:100%;
        }
    #logindisplay {
        
    }
    .care-header .panel-title, .mobile-none  {
        display:none;
    }

    .field-validation-error {
        display:block;
    }

    #main {
        padding:10px 10px 5px 10px;
    }

    /* Datagrid */

    .datagrid-toolbar .easyui-linkbutton{
        display:block;
        border:solid 1px gray;
        margin:10px 0px 0px 0px;
    }

    .datagrid-toolbar input, .datagrid-toolbar span.datebox, .datagrid-toolbar select {
        width:100% !important;
    }

    .datagrid-toolbar span.label, .datagrid-toolbar span.l-btn-icon {
        margin:5px 0px 5px 0px;
        display:inline-block;
    }
    .datagrid-toolbar .l-btn-icon {
        top:0;
    }

    .datagrid-toolbar .easyui-linkbutton .l-btn-icon-left {
        margin:0px;
    }

    /* Form */
    form input[type='submit'] {
        margin-top:10px;
    }

    .datagrid-header .datagrid-cell span {
        
    }
    .plan-block {
        width:100%;
        margin-bottom:15px;
    }

    .block-left, .block-right {
        margin-left:auto;
        margin-right:auto;
    }

    .tool-item {
        margin-left:auto;
        margin-right:auto;
        float:none;
        width: 250px;
        height: 250px;
    }

    .folder-item {
        margin-left:auto;
        margin-right:auto;
        float:none;        
        width: 250px;
        height: 250px;
    }
    .search-control20, .search-control25  {
        width:100% !important;
    }

}

/* mobile */
@media only screen and (max-width: 767px) {
    #logindisplay  {
        
    }
    .chart-label-item span {
        display:block;
        float:none;
    }

    .block-chart-detail .block-detail-item span {
        float:none;
        display:block;
    }

    .plan-head a {
        float:none;    
    }

    .report-page .chart-label-item span {
        display:inline-block;
        float:right !important;
        
    }

    #categoryid .block-chart .chart-graph  {
        width:100%;
    }

    .article .photo, .article .detail { 
        width:100%;
        float:none;
        margin-left:0px;
    }
    .article .detail div {
        margin-bottom:5px;
    }

    .search-control20, .search-control25  {
        width:100% !important;
    }

     .datagrid-pager table {
        float:none;
        margin-left:auto;
        margin-right:auto;
        margin-top:10px;
    }

    .datagrid-pager .pagination-info {
        float:none;
        width:100%;
        text-align:center;
        line-height:normal;
    }

    .tool-item {
        margin-left:auto;
        margin-right:auto;
        float:none;        
        width: 250px;
        height: 250px;
    }

    .folder-item {
        margin-left:auto;
        margin-right:auto;
        float:none;        
        width: 250px;
        height: 250px;
    }

    .greenButton, .grayButton {
        margin-right:0px !important;
    }

    .noproviderphoto {
        display:none;
    }
}