@font-face {
    font-family: 'DB Gin Siam X';
    src: url('fonts/DBGinSiamX.woff2') format('woff2'), url('fonts/DBGinSiamX.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DB Gin Siam X';
    src: url('fonts/DBGinSiamX-BoldIt.woff2') format('woff2'), url('fonts/DBGinSiamX-BoldIt.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'DB Gin Siam X';
    src: url('fonts/DBGinSiamX-LightIt.woff2') format('woff2'), url('fonts/DBGinSiamX-LightIt.woff') format('woff');
    font-weight: lighter;
    font-style: italic;
}

/* Apply the font family to elements */
body, button, input, textarea, p, h1, h2, h3, h4, h5, h6, label, table, th, tr, thead, tbody, a, span, html, div, select, option, datalist, ul, li {
    font-family: 'DB Gin Siam X', sans-serif !important;
    font-weight: normal;
    font-style: normal;
    /* font-size: 1.25rem; Uncomment and adjust if needed */
}


/*body, button, input, text, textarea, p, h1, h2, h3, h4, h5, h6, label, table, th, tr, thead, tbody, a, span, html, div, title, content, select, option, datalist, ul, li{
    font-family: 'DB Gin Siam X','DB Gin Siam X BoldIt','DB Gin Siam X LightIt' !important;
    font-weight: normal;
    font-style: normal;*/
/*    font-size: 1.25rem;*/
/*}*/

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}
/*icon user vendor : Color Blue */
.blockquote-custom {
    position: relative;
    font-size: 1.1rem;
}

.blockquote-custom-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -25px;
    right: 4px;
}

/*!
				* Bootstrap Steps v1.0.3 (https://github.com/ycs77/bootstrap-steps)
				* Copyright 2020 Lucas Yang <yangchenshin77@gmail.com>
				* Licensed under MIT (https://github.com/ycs77/bootstrap-steps/blob/master/LICENSE)
			*/
.steps {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    overflow-x: auto
}

    .steps .step:first-child {
        margin-left: auto
    }

    .steps .step:last-child {
        margin-right: auto
    }

.step:first-of-type .step-circle::before {
    display: none
}

.step:last-of-type .step-content {
    padding-right: 0
}

.step-content {
    box-sizing: content-box;
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 6rem;
    min-width: 6rem;
    max-width: 6rem;
    padding-top: .5rem;
    padding-right: 1rem
}

.step-circle {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2.5rem;
    height: 2.5rem;
    color: #adb5bd;
    border: 2px solid #adb5bd;
    border-radius: 100%;
    background-color: #fff
}

    .step-circle::before {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        left: -2px;
        width: calc(6rem + 1rem - 2.5rem);
        height: 2px;
        transform: translate(-100%,-50%);
        color: #adb5bd;
        background-color: currentColor
    }

.step-text {
    color: #adb5bd;
    word-break: break-all;
    margin-top: .25em
}

.step-active .step-circle {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff
}

    .step-active .step-circle::before {
        color: #007bff
    }

.step-active .step-text {
    color: #007bff
}

.step-error .step-circle {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545
}

    .step-error .step-circle::before {
        color: #dc3545
    }

.step-error .step-text {
    color: #dc3545
}

.step-success .step-circle {
    color: #28a745;
    background-color: #fff;
    border-color: #28a745
}

    .step-success .step-circle::before {
        color: #28a745
    }

.step-success .step-text {
    color: #28a745
}


.step-wraning .step-circle {
    color: #fff;
    background-color: #ff6e40;
    border-color: #ff6e40
}

    .step-wraning .step-circle::before {
        color: #ff6e40
    }

.step-wraning .step-text {
    color: #ff6e40
}



/* Icon Check circle File*/
.green-color {
    color: green;
}

.red-color {
    color: red;
}
.gray-color {
    background-color: #85929E;
    color: #85929E;
}
.yellow-color {
    background-color: #ffc863;
    color: #ff6e40;
}
.orange-color {
    color: #FFA500;
}
.orange2-color {
    background-color: #ff6e40;
    color: #ff6e40;
}
.peach-color {
    color: #FFCBA4;
}
.text-yellow {
    color: #FFDA00 !important;
}



.marquee {
    overflow: hidden;
    font-family: "Pridi", sans-serif;
    font-weight: 600;
    font-size: 34px;
    text-transform: uppercase;
    background-color: #FF99CC;
}
/*#D6EAF8*/
.marquee__inner {
    display: flex;
}

.marquee__line {
    flex-shrink: 0;
    margin: 0;
    padding: 10px 15px;
    min-width: 100%;
    white-space: nowrap;
    animation-name: marqueeLine;
    animation-duration: 7s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

@keyframes marqueeLine {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-100%);
    }
}