/* Grid 2.8 */
* {
    box-sizing: border-box;
}
.container {
    max-width: 1160px;
    box-sizing: content-box;
    margin: 0 auto;
    padding: 0 20px;
}
.container--fluid {
    max-width: 100%;
}
.content {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0 -20px;
}
[class^="col"],
[class*=" col"] {
    margin: 0;
    padding: 0 20px;
}

/**
 * Container: No gaps
 * Removes all column gaps even those on the left and right
 * in medium and small viewports.
 */
.container--no-gaps {
    padding-left: 0;
    padding-right: 0;
}
.container--no-gaps .content {
    margin-left: 0;
    margin-right: 0;
}
.container--no-gaps [class^="col"],
.container--no-gaps [class*=" col"] {
    padding-left: 0;
    padding-right: 0;
}

/**
 * Content: No gaps
 * Removes all column gaps but keeps the gaps on the left and right
 * edge on medium and small viewports.
 */
.content--no-gaps {
    margin: 0 auto;
}
.content--no-gaps .content {
    margin: 0 auto;
}
.content--no-gaps [class^="col"],
.content--no-gaps [class*=" col"] {
    padding-left: 0;
    padding-right: 0;
}

/**
 * Content: Reduce Gaps
 */
 .content--reduce-gaps,
 .content--reduce-gaps .content        { margin: 0 -10px }
 .content--reduce-gaps [class^="col"],
 .content--reduce-gaps [class*=" col"] { padding: 0 10px }

/**
 * Content: Alignments
 */
.content--halign-right {
    justify-content: flex-end;
}
.content--halign-left {
    justify-content: flex-start;
}
.content--halign-center {
    justify-content: center;
}
.content--valign-top {
    align-items: flex-start;
}
.content--valign-center {
    align-items: center;
}
.content--valign-bottom {
    align-items: flex-end;
}

/**
 * Column: No gaps
 */
.col--no-gaps {
    padding-left: 0;
    padding-right: 0;
}
.col--no-gaps-left {
    padding-left: 0;
}
.col--no-gaps-right {
    padding-right: 0;
}

/**
 * Column: Alignments
 */
.col--valign-bottom {
    align-self: flex-end;
}
.col--valign-top {
    align-self: flex-start;
}
.col--valign-center {
    align-self: center;
}


/**
 * Column and shift widths
 */
.col1    { width:         8.333333333333334%  } /* (100% / (12 / 1)) */
.shift1  { margin-left:   8.333333333333334%  }
.col2    { width:        16.666666666666668%  } /* (100% / (12 / 2)) */
.shift2  { margin-left:  16.666666666666668%  }
.col3    { width:        25%                  } /* (100% / (12 / 3)) */
.shift3  { margin-left:  25%                  }
.col4    { width:        33.333333333333336%  } /* (100% / (12 / 4)) */
.shift4  { margin-left:  33.333333333333336%  }
.col5    { width:        41.666666666666667%  } /* (100% / (12 / 5)) */
.shift5  { margin-left:  41.666666666666667%  }
.col6    { width:        50%                  } /* (100% / (12 / 6)) */
.shift6  { margin-left:  50%                  }
.col7    { width:        58.333333333333336%  } /* (100% / (12 / 7)) */
.shift7  { margin-left:  58.333333333333336%  }
.col8    { width:        66.666666666666667%  } /* (100% / (12 / 8)) */
.shift8  { margin-left:  66.666666666666667%  }
.col9    { width:        75%                  } /* (100% / (12 / 9)) */
.shift9  { margin-left:  75%                  }
.col10   { width:        83.333333333333334%  } /* (100% / (12 / 10)) */
.shift10 { margin-left:  83.333333333333334%  }
.col11   { width:        91.666666666666667%  } /* (100% / (12 / 11)) */
.shift11 { margin-left:  91.666666666666667%  }
.col12   { width:       100%                  }
.shift12 { margin-left: 100%                  }

/* Remove column width */
.col-auto { width: auto }

/* Adjusts column widths correctly in a 1 column context */
.col1--of-1  { width:  100% }

/* Adjusts column widths correctly in a 2 column context */
.col1--of-2  { width:   50% }
.col2--of-2  { width:  100% }

/* Adjusts column widths correctly in a 3 column context */
.col1--of-3  { width:   33.3333333333% }
.col2--of-3  { width:   66.6666666667% }
.col3--of-3  { width:  100%            }

/* Adjusts column widths correctly in a 4 column context */
.col1--of-4  { width:   25% }
.col2--of-4  { width:   50% }
.col3--of-4  { width:   75% }
.col4--of-4  { width:  100% }

