:root{
     --background-color: white;
     --head-mark-color:rgba(116, 181, 235, 0.918);
     --menue-margin: 320px;
     --Logo-left: calc(27% - 129px);

     --MenueBackground: linear-gradient(white, rgba(60, 92, 160, 0.356) 25px, rgba(60, 80, 158, 0.432) 29px, rgb(223, 223, 223));
}
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
}

header{
    height:50px;
    box-sizing: inherit;
    background-color: white;
   /* background-image: linear-gradient(white, rgb(218, 216, 216) 80px); before*/
   background-image: linear-gradient(white, rgb(218, 216, 216) 80px);
    display:flex;;
    /*justify-content:center;*/
    align-items: center;
    /*margin-left:calc(27% + 500px);*/
}
header a {
    color: rgba(90, 162, 221, 0.815);
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
    color:#919191;
    font-size: 12px;

}
.head1{
    box-sizing: content-box;
    display: flex;
    /*justify-content:center;*/
   /* margin-right: 10%;*/   
   margin-left:calc(27% + 300px);   
 
}
.head1 a{
    margin-right: 30px;
    font-size: 13px;
   /* margin-right: 10px;*/
}
.head2{
    box-sizing: inherit;
    width: 60px;   
    /*margin-right: -50%;*/  
    
    margin-left:calc(15% - 50px);    
    display: flex;
}
.head2 a{
    margin-right: 5px;
}

header a:hover{
    color: var(--head-mark-color);
}

.blue{
    color: var(--head-mark-color);
}

.UnterM{
    height:30px;
    width: 365px;
    box-sizing:border-box;
    background-color: white;
    font-size: 12px;
    color:black;
    align-items: center;
    margin-top: 2px;
    margin-left: 53%;
    padding: 5px;
    display: flex;
    box-shadow: 0px 5px 13px 2px #c2c2c2;
    }

.UnterM a{
    text-decoration: none;
    font-size: 13px;
    color: rgb(6, 15, 145);
    background-color: white;
   /* border-right: solid rgb(155, 155, 155) 1px; */
    margin-right: 2px;
    margin-left: 5px;
    padding: 4px;
    padding-right: 12px;
    padding-left: 7px;
}

.UnterM2{
    height:30px;
    width: 425px;
    box-sizing:border-box;
    background-color: white;
    font-size: 12px;
    color:black;
    align-items: center;
    margin-top: 2px;
    margin-left: 59%;
    padding: 5px;
    display: flex;
    box-shadow: 0px 5px 13px 2px #c2c2c2;
    }

.UnterM2 a{
    text-decoration: none;
    font-size: 13px;
    color: rgb(6, 15, 145);
    background-color: white;
   /* border-right: solid rgb(155, 155, 155) 1px; */
    margin-right: 2px;
    margin-left: 5px;
    padding: 4px;
    padding-right: 12px;
    padding-left: 7px;
}


.UnterMno{
    display: none;
}
.UnterSpace{
   height:32px;
}
.UnterSpace a{
    text-decoration: none;
    font-size: 20px;
    color:  white;
    background-color: white;
   /* border-right: solid rgb(155, 155, 155) 1px; */
    margin-right: 2px;
    margin-left: 5px;
    padding: 4px;
    padding-right: 12px;
    padding-left: 7px;
}

.UnterM a:hover{
    background-color: rgba(53, 99, 226, 0.555);
    color:white;
}

.UnterM2 a:hover{
    background-color: rgba(53, 99, 226, 0.555);
    color:white;
}


