html {
  --grid__columns: 12;
  --grid__gutter: 1.875rem;
}
.row {
  display: grid;
  grid-template-columns: repeat(var(--grid__columns), minmax(0, 1fr));
  grid-gap: var(--grid__gutter);
  grid-auto-columns: 1fr;
}

.row--show {
  position: relative;
  background: #f9f9f9;
  z-index: 0;
  padding-top: 0.9375rem;
}

.row--show:before {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 0;
  height: 100%;
  background: repeating-linear-gradient(to right, #f0f0f0 0%, #f0f0f0 calc((100% - (1.875rem * 11)) / 12), #f9f9f9 calc((100% - (1.875rem * 11)) / 12), #f9f9f9 calc(((100% - (1.875rem * 11)) / 12) + 1.875rem) );
}


/* ----- */
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
  grid-column: 1 / -1;
}

.row-span-xs-1, .row-span-xs-2, .row-span-xs-3, .row-span-xs-4, .row-span-xs-5, .row-span-xs-6, .row-span-xs-7, .row-span-xs-8, .row-span-xs-9, .row-span-xs-10, .row-span-xs-11, .row-span-xs-12, .row-span-sm-1, .row-span-sm-2, .row-span-sm-3, .row-span-sm-4, .row-span-sm-5, .row-span-sm-6, .row-span-sm-7, .row-span-sm-8, .row-span-sm-9, .row-span-sm-10, .row-span-sm-11, .row-span-sm-12, .row-span-md-1, .row-span-md-2, .row-span-md-3, .row-span-md-4, .row-span-md-5, .row-span-md-6, .row-span-md-7, .row-span-md-8, .row-span-md-9, .row-span-md-10, .row-span-md-11, .row-span-md-12, .row-span-lg-1, .row-span-lg-2, .row-span-lg-3, .row-span-lg-4, .row-span-lg-5, .row-span-lg-6, .row-span-lg-7, .row-span-lg-8, .row-span-lg-9, .row-span-lg-10, .row-span-lg-11, .row-span-lg-12, .row-span-xl-1, .row-span-xl-2, .row-span-xl-3, .row-span-xl-4, .row-span-xl-5, .row-span-xl-6, .row-span-xl-7, .row-span-xl-8, .row-span-xl-9, .row-span-xl-10, .row-span-xl-11, .row-span-xl-12 {
  grid-row: 1;
}

.justify-start {
  justify-self: start;
}

.justify-center {
  justify-self: center;
}

.justify-end {
  justify-self: end;
}

.justify-stretch {
  justify-self: stretch;
}

.align-start {
  align-self: start;
}

.align-center {
  align-self: center;
}

.align-end {
  align-self: end;
}

.align-stretch {
  align-self: stretch;
}

.col-1 {
  grid-column: span 1 / span 1;
}

.col-2 {
  grid-column: span 2 / span 2;
}

.col-3 {
  grid-column: span 3 / span 3;
}

.col-4 {
  grid-column: span 4 / span 4;
}

.col-5 {
  grid-column: span 5 / span 5;
}

.col-6 {
  grid-column: span 6 / span 6;
}

.col-7 {
  grid-column: span 7 / span 7;
}

.col-8 {
  grid-column: span 8 / span 8;
}

.col-9 {
  grid-column: span 9 / span 9;
}

.col-10 {
  grid-column: span 10 / span 10;
}

.col-11 {
  grid-column: span 11 / span 11;
}

.col-12 {
  grid-column: span 12 / span 12;
}

@media screen and (min-width: 0) {
  .col-xs-1 {
    grid-column: span 1 / span 1;
  }

  .col-xs-2 {
    grid-column: span 2 / span 2;
  }

  .col-xs-3 {
    grid-column: span 3 / span 3;
  }

  .col-xs-4 {
    grid-column: span 4 / span 4;
  }

  .col-xs-5 {
    grid-column: span 5 / span 5;
  }

  .col-xs-6 {
    grid-column: span 6 / span 6;
  }

  .col-xs-7 {
    grid-column: span 7 / span 7;
  }

  .col-xs-8 {
    grid-column: span 8 / span 8;
  }

  .col-xs-9 {
    grid-column: span 9 / span 9;
  }

  .col-xs-10 {
    grid-column: span 10 / span 10;
  }

  .col-xs-11 {
    grid-column: span 11 / span 11;
  }

  .col-xs-12 {
    grid-column: span 12 / span 12;
  }
}

@media screen and (min-width: 0) {
  .col-start-xs-1 {
    grid-column-start: 1;
  }

  .row-start-xs-1 {
    grid-row-start: 1;
  }

  .col-start-xs-2 {
    grid-column-start: 2;
  }

  .row-start-xs-2 {
    grid-row-start: 2;
  }

  .col-start-xs-3 {
    grid-column-start: 3;
  }

  .row-start-xs-3 {
    grid-row-start: 3;
  }

  .col-start-xs-4 {
    grid-column-start: 4;
  }

  .row-start-xs-4 {
    grid-row-start: 4;
  }

  .col-start-xs-5 {
    grid-column-start: 5;
  }

  .row-start-xs-5 {
    grid-row-start: 5;
  }

  .col-start-xs-6 {
    grid-column-start: 6;
  }

  .row-start-xs-6 {
    grid-row-start: 6;
  }

  .col-start-xs-7 {
    grid-column-start: 7;
  }

  .row-start-xs-7 {
    grid-row-start: 7;
  }

  .col-start-xs-8 {
    grid-column-start: 8;
  }

  .row-start-xs-8 {
    grid-row-start: 8;
  }

  .col-start-xs-9 {
    grid-column-start: 9;
  }

  .row-start-xs-9 {
    grid-row-start: 9;
  }

  .col-start-xs-10 {
    grid-column-start: 10;
  }
  .row-start-xs-10 {
    grid-row-start: 10;
  }

  .col-start-xs-11 {
    grid-column-start: 11;
  }

  .row-start-xs-11 {
    grid-row-start: 11;
  }

  .col-start-xs-12 {
    grid-column-start: 12;
  }

  .row-start-xs-12 {
    grid-row-start: 12;
  }
}

@media screen and (min-width: 0) {
  .pull-right-xs {
    grid-column-end: -1;
  }

  .pull-left-xs {
    grid-row-start: 1;
    grid-column-end: inherit;
  }
}

@media screen and (min-width: 0) {
  .justify-xs-start {
    justify-self: start;
  }

  .justify-xs-center {
    justify-self: center;
  }

  .justify-xs-end {
    justify-self: end;
  }

  .justify-xs-stretch {
    justify-self: stretch;
  }

  .align-xs-start {
    align-self: start;
  }

  .align-xs-center {
    align-self: center;
  }

  .align-xs-end {
    align-self: end;
  }

  .align-xs-stretch {
    align-self: stretch;
  }
}

