@charset "UTF-8";
@media screen{
    
    #navigation table td:nth-child(3){
            background-color:#009fe3;
        }
    #navigation table td:nth-child(1){
        background-color:#163e81;
    }
    #menueResponsive ul li:nth-child(3){
        background-color:#009fe3;
    }
    #menueResponsive ul li:nth-child(1){
        background-color:#a1acbb;
    }
    
.nav-item{
    display: inline-block;
    padding:0px;
    height: 220px;
    margin: 0;
}
    
    
    #kreis1:hover{
        background-color:#009fe3;
    }


.handy{
        display:none;
    }


    #content{
        width: 960px;
        margin: 0px auto;
    }
    #banner img{
        width:960px;
    }
    #rechteck{
        width:960px;
        height:35px;
        background-color: #009fe3;
        margin-top: 40px;
    }
    #rechteck p{
        margin-left:35px;
        text-align: left;
        color: #ffffff;
        padding-top: 7px;
        font-size: 16px;
    }
    .blauer_balken{
        margin-top:30px;
        background-color:#009fe3;
        width: 159px;
        height: 15px;
        transition: transform 0.5s ease-in;
    }
    .black:checked ~ .blauer_balken {
        transform: translateX(0);
    }
    .red:checked ~ .blauer_balken {
        transform: translateX(200.25px);
    }
    .yellow:checked ~ .blauer_balken {
        transform: translateX(400.5px);
    }
    .orange:checked ~ .blauer_balken {
        transform: translateX(600.75px);
    }
    .purple:checked ~ .blauer_balken {
        transform: translateX(804px);
    }
    .wrap{
        position: relative;
    }


    #kreis1{
        width:159px;
        height:159px;
        border-radius:159px;
        background-color: #009fe3;
        margin-top:35px;
        float: left;
    }


    #kreis1 p{
        color:#ffffff;
        text-align: center;
        padding-top: 70px;
        font-style: normal;
        font-size: 14px;
    }


    #kreis2{
        width:159px;
        height:159px;
        border-radius:159px;
        background-color: #163e81;
        margin-top:35px;
        margin-left:41.25px;
        float: left;
    }
    #kreis2 p{
        color:#ffffff;
        text-align: center;
        padding-top: 70px;
        font-style: normal;
        font-size: 14px;
    }
    #kreis3{
        width:159px;
        height:159px;
        border-radius:159px;
        background-color: #163e81;
        margin-top:35px;
        margin-left:41.25px;
        float: left;
    }
    #kreis3 p{
        color:#ffffff;
        text-align: center;
        padding-top: 70px;
        font-style: normal;
        font-size: 14px;
    }
    #kreis4{
        width:159px;
        height:159px;
        border-radius:159px;
        background-color: #163e81;
        margin-top:35px;
        margin-left:41.25px;
        float: left;
    }
    #kreis4 p{
        color:#ffffff;
        text-align: center;
        padding-top: 70px;
        font-style: normal;
        font-size: 14px;
    }
    #kreis5{
        width:159px;
        height:159px;
        border-radius:159px;
        background-color: #163e81;
        margin-top:35px;
        margin-left:41.25px;
        float: left;
    }
    #kreis5 p{
        color:#ffffff;
        text-align: center;
        padding-top: 50px;
        font-style: normal;
    }
    .boxes{
        position: relative;
        width: 960px;
        height: 420px;
        margin-top: 0px;
        overflow: hidden;
        border-width: 1px;
        border-style: solid;
        border-color: #000;
    }
    .boxes p{
        padding-top: 25px;
        padding-right: 30px;
        padding-left: 30px;
        padding-bottom: 25px;
        font-size: 14px;
    }
    .box{
        width: 960px;
        height: 420px;
        float: left;
    }
    .boxes table{
        padding-left: 15px;
        text-align: left;
    }
    .slides {
        width: 4800px;
        height:420px;
        transition: transform 0.75s ease-in;
    }
    .box.black {background-color: white;}
    .box.red {background-color: white;}
    .box.yellow {background-color: white;}
    .box.orange {background-color: white;}
    .box.purple {background-color: white;}
    .black:checked ~ .boxes > .slides {
        transform: translateX(0);
    }
    .red:checked ~ .boxes > .slides {
        transform: translateX(-960px);
    }
    .yellow:checked ~ .boxes > .slides {
        transform: translateX(-1920px);
    }
    .orange:checked ~ .boxes > .slides {
        transform: translateX(-2880px);
    }
    .purple:checked ~ .boxes > .slides {
        transform: translateX(-3840px);
    }
    .labels {margin-top:0px;}
    .rnav{display: none;}
    #pdf_icon img{
        padding-top: 30px;
        float: left;
        height: 65px;
        margin-left: 30px;
    }
    #pdf_icon p{
        text-align: left;
        color: #163e81;
        float: left;
        padding-left: 10px;
        padding-top: 57px;
        font-style: normal;
        margin-bottom: 60px;
    }

   body {
        background-image: url(Flugzeug.png);
        background-size: 300px;
        background-repeat: no-repeat;
        background-position: 85% 10px;
        background-color:#fff;
    }
}

