html {
    font-size:16px;
}
body {
    background: #fdfce0;
	margin: 0;
	padding:0;
	font-family:Impact, Charcoal, sans-serif;
    overflow:hidden;
  font-size: 100%; }


h1,h2,h3
{
    color:#a4024f;
//    border-bottom: .1vmin solid #a4024f;
    margin-top:0;
//    line-height: 2.75rem;
text-align:left;
}


h1
{
    font-size:2.45rem;
    margin-bottom:0.5rem;
    
}
h2
{
    font-size:1.8rem;
    margin-bottom:0;
}

h3
{
    font-size:1.2rem;
    margin-bottom:0;
}

#caption
{
    z-index: 4;
    width:100%;
    margin-top:1rem;
    height:6.75rem;
    background-color:rgba(255,255,255,0.5);
    border-top:.2rem solid #a4024f;
    border-bottom:.2rem solid #a4024f;
}
#header
{
    position:relative;
    top:-0.75rem;
    left:1rem;
     background-color:rgba(255,255,255,1);
    height:15rem;
    margin:0;
 
    width:15rem;
    border:.2rem solid #a4024f;
    border-radius: 20rem;
    box-shadow:     0.1rem 0.1rem 0.2rem rgba(0, 0, 0, .2),   0 0 1rem  rgba(168,2,81,0.1) inset;
    float:left;
    margin-right:3rem;
}
#header img
{
     margin:1rem;
    margin-left:1rem;
    width:12rem;
    height:auto;
    padding:0px;
}

#contentbackgr
{
    height: 100%;
    width: 100%;
    margin:0;
    padding:0;
    position:absolute;
    top:0;
    z-index:3;
    background-image:url('../sph.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right top;
    background-origin: content-box;
    opacity:0.2;
    display:none;
}

#content
{
     height: 100%;
     width: 100%;
    background-color: rgba(255,255,255,0.25);
    margin:0;
    padding:0;
    position:absolute;
    top:0;
    z-index:4;

}

#desc
{
    background-color: rgba(255,255,255,0.5);
    margin-top:1rem;
    width:100%;
    display: inline-block;
    text-align:center;
    vertical-align:middle;
    position: absolute;
    bottom:0;
    left:0;
    height:2rem;
    font-size:1.25rem;
    line-height:2rem;
    margin:0;
    padding:0;
    margin-right:1rem;
    color:#a4024f;
    /*    border-top:.2rem solid #a4024f;*/
    z-index:20;
}
#menu
{
    margin:0;
    margin-bottom:0.5rem;
    padding:0;
    height:8.5rem;
    text-align:left;
/*    padding-left:14rem;
    padding-right:8.5rem;*/
}

:root {
 --total-slides: 7;
}

[name=slider-group] 
{
  display: none;
width:0;
height:0;
}
#menu .btn 
{
  margin-top:2rem;
  margin-right:0.5rem;
  background-color: rgba(164,2,79,0.5);
  border: none;
  color: white;
  padding: 1rem 1.2rem;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.25rem;
  cursor:pointer;
}


#menu .btn:hover
{
background-color: rgba(164,2,79,0.75);
text-decoration: underline;
}

#textcontainer
{
    text-align:left;
/*    padding-left:8.5rem;
    padding-right:8.5rem;*/
    margin:0;
    overflow-x: hidden;
z-index:10;
}
.slider {
width: calc(var(--total-slides)*100vw);
transition: transform 600ms ease-in-out;
}

#radio1:checked~.slider {
  transform: translateX(0);
}

#radio2:checked~.slider {
  transform: translateX(-100vw);
}

#radio3:checked~.slider {
  transform: translateX(-200vw);
}
#radio4:checked~.slider {
  transform: translateX(-300vw);
}
#radio5:checked~.slider {
  transform: translateX(-400vw);
}
#radio6:checked~.slider {
  transform: translateX(-500vw);
}
#article
{
    width:100vw;
    margin:0;
    left:0vw;
    display: inline-block;
    min-height:80vh;
    max-height:80vh;
   /* overflow:auto;*/
}
/*
#article:nth-child(even) {
  background: #3F51B5;
}
*/
#article:nth-child(2)
{
   left:100vw;
}
#article:nth-child(3)
{
   left:200vw;
}
#article:nth-child(4)
{
   left:300vw;
}
#article:nth-child(5)
{
   left:400vw;
}
#article:nth-child(6)
{
   left:500vw;
}
#inhalt
{
 min-height:80vh;

    margin-left: 8.5rem;
    margin-right:8.5rem;
 background-color:rgba(255,255,255,0.25);
    padding: 1rem;
    color:#000;
       border-radius: 0.1rem;
    line-height: 2.25rem;
    font-size:1.5rem;
    overflow-y:auto;
}
#inhalt p
{
     margin:0;
    text-align: justify;
    text-justify:auto; 
    margin-bottom:1.25rem;
}

