/*-----------------------------------------------------------------------------------*/
/*	WEBSITE:  Power-Trax.de 
/*-----------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------*/
/*	Farben
/*-----------------------------------------------------------------------------------*/

/*

Dunkelblau: #335a79
Rot: #c63648
Grau Schrift: #565656
Hellgraue Elemente: #e1e1e1
Hellblau: #d6dee4 

*/

/*-----------------------------------------------------------------------------------*/
/*	externe Schriften
/*-----------------------------------------------------------------------------------*/

@import url("http://www.power-trax.de/fonts/TitilliumWeb.font");

/* Reset
--------------------------------------------------------------------------------------- */

* {
  padding: 0;
  margin: 0;
  border: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
audio:not([controls]) {
  display: none;
}
html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
:hover,
:focus,
:active {
  outline: none;
}

img {
  max-width: 100%;
  height: auto;
}

.bilderrahmen img {
  padding: 0;
  border-bottom: 4px solid #008fa4;
}
.flexboxgrau .bilderrahmen img {
  padding: 0;
  border-bottom: 4px solid #95c11a;
}

a:active,
a:focus {
  outline: none;
  text-decoration: none;
}

/* Globals 
--------------------------------------------------------------------------------------- */

html {
  background-color: #ffffff;
  color: #5c5c5b;
  font-family: "Titillium Web", Arial, Tahoma, Helvetica, sans-serif;
  font-weight: 300;
  font-size: 15px;
  line-height: 1.4em;
}

body {
  font-family: "Titillium Web", Arial, Tahoma, Helvetica, sans-serif;
  font-weight: 300;
  color: #5c5c5b;
  font-size: 15px;
  line-height: 1.4em;
}

html > body {
  font-size: 15px;
  line-height: 1.4em;
  height: 100%;
}

/* -- TYPO
------------------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-weight: 300;
}

h1 {
  font-size: 1.8em;
  font-family: "Courier New", Courier, monospace;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1em;
  color: #ffffff;
  margin: 1em 0.5em 0.05em 0.5em;
  font-weight: 600;
}

h2 {
  font-size: 1.8em;
  font-family: "Courier New", Courier, monospace;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  line-height: 1.2em;
  color: #ffffff;
  margin: 0 0.5em 1em 0.5em;
  font-weight: 500;
}

h3 {
  font-size: 2em;
  font-family: "Titillium Web", sans-serif;
  letter-spacing: 0;
  text-transform: uppercase;
  line-height: 1em;
  color: #c63648;
  margin: 0.1em 0 0.5em 0;
  font-weight: 300;
}

h4 {
  font-size: 1.2em;
  font-family: "Titillium Web", sans-serif;
  letter-spacing: 0.02em;
  text-transform: none;
  line-height: 1.2em;
  color: #000000;
  font-weight: 300;
  text-align: left;
}

h4.h4-center-rot {
  font-size: 1.2em;
  font-family: "Titillium Web", sans-serif;
  letter-spacing: 0.02em;
  text-transform: none;
  line-height: 1.2em;
  color: #c63648;
  font-weight: 300;
  text-align: center;
  padding: 0.5em 0;
}

h5 {
  font-size: 2em;
  font-family: "Titillium Web", sans-serif;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1em;
  color: #c63648;
  margin: 0.1em 0 0 0;
  font-weight: 300;
  text-transform: uppercase;
}

h6 {
  font-size: 1em;
  font-family: "Titillium Web", sans-serif;
  letter-spacing: 0.02em;
  text-transform: none;
  line-height: 1.2em;
  color: #000000;
  font-weight: 300;
  text-align: left;
  text-transform: uppercase;
  padding: 8px 0 0 0;
}

h7 {
  font-size: 1em;
  font-family: "Titillium Web", sans-serif;
  letter-spacing: 0.02em;
  text-transform: none;
  line-height: 1.2em;
  color: #c63648;
  font-weight: 300;
  text-align: left;
  text-transform: uppercase;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: #333;
  text-decoration: none;
}
h1 a:hover,
h2 a:hover,
fleximgtxtbox a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover {
  color: #0078cf;
  text-decoration: underline;
}

p {
  padding: 5px 0 10px 0;
}

p.p-box {
  padding: 7px;
}

p.p-box-klein {
  padding: 2px;
}

.txtleft {
  text-align: left;
}

.txtflexleft {
  text-align: left;
}

.txtcenter {
  text-align: center;
}

.txtright {
  text-align: right;
}

.txtweiss {
  color: #ffffff;
}

.txtrot {
  color: #c63648;
}

.txthellblau {
  color: #8498a8;
}

.txtmittelblau {
  color: #335a79;
}

.txtblau {
  color: #335a79;
}

.txtschwarz {
  color: #000000;
}

.txthellgrau {
  color: #878787;
}

.txtlogofont {
  font-family: "Courier New", Courier, monospace;
  font-size: 1.25em;
  font-weight: 500;
}

.pfad {
  color: #989e9e;
  font-size: 0.85em;
  letter-spacing: 0.05em;
}

.zusatzlnks {
  color: #335a79;
  font-size: 0.9em;
  letter-spacing: 0.05em;
}

.zusatzlnks .active {
  color: #c63648;
}

.footerlnk {
  color: #b3c0c7;
}

.txtklein {
  font-size: 0.9em;
}

.txtversalien {
  text-transform: uppercase;
}

.txtgross {
  font-size: 1.6em;
  line-height: 1.3em;
}

.txtabstand {
  padding: 0 7px;
}

.txtabstand-klein {
  padding: 0 3px;
}

/* -- Hintergrund
------------------------------------------------------------- */

.bg-weiss {
  background-color: #ffffff;
}

.bg-dunkelblau {
  background-color: #25353d;
}

.bg-mittelblau {
  background-color: #335a79;
}

.bg-boxblau {
  background-color: #99acbc;
}

.bg-hellblau {
  background-color: #d6dee4;
}

.bg-box-grau {
  background-color: #edefef;
}

.bg-light-grau {
  background-color: #c3cbcb;
}

.bg-mid-grau {
  background-color: #989e9e;
}

.bg-blau-grau {
  background-color: #25353d;
}

.bg-weiss-aussen {
  border-left: 5px solid #ffffff;
  border-right: 5px solid #ffffff;
}

.bg-mit-bild {
  background-image: url(../images/musterhintergrund.jpg);
  background-position: bottom center;
  background-repeat: no-repeat;
}

.bg-ecke-rot {
  background-image: url(../images/ecke-rot.png);
  background-position: top right;
  background-repeat: no-repeat;
}

.bg-ecke-blau {
  background-image: url(../images/ecke-blau.png);
  background-position: top right;
  background-repeat: no-repeat;
}

.bg-ecke-weiss {
  background-image: url(../images/ecke-weiss.png);
  background-position: 0 30px;
  background-repeat: no-repeat;
}

.bg-leiste-rot {
  background-image: url(../images/leiste-rot.png);
  background-position: left top;
  background-repeat: repeat-y;
}

.bg-weisse-zeichnung {
  background-image: url(../images/bg-hellblau-zeichnung.png);
  background-position: 7% 55%;
  background-repeat: no-repeat;
}

/* -- 2er-Flex-Box fliessend
------------------------------------------------------------- */

.flexbox {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flexbox;
  display: box;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;

  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}
.flexbox .col {
  flex: 1;
  padding: 0;
  -webkit-box-flex: 1;
  box-flex: 1;
  width: 30%;
  background-color: #ebeff2;
  margin: 10px;
}
.flexbox .col:nth-child(1) {
  -webkit-order: 0;
  -ms-flex-order: 0;
  order: 0;
}

.flexbox .col:nth-child(2) {
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}

.flexbox .col:nth-child(3) {
  -webkit-order: 2;
  -ms-flex-order: 2;
  order: 2;
}

/* -- LINKS
------------------------------------------------------------- */

a {
  text-decoration: none;
  color: #c63648;
}

a:hover {
  text-decoration: none;
  color: #000000;
  transition: all 0.2s ease-out 0s;
}

a.btnicon {
  padding: 0 3px 0 3px;
  margin: 0;
  opacity: 1;
  transition: all 0.2s ease-out 0s;
}

a.btnicon:hover {
  opacity: 0.5;
}

.toggle_container a {
  color: #c3cbcb;
  padding-left: 20px;
  background-image: url(../images/pfeil_grau.png);
  background-repeat: no-repeat;
  background-position: 1px 5px;
  font-size: 0.9em;
}

.toggle_container a:hover {
  color: #ffffff;
  transition: all 0.2s ease-out 0s;
  font-size: 0.9em;
}

.toggle_container a.lnkblanko {
  color: #c3cbcb;
  padding-left: 0;
  background-image: none;
  font-size: 1em;
}

.toggle_container a.lnkblanko:hover {
  color: #ffffff;
  transition: all 0.2s ease-out 0s;
  font-size: 1em;
}

.pfad a {
  color: #989e9e;
  text-transform: uppercase;
}

.pfad a:hover {
  color: #b0b7b7;
  transition: all 0.2s ease-out 0s;
  text-transform: uppercase;
}

.txtweiss a {
  color: #ffffff;
}

.txtweiss a:hover {
  color: #b3c0c7;
  transition: all 0.2s ease-out 0s;
}

.footerlnk a {
  color: #b3c0c7;
}

.footerlnk a:hover {
  color: #ffffff;
  transition: all 0.2s ease-out 0s;
}

a.lnk-blaue-box {
  color: #ffffff;
  display: block;
  margin: 10px;
}

a.lnk-blaue-box:hover {
  color: #25353d;
  transition: all 0.2s ease-out 0s;
}

a.lnk-blaue-box-mit-pfeil {
  color: #ffffff;
  padding-left: 20px;
  background-image: url(../images/roter-pfeil.png);
  background-repeat: no-repeat;
  background-position: 1px 7px;
}

a.lnk-blaue-box-mit-pfeil:hover {
  color: #25353d;
  transition: all 0.2s ease-out 0s;
}

a.lnk-blaue-box-ohne-pfeil {
  color: #ffffff;
  padding-left: 20px;
}

a.lnk-blaue-box-ohne-pfeil:hover {
  color: #25353d;
  transition: all 0.2s ease-out 0s;
}

.zusatzlnks a {
  color: #335a79;
  text-transform: uppercase;
}

.zusatzlnks a:hover {
  color: #5d89ab;
  transition: all 0.2s ease-out 0s;
  text-transform: uppercase;
}

a.lnkprojekt {
  text-decoration: none;
  color: #c63648;
  margin: 2px 2px;
  padding-left: 20px;
  background-image: url(../images/roter-pfeil.png);
  background-position: 2px 6px;
  background-repeat: no-repeat;
}

a.lnkprojekt:hover {
  text-decoration: none;
  color: #ffffff;
  margin: 2px 2px;
  transition: all 0.2s ease-out 0s;
}

a.mehrlnk {
  color: #c63648;
  padding-left: 20px;
  background-image: url(../images/roter-pfeil.png);
  background-repeat: no-repeat;
  background-position: 1px 6px;
  font-size: 0.9em;
  text-transform: uppercase;
}

a.mehrlnk:hover {
  color: #000000;
  transition: all 0.2s ease-out 0s;
  font-size: 0.9em;
}

a.prodlnk {
  color: #3a6387;
  padding-left: 20px;
  background-image: url(../images/roter-pfeil.png);
  background-repeat: no-repeat;
  background-position: 1px 6px;
  font-size: 0.9em;
  text-transform: uppercase;
}

a.prodlnk:hover {
  color: #5d89ab;
  transition: all 0.2s ease-out 0s;
  font-size: 0.9em;
}

a.buttonlnk-dunkel {
  border: 3px solid #25353d;
  background-color: #25353d;
  color: #ffffff;
  font-size: 1.2em;
  display: inline-block;
  margin-top: 5px;
  padding: 4px 14px;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 0.9em;
  transition: all 0.2s ease-out 0s;
  font-family: "Titillium Web", sans-serif;
}

a.buttonlnk-dunkel:hover {
  background-color: #c63648;
  color: #ffffff;
  border: 3px solid #c63648;
}

table td, table td * {
    vertical-align: top;
}


/* -- IMAGES
------------------------------------------------------------- */

img.pro100 {
  max-width: 100%;
}

img.pro80 {
  max-width: 80%;
}

img.pro20 {
  max-width: 20%;
}

img.headerbild {
  max-width: 100%;
  height: auto;
  display: block;
}

img.iconsize {
  max-width: 100%;
}

.fullimge {
  width: 100%;
  height: auto;
}

.produktabb-lineview {
  border: 1px solid #dcdcdc;
  padding: 2px;
}
.produktabb-projekt {
  border: 1px solid #ffffff;
  padding: 5px;
}

/* Divs + Grids
--------------------------------------------------------------------------------------- */

body {
  width: 100%;
}

.containerfull {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  clear: both;
}

.containerfulltable {
  width: 100%;
  margin: 0.5em auto;
  clear: both;
}

.container {
  width: 90%;
  margin: 0.5em auto;
  max-width: 890px;
  min-width: 300px;
  /* background-color: #fbf4e5; */
  clear: both;
}

.container-big {
  width: 90%;
  margin: 0.5em auto;
  max-width: 1125px;
  min-width: 300px;
  /* background-color: #fbf4e5; */
  clear: both;
}

.container-ani {
  width: 90%;
  margin: 0 auto;
  max-width: 1125px;
  min-width: 300px;
  /* background-color: #fbf4e5; */
  clear: both;
}

.grid {
  float: left;
  padding-left: 3em; /* this is your gutter between columns */
  width: 100%;
}

.magnull {
  margin: 0em auto;
}

.padsmall {
  padding: 1em;
}

.fleft {
  float: left;
}

.fright {
  float: right;
}

.frightflex {
  float: right;
}

.posrelative {
  position: relative;
}

.posabsolute {
  position: absolute;
  bottom: 0;
  left: 0;
}

.col-full {
  width: 100%;
}
.col-tenpro {
  width: 10%;
}
.col-one-five {
  width: 20%;
}
.col-one-half {
  width: 50%;
}
.col-one-third {
  width: 33.333%;
}
.col-two-thirds {
  width: 66.666%;
}
.col-sixfive {
  width: 65%;
}
.col-one-quarter {
  width: 25%;
}
.col-three-quarters {
  width: 75%;
}
.col-sixpro {
  width: 60%;
}
.col-fourpro {
  width: 40%;
}
.col-fourfivepro {
  width: 45%;
}
.col-eightypro {
  width: 80%;
}

.col-txtcon {
  width: 95%;
}
.col-mobile {
  display: none;
}
.col-logosmall {
  display: none;
}
.col-intro-menue {
  width: 100%;
  padding-top: 35px;
}
.col-menue {
  width: 80%;
  padding-bottom: 10px;
}
.col-logo {
  width: 18%;
  padding-bottom: 10px;
}

.box-info {
  margin: 1em;
  width: 100%;
}
.box-img {
  width: 25%;
}
.box-txt {
  width: 70%;
  color: #ffffff;
}
.txt-con {
  width: 90%;
}
.txt-consmall {
  width: 85%;
}
.txt-conzusatz {
  width: 10%;
}
.txt-conflex {
  width: 90%;
}
.col-teaserstart {
  width: 49.99%;
}

.elemtismob {
  display: none;
}
.elemtisnonmob {
  display: block;
}

.leiste-pad {
  padding-left: 9px;
}

.indiemitte {
  margin: 0.2em auto;
  clear: both;
}

.indiemitte-magnull {
  margin: 0 auto;
  clear: both;
}

.abgerundet {
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
}

/* --------  Bildbanner ------ */

div#bildband {
  position: relative;
  width: 100%;
}