@media screen and (min-width: 0) {
  .row-span-xs-1 {
    grid-row: span 1 / span 1;
  }

  .row-span-xs-2 {
    grid-row: span 2 / span 2;
  }

  .row-span-xs-3 {
    grid-row: span 3 / span 3;
  }

  .row-span-xs-4 {
    grid-row: span 4 / span 4;
  }

  .row-span-xs-5 {
    grid-row: span 5 / span 5;
  }

  .row-span-xs-6 {
    grid-row: span 6 / span 6;
  }

  .row-span-xs-7 {
    grid-row: span 7 / span 7;
  }

  .row-span-xs-8 {
    grid-row: span 8 / span 8;
  }

  .row-span-xs-9 {
    grid-row: span 9 / span 9;
  }

  .row-span-xs-10 {
    grid-row: span 10 / span 10;
  }

  .row-span-xs-11 {
    grid-row: span 11 / span 11;
  }

  .row-span-xs-12 {
    grid-row: span 12 / span 12;
  }
}

@media screen and (min-width: 34.375em) {
  .col-sm-1 {
    grid-column: span 1 / span 1;
  }

  .col-sm-2 {
    grid-column: span 2 / span 2;
  }

  .col-sm-3 {
    grid-column: span 3 / span 3;
  }

  .col-sm-4 {
    grid-column: span 4 / span 4;
  }

  .col-sm-5 {
    grid-column: span 5 / span 5;
  }

  .col-sm-6 {
    grid-column: span 6 / span 6;
  }

  .col-sm-7 {
    grid-column: span 7 / span 7;
  }

  .col-sm-8 {
    grid-column: span 8 / span 8;
  }

  .col-sm-9 {
    grid-column: span 9 / span 9;
  }

  .col-sm-10 {
    grid-column: span 10 / span 10;
  }

  .col-sm-11 {
    grid-column: span 11 / span 11;
  }

  .col-sm-12 {
    grid-column: span 12 / span 12;
  }
}

@media screen and (min-width: 34.375em) {
  .col-start-sm-1 {
    grid-column-start: 1;
  }

  .row-start-sm-1 {
    grid-row-start: 1;
  }

  .col-start-sm-2 {
    grid-column-start: 2;
  }

  .row-start-sm-2 {
    grid-row-start: 2;
  }

  .col-start-sm-3 {
    grid-column-start: 3;
  }

  .row-start-sm-3 {
    grid-row-start: 3;
  }

  .col-start-sm-4 {
    grid-column-start: 4;
  }

  .row-start-sm-4 {
    grid-row-start: 4;
  }

  .col-start-sm-5 {
    grid-column-start: 5;
  }

  .row-start-sm-5 {
    grid-row-start: 5;
  }

  .col-start-sm-6 {
    grid-column-start: 6;
  }

  .row-start-sm-6 {
    grid-row-start: 6;
  }

  .col-start-sm-7 {
    grid-column-start: 7;
  }

  .row-start-sm-7 {
    grid-row-start: 7;
  }

  .col-start-sm-8 {
    grid-column-start: 8;
  }

  .row-start-sm-8 {
    grid-row-start: 8;
  }

  .col-start-sm-9 {
    grid-column-start: 9;
  }

  .row-start-sm-9 {
    grid-row-start: 9;
  }

  .col-start-sm-10 {
    grid-column-start: 10;
  }

  .row-start-sm-10 {
    grid-row-start: 10;
  }

  .col-start-sm-11 {
    grid-column-start: 11;
  }

  .row-start-sm-11 {
    grid-row-start: 11;
  }

  .col-start-sm-12 {
    grid-column-start: 12;
  }

  .row-start-sm-12 {
    grid-row-start: 12;
  }
}

@media screen and (min-width: 34.375em) {
  .pull-right-sm {
    grid-column-end: -1;
  }

  .pull-left-sm {
    grid-row-start: 1;
    grid-column-end: inherit;
  }
}

@media screen and (min-width: 34.375em) {
  .justify-sm-start {
    justify-self: start;
  }

  .justify-sm-center {
    justify-self: center;
  }

  .justify-sm-end {
    justify-self: end;
  }

  .justify-sm-stretch {
    justify-self: stretch;
  }

  .align-sm-start {
    align-self: start;
  }

  .align-sm-center {
    align-self: center;
  }

  .align-sm-end {
    align-self: end;
  }

  .align-sm-stretch {
    align-self: stretch;
  }
}

@media screen and (min-width: 34.375em) {
  .row-span-sm-1 {
    grid-row: span 1 / span 1;
  }

  .row-span-sm-2 {
    grid-row: span 2 / span 2;
  }

  .row-span-sm-3 {
    grid-row: span 3 / span 3;
  }

  .row-span-sm-4 {
    grid-row: span 4 / span 4;
  }

  .row-span-sm-5 {
    grid-row: span 5 / span 5;
  }

  .row-span-sm-6 {
    grid-row: span 6 / span 6;
  }

  .row-span-sm-7 {
    grid-row: span 7 / span 7;
  }

  .row-span-sm-8 {
    grid-row: span 8 / span 8;
  }

  .row-span-sm-9 {
    grid-row: span 9 / span 9;
  }

  .row-span-sm-10 {
    grid-row: span 10 / span 10;
  }

  .row-span-sm-11 {
    grid-row: span 11 / span 11;
  }

  .row-span-sm-12 {
    grid-row: span 12 / span 12;
  }
}


@media screen and (min-width: 48em) {
  .col-md-1 {
    grid-column: span 1 / span 1;
  }

  .col-md-2 {
    grid-column: span 2 / span 2;
  }

  .col-md-3 {
    grid-column: span 3 / span 3;
  }

  .col-md-4 {
    grid-column: span 4 / span 4;
  }

  .col-md-5 {
    grid-column: span 5 / span 5;
  }

  .col-md-6 {
    grid-column: span 6 / span 6;
  }

  .col-md-7 {
    grid-column: span 7 / span 7;
  }

  .col-md-8 {
    grid-column: span 8 / span 8;
  }

  .col-md-9 {
    grid-column: span 9 / span 9;
  }

  .col-md-10 {
    grid-column: span 10 / span 10;
  }

  .col-md-11 {
    grid-column: span 11 / span 11;
  }

  .col-md-12 {
    grid-column: span 12 / span 12;
  }
}

@media screen and (min-width: 48em) {
  .col-start-md-1 {
    grid-column-start: 1;
  }

  .row-start-md-1 {
    grid-row-start: 1;
  }

  .col-start-md-2 {
    grid-column-start: 2;
  }

  .row-start-md-2 {
    grid-row-start: 2;
  }

  .col-start-md-3 {
    grid-column-start: 3;
  }

  .row-start-md-3 {
    grid-row-start: 3;
  }

  .col-start-md-4 {
    grid-column-start: 4;
  }

  .row-start-md-4 {
    grid-row-start: 4;
  }

  .col-start-md-5 {
    grid-column-start: 5;
  }

  .row-start-md-5 {
    grid-row-start: 5;
  }

  .col-start-md-6 {
    grid-column-start: 6;
  }

  .row-start-md-6 {
     grid-row-start: 6;
  }

  .col-start-md-7 {
    grid-column-start: 7;
  }

  .row-start-md-7 {
    grid-row-start: 7;
  }

  .col-start-md-8 {
    grid-column-start: 8;
  }

  .row-start-md-8 {
    grid-row-start: 8;
  }

  .col-start-md-9 {
    grid-column-start: 9;
  }

  .row-start-md-9 {
    grid-row-start: 9;
  }

  .col-start-md-10 {
    grid-column-start: 10;
  }

  .row-start-md-10 {
    grid-row-start: 10;
  }

  .col-start-md-11 {
    grid-column-start: 11;
  }
  
  .row-start-md-11 {
    grid-row-start: 11;
  }
  
  .col-start-md-12 {
    grid-column-start: 12;
  }
  
  .row-start-md-12 {
    grid-row-start: 12;
  }
}

