@charset "UTF-8";
@import url("../stylesheets/tresp-mobile.css") only screen and (max-width: 1024px), only screen and (max-height: 500px) ; 

@media only screen and (min-width: 1025px) and (min-height: 501px)  {
/* -------------------------------------------------------
*
*  Achtung: Die selben Abfragen sind in basedocfunc: Das Resize und Fixiern
*           wird im mobil / unterhalb der Grenzen dem css ueberlassen.  
*
*/
/* -------------------------------------------------------
*
*  Design - von top 0,0:
*         - in rseite die ein höhe bekommt alle anker mit relative
*         - rseite fixed
*         - in rseite absolute positioniert 
*         - nav außerhalb rseite: fixed
*         - Zeile analog / digital in rseite absolut
*         - bildnav: fixed
*         - mainnav in rseite absolute
*         - mainbild: float right
*
*         - hintergrundbild sitzt in rseite
*         - groesse wird mit jquery gerechnent
*
*  Die Media queries werden von der höhe her bestimmt, da das hintergrundbild
*  immer voll zu sehen sein soll.
* Empfohlene Breakbreite: 480, 800, 1260, 1600
* --------------------------------------------------------
*/
/*
*
*  css reset - kaskade: die zulelzt gelesene regel hat vorrang
*
*/
/* Copyright (c) 2014 Albert Meyn
----------------------------------------------------------------------------------------------------*/
/*
* Gestaltung des Layout ist auf 768 * 576  erstellt. 
* Gestaltung im css ist auf 15 Zoll Laptopn 1366 * 768, effektiv 830 * 622 px für das Hintergrundbild erstellt. 
* Die realen Groesseen werden per jquery gerechnet und spaeter gesetzt.
* Jetzt sind die Mainstream-Aufloesungen:
*  1366 * 768  -> dabei maximale hoehe beim IE 622px
*  1280 * 1024  ->  dabei maximale hoehe beim IE 899px
*  2560 * 1440
-----------------------------------------------------------------------------------------------------*/
/* Reset v1.0 | 20080212 - http://meyerweb.com/eric/tools/css/reset/
----------------------------------------------------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

/*ol, ul {
  list-style: none;
}*/

blockquote, q {
  display: inline;
  quotes: '\201E' '\201D' '\201B' '\2019'/*'“' '”' ''' ''';*/;
}
blockquote:before, q:before {
    content:'\201E';
}
 blockquote:after, q:after {
     content:'\201D';
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* Reset for HTML 5 Elements
----------------------------------------------------------------------------------------------------*/

/* tells browsers that don't read html 5 tags to render like divs */
header, footer, aside, nav, article, section {
  display: block;
  margin: 0;
  padding: 0;
}

/*clears containers with floated elements, no need for extra markup!*/
.clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clear { clear: both; }

/*
* --------------------------------------------------------------------------------------------------
* --------------------------------------------------------------------------------------------------
*/

main {
    position:relative;
    padding: 0;/* 2% 2%;*/
    margin: 0;
    width: 100%;/*96%;*/
    height: auto;
    background-color:transparent;
    z-index:1;
}

article {
   position: relative;
   padding: 0;
   margin: 0;
   width: 100%;
   height:auto;
   background-color:transparent;
   z-index:1;
}

html#bgdcol {
 background-color: white;
}
/* in der desktop version gibt es kein background image */
html#abgd {
 background-color: white;
}

html#dbgd {
 background-color: white;
}

#zseite {              /* der zentrier für die seite   */
   position:relative;
   margin: 0 auto;  /* damit zentrieren wir das div - also den container für den inhalt */
   width: 100%;
   height:auto;
   background-color: white;
   z-index:1;
 }

#rseite {             /* der rahmen fuer das bild  */
   position:fixed;
   z-index:1;
   top:0px;
   left: 50%;         /* so zentrieren wir einen fixed block  */
   -webkit-transform: translate(-50%, 0);
   -moz-transform: translate(-50%, 0);
   -ms-transform: translate(-50%, 0);
   -o-transform: translate(-50%, 0);
   transform: translate(-50%, 0);
   width: 830px;   /* die dimensionen der rahmenseite werden ueber jquery geetzt */
   height: 622px;  /* hier der Normalfall 15 Zoll Laptop  */
   text-align:center; /* damit zentrieren wir den text in dem div */
   background-color:transparent;
}

#imgcont, #imgcontad {   /* der container für das bild   */
  position:absolute;
  z-index:1;
  top:0;
  left:0;
  width:100%;
  height:auto;
  background-color: white;
}
#imgcontm { /* der leftt floatende container für das startseiten bild  mobile / tablet */
  display: none;
}

