.reports-grid-block{
  padding: 1rem;
  border: 1px solid var(--border-color-grey);
}

@media screen and (min-width: 768px){
  .reports-grid-block{
    padding: 2.5rem;
  }
}

.reports-grid-block.reports-grid-block-lottie{
  display: flex;
  justify-content: space-between;
}

.reports-block-lottie .lottie-animation-container{
  width: 80px;
  margin-top: 35px;
}

.reports-grid-block-lottie .reports-block-content{
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.reports-grid-block-embedded label{
  margin-top: 10px;
  display: block;
}

.reports-grid-block:not(.reports-grid-first-block) .lottie-animation-container{
  width: 80px;
}

@supports (display: grid){
  .reports-grid-container .reports-grid-block:nth-child(1){
    grid-area: block-1;
  }

  .reports-grid-container .reports-grid-block:nth-child(2){
    grid-area: block-2;
  }

  .reports-grid-container .reports-grid-block:nth-child(3){
    grid-area: block-3;
  }

  .reports-grid-container{
    grid-gap: 1.5rem;
    display: grid;
    grid-template-columns: 1;
    grid-template-rows: auto;
    grid-template-areas: 
      "block-1" 
      "block-2"
      "block-3";
  }

  @media screen and (min-width: 768px){
    .reports-grid-container{
      grid-gap: 1.5rem;
      display: grid;
      grid-template-columns: 60% auto;
      grid-template-rows: max-content;
      grid-template-areas: 
        "block-1 block-1 block-2" 
        "block-1 block-1 block-3";
    }

    .reports-grid-container .reports-grid-block:nth-child(1){
    }
  }
}

@supports not (display: grid) {
  @media screen and (min-width: 768px){
    .reports-grid-container{
      display: flex;
      flex-wrap: wrap;
      justify-content: space-bwteen;
    }

    .reports-grid-container .reports-grid-block:nth-child(1){
      width: 100%;
      margin-bottom: 30px;
    }

    .reports-grid-container .reports-grid-block:nth-child(2),
    .reports-grid-container .reports-grid-block:nth-child(3){
      width: calc((100% - 30px) / 2);
    }

  }
}