/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.3.6,
* Autoprefixer: v10.3.1
* Browsers: last 4 version
*/

* {
    margin: 0%;
}

body{
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 20px;
    background-color: white;
    font-family: 'Roboto', sans-serif;
}
a{
    color: black;
    text-decoration: none;
    font-weight: bold;
}
a:hover{
    text-decoration: underline;
}
.grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-row: auto;
        grid-template-areas: 
        "navbar navbar navbar"
        "Content Content Content"
        "botbar botbar botbar"
        "footer footer footer";

}

/* Helper to jump back to top of page */
.float{
	position:fixed;
	width:50px;
	height:50px;
	bottom: 65px;
	left:20px;
	background-color:rgb(113, 114, 116);
	color:rgb(8, 8, 8);
	border-radius:50px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    font-size: 30px;
	-webkit-box-shadow: 2px 2px 3px #999;
	        box-shadow: 2px 2px 3px #999;
}
.my-float:hover{text-decoration: none;}

/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/* Header*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/

/*Helper*/
/*-------------------------------------------------------------------*/

/* Align the Elements in helper bar*/ 
.helper{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgb(181, 182, 184);
}
.helper a{font-weight: normal;}



   /*Navbar*/
/*-------------------------------------------------------------------*/

/* Style the logo and corporate identity */
.logo{
    grid-area: logo;
    display: flex;
    justify-content: center;
    font-weight: bold;
    font-size: 12px;
    max-height: 200px;
    height: 200px;
    
}

/* Style and align the elements in Navigation bar*/
.navbar{
    grid-area: navbar;
    font-size: 25px;
    font-weight: bold;
    height: 100px;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}


.pc_nav{
    display: flex;
    justify-content:space-evenly;
    align-items: center;
    height: auto;
    width: 100%; 
}

.navbar ul{
    margin: 0%;
    padding: 0%;
    width: 90%;
    display: flex;
    justify-content: space-around;
}
.navbar ul li{
    list-style: none;
    display: inline-block;
    position: relative;
    text-decoration: none;
    text-align: center;
}
.navbar ul li ul {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    display: none;
}
.navbar ul li:hover > ul,
ul li ul:hover {
  visibility: visible;
  opacity: 1;
  display: block;
}
.navbar ul li ul li {
    clear: both;
    width: 100%;
    text-align: left;
    margin-left: 30px;
    padding: 1%;
}
.active{
    color: rgb(113, 114, 116);
}
.adress .a .active{color: black;}

.hamburger{
    display: block;
    width: 50px;
    height: 50px;
    cursor: pointer;
    appearance: none;
    outline: none;
    background: none;
    border: none;
    margin-right: 10px;
    margin-top: 5px;
    
}
.hamburger .bar, .hamburger:after, .hamburger:before{
    width: 100%;
    height: 5px;
    margin: 3px;
    transition: 0.4s;
    background-color: rgb(113, 114, 116);
    display: block;
    content: "";
}
.hamburger.is_active:before{
    transform: rotate(-45deg) translate(-9px, 6px);
}
.hamburger.is_active:after{
    transform: rotate(45deg) translate(-4px, -2px);
}
.hamburger.is_active .bar{
    opacity: 0;
}
.mobile_nav{
    position: fixed;
    top: 0;
    left: 100%;
    width: 100%;
    min-height: 100%;
    display: block;
    padding-left: 20%;
    background-color: white;
    margin-top: 120px;
    font-size: 13px;
    transition: 0.4s;
}
.mobile_nav.is_active{
    left: 0px;
   
}

.mobile_nav a{
    display: block;
    text-align: center;
    width: fit-content;
    height: 100%;
    text-decoration: none;
    padding: 5px;
    
    
}



/*responsiveness*/

    /*smartphone*/
    @media screen and (max-width: 678px){
        .logo{height: 70px; font-size: 16px;}
        .pc_nav{display: none;}
        .helper{justify-content: space-evenly;}
        .navbar{height: 15px;}
      }
       /*Tablet*/
     @media screen and (min-width:679px) and (max-width:820px){
        .hamburger{display: none;}
        .mobile_nav{display: none;}
     }
      /*PC*/
     @media screen and (min-width:821px){
        .hamburger{display: none;}
        .mobile_nav{display: none;}
     }



/*------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/* Home*/
/*-------------------------------------------------------------------*/
/*------------------------------------------------------------------*/

