.screeninfo_container {
    width: 100% !important;
    margin: 0 auto;
    max-width: 100% !important;
}

.screeninfo {
    /*border: 1px solid var(--border-tab-color);
    border-radius: 5px;*/
    background-color: #2D3035;
    margin-bottom: 20px;
    padding: 0px !important
}

.screeninfo_name {
    font-size: var(--text-lg);
    color: var(--ticket-color);
    font-weight: bold !important;
    text-align: center;
    margin-top: 10px !important;
}

.screeninfo_capacity {
    font-size: var(--text-md);
    font-weight: bold !important;
    color: var(--text-color);
    line-height: 60px;
    vertical-align: middle;
}

.screeninfo_screenDimension {
    font-size: var(--text-md);
    font-weight: bold !important;
    color: var(--text-color);
    line-height: 60px;
    vertical-align: middle;
}

.screeninfo_vIP {
    font-size: var(--text-lg);
    color: var(--text-color);
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.screeninfo_details {
    margin-bottom: 10px;
}

.screeninfo_detail {
    font-size: var(--text-sm);
    color: var(--text-color);
    font-family: var(--roboto-condensed-thin) !important;
}

.screeninfo_detail div {
    padding: 0px;
}

.screeninfo_icon {
    text-align: right;
    font-size: 40px;
}

.screeninfo_headline {
    font-size: var(--text-xl);
    color: var(--text-color);
    width: 80%;
}

.screeninfo_image {
    padding-left: 0px !important;
    padding-right: 0px !important;
    position: relative;
}

.screeninfo_image img {
    aspect-ratio: 16/9;
    max-width: 100%;
    margin-left: 0px;
    margin-right: 0px;
}

.screeninfo_row {
    gap: 0px;
}

.screeninfo_details,
.soundinfo_details {
    font-size: 15px;
    font-weight: normal;
    line-height: 1.2;
    margin-top: -18px !important;
}

.soundinfo_details {
    padding-bottom: 20px;
}

.screeninfo_attribute {
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    font-size: var(--text-xxs);
}

@media (min-width: 768px) and (max-width: 991px) {
    .screeninfo_container {
        /* width: 90% !important; */
    }

    .screeninfo {
        flex: 0 0 45% !important;
        /* Make each screen occupy 50% width */
        max-width: 45% !important;
    }

    .screeninfo_row {
        gap: 10px;
    }
}

@media (min-width: 992px) {
    .screeninfo_container {
        /* width: 80% !important;*/
    }

    .screeninfo {
        flex: 0 0 30% !important;
        /* Make each screen occupy 33.333333% width */
        max-width: 30% !important;
    }

    .screeninfo_row {
        gap: 10px;
    }
}