﻿@media (max-width:1300px) {
    .detail-left-part {
        width: 65%;
    }

    .detail-right-part {
        width: 35%;
    }
}

@media (max-width:1200px) {
    .pull-left-sm {
        margin-top: 10px;
        float: left !important;
    }

    .detail-left-part {
        width: 70%;
    }

    .detail-right-part {
        width: 30%;
    }
}

@media (max-width:1050px) {
    .detail-left-part {
        width: 65%;
    }

    .detail-right-part {
        width: 35%;
    }
}

@media (min-width:992px) {
    .page-sidebar-closed .page-sidebar {
        width: 70px !important;
    }

        .page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed {
            width: 70px !important;
        }

            .page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li > a {
                padding-left: 25px;
            }

        .page-sidebar-closed .page-sidebar .page-sidebar-menu > li, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li {
            margin: 0 0px 0 0;
        }

    .page-sidebar-closed .page-content-wrapper .page-content {
        margin-left: 70px !important;
    }

    .page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li > a > span > span > .title, .page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li > a > span > span > button, .page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li .list-ul {
        display: none !important;
    }
}

@media (max-width:991px) {
    .my-modal-scroll {
        max-height: calc(100vh - 180px);
    }

    .my-sidebar-icon {
        display: none;
    }

    .page-sidebar-closed.page-sidebar-closed-hide-logo .page-header.navbar .page-logo {
        width: 245px;
    }

    .pull-left-sm {
        float: left !important;
    }

    .page-header.navbar .page-logo .logo-default {
        margin: 7px 11px 0 20px !important;
    }

    .page-sidebar.navbar-collapse.in {
        margin: 0px !important;
    }

    .page-sidebar-fixed .page-sidebar {
        border-right: 0px solid #c4c4c4;
    }

    .page-sidebar {
        width: auto !important;
    }

    .page-sidebar-fixed .page-sidebar {
        top: 0 !important;
    }

    .page-sidebar-fixed .page-footer {
        margin-left: 0px;
    }

    .page-content-inverse {
        margin: -20px -20px -20px -20px;
    }

    .detail-left-part {
        width: 65%;
    }

    .detail-right-part {
        width: 35%;
    }

    .page-header.navbar .menu-toggler.responsive-toggler {
        margin: 17px 13px 0px 13px;
    }

    .page-header.navbar .top-menu .navbar-nav {
        margin: 13px 20px;
    }

        .page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-toggle {
            background-color: transparent;
        }

    .xs-hidden {
        display: none;
    }

    .page-sidebar, .page-sidebar.in {
        margin: 0 0px 0px 0px !important;
    }

    .page-header.navbar .page-logo {
        margin-left: -20px !important;
    }
}

@media (max-width:767px) {
    .my-modal-scroll {
        max-height: calc(100vh - 140px);
    }

    .row-flex {
        display: block !important;
    }
    .pull-left-sm {
        float: left !important;
    }

    .table-responsive {
        margin-bottom: 0px;
    }

    .page-content-inverse {
        margin: -20px -20px -20px -20px !important;
    }

    .page-header.navbar .page-logo {
        margin-left: -10px !important;
    }

    .page-header.navbar {
        padding: 0 0px 0 10px;
    }

    .detail-left-part {
        width: 62%;
    }

    .detail-right-part {
        width: 38%;
    }
}

@media (min-width: 768px) and (max-width:991px) {
    .modal-dialog {
        width: 720px;
        margin: 30px auto;
    }
}

@media (max-width:649px) {
    .page-header.navbar .page-logo {
        width: 235px;
    }

    .page-sidebar-closed.page-sidebar-closed-hide-logo .page-header.navbar .page-logo {
        width: 205px;
    }

    .page-header.navbar .page-logo .logo-default {
        margin: 7px 11px 0 15px !important;
    }

    .detail-left-part {
        width: auto !important;
        float: none;
        height: auto;
        padding: 10px 15px 10px 15px;
    }

    .detail-right-part {
        width: auto !important;
        float: none;
        height: auto;
        background: #ffffff;
        border-left: 0px solid #e1e2e3;
        padding: 10px 15px 10px 15px;
    }
}

@media (max-width:600px) {
    ul > li > a {
        text-shadow: none;
        color: #e9ecf3;
    }

    .navbar-nav {
        margin: 7.5px -15px !important;
    }

    .nav > li > a {
        padding: 10px 7px;
    }

    .page-header.navbar .top-menu .navbar-nav {
        margin-right: 7px !important;
    }
}

@media (max-width: 480px) {
    .page-sidebar, .page-sidebar.in {
        margin: 0 0px 0px 0px !important;
    }
}

@media (min-width:517px) and (max-width:991px) {
    .navbar-nav > li > a {
        padding-top: 19px;
        padding-bottom: 9px;
        color: #000 !important;
    }

    .page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-toggle {
        padding: 19px 0px 22px 0px;
    }

    .page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle > .username {
        color: #727399;
    }

    .page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-toggle:hover > i {
        color: #727399;
    }

    .page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle > i {
        color: #727399;
    }

    .page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle > .username:hover {
        color: #727399 !important;
    }

    .page-header.navbar .top-menu .navbar-nav > li.dropdown.open .dropdown-toggle > i {
        color: #727399 !important;
    }

    .page-header.navbar .top-menu .navbar-nav {
        margin: 10px 5px;
    }

        .page-header.navbar .top-menu .navbar-nav > li.dropdown {
            padding: 0px 0px;
        }
}

@media screen and (max-width:516px) {
    .page-header.navbar .top-menu .navbar-nav {
        margin: 5px 5px;
    }

        .page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-toggle {
            padding: 22px 6px 22px 8px !important;
        }

    .navbar-nav > li > a {
        padding-top: 22px !important;
        padding-bottom: 22px !important;
    }
}

@media screen and (max-width:496px) {
    .page-header.navbar .top-menu .navbar-nav {
        margin: 5px 5px;
    }
}

@media screen and (max-width:346px) {
    .nav > li > a {
        padding: 30px 7px;
    }
}

@media screen and (max-width:300px) {
    .nav > li > a {
        padding: 30px 5px !important;
    }

    .navbar-nav > li > a {
        padding-top: 22px !important;
        padding-bottom: 22px !important;
        font-size: 12px !important;
    }

    .page-header.navbar .top-menu .navbar-nav {
        margin-right: 0px !important;
    }

    .page-header.navbar .page-logo {
        margin-right: 0px !important;
    }
}

@media (min-width:517px) and (max-width:520px) {
    .navbar-nav > li > a {
        color: #000000 !important;
        font-size: 13px !important;
    }
}

@media (min-width:502px) and (max-width:516px) {
    .navbar-nav {
        margin: 5px 5px !important;
    }
}


@media (max-width: 480px) {
    .page-header.navbar .top-menu {
        display: contents;
        clear: both;
        float: right;
    }
}

@media (max-width: 340px) {
    .page-header.navbar .page-logo {
        width: 170px;
    }

    .page-sidebar-closed.page-sidebar-closed-hide-logo .page-header.navbar .page-logo {
        width: 145px;
    }

    .page-header.navbar .page-logo .logo-default {
        margin: 12px 5px 0 5px !important;
        height: 34px;
    }
}

@media (max-width: 1366px) {
    #chartdiv {
        width: 100%;
        margin-left: 0px;
    }
}