* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
padding: 0px;
margin: 0px;
}

html {
padding: 0px;
margin: 0px;
}

@font-face {
font-family: headerFnt1;
src: url(img/fnt.otf);
}

.leisteSize {
display: block;
width: 100%;
background-color: transparent;
padding: max(20px, 2vmin);
}

.leiste1 {
display: block;
position: fixed;
width: 100%;
background-color: #5a7776;
padding: max(20px, 2vmin);
z-index: 100;
}

.status {
display: inline-block;
position: fixed;
background-color: rgb(0, 255, 0);
width: 20px;
height: 2vmin;
max-height: 4px;
margin: 0;
padding: 0;
z-index: 100;
}

.statusBox {
display: block;
position: fixed;
background-color: #ffffff;
width: 100%;
height: 2vmin;
max-height: 4px;
margin: 0;
padding: 0;
}

.fontHeader1 {
display: block;
color: #ffffff;
font-size: max(30px, 5vmin);
font-family: headerFnt1;
}

.fontHeader2 {
display: block;
color: #000000;
font-size: max(30px, 5vmin);
font-family: headerFnt1;
}

.text1 {
display: block;
word-wrap: break-word;
color: #ffffff;
font-size: max(18px, 2.4vmin);
font-family: Verdana, Geneva, sans-serif; 
}

.text2 {
display: block;
word-wrap: break-word;
color: #000000;
font-size: max(18px, 2.4vmin);
font-family: Verdana, Geneva, sans-serif;
margin: max(10px, 2vmin);
padding: 0; 
float: left;
}

.text2 img {
display: block;
}

.text3 {
display: block;
word-wrap: break-word;
color: #000000;
font-size: max(18px, 2.4vmin);
font-family: Verdana, Geneva, sans-serif; 
}

.text4 {
display: block;
word-wrap: break-word;
color: #000000;
font-size: max(14px, 2vmin);
font-family: Verdana, Geneva, sans-serif; 
}

.text5 {
display: inline;
color: #2a2a2a;
font-size: max(18px, 2vmin);
font-family: Verdana, Geneva, sans-serif;
margin-left: max(14px, 3vmin);
margin-right: 0px;
}

.text6 {
display: block;
word-wrap: break-word;
color: #000000;
font-size: max(18px, 2.4vmin);
font-family: Verdana, Geneva, sans-serif; 
float: left;
}

.text7 {
display: block;
word-wrap: break-word;
color: #000000;
font-size: max(18px, 2.4vmin);
font-family: Verdana, Geneva, sans-serif; 
}

.textRight1 {
display: block;
word-wrap: break-word;
color: #000000;
font-size: max(18px, 2.4vmin);
font-family: Verdana, Geneva, sans-serif; 
float: right;
}

.mainBg {
display: block;
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 0;
}

.mainBg2 {
display: block;
width: 100%;
max-width: 1200px;
background-color: #6b9573;
margin: 0 auto;
padding: max(22px, 3vmin);
}

.mainBg3 {
display: block;
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: max(22px, 3vmin);
}

.mainBg4 {
display: block;
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 0;
overflow: auto;
}

.mainBg5 {
display: flex;
justify-content: right;
align-items: center; 
width: 100%;
max-width: 1200px;
background-color: #e2e2e2;
margin: 0 auto;
padding: max(2px, 1vmin);
}

.mainBg6 {
display: block;
width: 100%;
max-width: 760px;
margin: 0 auto;
padding: 0;
}

.mainBg7 {
display: block;
width: 100%;
max-width: 1200px;
background-color: #e2e2e2;
margin: 0 auto;
padding: max(22px, 3vmin);
}

.imgLeft50 {
width: 50%;
display: block;
padding: 0;
margin: 0;
float: left;
}

.imgRight50 {
width: 50%;
display: block;
padding: 0;
margin: 0;
float: right;
overflow: auto;
}

.imgRight1 {
display: inline-block;
width: 36vmin;
height: auto;
max-width: 348px;
margin: 0;
padding: 0;
float: right;
}

.imgRight2 {
display: inline;
width: 12vmin;
height: auto;
max-width: 58px;
background-color: #ffffff;
margin-left: max(14px, 3vmin);
border: 1px solid #a6a6a6;
}

.imgRight2:hover {
cursor: pointer;
background-color: #8ce594;
}

.imgRight3 {
display: block;
width: 10vmin;
height: auto;
max-width: 38px;
margin-left: max(8px, 2vmin);
margin-right: max(8px, 2vmin);
padding: 0;
float: right;
}

.imgLeft1 {
display: inline-block;
width: 8vmin;
height: auto;
max-width: 48px;
margin: max(10px, 2vmin);
padding: 0;
float: left;
}

#img1  {
width: 100%;
height: auto;
left: 0px;
position: absolute;
}

#img2  { 
width: 100%;
height: auto;
left: 100%;
position: absolute;
}

#img3  { 
width: 100%;
height: auto;
left: 100%;
position: absolute;
}

#img4  { 
width: 100%;
height: auto;
left: 100%;
position: absolute;
}

#img5  { 
width: 100%;
height: auto;
left: 100%;
position: absolute;
}

#img6  { 
width: 100%;
height: auto;
left: 100%;
position: absolute;
}

.arrow1 {
border: 1px solid #ffffff;
display: inline-block;
width: 12vmin;
height: 12vmin;
max-width: 70px;
max-height: 70px;
padding: 0;
float: right;
}

.arrow1:hover {
border: 1px solid #c0c0c0;
cursor: pointer;
}

.arrow2 {
border: 1px solid #ffffff;
display: inline-block;
width: 12vmin;
height: 12vmin;
max-width: 70px;
max-height: 70px;
padding: 0;
margin-left: 0px;
float: left;
}

.arrow2:hover {
border: 1px solid #c0c0c0;
cursor: pointer;
}

#imgFadeShow {
position: relative;
overflow: hidden;
display: block;
width: 100vw;
height: 56vw;
max-width: 760px;
max-height: 426px;
background-color: #ffffff;
float: left;
margin: 0;
padding: 0;
border: 1px solid #c0c0c0;
}

#imgFadeShow > div { 
width: auto;  
text-align: center;  
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
}

.block4 {
height: 4vmin;
max-height: 24px;
display: block;
}


.clearfix:after {
content: "&nbsp;";
font-size: 0;
display: block;
height: 0;
clear: both;
visibility: hidden; 
}
.clearfix 
{ 
display: inline-block; 
}
.clearfix 
{ 
display: block; 
}
* html .clearfix 
{ 
height: 1%; 
}
.clear 
{ 
clear: both; 
}
