/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden,
[hidden] {
    display: none !important;
}

/*
  * Hide only visually, but have it available for screen readers:
  * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
  *
  * 1. For long content, line feeds are not interpreted as spaces and small width
  *    causes content to wrap 1 word per line:
  *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
  */

.sr-only {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
    /* 1 */
}

    /*
  * Extends the .sr-only class to allow the element
  * to be focusable when navigated to via the keyboard:
  * https://www.drupal.org/node/897638
  */

    .sr-only.focusable:active,
    .sr-only.focusable:focus {
        clip: auto;
        height: auto;
        margin: 0;
        overflow: visible;
        position: static;
        white-space: inherit;
        width: auto;
    }

/*
  * Hide visually and from screen readers, but maintain layout
  */

.invisible {
    visibility: hidden;
}

/*
  * Clearfix: contain floats
  *
  * For modern browsers
  * 1. The space content is one way to avoid an Opera bug when the
  *    `contenteditable` attribute is included anywhere else in the document.
  *    Otherwise it causes space to appear at the top and bottom of elements
  *    that receive the `clearfix` class.
  * 2. The use of `table` rather than `block` is only necessary if using
  *    `:before` to contain the top-margins of child elements.
  */

.clearfix::before,
.clearfix::after {
    content: " ";
    display: table;
}

.clearfix::after {
    clear: both;
}

.font-size-xl {
    font-size: 1.4rem;
}

.font-size-lg {
    font-size: 1.2rem;
}

.font-size-normal {
    font-size: 1rem;
}

.font-size-md {
    font-size: 0.875rem;
}

.font-size-sm {
    font-size: 0.75rem;
}

.font-size-xsm {
    font-size: 0.675rem;
}

.main-profile-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFFFFF;
    font-size: 0.875rem;
    background-color: #0081B4;
    border: none;
    border-radius: 8px;
    padding: 12px 20px;
    box-shadow: 0px 0px 8px rgba(236, 124, 29, 0.4);
}

    .main-profile-btn:hover {
        display: flex;
        justify-content: center;
        align-items: center;
        color: #FFFFFF;
        font-size: 0.875rem;
        background-color: #8C96E9;
        border: none;
        border-radius: 8px;
        padding: 12px 20px;
        box-shadow: 0px 0px 8px rgba(0, 129, 180, 0.3);
    }

.main-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFFFFF;
    font-size: 0.875rem;
    background-color: #EC7C1D;
    border: none;
    border-radius: 8px;
    padding: 12px 20px;
    box-shadow: 0px 0px 8px rgba(236, 124, 29, 0.4);
}

    .main-btn:hover {
        display: flex;
        justify-content: center;
        align-items: center;
        color: #FFFFFF;
        font-size: 0.875rem;
        background-color: #0081B4;
        border: none;
        border-radius: 8px;
        padding: 12px 20px;
        box-shadow: 0px 0px 8px rgba(0, 129, 180, 0.3);
        cursor: pointer;
    }

.main-border-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FF5959;
    font-size: 0.875rem;
    background-color: #FFFFFF;
    border: 1px solid;
    border-radius: 8px;
    padding: 12px 20px;
    /* box-shadow: 0px 0px 8px rgba(236, 124, 29, 0.3); */
}

.main-btn:hover {
    color: white;
}

.main-color {
    color: #0081B4 !important;
}

.main-bg {
    background-color: #EC7C1D;
}

.color-BDBDBD {
    color: #BDBDBD;
}

.blue-btn {
    background-color: #08A6E2;
    border-radius: 8px;
    color: white;
    font-size: 0.875rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 20px;
    border: none;
}

.blue-border-btn {
    background-color: #FAFAFA;
    border-radius: 8px;
    color: #0081B4;
    font-size: 0.875rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 20px;
    border: 1px solid #0081B4;
    box-shadow: 0px 0px 10px rgba(0, 129, 180, 0.1);
    cursor: pointer;
}
.orange-border-btn {
    background-color: #EC7C1D;
    border-radius: 8px;
    color: #0081B4;
    font-size: 0.875rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 20px;
    border: 1px solid #0081B4;
    box-shadow: 0px 0px 10px rgba(0, 129, 180, 0.1);
    cursor: pointer;
}

.w-10 {
    width: 10%;
}

.w-20 {
    width: 20%;
}

.w-30 {
    width: 30%;
}

