body {
    background: url(../images/desktop/background.webp);
    background-size: cover;
}
.background {
        background: url(../images/desktop/background_image.webp);
        background-repeat: no-repeat!important;
        background-size: cover;
        background-attachment: fixed;

}

.btn.btn-primary {
    background-color: #FFFFFF !important;
    color: #414141;
    text-align: center;
    line-height: normal;
    font-weight: 700;
    border: none;
}

.text-gray {
    color: #414141 !important;
}

.btn.btn-outline-white.hover-green {
    font-weight: 600 !important;
}


.hover-green:hover {
    color: #fff;
    background-color: #198754 !important;
    border-color: #198754;
}

sup {
    font-size: 0.60em;
}


.body-section,
.footer-section {
    background-color: #B2D0E8;
    background: #B2D0E8;
}

.footer-section p {
    @media (max-width: 575.98px) {
        font-size: 14px !important;
    }
}
.shield {
    white-space: nowrap;
    display: inline-flex;
    border-radius: 100px!important;
    background: linear-gradient(19deg, #DAAF75 12.96%, #F9F8E1 95.73%, #E8CFA4 95.73%);
    padding: 8px 12px;
    justify-content: center;
    align-items: center;
    text-wrap: auto;
}

.header {
    color: #000000;
    font-family: "Roboto Flex", sans-serif;
    font-size: 60px!important;
    font-style: normal;
    font-weight: 700;
    line-height: 130px; /* 96.296% */
    text-transform: initial;
}


.sub-header {
    text-transform: initial;
    color: #000000;
    font-family: "Roboto Flex", sans-serif;
    font-size: 47px;
    font-style: normal;
    font-weight: 700;
}


.roboto-flex {
    font-family: "Roboto Flex", sans-serif;!important
    font-size: 47px!important;
}

.bg-blue {
    background-color: #227EC7;
    color:white;
}

.hero-section h1 strong {
    font-weight: 700 !important;
}

.hero-section .main-image {
    width: 405px;

}

.icons {
    width: 150px;
    height: 150px;
    flex-shrink: 0;
    aspect-ratio: 1/1;
}
.icons-steps {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    aspect-ratio: 1/1;
}

.last-box {
    margin: -100px 0 -100px 70px;
}

.icon-box {
    height: auto;
    flex-shrink: 0;
    margin: auto;
}

.last-section {
    margin-top:-120px;
}

.last-part-section-margin {
    margin-top: -200px;
}

.text-blue {
    color: #227EC7!important;
}

.prizes-three {
    font-size: 16px
}

.prizes-three .rounded-3 {
    border-radius: 10px !important;
}

.prizes-three p {
    font-weight: 400;
}

.prizes-three h3 {
    font-family: "Roboto Flex", serif; 
    font-size: 40px;
    color: #414141;
    font-weight: 700;

}

.rounded-boxes {
    background: rgba(255, 255, 255, 0.60);
    border-radius: 20px;
    border: 1px solid #7C9FA6;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.rounded-boxes-2 {
    background: lightgray 50%;
    border-radius: 20px;
    border: 1px solid #7C9FA6;
    display: flex;
    padding: 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
}

.background-button {
    background: #cd0a10!important;
}

.accordion-flush .accordion-item .accordion-button::after {
    filter: invert(1);
}

.faqs-section .accordion-flush .accordion-item {
    border-bottom:1px solid black !important;
}

.steps-section {
    padding: 24px;
    flex-direction: column;
    align-items: center;
    border-radius: 14px;
    position: relative;
    border: 1px solid #7C9FA6;
    background: url(../images/desktop/got_covered_background.webp) lightgray 50% / cover no-repeat;
    backdrop-filter: blur(25px);
}

.steps-section h3 {
    font-size: 35px !important;
}

.steps-section span {
    font-weight: 700;
}

.rounded-boxes-2 {
    background: url(../images/desktop/got_covered_background.webp) lightgray 50% / cover no-repeat;
}


@media (max-width: 991.98px) {
    .mx-md-custom { margin-left: auto !important; margin-right: auto !important; }
    section:last-of-type {
        padding: 22px 0 130px 0!important;
    }
    .last-box {
        margin:0!important;
    }
    .background {
        background: url(../../shield500/images/desktop/background.webp);
        background-repeat: no-repeat;
        background-size: cover;
    }

    .steps-section {
        background: url(../images/mobile/got_covered_background.webp) lightgray 50% / cover no-repeat;
    }
    .rounded-boxes-2 {
        background: url(../images/mobile/got_covered_background.webp) lightgray 50% / cover no-repeat;
    }

    .background-bottom {
        height: 500px!important;
    }

    .prizes-three > .col-md-4 {
        display: flex;      /* makes inner box stretch */
    }


    .rounded-boxes-2 {
        display: flex;
        flex-direction: column;
        justify-content: flex-start; /* content stays at top */
        width: 100%;
    }

    .rounded-boxes-2 {
        display: flex;
        flex-direction: column;
    }


    .rounded-boxes-2 .icon-box {
        margin-top: auto;  /* push the text content to bottom if icon should align at top */
    }

    .font-size-18 {
        font-size:17px!important;
        color: #000000!important;
    }


    .header {
        line-height: 70px !important;
        font-size: 50px !important;
        font-weight: 700 !important;
    }

    .sub-header {
        line-height: 60px !important;
        font-size: 47px !important;
    }

    .prizes-three .rounded-boxes {
    justify-content: start !important;
    }
}

.prizes-three .rounded-boxes-inner {
    background: rgba(255, 255, 255, 0.40)!important;
    color: #227EC7;
    text-align: center;
    font-family: "Open Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}


/*HOWTO SECTION*/


.howto-section p {
    font-weight: 600;
    color: #ffffff;
}

.howto-section .number {
    background: #414141;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    display: flex;
}

.howto-section .number p {
    margin: 0;
    color: #ffffff;
}

.howto-section .rounded-boxes .fs-5 {
    color: #414141;
}


@media (max-width: 700px) {
    .icon-box {
        margin-top:0!important;

    }
}

.leaderboard-table th {
    font-size: 15px;

    @media (min-width: 992px) {
        font-size: 18px;
    }

    vertical-align: top;
}

@media (max-width: 575.98px) {
    .btn.btn-primary {
        margin-top: 0px !important;
    }
    .header {
        font-size:40px!important;
        line-height: 40px!important;
    }
    .sub-header {
        font-size:30px!important;
        line-height: 40px!important;
    }
    .icons {
        width: 90px;
        height: 90px;
        aspect-ratio: 1/1;
    }
}