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

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

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

.textarea {
display: inline-block;
resize: none;
font-size: 3vmin;
color: gray;
font-family: Arial, Helvetica, sans-serif;
border:1px solid gray;
border-radius: 5px;
background-color: #ffffff;
}

:root {
--progress-bar-width: 15vmin;
--progress-bar-height: 15vmin;
--font-size: 2vmin;
}

.circular-progress {
position: fixed;
width: var(--progress-bar-width);
height: var(--progress-bar-height);
border-radius: 50%;
left: calc(50vw - 6vmin);
top: calc(50vh - 6vmin);
display: flex;
justify-content: center;
align-items: center;
}
.inner-circle {
position: absolute;
width: calc(var(--progress-bar-width) - 4vmin);
height: calc(var(--progress-bar-height) - 4vmin);
border-radius: 50%;
background-color: white;
}

.percentage {
position: relative;
font-size: var(--font-size);
color: rgb(0, 0, 0, 0.8);
}

.bodyBg {
width: 96vw;
max-width: 1400px;
margin: 0px auto;
padding: 0px;
}

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

.hide1 {
width: 0vw;
height: 0vw;
visibility: hidden;
}

.fixedImg1 {
visibility: hidden;
position: fixed;
left: 50vw;
top: 50vh;
}

.text2 {
display: inline-block;
position: fixed;
font-size: 4vmin;
color: #ffffff;
font-family: sans-serif;
padding: 1vmin;
left: 1vw;
top: 14vmin;
}

.imgClose1 {
display: inline-block;
position: fixed;
width: 8vmin;
height: 8vmin;
max-width: 60px;
max-height: 60px;
right: 1vw;
top: 14vmin;
margin: 0px;
padding: 0px;
}

.imgClose1:hover {
cursor: pointer;
}

.naviLeft1 {
position: fixed;
width: 8vmin;
height: 8vmin;
max-width: 60px;
max-height: 60px;
left: 1vw;
top: 50vh;
}

.naviLeft1:hover {
cursor: pointer;
}

.naviRight1 {
position: fixed;
width: 8vmin;
height: 8vmin;
max-width: 60px;
max-height: 60px;
right: 1vw;
top: 50vh;
}

.naviRight1:hover {
cursor: pointer;
}

.imgMain {
  width: 100%;
  height: auto;
  object-fit: fill;
}

.imgBg1 {
position: fixed;
width: 100vw;
height: 100vh;
top: 0;
left: 0;
margin-top: 0px;
margin-left: 0px;
background-color: rgba(0, 0, 0, 0.6);
}

#topLoader {
display: block;
height: 14vmin; 
max-height: 140px;
margin: 0; 
padding: 2vmin;
}

.leiste1 {
display: block;
width: 100%;
color: #7e4275;
font-size: clamp(22px, 5vmin, 38px);
font-family: headerFnt1;
background-color: #006bd8;
opacity: 0.8;
padding: 0px;
}

.link1 {
display: inline-block;
color: #616771; 
border: 1px solid transparent;
}

.link1:hover {
border: 1px solid #ffffff;
cursor: pointer;
}

.fontHeader1 {
    display: inline-block;
color: #7e4275;
font-size: clamp(22px, 5vmin, 38px);
font-family: headerFnt1;
display: flex; 
justify-content: flex-end;
margin-right: 4vmin;
}

.fontHeader2 {
color: #1265ba;
font-size: clamp(22px, 5vmin, 38px);
font-family: headerFnt1;
margin: 0;
padding: 0;
}

.fontHeader3 {
color: #1265ba;
font-size: clamp(22px, 5vmin, 38px);
font-family: Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}

.fontHeader4 {
color: #7e4275;
font-size: 3vmin;
font-family: Arial, Helvetica, sans-serif;
padding: 0px;
background-color: #ead1d1;
}

.fontHeaderRight8 {
display: inline-block;
color: #7e4275;
font-size: 8vmin;
font-family: headerFnt1;
margin: 0px;
padding: 2vmin;
}

.fontHeaderSendInfo {
display: inline-block;
color: #525252;
font-size: 2vmin;
font-family: Arial, Helvetica, sans-serif;
margin: 0px;
padding: 2vmin;
}

.fontHeaderLeft1 {
display: inline-block;
color: #ffffff;
font-size: clamp(18px, 4vmin, 24px);
font-family: Arial, Helvetica, sans-serif;
padding: 0px;
float: left;
}

.fontHeaderRight1 {
display: inline-block;
color: #ffffff;
font-size: clamp(18px, 4vmin, 24px);
font-family: Arial, Helvetica, sans-serif;
padding: 0px;
float: right;
}

.fontLeft20 {
display: inline-block;
color: #525252;
font-size: 22px;
font-family: Arial, Helvetica, sans-serif;
padding: 0;
margin: 0;
float: left;
width: 30%;
}

.fontLeft30 {
padding: 0px;
margin: 10px;
float: right;
}

.fontLeft60 {
padding: 0px;
margin: 10px;
float: right;
}

.fontLeft70 {
display: inline-block;
color: #525252;
font-size: 3vmin;
font-family: Arial, Helvetica, sans-serif;
padding: 3vmin;
float: left;
width: 70%;
}

td {
color: #9b5656;
font-size: 3.2vmin;
font-family: Arial, Helvetica, sans-serif;
padding-top: 2vmin;
padding-left: 2vmin;
}

.statContainer {
width: 0px;
height: 0px;
padding: 0px;
margin: 0px;
}

.imgContainer {
width: 0px;
height: 0px;
padding: 0px;
margin: 0px;
}

