.cta-block {
    @apply mb-16;
    @apply lg:relative;
    @apply sm:grid;
    @apply lg:block;
    @apply sm:grid-flow-row;
    @apply lg:grid-rows-none;

    .wrap-image {
        @apply w-full;
        @apply lg:w-1/2;
        @apply h-96;
        @apply lg:h-auto;
        @apply lg:absolute;
        @apply lg:right-0;
        @apply lg:top-0;
        @apply lg:bottom-0;

        &:before {
            content: url(/assets/img/square-dots.svg);
            @apply hidden lg:block;
            @apply absolute;
            @apply top-16 left-2;
            width: 157px;
            height: 131px;
        }

        &:after {
            content: url(/assets/img/triangle-big.svg);
            @apply hidden lg:block;
            @apply absolute;
            @apply top-64 left-16;
            width: 66px;
            height: 66px;
        }

        .picture {
            @apply w-auto;
            @apply h-full;

            @screen lg {
                clip-path: polygon(20% 0, 100% 0, 100% 100%, 0% 100%);
            }

            img {
                @apply w-full;
                @apply h-full;
                object-fit: cover;
            }
        }
    }

    .uhasselt-container {
        .column {
            @apply py-8 pl-8 w-full;

            &.has-image {
                @apply lg:w-1/2;
            }

            .heading {
                @apply mb-8;
            }

            .paragraph-intro {
                @apply mb-10;
            }

            .button-wrap {
                @apply flex;
                @apply flex-wrap;

                .button {
                    @apply mr-4;
                }
            }

            .email-wrap {
                .usp-list {
                    @apply p-0;
                    @apply mb-8;
                }

                .text {
                    @apply w-full;
                    @apply block;
                    @apply text-md;
                    @apply mb-1;
                }
            }
        }
    }

    &.red {
        @apply bg-red;
        @apply text-white;

        .heading.text-red {
            @apply text-white;
        }

        a {
            @apply text-white underline;
        }

        .wrap-image:before {
            content: url(/assets/img/square-dots-white.svg);
        }
    }
}