#inhalt p.direct
{
/*white-space: pre-line;*/
text-align:left;
}

#inhalt p.small
{
 font-size:1.0rem;
 line-height:1.25rem;
}
#inhalt p.smallheader
{
 font-weight:bold;
 font-size:1.0rem;
 line-height:1.25rem;
 margin-bottom:0.25rem;
}
#inhalt table
{
    width: 100%;
    font-size:1rem;
    border-collapse: collapse;
    border: 1px solid rgba(240,240,240,0.5);
    margin: 0.5rem 0;
}

#inhalt th {
    height: 2rem;
  text-align:center;
background-color: rgba(164,2,79,0.3);
}
#inhalt th,td
{
vertical-align:middle;
}
#inhalt tr:nth-child(even)
{
 background-color:rgba(240,240,240,0.5);
}

#inhalt td:nth-child(odd)
{
 background-color: rgba(164,2,79,0.1);
}
#inhalt tr:hover
{
    background-color:rgba(240,240,240,0.8);
}

#inhalt td
{
    text-align:center;
}
#inhalt td:first-child
{
    text-align:left;
}
/*----------------------------------------------   
--Banner
-----------------------------------------------  */
.sect-banner{
 display: table;
 width: 100%;
 margin: 0;
 text-align: center;

 /*-- Full Height --*/
 height: 700px;
 color:	rgba(255,255,255,0.9);

 /*-- Create an Overlay --*/
 /*&:after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(118, 144, 164, 0.4);
  z-index: 0;
 }*/

 /*-- Vertically center --*/
 .v-center{
  display: table-cell;
  vertical-align: middle;
  position: relative;
  z-index: 4;
  padding: 0 5%;
 }
}

/*----------------------------------------------   
--Fade out for slider
-----------------------------------------------  */
@-webkit-keyframes fade-out {
  2% {
    opacity: 1; }
  8% {
    opacity: 0; }
}
@-moz-keyframes fade-out {
  2% {
    opacity: 1; }
  8% {
    opacity: 0; } }
@keyframes fade-out {
  2% {
    opacity: 1; }
  8% {
    opacity: 0; } }

/*----------------------------------------------   
--List for images, sm and large
-----------------------------------------------  */
ul.kf-slider{
height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left:0;
margin:0;
padding:0;
display:inline-block;
}

 li{ 	
    display:inline-block;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left:0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position:	50%;
  z-index: 0;
  opacity: 0;
  margin:0;
  padding:0;
  text-align:center;
  vertical-align:middle;


  /*-- Add animation --*/ 
  -webkit-animation: fade-out 125s infinite both;
    -moz-animation: fade-out 125s infinite both;
animation: fade-out 125s infinite both;
animation-timing-function:ease-in-out;
/*animation-direction: normal;
animation-fill-mode: both;*/

  /*-- Image 1: small --*/ 
  background-image: url(../img/0.jpg);
 }
 /*-- Image 2 --*/ 
 li:nth-child(2){
  background-image: url(../img/1.jpg);
  /*-- Animation delay: 3s --*/ 
  animation-delay:5s;
 }
 /*-- Image 3 --*/ 
 li:nth-child(3){
  background-image: url(../img/2.jpg);
  /* Animation delay: 6s */  
  animation-delay:10s;
 }
 li:nth-child(4){
  background-image: url(../img/3.jpg);
  /* Animation delay: 6s */  
  animation-delay:15s;
 }
li:nth-child(5){
  background-image: url(../img/4.jpg);
  /* Animation delay: 6s */  
  animation-delay:20s;
 }
li:nth-child(6){
  background-image: url(../img/5.jpg);
  /* Animation delay: 6s */  
  animation-delay:25s;
 }
li:nth-child(7){
  background-image: url(../img/6.jpg);
  /* Animation delay: 6s */  
  animation-delay:30s;
 }
li:nth-child(8){
  background-image: url(../img/7.jpg);
  /* Animation delay: 6s */  
  animation-delay:35s;
 }
li:nth-child(9){
  background-image: url(../img/8b.jpg);
  /* Animation delay: 6s */  
  animation-delay:40s;
 }