/* Adjusts column widths correctly in a 5 column context */
.col1--of-5  { width:   20% }
.col2--of-5  { width:   40% }
.col3--of-5  { width:   60% }
.col4--of-5  { width:   80% }
.col5--of-5  { width:  100% }

/* Adjusts column widths correctly in a 6 column context */
.col1--of-6  { width:   16.6666666667% }
.col2--of-6  { width:   33.3333333333% }
.col3--of-6  { width:   50%            }
.col4--of-6  { width:   66.6666666667% }
.col5--of-6  { width:   83.3333333333% }
.col6--of-6  { width:  100%            }

/* Adjusts column widths correctly in a 7 column context */
.col1--of-7  { width:   14.2857142857% }
.col2--of-7  { width:   28.5714285714% }
.col3--of-7  { width:   42.8571428571% }
.col4--of-7  { width:   57.1428571429% }
.col5--of-7  { width:   71.4285714286% }
.col6--of-7  { width:   85.7142857143% }
.col7--of-7  { width:  100%            }

/* Adjusts column widths correctly in a 9 column context */
.col1--of-8  { width:   12.5% }
.col2--of-8  { width:   25%   }
.col3--of-8  { width:   37.5% }
.col4--of-8  { width:   50%   }
.col5--of-8  { width:   62.5% }
.col6--of-8  { width:   75%   }
.col7--of-8  { width:   87.5% }
.col8--of-8  { width:  100%   }

/* Adjusts column widths correctly in a 9 column context */
.col1--of-9  { width:   11.1111111111% }
.col2--of-9  { width:   22.2222222222% }
.col3--of-9  { width:   33.3333333333% }
.col4--of-9  { width:   44.4444444444% }
.col5--of-9  { width:   55.5555555555% }
.col6--of-9  { width:   66.6666666666% }
.col7--of-9  { width:   77.7777777777% }
.col8--of-9  { width:   88.8888888888% }
.col9--of-9  { width:  100%            }

/* Adjusts column widths correctly in a 10 column context */
.col1--of-10  { width:  10% }
.col2--of-10  { width:  20% }
.col3--of-10  { width:  30% }
.col4--of-10  { width:  40% }
.col5--of-10  { width:  50% }
.col6--of-10  { width:  60% }
.col7--of-10  { width:  70% }
.col8--of-10  { width:  80% }
.col9--of-10  { width:  90% }
.col10--of-10 { width: 100% }

/* Adjusts column widths correctly in a 11 column context */
.col1--of-11  { width:  9.09090909091% }
.col2--of-11  { width:  18.1818181818% }
.col3--of-11  { width:  27.2727272727% }
.col4--of-11  { width:  36.3636363636% }
.col5--of-11  { width:  45.4545454545% }
.col6--of-11  { width:  54.5454545455% }
.col7--of-11  { width:  63.6363636364% }
.col8--of-11  { width:  72.7272727273% }
.col9--of-11  { width:  81.8181818182% }
.col10--of-11 { width:  90.9090909091% }
.col11--of-11 { width: 100%            }

/* Adjusts column widths correctly in a 24 column context */
.col1--of-24  { width:  4.16666666666% }
.col2--of-24  { width:  8.33333333333% }
.col3--of-24  { width:  12.5% }
.col4--of-24  { width:  16.6666666666% }
.col5--of-24  { width:  20.8333333333% }
.col6--of-24  { width:  25% }
.col7--of-24  { width:  29.16666666666% }
.col8--of-24  { width:  33.33333333333% }
.col9--of-24  { width:  37.5% }
.col10--of-24  { width:  41.6666666666% }
.col11--of-24  { width:  45.8333333333% }
.col12--of-24  { width:  50% }
.col13--of-24  { width:  54.16666666666% }
.col14--of-24  { width:  58.33333333333% }
.col15--of-24  { width:  62.5% }
.col16--of-24  { width:  66.6666666666% }
.col17--of-24  { width:  70.8333333333% }
.col18--of-24  { width:  75% }
.col19--of-24  { width:  79.16666666666% }
.col20--of-24  { width:  83.33333333333% }
.col21--of-24  { width:  87.5% }
.col22--of-24  { width:  91.6666666666% }
.col23--of-24  { width:  95.8333333333% }
.col24--of-24  { width:  100% }


/* Adjusts a width of a column by one gap width */
.col--expand-by-one-gap-width {
    box-sizing: content-box;
}