.menue{
    height:50px;
    width: 400px;
    /*width: 300px;*/
    box-sizing: border-box;
   /* position: fixed;
    position:static;
    left: auto;
    top:auto;
   transform: translate(-50%, -50%);*/
    background-color: var(--background-color);
   /*background-image: linear-gradient(white, rgba(185, 183, 183, 0.733) 25px, rgb(180, 179, 179) 29px, rgb(223, 223, 223)); before*/
    background-image: var(--MenueBackground);
    display: flex;
    justify-content:center;
    gap: 1px;
    align-items: 0;
    margin: 0px; /*var(--menue-margin);*/
    margin-top: -50px;
    margin-left: calc(50% - 50px);
    list-style: none;
    box-shadow: 0px 5px 13px 2px #c2c2c2;
    
}
.menue a{
        margin-right: 0px;
        margin-left: 0px;
        text-decoration: none;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 16px;
        color: black;
        align-items: center;
        border: 0px;
        padding: 20px;
        box-shadow: 0px 0px 0px 1px #bfbfbf;
        /*box-sizing: border-box;*/
              
 }
  
    .menue :hover{
        background-color: rgb(131, 129, 129);
        color:white;
        text-decoration: none;
      
     }
     .marked{
      background-image:linear-gradient(white, rgba(85, 120, 218, 0.555) 25px, rgb(85, 120, 218, 0.555) 29px, rgb(223, 223, 223));
     }
     
   
       

    .backmenue{
     height:50px;
     margin: 0px;
     margin-top: 0px;
     background-color: var(--background-color);;
     /*background-image: linear-gradient(white, rgba(185, 183, 183, 0.733) 25px, rgb(180, 179, 179) 29px, rgb(223, 223, 223)); Befor*/
     background-image: var(--MenueBackground);
     box-shadow: 0px 5px 13px 2px #858484;
     display: flex;
     justify-content:flex-end;
     gap: 1px;
     align-items: 0;
     /*position:fixed;*/
    }
   
    .nav ul{
        height:100%;
           }

    .dropdown{
        box-shadow:none;
        height: 50px;
        width: 200px;
        background-color:rgba(66, 78, 247, 0.699);
        display: none;
        flex-direction: row;
        position: absolute;
        top: 52px;
        align-items: center;
        list-style: none;
        
        box-sizing: border-box;
        
    }
    .dropdown a {
        box-shadow:none;
        box-sizing: border-box;
       background-color: white; 
    }

    .expendable_li{
        display:flex;
        justify-content: center;  
    }

    
ul :hover .dropdown{
        display: flex;
        
    }
    
    .dropdown :hover{
        background-color:white;
        color: blue;

    }

.markedUnder{
       /* background-image:linear-gradient(white, rgba(85, 120, 218, 0.555) 25px, rgb(85, 120, 218, 0.555) 29px, rgb(223, 223, 223));*/
       background-image:linear-gradient(white,rgba(53, 99, 226, 0.555));
        background-color: rgba(53, 99, 226, 0.555);
        color: white;   

    }

 .markImp{
     color: var(--head-mark-color)
 }   

nav input[type="checkbox"]{
    display:none;
}

.Logo{
   display:flex;
   justify-content:flex-start;
   height: 30px;
   width: 120px;
   margin-left: calc(var(--Logo-left) + 160px);
}


.Logo1{
   display:flex;
   justify-content:flex-start;
   height: 100px;
   width: 120px;
   /*margin-left: calc(10vw*(var(--view))); */
   /*var(--Logo-left);*/
   /*margin-left: calc(2% + 20px);*/
   margin-left: calc(var(--Logo-left) - 30px);
   margin-top: -110px;
   /*position: fixed;*/
}

.LogoT{
    display:flex;
    justify-content:flex-start;
    color: rgb(55, 85, 157);
    font-size: 11px;
    font-weight:bold;
    margin-top: 0px;
    
}
.LogoText{
    display:flex;
    justify-content:flex-start;
    /*margin-left: calc(10vw*(var(--view)));*/
    margin-left: calc(var(--Logo-left) - 30px);
    margin-top: -5px;
    
}
.LogoText2{
    display:flex;
    justify-content:flex-start;
    margin-top: 9px;
    margin-left: -87px;
 }


 .container{
    width: 960px;
    height: 95%;/*95vh; */
    height:fit-content;
    background-color: rgb(225, 225, 236);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    /*margin-left: calc(27% - 129px);*/
    margin-left: var(--Logo-left);
    
}

.containerFirm{
    width: 960px;
    height: 95%; /* 90vh; */
    height:fit-content;
    background-color: rgb(225, 225, 236);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    /*margin-left: calc(27% - 129px);*/
    margin-left: var(--Logo-left);
}


.swiper{
    width: 100%;
    /*height: 48vh;/*fit-content;*/
    height: 440px;
    box-shadow: 0px 5px 13px 2px #c2c2c2;
   
}

