body {
    font: 18px/1.5 sans-serif;
    margin: 0;
    overflow-x: hidden;
}

.content {
    width: 100vw;

    @media (orientation: landscape) {
        .wrapper {
            display: flex;
        }

        .container.left {
            flex: 1 1 auto;
            height: 100vh;

            img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }
        }

        .container.right {
            flex: 1 1 600px;

            .content-wrapper {
                padding-left: 1em;
                margin: 2em;
                border-left: 2px solid #ebebeb;
            }
        }
    }

    @media (orientation: portrait) {
        .container.left {
            width: 100vw;
            height: 100vh;

            img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }
        }

        .container.right {
            .content-wrapper {
                h1 {
                    position: absolute;
                    left: 0;
                    top: 0;
                    right: 0;
                    text-align: center;
                }

                div {
                    display: none;
                }
            }
        }
    }
}
