@keyframes rotateAroundY {
    from { transform: rotateY(0deg); }
    to   { transform: rotateY(360deg); }
}

@keyframes rainbowRoad {
    to {
        background-position: 400% 0 !important;
    }
}

body {
    font-family: "Comic Sans MS", "Comic Sans", sans-serif !important;
}

a {
    background: linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(255,154,0,1) 10%, rgba(208,222,33,1) 20%, rgba(79,220,74,1) 30%, rgba(63,218,216,1) 40%, rgba(47,201,226,1) 50%, rgba(28,127,238,1) 60%, rgba(95,21,242,1) 70%, rgba(186,12,248,1) 80%, rgba(251,7,217,1) 90%, rgba(255,0,0,1) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    -moz-background-clip: text !important;
    -moz-text-fill-color: transparent !important;
    animation: rainbowRoad 8s linear infinite !important;
}

a:hover {

}

.dominant-speaker {
    box-shadow: inset 0px 0px 0px 4px rgba(255,0,255,0.33) !important;
}

.display-avatar-only {
    background-image: url("");
}

.videocontainer:nth-child(odd) {
    transform: rotate(1.5deg);
}

.videocontainer:nth-child(even) {
    transform: rotate(-1.3deg);
}

#largeVideoContainer.videocontainer {
    transform: none;
}

.sideToolbarContainer {
    transform: rotate(-1.1deg);
}

.displayname:before {
    content: "♡︎ ";
}

.displayname:after {
    content: " ♡︎";
}

.avatar, .userAvatar {
    transform: rotateY(0deg);
}

.avatar:hover, .userAvatar:hover {
    animation: rotateAroundY 3.6s linear infinite;
}