div#bandgras {
  position: absolute;
  height: 100%;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 62px;
  /*
  background-color:red;
  opacity: 0.8;
  */
  background-image: url(../images/gras.png);
  background-position: bottom left;
  background-repeat: repeat-x;
}

div#bandtitel {
  position: absolute;
  height: 100%;
  left: 0;
  bottom: 0;
  width: 100%;
}

.containerbildband {
  width: 90%;
  /* margin: 0.5em auto;  */
  max-width: 1300px;
  clear: both;
}

.containerbildtext {
  width: 90%;
  margin: 0.5em auto;
  max-width: 800px;
  padding-top: 130px;
  clear: both;
  color: #ffffff;
  font-weight: 400;
}

.containerbildtext h1 {
  color: #ffffff;
  font-weight: 400;
  font-size: 1.7em;
  margin: 0 0 0.1em 0;
  text-shadow: 0.1em 0.1em 0.2em #69a8c7;
}

.containerbildtext h2 {
  color: #ffffff;
  font-weight: 400;
  font-size: 2.7em;
  text-transform: uppercase;
  text-shadow: 0.1em 0.1em 0.2em #69a8c7;
}

.div-mob-gras {
  display: none;
}

.mq0-prod-menue {
  width: 270px;
  float: left;
}

/* --------  Spacer ------ */
.clr {
  clear: both;
}

