.romani-block-banner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.romani-block-banner .main-block {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 16px;
}
/*.romani-block-banner .main-block .arrow {*/
/*    flex: 36px 0 0;*/
/*    height: 36px;*/
/*    margin-right: 10%;*/
/*    background-image: url('img/square_arrow.svg');*/
/*    background-size: contain;*/
/*    background-repeat: no-repeat;*/
/*    transition: all .4s ease-in-out;*/
/*}*/
/*.romani-block-banner:hover .arrow {*/
/*    transform: rotate(90deg);*/
/*}*/
.romani-block-banner .main-block .text-block {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.romani-block-banner .main-block .text-block h5,
.romani-block-banner .main-block .text-block p,
.romani-block-banner .main-block .text-block .block-button-wrapper span {
    color: white;
    font-family: "Roboto", sans-serif;
}
.romani-block-banner .main-block .text-block h5,
.romani-block-banner .main-block .text-block p {
    font-size: 24px;
    margin: 0;
}
.romani-block-banner .main-block .block-button-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: auto;
}
.romani-block-banner:hover .main-block .text-block .block-button-wrapper {
    -webkit-filter: invert(0.5);
    filter: invert(0.5);
}
.romani-block-banner .main-img {
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
    height: calc(330px / 2);
    margin-bottom: 16px;
    background-size: cover;
    background-position: center;
}
.romani-block-banner .short-img {
    width: 100%;
    height: 166px;
    background-size: cover;
    background-position: center;
}
.romani-block-banner > div:last-of-type:not(.main-img) {
    display: none;
}
/* ordeing fallback */
.romani-block-banner .first,
.romani-block-banner .second,
.romani-block-banner .third,
.romani-block-banner .fourth {
    -webkit-box-ordinal-group: NaN;
    -webkit-order: unset;
    -ms-flex-order: unset;
    order: unset;
}

/* media query */
@media screen and (min-width: 600px) {
    .romani-block-banner .main-img {
        height: calc(330px / 1.5);
    }
}
@media screen and (min-width: 800px) {
    .romani-block-banner .first {
        -webkit-box-ordinal-group: 1;
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
    }
    .romani-block-banner .second {
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
        -ms-flex-order: 1;
        order: 1;
    }
    .romani-block-banner .third {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -ms-flex-order: 2;
        order: 2;
    }
    .romani-block-banner .fourth {
        -webkit-box-ordinal-group: 4;
        -webkit-order: 3;
        -ms-flex-order: 3;
        order: 3;
    }
    .romani-block-banner {
        height: 512px;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
        align-content: space-between;
    }
    .romani-block-banner.minimal {
        height: 324px;
    }
    .romani-block-banner .main-block,
    .romani-block-banner .main-img {
        width: calc(50% - 8px);
        height: calc(65% - 8px);
        margin: 0;
    }
    .romani-block-banner.minimal .main-block,
    .romani-block-banner.minimal .main-img {
        height: 100%;
    }
    .romani-block-banner .main-block .arrow {
        -webkit-flex-basis: 78px;
        -ms-flex-preferred-size: 78px;
        flex-basis: 78px;
        height: 78px;
    }
    .romani-block-banner .main-block .text-block h5,
    .romani-block-banner .main-block .text-block p {
        font-size: 35px;
    }
    .romani-block-banner div.short-img[style] {
        display: block;
        width: calc(50% - 8px);
        height: calc(35% - 8px);
    }
}