/*--- grid - System ---*/

.row
{
  max-width: 100%;
}

/*--- col-12 (fertig) ---*/

header .layout-smartphone-p .col-12
{
  width: 100%;
}
header .layout-smartphone-l .col-12
{
  width: 100%;
}
header .layout-tablet-p .col-12
{
  width: 100%;
}
header .layout-tablet-l .col-12
{
  width: 100%;
}
header .layout-desktop .col-12
{
  width: 100%;
}
header .layout-ultrawide .col-12
{
  width: 100%;
}

main .layout-smartphone-p .col-12
{
  width: 100%;
}
main .layout-smartphone-l .col-12
{
  width: 100%;
}
main .layout-tablet-p .col-12
{
  width: 100%;
}
main .layout-tablet-l .col-12
{
  width: 100%;
}
main .layout-desktop .col-12
{
  width: 100%;
}
main .layout-ultrawide .col-12
{
  width: 100%;
}

footer .layout-smartphone-p .col-12
{
  width: 100%;
}
footer .layout-smartphone-l .col-12
{
  width: 100%;
}
footer .layout-tablet-p .col-12
{
  width: 100%;
}
footer .layout-tablet-l .col-12
{
  width: 100%;
}
footer .layout-desktop .col-12
{
  width: 100%;
}
footer .layout-ultrawide .col-12
{
  width: 100%;
}

/*--- col-11 (fertig) ---*/

header .layout-smartphone-p .col-11
{
  width: 91.67%;
}
header .layout-smartphone-l .col-11
{
  width: 91.67%;
}
header .layout-tablet-p .col-11
{
  width: 91.67%;
}
header .layout-tablet-l .col-11
{
  width: 91.67%;
}
header .layout-desktop .col-11
{
  width: 91.67%;
}
header .layout-ultrawide .col-11
{
  width: 91.67%;
}

main .layout-smartphone-p .col-11
{
  width: 91.67%;
}
main .layout-smartphone-l .col-11
{
  width: 91.67%;
}
main .layout-tablet-p .col-11
{
  width: 91.67%;
}
main .layout-tablet-l .col-11
{
  width: 91.67%;
}
main .layout-desktop .col-11
{
  width: 91.67%;
}
main .layout-ultrawide .col-11
{
  width: 91.67%;
}

footer .layout-smartphone-p .col-11
{
  width: 91.67%;
}
footer .layout-smartphone-l .col-11
{
  width: 91.67%;
}
footer .layout-tablet-p .col-11
{
  width: 91.67%;
}
footer .layout-tablet-l .col-11
{
  width: 91.67%;
}
footer .layout-desktop .col-11
{
  width: 91.67%;
}
footer .layout-ultrawide .col-11
{
  width: 91.67%;
}

/*--- col-10 ---*/

/*
.layout-smartphone-p,
.layout-smartphone-l,
.layout-tablet-p,
.layout-tablet-l,
.layout-desktop,
.layout-ultrawide
*/

/*--- col-9 ---*/

/*
.layout-smartphone-p,
.layout-smartphone-l,
.layout-tablet-p,
.layout-tablet-l,
.layout-desktop,
.layout-ultrawide
*/

/*--- col-8 ---*/

/*
.layout-smartphone-p,
.layout-smartphone-l,
.layout-tablet-p,
.layout-tablet-l,
.layout-desktop,
.layout-ultrawide
*/

/*--- col-7 ---*/

/*
.layout-smartphone-p,
.layout-smartphone-l,
.layout-tablet-p,
.layout-tablet-l,
.layout-desktop,
.layout-ultrawide
*/

/*--- col-6 (fertig) ---*/

header .layout-smartphone-p .col-6
{
  width: 50%;
}
header .layout-smartphone-l .col-6
{
  width: 50%;
}
header .layout-tablet-p .col-6
{
  width: 50%;
}
header .layout-tablet-l .col-6
{
  width: 50%;
}
header .layout-desktop .col-6
{
  width: 50%;
}
header .layout-ultrawide .col-6
{
  width: 50%;
}

main .layout-smartphone-p .col-6
{
  width: 50%;
}
main .layout-smartphone-l .col-6
{
  width: 50%;
}
main .layout-tablet-p .col-6
{
  width: 50%;
}
main .layout-tablet-l .col-6
{
  width: 50%;
}
main .layout-desktop .col-6
{
  width: 50%;
}
main .layout-ultrawide .col-6
{
  width: 50%;
}

footer .layout-smartphone-p .col-6
{
  width: 50%;
}
footer .layout-smartphone-l .col-6
{
  width: 50%;
}
footer .layout-tablet-p .col-6
{
  width: 50%;
}
footer .layout-tablet-l .col-6
{
  width: 50%;
}
footer .layout-desktop .col-6
{
  width: 50%;
}
footer .layout-ultrawide .col-6
{
  width: 50%;
}

/*--- col-5 ---*/

/*
.layout-smartphone-p,
.layout-smartphone-l,
.layout-tablet-p,
.layout-tablet-l,
.layout-desktop,
.layout-ultrawide
*/