.spacer {
  clear: both;
  height: 10px;
}

.spacermed {
  clear: both;
  height: 4px;
}

.spacerbig {
  clear: both;
  height: 30px;
}

.spacerbig-mobil {
  clear: both;
  height: 30px;
}

.spacerextrabig {
  clear: both;
  height: 60px;
}

.spacermini {
  clear: both;
  height: 1px;
}

/* --------  Linien ------ */

hr {
  border: 0; /* Für Firefox und Opera */
  padding-bottom: 7px;
  margin-bottom: 7px;
  padding-top: 1px;
  border-bottom: 1px solid #e1e1e1;
  height: 1px;
}

hr.hrshort {
  border: 0; /* Für Firefox und Opera */
  padding-bottom: 7px;
  margin-bottom: 7px;
  padding-top: 1px;
  border-bottom: 1px solid #c2c6c6;
  height: 1px;
  width: 50%;
}

hr.hrtitel-weiss {
  border: 0; /* Für Firefox und Opera */
  border-bottom: 6px solid #ffffff;
  height: 7px;
  width: 140px;
  text-align: left;
  margin: 0.05em 0 2em 0;
}

hr.hrtitel-grau {
  border: 0; /* Für Firefox und Opera */
  border-bottom: 6px solid #e1e1e1;
  height: 7px;
  width: 140px;
  text-align: left;
  margin: 0.05em 0 2em 0;
}