@media screen and (min-width: 48em) {
  .pull-right-md {
    grid-column-end: -1;
  }
  
  .pull-left-md {
    grid-row-start: 1;
    grid-column-end: inherit;
  }
}

@media screen and (min-width: 48em) {
  .justify-md-start {
    justify-self: start;
  }

  .justify-md-center {
    justify-self: center;
  }

  .justify-md-end {
    justify-self: end;
  }

  .justify-md-stretch {
    justify-self: stretch;
  }

  .align-md-start {
    align-self: start;
  }

  .align-md-center {
    align-self: center;
  }

  .align-md-end {
    align-self: end;
  }

  .align-md-stretch {
    align-self: stretch;
  }
}

@media screen and (min-width: 48em) {
  .row-span-md-1 {
    grid-row: span 1 / span 1;
  }

  .row-span-md-2 {
    grid-row: span 2 / span 2;
  }

  .row-span-md-3 {
    grid-row: span 3 / span 3;
  }

  .row-span-md-4 {
    grid-row: span 4 / span 4;
  }

  .row-span-md-5 {
    grid-row: span 5 / span 5;
  }

  .row-span-md-6 {
    grid-row: span 6 / span 6;
  }

  .row-span-md-7 {
    grid-row: span 7 / span 7;
  }

  .row-span-md-8 {
    grid-row: span 8 / span 8;
  }

  .row-span-md-9 {
    grid-row: span 9 / span 9;
  }

  .row-span-md-10 {
    grid-row: span 10 / span 10;
  }

  .row-span-md-11 {
    grid-row: span 11 / span 11;
  }

  .row-span-md-12 {
    grid-row: span 12 / span 12;
  }
}

@media screen and (min-width: 58.75em) {
  .col-lg-1 {
    grid-column: span 1 / span 1;
  }
  
  .col-lg-2 {
    grid-column: span 2 / span 2;
  }
  
  .col-lg-3 {
    grid-column: span 3 / span 3;
  }
  
  .col-lg-4 {
    grid-column: span 4 / span 4;
  }
  
  .col-lg-5 {
    grid-column: span 5 / span 5;
  }
  
  .col-lg-6 {
    grid-column: span 6 / span 6;
  }
  
  .col-lg-7 {
    grid-column: span 7 / span 7;
  }
  
  .col-lg-8 {
    grid-column: span 8 / span 8;
  }
  
  .col-lg-9 {
    grid-column: span 9 / span 9;
  }
  
  .col-lg-10 {
    grid-column: span 10 / span 10;
  }
  
  .col-lg-11 {
    grid-column: span 11 / span 11;
  }
  
  .col-lg-12 {
    grid-column: span 12 / span 12;
  }
}

@media screen and (min-width: 58.75em) {
  .col-start-lg-1 {
    grid-column-start: 1;
  }
  
  .row-start-lg-1 {
    grid-row-start: 1;
  }
  
  .col-start-lg-2 {
    grid-column-start: 2;
  }
  
  .row-start-lg-2 {
    grid-row-start: 2;
  }
  
  .col-start-lg-3 {
    grid-column-start: 3;
  }
  
  .row-start-lg-3 {
    grid-row-start: 3;
  }
  
  .col-start-lg-4 {
    grid-column-start: 4;
  }
  
  .row-start-lg-4 {
    grid-row-start: 4;
  }
  
  .col-start-lg-5 {
    grid-column-start: 5;
  }
  
  .row-start-lg-5 {
    grid-row-start: 5;
  }
  
  .col-start-lg-6 {
    grid-column-start: 6;
  }
  
  .row-start-lg-6 {
    grid-row-start: 6;
  }
  
  .col-start-lg-7 {
    grid-column-start: 7;
  }
  
  .row-start-lg-7 {
    grid-row-start: 7;
  }
  
  .col-start-lg-8 {
    grid-column-start: 8;
  }
  
  .row-start-lg-8 {
    grid-row-start: 8;
  }
  
  .col-start-lg-9 {
    grid-column-start: 9;
  }
  
  .row-start-lg-9 {
    grid-row-start: 9;
  }
  
  .col-start-lg-10 {
    grid-column-start: 10;
  }
  
  .row-start-lg-10 {
    grid-row-start: 10;
  }
  
  .col-start-lg-11 {
    grid-column-start: 11;
  }
  
  .row-start-lg-11 {
    grid-row-start: 11;
  }
  
  .col-start-lg-12 {
    grid-column-start: 12;
  }
  
  .row-start-lg-12 {
    grid-row-start: 12;
  }
}

@media screen and (min-width: 58.75em) {
  .pull-right-lg {
    grid-column-end: -1;
  }
  
  .pull-left-lg {
    grid-row-start: 1;
    grid-column-end: inherit;
  }
}

@media screen and (min-width: 58.75em) {
  .justify-lg-start {
    justify-self: start;
  }

  .justify-lg-center {
    justify-self: center;
  }

  .justify-lg-end {
    justify-self: end;
  }

  .justify-lg-stretch {
    justify-self: stretch;
  }

  .align-lg-start {
    align-self: start;
  }

  .align-lg-center {
    align-self: center;
  }

  .align-lg-end {
    align-self: end;
  }

  .align-lg-stretch {
    align-self: stretch;
  }
}

@media screen and (min-width: 58.75em) {
  .row-span-lg-1 {
    grid-row: span 1 / span 1;
  }

  .row-span-lg-2 {
    grid-row: span 2 / span 2;
  }

  .row-span-lg-3 {
    grid-row: span 3 / span 3;
  }

  .row-span-lg-4 {
    grid-row: span 4 / span 4;
  }

  .row-span-lg-5 {
    grid-row: span 5 / span 5;
  }

  .row-span-lg-6 {
    grid-row: span 6 / span 6;
  }

  .row-span-lg-7 {
    grid-row: span 7 / span 7;
  }

  .row-span-lg-8 {
    grid-row: span 8 / span 8;
  }

  .row-span-lg-9 {
    grid-row: span 9 / span 9;
  }

  .row-span-lg-10 {
    grid-row: span 10 / span 10;
  }

  .row-span-lg-11 {
    grid-row: span 11 / span 11;
  }

  .row-span-lg-12 {
    grid-row: span 12 / span 12;
  }
}

@media screen and (min-width: 68.75em) {
  .col-xl-1 {
    grid-column: span 1 / span 1;
  }
  
  .col-xl-2 {
    grid-column: span 2 / span 2;
  }
  
  .col-xl-3 {
    grid-column: span 3 / span 3;
  }
  
  .col-xl-4 {
    grid-column: span 4 / span 4;
  }
  
  .col-xl-5 {
    grid-column: span 5 / span 5;
  }
  
  .col-xl-6 {
    grid-column: span 6 / span 6;
  }
  
  .col-xl-7 {
    grid-column: span 7 / span 7;
  }
  
  .col-xl-8 {
    grid-column: span 8 / span 8;
  }
  
  .col-xl-9 {
    grid-column: span 9 / span 9;
  }
  
  .col-xl-10 {
    grid-column: span 10 / span 10;
  }
  
  .col-xl-11 {
    grid-column: span 11 / span 11;
  }
  
  .col-xl-12 {
    grid-column: span 12 / span 12;
  }
}

