body {
    font-family: Arial, Helvetica, sans-serif;
    margin:  0;
    background-color: #FFF4EA;
    padding: 10px;
}

h2 {
    margin: 10px 0;
}

.event__header {
    margin: 0 auto;
    width: 100%;
    max-width: min(980px, calc(100% - 20px));
    padding: 10px;
}

.ads-banner {
    margin: 0 auto;
    width: 320px;
}

.event__wrapper {
    width: 100%;
    max-width: 980px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: center;
    margin: 0 auto;
}

.test_table {
    border: 2px solid #BF4646;

    th {
        border: 2px solid #BF4646;
        padding: 5px;

        &:first-child {
            text-align: left;
        }
    }

    .true {
        color: green;
    }

    .false {
        color: red;
    }

}

.clearBtn {
    border: 5px solid #7EACB5;
    background-color: #EDDCC6;
    width: 100px;
    height: 40px;
    cursor:  pointer;

    &:hover {
        border: 5px solid #EDDCC6;
        background-color: #BF4646;
    }
}

.event__container-wrapper {
    width: 100%;
}

.event__container {
    border: 5px solid #BF4646;
    border-radius: 5px;
    height: 500px;
    background-color: #EDDCC6;

    display: flex;
    justify-content: center;
    align-items: center;
}

.event__container-text {
    color: #BF4646;
    text-transform: uppercase;
    font-size: 50px;
    opacity: 0.4;
    text-align: center;
}

.event__container-output {
    display: flex;
    flex-direction: row;
    gap: 20px;
    flex-wrap: wrap;
    width: 100%;
}

.event__output {
    border: 5px solid #7EACB5;
    border-radius: 5px;
    height: 480px;
    width: 200px;
    padding: 10px;
    overflow-y: scroll;

    p {
        margin: 0;
    }

    ::-webkit-scrollbar {
        width: 50px;
    }

}