.content{
    grid-area: Content;
    border-radius: 10px;  
}

.home_contentBox{
    grid-area: Home_ContentBox ;
    background: url(/images/background_image.jpg); 
    background-size:cover;
    border-radius: 10px;
    display: grid;
    column-gap: 5%;
    grid-template-columns: 5% 1fr 1fr 5% ;
    grid-template-rows: auto;
    grid-template-areas: 
        " . Content1 Content2 .";  
}

.content1{grid-area:Content1; margin-top: 10%;}
.content2{grid-area:Content2; margin-top: 10%;}



.card{
background-color: white;
border-radius: 10px;
padding: 1em;
line-height: 180%;
-webkit-box-shadow: 0px 10px 5px #919ca0;
        box-shadow: 0px 10px 5px #919ca0;
text-align: center;
justify-items: center;
margin-bottom: 10%;
-webkit-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;

}
.card:hover{
-webkit-transform: translate(-2px, -2px);
    -ms-transform: translate(-2px, -2px);
        transform: translate(-2px, -2px);
}
.card a:hover{text-decoration: none;}
.description{
flex-basis: 60%;
text-align:left;
margin-bottom: 15px;
margin-top: 10px;
font-size: 16px;
font-weight:normal;
line-height: 30px;
padding-right: 30px;
}
.home_contentBox .card .title{
font-weight: bold;
font-size: 20px;
color: black;
}
.section-image{
height: 120px;
width: auto;
margin-top: 10px;
}
.button{
border-radius: 10px;
width: auto;
height: 70px;
background-color:rgb(113, 114, 116) ;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align: center;
    -ms-flex-align: center;
        align-items: center;
-webkit-box-pack: start;
    -ms-flex-pack: start;
        justify-content: flex-start;
-webkit-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
font-size: 20px;
padding: 5px;
}   
.button a{margin: 0px;text-decoration: none;}
.button:hover{
-webkit-transform: translate(-2px, -2px);
    -ms-transform: translate(-2px, -2px);
        transform: translate(-2px, -2px);
background-color: rgb(186, 192, 191);
}