#topPadding {
display: block;
max-height: 60px;
}

.block1 {
height: 1vmin;
max-height: 1px;
display: block;
}

.block2 {
height: 4vmin;
max-height: 10px;
display: block;
}

.block3 {
height: 4vmin;
max-height: 20px;
display: block;
}

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

.block10 {
height: 10vmin;
max-height: 80px;
display: block;
}

.avatar {
width: 100%;
height: auto;
margin: 0px;
padding: 0px;
}

.bg0 {
display: block;
text-align: center;
background-color: #ffffff;
width: 100%;
max-width: 1400px;
margin: 0 auto;
padding: 2vmin;
}

.bg1 {
display: block;
text-align: center;
background-color: #f5e7f3;
width: 100%;
max-width: 1400px;
margin: 0 auto;
padding: 2vmin;
}

.bg2 {
display: inline-block;
width: 100%;
max-width: 1400px;
}

.bg3 {
display: block;
width: 100%;
max-width: 1400px;
margin: 0 auto;
padding: 4vmin;
}

.bg4 {
display: block;
background-color: #f5e7f3;
width: 100%;
max-width: 1400px;
margin: 0 auto;
padding: 2vmin;
}

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

.bg6 {
display: block;
width: 100%;
width: auto;
max-width: 1400px;
margin: 0 auto;
padding: 0;
background-image: url('img/tatzen.png');
background-position: right bottom;
background-repeat: no-repeat;
background-size: 10vmin 10vmin;
}

#img1 {
    visibility: hidden;
}

#img2 {
    visibility: hidden;
}

#img3 {
    visibility: hidden;
}

#img4 {
    visibility: hidden;
}

#img5 {
    visibility: hidden;
}

#img6 {
    visibility: hidden;
}

#img7 {
    visibility: hidden;
}

#img8 {
    visibility: hidden;
}

#img9 {
    visibility: hidden;
}

#img10 {
    visibility: hidden;
}

#img11 {
    visibility: hidden;
}

#img12 {
    visibility: hidden;
}

#imgFrame {
margin: 0;
padding: 0;
}

.imgLeft1 {
display: block;
background-color: #ffffff;
border: 1px solid #c0c0c0;
float: left;
}

.imgLeft1:hover {
cursor: pointer;
}

.imgLeft2 {
display: inline-block;
width: 11vmin;
height: 11vmin;
margin: 2vmin;
padding: 0;
}

.imgLeft2:hover {
cursor: pointer;
}

.imgLeft3 {
display: inline-block;
margin: 0;
padding: 0;
}

#imgRight1 {
display: inline-block;
width: 8vmin;
height: 8vmin;
max-width: 70px;
max-height: 70px;
margin: 0;
padding: 0;
float: right;
}

#imgRight1:hover {
cursor: pointer;
}

.fontHeaderTop {
display: inline-block;
color: #ffffff;
font-size: clamp(22px, 6vmin, 48px);
font-family: headerFnt1;
margin: 0;
padding: 0;
float: left;
}

.fontHeaderInline1 {
    display: inline-block;
    text-align: center;
    color: #7e4275;
    font-size: 5vmin;
    font-family: headerFnt1;

}

a { 
display: inline-block;
font-size: clamp(18px, 4vmin, 24px);
color: #004388;
font-family: sans-serif;
}

.a1 { 
display: inline-block;
font-size: clamp(18px, 4vmin, 24px);
color: #004388;
font-family: sans-serif;
float: left;
}

.a1:hover { 
background-color: #68b3ff;
}

.a2 { 
display: inline-block;
font-size: clamp(18px, 4vmin, 24px);
color: #004388;
font-family: sans-serif;
}

.a2:hover { 
background-color: #68b3ff;
}

.a3 {
cursor: pointer;
background-color: #ffffff;
color: #1265ba;
font-size: clamp(22px, 5vmin, 38px);
font-family: headerFnt1;
margin: 0;
padding: 0;
}

.a3:hover { 
background-color: #68b3ff;
color: #ffffff;
}

.img1 { 
display: inline-block;
width: 29vmin;
max-width: 256px;
height: auto;
padding: clamp(4px, 2vmin, 24px);
}

.aLink { 
display: inline-block;
font-size: clamp(18px, 4vmin, 24px);
color: #004388;
font-family: sans-serif;
}

.text1 { 
display: inline-block;
font-size: clamp(18px, 4vmin, 24px);
color: #5a5a5a;
font-family: sans-serif;
}

.rahmenFormular {
display: inline-block;
font-size: 3vmin;
color: gray;
font-family: Arial, Helvetica, sans-serif;
border:1px solid gray;
border-radius: 5px;
background-color: #ffffff;
}

.btnFormular {
display: inline-block;
font-size:3vmin;
color: gray;
font-family: Arial, Helvetica, sans-serif;
border:1px solid gray;
border-radius: 5px;
background-color: #ffffff;
}

.btnNavi1 {
display: inline-block;
font-size: 4vmin;
color: gray;
font-family: Arial, Helvetica, sans-serif;
border:1px solid gray;
border-radius: 5px;
background-color: #ffffff;
padding: 2vmin;
margin: 2vmin;
}

.btnNavi1:hover {
background-color: #c0c0c0;
cursor: pointer;
}

.btnNavi2 {
display: inline-block;
font-size: 4vmin;
color: gray;
font-family: Arial, Helvetica, sans-serif;
border:1px solid gray;
border-radius: 5px;
background-color: #e0e0e0;
padding: 2vmin;
margin: 2vmin;
}

.clearfix:after {
content: " ";
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; 
}