:root {
    --inv-bg: #fff2dc;
    --inv-base: #600e10;
    --inv-accent: #c99e64;
    --inv-border: #f7daad;
    --menu-bg: #600e10;
    --menu-inactive: #ffffff;
    --menu-active: #c99e64;
    --btn-color: #ffffff;
    --font-base: "Work Sans", sans-serif;
    --font-accent: "Brigesta", serif;
    --font-latin: "English111 Vivace BT", cursive;
}

@keyframes left-right {
    0% {
        transform: translateX(8%);
    }
    100% {
        transform: translateX(0%);
    }
}

@keyframes right-left {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(8%);
    }
}

.left-right img {
    animation: left-right 3s ease-in-out infinite alternate;
}

.right-left img {
    animation: right-left 3s ease-in-out infinite alternate;
}

.frame-couple {position:relative; display: flex; align-items: center; justify-content: center;}

.frame-couple::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(assets/theme/frame-couple.webp);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.editor .frame-couple::after {z-index:-1}

.frame-cover, .cover .right-left {display: none;}
.cover .frame-cover {display: block;}
.cover .top-cover {top: 10%;}

@keyframes up-down {
    0% {
        transform: translateY(8%);
    }
    100% {
        transform: translateY(0%);
    }
}

@keyframes down-up {
    0% {
        transform: translateY(0%);
    }
    100% {
        transform: translateY(8%);
    }
}

@keyframes wave-left {
    0% {
        transform: rotate(-5deg);
    }
    100% {
        transform: rotate(1deg);
    }
}

@keyframes wave-right {
    0% {
        transform: rotate(5deg);
    }
    100% {
        transform: rotate(-1deg);
    }
}
.frame img.frame-tl {
height: 110% !important;
top: -10%;
bottom: 0;
    animation: up-down 3s ease-in-out infinite alternate;
animation-delay: 1s;
}
.frame img.frame-tr {
height: 110% !important;
top: -10%;
bottom: 0;
    animation: down-up 3s ease-in-out infinite alternate;
animation-delay: 1s;
}

.frame-tl.top-cover img {
transform-origin: left bottom;
margin-left: -5%;
animation: wave-left 4s ease-in-out infinite alternate;
}

.frame-tr.top-cover img {
transform-origin: right bottom;
margin-left: 5%;
animation: wave-right 4s ease-in-out infinite alternate;
}
    

        
        
        
        .font-brittany-signature {
            font-family: 'Brittany Signature';
            line-height: 1.6 !important;
        }
        .font-photograph-signature {
            font-family: 'Photograph Signature';
            line-height: 1.6 !important;
        }
        .font-heatwood {
            font-family: 'Heatwood';
            line-height: 3 !important;
        }
        #YTMusic {display: block}