/*responsiveness*/
    /*smartphone*/
    @media screen and (max-width: 678px){
        .content{
            grid-template-columns: 1fr;
            grid-template-areas: 
            " . Home_ContentBox . ";
        }
        .home_contentBox{
            grid-template-columns: 5% 1fr 5%;
            grid-template-areas: 
            " . Content1 . "
            " . Content2 . ";
        }
      }
       /*Tablet*/
     @media screen and (min-width:679px) and (max-width:820px){
        .content{
            grid-template-columns: 1fr;
            grid-template-areas: 
            " Home_ContentBox "
            " Consulting_contentBox  "
            " Consulting_detail "
            " Verwaltung "
            "Verwaltung_detail"
            " google  "
            " contact-form "
            " position-container "
            " login  "
            " preise "
            " jobs "
            " faq "
            " datenschutz "
            " impres "
            " dashboard_container  "
            " unit_container ";
        }
    
     }
      /*PC*/
     @media screen and (min-width:821px) and (max-width:1405px){
        
     }


     
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/* Consulting*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/

.consulting_contentBox{

    grid-area: Consulting_contentBox;
    border-radius: 10px;
    background: url(/images/background_image3.jpg); 
    background-size:cover;
    display: grid;
    grid-template-columns: 5% 1fr 1fr 1fr 5%;
    grid-template-rows: auto;
    column-gap: 5%;
    grid-template-areas: 
    ". Head  Head Head ."
    ". Consult1 Consult2 Consult3 .";
    margin-bottom: 100px;
}

.head{-ms-grid-row: 1;-ms-grid-column: 5;-ms-grid-column-span: 3;grid-area: Head; text-align: center; margin-top: 30px; margin-bottom: 30px;}
.consult1{grid-area: Consult1;}
.consult2{grid-area: Consult2;}
.consult3{grid-area: Consult3;}



.consulting_contentBox .card{
    max-width: 200px;
    width: auto;}
.consulting_contentBox .card .title{font-size: 17px; color: black;}
.consulting_contentBox .card .section-image{height: 130px;}

.consulting_detail{
    grid-area: Consulting_detail;
    background: url(/images/background_image4.jpg); 
    background-size:cover;
    border-radius: 10px;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 10% 1fr 10%;
    grid-template-columns: 10% 1fr 10%;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
        grid-template-areas: 
        ". Consulting_detail1 ."
        ". Consulting_detail2 ."
        ". Consulting_detail3 .";
}
.consulting_detail a{text-decoration: none;}

.detailcard{
    margin-bottom: 40px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 10px 5px #919ca0;
            box-shadow: 0px 10px 5px #919ca0;
    background-color: white;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -ms-flex-line-pack: center;
        align-content: center;
}
.detailcardcard{
    flex-basis: 30%;
    margin-left: 15px;
    margin-top: 30px;
    text-align: center;
    justify-items: center;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
}
.detailcardcard .title{font-size: 17px;}
.consulting_detail1{-ms-grid-row: 1;-ms-grid-column: 2;grid-area: Consulting_detail1; margin-top: 80px;}
.consulting_detail2{-ms-grid-row: 10;-ms-grid-column: 2;grid-area: Consulting_detail2;}
.consulting_detail3{-ms-grid-row: 2;-ms-grid-column: 2;grid-area: Consulting_detail3;}



/*-------------------------------------------------------------------*/
/*responsiveness*/
/*-------------------------------------------------------------------*/
    /*smartphone*/
    @media screen and (max-width: 678px){
        .consulting_contentBox{ display: none;  }
        .detail1{margin-top: 20px;}
        .detail10{margin-bottom: 20px;}
        .detailcard{flex-direction: column;}
        .detailcardcard{margin-left: 0px; margin-top: 5px;}
        .detailcardcard .section-image {height: 80px;}
        .detailcard .description h2 {display: none;}
        .description{margin-top: 0px; font-size: 14px; padding-left: 30px;}
      }
       /*Tablet*/
     @media screen and (min-width:679px) and (max-width:820px){
        .consulting_contentBox{
            justify-content: center;
            grid-template-columns: 1fr 1fr 1fr;
            grid-template-areas: 
        " Consult1 Consult2 Consult3 ";
        }
        .head{display: none;}
        .consulting_contentBox .card{margin-top: 10px;}
        .consulting_contentBox .card .section-image{height: 100px;}
     }
      /*PC*/
     @media screen and (min-width:821px) and (max-width:1405px){
     }




/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/* Manage*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/

.managing_contentBox{
    grid-area: Managing_contentBox;
    border-radius: 10px;
    background: url(/images/background_image3.jpg); 
    background-size:cover;
    display: grid;
    grid-template-columns: 5% 1fr 1fr 1fr 5%;
    grid-template-rows: auto;
    column-gap: 5%;
        grid-template-areas: 
        ". Head  Head Head ."
        ". Manage1 Manage2 Manage3 ."
        ". Manage4 Manage5 Manage6 .";
    margin-bottom: 100px;
}
.manage1{grid-area: Manage1;}
.manage2{grid-area: Manage2;}
.manage3{grid-area: Manage3;}
.manage4{grid-area: Manage4;}
.manage5{grid-area: Manage5;}
.manage6{grid-area: Manage6;}


.managing_contentBox .card{
    max-width: 200px;
    width: auto;}
.managing_contentBox .card .title{font-size: 17px; color: black;}
.managing_contentBox .card .section-image{height: 130px;}

.managing_detail{
    grid-area: Managing_detail;
    background: url(/images/background_image4.jpg); 
    background-size:cover;
    border-radius: 10px;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 10% 1fr 10%;
    grid-template-columns: 10% 1fr 10%;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
        grid-template-areas: 
        ". Managing_detail1 ."
        ". Managing_detail2 ."
        ". Managing_detail3 ."
        ". Managing_detail4 ."
        ". Managing_detail5 ."
        ". Managing_detail6 .";
}
.managing_detail a{text-decoration: none;}

.managing_detail1{grid-area: Managing_detail1; margin-top: 80px;}
.managing_detail2{grid-area: Managing_detail2;}
.managing_detail3{grid-area: Managing_detail3;}
.managing_detail4{grid-area: Managing_detail4;}
.managing_detail5{grid-area: Managing_detail5;}
.managing_detail6{grid-area: Managing_detail6;}

/*-------------------------------------------------------------------*/
/*responsiveness*/
/*-------------------------------------------------------------------*/
    /*smartphone*/
    @media screen and (max-width: 678px){
        .managing_contentBox{display: none;}
        
      }
    
       /*Tablet*/
     @media screen and (min-width:679px) and (max-width:820px){
        .managing_contentBox{
            justify-content: center;
            grid-template-columns: 1fr 1fr 1fr;
            grid-template-areas: 
        " Manage1 Manage2 Manage3 "
        " Manage4 Manage5 Manage6 ";
        }
        .head{display: none;}
        .managing_contentBox .card{margin-top: 10px;}
        .managing_contentBox .card .title{font-size: 14px; color: black;}
        .managing_contentBox .card .section-image{height: 100px;}
     }
      /*PC*/
     @media screen and (min-width:821px) and (max-width:1405px){
        
     }