/* Media-Queries */
@media (max-width: 1150px) {
    .content:not(.content--custom-media) .shift-big-0        { margin-left:   0% }
    .content:not(.content--custom-media) .col-big-1          { width:         8.333333333333334% }
    .content:not(.content--custom-media) .shift-big-1        { margin-left:   8.333333333333334% }
    .content:not(.content--custom-media) .col-big-2          { width:        16.666666666666668% }
    .content:not(.content--custom-media) .shift-big-2        { margin-left:  16.666666666666668% }
    .content:not(.content--custom-media) .col-big-3          { width:        25%                 }
    .content:not(.content--custom-media) .shift-big-3        { margin-left:  25%                 }
    .content:not(.content--custom-media) .col-big-4          { width:        33.333333333333336% }
    .content:not(.content--custom-media) .shift-big-4        { margin-left:  33.333333333333336% }
    .content:not(.content--custom-media) .col-big-5          { width:        41.666666666666667% }
    .content:not(.content--custom-media) .shift-big-5        { margin-left:  41.666666666666667% }
    .content:not(.content--custom-media) .col-big-6          { width:        50%                 }
    .content:not(.content--custom-media) .shift-big-6        { margin-left:  50%                 }
    .content:not(.content--custom-media) .col-big-7          { width:        58.333333333333336% }
    .content:not(.content--custom-media) .shift-big-7        { margin-left:  58.333333333333336% }
    .content:not(.content--custom-media) .col-big-8          { width:        66.666666666666667% }
    .content:not(.content--custom-media) .shift-big-8        { margin-left:  66.666666666666667% }
    .content:not(.content--custom-media) .col-big-9          { width:        75%                 }
    .content:not(.content--custom-media) .shift-big-9        { margin-left:  75%                 }
    .content:not(.content--custom-media) .col-big-10         { width:        83.333333333333334% }
    .content:not(.content--custom-media) .shift-big-10       { margin-left:  83.333333333333334% }
    .content:not(.content--custom-media) .col-big-11         { width:        91.666666666666667% }
    .content:not(.content--custom-media) .shift-big-11       { margin-left:  91.666666666666667% }
    .content:not(.content--custom-media) .col-big-12         { width:       100%                 }
    .content:not(.content--custom-media) .shift-big-12       { margin-left: 100%                 }

    .content:not(.content--custom-media) .col-big-auto       { width:       auto                 }

    .content--big-reduce-gaps:not(.content--custom-media),
    .content--big-reduce-gaps:not(.content--custom-media) .content        { margin: 0 -10px }
    .content--big-reduce-gaps:not(.content--custom-media) [class^="col"],
    .content--big-reduce-gaps:not(.content--custom-media) [class*=" col"] { padding: 0 10px }

    /* Adjusts column widths correctly in a 24 column context */
    .col1--of-24, .col2--of-24, .col3--of-24, .col4--of-24, .col5--of-24, .col6--of-24, .col7--of-24, .col8--of-24, .col9--of-24, .col10--of-24, .col11--of-24, .col12--of-24{ width: 50%; }
    .col13--of-24, .col14--of-24, .col15--of-24, .col16--of-24, .col17--of-24, .col18--of-24, .col19--of-24 , .col20--of-24, .col21--of-24, .col22--of-24, .col23--of-24, .col24--of-24  { width:  100% }
}

@media (max-width: 950px) {
    .content:not(.content--custom-media) [class^="col"],
    .content:not(.content--custom-media) [class*=" col"] {
        width: 100%;
    }

    .content:not(.content--custom-media) [class^="shift"],
    .content:not(.content--custom-media) [class*=" shift"] {
        margin-left: 0;
    }

    .content:not(.content--custom-media) .shift-medium-0        { margin-left:   0% }
    .content:not(.content--custom-media) .col-medium-1          { width:         8.333333333333334% }
    .content:not(.content--custom-media) .shift-medium-1        { margin-left:   8.333333333333334% }
    .content:not(.content--custom-media) .col-medium-2          { width:        16.666666666666668% }
    .content:not(.content--custom-media) .shift-medium-2        { margin-left:  16.666666666666668% }
    .content:not(.content--custom-media) .col-medium-3          { width:        25%                 }
    .content:not(.content--custom-media) .shift-medium-3        { margin-left:  25%                 }
    .content:not(.content--custom-media) .col-medium-4          { width:        33.333333333333336% }
    .content:not(.content--custom-media) .shift-medium-4        { margin-left:  33.333333333333336% }
    .content:not(.content--custom-media) .col-medium-5          { width:        41.666666666666667% }
    .content:not(.content--custom-media) .shift-medium-5        { margin-left:  41.666666666666667% }
    .content:not(.content--custom-media) .col-medium-6          { width:        50%                 }
    .content:not(.content--custom-media) .shift-medium-6        { margin-left:  50%                 }
    .content:not(.content--custom-media) .col-medium-7          { width:        58.333333333333336% }
    .content:not(.content--custom-media) .shift-medium-7        { margin-left:  58.333333333333336% }
    .content:not(.content--custom-media) .col-medium-8          { width:        66.666666666666667% }
    .content:not(.content--custom-media) .shift-medium-8        { margin-left:  66.666666666666667% }
    .content:not(.content--custom-media) .col-medium-9          { width:        75%                 }
    .content:not(.content--custom-media) .shift-medium-9        { margin-left:  75%                 }
    .content:not(.content--custom-media) .col-medium-10         { width:        83.333333333333334% }
    .content:not(.content--custom-media) .shift-medium-10       { margin-left:  83.333333333333334% }
    .content:not(.content--custom-media) .col-medium-11         { width:        91.666666666666667% }
    .content:not(.content--custom-media) .shift-medium-11       { margin-left:  91.666666666666667% }
    .content:not(.content--custom-media) .col-medium-12         { width:       100%                 }
    .content:not(.content--custom-media) .shift-medium-12       { margin-left: 100%                 }

    .content:not(.content--custom-media) .col-medium-auto       { width:       auto                 }

    .content--medium-reduce-gaps:not(.content--custom-media),
    .content--medium-reduce-gaps:not(.content--custom-media) .content        { margin: 0 -10px }
    .content--medium-reduce-gaps:not(.content--custom-media) [class^="col"],
    .content--medium-reduce-gaps:not(.content--custom-media) [class*=" col"] { padding: 0 10px }

}