.trenner {
  margin: 20px 0;
  background-color: #e1e1e1;
  height: 1px;
  clear: both;
}

/* -- Auflistungen
------------------------------------------------------------- */

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

li {
  padding-bottom: 3px;
  padding-top: 3px;
}

ul.ul-basic {
  list-style: none;
  margin: 0;
  padding: 0 0 15px 0;
}

ul.ul-basic li {
  padding-left: 15px;
  background-image: url("../images/auflistung.png");
  background-position: 1px 10px;
  background-repeat: no-repeat;
}

ul.ul-basic-black {
  list-style-type: circle;
  margin: 0;
  padding: 0 0 15px 20px;
}

ul.ul-basic-black li {
  padding: 0 0 0 15px;
}

#bildband li {
  padding-bottom: 0;
  padding-top: 0;
}

#bildband li img {
  display: block;
}

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

.footernav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footernav ul li {
  padding: 0;
  margin-top: 1px;
  margin-bottom: 1px;
  padding-bottom: 1px;
  font-size: 0.9em;
}

.footernav ul li.active {
  padding: 0;
  margin-top: 1px;
  margin-bottom: 1px;
  padding-bottom: 1px;
}

.footernav ul li a:link,
.footernav ul li a:visited {
  display: block;
  font-family: "Titillium Web", Arial, Tahoma, Helvetica, sans-serif;
  font-weight: 300;
  color: #08a8b9;
  text-decoration: none;
  text-transform: none;
  font-size: 1em;
}