#imgcont img,
#imgcontm img,
#imgcontad img {
  width:100%;
  height:100%;
}


 /* Type
----------------------------------------------------------------------------------------------------*/

body {
        /*color: #333;*/
    font-family: /*100%/150%*/ 'Franklin Gothic', Arial, sans-serif;
    font:normal 100%;
}

h1, h2, h3, h4, h5, h6 {
        /*color: #555;*/
        font-family: /*190%/100%*/ 'Franklin Gothic', Arial, sans-serif;
}

.bildanker p,
.bildankerhoch p,
.barom p,
.baromh p {
   font-family:  Georgia, 'Book Antiqua',  serif;
   font:normal 100%;
   line-height:170%;
}

 /* Spacing
----------------------------------------------------------------------------------------------------*/
.lspace {
padding: 0 0.2rem 0 0.2rem;
}


/* ------------------------------------------------------- */
/* ----------- Layout------------------------------------- */
/* ------------------------------------------------------- */

 /*  wird genutzt auf den Eingangs seiten   */
.pmainnav {
   padding: 0;
   z-index:15;
   position: absolute; 
   top:67.5%;
   left:0%; /*wurde als fixed über jquery gesetzt, jetzt nicht mehr */
   width:100%;
   height:auto;
   text-align:left;
 }
.pmainnavm {
   display: none;
}
/*  --- fuer bilder seiten   -- */
.mobilenav  {
   position:relativ;
}
.mobilenavt  {
   position:relativ;
}
.ptextdigital {   /*   pos fuer text auf analog / digital startseite */
  position: absolute;
  top: 48.5%/*28%*//*59%*/;
  width: 98%;
  padding:0 0 0 3.5%;
  margin:0 auto;
  height:auto;
  z-index:5;
}
.ptext40 {
  position: absolute;
  top: 42%/*26.5%*//*30%*/;
  width: 100%;
  height:auto;
}
/* wir arbeiten mit der klassischen textzentrierung im blook bei nav ul  */
/* fixed - left wird über jquery gesetzt */
/* wenn wir im fixed zentrierten container sind müssen wir text-align setzen  */
.pabsnav {
   position:fixed;
   z-index:20;
   padding: 1rem 0 0 0;/* 1rem 0 1rem 0  */ 
   margin:0;
   text-align:left;
   background-color:transparent;
   /*top:  160219 61%; *//* 160219 66.5%; */ /*  68%  */
   bottom:0;
   left: 16%;
   width: 30%; /*  15%*/ 
}
header {
   margin:0;
   padding: 0;
   text-align:center;
   width: 100%;
   /*display: none;*/
}

footer {
   padding:0; 
   margin:0;
   text-align:left;
   width: 99%; /* 25%*/
   display: block;
   position: fixed;
   z-index:98;
   bottom:1.5%;
   left: 1%;         
}
#groessenanz {
   margin:0;
   padding-left:90%;
   visibility:hidden;
}
#groessenanz p {
  color: cyan;
}

/*  wir sitzen im Wrapper / Seite */
#pbildnav {  /* mit dem Bild fixiert */
   position:fixed;
   z-index:15;
   top:0; /*-5%;*/
   left:16%;/*16%; bei 19 / 19% bei 27*/ /* wir per jquery neu gesetzt */
   padding: 0 0 0 0;
   margin:0;
   width: 30%; /*50% */ /* damit sie bei den Textseiten nicht über die Linie hinaus geht */
   background-color:transparent;
   /* wir arbeiten mit der klassischen textzentrierung im blook bei nav ul  */
}


/* ------------------------------------------------------- */
/* ----------- Navigation -------------------------------- */
/* ------------------------------------------------------- */

aside ul {
  margin: 0.5em 0 0.5em 1.6em;
}

ul.mklappb,
ul.mklappr {
   padding: 0 0 0 0;
   list-style-type:none;
   font-size: 1rem;
   line-height:160%;
   font-style:italic;
   font-weight:normal; /* 160219 bold */
   text-decoration:none;
   list-style-position:inside;
}
ul.mklappr {
   margin: 0 0 0 1.8rem;/*0 0 0 0.8rem;*/ /* 2rem 0 0 0; */
}
ul.mklappb {
   margin: 0 0 0 1.8rem;/*0 0 0 0.8rem;*/ 
}
ul#bildmnavr {
   margin: 1rem 0 0 0; /*  2rem 0 0 0;  */
   padding:0 0 0 0;
   /*list-style-type:square;*/
   list-style-image: url(../images/square-rot-hoch-1.png);
   list-style-position:inside;
   font-size: 1rem; 
   font-style:italic;
   font-weight:bold;
   text-decoration:none;
}
ul#bildmnavb {
   margin: 0 0 0 0;
   padding:0 0 0 0;
   /*list-style-type:square;*/
   list-style-image: url(../images/square-blau-hoch-1.png);
   list-style-position:inside;
   font-size: 1rem; 
   font-style:italic;
   font-weight:bold;
   text-decoration:none;
}
/*
*  nav klappbar 
*/


