.heero-grid{ }
.heero-grid .row{ display: flex; flex-wrap: wrap; margin: 0 -15px;}
.heero-grid .row *[class^='col-'], .heero-grid .row .col{ padding: 0 15px; width: 100%;}
.heero-grid .row .col-6:first-child{ margin-bottom: 2.5em;}

.mt-25{ margin-top: 25px;}
.mt-50{ margin-top: 50px;}
.mt-100{ margin-top: 100px;}

.mb-25{ margin-bottom: 25px;}
.mb-50{ margin-bottom: 50px;}
.mb-100{ margin-bottom: 100px;}

.visible-desk{ display: none;}
.visible-mobile{ display: block;}
.unvisible-desk{ display: block;}
.unvisible-mobile{ display: none;}


@media screen and (min-width: 600px) {

}

@media screen and (min-width: 768px) {
    /*
    .heero-grid .row .col-6{ width: 50%;}
    .heero-grid .row .col-6:first-child{ margin-bottom: 0;}
    */
}

@media screen and (min-width: 900px) {

}

@media screen and (min-width: 768px) {
    .visible-desk{ display: block;}
    .visible-mobile{ display: none;}
    .unvisible-desk{ display: none;}
    .unvisible-mobile{ display: block;}
}