/*CCSING footer*/

footer{
    padding: 0.5vh;
    background-color: var(--main-background-old);
    color: var(--fresh-theme); 
    display: flex;
    justify-content: space-between;
    gap: 10%;
    height: 5vh;
    box-sizing: border-box;
    font-size: 1.5vmin;
}

span.email > a{
    text-decoration: none;
    color: white; 
    transition: text-shadow 0.2s ease-in-out;
}

span.email > a:hover{
    color: var(--active-superior);
    text-shadow: 0px 0px 10px var(--active-theme), 
                 1px 1px 1px white,
                 -1px -1px 1px white;
}
span.KomorSite{
    color: rgb(212, 255, 20);text-shadow: 0px 0px 8px rgb(222, 252, 87);
    animation-name: komorSiteAnimation;
    animation-iteration-count: infinite;
    animation-duration: 5s;
}
.footerRight{
    font-weight: 700;
    word-break: keep-all;
    white-space:nowrap;
    display: flex;
    justify-content: right;
    flex-wrap: nowrap;
    flex-direction: column;
    text-align: right;
}
.footerRightTop{
    font-size: 135%;
    
}
.footerRightDown{
    border-top: 0.1vh solid white;
    color: black;
    font-size: 1.3vmin;
    font-weight: 400;
    opacity: 0.5;
    text-align: center;
}
.footerLeft{
    display: flex;
    flex-wrap: wrap;
}
.footerElement{
    padding: 0.5vmin;
    padding-left: 1vw;
    padding-right: 1vw;
    border-left: 0.1vw solid rgb(255, 255, 255);
    white-space: nowrap;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

@keyframes komorSiteAnimation {
    0% {color: rgb(212, 255, 20);text-shadow: 0px 0px 8px rgb(222, 252, 87);}
    20% {color: rgb(0, 255, 225);text-shadow: 0px 0px 8px rgb(104, 227, 243); }
    40% {color: rgb(153, 0, 255);text-shadow: 0px 0px 8px rgb(163, 75, 222); }
    60% {color: hotpink; text-shadow: 0px 0px 8px rgb(238, 31, 148); }
    80% {color: rgb(255, 136, 0);text-shadow: 0px 0px 8px rgb(225, 40, 12); }   
}