* {
    box-sizing:border-box;
}

img {
    max-width:100%;
}

body {
    overflow:hidden;
    margin:0px;
    background:#2f2f2f;
    font-family:'Courier New', Courier, monospace;
    min-width:100%;
}

.header {
    background:#1f1f1f;
    height:150px;
    margin:10px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
}

h1 {
    color:aliceblue;
}

.speaker-button {
    background:#4a4a4a;
    font-family:'Courier New', Courier, monospace;
    font-size:small;
    color:aliceblue;
}

.r-speaker {
    position:absolute;
    top:90px;
    right:8%;
}

.r-speaker.on {
    animation: quiet 1.5s infinite ;
}

.l-speaker {
    position:absolute;
    top:90px;
    left:8%;
}

.l-speaker.on {
    animation: quiet 1.5s infinite ;
}

.r-loud {
    opacity:0;
    position:absolute;
    top:50px;
    right:5%;
    rotate:-7deg;
}

.r-loud.on {
    animation: loud 1.5s infinite ;
}

.l-loud {
    opacity:0;
    position:absolute;
    top:50px;
    left:5%;
    rotate:7deg;
}

.l-loud.on {
    animation: loud 1.5s infinite ;
}


@keyframes loud {
    0% {
        opacity:0%;
    }

    1% {
        opacity:100%;
    }

    50% {
        opacity:100%;
    }

    51% {
        opacity:0%;
    }

    100% {
        opacity:0%;
    }
}

@keyframes quiet {
    0% {
        opacity:100%;
    }

    1% {
        opacity:0%;
    }

    50% {
        opacity:0%;
    }

    51% {
        opacity:100%;
    }

    100% {
        opacity:100%;
    }
}



.page-container {
    background:#2f2f2f;
    width:100%;
    height:80vh;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:15px;
    padding-top:190px;
}

.column {
    color:aliceblue;
    width:310px;
    height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:center;
}


.scroll-containers {
    background:#1f1f1f;
    height:60vh;
    width:314px;
    display:block;
    overflow:scroll;
    overflow-x:hidden;
}


.ticket {
    background:gray;
    border:solid #1f1f1f 5px;
    display:flex;
    height:100px;
    width:300px;
    justify-content:center;
    align-items:center;
}