ul.mklappr li ul,
ul.mklappb li ul {
  display:none;
  list-style-position:inside;
  list-style-type:none;
  margin:1rem 0 0 0;
  padding:0;
}
ul.mklappr li ul a,
ul.mklappb li ul a {
  font-size:1rem; 
}
ul.mklappr li:hover ul,
ul.mklappb li:hover ul  {
  display:block;
  margin-left:0;
  padding:0;
  font-size: 1rem; /* 160219  1rem */
}
ul.mklappr li:hover ul li a,
ul.mklappb li:hover ul li a {
  display:inline-block; 
  width:100%;  /* von 40% bei pbildnav  */
  margin:0;
  padding:0 0 0 1rem;
  font-size: 1rem; /* 160219  1rem */
}
ul.mklappr li ul li a:hover,
ul.mklappb li ul li a:hover {
  background-color:transparent;
  display:inline-block;
  margin:0;
  padding:0 0 0 1rem;
}
/*  ---  nave start seite --- */
ul.mainnavb {
   position:relative;
   float:left;
   z-index:15;
   list-style-position:inside;
   list-style-image: url(../images/square-blau-hoch-2.png);
   margin: 0 0 0 32%;
   padding:0;
   font-weight: normal;
   text-decoration:none;
   text-align:left;
   font-style:italic;
}
 ul.mainnavr {
   position:relative;
   float:left;
   z-index:15;
   list-style-position:inside;
   list-style-image: url(../images/square-rot-hoch-2.png);
   margin: 0 0 0 22%;
   padding:0;
   font-weight: normal;
   text-decoration:none;
   text-align:left;
   font-style:italic;
}

ul.mainnavb li,
ul.mainnavr li {
   /*display:inline;*/
   padding: 0;
   margin:0;
   position:relative;
   float:left;
}

ul.mainnavb a,
ul.mainnavr a {
   /*letter-spacing: 0.11em;*/
   border: none;
   display:inline-block;
   font-size: 2rem;
   width:20%;
}

/* -- nav auf allen seiten  -- */
ul.absnav { 
   color: #456565; 
   list-style-type:none;
   list-style-position:inside;
   padding:0;
   margin: 0 0 0 1rem;/* 0 0 2rem 0 */
   font-size: 1rem;
   font-style:italic;
   font-weight:bold;
   /*text-transform:uppercase;*/
   text-align:left;
   /*border:1px solid red;*/
}


ul.absnav li {
  display: block;
  background-color:transparent;
  font-size:1rem;
  padding:0 0 1rem 0;
}

ul.absnav li a {
   color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
   font-weight: bold;
   font-size: 1.25rem; /* 160219  1rem  */
   font-style:italic;
   letter-spacing: 0.1rem;
   padding: 0 0 1rem 0;
   /*text-transform:uppercase;*/
   border: none;
   text-align:left;
}
ul.absnavr {
   margin: 0;
   padding:0 0 1rem 0;
   /*list-style-type:square;*/
   list-style-image: url(../images/square-rot-hoch-1.png);
   list-style-position:inside;
   font-size: 1rem;
   font-style:italic;
   font-weight:bold;
   text-decoration:none;
   color: red;
}

ul.absnavb {
   margin: 0;
   padding:0 0 1rem 0;
   /*list-style-type:square;*/
   list-style-image: url(../images/square-blau-hoch-1.png);
   list-style-position:inside;
   font-size: 1rem;
   font-style:italic;
   font-weight:bold;
   text-decoration:none;
   color:blue;
}

ul.absnavr li a,
ul.absnavb li a {
   display:inline-block;
   width:20%;
   margin:0;
   padding:0;
}
ul.absnavr li ,
ul.absnavb li  {
   margin:0;
   padding:0;
}
/* --------------  mklapp und andere formate ---------------------------------------- */

#pbildnav h1 {
  padding:0 0 0 0;/*1.5rem 0 0 0;*/
  margin:0;
  font-size:4rem;/*1.5rem;*/
  background-color:transparent;
  font-style:italic;
  font-weight:normal;
  letter-spacing:0.2rem;
  color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
}
#pbildnav h1.h1text {
  padding:0 0 1.5rem 0;/*1.5rem 0 0 0;*/
  margin:0;
  font-size:2rem;/*1.5rem;*/
  background-color:transparent;
  font-style:italic;
  font-weight:bold;
  letter-spacing:0.2rem;
  color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
}
#pbildnav h1.mobil {
   display: none;
}
ul.mklappb li,
ul.mklappr  li,
#bildmnavr li,
#bildmnavb li {
  margin:0;
  padding:0 0 0.75rem 0;
  background-color:transparent;
  text-align: left;
}
ul.mklappb li span.liheader,
ul.mklappr li span.liheader {
  font-size: 1.5rem; /* 160219  1rem */ /* wie liaktiv  */
}