.footernav ul li.active a:link,
.footernav1 ul li.active a:visited {
  display: block;
  font-family: "Titillium Web", Arial, Tahoma, Helvetica, sans-serif;
  font-weight: 300;
  color: #08a8b9; /* rot */
  text-decoration: none;
  text-transform: none;
  font-size: 1em;
}

.footernav ul li a:hover,
.footernav ul li a:active,
.footernav ul li a:focus {
  display: block;
  font-family: "Titillium Web", Arial, Tahoma, Helvetica, sans-serif;
  font-weight: 300;
  color: #92d8e0;
  text-transform: none;
  text-decoration: none;
  font-size: 1em;
}

.pagination-list ul {
  list-style: inside;
}

.pagination-list li {
  padding: 3px 5px;
}
.pagination-list li.active {
  background-color: #ffffff;
  padding: 3px 5px;
}

/* -- HAUPTMENUE
------------------------------------------------------------- */

.bg-menue {
  background-color: #25353d;
}

.top-menue ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #25353d;
}

.top-menue li {
  float: left;
  width: 20%;
  padding: 0;
}

.top-menue li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  text-transform: uppercase;
}

/* Change the link color to #111 (black) on hover */
.top-menue li a:hover,
.top-menue li a.active {
  background-color: #c63648;
}

