WebHero - 6 - Layout responsive styling

layout.pcss

  .main-content {
    @apply flex flex-col;
  }

  .ads {
    @apply flex-auto;
    min-width: 120px;
    min-height: 100px;
    max-width: 100%;
    max-height: 100px;
  }

  main {
    @apply flex-auto;
  }

  @screen sm {
    .main-content {
      @apply flex-row;
    }

    .ads {
      max-width: 320px;
      max-height: 100%;
    }
  }