biztime-web/wp-content/themes/kolarix-biztime/css/main.scss

#main {
    min-height: 100vh;
}

// Content

.section {
    text-align: center;
    height: 100%;

    @media screen and (min-width: 991px) {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 100vh;
        text-align: left;
    }

    .article {
        width: 100%;

        @media screen and (min-width: 991px) {
            height: 100%;
        }

        &.content {
            h1 {
                @media screen and (min-width: 991px) {
                    display: flex;
                    align-items: center;
                    height: 100%;
                    max-height: calc(50% - 50px);
                }
            }
            .wp-block-pullquote {
                padding-bottom: 20px;
                margin-right: var(--gap);
            }

            .table-availability {
                margin-bottom: 30px;

                caption {
                    font-size: 24px;
                }
            }
        }
    }

    .media {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;

        @media screen and (max-width: 990px) {
            margin-top: 60px;
        }

        .availability-checker {
            position: relative;

            @media screen and (min-width: 991px) {
                margin-left: var(--gap);
                letter-spacing: 2px;
            }

            .wp-tag {
                position: absolute;
                top: 0;
                left: 0;
            }

            h2 {
                padding: var(--gap) 0;

                @media screen and (min-width: 991px) {
                    display: flex;
                    align-items: center;
                    padding: 0;
                    height: 100%;
                    max-height: calc(50% - 50px);
                }
            }

            .checker-demo {
                text-align: center;

                .primary {
                    margin-right: 10px;

                    @media screen and (max-width: 990px) {
                        padding: 10px 15px;
                    }
                }

                .sm-grey {
                    display: inline-block;
                }
            }

            .wp-block-image {
                margin: 30px auto 0;

                img {
                    margin: 0 auto;
                }
            }

            @media screen and (min-width: 768px) and (max-width: 990px) {
                > *:not(figure) {
                    max-width: calc(50% - 30px);
                    width: 100%;
                }

                > .wp-block-image {
                    float: right;
                    margin-top: -25%;
                }
            }
        }
    }
}

// Footer
.footer {
    padding: var(--gap) 0;
    margin-top: 30px;
    background: #fff;

    @media screen and (min-width: 991px) {
        margin-top: 200px;
        margin-bottom: -200px;
    }

    &-credits {
        text-align: center;

        p + p {
            margin-top: 5px;
        }
    }
}