#bildmnavr li span.liheader,
#bildmnavb li span.liheader  {
  font-size: 1.5rem;/* 160219 1rem */ /* wie liaktiv  */
}
ul.absnavr li span.liheader,
ul.absnavb li span.liheader {
  font-size: 1.5rem;/* 160219 1rem */ /* wie liaktiv  */
  letter-spacing:0.1rem;
}
#pbildnav p {
   font-style:italic;
   margin:0;
   padding:0;
}
ul.mklappb p,
ul.mklappr p {
   font-style:italic;
   font-weight:bold;
   margin:0;
   padding:0;
}
#pbildnav p.liinaktiv {
  padding:0 0 0.75rem 1rem;
}

#pbildnav p.liaktiv {
  padding:0.5rem 0 0.75rem 2rem;
  font-size:1.5rem;
  font-weight:normal; 
}
#pbildnav p.liindent  {
  padding: 0 0 0.75rem 2rem;
  font-size: 1rem;
  font-weight:normal;
}
#pbildnav p.liklapp  {
  padding: 0 0 0.75rem 2rem;
  font-size: 1rem;
  font-weight:bold;
}

/* --  allgemeine Formate ------*/
a:link  {
    text-decoration: none;
    color:inherit;
}

a:visited {
    text-decoration: none;
    font-weight:normal;
    color:inherit;
}

a:hover {
    text-decoration: underline;
    font-weight:bold;
	color:inherit;
}
a.analog:hover {
  color: red;
}
a.digital:hover {
  color: blue;
}

.mklappr a:hover,
.mklappb a:hover,
#bildmnavb a:hover,
#bildmnavr a:hover,
#pbildnav a:hover,
ul.absnav  a:hover, 
ul.absnavr a:hover, 
ul.absnavb a:hover  {
    text-decoration: underline;
    font-weight:bold;
    color:inherit;
}

ul.absnav  a:active,
ul.absnavr a:active,
ul.absnavb a:active {
    text-decoration: none;
    font-weight:bold;
    background-color:none;
    color:inherit;
}

ul.absnav a:focus,
ul.absnavr a:active,
ul.absnavb a:active {
    text-decoration: underline;
    font-weight:bold;
    background-color:none;
    color:inherit;
}

/* ------------------------------------------------------- */
/* ----------- Breadcrump mit aria roles ----------------- */
/* ------------------------------------------------------- */

#breadcrumbs {
  padding: 0;
  margin:0;
  max-width: 100%;  /* von der groesse pbabsnav  */
  /*visibility:hidden;*/
}
#breadcrumbs ul {
  padding: 0 0 0 0 ;
  margin:0 0 0 0; /*0 0 0 -1rem;*/
  list-style-type: none;
  /*line-height: 1.4em;*/
}
#breadcrumbs li {
  float: left;
  display:inline;
  font-size: 1rem;
  font-style:italic;
  padding: 0.5rem 0.25rem 1rem 0;
  color: #456565;
  background-color: white;
}
#breadcrumbs li a {
  font-size: 1rem; /*0.8rem*/
  float: left;
  color: #456565;
  display: inline;
  padding: 0 0.25rem 0 0;
  text-decoration: underline;
  font-style:italic;
}
#breadcrumbs li strong {
  color: #456565;
 }

#breadcrumbs   a:hover,
#breadcrumbs  a:focus,
#breadcrumbs  a:active {
  text-decoration: underline;
  font-weight:bold;
}
.unsichtbar {
  /*position:absolute;
  left:-10000px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
  */
  z-index:-1;
  font: 0/0 serif;
}
.unsichtbart {
  visibility: hidden;
}
#langchng {
   position:fixed;
   bottom:0%;
   right:10%;
   padding:1rem 0 1rem 0;
   z-index:99;
}
#langchng p {
  padding:0;
  font-size:1rem;
  font-weight:normal; 
  color: #456565;
}
/* ------------------------------------------------------- */
/* ----------- Style ------------------------------------- */
/* ------------------------------------------------------- */
.opa2 {
  opacity:0.4;
}
.opa2n {
  opacity:0.4;
  display:none;
}
.opa22 {
  opacity:0.2;
}
.opa5 {
 opacity:0.65;
}
.opa7 {
 opacity:0.8;
}
.tline {                          /* Titelzeile */
   font-size: 2em;
   text-align: center;
   text-decoration:none;
 }

