@media (max-width: 1200px){
    header .navbar-date, header #menu .nav-menu>li>a {
        font-size: 14px;
    }
    header #menu .nav-user .btn-group .dropdown-toggle > span {
        display: none;
    }
}
@media (max-width: 920px){
    .login-box {
        padding: 20px;
        margin: 0px auto;
    }
    .login-box .inner {
        padding: 30px;
    }
    header .navbar-default .navbar-toggle {
        float: left;
        border: 0px;
        margin: 15px 0px 15px -10px;
        position: fixed;
        left: 30px;
        top: 10px;
    }
    header .navbar-default .navbar-toggle .icon-bar {
        background-color: #F46B04;
        height: 3px;
        width: 25px;
    }
    header .navbar-toggle .icon-bar + .icon-bar {
        margin-top: 5px;
    }
    header .navbar {
        height: 130px;
    }
    header #menu .nav-user .btn-group .dropdown-toggle:before, header .navbar-date:before {
        display: none;
    }
    header .navbar-header {
        text-align: center;
        width: 100%;
        padding-right: 12px;
    }
    header .navbar-date {
        justify-content: center;
        margin-top: 10px;
    }
    header .navbar-default .navbar-brand {
        display: inline-block;
        float: initial;
        padding: 5px;
    }
    header #menu .nav-user {
        position: fixed;
        top: 10px;
        right: 35px;
    }
    header #menu {
        position: fixed;
        background: #fff;
        z-index: 150;
        width: 300px;
        height: 100vh !important;
        left: -100%;
        top: 0px;
        padding-top: 50px;
        transition: .3s ease 0s;
        display: block !important;
    }
    header #menu.in {
        left: 0px;
    }
    header #menu .nav-menu>li.active>a:after {
        display: none;
    }
    header #menu .btn-close-menu {
        position: absolute;
        right: 20px;
        top: 20px;
        cursor: pointer;
        background: transparent !important;
        border: 0px !important;
        padding: 0px !important;
        display: block;
    }
    header #menu .btn-close-menu i {
        width: 30px;
        height: 30px;
    }
    header #menu .nav-menu>li>a {
        border-bottom: 1px solid #ccc;
    }
    header .overlay-menu {
        background: rgba(0,0,0,0.75);
        position: fixed;
        left: 0px;
        top: 0px;
        width: 100vw;
        height: 100vh;
        z-index: 100;
        display: none;
    }
    header #menu.in + .overlay-menu {
        display: block;
    }
    header #menu.in .nav-user {
        opacity: 0.2;
    }
    header #menu.in {
        margin: 0px !important;
    }
    header #menu .nav-user .btn-group .dropdown-menu {
        display: none !important;
    }
    footer {
        text-align: center;
        padding: 30px 0px 15px;
    }

    #wrapper {
        padding-top: 130px;
    }

    .modal-dialog {
        width: 750px;
        margin: 30px auto;
        max-width: calc(100% - 30px);
    }

    #wrapper > .container-fluid > h4 {
        margin-top: 20px;
    }
    .filter-box {
        margin-top: 20px;
    }
    .filter-box .select .form-control {
        min-width: 150px;
    }
    .collab-box > .head {
        width: 250px;
    }
    .collab-box > .body {
        width: calc(100% - 250px);
    }
}