/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/* Portal*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/


.portal_container{
    -ms-grid-row: 8;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-area: login;
    background: url(/images/background_image.jpg); 
    background-size:cover;
    border-radius: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    
}

.form_container{
    height: 620px;
    width: 40%;
    margin-top: 80px;
    margin-bottom: 80px;
    border-radius: 10px;
    background-color: white;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.portal_button_container{
    margin-top: 10px;
}
.portal_button{
    cursor: pointer;
    background: transparent;
    margin: 10px;
}
.button_active{background: rgb(113, 114, 116);}

form{
    width: 80%;
    height: 70%;
    padding: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-pack: distribute;
        justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
form.h1{margin: 50px;}




/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/* Footer*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/

.botbar{
    grid-area: botbar;
    display: grid;
    grid-template-columns: 25% 25% 50%;
    margin-top: 40px; 
}
.botbar h4{
    color: black;
}
.botbar-item{
    line-height: 30px;  
    padding-right: 25px;
}
.botbar-item a{margin-left: 0px; font-weight: normal;}

.socialmedia{
    display: flex;
    justify-content: space-evenly;
    max-height: 30px;
    height: 30px;
}

/*Design the Elements in botbar*/
.adress{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack:justify;
        -ms-flex-pack:justify;
            justify-content:left;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.adress-image{
    height: 20px;
    width: 20px;
    margin-right: 30px;
}


.contact_form_container{
    height: 450px;
    width: 100%;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    overflow: hidden;
}
form{
    width: 100%;
    height: 70%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}



.input-container{
    width: 100%;
    display: grid;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    grid-template-areas: 
        "name name"
        "tel email"
        "reason reason";
}

input{
    height: 10px;
    width: auto;
    padding: 15px;
    margin: 5px;
    -webkit-box-shadow: 0px 10px 5px #919ca0;
            box-shadow: 0px 10px 5px #919ca0;
}
input:hover{background-color: #c2d0d4;}
.pswrecovery{
    text-decoration: none;
    font-weight: normal;
}




textarea{
    width: auto;
    padding: 15px;
    margin: 5px;
    -webkit-box-shadow: 0px 10px 5px #919ca0;
            box-shadow: 0px 10px 5px #919ca0;
    border-width: 2px;
    border-color: black;
    margin-bottom: 20px;
    color: grey;
}
textarea:hover{background-color: #c2d0d4;}
.textbox{
    margin-top: 5px;
    margin-bottom: 5px;
    background-color: rgb(181, 182, 184);
    padding: 10px;
}

.dataprotection{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight:0,600 ;
}
.dataprotection input{
    -webkit-box-shadow: none;
            box-shadow: none;
    margin-right: 15px;
}
.dataprotection a{
    font-weight: normal;
    margin: 0%;
}
.contact_button{
    min-height: 40px;
}
.name{-ms-grid-row: 1;-ms-grid-column: 2;grid-area: name;}
.email{-ms-grid-row: 2;-ms-grid-column: 1;-ms-grid-column-span: 2;grid-area: email;}
.tel{-ms-grid-row: 3;-ms-grid-column: 1;-ms-grid-column-span: 2;grid-area: tel;}
.reason{-ms-grid-row: 4;-ms-grid-column: 1;-ms-grid-column-span: 2;grid-area: reason; height: 60px;}
.psw{-ms-grid-row: 5;-ms-grid-column: 1;-ms-grid-column-span: 2;grid-area: psw;}
.pswrep{grid-area: pswrep;}
button{
    height: 20px;
    width: 100px;
    margin-top: 20px;
    border-radius: 10px;
    -webkit-transition: 0.25s ease;
    -o-transition: 0.25s ease;
    transition: 0.25s ease;
    background-color: rgb(113, 114, 116);
}
button:hover{-webkit-transform: translate(-2px, -2px);-ms-transform: translate(-2px, -2px);transform: translate(-2px, -2px);}

/*-------------------------------------------------------------------*/
/*responsiveness*/
/*-------------------------------------------------------------------*/
    /*smartphone*/
    @media screen and (max-width: 678px){
        .botbar{
            display: none;
        }
      }
       /*Tablet*/
     @media screen and (min-width:679px) and (max-width:820px){
        .contactdetails {display: none;}
        .botbar{
            grid-template-columns: 25% 75%;
        }}
      /*PC*/
     @media screen and (min-width:821px) and (max-width:1405px){
        
     }



.footer{
    -ms-grid-row: 5;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
    grid-area: footer;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}



/*responsiveness*/
    /*smartphone*/
    @media screen and (max-width: 678px){
        
      }
       /*Tablet*/
     @media screen and (min-width:679px) and (max-width:820px){
        
     }
      /*PC*/
     @media screen and (min-width:821px) and (max-width:1405px){
        
     }

.footer-image{height: 20px; width: auto;}
.copyright{text-align: center;}





/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/* FAQ */
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/
/*-------------------------------------------------------------------*/

.faq_container{
    grid-area: faq;
    border-radius: 10px;
    display: flex;
    margin-top: 10px;
    margin-left: 10%;
    margin-right: 10%;
    margin-bottom: 40px;
}
.faq_categories{
    list-style: none;
    position: sticky;
    align-self: flex-start;
    padding: 0%;
    flex-shrink: 0;
    top: 20px;
    width: 15%;
    text-align: center;
    background-color: rgb(186, 192, 191);
}
.faq_category{
    position: relative;
    display: block;
    text-decoration: none;
    height: 50px;
    line-height: 50px;
    font-size: larger;
    color: black;
}
.faq_items{
    width: 100%;
    height: auto;
}
.faq_group{
    list-style: none;
    width: 100% ;
}
.faq_title{
    margin-top: 20px;
    margin-bottom: 30px; 
}
.faq_item{
    margin-top: 10px;
    width: 95%;
}
.faq_item input[type=radio]{
    display: none;
}

.faq_item label{
    background: #2c97de;
    font-size: 18px;
    color: #fff;
    position: relative;
    cursor: pointer;
    display: block;
    height: 50px;
    line-height: 47px;
    padding: 0 25px 0 10px;
    border-bottom: 1px solid #e6e6e6;
}
.faq_item label::after{
    display: block;
    content: "";
   border-style: solid;
    border-width: 5px 0 5px 10px;
    border-color: transparent transparent transparent #ffffff;
    position: absolute;
    width: 0;
    height: 0;
    right: 10px;
    top: 20px;
    z-index: 10;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition:all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.faq_content{
    max-height: 0;
    height: 0;
    overflow: hidden;
   -moz-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out;
}

.text-component{
    font-size: 1.2rem;
    color: black;
    line-height: 1.5;
    background: white;
    padding: 20px 10px;
}

.faq_item input[type=radio]:checked + label:after{
    -moz-transform: rotate(90deg);
     -ms-transform: rotate(90deg);
     -o-transform: rotate(90deg);
     -webkit-transform: rotate(90deg);
     transform: rotate(90deg);
 }
  
 .faq_item input[type=radio]:checked + label + .faq_content{
     max-height: 2000px;
     height: auto;
 }
  
/*responsiveness*/
    /*smartphone*/
    @media screen and (max-width: 678px){

    }
     /*Tablet*/
   @media screen and (min-width:679px) and (max-width:820px){
      
   }
    /*PC*/
   @media screen and (min-width:821px) and (max-width:1405px){
      
   }



/*---------------------------------------------------------------------
------------------------------------------------------------------------
Legal
---------------------------------------------------------------------------
---------------------------------------------------------------------------*/





/* Datenschutz */
.datenschutz_container{
    grid-area: datenschutz;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 40px;
    
}
.datenschutz_head{
    margin-top: 60px;
    font-size: xx-large;
}
.datenschutz_section{
    line-height: 2.0;
    width: 60%;
    
}


/* Impressum */
.impressum_container{
    grid-area: impres;
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.impressum_section{
    line-height: 2.0;
    width: 60%;
}