.ctline {
   z-index:5;
   font-size:6rem;
   font-style:italic;
   font-weight: normal;
   text-decoration:none;
   letter-spacing:0.2rem;
   color: #0F2F2F; /*  dunkles grau */
   position:relative;
   text-align:center;
   width: 100%;
   /*left: 50%;
   transform: translate(-50%, 0);*/
 }
/*.ctline p {
  margin:0;
  padding:0;
}*/

.ctdline {                        /* zentrierte Titelzeile, zentrierte Textzeile digital/analog startseite */
   z-index:5;
   font-size: 7.2rem;
   text-align: center;
   font-style:italic;
   font-weight:normal;
   text-decoration:none;
   /*letter-spacing:0.5rem;*/
   text-transform:uppercase;
   position:relative; /* zentrieren  */
   width: 100%;
   left: 50%;
   -webkit-transform: translate(-50%, 0);
   -moz-transform: translate(-50%, 0);
   -ms-transform: translate(-50%, 0);
   -o-transform: translate(-50%, 0);
   transform: translate(-50%, 0);
}

.ctdline  .ctinanalog,
.cttdline .ctinanalog,
.ctdline  .ctindigital,
.cttdline .ctindigital {
   letter-spacing:1.5rem;
}

.intext {                       /*  inline text */
  display: inline;
  color: black;
 }

.analog {                      /* farbe analog  */
  /*display: inline;*/
  color: red;
 }

.digital {                    /*  farbe digital  */
  /*display: inline;*/
  color: blue;
 }
.cgrey {
   color: #0F2F2F;   /*dunkles grau */
}

.ctintext {                     /* zentrierter Inlinetext */
  display: inline;
  text-align: center;
  padding: 0;
 }

.ctinanalog {                   /*  zentriert inline text analoge farbe  */
  display: inline;
  color: red;
  text-align: center;
  padding: 0;
 }

.ctindigital {                   /*  zentriert inline text digitale farbe  */
  display: inline;
  color: blue;
  text-align: center;
  padding: 0;
 }

.lkursiv {
  font-style:italic;
}
.ldgross {
  font-size:150%;
  padding:0 0.5rem;
}
.lvm {
  position:absolute;
  font-size:900%;
  padding:0 0rem;
  top:-65%;
  font-style:italic;
}

.lspacean {
   letter-spacing:0.8rem;
}
.lspacena {
   letter-spacing:0.8rem;
}
.lspaceal {
   letter-spacing:0.8rem;
}
.lspacelo {
   letter-spacing:0rem;
}

.lspaceog {
   letter-spacing:0.8rem;
}
/* entsprechende Klassen für Schrift Digital werden nur beim Tablet etc. benutzt */
.lspacedim {
}
.lspaceigm {
}
.lspacegim {
}
.lspaceitm {
}
.lspacetam {
}
.lspacealm {
}
}
/* ------------------------------------------------------------------- */
/* ----                                                            --- */
/* ----              Ende Basis CSS                                --- */
/*
/* ----                                                            --- */
/* ------------------------------------------------------------------- */
/* 
* Versionen für Bildschirme kleiner als der 15 Zoll Laptop. Bei diesem 
* ist die max height 635 px. Das ist die kleinste Größe.  
*
*/

/* 
*  übliche Breakpoints 
*
* <= 480 Pixel width Smartphones
* < 800 Pixel width Tablets
*
*  kritischer Break für uns 1366 * 768 / 15 Zoll Laptop
*    bei diesem bekommen wir max. 634 px Höhe
*  für diesen ist der obige Standardfall
*
*  and (max-width: 1365px) and (max-height: 634px)
*  
* darunter arbeiten wir in der üblichen floatenden steuernden Breite
*
*/


/* Eine Version fuer ab 769 Pixel (beispielsweise Tablet im Hochformat)
* oder alte Monitore
* Bemerkung: Ebenso faellt also die beliebte 1024px Aufloesung auch darunter.
*/

/*@media only screen and (min-width: 768px) and (max-width: 2025px) {*/
@media only screen  and (min-height: 769px) and (max-height: 1023px), only screen and (min-width: 1367px)  {
 
#groessenanz p {
   color: red;
}
#breadcrumbs li {
  font-size: 1.5rem;/* 1rem;*/
  padding: 0.5rem 0.25rem 1.25rem 0;
}
#breadcrumbs li a {
  font-size: 1.25rem;/* 1rem;*/
  padding: 0 0.25rem 0 0;
}
#breadcrumbs li strong {
  font-size: 1.25rem;/* 1rem;*/
}
#langchng {
   padding:1.5rem 0 1.25rem 0;
}
#langchng p {
  font-size:1.5rem;
}
.ctline {
   font-size: 10rem;
 }