@media (max-width: 640px) {
    .content:not(.content--custom-media) .shift-small-0         { margin-left:   0% }
    .content:not(.content--custom-media) .col-small-1           { width:         8.333333333333334% }
    .content:not(.content--custom-media) .shift-small-1         { margin-left:   8.333333333333334% }
    .content:not(.content--custom-media) .col-small-2           { width:        16.666666666666668% }
    .content:not(.content--custom-media) .shift-small-2         { margin-left:  16.666666666666668% }
    .content:not(.content--custom-media) .col-small-3           { width:        25%                 }
    .content:not(.content--custom-media) .shift-small-3         { margin-left:  25%                 }
    .content:not(.content--custom-media) .col-small-4           { width:        33.333333333333336% }
    .content:not(.content--custom-media) .shift-small-4         { margin-left:  33.333333333333336% }
    .content:not(.content--custom-media) .col-small-5           { width:        41.666666666666667% }
    .content:not(.content--custom-media) .shift-small-5         { margin-left:  41.666666666666667% }
    .content:not(.content--custom-media) .col-small-6           { width:        50%                 }
    .content:not(.content--custom-media) .shift-small-6         { margin-left:  50%                 }
    .content:not(.content--custom-media) .col-small-7           { width:        58.333333333333336% }
    .content:not(.content--custom-media) .shift-small-7         { margin-left:  58.333333333333336% }
    .content:not(.content--custom-media) .col-small-8           { width:        66.666666666666667% }
    .content:not(.content--custom-media) .shift-small-8         { margin-left:  66.666666666666667% }
    .content:not(.content--custom-media) .col-small-9           { width:        75%                 }
    .content:not(.content--custom-media) .shift-small-9         { margin-left:  75%                 }
    .content:not(.content--custom-media) .col-small-10          { width:        83.333333333333334% }
    .content:not(.content--custom-media) .shift-small-10        { margin-left:  83.333333333333334% }
    .content:not(.content--custom-media) .col-small-11          { width:        91.666666666666667% }
    .content:not(.content--custom-media) .shift-small-11        { margin-left:  91.666666666666667% }
    .content:not(.content--custom-media) .col-small-12          { width:       100%                 }
    .content:not(.content--custom-media) .shift-small-12        { margin-left: 100%                 }

    .content:not(.content--custom-media) .col-small-auto        { width:       auto                 }

    .content--small-reduce-gaps:not(.content--custom-media),
    .content--small-reduce-gaps:not(.content--custom-media) .content        { margin: 0 -10px }
    .content--small-reduce-gaps:not(.content--custom-media) [class^="col"],
    .content--small-reduce-gaps:not(.content--custom-media) [class*=" col"] { padding: 0 10px }

    /* Adjusts column widths correctly in a 24 column context */
    .col1--of-24, .col2--of-24, .col3--of-24, .col4--of-24, .col5--of-24, .col6--of-24, .col7--of-24, .col8--of-24, .col9--of-24, .col10--of-24, .col11--of-24, .col12--of-24, .col13--of-24, .col14--of-24, .col15--of-24, .col16--of-24, .col17--of-24, .col18--of-24, .col19--of-24 , .col20--of-24, .col21--of-24, .col22--of-24, .col23--of-24, .col24--of-24  { width:  100% }
}