.hne-event {
    max-width: 550px;
    @media only screen and (min-width: 782px) {
        margin-left: auto;
    }
    .event-wrapper {
        background-color: var(--wp--preset--color--white);
        border: 1.5px solid var(--wp--preset--color--separator-gray);
        padding: 34px 28px;
        font-weight: 700;

        .date {
            font-size: var(--wp--preset--font-size--p-2-manrope);
            line-height: 133.333%;
            letter-spacing: 0.36px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            &:after {
                content: '';
                background-image: url("data:image/svg+xml, %3Csvg%20width=%2216%22%20height=%2216%22%20viewBox=%220%200%2016%2016%22%20fill=%22none%22%20xmlns=%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d=%22M16%2013.4536L13.4666%2016V4.33449L1.78752%2016L0.00282745%2014.2023L11.6655%202.53396H0L2.5334%200H15.9994V13.4536H16Z%22%20fill=%22%23333333%22%2F%3E%0A%3C%2Fsvg%3E%0A");
                background-repeat: no-repeat;
                min-width: 16px;
                min-height: 16px;
            }
        }

        .title {
            font-size: 22px;
            font-weight: 600;
            line-height: 145.455%;
        }

        .image {
            overflow: hidden;
            margin: 22px 0;
        }

        a {
            color: var(--wp--preset--color--gray-text);
            transition:0.3s;
            &:hover {
                text-decoration: none;
            }
        }

        .details {
            font-size: var(--wp--preset--font-size--p-4-manrope);
            margin-top: 32px;
            @media only screen and (min-width: 461px) {
                display: flex;
                align-items: end;
                justify-content: space-between;
            }
        }
    }
}