/*--- Bildanimation --- */

#contentbackground {
  clear: both;
  position: relative;
  text-align: left;
  /* min-height:260px; */
}

#bildband {
  clear: both;
  position: relative;
  float: left;
  text-align: left;
}

#contenttxt {
  clear: both;
  position: absolute;
  z-index: 5000;
  float: left;
  text-align: left;
  min-width: 1125px;
  right: 0;
  bottom: 0;
}

.bgtitle {
  background-image: url(../images/rot.png);
  background-repeat: repeat;
  background-position: top left;
}

/* -------------------------------------------------------------
======	MEDIA QUERIES
------------------------------------------------------------- */

/* -- Media query fuer Banner
------------------------------------------------------------- */

@media only screen and (max-width: 1500px) {
}

@media only screen and (max-width: 1250px) {
}

@media only screen and (max-width: 1100px) {
}

@media only screen and (max-width: 1000px) {
}

/* -- Media query 1 (mq1)
------------------------------------------------------------- */
@media only screen and (max-width: 60em) {
  /* 13 / 780 */
  .mq1-col-full {
    width: 100%;
  }
  .mq1-col-one-half {
    width: 50%;
  }
  .mq1-col-one-third {
    width: 33.333%;
  }
  .mq1-col-two-thirds {
    width: 66.666%;
  }
  .mq1-col-one-quarter {
    width: 25%;
  }
  .mq1-col-three-quarters {
    width: 75%;
  }
  .mq1-col-sixpro {
    width: 100%;
    clear: both;
  }
  .mq1-col-fourpro {
    width: 100%;
    clear: both;
  }

  .mq1-col-logo {
    width: 100%;
    clear: both;
  }
  .mq1-col-menue {
    width: 100%;
    clear: both;
    padding-top: 0;
  }
  .mq1-col-intro-menue {
    width: 100%;
  }
  .mq1-col-logosmall {
    display: none;
  }
  .mq1-col-mobile {
    display: block;
  }
  /**/
  html > body {
    font-size: 1em;
  }
  .txtklein {
    font-size: 1em;
  }
  .mobiltitle {
    display: block;
  }

  .elemtismob {
    display: block;
  }
  .elemtisnonmob {
    display: none;
  }

  .flexbox {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    display: block;
  }
  .flexbox .col:nth-child(1),
  .flexbox .col:nth-child(2),
  .flexbox .col:nth-child(3) {
    width: 100%;
    clear: both;
    display: block;
  }
  .flexbox .col {
    padding: 0;
    min-height: 460px;
  }

  .txt-conflex {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  .txtflexleft {
    text-align: center;
  }
  .spacerextrabig {
    height: 30px;
  }
}

/* -- Media query 2 (mq2)
------------------------------------------------------------- */
@media only screen and (max-width: 48em) {
  /* 13 / 624 */
  .mq2-col-full {
    width: 100%;
  }
  .mq2-col-one-half {
    width: 50%;
  }
  .mq2-col-one-third {
    width: 33.333%;
  }
  .mq2-col-two-thirds {
    width: 66.666%;
  }
  .mq2-col-one-quarter {
    width: 25%;
  }
  .mq2-col-three-quarters {
    width: 75%;
  }
  .mq2-col-sixpro {
    width: 100%;
    clear: both;
  }
  .mq2-col-fourpro {
    width: 100%;
    clear: both;
  }

  .mq2-col-logo {
    display: none;
  }
  .mq2-col-intro-menue {
    width: 100%;
    padding-top: 0;
  }
  .mq2-col-menue {
    width: 100%;
    clear: both;
    background-color: #ffffff;
    color: #ffffff; /* background-image:url(../../images/rechtecke.png); */
    border-bottom: 1px solid #ffffff;
    border-top: 1px solid #ffffff;
    padding-bottom: 0;
  }
  .mq2-col-mobile {
    display: block;
  }
  .mq2-col-logosmall {
    display: block;
    width: 100%;
    padding-bottom: 0.2em; /* border-bottom: 4px solid #797a7c; */
  }
  .mq2-col-zwischenlinie {
    display: block;
    width: 100%;
  }
  .mq2-col-abstand {
    margin-bottom: 1em;
  }

  /**/
  html > body {
    font-size: 1em;
  }
  .txtklein {
    font-size: 1em;
  }
  .mobiltitle {
    display: block;
  }

  .elemtismob {
    display: block;
  }
  .elemtisnonmob {
    display: none;
  }

  .flexbox {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    display: block;
  }
  .flexbox .col:nth-child(1),
  .flexbox .col:nth-child(2),
  .flexbox .col:nth-child(3) {
    width: 100%;
    clear: both;
    display: block;
  }
  .flexbox .col {
    padding: 0;
    min-height: 360px;
  }

  .txt-conflex {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  .txtflexleft {
    text-align: center;
  }
  .spacerextrabig {
    height: 30px;
  }

  .mq0-prod-menue {
    width: 600px;
  }
  #bildband {
    display: none;
  }
  #contenttxt {
    display: block;
    position: relative;
    min-width: 100% !important;
    background-image: url(../images/ani-banner1.png);
    background-repeat: no-repeat;
    background-positioin: bottom right;
  }
  .bgtitle {
    display: block;
    position: relative;
    max-width: 100%;
    left: 0;
    background-image: none;
  }
  .produktabb-lineview {
    margin-bottom: 25px;
  }
}

