@font-face {
    font-family: "DCFont";
    src: url("/assets/dcfonts/UTM-Neo-Sans-Intel.ttf") format("truetype");
}
@font-face {
    font-family: "DCFontBold";
    src: url("/assets/dcfonts/UTM-Neo-Sans-IntelBold.ttf") format("truetype");
}
@font-face {
    font-family: "DCFontBoldItalic";
    src: url("/assets/dcfonts/UTM-Neo-Sans-IntelBold_Italic.ttf") format("truetype");
}
@font-face {
    font-family: "DCFontItalic";
    src: url("/assets/dcfonts/UTM-Neo-Sans-Intel_Italic.ttf") format("truetype");
}
body {
    font-family: DCFont;
    background-color:#ffffff !important;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: DCFont !important;
}
.spinner {
    font-size: 60px;
    position: fixed;
    bottom: 10px;
    right: 20px;
    z-index: 10000;
    background-color: #EEEEEE;
}
.scroll-top-wrapper {
    position: fixed;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    text-align: center;
    z-index: 99999999;
    background-color: #0280A6;
    color: #f2f2f2;
    width: 50px;
    height: 48px;
    line-height: 48px;
    right: 20px;
    bottom: 5px;
    padding-top: 2px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font-size: 22px;
}
.scroll-top-wrapper:hover {
    background-color: #A5CAD4;
}
.scroll-top-wrapper.show {
    visibility: visible;
    cursor: pointer;
    opacity: 1.0;
}
.cursor-pointer {
    cursor:pointer;
}
.form-group {
    margin-bottom: 5px !important;
}
.swal-popup {
    border: 1px solid #F2F2F2 !important;
    box-shadow: 2px 4px 0px 0px #E8E8E8 !important;
    margin-right: 5px !important;
}
textarea {
    resize: none;
}
input[data-switch] + label {    
    vertical-align: text-top !important;
    margin: unset !important;
    width: 70px !important;
}
input[data-switch] + label:before {
    margin: 0 !important;
    padding-left: 5px !important;
    font-weight: 600 !important;
    right: 8px !important;
}
input[data-switch]:checked + label:after {
    left: auto !important;
    right: 2px !important;
}
.form-control::-webkit-input-placeholder,
.select2-selection__placeholder {
    color: #B8B8B8;
    font-size: 11pt;
}
.form-control:required::-webkit-input-placeholder {
    color: #C1C9D0;
}
.form-control:required,
select:required + span .select2-selection {
    border-bottom: 2px solid #b5b3b3 !important;
}
.select2-container--open .select2-dropdown--below {
    border: 1px solid #ddd !important;
    background-color: #f2f2f2 !important;
}
.select2-results__option {
    font-size:10pt !important;
}
.select2-container .select2-selection--single {
    height: 40px !important;
}
.form-check-inline {
    align-items:unset !important;
}
.radio label {
    cursor:pointer;
}
.daterangepicker td.in-range {
    background-color: #cdf3ee !important;
    color: #ff0000 !important;
    font-weight: 600 !important;
}
table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable td:last-child, table.table-bordered.dataTable td:last-child {
    border-width: 1px !important;
}
.navbar-custom {
    background-image: linear-gradient(#f2f2f2, #F1F1F1) !important;
}
.hori-topbar-light #topnav .navbar-custom .dropdown.show .nav-link {
    background-color: unset !important;
}
.content-page {
    margin: 0px !important;
}
.blank-content-page {
    margin: 10px !important;
    padding:10px !important;
    background-color: #ffffff !important;
    min-height: calc(100vh - 170px);
}
.content {
    margin: 80px 0 0 0 !important;
    padding: 0 !important;
}
.main-page {
    min-height: calc(100vh - 170px);
}
.card-box {
    padding: 10px !important;
}
.page-title {
    margin: 0 !important;
    padding: 0px !important;
    border-bottom: 1px solid #dee2e6;
    margin-bottom: 15px !important;
}
.footer {
    margin: 0 !important;
    background-image: linear-gradient(#F1F1F1, #f2f2f2) !important;
}
.round {
    border-radius: 50%;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
}
.square {
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
}
.card-header {
    padding: 0.5rem 0.5rem !important;
}
.card-body {
    padding: 0.5rem !important;
}
#navigation {
    margin: 0 !important;
}
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
    #navigation {
        left: 10px !important;
        width: calc(100% - 20px) !important;
    }
    .dropdown-menu-right {
        right: 10px !important;
    }
}
/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
    #navigation {
        left: 10px !important;
        width: calc(100% - 20px) !important;
    }
    .dropdown-menu-right {
        right: 10px !important;
    }
}
/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    #navigation {
        left: 15px !important;
        width: calc(100% - 30px) !important;
    }
    .dropdown-menu-right {
        right: 5px !important;
    }
}
/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    #navigation {
        left: 15px !important;
        width: calc(100% - 30px) !important;
    }
    .dropdown-menu-right {
        right: 5px !important;
    }
}
/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    #navigation {
        left: 15px !important;
        width: calc(100% - 30px) !important;
    }
    .dropdown-menu-right {
        right: 5px !important;
    }
}
#navigation > ul.navigation-menu > li > a,
#navigation > ul.navigation-menu > li:hover > a {
    color: #01586F;
    text-align: right;
    padding-left: 10px !important;
}
#navigation > ul.navigation-menu > li:hover > a {
    color: #ff6a00;
}
table.dataTable th,
table.dataTable td {
    font-size: 11pt !important;
    padding: 5px !important;
    vertical-align: middle !important;
}
.table-hover > tbody > tr:hover {
    background-color: #EBEAEA !important;
    cursor: unset !important;
}
.borderless td, .borderless th {
    border: none !important;
}
/********************* DCSurvey ****************************/
#DCSurvey {
    font-family: DCFont !important;
}
#DCSurvey .sv_main {
    font-family: DCFont !important;
}
#DCSurvey .sv_page_title {
    font-size: 14pt !important;
    font-weight: 800 !important;
    color: #E36C0A !important;
}
#DCSurvey .sv_main .sv_container .sv_header {
    padding: 5px !important;
    background-color: #ffffff !important;
}
#DCSurvey .sv_q {
    padding: 0 !important;
    margin: 0 0 10px 0 !important;
}
#DCSurvey .sv_q_required_text {
    color: #fe0000;
}
#DCSurvey .sv_main .sv_container .sv_body .sv_p_root .sv_p_title {
    margin: 0 !important;
}
#DCSurvey .sv_p_title {
    padding: 10px 0 5px 0 !important;
}
#DCSurvey .sv_row {
    padding-left: 15px !important;
}
#DCSurvey .sv_q_description {
    font-style: italic;
    line-height: 25px;
    font-size: 10pt;
    color: #0f7242;
}
#DCSurvey .sv_main textarea {
    resize: none;
    height: 70px !important;
}
#DCSurvey .sv_body div[data-bind="text:koTimerInfoText"] {
    text-align: right;
    margin-bottom: 5px;
    font-weight:400;
}
#DCSurvey .sv_page_description {
    margin-bottom: 20px;
}
#DCSurvey .sv_main .sv_p_root > .sv_row:nth-child(even) {
    background-color: #ffffff !important;
}
#DCSurvey label {
    font-weight: 400 !important;
}
    #DCSurvey table.sv_q_mt tr td:nth-child(1) {
        width:400px !important;
    }
