* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    background-color: black;
    color: white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.9rem;
    text-align: center;
}


.center {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.scroll-container {
    overflow: auto;
    white-space: nowrap;
    padding: 1rem;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scroll-container::-webkit-scrollbar, *::-webkit-scrollbar {
    display: none;
}

.scroll-container img {
    padding: 1rem;
}

img {
    width: 35vw;
    max-height: 90vh;
    transition: 2s;
}

img:hover {
    filter: drop-shadow(0px 0px 1rem tomato);
    border-radius: 50%;
}

.message:hover {
    border-radius: 0%;
}

video {
    width: 30vw;
}

.helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

p {
    visibility: hidden;
    opacity: 0;
    transition: 2s ease-in;
    text-align: center;
}


span:hover p {
    visibility: visible;
    opacity: 1;
}