@media (max-width: 1400px){

    body{
        background-size: 200px;
        background-position: 90% 20px;
    }
}
@media (max-width: 980px){
    body {
        background-image: none;
        
    }

    #content{
        width:100%;
    }
    #banner img{
        width: 100%;
    }
    #rechteck{
        width: 100%;
        margin-top: 0px;
    }
    #rechteck p{
        margin-left:35px;
        text-align: left;
        color: #ffffff;
        padding-top: 7px;
        font-size: 16px;
    }
    .box{
        width: 724px;
        height: 510px;
    }
    .boxes{
        width: 724px;
        height: 510px;
    }
    .slides {
        width: 3620px;
        height: 510px;
    }
    .black:checked ~ .boxes > .slides {
        transform: translateX(0);
    }
    .red:checked ~ .boxes > .slides {
        transform: translateX(-724px);
    }
    .yellow:checked ~ .boxes > .slides {
        transform: translateX(-1448px);
    }
    .orange:checked ~ .boxes > .slides {
        transform: translateX(-2172px);
    }
    .purple:checked ~ .boxes > .slides {
        transform: translateX(-2896px);
    }
    
    #kreis1{
        width:120px;
        height:120px;
        border-radius:120px;
        margin-top:50px;

    }
    #kreis1 p{
        padding-top: 50px;
        font-size:14px;
    }
    #kreis2{
        width:120px;
        height:120px;
        border-radius:120px;
        margin-top:50px;
        margin-left:31px;
    }
    #kreis2 p{
        padding-top: 50px;
        font-size:14px;
    }
    #kreis3{
        width:120px;
        height:120px;
        border-radius:120px;
        margin-top:50px;
        margin-left:31px;
    }
    #kreis3 p{
        padding-top: 50px;
        font-size:14px;
    }
    #kreis4{
        width:120px;
        height:120px;
        border-radius:120px;
        margin-top:50px;
        margin-left:31px;
    }
    #kreis4 p{
        padding-top: 50px;
        font-size:14px;
    }
    #kreis5{
        width:120px;
        height:120px;
        border-radius:120px;
        margin-top:50px;
        margin-left:31px;
    }
    #kreis5 p{
        padding-top: 30px;
        font-size:14px;
    }
    .blauer_balken{
        width: 140px;
    }
    .black:checked ~ .blauer_balken {
        transform: translateX(0);
    }
    .red:checked ~ .blauer_balken {
        transform: translateX(140px);
    }
    .yellow:checked ~ .blauer_balken {
        transform: translateX(292px);
    }
    .orange:checked ~ .blauer_balken {
        transform: translateX(445px);
    }
    .purple:checked ~ .blauer_balken {
        transform: translateX(586px);
    }
    .wrap{
  
        margin-left:5%;
        
    }
    #pdf_icon{
        margin-left:3%;
    }

}