@media screen and (min-width: 68.75em) {
  .col-start-xl-1 {
     grid-column-start: 1;
  }
  
  .row-start-xl-1 {
    grid-row-start: 1;
  }
  
  .col-start-xl-2 {
    grid-column-start: 2;
  }
  
  .row-start-xl-2 {
    grid-row-start: 2;
  }
  
  .col-start-xl-3 {
    grid-column-start: 3;
  }
  
  .row-start-xl-3 {
    grid-row-start: 3;
  }
  
  .col-start-xl-4 {
    grid-column-start: 4;
  }
  
  .row-start-xl-4 {
    grid-row-start: 4;
  }
  
  .col-start-xl-5 {
    grid-column-start: 5;
  }
  
  .row-start-xl-5 {
    grid-row-start: 5;
  }
  
  .col-start-xl-6 {
    grid-column-start: 6;
  }
  
  .row-start-xl-6 {
    grid-row-start: 6;
  }
  
  .col-start-xl-7 {
    grid-column-start: 7;
  }
  
  .row-start-xl-7 {
    grid-row-start: 7;
  }
  
  .col-start-xl-8 {
    grid-column-start: 8;
  }
  
  .row-start-xl-8 {
    grid-row-start: 8;
  }
  
  .col-start-xl-9 {
    grid-column-start: 9;
  }
  
  .row-start-xl-9 {
    grid-row-start: 9;
  }
  
  .col-start-xl-10 {
    grid-column-start: 10;
  }
  
  .row-start-xl-10 {
    grid-row-start: 10;
  }
  
  .col-start-xl-11 {
    grid-column-start: 11;
  }
  
  .row-start-xl-11 {
    grid-row-start: 11;
  }
  
  .col-start-xl-12 {
    grid-column-start: 12;
  }
  
  .row-start-xl-12 {
    grid-row-start: 12;
  }
}

@media screen and (min-width: 68.75em) {
  .pull-right-xl {
    grid-column-end: -1;
  }
  
  .pull-left-xl {
    grid-row-start: 1;
    grid-column-end: inherit;
  }
}

@media screen and (min-width: 68.75em) {
  .justify-xl-start {
    justify-self: start;
  }

  .justify-xl-center {
    justify-self: center;
  }

  .justify-xl-end {
    justify-self: end;
  }

  .justify-xl-stretch {
    justify-self: stretch;
  }

  .align-xl-start {
    align-self: start;
  }

  .align-xl-center {
    align-self: center;
  }

  .align-xl-end {
    align-self: end;
  }

  .align-xl-stretch {
    align-self: stretch;
  }
}

@media screen and (min-width: 68.75em) {
  .row-span-xl-1 {
    grid-row: span 1 / span 1;
  }

  .row-span-xl-2 {
    grid-row: span 2 / span 2;
  }

  .row-span-xl-3 {
    grid-row: span 3 / span 3;
  }

  .row-span-xl-4 {
    grid-row: span 4 / span 4;
  }

  .row-span-xl-5 {
    grid-row: span 5 / span 5;
  }

  .row-span-xl-6 {
    grid-row: span 6 / span 6;
  }

  .row-span-xl-7 {
    grid-row: span 7 / span 7;
  }

  .row-span-xl-8 {
    grid-row: span 8 / span 8;
  }

  .row-span-xl-9 {
    grid-row: span 9 / span 9;
  }

  .row-span-xl-10 {
    grid-row: span 10 / span 10;
  }

  .row-span-xl-11 {
    grid-row: span 11 / span 11;
  }

  .row-span-xl-12 {
    grid-row: span 12 / span 12;
  }
}

.col-start-1 {
  grid-column-start: 1;
}

.row-start-1 {
  grid-row-start: 1;
}

.col-start-2 {
  grid-column-start: 2;
}

.row-start-2 {
  grid-row-start: 2;
}

.col-start-3 {
  grid-column-start: 3;
}

.row-start-3 {
  grid-row-start: 3;
}

.col-start-4 {
  grid-column-start: 4;
}

.row-start-4 {
  grid-row-start: 4;
}

.col-start-5 {
  grid-column-start: 5;
}

.row-start-5 {
  grid-row-start: 5;
}

.col-start-6 {
  grid-column-start: 6;
}

.row-start-6 {
  grid-row-start: 6;
}

.col-start-7 {
  grid-column-start: 7;
}

.row-start-7 {
  grid-row-start: 7;
}

.col-start-8 {
  grid-column-start: 8;
}

.row-start-8 {
  grid-row-start: 8;
}

.col-start-9 {
  grid-column-start: 9;
}

.row-start-9 {
  grid-row-start: 9;
}

.col-start-10 {
  grid-column-start: 10;
}
.row-start-10 {
  grid-row-start: 10;
}

.col-start-11 {
  grid-column-start: 11;
}

.row-start-11 {
  grid-row-start: 11;
}

.col-start-12 {
  grid-column-start: 12;
}

.row-start-12 {
  grid-row-start: 12;
}

.row-span-1 {
  grid-row: span 1 / span 1;
}

.row-span-2 {
  grid-row: span 2 / span 2;
}

.row-span-3 {
  grid-row: span 3 / span 3;
}

.row-span-4 {
  grid-row: span 4 / span 4;
}

.row-span-5 {
  grid-row: span 5 / span 5;
}

.row-span-6 {
  grid-row: span 6 / span 6;
}

.row-span-7 {
  grid-row: span 7 / span 7;
}

.row-span-8 {
  grid-row: span 8 / span 8;
}

.row-span-9 {
  grid-row: span 9 / span 9;
}

.row-span-10 {
  grid-row: span 10 / span 10;
}

.row-span-11 {
  grid-row: span 11 / span 11;
}

.row-span-12 {
  grid-row: span 12 / span 12;
}

