.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background-color:var(--invitation-bg);
}
.loading {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font: 14px arial;
    color: var(--counter-bg);
}
.bg-navigation{
    background-color: var(--invitation-bg);
}
.bg-invitation{
    background-image: var(--invitation-bg-gradient);
}
#modalInvitation .modal-content{
    background-image: var(--invitation-bg-gradient);
}
html body{
    background-color: var(--bs-primary-light);
    font-family: 'Cabin', sans-serif;
    color: var(--bs-primary);
}
.font-title{
    font-family: 'Arizonia', cursive;
}
#cover .title, #modalInvitation .title{
    font-size: 48px !important;
}
.badge-countdown{
    background-color: var(--bs-primary);
}
.splide__arrow {
    background: var(--bs-primary);
}
.splide--nav>.splide__slider>.splide__track>.splide__list>.splide__slide.is-active, .splide--nav>.splide__track>.splide__list>.splide__slide.is-active {
    border: 3px solid var(--bs-primary);
}
.splide__arrow svg {
    fill: var(--bs-primary-light);
}
.form-control.form-control-solid {
    background-color: var(--bs-primary-light);
    border-color: var(--bs-primary-light);
    /* color: var(--); */
    transition: color 0.2s ease, background-color 0.2s ease;
}
.dropdown.show > .form-control.form-control-solid, .form-control.form-control-solid:active, .form-control.form-control-solid.active, .form-control.form-control-solid:focus, .form-control.form-control-solid.focus {
    background-color: var(--bs-primary-light);
    border-color: var(--bs-primary-light);
    /* color: var(--bs-primary-light); */
}
#kt_content{
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: contain;
}
.card{
    border-radius: 20px;
    box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 30%);
    overflow: hidden;
}
.bg-card{
    background-image: url("/themes/lovely-pastel-publish/img/assets/Asset 3.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 2.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 6.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 7.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 10.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 11.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 4.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 8.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 9.png");
        background-repeat: no-repeat;
        background-size: 40%,40%, 60%, 40%, 40%, 60%, 30%, 20%, 40%;
        background-position:
                            top -70px left -100px,
                            top -70px left -70px,
                            top -10px right -70px,
                            top -20px right -100px,
                            bottom -10px right -130px,
                            bottom -10px right -60px,
                            bottom -50px right -90px,
                            bottom -10px left -10px,
                            bottom -30px left -90px;
    /* padding-bottom: 75px;
    padding-top: 50px; */
}
.bg-avatar .symbol{
    box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 30%);
    /* border: 7px solid var(--bs-primary); */
}

#modalInvitation .bg-card{
    background-size: 20%,20%, 40%, 20%, 20%, 40%, 18%, 10%, 20%;
}
@media (max-width: 991.98px){
    .card{
        border-radius: 20px;
        box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 30%);
    }
    .bg-card{
        background-image: url("/themes/lovely-pastel-publish/img/assets/Asset 3.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 2.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 6.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 7.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 10.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 11.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 4.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 8.png"),
                        url("/themes/lovely-pastel-publish/img/assets/Asset 9.png");
        background-repeat: no-repeat;
        background-size: 50%,50%, 80%, 60%, 60%, 80%, 50%, 30%, 50%;
        background-position:
                            top -70px left -100px,
                            top -70px left -70px,
                            top -10px right -70px,
                            top -20px right -100px,
                            bottom -10px right -130px,
                            bottom -10px right -60px,
                            bottom -50px right -90px,
                            bottom -10px left -10px,
                            bottom -30px left -90px;
    }
    #modalInvitation .bg-card{
        background-size: 50%,50%, 80%, 60%, 60%, 80%, 50%, 30%, 50%;
    }
}
.bg-paper{
    background-image: url("/themes/lovely-pastel-publish/img/cream-paper.png");
    padding-bottom: 75px;
    padding-top: 50px;
}