.HEADER {
    width: 100%;
    margin-bottom: 1em;
    border: 1px solid;
    border-radius: 1em;
    display: grid;
    grid-template-columns: 60% 40%;
    grid-gap: 0;
    grid-auto-rows: minmax(0, auto);  
}


.HEADER .HEADSCREENSHOT {
    border-radius: 1em 0 0 1em;
    grid-column: 1;
    grid-row: 1 / span 3;
    position: relative;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    overflow: hidden;
}

.HEADER .HEADSCREENSHOT>img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0;
}



.HEADER .LOGO {
    grid-column: 2;
    grid-row: 1 / span 1;
    text-align: right;
}

.HEADER .LOGO>img {
    padding: 0.5em;
    max-width: 100%;
}

.HEADER .HEADINFOTEXT {
    grid-column: 2;
    grid-row: 2 / span 1;
    margin: 5px;
}

.HEADINFOTEXT_TABLE {
    width: 100%;
    float: right;
    border-collapse: collapse;
}

.HEADER .HEADINFOTEXT_TABLE td {
    border-bottom: 1px solid;
}

.HEADER .HEADINFOTEXT_TABLE td:nth-child(odd) {
    font-weight: bold;
}

.HEADER .HEADINFOTEXT_TABLE td:empty {
    margin: 0;
    padding: 0;
    border: none;
}

.HEADER .COMMENT {
    margin: 5px;
    grid-column: 2;
    grid-row: 3 / span 1;
}

.HEADER .COMMENT_NAME {
    font-weight: bold;
    border-bottom: 1px solid;
}

.HEADER .COMMENT p {
    margin: 0;
}