body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
header,footer,nav,section,aside,main,article,figure,figcaption{display:block}body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img,iframe{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px}
.mobile_menu{position:fixed;z-index:100;display:none}.mobile_menu .inner{height:100%;background:#000;overflow-y:scroll}.mobile_menu.active.position_left{box-shadow:2px 0 5px 0 rgba(0,0,0,.5)}.mobile_menu.active.position_top{box-shadow:0 2px 5px 0 rgba(0,0,0,.5)}.mobile_menu.active.position_right{box-shadow:-2px 0 5px 0 rgba(0,0,0,.5)}.mobile_menu.active.position_bottom{box-shadow:0 -2px 5px 0 rgba(0,0,0,.5)}.mobile_menu.active.no_shadow{box-shadow:none!important}.mobile_menu_trigger{display:none}.mobile_menu_wrapper{position:relative;width:100%;overflow:hidden}.mobile_menu_overlay{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:99}.mobile_menu_overlay.background{background:rgba(0,0,0,.5)}.mobile_menu li.submenu_hide>ul{display:none}.mobile_menu li.submenu_show>ul{display:block}body.ie8 .mobile_menu,body.ie8 .mobile_menu_trigger,body.ie9 .mobile_menu,body.ie9 .mobile_menu_trigger{display:none!important}
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
  font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */

body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */

audio,
canvas,
progress,
video {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */

[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */

/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */

abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */

b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */

dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */

mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove border when inside `a` element in IE 8/9/10.
 */

img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */

/**
 * Address margin not present in IE 8/9 and Safari.
 */

figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */

pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */

/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */

/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */

button,
input,
optgroup,
select,
textarea {
  color: inherit; /* 1 */
  font: inherit; /* 2 */
  margin: 0; /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */

button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */

button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box; /* 2 */
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */

legend {
  border: 0; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */

textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */

optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

@charset "UTF-8";

/*
Theme Name: G/S/T Sicherheitstechnik
Author: Carolin Schwank
Author URI: http://www.snazzy.de
*/

/* libre-baskerville-italic - latin */
@font-face {
  font-family: 'Libre Baskerville';
  font-style: italic;
  font-weight: 400;
  src: local('Libre Baskerville Italic'), local('LibreBaskerville-Italic'),
       url('../../files/theme-gst/fonts/libre-baskerville-v5-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../files/theme-gst/fonts/libre-baskerville-v5-latin-italic.woff') format('woff'), /* Modern Browsers */
}

/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Light'), local('Roboto-Light'),
       url('../../files/theme-gst/fonts/roboto-v18-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../files/theme-gst/fonts/roboto-v18-latin-300.woff') format('woff'), /* Modern Browsers */
}
/* roboto-300italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
       url('../../files/theme-gst/fonts/roboto-v18-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../files/theme-gst/fonts/roboto-v18-latin-300italic.woff') format('woff'), /* Modern Browsers */
}
/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'),
       url('../../files/theme-gst/fonts/roboto-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../files/theme-gst/fonts/roboto-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
}
/* roboto-italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: local('Roboto Italic'), local('Roboto-Italic'),
       url('../../files/theme-gst/fonts/roboto-v18-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../files/theme-gst/fonts/roboto-v18-latin-italic.woff') format('woff'), /* Modern Browsers */
}
/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'),
       url('../../files/theme-gst/fonts/roboto-v18-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../files/theme-gst/fonts/roboto-v18-latin-700.woff') format('woff'), /* Modern Browsers */
}


/*---------------------------------------------------------------------------------------------*/
/*	General 
/*---------------------------------------------------------------------------------------------*/


:root {
  --content-width: 65rem;
}

*,
*:after,
*:before{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
}

body {	
	font-family: 'Roboto', Arial, sans-serif;
	font-size: 1rem;
  line-height: 1.52;
	color: #333;	
	background: url(../../files/theme-gst/img/layout/bg-page.jpg) #fff;
	-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust: 100%;
	text-align: center;
}

img 			{ max-width: 100%; height: auto; vertical-align: middle;}
strong 			{ font-weight: 700; }
p, ul, ol, dd 	{ margin: 0 0 1.25em 0; font-size: 1em }
figure 			{ margin-left: 0; }
blockquote		{ color: #e2001a; font-family: 'Libre Baskerville', serif; font-style: italic; }
.invisible 		{ display: none; }
.upper 			{ text-transform: uppercase; }
.indent 		{ padding-left: 3em; }
.s, .caption	{ color: #283643; font-size: 0.9em; line-height: 1.5; font-style: italic; }
.caption        { margin-top: 0.75em; font-size: 0.75em; }
.block			{ overflow: hidden; }
figure 			{ margin: 0; padding:0;}
abbr[title] 	{ border-bottom: 1px dotted #ccc; text-decoration: none; }
.box			{ background-color: #f3f3f3; padding: 0.75em 1.5em; }

#main ul, #main ol { margin-left: 1.5rem; }

/* Ausrichtung */

.center { text-align:center; }
.left { text-align:left; }
.right { text-align:right; }

#main .row, #footer .row { max-width: 1180px; margin: 0 auto; padding-left: 35px; padding-right: 35px; }

/* Farben */

.color1-1 {	color: #e2001a } /* Rot */
.color2-1 {	color: #4c4c4c } /* Mittelgrau */
.color3-1 {	color: #2ba0d6 } /* Blau */
.color4-1 { color: #797979 } /* Grau */


/*-----------------------------------------------------------------------------------*/
/*	Links
/*-----------------------------------------------------------------------------------*/

a { outline: 0; }

a:link { color: #2d4876; text-decoration: none; }
a:visited { color: #455571; }
#main a:hover { border-bottom: 2px solid #4c6897; padding-bottom: 1px; transition: ease-in Werte: 0.42, 0, 1.0, 1.0; }

#container a:link { color: #555; text-decoration: none; border-bottom: 1px solid #777; padding-bottom: 1px; }
#container a:visited { color: #777; }
#container a:hover { color: #e31722; border-bottom: 1px solid #e31722; padding-bottom: 1px; transition: ease-in Werte: 0.42, 0, 1.0, 1.0; }
#container .nav-box a { border: none; }

/*-----------------------------------------------------------------------------------*/
/*	Headlines
/*-----------------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	color:#4e4e4e;
	font-family: 'Roboto', Arial, sans-serif;
	font-weight: normal;
	line-height: 1.3;
}

h1 { font-size: 1.602em;margin: 2.5em 0 1.0em 0; }
h2 { font-size: 1.424em;margin: 1.2em 0 0.7em 0; }
h3 { font-size: 1.266em;margin: 1.2em 0 0.5em 0; }
h4 { font-size: 1.266em;margin: 1.2em 0 0.5em 0; }
h5 { font-size: 1em;margin: 1.2em 0 0.5em 0; }

#teaser h2 { font-size: 1.4em; }

.leistungen-sub h1 { margin-top: 1em; }


/*-----------------------------------------------------------------------------------*/
/*	Basic
/*-----------------------------------------------------------------------------------*/

#wrapper { 
	max-width: 1180px; 
	margin: 0 auto; 
	background-color: #fff; 
	-webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
}

#container {
	text-align: left;
	padding-bottom: 3em;
	min-height: 600px;
}

#right { margin-top: 3em; }

@media screen and (min-width:780px) {
  #right { margin-top: 3em; border-left: 1px solid #ddd; font-size: 0.875em; }
  #right.content-text, #right .content-text { padding-left: 30px; padding-top: 30px; padding-bottom: 30px; }
}

hr { 
	border: 0;
  height: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  margin: 10px 0 20px 0;
}


/*-----------------------------------------------------------------------------------*/
/*	Header und Hauptnavigation
/*-----------------------------------------------------------------------------------*/

#header { text-align: left; }
#header ul { margin: 0; padding: 0; }
#header li { list-style-type: none; }

#header .logo { margin: 2em 2em 1em 2em; text-align: center; display: flex; align-items: flex-start; }
#header .gst-logo { }
#header .slogan {
	font-family: 'Libre Baskerville', Georgia, serif;
	font-size: 1em;
	font-style: italic;
	color: #666;
	margin-top: 1em;
	padding-left: 5px;
	text-align: center;
}

@media screen and (max-width: 969px) {

	#header .metanav { display: none; }
	#header .mainnav { display: none; }
	#header .logo { display: block; text-align: center; margin-top: 2em; }
		
}

@media screen and (min-width: 970px) {
	
	#header .logo { margin: 2em 2em 2em 0; }
	
	#header .gst-logo {
		width: 400px;
		margin-right: 0.5em;
	}
	
	#header .slogan {
		width: 40%;
		margin-top: 0.2em;
		font-size: 1.166em;
		text-align: left;
	}
	
	#header .mod_customnav { text-align: right; padding-right: 2em; }
	#header .mod_customnav li { display: inline-block; padding-left: 10px; font-size: 0.81em; text-transform: uppercase; margin-top: 8px; }	
  #header .mod_customnav li > a, #header .mod_customnav li > span { color: #000; }
	#header .mod_customnav li.active > strong { color: #e2001a; }
	#header .mod_customnav li > a:hover { border-bottom: none; color: #e2001a; }
	
	#header .mainnav { background-color: #e2001a; color: #fff; text-align: left; }
	#header .mainnav ul { list-style: none; font-size: 0; }
  #header .mainnav .level_1 li { display: inline-block; font-size: 1rem; line-height: 3.0em; }
  #header .mainnav li:hover { background-color: #000; }
  #header .mainnav a, #header .mainnav strong { text-decoration: none; color: #fff; padding: 0 1.5rem; font-weight: 400; }
  #header .mainnav li.active, #header .mainnav li.trail { background-color: #000; }

  .mainnav ul.level_1 > li.submenu > a:after, .mainnav ul.level_1 > li.submenu > strong:after { content: '\002b'; font-size: 0.81rem; padding: 5px 5px 0px 5px; line-height: 1; }
  
  /* Subnav */ 
  
  .mainnav .level_2 {
      position: absolute;
      left: -50000px;
      top: -50000px;
      z-index: 1000;
      overflow: hidden;
      display: block;
      width: 0;
      height: 0;
      background-color: #000;
      text-align: left;
  }
   
  .mainnav li:hover > .level_2 {
      left: auto;
      top: auto;
      overflow: auto;
      display: block;
      width: auto;		
      height: auto;
      z-index: 1000;
      padding: 0;
  }
  
  .mainnav .level_2 { width: auto; }
  
  .mainnav .level_2 li {
    min-width: 250px;
    border-bottom: 1px solid #999;
    display: block !important;
    line-height: 3;
    text-align: left;
  }
  
  .mainnav .level_2 li strong.active { color: #e2001a !important; }  
  .mainnav .level_2 li:hover { background-color: #333 !important; } 
  .mainnav li:hover .level_2 li.last { border-bottom: none; }
 
  .mainnav ul.level_2 {		
      -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.5);
      -moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.5);
      box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.5);
  }

}	


/*-----------------------------------------------------------------------------------*/
/*  Mobiles Menü
/*-----------------------------------------------------------------------------------*/

#header .mod_mobile_menu {
	text-align: right;
	-webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
}

#header .mobile_menu_trigger { 
	height: 40px; 
	width: 100%; 
	-webkit-transition: all 0.5s; 
	-moz-transition: all 0.5s; transition: all 0.5s; 
	background: url('../../files/theme-gst/img/misc/icon-mobile-menu-open.png') no-repeat; 
	background-position: center right;
	background-size: contain;
  background-color: #000;
}
#header.fixed-header .mobile_menu_trigger { height: 40px; width: 40px; }

#header .mobile_menu_trigger.active { 
	background: url('../../files/theme-gst/img/misc/icon-mobile-menu-close.png') no-repeat; 
	background-position: center right;
	background-size: contain;
	background-color: #000;
}

.mobile_menu { z-index: 1000; }
.mobile_menu a { outline: 0; text-decoration: none; color: #fff; }
.mobile_menu a:link { color: #fff; opacity: 0.6; }
.mobile_menu a:visited { color: #fff; opacity: 0.6; }
.mobile_menu a:hover { opacity: 0.8; }
.mobile_menu a:focus { outline: gray; }
.mobile_menu a:active { color: #cf3a2f; }

.mobile_menu .inner { background-color: #1a2227 !important; position: relative; }

.mobile-nav-main { font-size: 1.2rem; margin-top: 3.5em; text-align: left; }
.mobile-nav-main .level_1 > ul { border-top: 1px solid rgba(255,255,255,0.2); margin-bottom: 0; }
.mobile-nav-main .level_1 > li { display: block; padding: 0 20px; border-bottom: 1px solid rgba(255,255,255,0.2); line-height: 2.6em; }
.mobile-nav-main .level_1 li:hover { color: rgba(255,255,255,0.9);  background-color: #000; }
.mobile-nav-main li a { color: #444; display: block; width: 100%; height: 100%; text-decoration: none; }
.mobile-nav-main li.active strong { color: #fff; }
.mobile-nav-main ul.level_1 > li.submenu > a { cursor: default; }
.mobile-nav-main ul.level_1 > li.submenu > a:after { content: '\002b'; font-size: 0.81rem; padding: 5px 5px 0 5px; line-height: 1; } 

/* Mobile Subnav */

.mobile-nav-main .level_2 > ul {  margin: 0; padding: 0; }
.mobile-nav-main .level_2 > li { list-style: none; font-size: 1.0rem; line-height: 2em; }
.mobile-nav-main .level_2 > li a:before, .mobile-nav-main .level_2 > li strong:before { content: '\203A'; padding-right: 10px; color: #fff; }
.mobile-nav-main .level_2 > li.active { font-weight: 600; }

/* Mobile Kontakt */

.menu-kontakt { color: #fff; opacity: 0.6; padding: 0 0 0 20px; margin-top: 2em; font-size: 85%; line-height: 1.5;  text-align: left;}
.menu-kontakt a { color: #444; text-decoration: none; outline: none; }
.menu-kontakt a:hover { color: #999; }

/* Mobile Metanav */

.mobile-nav-meta { margin-top: 1.5em; font-size: 1rem; text-align: left; }
.mobile-nav-meta ul { margin-bottom: 0; }
.mobile-nav-meta li { display: block; padding: 0 20px; }
.mobile-nav-meta li a { color: #444; display: block; width: 100%; height: 100%; text-decoration: none; }
.mobile-nav-meta li.active { color: #fff; }


/*-----------------------------------------------------------------------------------*/
/*  Custommenu
/*-----------------------------------------------------------------------------------*/

.mod_custommmenu li.leistungen-sub a:hover { color: #e2001a }
.mod_custommmenu ul { text-align: left; }
.mod_custommmenu li.leistungen-sub a { padding-left: 4em; }
.mod_custommmenu li.leistungen-sub a:before { content: '\f105';font-family: 'Font Awesome 5 Free'; padding-right: 10px; }


/*-----------------------------------------------------------------------------------*/
/*  Breadcrumby bei Leistungen
/*-----------------------------------------------------------------------------------*/

.mod_breadcrumb { margin-left: 35px; margin-right: 35px; margin-top: 2em; margin-bottom: 0.5rem; border-bottom: 1px solid #ddd; padding-bottom: 5px; }
#main .mod_breadcrumb ul { padding: 0; margin: 0; list-style: none; font-size: 0.875em; color: #555 }
.mod_breadcrumb li { display: inline-block; }
.mod_breadcrumb li.active { font-weight: 700; }
#container .mod_breadcrumb a { color: #777; border-bottom: none; }
#container .mod_breadcrumb a:hover { border-bottom: none; color: #e2001a }

.mod_breadcrumb li:after { content: '\203A'; padding: 0 10px; }
.mod_breadcrumb li.last:after { content: none; }

/*-----------------------------------------------------------------------------------*/
/*  Startseite
/*-----------------------------------------------------------------------------------*/

.startseite .keyvisual {
	background: url(../../files/theme-gst/img/keyvisual/keyvisual-startseite.jpg) 0 0px no-repeat;
	background-size: cover;
	height: 400px !important;
}

.startseite .teaser {
	background-color: #e9e9e9;
	padding: 4em 0 3em 0;
}

.startseite .teaser h2 { 
	color: #e2001a;
	text-transform: uppercase;
	font-size: 1.2em;
	font-weight: 700;
	margin: 1em 0 0.5em 0;
}

.startseite #container .teaser a { color: #333; border-bottom: none; }
.startseite #container .teaser a:hover { color: #e2001a; border-bottom: none; }

#sidebar-start { border-left: 1px solid #ddd; margin-top: 3em; padding-left: 1.5em; }
#sidebar-start h3 { text-transform: uppercase; font-size: 0.875em; color: #e2001a; font-weight: 700; } 
#sidebar-start p { font-size: 0.875em; }
.startseite .layout_latest .teaser { background-color: transparent; margin: 0; padding: 0; }
.startseite .layout_latest h2 { font-size: 1.266em; margin: 0; }
.startseite .layout_latest p.info { font-size: 0.75em !important; color: #666; text-transform: uppercase; margin: 0.5em 0; }

@media screen and (min-width: 970px) { 
	
	.startseite .keyvisual { height: 450px; }
	
}


.startseite .teaser h2::before {
  content: " "; 
  display: block;
  width: 70px; 
  height: 70px; 
  background-size: contain; 
  background-repeat: no-repeat; 
  margin-bottom: 10px; 
  margin: 0 auto 20px auto;
}

.startseite .banken h2::before { background-image: url(../../files/theme-gst/img/illustration/iconBank2); } 
.startseite .handel h2::before { background-image: url(../../files/theme-gst/img/illustration/iconHandel2); }
.startseite .privat h2::before { background-image: url(../../files/theme-gst/img/illustration/iconPrivat2); }


/*-----------------------------------------------------------------------------------*/
/*  Contentseiten
/*-----------------------------------------------------------------------------------*/


/*----- Bilder ----*/

.img-content figure { margin: 2em 0; }
.img-content figure figcaption { margin-top: 0.5em; font-style: italic; }


/*---- Blockquote ----*/

.service blockquote, .partner blockquote, .jobs blockquote, .zertifizierungen blockquote, .ueber-uns blockquote, .leistungen blockquote, .leistungen-sub blockquote, .privat blockquote, .handel blockquote, .banken blockquote, .startseite blockquote  { 
	float: left;
	text-align: right;
	font-size: 1.225em;
	width: 200px;
	margin: 0.25em 0.75em 0.25em 0;
	padding: 0 0.5em 0 0;
	border-right: 1px solid #e2001a;
}

.service blockquote > p, .partner blockquote > p, .jobs blockquote > p, .zertifizierungen blockquote > p, .ueber-uns blockquote > p, .leistungen blockquote > p, .leistungen-sub blockquote > p, .privat blockquote > p, .handel blockquote > p, .banken blockquote > p, .startseite blockquote > p { margin: 0; }

.leistungen blockquote { width: 35%;}
.leistungen-sub .kommunikationstechnik blockquote { width: 40%; }
.leistungen-sub .stoermelde blockquote { width: 32%; padding-bottom: 5px; padding-top: 5px; } 
.leistungen-sub .videoueberwachung blockquote { width: 31%; padding-bottom: 5px; padding-top: 5px; } 


/*---- Service ----*/

.service .logos ul { list-style: none; margin: 0; padding: 0; }
.service .logos ul > li { display: inline-block; width: 120px;height: 120px; }
.service .logos ul > li > a { display: block; text-indent: -10000px; width: 100%; height: 100%; border-bottom: none; }

.service .logos li.nws { background: url('../../files/theme-gst/img/logos/logo-nws.png') no-repeat;margin-right: 30px; }
.service .logos li.nws { background-size: cover; }
.service .logos li.mls { background: url('../../files/theme-gst/img/logos/logo-mls.gif') 0 20px no-repeat; }

#main .nws a:link, #main .mls a:link, #main .nws a:hover, #main .mls a:hover { border-bottom: none; }

/*---- Partner ----*/

.partner blockquote { font-size: 1.125em; }

.partner .logos ul { list-style: none; margin: 0; padding: 0; }
.partner .logos ul > li { display: inline-block; width: 120px;height: 120px; }
.partner .logos ul > li > a { display: block; text-indent: -10000px; width: 100%; height: 100%; border-bottom: none; }
.partner .logos li.nws { background: url('../../files/theme-gst/img/logos/logo-nws.png') no-repeat;margin-right: 30px; }
.partner .logos li.nws { background-size: cover; }
.partner .logos li.mls { background: url('../../files/theme-gst/img/logos/logo-mls.gif') 0 20px no-repeat; }

/*---- Zertifikate ----*/

.zertifizierungen blockquote { font-size: 1.125em; }


/*---- Leistungen ----*/

.nav-box { max-width: 1180px; margin-top: 2em; margin-right: 35px; margin-left: 35px; margin-bottom: 3em; padding: 2em; background-color: #e9e9e9; }
.nav-box .leistungen-headline p { text-transform: uppercase; font-size: 0.875em; color: #e2001a; font-weight: 700; margin: 0 0 1em 0; }

.nav-box .overview { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap: 5px 20px; }
.nav-box .overview div { padding: 0; font-size: 1em; line-height: 1.4; }
.nav-box .overview div:before { content: '\2713'; font-size: 1em; color: #e2001a; padding-right: 6px; }

.leistungen h1 { margin-top: 1em; }
.leistungen .infografik { height: 260px; }
.leistungen .infografik p { font-weight: bold; margin: 5px 15px; font-size: 0.875em; }


/*---- Funk-Alarmanlagen ----*/

.funk ul.logos { list-style: none; margin: 0; padding: 0; }
.funk ul.logos > li { display: inline-block; width: 160px;height: 60px; }
.funk ul.logos > li > a { display: block; text-indent: -10000px; width: 100%; height: 100%; border-bottom: none; }
.funk #main ul.logos > li > a:link { border-bottom: none; }
.funk .logos li.honeywell { background: url('../../files/theme-gst/img/logos/logo-honeywell.png') 0 center no-repeat; margin-right: 30px; }
.funk .logos li.telenot { background: url('../../files/theme-gst/img/logos/logo-telenot.png') 0 center no-repeat; }


/*---- Kontaktformular ----*/

.kontakt .ce_form { margin-top: 0em; }
.kontakt .explanation { font-family: 'Roboto', sans-serif; font-size: 0.875em; color: #999; }
.kontakt fieldset { border: none; padding: 0;  }
.kontakt .radio_container { margin-bottom: 1em; font-family: 'Roboto', sans-serif }
.kontakt .radio_container legend { font-weight: 700; float: left; margin-right: 2em;  }
.kontakt .radio_container span { display: block; float: left; margin-right: 2em; }
.kontakt .radio_container span { display: block; margin-bottom: 0.5em; }

.kontakt input[type="radio"] { margin-right: 0.5em; }
.kontakt .widget-text, .kontakt .widget-textarea, .kontakt .widget-captcha { margin-bottom: 1em; }
.kontakt .widget-text label, .kontakt .widget-textarea label, .kontakt .widget-captcha  label { display: block;margin-bottom: 0.3em;font-weight:bold;font-family: 'Roboto', sans-serif; }
.kontakt input[type="text"], .kontakt textarea { padding: 0.8em 0.5em; width: 100%;background-color: #f9f9f9; border:none; border-bottom: 1px solid #bbb;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075); }
.kontakt input[type="text"]:focus, .kontakt textarea:focus { background-color: #fff; }


.kontakt button[type="submit"] {
	font-family: 'Roboto', sans-serif;
	background-color: #e2001a;
	color: #fff;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	line-height: 1.5em;
	padding: 0.6em 1.8em;
	margin-top: 1rem;
	font-size: 1.1em;
	border: none;
}

.kontakt button[type="submit"]:hover { background-color: #000; }
.kontakt button[type="text"].captcha { width: 160px;text-align: center;margin-right: 0.6em;font-family: 'Roboto Condensed', sans-serif }
.kontakt .captcha_text { font-style: italic;font-family: 'Roboto Condensed', sans-serif }
.kontakt span.mandatory { color: #e2001a; padding-left: 0.5em; }

@media screen and (min-width:780px) {
	
	div.vorname, div.telefon { width: 50%; float: left; padding-right: 10px;}
	div.nachname, div.email { width: 50%; float: right; padding-left: 10px;}
}


/*-----------------------------------------------------------------------------------*/
/*  Keyvisual
/*-----------------------------------------------------------------------------------*/

.leistungen .keyvisual {
	background: url(../../files/theme-gst/img/keyvisual/keyvisual-leistungen.jpg) 0 0 no-repeat;
	background-size: cover;
	height: 300px;
}

.banken .keyvisual {
	background: url(../../files/theme-gst/img/keyvisual/keyvisual-banken.jpg) 0 -50px no-repeat;
	background-size: cover;
	height: 300px;
}

.handel .keyvisual {
	background: url(../../files/theme-gst/img/keyvisual/keyvisual-handel.jpg) 0 -50px no-repeat;
	background-size: cover;
	height: 300px;
}

.privat .keyvisual {
	background: url(../../files/theme-gst/img/keyvisual/keyvisual-privat.jpg) 0 -50px no-repeat;
	background-size: cover;
	height: 300px;
}

.zertifizierungen .keyvisual {
	background: url(../../files/theme-gst/img/keyvisual/keyvisual-zertifizierung.jpg) 0 0 no-repeat;
	background-size: cover;
	height: 300px;
}


/*-----------------------------------------------------------------------------------*/
/*	Sidebar
/*-----------------------------------------------------------------------------------*/

#right h3 { text-transform: uppercase; font-size: 1em; color: #e2001a; font-weight: 700; margin: 1em 0 1em 0; }

.mod_newslist { background-color: #f3f3f3; padding: 0 1em; }


/*-----------------------------------------------------------------------------------*/
/*	Footer
/*-----------------------------------------------------------------------------------*/

#footer .row {}

#footer .eof { 
	color: rgba(255,255,255,0.75);
	text-align: left;
	padding-left: 0.5em;
	padding-right: 0.5em;
	padding-top: 2.5em;
	padding-bottom: 2.5em;
}

#footer .info p, #footer .eof p { margin: 0; }
#footer .info a { color: rgba(0,0,0,0.5); }
#footer .eof a { color: rgba(255,255,255,0.5); }
#footer .info a:hover, #footer .eof a:hover { border-bottom: 0; color: #aaa; }

#footer .info { background-color: #d2d7e1;  }
#footer .eof { background-color: #000; text-align: left; font-size: 0.85em; }

#footer .info { 
	color: rgba(0,0,0,0.75);
	text-align: left;
	font-size: 0.9em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	padding-top: 3em;
	padding-bottom: 3em;
}

#footer .info .footer-logo { margin-top: 10px; margin-bottom: 12px; }
#footer .eof .second, #footer .eof .first { text-align: center; }


@media screen and (max-width:929px) {
	
	#footer .footer-logos { margin-top: 2em; }
	#footer .info div:nth-child(2) { margin-top: 2em; }
	
}

@media screen and (min-width:930px) {
  
	#footer .eof .second { text-align: right; }
	#footer .eof .first { text-align: left; }
	#footer .footer-logos { text-align: right; }
	
}


/*-----------------------------------------------------------------------------------*/
/*	Abstände
/*-----------------------------------------------------------------------------------*/

/* padding-bottom */

.pb10 { padding-bottom: 10px;}
.pb20 { padding-bottom: 20px;}
.pb30 { padding-bottom: 30px;}
.pb40 { padding-bottom: 40px;}
.pb50 { padding-bottom: 50px;}
.pb60 { padding-bottom: 60px;}
.pb70 { padding-bottom: 70px;}
.pb80 { padding-bottom: 80px;}
.pb90 { padding-bottom: 90px;}
.pb100 { padding-bottom: 100px;}

/* padding-top */

.pt10 { padding-top: 10px;}
.pt20 { padding-top: 20px;}
.pt30 { padding-top: 30px;}
.pt40 { padding-top: 40px;}
.pt50 { padding-top: 50px;}
.pt60 { padding-top: 60px;}
.pt70 { padding-top: 70px;}
.pt80 { padding-top: 80px;}
.pt90 { padding-top: 90px;}
.pt100 { padding-top: 100px;}

/* margin-bottom */

.mb10 { margin-bottom: 10px;}
.mb20 { margin-bottom: 20px;}
.mb30 { margin-bottom: 30px;}
.mb40 { margin-bottom: 40px;}
.mb50 { margin-bottom: 50px;}
.mb60 { margin-bottom: 60px;}
.mb70 { margin-bottom: 70px;}
.mb80 { margin-bottom: 80px;}
.mb90 { margin-bottom: 90px;}
.mb100 { margin-bottom: 100px;}

/* margin-bottom */

.mt10 { margin-top: 10px;}
.mt20 { margin-top: 20px;}
.mt30 { margin-top: 30px;}
.mt40 { margin-top: 40px;}
.mt50 { margin-top: 50px;}
.mt60 { margin-top: 60px;}
.mt70 { margin-top: 70px;}
.mt80 { margin-top: 80px;}
.mt90 { margin-top: 90px;}
.mt100 { margin-top: 100px;}


