/**
 * @file
 * Responsive grid.
 *
 * Generic styling of the responsive grid for the platform and the samples.
 */

.views-responsive-grid {
  margin: 0 -10px;
}

  .views-responsive-grid .views-row {
    *zoom: 1;
    margin-top: 16px;
  }

  .views-responsive-grid .views-row:first-child {
    margin-top: 0;
  }

    .views-responsive-grid .views-row:before,
    .views-responsive-grid .views-row:after {
      content: ' ';
      display: table;
    }

    .views-responsive-grid .views-row:after {
      clear: both;
    }

      .views-responsive-grid [class*="views-column"] {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        width: 100%;
        padding: 0 10px;
      }

      .views-responsive-grid.views-columns-2 .views-column {
        width: 50%;
      }

      .views-responsive-grid.views-columns-3 .views-column {
        width: 33.3%;
      }

      .views-responsive-grid.views-columns-4 .views-column {
        width: 25%;
      }

@media (max-width: 767px) {
  .view-content .views-responsive-grid .els-panel {
    margin: 16px 0 0 0;
    padding: 16px 0 0 0;
    border-top-style: solid;
    border-top-width: 1px;
  }

    .view-content .views-responsive-grid .els-panel .els-panels-col-100 {
      padding: 0;
    }

      .views-responsive-grid .views-row {
        margin-top: 0;
      }

        .views-responsive-grid .views-row [class*="views-column"] {
          width: 100%;
        }

          .view-content .views-responsive-grid .views-row-1 .views-column:first-child .els-panel {
            margin-top: 0;
            padding-top: 0;
            border-top: none;
          }
}