.ctline {
   font-size: 9rem;
 }

.ctdline {
   font-size: 8.1rem;/*11.5rem;*/
}
.ctdline  .ctinanalog,
.cttdline .ctinanalog,
.ctdline  .ctindigital,
.cttdline .ctindigital {
   letter-spacing:2rem;
}
.lspacean {
   letter-spacing:0.9rem;
}
.lspacena {
   letter-spacing:0.9rem;
}
.lspacelo {
   letter-spacing:0rem;
}
.lspaceal {
   letter-spacing:0.9rem;
}
.lspaceog {
   letter-spacing:0.9rem;
}

.pmainnav {
   top:67.5%;
   width:100%;
}
ul#bildmnavr,
ul.absnavr {
   list-style-image: url(../images/square-rot-hoch-1.png);
}
ul#bildmnavb,
ul.absnavb {
   list-style-image: url(../images/square-blau-hoch-1.png);
}
ul.mainnavb {
   list-style-image: url(../images/square-blau-hoch-4.png);
   margin: 0 0 0 31%;
}
 ul.mainnavr {
   list-style-image: url(../images/square-rot-hoch-4.png);
   margin: 0 0 0 21%;
}
ul.mainnavr li,
ul.mainnavb li {
   padding: 0;
   margin:0;
   float:left;
   position:relative;
}
ul.mainnavr li a,
ul.mainnavb li a {
   font-size: 3rem;
   display:inline-block;
}

ul.absnav li a {
   color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
   font-weight: bold;
   font-size: 1.25rem;
   font-style:italic;
   letter-spacing: 0.1rem;
   padding: 0 0 1rem 0;/*0 4rem 0 4rem*/;
   /*text-transform: uppercase;*/
   border: none;
   /*border-left: 1px solid lightgreen;*/
   text-align:left;
}

/* ---- nav zusätze   --- */
/* ---- nav zusätze   --- */
ul.mklappr,
ul.mklappb {
  line-height:180%;
}
ul.mklappr li ul,
ul.mklappb li ul {
  font-size:1.15rem;/*1.5rem;*/
  margin:1rem 0 0 0;
}
ul.mklappb li:hover ul li a,
ul.mklappr li:hover ul li a,
ul.mklappb li ul li a,
ul.mklappr li ul li a {
  font-size:1.15rem;/*1.5rem;*/
}
/* --------------  bildnav formate ---------------------------------------- */
#pbildnav h1 {
  padding:0;/*1.5rem 0 0 0;*/
  margin:0;
  font-size:4.25rem;/*3.25rem;*/
  background-color:transparent;
  font-style:italic;
}
#pbildnav h1.h1text {
  padding:0 0 1.5rem 0;/*1.5rem 0 0 0;*/
  margin:0;
  font-size:2rem;/*1.5rem;*/
  background-color:transparent;
  font-style:italic;
  font-weight:bold;
  letter-spacing:0.2rem;
  color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
}
ul.absnavr li ,
ul.absnavb li {
  padding:0 0 0 0;
  background-color:transparent;
}
ul.mklappb li,
ul.mklappr  li,
#bildmnavr li,
#bildmnavb li   {
  padding:0 0 1.15rem 0;
  background-color:transparent;
}
#pbildnav p.liinaktiv {
  font-size:1.15rem;
  padding:0 0 1rem 1rem;
}
#pbildnav p.liaktiv {
  font-size:1.5rem;
  padding:0.5rem 0 1.15rem 2rem;
  font-weight:normal;
  /*letter-spacing: 0.1rem;*/
  /*text-decoration:underline;*/
}
#pbildnav p.liindent {
  font-size:1.15rem;
  padding: 0 0 1.15rem 2rem;
  font-weight:normal;
}
ul.absnavr li span.liheader,
ul.absnavb li span.liheader  {
  font-size: 1.5rem; /*1.5rem;*/
  letter-spacing: 0.1rem;
  font-weight:bold;
}
#bildmnavr li span.liheader,
#bildmnavb li span.liheader, 
ul.mklappb li span.liheader,
ul.mklappr li span.liheader  {
  font-size: 1.5rem; /*1.15rem;*/
}
#pbildnav p.liklapp  {
  padding: 0 0 1.5rem 2rem;
  font-size: 1.15rem;
  font-weight:bold;
}
 }
/*
*
*
*
*/
@media only screen and (min-height: 1024px) and (max-height: 1199px), only screen and (min-width: 1920px)  {

#groessenanz p {
   color: blue;
}
#breadcrumbs li {
  font-size: 1.5rem;/* 1rem;*/
  padding: 0.5rem 0.25rem 1.25rem 0;
}
#breadcrumbs li a {
  font-size: 1.5rem;/* 1rem;*/
  padding: 0 0.25rem 0 0;
}
#breadcrumbs li strong {
  font-size: 1.5rem;/* 1rem;*/
}
#langchng {
   padding:1.5rem 0 1.25rem 0;
}
#langchng p {
  font-size:1.5rem;
}
.ctline {
   font-size: 10rem;
 }