/***************** ChartJS **********************/
#ChartJS .progress {
    height: 25px !important;
    margin: 0 !important;
    background-color: #DDE8E8 !important;
    font-weight: 400 !important;
    padding: 0 !important;
}
#ChartJS .progress-dc .progress {
    background-color: #C8EBFA !important;
}
#ChartJS .progress-kr .progress {
    background-color: #EDD3ED !important;
    height: 10px !important;
    margin-top: 6px !important;
}
#ChartJS .progress-bar {
    text-align:center;
}
#ChartJS div[aria-valuenow="0"] {
    margin-left: 10px !important;
    font-weight: 400 !important;
    color: #B8B8B8 !important;
}
#desctiprion-bar .progress {
    background-color: var(--color-neutral-muted,var(--color-auto-gray-2));
    border-radius: 8px;
    display: flex;
    height: 6px;
    outline: 1px solid transparent;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
}
#desctiprion-bar .progress-label {
    display: flex;
    height: 25px;
    vertical-align:top;
    margin:3px 0 0 0 !important;
    padding:0 !important;
}
#desctiprion-bar .progress .progress-item {
    outline: 2px solid transparent;
    margin-left: 2px;
}
/***************** accordion **********************/
div.accordion .card {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    margin-bottom: 3px !important;
    background-color: #ffffff !important;
}
div.accordion .card-header {
    padding:5px !important;
    background-color: #ffffff !important;
    font-weight: 500 !important;
    margin:0 !important;
    border: 0px !important;
}
div.accordion > div.active > .card-header {
    font-weight: 900 !important;
    background-color: #f2f2f2 !important;
    border: 1px solid #EBEAE5 !important;
}
div.accordion .card-body {
    padding: 20px !important;
    background-color: #ffffff !important;
    border: 1px solid #EBEAE5 !important;
    -webkit-box-shadow: 0 4px 6px -6px #222 !important;
    -moz-box-shadow: 0 4px 6px -6px #222 !important;
    box-shadow: 0 4px 6px -6px #222 !important;
}
div.accordion .lv1body {
    padding: 10px 10px 10px 60px !important;
    border: 1px solid #EBEAE5 !important;
    box-shadow: 0px 15px 10px -15px #111 !important;
    background-color: #fbfbd6 !important;
}
/*********************** demochatbot ***********************/
#demochatbot {
    background-color: #ffffff;
	border:1px solid #ccc;
	border-radius:8px;
    z-index: 99999;
    position: absolute;
    width: 40%;
    min-width:350px;
    height: 470px;
    right: 25px;
    bottom: 35px;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}
#demochatbot .responsive-iframe {
    position: absolute;
	border-radius:8px;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
	border: 0;
}