li:nth-child(10){
  background-image: url(../img/9.jpg);
  /* Animation delay: 6s */  
  animation-delay:45s;
 }
li:nth-child(11){
  background-image: url(../img/10.jpg);
  /* Animation delay: 6s */  
  animation-delay:50s;
 }
li:nth-child(12){
  background-image: url(../img/11.jpg);
  /* Animation delay: 6s */  
  animation-delay:55s;
 }
li:nth-child(13){
  background-image: url(../img/12.jpg);
  /* Animation delay: 6s */  
  animation-delay:60s;
 }
li:nth-child(14){
  background-image: url(../img/13.jpg);
  /* Animation delay: 6s */  
  animation-delay:65s;
 }
li:nth-child(15){
  background-image: url(../img/14.jpg);
  /* Animation delay: 6s */  
  animation-delay:70s;
 }
li:nth-child(16){
  background-image: url(../img/15.jpg);
  /* Animation delay: 6s */  
  animation-delay:75s;
 }
li:nth-child(17){
  background-image: url(../img/16.jpg);
  /* Animation delay: 6s */  
  animation-delay:80s;
 }
li:nth-child(18){
  background-image: url(../img/17.jpg);
  /* Animation delay: 6s */  
  animation-delay:85s;
 }
li:nth-child(19){
  background-image: url(../img/18.jpg);
  /* Animation delay: 6s */  
  animation-delay:90s;
 }
li:nth-child(20){
  background-image: url(../img/19.jpg);
  /* Animation delay: 6s */  
  animation-delay:95s;
 }
li:nth-child(21){
  background-image: url(../img/20.jpg);
  /* Animation delay: 6s */  
  animation-delay:100s;
 }
li:nth-child(22){
  background-image: url(../img/21.jpg);
  /* Animation delay: 6s */  
  animation-delay:105s;
 }
li:nth-child(23){
  background-image: url(../img/22.jpg);
  /* Animation delay: 6s */  
  animation-delay:110s;
 }
li:nth-child(24){
  background-image: url(../img/23.jpg);
  /* Animation delay: 6s */  
  animation-delay:115s;
 }
li:nth-child(25){
  background-image: url(../img/24.jpg);
  /* Animation delay: 6s */  
  animation-delay:120s;
 }

/*
@media (max-width:1302px)
{
  #menu .btn
  {
    font-size:1rem;
  }
} 
@media (max-width:1160px)
{
  #menu .btn
  {
    font-size:0.8rem;
  }
} 
@media (max-width:1060px)
{
    h1
    {
        font-size:1.8rem;
    }
    h2
    {
        font-size:1.4rem;
    }
}
*/
@media (max-width:1302px)
{
    html
    {
        font-size:16px;
    }
    #menu .btn
    {
        margin-right:0.25rem;
    }
}
@media (max-width:1160px)
{
    html
    {
        font-size:12px;
    }

}
@media (max-width:1060px)
{
    html
    {
        font-size:10px;
    }
}
@media (max-width:800px)
{
    #menu .btn
    {
        padding: 0.5rem 0.6rem;
    }
}
@media (max-width:670px)
{
    html
    {
        font-size:8px;
    }
}
@media (max-width:532px)
{
    html
    {
        font-size:7px;
    }
}
@media (max-width:466px)
{
    html
    {
        font-size:5px;
    }
#menu .btn
    {
        margin-top:1rem;
        margin-bottom:0.5rem;
    }
}
@media (max-width:342px)
{
    html
    {
        font-size:4px;
    }
}
@media (orientation: portrait)
{
#inhalt p
{
    margin-left: 4rem;
    margin-right:4rem;
    font-size:3rem;
    line-height:4rem;
    text-align:left;
    text-justify:none;
}
#article
{
    min-height:80vh;
    max-height:80vh;
}
#inhalt
{
    min-height:80vh;
    max-height:80vh;
}
}

@media (orientation: landscape)
{
#article
{
    min-height:50vh;
    max-height:50vh;
}
#inhalt
{
    min-height:50vh;
    max-height:50vh;
}
}

@media print
{
    ul.kf-slider
    {
        display:none;
    }
    #menu .btn
    {
        display:none;
    } 
    #header
    {
        display:none;
    }   
body
{
  font-size:14pt;
}
  h1
{
  font-size:20pt;
}
h2
{
font-size:18pt;
}
h3
{
 font-size:16pt;
}
  #article
  {
      font-size:14pt;
      width:100vw;
      margin:0;
      float:left;
     /* overflow:auto;*/
      page-break-after:always;
  }
}