.ctdline {
   font-size: 13rem;/*14.5rem;*/
}
.ctdline  .ctinanalog,
.cttdline .ctinanalog,
.ctdline  .ctindigital,
.cttdline .ctindigital {
   letter-spacing:2rem;
}
.lspacean {
   letter-spacing:1.1rem;
}
.lspacena {
   letter-spacing:1.1rem;
}
.lspacelo {
   letter-spacing:-0.2rem;
}
.lspaceal {
   letter-spacing:1.1rem;
}
.lspaceog {
   letter-spacing:1.1rem;
}

.pmainnav {
   top:67.5%;
   width:100%;
}
ul#bildmnavr,
ul.absnavr {
   list-style-image: url(../images/square-rot-hoch-2.png);
}
ul#bildmnavb,
ul.absnavb {
   list-style-image: url(../images/square-blau-hoch-2.png);
}
ul.mainnavb {
   list-style-image: url(../images/square-blau-hoch-4.png);
   margin: 0 0 0 31%;
}
 ul.mainnavr {
   list-style-image: url(../images/square-rot-hoch-4.png);
   margin: 0 0 0 22%;
}
ul.mainnavr li,
ul.mainnavb li {
   padding: 0;
   margin:0;
   float:left;
   position:relative;
}
ul.mainnavr li a,
ul.mainnavb li a {
   font-size: 3.5rem;
   display:inline-block;
}

ul.absnav li a {
   color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
   font-weight: bold;
   font-size: 2rem;
   font-style:italic;
   letter-spacing: 0.1rem;
   padding: 0 0 1rem 0;/*0 4.5rem 0 4.5rem;*/
   border: none;
   /*border-left: 1px solid lightgreen;*/
   text-align:left;
}


/* ---- nav zusätze   --- */
ul.mklappr,
ul.mklappb {
  line-height:200%;
}
ul.mklappr li ul,
ul.mklappb li ul {
  font-size:1.5rem;/*1.5rem;*/
  margin:1.5rem 0 0 0;
}
ul.mklappb li:hover ul li a,
ul.mklappr li:hover ul li a,
ul.mklappb li ul li a,
ul.mklappr li ul li a {
  font-size:1.5rem;/*1.5rem;*/
}
/* --------------  mklapp formate ---------------------------------------- */
#pbildnav h1 {
  padding:0;/*2rem 0 0 0;*/
  margin:0;
  font-size:6rem;/*3.5rem;*/
  background-color:transparent;
  font-style:italic;
}
#pbildnav h1.h1text {
  padding:0 0 1.5rem 0;/*1.5rem 0 0 0;*/
  margin:0;
  font-size:3rem;/*1.5rem;*/
  background-color:transparent;
  font-style:italic;
  font-weight:bold;
  letter-spacing:0.2rem;
  color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
}
ul.absnavr li ,
ul.absnavb li {
  padding:0 0 0 0;
  background-color:transparent;
}
ul.mklappb li,
ul.mklappr  li,
#bildmnavr li,
#bildmnavb li   {
  padding:0 0 1.5rem 0;
  background-color:transparent;
}

#pbildnav p.liinaktiv {
  font-size:1.5rem;
  padding:0 0 1.5rem 1rem;
}

#pbildnav p.liaktiv {
  font-size:2rem;
  padding:0.5rem 0 1.5rem 2rem;
  font-weight:normal;
  /*text-decoration:underline;*/
}
#pbildnav p.liindent {
  font-size:1.5rem;
  padding: 0 0 1.5rem 2rem;
  font-weight:normal;
}
#pbildnav p.liklapp  {
  padding: 0 0 1.5rem 2rem;
  font-size: 1.5rem;
  font-weight:bold;
}

ul.absnavr li span.liheader,
ul.absnavb li span.liheader {
   font-size: 2rem;
   letter-spacing: 0.1rem;
   font-weight:bold;
}
#bildmnavr li span.liheader,
#bildmnavb li span.liheader, 
ul.mklappb li span.liheader,
ul.mklappr li span.liheader {
  font-size:2rem;/* 1.5rem; */
}


 }

