/*

    DEMO STYLE

*/





/* @import 'https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700'; */



@import url('https://fonts.googleapis.com/css2?family=Prompt:wght@100;200;300;400;500;600;700;800;900&display=swap');

* {

    /* font-family: 'Prompt', sans-serif; */

}



body {

    /* font-family: 'Poppins', sans-serif; */

    background: #fafafa;

}



p {

    /* font-family: 'Poppins', sans-serif; */

    font-size: 1.1em;

    font-weight: 300;

    line-height: 1.7em;

    color: #999;

}



a,

a:hover,

a:focus {

    color: inherit;

    text-decoration: none;

    transition: all 0.3s;

}

.cke_notification_warning { display:none; }
.container-fulid { box-shadow:0 5px 10px rgb(0 0 0 / 40%) !important; -webkit-box-shadow:0 5px 10px rgb(0 0 0 / 40%) !important; }

.btn-logout { display:inline-block; border-radius:5px; text-align:center; cursor:pointer; background-color:#FFFFFF; color:#000; padding:7px 15px; box-shadow:0 5px 10px rgb(0 0 0 / 40%) !important; -webkit-box-shadow:0 5px 10px rgb(0 0 0 / 40%) !important; }
.btn-add { background-color:#ffcb0b; color:#000000; width:102px; }
.btn-add-box { min-width: 110px;float: right;position:relative; }
.btn-add-box img { width:30px; position:absolute; left:-7px; top:5px; }
.btn.btn-edit { color:#FFFFFF; background-color:#c55a11; border-color:#c55a11; }
.btn.btn-view { color:#FFFFFF; background-color:#203864; border-color:#203864; }
.btn.btn-action { color:#FFFFFF; background-color:#ed7d31; border-color:#ed7d31; }
.btn.btn-action2 { color:#FFFFFF; background-color:#00b050; border-color:#00b050; }

.table-data-box { border:1px solid #000000; padding:10px; }
.table-data thead th { color:#000000; font-weight: bold; border:none; }
.table-data td { border-bottom:1px solid #000000; border-top:none; }

.search_data_input { background-color:#000000 !important; color:#FFF !important; height:30px; width:100%; max-width:200px; display:inline; }
.search_data_input2 { background-color:#FFF !important; color:#000 !important; border:1px solid #000000; height:30px; width:100%; max-width:200px; display:inline; }
.search_data_btn { padding:5px 10px !important; }
.search_data_input::placeholder {
    color: #FFF;
}

.card-body input { border:1px solid #000000; }
.card-body textarea { border:1px solid #000000; }
.card-body select { border:1px solid #000000; }
.card-body label { color:#000000; }

.tab { margin-bottom:20px; }
.tablinks { border:1px solid #ffcb0b !important; color:#000000; background-color:#FFFFFF; padding:7px 20px !important; }
.tablinks.active { border:1px solid #FFFFFF !important; color:#000000; background-color:#ffcb0b; }

.pagination { display:inline; margin:0; margin:0; padding:20px; }
.pagination li { display:inline; padding:5px 12px; font-size:14px; background-color:#FFF; border:1px solid #ddd; border-radius:5px; cursor:pointer; color:#666; box-shadow:0 5px 10px rgb(0 0 0 / 20%); -webkit-box-shadow:0 5px 10px rgb(0 0 0 / 20%); }
.pagination .prev { background-color:#ffcb0b; padding:5px 12px 5px 7px; }
.pagination .next { background-color:#ffcb0b; padding:5px 7px 5px 12px; }
.pagination .active { color:#000; }
  
.cke_wysiwyg_frame table { display:contents; }

#sidebar ul { padding-inline-start: 0px; background-color:#ffcb0b; margin-bottom:0; } 
#sidebar li { position:relative; }
#sidebar li .fa-chevron-right { position:absolute; top:12px; right:15px; }

#head-title-txt { color:#000000; font-size:16px; }
.title-form { height:48px; background-image:url('/images/img-titile1.png'); background-repeat:no-repeat; color:#000; text-align:left; font-size:18px; padding:10px; }
.title-form2 { height:40px; background-image:url('/images/img-titile2.png'); background-repeat:no-repeat; color:#000; text-align:left; font-size:16px; padding:10px; }

.text_red { color:#ffcb0b; }
.btn-red { background-color:#ffcb0b; color:#FFFFFF; border-radius:5px; padding:5px; width:100px; text-align:center; cursor:pointer; }

.cust_view_column { margin-bottom:20px; font-size:14px; }

.ui-dialog .ui-dialog-titlebar { display:none; }
.ui-widget.ui-widget-content { border:1px solid #000000 !important; }
.ui-datepicker.ui-datepicker-multi { border:1px solid #CCC; }

.autocomplet_list { background-color:#f3f3f3; position:absolute; border:1px solid #c1c1c1; list-style:none; margin-top:-6px; z-index:10; width:100%; text-align:left; display:none; border-radius:2px; }
.autocomplet_list li { cursor:pointer; padding:5px; font-size:12px; }
.autocomplet_list li:hover { background: #FEF1C9; }

.printer-box { width:100%; background-color:#FFF; font-size:14px; margin-bottom:20px; }
.printer-box-l { float:left; width:40%; }
.printer-box-r { float:right; width:60%; text-align:right; }
.btn-print { display:inline; padding:10px 20px; background-color:#ffcb0b; color:#FFF; border-radius:5px; cursor:pointer; margin-right:5px; }
.btn-download { display:inline; padding:10px 20px; background-color:#ffcb0b; color:#FFF; border-radius:5px; cursor:pointer; margin-right:5px; }
.btn-print-close { display:inline; display:inline; padding:10px 20px; background-color:#FFF; color:#375c65; border:1px solid #375c65; border-radius:5px; cursor:pointer; }

.table-hover2 td { cursor:pointer; }
.table-hover2 tr:hover { background-color:#ffcb0b; color:#FFF; }

.table_booking { font-size:12px; }
.table_booking th { color:#ffcb0b; font-weight:bold; border-bottom:1px solid #EAEAEA; padding:2px 0px; }
.table_booking td { border-bottom:1px solid #EAEAEA; padding:2px 0px; }
.td_booking_box { width:95%; overflow:hidden; white-space:nowrap; font-size:12px; }
.table_booking .td_number { font-size:12px; }

.input_car_search_db { max-width:190px; border:none; border-bottom:1px solid #ffcb0b; }

.bg_box { box-shadow:0 5px 10px rgb(0 0 0 / 40%); -webkit-box-shadow:0 5px 10px rgb(0 0 0 / 40%); padding:20px; }

.notif_circle { background-color:#FFF; color:#ffcb0b; padding:2px 7px; font-size:12px; border-radius:20px; }

.navbar {

    padding: 15px 10px;

    background: #fff;

    border: none;

    border-radius: 0;

    margin-bottom: 40px;

    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
    height:105px;

}



.navbar-btn {

    box-shadow: none;

    outline: none !important;

    border: none;

}



.line {

    width: 100%;

    height: 1px;

    border-bottom: 1px dashed #ddd;

    margin: 40px 0;

}





/* ---------------------------------------------------

    SIDEBAR STYLE

----------------------------------------------------- */



.wrapper {

    display: flex;

    width: 100%;

    align-items: stretch;

}



#sidebar {

    min-width: 250px;

    max-width: 250px;

    background: #fff;

    color: #fff;

    transition: all 0.3s;

}



#sidebar.active {

    margin-left: -250px;

}



#sidebar .sidebar-header {

    padding: 20px;

}



#sidebar ul.components {

    padding: 20px 0;

    border-bottom: 1px solid #47748b;

}



#sidebar ul p {

    color: #fff;

    padding: 10px;

}



#sidebar ul li a {

    padding: 10px;

    font-size: 1.1em;

    display: block;

    color: #000;

}



#sidebar ul li a:hover {

    color: #000 !important;

    background: #fff;

}



#sidebar ul li.active>a,

a[aria-expanded='true'] {

    color: #000000 !important;

    background: #fff;

}



a[data-toggle='collapse'] {

    position: relative;

}



.dropdown-toggle::after {

    display: block;

    position: absolute;

    top: 50%;

    right: 20px;

    transform: translateY(-50%);

}



ul ul a {

    font-size: 0.9em !important;

    padding-left: 30px !important;

    /* background: #ff66b7; */

}



ul.CTAs {

    padding: 20px;

}



ul.CTAs a {

    text-align: center;

    font-size: 0.9em !important;

    display: block;

    border-radius: 5px;

    margin-bottom: 5px;

}



a.download {

    background: #fff;

    color: #7386d5;

}



a.article,

a.article:hover {

    background: #6d7fcc !important;

    color: #fff !important;

}





/* ---------------------------------------------------

    CONTENT STYLE

----------------------------------------------------- */



#content {

    width: 100%;

    /* padding: 20px; */

    min-height: 100vh;

    transition: all 0.3s;

    /* background-color: #fff; */

}





/* ---------------------------------------------------

    MEDIAQUERIES

----------------------------------------------------- */



/* @media (max-width: 768px) { */

@media (max-width: 1024px) {

    #sidebar {

        margin-left: -250px;

    }

    #sidebar.active {

        margin-left: 0;

    }

    #sidebarCollapse span {

        display: none;

    }

    #sidebar {

        height: 100%;

    }

}



.container-test {

    position: relative;

    width: 100%;

    max-width: 400px;

}



.image {

    display: block;

    width: 100%;

    height: auto;

}



.overlay {

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    height: 100%;

    width: 100%;

    opacity: 0;

    transition: 0.3s ease;

    background-color: red;

}



.container-test:hover .overlay {

    opacity: 1;

}



.icon {

    color: white;

    font-size: 50px;

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    -ms-transform: translate(-50%, -50%);

    text-align: center;

}



.fa-trash-alt:hover {

    color: #eee;

}





/* Extra small devices (phones, 600px and down) */



@media only screen and (max-width: 600px) {

    .custom-card-manee {

        padding: 5px 10px;

        border-radius: 7px;

        min-height: 55px;

    }

    .img-icon-card-row {

        width: 15px;

    }

    .mh-res-card {

        min-height: 120px;

    }

    .span-card-manee.active {

        color: white;

    }

    .span-card-manee {

        font-family: Kanit;

        font-style: normal;

        font-weight: 500;

        font-size: 12px;

        color: #FF95CA;

    }

}





/* Small devices (portrait tablets and large phones, 600px and up) */



@media only screen and (min-width: 600px) {

    .custom-card-manee {

        padding: 5px 10px;

        border-radius: 7px;

        min-height: 55px;

    }

    .img-icon-card-row {

        width: 15px;

    }

    .mh-res-card {

        min-height: 120px;

    }

    .span-card-manee.active {

        color: white;

    }

    .span-card-manee {

        font-family: Kanit;

        font-style: normal;

        font-weight: 500;

        font-size: 12px;

        color: #FF95CA;

    }

}





/* Medium devices (landscape tablets, 768px and up) */



@media only screen and (min-width: 768px) {

    .custom-card-manee {

        padding: 30px 10px;

        border-radius: 7px;

        min-height: 55px;

    }

    .img-icon-card-row {

        width: 20px;

    }

    .mh-res-card {

        min-height: 120px;

    }

    .span-card-manee.active {

        color: white;

    }

    .span-card-manee {

        font-family: Kanit;

        font-style: normal;

        font-weight: 500;

        font-size: 15px;

        color: #FF95CA;

    }

}





/* Large devices (laptops/desktops, 992px and up) */



@media only screen and (min-width: 992px) {

    .custom-card-manee {

        padding: 30px 10px;

        border-radius: 7px;

        min-height: 55px;

    }

    .img-icon-card-row {

        width: 23px;

    }

    .mh-res-card {

        min-height: 120px;

    }

    .span-card-manee.active {

        color: white;

    }

    .span-card-manee {

        font-family: Kanit;

        font-style: normal;

        font-weight: 500;

        font-size: 24px;

        color: #FF95CA;

    }

}





/* Extra large devices (large laptops and desktops, 1200px and up) */



@media only screen and (min-width: 1200px) {

    .custom-card-manee {

        padding: 30px 10px;

        border-radius: 7px;

        min-height: 55px;

    }

    .img-icon-card-row {

        width: 23px;

    }

    .mh-res-card {

        min-height: 120px;

    }

    .span-card-manee.active {

        color: white;

    }

    .span-card-manee {

        font-family: Kanit;

        font-style: normal;

        font-weight: 500;

        font-size: 24px;

        color: #FF95CA;

    }

}

@media only screen and (min-width: 1600px) {
    .table_booking { font-size:14px; }
    .table_booking .td_number { font-size:13px; }

    .input_car_search_db { max-width:290px; }
}