.transition-container{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;position:fixed;top:0;background-color:rgba(0,0,0,.2);backdrop-filter:blur(12px);left:0;overflow:hidden;z-index:50}.bg-transition{transition:background-color 1s ease-in-out .5s,backdrop-filter 1s ease-in-out;background:hsla(0,13%,89%,.8);box-shadow:0 4px 6px rgba(0,0,0,.5);width:90vw;height:90vh;position:absolute}.icon-container{position:relative;transition:opacity 1s ease-in-out,transform 1s ease-in-out}.animate-sun{animation:sun-rise 1s forwards,2s infinite alternate}.animate-moon{animation:moon-rise 1s forwards,2s infinite alternate}@keyframes sun-rise{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes moon-rise{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.transition-to-night .bg-transition{background:rgba(0,0,0,.4);backdrop-filter:blur(12px)}.transition-to-day .bg-transition{background:hsla(0,0%,100%,.4);backdrop-filter:blur(12px)}.moon-icon,.sun-icon{font-size:2.5rem;border:none;outline:none}.sun-icon{color:#ddf50a}.moon-icon{color:hsla(0,0%,75%,.8)}