
#content > div#div_brdf {
    padding: 0;
}
#embed_brdf {
    border-radius: 5px;
}

#content {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 10px;
    grid-template-areas:
      "heightfield  hist          g1_2d    g1_derivative brdf brdf"
      "rendered_top rendered_side g1_error g1_error      brdf brdf"
      "ndf_2d       ndf           g1_error g1_error      brdf brdf";
}

#content > div {
    min-height: 0px;
    min-width: 0px;
    background: white;
    padding: 5px;
    border-radius: 5px;
}


#content img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 5px;
    display: block;
    object-fit: contain;
}

#div_g1_error {
    position: relative;
}

#div_heightfield {
    grid-area: heightfield;
    display: flex;
    justify-content: center;
}
#div_rendered_top {
    grid-area: rendered_top;
}
#div_rendered_side {
    grid-area: rendered_side;
}
#div_fft {
    grid-area: fft;
}
#div_ndf_2d {
    grid-area: ndf_2d;
}
#div_ndf {
    grid-area: ndf;
}
#div_hist {
    grid-area: hist;
}
#div_g1_2d {
    grid-area: g1_2d;
}
#div_g1_derivative {
    grid-area: g1_derivative;
}
#div_g1_error {
    grid-area: g1_error;
}
#div_brdf {
    grid-area: brdf;
}


/* ------------------------------------------------------------------------- */
/* --------------------------------- FOOTER -------------------------------- */
/* ------------------------------------------------------------------------- */

footer {
    right: 10px;
}