.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: white;
    border-radius: 30px !important;
    margin-bottom: 10px;
}
.bg-secondary{
    background-color: var(--bs-secondary) !important;
}
#modalInvitation .modal-content{
    background-color: var(--invitation-bg);
}
html body{
    background-color: var(--bs-primary);
    font-family: 'Poppins', serif;
    background-size: contain, contain;
    background-repeat: no-repeat, no-repeat;
    background-position: top right, bottom left;
    background-attachment: fixed;
}
.font-title{
    font-family: 'Arizonia', cursive;
}
#cover .title, #modalInvitation .title{
    font-size: 32px !important;
}
.badge-countdown{
    background-color: var(--bs-text-light);
}
#countdown .badge-primary{
    background-color: var(--bs-text-light) !important;
    padding: 15px;
}
.label-countdown{
    margin-left: 0;
}
.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: url(/themes/elegant-rose/img/asset-2.png);
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}
.card-transparant{
    background-color: var(--invitation-bg);
    border-radius: 5px;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 30%);
    color: var(--bs-primary);
    background-image: url(/themes/elegant-rose/img/asset-1-1.png);
    background-position: center;
    background-size: 50%;
    background-repeat: no-repeat;
    opacity: .2;
}
.bg-avatar .symbol{
    box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 30%);
    border: 4px solid var(--bs-primary);
}
.btn-primary, .btn-primary .bi,.btn-primary .fas{
    color: var(--invitation-bg) !important;
}
.badge-primary{
    color: var(--invitation-bg) !important;
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: white !important;
    border-radius: 10px;
}
.svg-icon.svg-icon-primary svg [fill]:not(.permanent):not(g) {
    fill: var(--invitation-bg) !important;
}
.splide__arrow svg {
    fill: var(--invitation-bg) !important;
}
.bg-cover {
    opacity: 0.11;
}
.timeline .timeline-line {
    border-left-color: var(--bs-secondary);
}
.border-secondary {
    border-color: var(--bs-secondary) !important;
}
.btn.btn-secondary {
    color: #FFFFFF;
    border-color: var(--bs-secondary) !important;
    background-color: var(--bs-secondary) !important;
}
.rounded{
    border-radius: 30px !important;
    overflow: hidden;
}
.rounded-sm{
    border-radius: 10px !important;
}
.text-light{
    color: var(--bs-text-light) !important;
}
.animate-zoom-in-out{
    animation: zoom-in-zoom-out 2s ease infinite;
    transform-origin: bottom center;
}
.bg-invitation{
    background-color: var(--invitation-bg);
}
.bg-invitation-light{
    background-color: var(--invitation-bg-light);
}
.btn-primary, .btn-primary .bi, .btn-primary .fas {
    color: white !important;
}
.square-top{
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}
.square-bottom{
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
@keyframes zoom-in-zoom-out {
    0% {
      transform: scale(1.2, 1.2);
    }
    50% {
      transform: scale(1, 1);
    }
    100% {
      transform: scale(1.2, 1.2);
    }
}
li.splide__slide {
    width: 100px;
    height: 100px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 10px !important;
}
.splide--nav>.splide__slider>.splide__track>.splide__list>.splide__slide, .splide--nav>.splide__track>.splide__list>.splide__slide{
    border: 0px;
}
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);
}
#ig-story .font-title.text-primary{
    color: var(--bs-secondary) !important;
}
#ig-story a.btn.btn-primary.btn-flex.flex-column.w-100.mb-5.fs-7{
    background-color: var(--bs-secondary);
    color: var(--bs-primary);
}
#ig-story a.btn.btn-primary.btn-flex.flex-column.w-100.mb-5.fs-7 span{
    color: var(--bs-primary) !important;
}
#capture.frame, #capture.frame .text-primary{
    color: var(--bs-text-light) !important;
}
.btn.btn-primary .svg-icon svg [fill]:not(.permanent):not(g) {
    transition: fill 0.3s ease;
    fill: #FFFFFF;
}

.btn.btn-primary:hover:not(.btn-active) .svg-icon svg [fill]:not(.permanent):not(g){
    transition: fill 0.3s ease;
    fill: #FFFFFF;
}