/*#region Khai bao chung*/
/*#region Font*/
@font-face {
    font-family: RobotoBold;
    src: url(../fonts/ROBOTO-BOLD.TTF);
}

@font-face {
    font-family: RobotoMedium;
    src: url(../fonts/ROBOTO-MEDIUM.TTF);
}

@font-face {
    font-family: RobotoRegular;
    src: url(../fonts/ROBOTO-REGULAR.TTF);
}
/*#endregion */
* {
    padding: 0px;
    margin: 0px;
    color: #333;
    font-family: RobotoMedium;
}
/*.e-dlg-content {
    background-color:#ccc;
}*/
body {
    background-color: #F7F8FA;
}

::-webkit-scrollbar {
    width: 12px;
    height: 8px;
}

p {
    margin-bottom: 0.15rem;
    color: #333;
}

a {
    text-decoration: none;
}

select {
    border: none;
    outline: none;
}

.cyberTextRegular {
    font-family: RobotoRegular;
}

.cyberTextBold {
    font-family: RobotoBold;
}

.cyber-padding {
    padding: 16px
}

.cyber-padding-left {
    padding-left: 16px
}

.cyber-padding-top {
    padding-top: 16px
}

.cyber-padding-right {
    padding-right: 16px
}

.cyber-padding-bottom {
    padding-bottom: 16px
}

.cyber-margin {
    margin: 16px
}

.cyber-margin-left {
    margin-left: 16px
}

.cyber-margin-top {
    margin-top: 16px
}

.cyber-margin-right {
    margin-right: 16px
}

.cyber-margin-bottom {
    margin-bottom: 16px
}

.cyber-sub-text {
    color: #888888;
}
/*#endregion*/


/*#region CyberIcon*/