.swiper-slide img{
    width: 100%;
    height:max-content;
}
.swiper .swiper-button-prev, .swiper .swiper-button-next {
    color:rgba(225, 225, 236, 0.295);
}
.swiper .swiper-pagination-bullet-active{
    background: rgba(225, 225, 236, 0.295);
}
.GMFilm{
    margin-top: 30px;
    margin-left: calc((var(--Logo-left)) + 80px);
    width: 800px;
    box-shadow: 0px 5px 13px 2px #858484;
}

.GMFilm2{
    margin-top: 30px;
    margin-left: calc((var(--Logo-left)) + 80px);
    width: 690px;
    box-shadow: 0px 5px 13px 2px #858484;
}

.GMFilm3{
    display: flex;
    margin-top: 20px;
    margin-left: calc((var(--Logo-left)) + 5px);
    width: 850px;
    height: 478px;
    box-shadow: 0px 5px 13px 2px #858484;
}


.GifTop{
    margin-top: 30px;
    margin-left: calc((var(--Logo-left)) + 80px);
    width: 690px;
    /* box-shadow: 0px 5px 13px 2px #858484;  */
}

.GifInside{
    width: 70%;
    height: auto;
    margin-left: 140px;
    margin-top: 30px;
    margin-bottom: 20px;
}


.containerBerechnung{
    width: 750px;
    height: 400px;
    /*height:fit-content;*/
    background-color: rgb(225, 225, 236);
    display: flex;
    justify-content: left ;
    align-items: left;
    margin-top: 30px;
    /*margin-left: calc(27% - 129px);*/
    margin-left: var(--Logo-left);
    background-image: url(images/BerBack.jpg);
    background-size: 100%;
    
}
H1berechnung{
    box-sizing:border-box;
    background-color: transparent;
    display: flex;
    align-items: center;
    padding: 0px;
    display:flex;
    margin-left: calc(27% - 120px);
    margin-top: 30px;
    width: 700px;
    font-size: 18px;
    font-style:inherit;
}

H1berechnung a{
    font-size: 22px;
    color: rgb(55, 85, 157);
    /*margin-left:calc(12% - 42px);*/
}

H2Berechnung{
    box-sizing: border-box;
    height: fit-content;
    width: fit-content;
    display: flex;
    background-color: transparent;
    align-items: left;
    margin-top: 30px;
    margin-bottom: 0px;
    padding: 5px;
    display: flex;
    margin-left: calc(27% - 120px);
    
} 

input{
    height: fit-content;
    width: 100px;
    font-size: 16px;
    justify-content: center;
    margin-left: calc(27% - 120px);
    margin-top: 0px;
    }


    button {
        background-color: #C2185B;
        color: white;
        border: unset;
        padding: 8px;
        border-radius: 4px;
        min-width: 160px;
        font-weight: 600;
        cursor: pointer;
        box-shadow: 0px 3px 1px -2px rgb(0 0 0 / 20%), 0px 2px 2px 0px rgb(0 0 0 / 14%), 0px 1px 5px 0px rgb(0 0 0 / 12%);
        margin-left: calc(27% - 100px);
        margin-top: 15px;
        font-size: 15px;
    }
      

    button:hover {
        background-color: #d63475;
    }
    
    button2 {
        
        color: white;
        padding: 5px;
        border-radius: 4px;
        min-width: 100px;
        font-weight: 400;
        cursor: pointer;
        box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.329), 0px 2px 2px 0px rgba(0, 0, 0, 0.288), 0px 1px 5px 0px rgba(0, 0, 0, 0.336);
        display: flex;
        margin-left: calc(27% - 100px);
        margin-top: -40px;
        font-size: 15px;
        background-color: #1e56c0;
        width: 105px;
    }
      

    button2:hover {
        background-color: #8cb2e4;
    }
    
    Backimg{
        display: flex;
        width: 960px;
        height: 400px;
        background-color: transparent;
    }

    FormPic{
        display: flex;
        width: 960px;
        height: 400px;
        background-color: transparent;
    }

    .Linki a{
        pointer-events: all;
        cursor: pointer;
        color: blue;
       }

    .Linki a:hover {
        cursor: pointer;
        color: #8cb2e4;
    }

    .Linki :hover {
        cursor: pointer;
        color: #8cb2e4;
    }