@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@300;400;500;600&display=swap');

:root {
    --primary-color: #754d29;
}

body {
    font-family: 'Hind Siliguri', sans-serif;
}

* {
    margin : 0;
    padding: 0;

}

.fs-18 {
    font-size: 18px;
}

.fs-80 {
    font-family: Tinos-Bold;
    font-size: 80px;
}

.text-score {
    color: #cc5e16;
}

.bg-second {
    background-color: #fdfdfd;
}

.text-theme {
    color: var(--primary-color);
}

#sign-up .error,
#sign-in .error {
    color      : rgb(239, 239, 239);
    font-style : oblique;
}

input:hover, #holder_image:hover {
    background-color: lightgray;
}

.error {
    color     : rgb(212, 6, 6);
    font-style: oblique;
}

/* NAVBAR */

.nav-link-custom {
    background-color: var(--primary-color);
    color           : #fff;
    font-size       : 16px;
    border-radius   : 20px;
    padding         : 5px 30px;
    text-decoration : none;
    font-weight     : bold;
}

.nav-link-custom:last-child {
    margin-left: 5px;
}

.nav-link-custom:hover, .nav-active {
    background-color: #dadada;
    color: #000;
}

/* END NAV */

.block {
    margin-left  : 20px;
    border-radius: 5px;
}

.block p {
    font-size: 11px;
}

#holder_image {
    color : #757575 !important;
    cursor: pointer;
    width : 50%;
}

.btn-submit-custom {
    width: 35%;
    background-color: #495057;
    color: #ffffff;
    padding: 3px;
    border-radius: 5px;
    border-color: #fff0c4c9;
    font-weight: bold;
}

.top-three {
    background-color: #ededed;
    border-radius: 5px;
    border: 2px solid lightgray;
}

.img-leader-custom {
    width         : 90px;
    height        : 90px !important;
    border-radius : 50%;
    height        : auto;
    border        : 2px solid #575756;
    border-spacing: 14px;
    padding       : 3px;
}

.img-leader-small {
    width : 50px;
    height: 50px !important;
}

.n-info {
    background: var(--primary-color);
    color     : #fff;
    padding   : 5px;
}

.n-pos {
    font-size: 19px;
}

.n-info p {
    font-size   : 19px;
    display     : flex;
    padding-top : 10px;
    padding-left: 30px;
}

.n-pos,
.n-score {
    display: flex;
    align-items: center;
    border: 2px solid lightgray;
    z-index: -1;
    padding-left: 30px;
    border-radius: 5px;
}

.top-tag {
    color     : #fff;
    background: var(--primary-color);
    width     : 30%;
}

.top-tag p {
    padding: 5px;
}

.pos img {
    width: 20%;
}

.pos p {
    margin: 0;
}

.ml-2 {
    margin-left: 2px;
}

.btn-custom {
    background: var(--primary-color);
    color: #fff;
}

.btn-custom:hover, .btn-custom-active:hover {
    background: #fff;
    color: #000;
    border-color: #000;
}

.btn-custom p {
    margin-bottom: 0;
}

.btn-custom-active {
    border: 1px solid;
}

/* Gallery Section */

.custom-box {
    flex: 0 0 auto;
    width: 20%;
    margin-bottom: 1.5rem;
}

.story-accordion-button {
    background: none !important;
    border: none !important;
}

.toggle-button {
    text-decoration: none;
    color: #10519f;
    cursor: pointer;
}

.collapsible .content {
    max-height: 60px; /* Set the minimum height for collapsed state */
    overflow: hidden;
    transition: max-height 0.3s ease;
}
  
.collapsible.expanded .content {
    max-height: 1000px; /* A sufficiently large value to accommodate the full content */
    transition: max-height 0.3s ease;
}


@media only screen and (max-width: 767px) {
    .custom-box {
        width: 100%;
    }
}

/* END Gallery Section */

/* FAQ */

.accordion-item {
    background: transparent;
    border    : none;
}

.accordion-button {
    background-color: #e3e5e5;
    font-weight: bold;
    color: #000000b0;
}

.accordion-body {
    background-color: var(--primary-color);
    color           : #fff;
    border-radius   : 20px !important;
    text-align: left;
}

/* End FAQ */

.footer {
    border-bottom: 20px solid var(--primary-color);
}

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


    .nav-link-custom:last-child {
        margin-left: 0;
    }

    .nav-link-custom,
    .block {
        display: block !important;
        ;
        margin-bottom: 10px !important;
        ;
    }

    .btn-submit-custom,
    #holder_image {
        width: auto !important;
    }

    .pos img {
        width: 25% !important;
    }

    .p-5 {
        padding: 2rem !important;
    }

    .block {
        display      : block !important;
        margin-left  : 0px;
        margin-bottom: 0 !important;
        border-radius: 0;
    }

    .option {
        width: 97% !important;
    }

    #faq-section {
        width: 100% !important;
    }

    .nav-link-custom img {
        width: 8% !important;
    }

    .custom-order-0 {
        order: 0;
    }

    .custom-order-1 {
        order: 1;
    }

    .custom-order-2 {
        order: 2;
    }

    .card-scoreboard a {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}