.cyber-icon-list:before {
    content: '\e8fe';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-user:before {
    content: '\e8fe';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-bus:before {
    content: '\eff6';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-station:before {
    content: '\e572';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-transportation:before {
    content: '\ea1f';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-ship:before {
    content: '\e558';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-refresh:before {
    content: '\e863';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-support:before {
    content: '\f0e2';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-commute:before {
    content: '\e940';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-group:before {
    content: '\f233';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-task:before {
    content: '\f075';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-add:before {
    content: '\e148';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-print:before {
    content: '\e8ad';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-preview:before {
    content: '\f1c5';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-location:before {
    content: '\e0c8';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-setting:before {
    content: '\e8b8';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-3dot:before {
    content: '\e5d3';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-sort:before {
    content: '\e152';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-push-lenh:before {
    content: '\e9a3';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-check:before {
    content: '\e834';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-uncheck:before {
    content: '\e835';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-cancel:before {
    content: '\ea39';
    font-family: 'Material Icons';
    font-size: 24px;
}

.cyber-icon-remove:before {
    content: '\e612';
    font-family: 'Material Icons';
    font-size: 24px;
}
/*#endregion */

/*#region Input*/
.CyberDivInput {
    background-color: white;
    border-radius: 6px;
    align-items: center;
}

.cyberInput {
    border: none;
    outline: none;
    padding: 6px;
}
/*#endregion */

/*#region Css Sync*/
/*#endregion */

/*#region DevExpress*/
/*icon date none*/
.input-group > .form-control.dxbs-input-group-append.dxbs-btn-group {
    display: none;
}
/*#endregion */




/*#region CyberButton*/
.cyberButtonDefault {
    padding: 6px;
    width: 120px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    background-color: #E4EDFF;
    cursor: pointer;
}

.cyberTextButtonDefault {
    margin-bottom: 0px;
    font-size: 14px;
    font-weight: 700;
}
/*#endregion */


/*#region CyberComboBox*/
.textComboBoxDefault {
    font-weight: 400;
    font-size: 12px;
    color: #4D5E80;
}

.selectComboBoxDefault {
    width: 161px;
    height: 49px;
    background: #FFFFFF;
    box-shadow: 0px 2px 5px rgba(38, 51, 77, 0.03);
    border-radius: 5px;
    padding: 4px;
}

.selectComboBoxReadonly {
    width: 161px;
    height: 49px;
    background: #D9DBE0;
    box-shadow: 0px 2px 5px rgba(38, 51, 77, 0.03);
    border-radius: 5px;
    padding: 4px;
}
/*#endregion */
/*#region CyberCheckBox*/
.textCheckBox {
    margin-top: 4px;
    font-size: 14px;
}

.custom-checkbox {
    display: inline-block;
    position: relative;
    margin-bottom: 0px !important;
    cursor: pointer;
    font-size: 16px;
    user-select: none;
}

    .custom-checkbox .checkbox-input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

    .custom-checkbox .checkbox-icon:after {
        content: "";
        position: absolute;
        display: none;
    }
/*#endregion */


/*#region CyberTextBox*/
.cyberText {
    font-weight: 400;
    font-size: 12px;
    color: #4D5E80;
}

.cyberInputDefault {
    width: 161px;
    height: 25px;
    min-height: 25px;
    padding: 0px;
}

.cyberInputReadonly {
    background: #D9DBE0;
    box-shadow: 0px 2px 5px rgba(38, 51, 77, 0.03);
    border-radius: 5px;
}

.CyberDivInputCustom {
    border-radius: 6px;
    width: fit-content;
    padding: 10px 6px;
    display: flex;
    align-items: center;
    height: 49px;
    overflow: hidden;
}
/*#endregion */


/*#region CyberNumberic*/
.cyberNumbericDefault {
    width: 175px;
}
/*#endregion */


/*#region CyberDatetime*/
/*#endregion */


/*#region CyberAutoComplete*/
.divTable {
    background-color: white;
    height: 400px;
    z-index: 2147483647;
    overflow: scroll;
    max-width: 600px;
    position: absolute;
    scroll-behavior: smooth;
}

.divTableChild {
    height: 400px;
    background-color: white;
    padding-bottom: 4px;
    scroll-behavior: smooth;
}
/*#endregion */


.Soluongkhachcho {
    min-height: 60px;
    font-size: 42px;
    color: red;
    background-color: yellow;
}

.mainbody {
    height: 100vh;
    width: 100%;
    background-color: #005D3C;
}

.footerScreen {
    background-color: #005D3C;
    color: white;
    font-size: 36px;
    padding: 8px;
}

.mainScreen {
    height: 100%;
    height: calc(100vh - 96px);
    padding-bottom: 6px;
}

.mainleft {
    width: 20%;
    background-color: #005D3C;
    height: 100%;
}

.stt, .ten_quay {
    color: white;
    font-size: 52px;
    text-align: center;
}

.mainright {
    background-color: white;
    padding-left: 6px;
    height: 100%;
}

.mainrightTitle {
    background-color: #005D3C;
    padding: 8px;
}

    .mainrightTitle h2 {
        font-size: 52px;
        font-weight: bold;
        text-align: center;
        margin: 0px;
        color: white;
    }

.mainGioHienTai {
    padding-top: 16px;
    font-size: 36px;
    color: white;
    text-align: center;
}

.mainrightVIDEO {
    padding-top: 6px;
    height: 100%;
    background-color: #005D3C
}

.headerQuay {
    background-color: #005D3C;
    padding: 12px 0px;
    color: white
}

    .headerQuay div {
        text-align: center;
        color: white;
        font-size: 42px;
    }

.footerScreenCaption {
    color: white;
    font-size: 42px;
}

.chuchay marquee {
    color: white;
    font-size: 42px;
}

.menudiv {
    width: 250px;
    height: 100%;
    padding: 16px;
}

@media only screen and (max-width: 600px) {
    .menudiv {
        width: 100%;
        height: 100%;
    }
}

.menudiv a{color:white;text-decoration:none !important;}