@media (max-width: 798px){
    .pc{
        display:none;
    }

    .tablet{
        display: none;
    }
    .handy{
        display:block;
    }
    #banner img{
        width: 100%;
    }
    #rechteck{
        width: 100%;
        height: 100%;
        min-height: 40px;
    }
    #rechteck p{
        font-size: 14px;
        padding-bottom:10px;
        margin-left: 20px;
        padding-top: 10px;
    }
    .accordion{
        max-width:768px;
        width: 100%;
    }
    .kreisbereich{
        max-width:768px;
        width: 100%;
        height:160px;
    }
    .kreis1{
        width:159px;
        height: 159px;
        border-radius:159px;
        background-color: #163e81;
        margin-left: 35%;
        margin-top: 5%;
    }
    .kreis1 p{
        color:#ffffff;
        text-align: center;
        padding-top: 70px;
        font-style: normal;
        font-size: 12px;
    }
    .conkreis {
        display:none;
    }
    .conkreis p{
        margin-top: 5%;
        margin-left: 20px;
        margin-right: 20px;
        text-align: left;
        margin-bottom: 5%;
        font-size: 12px;
    }
    .conkreis p b{
        font-size: 12px;
    }
    .conkreis table td{
        font-size: 12px;
    }
    .kreis2{
        width:159px;
        height: 159px;
        border-radius:159px;
        background-color: #163e81;
        margin-left: 35%;
        margin-top: 5%;
    }
    .kreis2 p{
        color:#ffffff;
        text-align: center;
        padding-top: 70px;
        font-style: normal;
        font-size: 12px;
    }
    .kreis3{
        width:159px;
        height: 159px;
        border-radius:159px;
        background-color: #163e81;
        margin-left: 35%;
        margin-top: 5%;
    }
    .kreis3 p{
        color:#ffffff;
        text-align: center;
        padding-top: 50px;
        font-style: normal;
        font-size: 12px;
    }

    #pdf_icon a{
        color: #163e81;
        width: 100%;
        font-size: 12px;
    }
    #pdf_icon img{
        padding-top: 5%;
        float: left;
        margin-left: 15%;
        height: 55px;
        margin-bottom: 20%;
        
    }
    #pdf_icon  p{
        text-align: left;
        color: #163e81;
        float: left;
        padding-left: 5%;
        padding-top: 20%;
        font-style: normal;
        margin-bottom:20%;
        font-size: 12px;
    }
    #pdf_icon table td p a u{
        font-size:12px;
    }
}


@media (max-width: 480px){
        .accordion{
        max-width:610px;
        width: 100%;
    }
    .kreisbereich{
        max-width:610px;
        width: 100%;
        height:140px;
    }
     .kreis1{
        width:140px;
        height: 140px;
        border-radius:140px;
        background-color: #163e81;
        margin-left: 30%;
        margin-top: 5%;
    }
    .kreis1 p{
        color:#ffffff;
        text-align: center;
        padding-top: 60px;
        font-style: normal;
        font-size: 12px;
    }
    .conkreis {
        display:none;
    }
    .conkreis p{
        margin-top: 2%;
        margin-left: 20px;
        margin-right: 20px;
        text-align: left;
        margin-bottom: 2%;
        font-size: 12px;
    }
    .conkreis table td{
        font-size: 12px;
    }
    .kreis2{
        width:140px;
        height: 140px;
        border-radius:140px;
        background-color: #163e81;
        margin-left: 30%;

    }
    .kreis2 p{
        color:#ffffff;
        text-align: center;
        padding-top: 60px;
        font-style: normal;
        font-size: 12px;
    }
    .kreis3{
        width:140px;
        height: 140px;
        border-radius:140px;
        background-color: #163e81;
        margin-left: 30%;
        margin-top: 5%;
    }
    .kreis3 p{
        color:#ffffff;
        text-align: center;
        padding-top: 40px;
        font-style: normal;
        font-size: 12px;
    }
     .conkreis p b{
        font-size: 12px;
    }



}
