main .directions {
    display: flex;
    gap: var(--mainpadding);

    > *{
        flex: 0 0 calc(33% - var(--mainpadding));
    }
    .direction{
        border-radius: var(--border-radius);
        border: var(--mainborder);
        border-color: var(--wp--preset--color--mid);

        figure{
            background-color: var(--wp--preset--color--ci);
            
            iframe{
                aspect-ratio: 16 / 9;
                width: 100%;
                height: auto;
                filter: grayscale(1);
                mix-blend-mode: screen;

            }
        }

        h3{
            color: var(--wp--preset--color--ci);
            padding: calc(var(--mainpadding) / 5) calc(var(--mainpadding) / 3);
            font-size: clamp(1.25em, 5dvw, 2.25em);
            margin: 0;
        }

        address{
            font-style: normal;
            padding: calc(var(--mainpadding) / 5) calc(var(--mainpadding) / 3);
        }

        svg{
            margin-right: 5px;
            top: 3px;
            position: relative;
        }
    }
}

@media screen and (max-width: 990px){

    main .directions {
        flex-direction: column;
    }
    
}