/*
* Eine Version fuer ab ca. 2026 Pixel width (grosse Monitore)
*
*  optimiert fuer 27 Zoll 2540 * 1440
*
*/
@media only screen and (min-height: 1200px), only screen and (min-width: 2200px)   {

#groessenanz p {
  color: green;
}
#breadcrumbs li {
  font-size: 2rem;/* 1rem;*/
  padding: 0.5rem 0.25rem 1.25rem 0;
}
#breadcrumbs li a {
  font-size: 2rem;/* 1rem;*/
  padding: 0 0.25rem 0 0;
}
#breadcrumbs li strong {
  font-size: 2rem;/* 1rem;*/
}
#langchng {
   padding:1.5rem 0 1.25rem 0;
}
#langchng p {
  font-size:2rem;
}
.ctline {
   font-size: 13rem;
 }

.ctdline {
   font-size: 16.2rem;/*18rem;*/
}
.ctdline  .ctinanalog,
.cttdline .ctinanalog,
.ctdline  .ctindigital,
.cttdline .ctindigital {
   letter-spacing:2rem;
}

.lspacean {
   letter-spacing:1.5rem;
}
.lspacena {
   letter-spacing:1.5rem;
}
.lspacelo {
   letter-spacing:-0.5rem;
}
.lspaceal {
   letter-spacing:1.5rem;
}
.lspaceog {
   letter-spacing:1.5rem;
}

.pmainnav {
   top:67.5%;
   width:100%;
}

ul#bildmnavr,
ul.absnavr {
   list-style-image: url(../images/square-rot-hoch-2.png);
}
ul#bildmnavb,
ul.absnavb {
   list-style-image: url(../images/square-blau-hoch-2.png);
}
ul.mainnavb {
   list-style-image: url(../images/square-blau-hoch-6.png);
    margin: 0 0 0 26%;
}
ul.mainnavr {
   list-style-image: url(../images/square-rot-hoch-6.png);
   margin: 0 0 0 20%;
}
ul.mainnavr li,
ul.mainnavb li {
   padding: 0;
   margin:0;
   position:relative;
   float:left;
}
ul.mainnavr li a,
ul.mainnavb li a {
   font-size: 6rem;
   display:inline-block;
}

ul.absnav li a {
   z-index:20;
   color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
   font-weight: bold;
   font-size: 2rem;
   font-style:italic;
   letter-spacing: 0.1rem;
   padding: 0 0 1rem 0;/*0 5rem 0 5rem;*/
   text-align:left;
}

/* ---- nav zusätze   --- */
ul.mklappr,
ul.mklappb {
  line-height:200%;
}

ul.mklappr li ul,
ul.mklappb li ul {
  margin:1.5rem 0 0 0;
  font-size:1.5rem;
}

ul.mklappb li:hover ul li a,
ul.mklappr li:hover ul li a,
ul.mklappb li ul li a,
ul.mklappr li ul li a {
  font-size:1.5rem:/*1.5rem;*/
}
/* --------------  mklapp formate ---------------------------------------- */
#pbildnav h1 {
  padding:0;/*2rem 0 0 0;*/
  margin:0;
  font-size:7.25rem;/*5.75rem;*/
  background-color:transparent;
  font-style:italic;
}

ul.absnavr li ,
ul.absnavb li {
  padding:0 0 0 0;
  background-color:transparent;
}
ul.mklappb li,
ul.mklappr  li,
#bildmnavr li,
#bildmnavb li   {
  padding:0 0 1.5rem 0;
  background-color:transparent;
}
#pbildnav h1.h1text {
  padding:0 0 1.5rem 0;/*1.5rem 0 0 0;*/
  margin:0;
  font-size:3.5rem;/*1.5rem;*/
  background-color:transparent;
  font-style:italic;
  font-weight:bold;
  letter-spacing:0.2rem;
  color: #456565; /*helles grau */  /*#0F2F2F;   dunkles Grau */
}
#pbildnav p.liinaktiv {
  font-size:1.5rem;
  padding:0 0 1.5rem 1rem;
}

#pbildnav p.liaktiv {
  font-size:2rem;
  padding:0.5rem 0 1.5rem 2rem;
  font-weight:normal;
  /*text-decoration:underline;*/
}
#pbildnav p.liindent {
  font-size:1.5rem;
  padding: 0 0 1.5rem 2rem;
  font-weight:normal;
}
#pbildnav p.liklapp  {
  padding: 0 0 1.5rem 2rem;
  font-size: 1.5rem;
  font-weight:bold;
}

ul.absnavr li span.liheader,
ul.absnavb li span.liheader {
  font-size: 2rem;
  letter-spacing: 0.1rem;
  font-weight:bold;
}
#bildmnavr li span.liheader,
#bildmnavb li span.liheader, 
ul.mklappb li span.liheader,
ul.mklappr li span.liheader {
  font-size: 2rem;/* 1.5rem; */
}
ul.mklappb li span.liindent {
  font-size: 1.5rem;
  padding: 0 0 1.5rem 2rem;
}


}