/* ----- EXPERT SECTION -----*/
 .expert-box {
     padding: 15% 0;
     text-align: center;
}
 .expert-item {
     position: relative;
     padding: 5px 5px 5px 5px;
     width: 33%;
     text-align: center;
     display: inline-block;
     vertical-align: top;
}
 .expert-item .ex-inner {
     background-color: white;
     padding: 160px 5px 35px 5px;
}
 .expert-item img.profile {
     position: absolute;
     top: -120px;
     left: 10%;
     right: 10%;
     width: 65%;
     margin: 0 auto;
}
 .expert-item h2{
     font-size: 22px;
     font-weight: 400;
}
 .expert-item ul li{
     text-transform: uppercase;
     text-align: left;
}
 .expert-item ul li::before{
     color: #41687e !important;
}
 .expert-item p{
     font-size: 18px;
     text-transform: uppercase;
}
 .expert-item h2, .expert-item span, .expert-item p, .expert-item .ex-inner a, .expert-item ul li{
     color: #41687e !important;
     text-decoration: none !important;
}
 @media screen and (min-width: 1101px){
     .expert-item .ex-inner {
         min-height: 650px;
    }
}
 @media screen and (max-width: 1100px){
     .expert-item {
         width: 100%;
    }
     .expert-item img.profile {
         width: 180px;
         top: -30px;
    }
}
/* ----- NEU Grundelemente -----*/
 body{
     background: #ffffff;
     margin:0;
     padding:0;
     text-decoration: none;
     list-style: none;
     font-family: 'Raleway', sans-serif !important;
     font-style: normal;
     font-weight: lighter;
     font-size:18px;
     width:100vw;
     color:#5c6267;
     -webkit-font-smoothing: auto !important;
     overflow-x: hidden;
}
 p, a, span{
     font-size:18px !important;
}
 ::selection {
    background: #4c4c4c;
     color: #ffffff;
}
 ::-moz-selection {
    background: #4c4c4c;
     color: #ffffff;
}
 a:link, .moreLink{
     color:#ffffff !important;
     font-weight: bold;
     text-decoration: underline !important;
}
 #dotContainer a:link{
     text-decoration: none !important;
}
 .popUp-content h1 {
     background: none !important;
}
 .container{
     width:80% !important;
     margin: 0 auto;
     padding-left: 25px !important;
}
 .smallContainer{
     z-index:999;
     text-align:left;
}
 .sliderContainer{
     width:500px !important;
     margin: 0 auto;
}
 .clearfix{
     clear:both;
}
 h1, .popUpContainer .popUp-content h1 {
     color: #3369ae !important;
     font-weight: lighter !important;
     text-transform: uppercase !important;
     text-align: center !important;
     font-size:38px !important;
     margin-bottom: 0px !important;
     -webkit-font-smoothing: antialiased;
     letter-spacing: -3px !important;
}
 .popUpContainer .popUp-content h1 {
     width:100% !important;
}
 .h2, h2 {
     font-size: 22px !important;
     text-align: left !important;
     color: #ffffff !important;
     text-transform: uppercase !important;
     display: inline-block;
     font-weight: lighter !important;
}
/* ----- Cookies -----*/
 #popupDiv {
     display: none;
     background:#383838 !important;
     opacity: 0.9;
     color: #ffffff !important;
     position: fixed;
     bottom: 0;
     width:100%;
     font-size:18px;
     line-height: 44px;
     box-sizing:border-box;
     float:left;
     display: inline-block;
     padding: 0 0 0 10px;
     z-index: 99999999;
}
 #popupDiv #close{
     color:#ffffff !important;
     background-color:rgba(51, 105, 174, 1);
     padding: 0px 10px;
     float:right;
     display: inline-block;
     text-align: center;
     text-transform: capitalize;
     text-decoration: none !important;
}
 #popupDiv a{
     color:rgba(51, 105, 174, 1) !important;
     text-decoration: none;
}
 @media screen and (max-width: 768px){
     #popupDiv span {
         width: 70%;
         max-width: 70%;
         float: left;
         line-height: 12px;
         padding: 10px;
         box-sizing: border-box;
         font-size:12px;
    }
}
/* ----- */
 .contactInformation{
     padding: 40px 20px;
     font-size: 24px;
     line-height: 27px;
     box-sizing: border-box;
}
 .contactInformation a{
     color: #ffffff !important;
}
 .contactInformation a:hover{
     color: #337ab7 !important;
     text-decoration: underline !important;
}
 #impressumPopUp h2{
     margin-top:50px;
}
 #cookiesHinweis a.popUpBtn{
     font-weight: bold !important;
}
 .textSmall{
     font-size:18px;
     line-height: 20px;
     padding: 0 60px;
     color:#ffffff;
}
 .popUp-content{
     color:#4c4c4c !important;
     font-size: 18px !important;
}
 .generalTextLeft h1, .generalTextRight h1, .generalText2 h1{
     text-align: left !important;
     color: #ffffff !important;
     text-transform: uppercase;
     font-size: 40px !important;
     line-height: 45px;
     margin: 2px !important;
     background: #383838;
     padding: 5px !important;
     display: block !important;
     box-sizing: border-box;
     float: left;
}
/* ----- TopLine -----*/
 #topline{
     background: rgba(92, 98, 103, 0.8);
     padding: 6px 20px;
}
 .toplineText{
     color:#ffffff;
     font-size:12px;
     text-align:center;
     padding: 3px 0;
}
 .callText{
     display: block;
     font-weight: 300;
}
 .callText b{
     font-weight: 600;
}
 .callTextMobil{
     display: none;
}
/* ----- Navigation + Logo -----*/
 #navigation{
     background:#ffffff;
     width:100%;
     display:block;
     float:left;
     position: relative;
     padding: 10px;
     box-sizing: border-box;
}
 #menu{
     float:left;
     display: inline;
     margin-top: 30px;
}
 .logo{
     float: right;
     display: inline;
}
 .logoSDT{
     display: block;
     width: 300px;
     padding: 20px;
}
 .logoMobile{
     display: none;
}
 .affix {
     top: 0;
     width: 100%;
}
 .affix + .container-fluid {
     padding-top: 70px;
}
 .navbar{
     z-index:9999 !important;
     margin-bottom:0 !important;
     padding: 0px 20px !important;
     box-sizing: border-box !important;
}
 .navbar-inverse{
     background-color: rgba(255,255,255, 0.15)!important;
     border-color:transparent !important;
     border-radius: 0 !important;
     z-index: 999;
}
 .container-fluid{
     padding: 0 !important;
}
/* ----- Header Image -----*/
 .headerImage{
     width:100vw;
     background-image: url(../images/header2.jpg);
     background-attachment: fixed;
     background-position: left;
     background-repeat: no-repeat;
     background-size: cover;
     min-height: 100vw;
}
 .generalTextLeft{
     padding: 15% 0;
     text-align: left !important;
     color: #ffffff !important;
     width: 100%;
     line-height: 29px;
     font-size: 22px;
}
 .generalTextRight{
     padding: 15% 0;
     text-align: right !important;
     color: #ffffff !important;
     width: 100%;
     line-height: 30px;
     font-size: 27px;
     width: 50%;
     float: right;
}
 .generalText2 h1{
     text-align: center !important;
     color: #ffffff !important;
     text-transform: uppercase;
     font-size: 40px !important;
     padding-bottom: 20px;
}
 .generalText2{
     padding: 15% 0 0;
     text-align: center !important;
     color: #e6e6e6 !important;
     width: 80%;
     margin: 0 auto;
     line-height: 36px;
     font-size: 30px;
}
 .text{
     padding-bottom:40px;
}
 .generalTextLeft p{
     width:50%;
     padding: 20px 0;
     box-sizing: border-box;
}
 .generalTextRight p{
     text-align: left !important;
     float: left;
     padding: 10px 0px 10px;
     box-sizing: border-box;
     display: block;
}
 .generalTextLeft h1{
     text-align: left !important;
     color: #ffffff !important;
     text-transform: uppercase;
     font-size: 40px !important;
     line-height: 50px;
     padding-bottom: 20px;
}
 .generalTextRight h1{
     text-align: left !important;
     color: #ffffff !important;
     text-transform: uppercase;
     font-size: 40px !important;
     line-height: 45px;
     padding-bottom: 20px;
}
 .moreList{
     color:#ffffff !important;
     font-size: 18px;
     display: inline;
     padding:16px 60px;
     background:url("../images/pfeil.png");
     background-repeat: no-repeat;
     height:44px;
     width:45px;
}
 .moreLink{
     color: #ffffff;
     font-weight: 600 !important;
     display: block;
     font-size: 12px;
     text-transform: uppercase;
     margin-top: 5px;
     text-decoration: underline !important;
}
 .moreLink:hover{
     color:#337ab7 !important;
     text-decoration: underline !important;
}
 .moreLink h2{
     padding-right:10px;
}
 #listText{
     color:#ffffff;
    ;
     font-weight: 400;
     font-size:12px;
}
 #listText:hover{
     color:#cccccc !important;
}
 .headerImage{
     position: relative;
     z-index: 0;
}
 .sidenav {
     height: 100%;
     width: 0;
     position: fixed;
     z-index: 1;
     top: 0;
     left: 0;
     background-color: #404345;
     overflow-x: hidden;
     transition: 0.5s;
     padding-top: 60px;
}
 .sidenav a {
     padding: 8px 8px 8px 32px;
     text-decoration: none;
     font-size: 18px;
     text-transform:uppercase;
     color: #ffffff;
     display: block;
     transition: 0.3s;
}
 .sidenav a:hover, .offcanvas a:focus{
     color: #4c4c4c !important;
     text-decoration: none !important;
     cursor:pointer;
}
 .sidenav .closebtn {
     position: absolute;
     top: 0;
     right: 25px;
     font-size: 36px;
}
 p {
     margin: 0px;
}
 #main {
     transition: margin-left .5s;
     padding: 16px;
     display: inline;
     position: relative;
     top:15px;
}
/* ----- To Top -----*/
 #myBtn {
     display: none;
     position: fixed;
     bottom: 55px;
     right: 10px;
     z-index: 99;
     border: none;
     outline: none;
     background-color: rgba(51, 105, 174, 0.8);
     color: white;
     cursor: pointer;
     padding: 13px 15px;
     cursor:pointer;
}
 #myBtn:hover {
     cursor:pointer;
}
 .window{
     background-color:#3369ae;
}
 .window img{
     padding-right: 15px;
}
/* ----- Main Content -----*/
 #areaElement {
     position: relative;
     padding-bottom: 50px;
     text-align: center;
     z-index: 2;
}
 #sectionHead{
     position: relative;
     top: -32px;
     text-align: center;
}
/* ----- Around Elements -----*/
 .turn-wrapper {
     perspective: 1000;
     max-width: 23%;
     height: auto;
     display: inline-block;
}
 .turn-wrapper:hover {
     cursor: pointer;
     opacity:0.5;
}
 .front {
     z-index: 2;
     color:#ffffff;
}
 .front span{
     color:#ffffff;
     text-transform: uppercase;
     padding: 10px 0;
     font-weight: 300;
     font-size: 12px;
}
 a:focus, a:hover{
     text-decoration: none !important;
     cursor: pointer;
     color:#4c4c4c !important;
}
 .areas{
     display: block;
     margin:-80px 0 0 0;
}
 .front span:hover{
     font-size:16px;
     cursor: pointer;
}
 #aroundElement {
     padding:20px 0;
}
/* ----- Image Mobil-----*/
 .mobileHeader{
     display:none;
}
 .elementMobil{
     display: none;
}
 .element{
     display: block;
}
/* ----- Company-----*/
 #company{
     width:100vw;
     background-image: url(../images/header3.jpg);
     background-attachment: fixed;
     background-position: right;
     background-repeat: no-repeat;
     background-size: cover;
     min-height: 100vw;
}
 .companyText {
     color: #6c7078;
     text-align: center;
     padding:50px 20%;
}
 .companyText p{
     margin:0;
}
 #company .container{
     min-height: 100vw;
}
 .historie{
     max-width:100%;
     height:auto;
     display:block;
}
 .historie2{
     display:none;
}
/* ----- Benefits-----*/
 #benefits{
     width:100vw;
     background-image: url(../images/header4.jpg);
     background-attachment: fixed;
     background-position: left;
     background-repeat: no-repeat;
     background-size: cover;
     min-height: 100vw;
}
 #benefits .container{
     min-height: 100vw;
}
 #benefits h2{
     font-weight: 400 !important;
}
 #benefits ul li{
     font-size: 18px;
     line-height: 18px;
     color: white;
     list-style: disc;
     line-height: 1.42857143;
}
 #benefits p{
     color: white;
}
 .zweispaltig{
     width: 37vw;
     padding-top: 140px;
     float: left;
     padding-right: 30px;
     max-width: 530px;
}
 .zweispaltig h1{
     text-align: left !important;
     color: #ffffff !important;
     text-transform: uppercase;
     font-size: 40px !important;
     line-height: 45px;
     margin: 2px !important;
     background: #383838;
     padding: 5px !important;
     display: block !important;
     box-sizing: border-box;
     float: left;
}
 #benefits ul li::before {
     color: white ;
     content: none;
}
 #benefits ul{
     display: inline-block;
     padding-left: 0px;
}
/* ----- Slider-----*/
 .carousel-control.right, .carousel-control.left {
     background-image: none !important;
}
 .glyphicon-chevron-right:before {
     content: "\232a" !important;
     font-size: 40px;
}
 .glyphicon-chevron-left:before {
     content: "\2329" !important;
     font-size: 40px;
}
 .carousel-control{
     color: #6c7078 !important;
     text-shadow:none !important;
}
 .glyphicon-chevron-right{
     right:100% !important;
}
 .glyphicon-chevron-left{
     left:100% !important;
}
 .carousel-indicators li{
     background-color:#cccccc !important;
     width:50px !important;
     height:1px !important;
     border:0 !important;
     margin:0px !important;
}
 .carousel-indicators .active{
     background-color:#3369ae !important;
     width:50px !important;
     height:1px !important;
     margin:0px !important;
     border:0 !important;
}
 .carousel-indicators {
     top: 280px !important;
     bottom:0 !important;
}
 .carousel-control {
     width: 5% !important;
}
 .sliderDescription p{
     color:#ffffff !important;
     text-align:center !important;
     font-weight:400;
     font-size:18px;
     padding:0;
}
 .benefitsDescription li{
     list-style-image: url(../images/li.png);
     padding-bottom:8px;
}
 .benefitsDescription{
     background: #e6e6e6;
     display: inline-block;
     width: 100%;
}
 .leftList, .rightList {
     width: 50%;
     display: inline;
     float: left;
     padding: 25px 15px;
}
 .leftList{
     border-right: 1px solid #ffffff;
}
 .accordion {
     cursor: pointer;
     width: 100%;
     outline: none;
     transition: 0.4s;
     border: none;
     padding: 0 !important;
     display: inline-block;
     float: left;
     background-color: #e6e6e6;
     border: none;
}
 button.accordion::after{
     margin:0 !important;
     padding: 16px 25px 16px 0;
     color: #5c6267 !important;
}
 li{
     padding-bottom:2px;
     list-style: none;
}
 li::before{
     color: #cccccc;
     content: "- ";
     padding: 0 10px 0 0;
}
 .panelText {
     text-transform: uppercase;
     font-size: 18px;
     text-align: left;
     color: #5c6267;
     padding: 20px 25px;
     background-color: transparent;
     display: inline-block;
     height: 58px;
     box-sizing: border-box;
     float: left;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
     max-width: 100%;
}
 .sectionPanel {
     width: 100%;
     float: right;
     display: block;
     text-align: left;
     padding-right: 20px;
}
 .panel{
     border-radius: 0 !important;
     background: transparent !important;
     float: right;
     width: 100%;
     padding: 5px;
     display: block;
     text-align: left;
     font-size: 18px;
     box-shadow: none !important;
     margin-bottom: 0 !important;
}
/* ----- Experts-----*/
 #aboutExperts{
     background-image: url(../images/header5.jpg);
     background-attachment: fixed;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     min-height: 100vw;
     width:100vw;
}
 #aboutExperts #areaElement {
     top: -34px;
}
 #aboutExperts h1{
     color:#ffffff !important;
}
 #aboutExperts .container {
     padding-bottom: 30px;
}
/* ----- Contact-----*/
 #contact{
     background-image: url(../images/header6.jpg);
     background-attachment: fixed;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     min-height: 100vw;
     width:100vw;
     -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.2);
     -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.2);
     box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.2);
}
 .form {
     font-size: 18px;
}
 .leftForm{
     float:left;
     width:50%;
     padding-right: 20px;
     box-sizing: border-box;
     color:#ffffff;
}
 .rightForm{
     float:left;
     width:50%;
     padding-left: 20px;
     box-sizing: border-box;
}
 .buttonForm{
     width:100%;
     text-align: center;
}
 #contact input[type="text100"], #contact textarea{
     width:100%;
     color: #4c4c4c;
}
 #contact input[type="text48L"]{
     width:48%;
     display: inline-block;
     color: #4c4c4c;
     float: left;
     display: inline-block;
}
 #contact input[type="text48R"]{
     width:48%;
     display: inline-block;
     color: #4c4c4c;
     float: right;
     display: inline-block;
}
 .datenschutz{
     color:#ffffff;
     text-align: center;
     float:left;
     width:100%;
     display:block;
     padding: 20px 20px 10px 20px;
     box-sizing: border-box;
}
 #contact textarea{
     height:210px;
     border: 1px solid #cccccc;
}
 #contact input[type="radio"]{
     width:35px;
     margin-bottom: 15px !important;
     border:none;
}
 #contact button, input, select, textarea {
     margin: 5px 0 !important;
     padding: 5px 10px !important;
     border: 1px solid #cccccc;
}
 #contact button{
     color: #ffffff !important;
     background-color: #3369ae;
     border: none;
     width: 200px;
     margin: 40px 0 20px !important;
     padding: 10px 10px 6px 10px !important;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
     max-width: 200px;
     text-transform: uppercase;
}
 #contact button:hover{
     background-color: #5c6267 !important;
}
 .iFrame {
     margin-bottom: -7px;
}
/* ----- Footer-----*/
 #footerText{
     width: 100%;
     height: auto;
     /*
     display: none;
     position:fixed;
     */
     bottom:0;
     padding: 5px 20px;
     margin: 0;
     box-sizing: border-box;
}
 #footerText a, #footerText span{
     font-size: 12px;
     display: inline;
}
 #footerText, #topline{
     background-color: rgba(255, 255, 255, 1)
}
 .toplineText, #footerText, #footerText a, #footerText span{
     color:#877f7a;
}
 #footerText span.left {
     text-align: left;
     position: relative;
     left:0;
     display: inline;
     font-weight: 400;
}
 #footerText span.right{
     text-align: right;
     position: relative;
     right:0;
     display: inline;
     float: right;
     padding-top: 3px;
     font-weight: 400;
}
 #footerText .right a{
     padding: 0 5px;
}
 #footerText .container{
     padding-left:0px !important;
     padding-right:0px !important;
}
/* --------------- Impressum---------------*/
/* The Modal (background) */
 .popUpContainer {
     display: none;
    /* Hidden by default */
     position: fixed;
    /* Stay in place */
     z-index: 2000;
    /* Sit on top */
     padding-top: 100px;
    /* Location of the box */
     left: 0;
     top: 0;
     width: 100%;
    /* Full width */
     height: 100%;
    /* Full height */
     overflow: auto;
    /* Enable scroll if needed */
     background-color: rgb(0,0,0);
    /* Fallback color */
     background-color: rgba(0,0,0,0.4);
    /* Black w/ opacity */
     z-index: 100000000;
}
/* Modal Content */
 .popUp-content {
     background-color: #fefefe;
     margin: auto;
     padding: 8%;
     border: 1px solid #888;
     width: 80%;
     position: relative;
     line-height:22px;
}
 .popUp-content p{
     margin:10px 0;
}
 .popUp-content h2, .popUp-content a{
     color:#4c4c4c !important;
}
/* The Close Button */
 .closePopUp {
     color: #5c6267;
     float: right;
    /*background-color: #0087c1;
    */
     font-size: 40px;
     font-weight: bold;
     padding: 5px 10px;
}
 .closePopUp:hover{
     color: #3369ae;
     cursor: pointer;
}
 .closePopUp:focus {
     text-decoration: none;
     cursor: pointer;
}
 #impressumBtn{
     color:#0087c1;
     cursor: pointer;
}
/* --------------- Media Queries---------------*/
 @media screen and (min-width: 1600px){
     .container{
         width:1200px !important;
    }
}
 @media screen and (min-width: 1200px){
     .slideButton, .glyphicon-chevron-right:before,.glyphicon-chevron-left:before {
         font-size:70px;
    }
}
 @media screen and (max-width: 1200px){
     .container{
         width:90% !important;
    }
     .generalTextRight, .generalTextRight h1, .headerImage .generalTextRight p, .smallContainer {
         text-align: left !important;
    }
     .generalTextRight p {
         text-align: left !important;
         float: left;
         padding: 10px 0px 20px;
         box-sizing: border-box;
         display: block;
         width: 100%;
    }
     #topline {
         background-color: #e6e6e6;
    }
     .navbar-inverse{
         background-color: #ffffff !important;
    }
     .toplineText, #footerText, #footerText a, #footerText span {
         color: #877f7a;
    }
     .generalTextRight, .generalTextRight h1, .headerImage .generalTextRight p, .smallContainer{
         text-align: left !important;
    }
     .generalTextRight, .generalTextLeft p{
         width:100%;
    }
     .logo img {
         width: 200px;
         height: auto;
    }
     .generalText2{
         width:100%;
    }
     #aboutExperts .container{
         padding: 0 !important;
         width: 90% !important;
    }
}
 @media screen and (max-width: 992px){
     #dso-Karte{
         min-width:auto;
         min-height: 0px;
    }
     .slideButton{
         line-height:250px !important;
    }
     .personDataDiv{
         margin: 3% 10%;
    }
     .logo img {
         width: 120px;
         height: auto;
    }
     .logoSDT{
         display: none;
    }
     .logoMobile{
         display: block;
    }
     #aboutExperts .container{
         padding-right: 10%;
         padding-left: 10%;
    }
     .listContainer {
         padding: 20px 25px;
    }
     #aboutExperts {
         padding: 40px 0 80px;
    }
     #footerText .container{
         padding-left:0px !important;
         padding-right:30px !important;
         width:100% !important;
    }
     .navbar{
         padding: 0 !important;
    }
     #aboutExperts {
         padding: 40px 0 0px;
    }
     #dso-Karte {
         color: #5c6267 !important;
    }
     .slideButton{
         top:0;
    }
     .carousel-indicators li, .carousel-indicators .active{
         width:35px !important;
    }
     #cookiesHinweis {
         width:50%;
    }
}
 @media screen and (max-width: 1100px){
     .generalTextLeft h1, .generalTextRight h1, .generalText2 h1{
         font-size: 26px !important;
         line-height: 20px !important;
         padding: 7px 2px !important;
    }
     #benefits ul{
         width: 340px;
    }
     .headerImage .generalTextRight p{
         text-align:left !important;
         width:100%;
    }
     #navbarAtTop {
         border-bottom: 1px solid #cccccc !important;
    }
    /* ----- Image Mobil-----*/
     .mobileHeader{
         display:block;
    }
     img.mobileHeaderImage {
         height: auto;
         width: 100%;
         background-size: cover;
    }
     .elementMobil{
         display: block;
    }
     .element{
         display: none;
    }
    /*------------------------------*/
     .headerImage{
         background-image: none !important;
         background-position: left;
         min-height: auto;
    }
     #aboutExperts .row {
         min-height: 350px !important;
    }
     #company{
         width:100vw;
         background-image: none;
         background-position: right;
         background: #e6e6e6;
         min-height: auto;
         border-top: 1px solid #cccccc;
         border-bottom: 1px solid #cccccc;
    }
     #benefits{
         background-image: none;
         background-position: right;
         background:#fff;
         min-height:auto;
    }
     #aboutExperts{
         background-image: none;
         background-position: center;
         background: #e6e6e6;
         min-height: auto;
         border-top: 1px solid #cccccc;
         border-bottom: 1px solid #cccccc;
    }
     #contact{
         background-image: none;
         background-position: center;
         background:#fff;
         min-height:auto;
    }
     #footerText{
         border-top: 1px solid #ccc;
         background-color:#ffffff;
    }
     #cookiesHinweis{
         width: 98%;
         left: 1%;
         right: 1%;
         margin: 0;
         box-sizing: border-box;
         background: rgba(255,255,255,0.95);
    }
     .historie{
         display:none;
    }
     .historie2{
         display:block;
    }
     .generalTextRight, .generalTextLeft {
         padding: 10% 0;
    }
     .generalTextLeft h1, .generalTextRight h1, .generalText2 h1{
         font-size:27px !important;
         text-align: center !important;
         line-height: 24px !important;
    }
     .textSmall, .generalTextLeft, .h2, h2, .generalTextRight p, .contactInformation a{
         color:#4c4c4c !important;
    }
     .generalTextLeft p, .generalTextRight, .generalText2{
         width:100%;
    }
     .generalTextLeft, .generalTextRight{
         font-size: 22px !important;
         line-height: 24px !important;
    }
     #company .container, #benefits .container{
         min-height: auto;
    }
     #benefits span, #benefits ul li, #benefits p, #benefits ul li::before {
         color: black;
    }
     #myWindowSidenav{
         display: none !important;
    }
     .turn-wrapper {
         perspective: 1000;
         max-width: 23%;
         height: auto;
         display: inline-block;
    }
     img.element, img.elementMobil {
         width: 80%;
         padding: 5px 0;
         box-sizing: border-box;
    }
     #aroundElement {
         padding: 0;
    }
     .text {
         padding-bottom: 20px;
    }
     .callText{
         display:none !important;
    }
     .callTextMobil{
         display:block !important;
    }
     .callTextMobil a, .callTextMobil a:hover{
         color:#ffffff !important;
    }
     #aboutExperts .generalText2 {
         padding: 40px 15px!important;
    }
     h1, .popUpContainer .popUp-content h1{
         letter-spacing:0px !important;
    }
     .contactInformation{
         font-size: 20px;
    }
     .sliderContainer {
         width: 300px !important;
    }
     .carousel-indicators li, .carousel-indicators .active {
         width:20px !important;
    }
     .container {
         width: 100% !important;
    }
     .companyText {
         padding: 0 25px !important;
    }
     .listContainer {
         padding: 20px 15px !important;
         margin: 60px 0 20px !important;
    }
     .leftList, .rightList {
         width: 100% !important;
         padding: 15px !important;
    }
     .leftList {
         border-bottom: 2px solid #ffffff;
         border-right:0;
    }
     #aboutExperts .container{
         padding-right: 15px;
         padding-left: 15px;
         width: 100% !important;
    }
     .personDataDiv {
         margin: 3% 15%;
    }
     #myWindowSidenav{
         display:none;
    }
     .leftForm, .rightForm{
         width:100% !important;
         padding-right: 30px !important;
         padding-left: 20px !important;
    }
     .generalText2{
         padding:35% 10px 0!important;
    }
     #contact textarea, #contact button{
         margin-top:6px !important;
    }
     #contact button{
         margin-top:10px !important;
         width:100% !important;
    }
     .sectionPanel {
         width: 100% !important;
         border: none !important;
    }
     .iFrame iframe{
         height:300px !important;
    }
     .closePopUp{
         padding:0;
    }
     .popUp-content h1{
         text-align:left !important;
    }
     .popUp-content {
         width: 85% !important;
    }
     .carousel {
         padding-bottom: 80px !important;
    }
     .sectionPanel{
         padding: 0 !important;
    }
     #footerText .container{
         padding-right:0px !important;
    }
     #footerText span{
         display:block !important;
         text-align: center !important;
         width: 100%;
    }
     h1, .popUpContainer .popUp-content h1{
         font-size:20px !important;
         text-align:left !important;
         line-height: 25px;
         font-weight: 400 !important;
    }
     .closePopUp{
         font-size:25px;
    }
     #impressumPopUp h2 {
         margin-top: 20px;
    }
     .h2, h2 {
         font-size: 22px !important;
         line-height: 20px !important;
    }
     .popUp-content {
         font-size: 13px !important;
    }
}
 @media only screen and (max-width: 768px) {
     #dotContainer{
         display: none;
    }
}
 @media screen and (max-width: 500px){
     .container{
         padding: 0 20px;
         box-sizing: border-box;
    }
     .historie2 {
         width: 80%;
    }
     .popUp-content ul {
         margin: 0;
         padding: 0;
    }
     #aboutExperts .container{
         width: 100% !important;
    }
     #benefits .container {
         padding: 0 15px;
    }
     .leftForm, .rightForm{
         padding:0 !important;
    }
     #contact .generalText2{
         padding: 40px 0 80px!important;
    }
     h1, .popUpContainer .popUp-content h1 {
         letter-spacing: -1px !important;
    }
     #contact button{
         max-width: 100% !important;
    }
     #contact .container{
         padding-bottom: 40px;
    }
     #cookiesHinweis {
         width: 98% !important;
         box-sizing: border-box !important;
         margin: 0 !important;
    }
}
 @media screen and (max-height: 450px) {
     .sidenav {
        padding-top: 15px;
    }
     .sidenav a {
        font-size: 18px;
    }
}
/* --------------- Scroll dots ---------------*/
 #dotContainer{
     width: 15px;
     position: fixed;
     right: 5px;
     top: 40%;
     color:#ffffff;
}
 #dotContainer div{
     height: 15px;
     width: 15px;
     margin: 15px 0px;
     background-color: gray;
     border: 1px solid #e7e7e7;
     border-radius: 50%;
     cursor: pointer;
     line-height: 15px;
     position: relative;
}
 #dotContainer a{
     position: absolute;
     display: block;
     width: 100px;
     right: 0px;
}
 #dotContainer span{
     position: absolute;
     top: 0px;
     right: 30px;
     white-space: nowrap;
     opacity: 0;
     pointer-events: none;
}
 #dotContainer div:hover span{
     opacity: 1;
}