/* -- Media query 3 (mq3)
------------------------------------------------------------- */
@media only screen and (max-width: 30em) {
  /* 13 / 390 */
  .mq3-col-full {
    width: 100%;
  }
  .mq3-col-one-half {
    width: 50%;
  }
  .mq3-col-one-third {
    width: 33.333%;
  }
  .mq3-col-two-thirds {
    width: 66.666%;
  }
  .mq3-col-one-quarter {
    width: 25%;
  }
  .mq3-col-three-quarters {
    width: 75%;
  }
  .mq3-col-sixpro {
    width: 100%;
    clear: both;
  }
  .mq3-col-fourpro {
    width: 100%;
    clear: both;
  }

  .mq3-col-logo {
    display: none;
  }
  .mq3-col-intro-menue {
    width: 100%;
    padding-top: 0;
  }
  .mq3-col-menue {
    width: 100%;
    clear: both;
    background-color: #ffffff;
    color: #ffffff; /* background-image:url(../../images/rechtecke.png); */
    border-bottom: 1px solid #ffffff;
    border-top: 1px solid #ffffff;
    padding-bottom: 0;
  }
  .mq3-col-mobile {
    display: block;
  }
  .mq3-col-logosmall {
    display: block;
    width: 100%;
    padding-bottom: 0.2em; /* border-bottom: 4px solid #797a7c; */
  }
  .mq3-col-zwischenlinie {
    display: block;
    width: 100%;
  }
  .mq3-col-abstand {
    margin-bottom: 1em;
  }
  .mq3-none {
    display: none;
  }
  /**/
  html > body {
    font-size: 1em;
  }
  .txtklein {
    font-size: 1em;
  }
  .mobiltitle {
    display: block;
  }

  .elemtismob {
    display: block;
  }
  .elemtisnonmob {
    display: none;
  }

  .flexbox {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    display: block;
  }
  .flexbox .col:nth-child(1),
  .flexbox .col:nth-child(2),
  .flexbox .col:nth-child(3) {
    width: 100%;
    clear: both;
    display: block;
  }
  .flexbox .col {
    padding: 0;
    min-height: 360px;
  }

  .txt-conflex {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  .txtflexleft {
    text-align: center;
  }
  .spacerextrabig {
    height: 30px;
  }
  #bildband {
    display: none;
  }
  #contenttxt {
    display: block;
    position: relative;
    min-width: 100% !important;
    background-image: url(../images/ani-banner1.png);
    background-repeat: no-repeat;
    background-positioin: bottom right;
  }
  .bgtitle {
    display: block;
    position: relative;
    max-width: 100%;
    left: 0;
    background-image: none;
  }
  .produktabb-lineview {
    margin-bottom: 25px;
  }

  .top-menue li {
    float: left;
    width: 100%;
    display: block;
    padding: 0;
  }
  .top-menue li a {
    display: block;
    color: white;
    text-align: left;
    padding: 8px 2px 8px 20px;
    text-decoration: none;
    text-transform: uppercase;
    border-bottom: 1px solid #374853;
    background: url(../images/pfeil_passiv.png);
    background-repeat: no-repeat;
    background-position: 1px 0px;
  }
}

button {
 background-color: white;
 color: #c63648;
 padding: 15px 32px;
 box-shadow: darkgrey;
 border-radius: 1px;
 border: 2px solid #c63648;
}
.slidedown {
display: none;
width: 1000px;
}

table a {
  color: black;
}

    table.GeneratedTable {
        width: 100%;
        background-color: #ffffff;
        border-collapse: collapse;
        border-width: 2px;
        border-color: #ffffff;
        border-style: solid;
        color: #000000;
    }
    
    table.GeneratedTable td,
    table.GeneratedTable th {
        border-width: 2px;
        border-color: #ffffff;
        border-style: solid;
        padding: 3px;
    }
    
    table.GeneratedTable thead {
        background-color: #c63648;
    }

/* -- PRINT STYLES 
------------------------------------------------------------- */
@media print {
  * {
    background: transparent !important;
    color: black !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important;
  }
  abbr[title]:after {
    content: "(" attr(title) ")";
  }
  pre,
  blockquote {
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group;
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  img {
    max-width: 100% !important;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
}

hr {
border: none;
height: 0px;
border-top: 1px solid #c63648;
}

/* -------------------------------------------------------------
======	END
------------------------------------------------------------- */