/* Grid 12 Spalten */

.columns{
    float: left;
    padding: 0 1em;
    width: 100%;
}

.row{
    width: auto;
    max-width: 1140px;
    margin: 0 auto;
    padding: 1em 0;
}

.row:before, 
.row:after{
    content: '';
    display: table;
}

.row:after{
    clear: both;
}


/* Small 600px Breakpoint */
@media screen and (max-width: 37.5em) {
  .small-1 {
    width: 50%; }

  .small-2 {
    width: 100%; }

  .small-hide {
    display: none; } 
}


/* Medium 600px - 920px Breakpoint */
@media screen and (min-width: 37.5em) and (max-width: 57.5em) {
    
    .medium-1 {
    width: 16.66667%; }

  .medium-2 {
    width: 33.333333%; }

  .medium-3 {
    width: 50%; }

  .medium-4 {
    width: 66.66667%; }

  .medium-5 {
    width: 83.333333%; }

  .medium-6 {
    width: 100%; }
}


/* Medium ab 920px Breakpoint */
@media screen and (min-width: 57.5em) {
    .large-1 {
    width: 8.333333%; }

  .large-2 {
    width: 16.666666%; }

  .large-3 {
    width: 25%; }

  .large-4 {
    width: 33.333332%; }

  .large-5 {
    width: 41.66665%; }

  .large-6 {
    width: 50%; }

  .large-7 {
    width: 58.333331%; }

  .large-8 {
    width: 66.666664%; }

  .large-9 {
    width: 75%; }

  .large-10 {
    width: 83.33333%; }

  .large-11 {
    width: 91.666663%; }

  .large-12 {
    width: 100%; }
    
  .row{
    padding: 2em 0;
    }


}

/* Medium ab 1140px Breakpoint */
@media screen and (min-width: 73.750em) {
  .columns{
    padding: 0;
  }
}