.w-40 {
    width: 40%;
}

.w-50 {
    width: 50%;
}

.w-60 {
    width: 60%;
}

.w-70 {
    width: 70%;
}

.w-80 {
    width: 80%;
}

.w-90 {
    width: 90%;
}

.pb-40 {
    padding-bottom: 40px;
}

.pb-50 {
    padding-bottom: 50px;
}

.cursor-pointer {
    cursor: pointer;
}

.h-0 {
    height: 0%;
}

.see-all-link {
    color: #0081B4;
    font-size: 1rem;
    margin-top: 4px;
}

.color-0081B4 {
    color: #0081B4;
}

.color-EC7C1D {
    color: #EC7C1D;
}

.color-B8B8B8 {
    color: #B8B8B8;
}

.bg-gradient-1 {
    background: #C44987;
    background: -webkit-linear-gradient(to right, #C44987, #843B7D);
    background: linear-gradient(to right, #C44987, #843B7D);
}

.bg-gradient-2 {
    background: #EC8F2E;
    background: -webkit-linear-gradient(to right, #EC8F2E, #E55A31);
    background: linear-gradient(to right, #EC8F2E, #E55A31);
}

.bg-gradient-3 {
    background: #38B879;
    background: -webkit-linear-gradient(to right, #38B879, #1C9492);
    background: linear-gradient(to right, #38B879, #1C9492);
}

.bg-gradient-4 {
    background: #EC1717;
    background: -webkit-linear-gradient(to right, #EC1717, #740101);
    background: linear-gradient(to right, #EC1717, #740101);
}

.bg-gradient-5 {
    background: #CCC734;
    background: -webkit-linear-gradient(to right, #CCC734, #827E00);
    background: linear-gradient(to right, #CCC734, #827E00);
}

.bg-gradient-6 {
    background: #DC69A6;
    background: -webkit-linear-gradient(to right, #DC69A6, #AB104A);
    background: linear-gradient(to right, #DC69A6, #AB104A);
}

.bg-gradient-7 {
    background: #8C96E9;
    background: -webkit-linear-gradient(to right, #8C96E9, #0081B4);
    background: linear-gradient(to right, #8C96E9, #0081B4);
}

.color-EC1717 {
    color: #EC1717 !important;
}

.color-1D9D0A {
    color: #1D9D0A !important;
}

.w-120 {
    width: 120px;
}

.color-CBC516 {
    color: #CBC516 !important;
}

.color-FCAC0D {
    color: #FCAC0D;
}

.min-w-125 {
    min-width: 125px;
}

.min-h-150 {
    min-height: 150px;
}

.mb-100 {
    margin-bottom: 100px;
}

.color-084D68 {
    color: #084D68;
}

.see_detail_btn {
    background-color: #FAFAFA;
    color: #0081B4;
    border-radius: 8px;
    border: 1px solid #0081B4;
    font-size: 0.875rem;
    padding: 8px 30px;
    box-shadow: 0px 0px 8px rgba(0,129,180,0.2);
}

.color-757575 {
    color: #757575;
}

.color-333333 {
    color: #333333;
}

.color-949191 {
    color: #949191;
}

.bg-f3e5d9 {
    background-color: #f3e5d9;
}

.color-949191 {
    color: #949191;
}

.color-7A7A7A {
    color: #7A7A7A;
}

.color-A1A1A1 {
    color: #A1A1A1;
}

.mobile-table-row-light {
    background-color: #FAFAFA !important;
    border-top: 1px solid rgba(66, 158, 171, 0.2);
    border-bottom: 1px solid rgba(66, 158, 171, 0.2) !important;
}

/* ==========================================================================
    EXAMPLE Media Queries for Responsive Design.
    These examples override the primary ('mobile first') styles.
    Modify as content requires.
    ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 1.25dppx), (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
    Print styles.
    Inlined to avoid the additional HTTP request:
    https://www.phpied.com/delay-loading-your-print-css/
    ========================================================================== */

@media print {

    *,
    *::before,
    *::after {
        background: #fff !important;
        color: #000 !important;
        /* Black prints faster */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

        /*
    * Don't show links that are fragment identifiers,
    * or use the `javascript:` pseudo protocol
    */
        a[href^="#"]::after,
        a[href^="javascript:"]::after {
            content: "";
        }

    pre {
        white-space: pre-wrap !important;
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
    * Printing Tables:
    * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
    */
    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}