@media (max-width: 767px){
    .container-fluid {
        padding-left: 15px;
        padding-right: 15px;
        position: relative;
    }
    header .navbar-default .navbar-toggle {
        left: 15px;
    }
    header .navbar-header {
        margin: 0px !important;
        padding: 0px;
    }
    header .navbar-date {
        margin-top: 15px;
        padding: 0px;
        font-size: 14px;
    }
    header #menu .nav-user .btn-group .dropdown-toggle {
        padding: 10px 0px;
    }
    header #menu .nav-user .btn-group .dropdown-toggle > span {
        display: none;
    }
    header .navbar {
        height: 115px;
    }
    #wrapper {
        padding-top: 115px;
    }

    .panel.panel-primary .panel-body {
        padding: 15px 10px;
    }
    .table-ticket h4 {
        margin: 0px;
        font-size: 16px;
        line-height: 20px;
    }
    .nation-box {
        height: 175px;
        overflow-y: auto;
    }
    .table-ticket {
        font-size: 14px;
    }
    .modal .modal-header {
        padding-left: 20px;
    }
    .modal .modal-body {
        padding-left: 20px;
        padding-right: 20px;
    }
    .modal .modal-title {
        font-size: 20px;
        line-height: 24px;
    }

    #modal-tour .btn-group .head {
        margin-top: -20px !important;
        margin-bottom: 0px;
    }
    
    .table-mobile {
        margin-bottom: 40px;
    }
    .table-mobile thead {
        display: none !important;
    }
    .table-mobile tbody tr {
        border-bottom: 1px solid #ccc;
    }
    .table-mobile tbody tr td {
        display: inline-block;
        width: 100%;
        text-align: left !important;
        border: 0px;
        font-size: 14px;
    }
    .table-mobile tbody tr td:first-child {
        margin-top: 10px;
    }
    .table-mobile .row .col:first-child {
        display: block;
    }
    .table-mobile .row {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }
    .table-mobile .row .col {
        width: 50%;
    }
    .table-mobile .input-amount {
        justify-content: start;
    }

    .table-private .row .col {
        width: 100%;
    }
    .table-private .row .col:first-child {
        margin-bottom: 5px;
    }
    .table-private tbody tr td {
        padding: 15px 0px 0px !important;
    }
    .table-private tbody tr {
        border: 0px;
    }

    .action-box {
        position: relative;
        text-align: center;
    } 
    .filter-box {
        margin-top: 10px;
        display: inline-block;
    }
    .filter-box .form-group {
        margin-right: 15px;
        margin: 0px 0px 10px;
        width: 50%;
        float: left;
    }
    .filter-box .form-group:nth-child(odd) {
        padding-right: 5px;
    }
    .filter-box .form-group:nth-child(even) {
        padding-left: 5px;
    }
    .filter-box .select .form-control, .filter-box .form-control {
        min-width: initial;
        width: 100%;
    } 
    .filter-box .form-group:last-child {
        width: 100% !important;
        margin: 10px 0px 0px;
    }
    .filter-box .form-group:last-child label {
        display: none;
    }
    .filter-box .btn {
        min-width: 120px;
    }
    .filter-result {
        gap: 0px 5px;
        border-top: 1px solid #E1E1E1;
        margin-top: 20px;
        padding-top: 20px;
    }
    .filter-result .form-group {
        width: calc(50% - 5px);
        margin: 0px;
    }
    .filter-result label {
        font-size: 16px;
    }
    .filter-result p {
        font-size: 24px;
    }
    .dataTable thead {
        display: none !important;
    }
    .dataTable tbody tr {
        display: block;
        border-bottom: 1px solid #E1E1E1;
        padding: 10px 0px;
    }
    .dataTable tbody tr td {
        display: block;
        border: 0px;
    }
    .dataTable .td-head {
        font-weight: 700;
        width: 150px;
        display: inline-block;
    }
    .dataTable tbody tr td.no-padding-left {
        padding-left: 5px;
    }
    .btn-sm {
        padding: 4px 10px;
        font-size: 13px;
    }
    div.dataTables_paginate {
        margin-top: 30px;
    }
    .datatable-title {
        display: block;
        margin-top: 20px;
    }
    .collab-box > .head {
        display: flex;
        width: 100%;
        gap: 10px;
    }
    .collab-box > .head .item {
        gap: 5px;
        flex: 1;
        font-size: 16px;
        justify-content: center;
    }
    .collab-box > .head .item i {
        width: 35px;
        height: 35px;
    }
    .collab-box > .body {
        width: 100%;
        padding: 0px;
    }
    .collab-box > .body .panel-body {
        padding: 20px 15px 30px;
    }
    .form-transaction > .control {
        min-height: 200px;
    }
    .form-transaction > .form-group:last-child {
        text-align: center;
    }

    #modal-tax-invoice .modal-body > h3 {
        margin-top: -30px !important;
    }
    .form-tax-invoice {
        padding: 0px;
    }

    .tab .nav-tabs {
        display: inline-flex;
    }
    .tab .nav-tabs li {
        width: 33.33%;
    }
    .tab .nav-tabs li a {
        font-size: 13px;
        line-height: 19px;
        text-align: center;
    }
    .tab .tab-content {
        padding: 15px 10px;
    }
    .card {
        padding: 10px;
    }

    .tag {
        width: 100%;
        text-align: center;
    }
    .table-style3.dataTable tbody tr{
        display: flex;
        flex-wrap: wrap;
    }
    .table-style3.dataTable tbody tr td {
        width: calc(50% - 15px);
    }
    .table-style3.dataTable tbody tr td.is-full {
        width: 100%;
    }
    .table-checkin.dataTable tbody tr {
        padding-right: 150px;
        position: relative;
    }
    .table-checkin.dataTable tbody tr td {
        width: calc(100%);
    }
    .table-checkin.dataTable .td-head {
        width: 100%;
    }
    .table-checkin.dataTable td.is-full {
        position: absolute;
        right: 0px;
        top: 5px;
        width: auto !important;
    }
    .modal .modal-body.no-padding {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .check-box {
        padding: 0px 10px;
    }
}

@media (max-width: 520px){
    
}

@media (min-width: 768px){
    .modal-sm {
        width: 450px;
    }
}