/* === This had to be defined - because a size can only be measured for block or inline elements === */

.av-layout-grid-container.container-grid-row .flex_cell {
  display: block;
  float: left;
}



/* === and maybe set the whole (grand-parent container )  to display: grid === */
#top .av-layout-grid-container.container-grid-row {
  display:  grid;
  grid-auto-flow: row;
  grid-template-columns: repeat(2, 1fr);
  
  /* === sometimes without visible effect - because cells got background too === */
  background-color: #0b2e97 !important ;
  /* === unless you set different align-items setting here than stretch === */
  align-items: stretch ; /* === this is default value === */

}

#top .av-layout-grid-container .flex_cell {
  width: unset;
}

.av-layout-grid-container.container-grid-row .flex_cell {
  display: block;
  float: left;
}

#top .my-responsive-container .flex_cell_inner .flex_column {
  width:unset !important;
  margin: 0;
}

#top .my-responsive-container {
  container-name: card;
  container-type: inline-size;
}

@container card (min-width: 700px) {
  .my-responsive-container .flex_cell_inner {
    display: grid !important;
    gap: 20px;
    grid-auto-flow: row;
    grid-template-columns: repeat(2,1fr);
  }
}

@container card (max-width: 699px) {
  .my-responsive-container .flex_cell_inner {
    display: grid !important;
    gap: 20px;
    grid-auto-flow: row;
    grid-template-columns: 1fr;
  }
}