/*--- col-4 (fertig) ---*/

header .layout-smartphone-p .col-4
{
  width: 33.33%;
}
header .layout-smartphone-l .col-4
{
  width: 33.33%;
}
header .layout-tablet-p .col-4
{
  width: 33.33%;
}
header .layout-tablet-l .col-4
{
  width: 33.33%;
}
header .layout-desktop .col-4
{
  width: 33.33%;
  display: flex;
  justify-content: flex-end;
  margin-right: 33px;
}
header .layout-ultrawide .col-4
{
  width: 33.33%;
  display: flex;
  justify-content: flex-end;
  margin-right: 60px;
}

main .layout-smartphone-p .col-4
{
  width: 33.33%;
}
main .layout-smartphone-l .col-4
{
  width: 33.33%;
}
main .layout-tablet-p .col-4
{
  width: 33.33%;
}
main .layout-tablet-l .col-4
{
  width: 33.33%;
}
main .layout-desktop .col-4
{
  width: 33.33%;
}
main .layout-ultrawide .col-4
{
  width: 33.33%;
}

footer .layout-smartphone-p .col-4
{
  width: 33.33%;
}
footer .layout-smartphone-l .col-4
{
  width: 33.33%;
}
footer .layout-tablet-p .col-4
{
  width: 33.33%;
}
footer .layout-tablet-l .col-4
{
  width: 33.33%;
}
footer .layout-desktop .col-4
{
  width: 33.33%;
}
footer .layout-ultrawide .col-4
{
  width: 33.33%;
}

/*--- col-3 (fertig) ---*/

header .layout-smartphone-p .col-3
{
  width: 25%;
}
header .layout-smartphone-l .col-3
{
  width: 25%;
}
header .layout-tablet-p .col-3
{
  width: 25%;
}
header .layout-tablet-l .col-3
{
  width: 25%;
}
header .layout-desktop .col-3
{
  width: 25%;
}
header .layout-ultrawide .col-3
{
  width: 25%;
}

main .layout-smartphone-p .col-3
{
  width: 25%;
}
main .layout-smartphone-l .col-3
{
  width: 25%;
}
main .layout-tablet-p .col-3
{
  width: 25%;
}
main .layout-tablet-l .col-3
{
  width: 25%;
}
main .layout-desktop .col-3
{
  width: 25%;
}
main .layout-ultrawide .col-3
{
  width: 25%;
}

footer .layout-smartphone-p .col-3
{
  width: 25%;
}
footer .layout-smartphone-l .col-3
{
  width: 25%;
}
footer .layout-tablet-p .col-3
{
  width: 25%;
}
footer .layout-tablet-l .col-3
{
  width: 25%;
}
footer .layout-desktop .col-3
{
  width: 25%;
}
footer .layout-ultrawide .col-3
{
  width: 25%;
}

/*--- col-2 ---*/

header .layout-smartphone-p .col-2
{
  width: 16.67%;
}
header .layout-smartphone-l .col-2
{
  width: 16.67%;
}
header .layout-tablet-p .col-2
{
  width: 16.67%;
}
header .layout-tablet-l .col-2
{
  width: 16.67%;
}
header .layout-desktop .col-2
{
  width: 16.67%;
}
header .layout-ultrawide .col-2
{
  width: 16.67%;
}

main .layout-smartphone-p .col-2
{
  width: 16.67%;
}
main .layout-smartphone-l .col-2
{
  width: 16.67%;
}
main .layout-tablet-p .col-2
{
  width: 16.67%;
}
main .layout-tablet-l .col-2
{
  width: 16.67%;
}
main .layout-desktop .col-2
{
  width: 16.67%;
}
main .layout-ultrawide .col-2
{
  width: 16.67%;
}

footer .layout-smartphone-p .col-2
{
  width: 16.67%;
}
footer .layout-smartphone-l .col-2
{
  width: 16.67%;
}
footer .layout-tablet-p .col-2
{
  width: 16.67%;
}
footer .layout-tablet-l .col-2
{
  width: 16.67%;
}
footer .layout-desktop .col-2
{
  width: 16.67%;
}
footer .layout-ultrawide .col-2
{
  width: 16.67%;
}

/*--- col-1 ---*/

/*
.layout-smartphone-p,
.layout-smartphone-l,
.layout-tablet-p,
.layout-tablet-l,
.layout-desktop,
.layout-ultrawide
*/

/*--- Ausrichtung ---*/

.valign-ctr
{
  align-items: center;
}

.halign-left
{
  text-align: left;
}

.halign-ctr
{
  text-align: center;
}
.halign-ctr-smartphone-p {
  display: flex;
  justify-content: center;
}
.halign-ctr-ultrawide {
  display: flex;
  justify-content: center;
}

.halign-right
{
  margin-left: auto;
}

/*--- globale Abstände ---*/

.padding-20
{
  padding: 20px 0 20px 0;
}

.padding-20-all
{
  padding: 20px;
}

.padding-top-150
{
  padding-top: 150px;
}