@font-face {
    font-family: BrownPro;
    src: url("../fonts/BrownPro-Regular.otf") format("opentype");
}
@font-face {
    font-family: Maguerite;
    font-weight:normal;
    src: url("../fonts/MargueriteGrotesk-Regular.otf") format("opentype");
}
@font-face {
    font-family: Maguerite;
    font-weight:bold;
    src: url("../fonts/MargueriteGrotesk-Bold.otf") format("opentype");
}
@font-face {
    font-family: Rando;
    font-weight: normal;
    src: url("../fonts/Rando-Regular.otf") format("opentype");
}@font-face {
    font-family: Rando;
    font-weight: 600;
    src: url("../fonts/Rando-Medium.otf") format("opentype");
}
@font-face {
    font-family: GTAmerica;
    src: url("../fonts/GT-America-75-Mono-Regular.otf") format("opentype");
}
@font-face {
    font-family: Roboto;
    src: url("../fonts/Roboto-Light.ttf") format('truetype');
}


body {margin: 0px; padding: 0px;  /*font-family: 'Vollkorn';*/ font-family: 'Rando';font-size: 12px;            line-height: 190%;}
p { font-size: 18px;line-height: 150%;}
h2, h3 {margin: 0px;padding: 0px;}

#t_test {/*font-family:BrownPro!important;*/}


::selection {
  background: rgba(0 ,0 ,0 ,0)!important; /* WebKit/Blink Browsers */
}
::-moz-selection {
  background:rgba(0 ,0 ,0 ,0)!important; /* Gecko Browsers */
}

.t_de, .t_de h2, .t_de p, h1.t_de {/*font-family: 'Vollkorn', serif!important;*/font-family: 'Rando', serif!important;}
.t_en, .t_en h2, .t_en p, h1.t_en {/*font-family: 'Hind Vadodara', sans-serif!important;*/ font-family:Maguerite, sans-serif!important;}
.t_ru, .t_ru h2, .t_ru p, h1.t_ru { font-family: 'Roboto', sans-serif!important;font-weight:500}
#zeitleisteCont   {/*font-family: 'Hind Vadodara', sans-serif!important;*/font-family:Maguerite, sans-serif!important;}

#Cover   {color:#cd1719; font-size:32px; line-height:170%;}


.text-right { text-align: right; }
.text-center { text-align: center; }
.nopadding{padding:0px;}

.controlHolder { display: none; }
.zoomHolder { height: calc(100vh - 50px); width: 100%; background-color: #000; }

 #btnMenu {position:absolute; top:10px; right:14px;z-index:9;}

#menu { position:absolute; left:0px; top:0px; width:100%;height:99.9vh;z-index:999999999; 
       background-color:#fff;color:#000;overflow:auto;}
#menu #logo {position:absolute; left:16px; top:13px;height:80px;}
#menu #btnclosem {position:absolute; right:15px; top:12px;height:30px;}
#menu .menuinhalt {margin:100px 25px 20px 25px ;}
/*#menu .menuinhalt a {text-decoration:none; color:#000;}*/
#menu .menuinhalt  ul { margin: 0px; padding: 0px; list-style: none; } 
#menu .menuinhalt  ul li { color:#cd1719;font-weight:700;font-size:15px; font-family: 'Roboto'; 
                           padding: 15px 10px 5px 0px; border-bottom: 1px solid #cd1719; }

.swiper-button-next {border:0px solid #f00;top:80px;height:calc(100vh - 220px);
                     width: 50px;border: 0px solid #ccc;margin-right: -20px;padding-left: 0px;text-align: left;
}
.swiper-button-prev {border:0px solid #f00;top:80px;height:calc(100vh - 220px); 
                     width: 50px;border: 0px solid #ccc;margin-left: -20px;padding-left: 0px;text-align: left;
}
 .swiper-button-prev::after{content:'';
        transform: scale(0.4,1); font-size: 62px; color: #00000024;}
.swiper-button-next::after {/*content:'';*/
        transform: scale(0.4,1); font-size: 62px; color: #00000024;}
.swiper-button-next:active, .swiper-button-prev:active {border:none!important;outline: none;}
.swiper-button-next:focus, .swiper-button-prev:focus {border:none!important;outline: none;}


.swiper-container { width: 100%; height: 100%; }

.swiper-slide { text-align: center;  
    display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center; justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-slide { text-align: left; }
.swiper-slide .inner {color:#cd1719; padding: 20px 30px 20px 30px; width:100%; height: 100%;    overflow: auto; position: relative; z-index: 2; }
.swiper-slide img { max-height: 68px; }

.raumzahl {font-family:Maguerite;font-weight:bold; font-size: 120px;text-align:center;
           /*color:rgb(205 ,23 ,25 , 0.05);*/ color:#fcf3f3; position: absolute;
           z-index: 1; left: 0px; top:  0px;

 /*   font-weight: 800;*/ width: 80px; display:block; border:0px solid #f00; line-height: 100%; }
.deckblatt .raumzahl{ position:absolute; z-index:1; left:10px;top: 0px;color:#cd1719; font-size:120px;}
.inner.deckblatt   { padding: 70px 0px 0px 0px ; }
.inner.deckblatt h1 {position:relative; z-index:99;font-weight:normal; mix-blend-mode: difference; font-size: 40px;margin: 0px 0px 25px  100px ; color:#cd1719; line-height:100%; }
.textcontent {position:relative;z-index:2;}

#zeitleiste .inner {  }
#zeitleiste .inner p { font-size: 13px; line-height: 120%; color:#000; }
#zeitleiste .inner h3 {font-size: 22px; color: #cd1719; font-weight: 500;}
#zeitleiste .inner h4 { font-size: 14px;padding-top:5px; color: #cd1719;font-weight: 500;}
#zeitleiste .swiper-slide .inner { padding: 15px 20px 20px 28px; height: 100%; overflow: auto; position: relative; z-index: 2; }
/*.inner .raumzahl {width:50px;}
*/
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background-color:rgba(255, 255, 255 , 0.6) }
.swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {             height: 10px;        }
.swiper-pagination-progressbar{ background-color: #cd1719;}

@media only screen and (max-height: 650px) {
	/*body {border-left:10px solid #f00;}*/
  
}@media only screen and (max-height: 600px) {
	/*body {border-left:10px solid #0f0;}*/
   
}@media only screen and (max-height: 550px) {
	/*body {border-left:10px solid #0f0;}*/
   
}

h1 .kleiner {font-size:30px!important;line-height:30px!important;margin-left:-70px!important;margin-right:20px!important;display:block;}

#InfoBittedrehen {display:none;}
#InfoBittedrehen img  {transform: rotate(60deg); animation-name: drehen; animation-duration:3s;  animation-delay: 0s;}
@media screen and (orientation:landscape)
and (max-device-width: 480px) {
   #InfoBittedrehen {display:inherit;}
   #InfoBittedrehen img  {transform: rotate(0deg); }
   @keyframes drehen {
      from {transform: rotate(60deg);}
      to {transform: rotate(0deg);}
    }
}

/*@media screen and (min-width: 320px) and (max-width: 767px) and (orientation: landscape) {
html {
transform: rotate(-90deg);
transform-origin: left top;
width: 100vh;
overflow-x: hidden;
position: absolute;
top: 100%;
left: 0;
}
}*/