/* inter-100 - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100;
    src: url('Fonts/inter-v20-latin-100.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-200 - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 200;
    src: url('Fonts/inter-v20-latin-200.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-300 - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    src: url('Fonts/inter-v20-latin-300.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-regular - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    src: url('Fonts/inter-v20-latin-regular.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-500 - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    src: url('Fonts/inter-v20-latin-500.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-600 - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    src: url('Fonts/inter-v20-latin-600.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-700 - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    src: url('Fonts/inter-v20-latin-700.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-800 - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 800;
    src: url('Fonts/inter-v20-latin-800.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-900 - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 900;
    src: url('Fonts/inter-v20-latin-900.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* Jonitha Script - latin */
@font-face {
    font-display: swap;
    font-family: 'Jonitha Script';
    font-style: normal;
    font-weight: 400;
    src: url('Fonts/headline/headline-webfont.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


.radius-20 {
    border-radius: 20px;
}

.ff-js {
    font-family: 'Jonitha Script', cursive;
}

.headline {
    font-family: 'Jonitha Script', cursive;
    font-weight: 400;
    font-size: 2.5rem;
}

html,
body {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 1.125rem;
}

.text-blue {
    color: #153D8A;
}

.placeholder-image {
    background: #D9D9D9;
    height: 626px;
    width: 100%;
}

.partner-logo {
    width: 8.188rem;
    aspect-ratio: 1;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.partner-logo:hover {
    transform: scale(1.1);
}

.btn-santaclaus {
    position: relative;
    background-color: #153D8A;
    color: #ffffff;
    font-size: 1.25rem;
    border-radius: 100px;
    height: auto;
    width: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
}

.btn-santaclaus a {
    color: var(--bs-light);
    padding: 1rem;
}

@media (min-width: 768px) {
    .btn-santaclaus a.btn-santaclaus-insta {
        border-top-left-radius: 100px !important;
        border-bottom-left-radius: 100px !important;
        border-right: 1px solid #ffffff;
    }

    .btn-santaclaus a.btn-santaclaus-facebook {
        border-top-right-radius: 100px !important;
        border-bottom-right-radius: 100px !important;
        border-left: 1px solid #ffffff;
    }

    .btn-santaclaus a.btn-santaclaus-facebook:hover {
        border-top-right-radius: 100px !important;
        border-bottom-right-radius: 100px !important;
    }
}

.btn-santaclaus picture {
    position: absolute;
    top: -40px;
    right: -20px;
    width: 96px;
    transition: transform 0.3s ease;
    z-index: 1;
}

.btn-santaclaus a:hover {
    background-color: #112E6C;
    color: #ffffff;
    text-decoration: none;
}

.btn-santaclaus:hover picture {
    transform: rotate(8deg);
}

.img-holder {
    margin: -1rem;
    position: relative;
    transition: transform 0.3s ease;
}

.img-holder .text-holder {
    position: absolute;
    bottom: 5rem;
    left: 1rem;
    right: 1rem;
    color: #ffffff;
    line-height: 1.1;
}

.img-holder:first-child .text-holder {
    transform: rotate(2.3deg);
    left: 2rem;
    right: 4rem;
    bottom: 2rem;
}

.img-holder:first-child:hover {
    transform: rotate(-2.3deg);
}

.img-holder:nth-child(2) .text-holder {
    transform: rotate(-2.24deg);
    left: 3rem;
    right: 2rem;
    bottom: 6rem;
}

.img-holder:nth-child(2):hover {
    transform: rotate(2.24deg);
}

.img-holder:last-child .text-holder {
    transform: rotate(4.14deg);
    right: 5rem;
    left: 3rem;
    bottom: 2rem;
}

.img-holder:last-child:hover {
    transform: rotate(-4.14deg);
}

.img-holder .text-holder p {
    font-size: 1rem;
}

@media (min-width: 768px) {
    .img-holder .text-holder p {
        font-size: 1.125rem;
    }

    .img-holder .text-holder {
        bottom: 2rem;
    }

    .img-holder:first-child .text-holder {
        bottom: 5rem;
        left: 6rem;
        right: 8rem;
    }

    .img-holder:nth-child(2) .text-holder {
        bottom: 7rem;
    }

    .img-holder:last-child .text-holder {
        right: 7rem;
        left: 4rem;
        bottom: 6rem;
    }
}

@media (min-width: 992px) {
    .img-holder:first-child .text-holder {
        bottom: 2rem;
        left: 2rem;
        right: 3rem;
    }

    .img-holder:nth-child(2) .text-holder {
        bottom: 3rem;
    }

    .img-holder:last-child .text-holder {
        right: 2rem;
        left: 1rem;
        bottom: 1rem;
    }
}

@media (min-width: 1400px) {
    .img-holder:first-child .text-holder {
        bottom: 2rem;
        left: 2rem;
        right: 4rem;
    }

    .img-holder:nth-child(2) .text-holder {
        bottom: 4rem;
    }

    .img-holder:last-child .text-holder {
        right: 4rem;
        left: 2rem;
        bottom: 2rem;
    }
}

.footer-wrap {
    position: relative;
    overflow: hidden;
}

@media (min-width: 1690px) {
    .footer-wrap {
        background-color: #153D8A;
    }
}

.footer-wrap footer {
    background-color: #153D8A;
    margin-top: 5rem;
    padding-top: 50px;
    padding-bottom: 10rem;
}

@media (min-width: 400px) {
    .footer-wrap footer {
        padding-bottom: 5rem;
    }
}

.footer-wrap footer .footer-logo {
    aspect-ratio: 1;
    height: 8.188rem;
    object-fit: contain;
}

.footer-wrap .cloud {
    position: absolute;
    top: 3rem;
    left: 0;
    width: 100%;
    height: auto;
    object-fit: fill;
    z-index: 1;
}

@media (min-width: 992px) {
    .footer-wrap .cloud {
        top: 0;
    }
}

@media (min-width: 1690px) {
    .footer-wrap .cloud {
        top: -30%;
    }
}

.footer-wrap .img-bottle {
    display: none;
}

@media (min-width: 992px) {
    .footer-wrap .img-bottle {
        display: inline-block;
        position: absolute;
        top: 0;
        right: 50px;
        width: auto;
        height: 100%;
        object-fit: contain;
        z-index: 2;
        transform: rotate(6.9deg) translateY(-1rem);
        padding-top: 1rem;
    }
}