/* ------------------------------------------------------------ *\
                       Tablet Orientation
\* ------------------------------------------------------------ */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    .modal-lg,.modal-xl{
        max-width:calc(100% - 50px);
    }
    .modal-md{
        max-width:calc(500px - 50px);
    }
    .model-sm{
        max-width:calc(500px - 50px);
    }
    .btn{
        margin-bottom: 5px;
    }
    .full-width-panel{

    }
}

/* ------------------------------------------------------------ *\
                       Mobile Orientation Portrait
\* ------------------------------------------------------------ */
/* Portrait Straight*/
@media only screen and (max-width: 768px) and (orientation: portrait) {
    /*@media only screen and (max-width: 768px) {*/
    .model-sm,.modal-md,.modal-lg,.modal-xl{
        max-width:calc(100% - 10px);
    }
    .btn{
        margin-bottom: 5px;
    }
    .app-header.navbar .nav-item.px-3{
        padding-right:0.3rem !important;
    }
    .sidebar-mobile-show .main{
        margin-left: 0px!important;
        margin-right: 0px!important;
    }
    h2{
        font-size: 1.53125rem;
    }
    ol.breadcrumb li{
        float: none;
    }
    .page-link, .pagination-datatables li a, .pagination li a{
        padding:0.5rem 0.5rem;
    }
    .full-width-panel{
        padding-left:10px;
    }
    .device-log{
        max-width: 300px;
        overflow-y: scroll;
    }
}

/* ------------------------------------------------------------ *\
                       Mobile Orientation Landscape
\* ------------------------------------------------------------ */
/* Landscape Tild*/
@media only screen and (min-device-width : 420px) and (max-device-width : 1024px) and (orientation: landscape) {
    .modal-lg,.modal-xl{
        max-width:calc(100% - 50px);
    }
    .modal-md{
        max-width:calc(500px - 50px);
    }
    .model-sm{
        max-width:calc(500px - 50px);
    }

    /* .modal-md,.modal-lg,.modal-xl{
        max-width:calc(100% - 50px);
    }
    .model-sm{
        max-width:calc(100% - 100px);
    } */
    .btn{
        margin-bottom: 5px;
    }
    .app-header.navbar .navbar-brand{
        left:20%;
    }
    .app-header.navbar .nav-item.px-3{
        padding-right:0.3rem !important;
    }
    .sidebar-mobile-show .main{
        margin-left: 0px!important;
        margin-right: 0px!important;
    }
    h2{
        font-size: 1.53125rem;
    }
    .full-width-panel{

    }
}
