.region-content-top{
  position:relative;
}
.webform-kontakt-spezialist.not-visible{
  opacity:0;
  width:0;
  height:0;
}
.webform-kontakt-spezialist.visible{
  opacity:1;
  width:90%;
  height:auto;
  background-color:var(--plaing-orange-light);
  border:1px solid var(--plaing-orange);
  border-radius:8px;
  max-width:500px;
  position:fixed;
  top:15%;
  left:calc(50% - 250px);
  margin:0 auto;
  padding:20px;
  z-index:98;
  overflow-y:auto;
}
.webform-kontakt-spezialist .close{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:right;
      -ms-flex-pack:right;
          justify-content:right;
  cursor:pointer;
  position:relative;
  z-index:999;
}
.webform-submission-kontakt-spezialisten-form input[type="text"],
.webform-submission-kontakt-spezialisten-form input[type="email"]{
  background-color:#fff;
}
.webform-submission-kontakt-spezialisten-form .nachricht-an{
  font-size:1rem;
  font-weight:600;
}
.webform-submission-kontakt-spezialisten-form .form-item-name{
  margin:2em 0 0;  
}
.webform-submission-kontakt-spezialisten-form .field--name-field-agb{
  display:flex;
}
.webform-submission-kontakt-spezialisten-form .field--name-field-agb .description{
  font-size:80%;
}
.hide{
  display:none;
}
.profile--type--expert .group-left{
  padding:0 0 0 100px;
}
.profile--type--expert .group-right{
  padding:0 0 0 60px;
}
.profile--type--expert .group-middle{
  padding:0 0 0 15px;
}
.profile--type--expert .group-bottom{
  margin:40px 0 20px;
}
.profile--type--expert .group-left .section{
	padding:0;
  margin:0 0 20px;
}
.flex-column{
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
      -ms-flex-direction:column;
          flex-direction:column;
}
h2.block-title{
  font-size:1.7rem;
  margin:0 0 20px 0;
  position:relative;
  line-height:1.5em;
  width:100%;
}
h3.block-title{
  font-size:1.4rem;
  margin:8px 0 30px 0;
  position:relative;
  line-height:1.5em;
  width:100%;
}
h4{
  font-size:1.1rem;
  margin:30px 0 5px;
  line-height:1.5em;
  width:100%;
}
h2.block-title:after,
h3.block-title:after{
  content: "";
  height: 3px;
  width: 40px;
  background-color:var(--plaing-orange);
  position: absolute;
  bottom:-3px;
  left:0;
}
.icon{
  width:85px;
  height:85px;
  border:1px solid var(--plaing-orange);
  border-radius: 5px;
  margin: 0 4px 10px 0;
  padding: 13px 5px 5px;
  text-align: center;
}
.icon img{
  max-height:65px;
  height:auto;
  width:auto;
}
/* ------------------------- Header ------------------------------ */
.spezialist-header{
  position:relative;
}
.logo{
  width: 200px;
  height:200px;
  background: white;
  border: 1px solid #eaeaea;
  padding:10px;
  position: absolute;
  bottom:15px;
  left: 85px;
  border-radius: 15px;
  display:block;
  -webkit-box-shadow: 2px 2px 2px 1px rgb(0 0 0 / 10%);
          box-shadow: 2px 2px 2px 1px rgb(0 0 0 / 10%);
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
      -ms-flex-direction:column;
          flex-direction:column;
  -webkit-box-pack:center;
      -ms-flex-pack:center;
          justify-content:center;
}
.page-node-type-referenzprojekt .logo{
  left:100px;
}
.spezialist-header .logo img{
  margin:0;
}
.spezialist-header .views-element-container .views-row{
  margin:0 15px 10px;
  padding:0 0 25px;
}
.spezialist-header .views-element-container .views-row h3,
h3.name-firma{
  margin:0 0 0 360px;
  line-height:1.25em;
}
h3.firma{
  margin:0 0 65px 375px;
  font-size:1.5rem;
  line-height:1.25em;
}
.page-node-type-referenzprojekt h3.name-firma{
  margin:0 0 65px 0;
}
hr.specialist-detail-header-hr{
  margin:0 50px 50px 50px;
  background:var(--plaing-orange-light);
  width: auto;
  color:transparent;
  border:none;
}
.node-taxonomy-container,
.node-taxonomy-container .taxonomy-terms{
  padding:0;
  margin:0;
}
.referenzen .views-wrapper{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
  padding:0 0 40px;
}
.page-node-type-referenzprojekt .referenzen .views-wrapper{
  padding:0;  
}
.referenzen .views-row{
  max-width:240px;
  padding:0 0 15px;
  border:1px solid var(--plaing-border-grey);
  border-radius:8px;
  margin:0 0 20px 0;
  -webkit-box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.15);
          box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.15);
}
.referenzen .views-crow:hover{
  border-color:var(--plaing-orange);
}
.referenzen .views-row img{
  border-radius:8px 8px 0 0;
}
.views-field-field-referenz-ort{
  background-color:rgba(47, 47, 47, 0.5);
  position:absolute;
  top:199px;
  color:#fff;
  width:100%;
  max-width:238px;
  height:40px;
  padding:5px;
  text-align:center;
}
.views-field-title{
  text-align:center;
}
.views-field-field-referenz-ort a,
.views-field-title a{
  display:block;
  width:100%;
}
.views-field-field-referenz-ort a,
.views-field-field-referenz-ort:hover a{
  color:#fff;
}
.views-col .views-field-title .field-content a{
  color:var(--bold-color);
}
.views-col:hover .views-field-title .field-content a{
  color:var(--plaing-orange);
}
.referenzen .js-pager__items{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
      flex-wrap:wrap;
  -webkit-box-pack:center;
      -ms-flex-pack:center;
          justify-content:center;
  padding:0;
  max-width:760px;
}
.referenzen nav li{
  list-style:none;
  margin:0 20px;
}
.zertifiziert img{
  margin:25px auto;
  width:180px;
}
.textlimit .short .read-more{
  padding:0 0.5em;
  cursor:pointer;
}
.textlimit .short .read-more:hover{
  color:var(--plaing-orange);
}
.textlimit .long .less{
  padding:0 0.5em;
  cursor:pointer;
  color:var(--plaing-orange);
}
.textlimit .long{
  display:none;
}
.links{
  position:absolute;
  right: 15%;
  bottom: 25%;
  width: 150px;
  height: auto;
  z-index:5;
}
.link-telefon{
  position:relative;
}
.header-link{
  margin-bottom:15px;
  cursor:pointer;
}
.header-link a {
  color: #fff;
  background-color:var(--plaing-orange);
  margin: 0;
  border: 2px solid var(--plaing-orange);
  border-radius: 5px;
  padding: 2px 5px;
  width: 150px;
  display: inline-block;
  font-weight: 900;
  font-size: 1.2em;
  font-family: 'Roboto', sans-serif;
  text-align:center;
}
.header-link:hover a {
  background-color:var(--plaing-orange-dark);
  color: #fff;
}
.flag{
  border:none;
}
.flag a{
  font-family: 'Roboto', sans-serif;
}
.spezialist-header .flag a{
  font-weight: 900;
  font-size: 1.2em;
}
.link-telefon .phone-number{
  display:none;
  opacity:0;
}
.link-telefon:hover .phone-number{
  display:block;
  opacity:1;
  -webkit-transition:opacity 0.5s linear;
  -o-transition:opacity 0.5s linear;
  transition:opacity 0.5s linear;
}
.link-telefon .phone-number{
  position:absolute;
  width:100%;
  height:30px;
  left:0;
  top:0;
  background-color:#fff;
  z-index:1;
  border:2px solid var(--plaing-orange);
  border-radius:5px;
  padding:3px 5px 0;
  color:var(--text-color);
  height:38px;
  text-align:center;
}
.back-link{
  position: absolute;
  bottom: -140px;
  left: 100px;
  z-index: 5;
}
/* ------------------------- Slider Referenzen ------------------- */

.referenzen .slick-slider .slick-arrow{
  bottom:0;
  top:inherit;
  height:15px;
}
.referenzen .slick-slider .slick-arrow:hover{
  color:var(--plaing-orange);
}
.referenzen .slick-slider .slick-arrow.slick-prev{
  left:calc(50% - 100px);
}
.referenzen .slick-slider .slick-arrow.slick-next{
  right:calc(50% - 90px);
}
.slick-dots{
  position:absolute;
  bottom:0;
  left:calc(50% - 75px);
  width:140px;
  height:15px;
  padding:0;
  text-align:center;
}
.slick-dots li{
  display:inline;
  background:none;
}
.slick-dots li button{
  padding:0;
  background:none;
  color:var(--text-color);
  font-size:1rem;
  margin:0 3px;
  padding:0 3px;
}
.slick-dots li.slick-active button{
  background:var(--plaing-orange);
  color:#ffffff;
}
.content-nav{
  margin: 0 auto 20px;
  width: 100%;
  height: auto;
  max-width:1280px;
  padding:0 0 0 calc(30% + 15px);
}

  .content-nav .link-ueber-uns{
    display:none;
  }
/* ------------------------- Referenzen -------------------------- */
.referenzen .logo{
  bottom:-50px;
}
.referenzen .group-left{
  padding:0 0 0 100px;
}
.referenzen .group-middle {
  padding: 0 0 0 15px;
}
.referenzen .content-nav{
  margin:0 0 40px;
  padding:0;
}
.ort,
.date{
  margin-bottom:20px;
}
.referenz-pictures > div{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
      flex-wrap:wrap;
  }
.referenz-pictures .field-item{
  width:250px;
  margin:0 20px 20px 0;
} 
.referenz-pictures .field-item img{
  margin:0;
  border-radius:8px;
  border:1px solid var(--plaing-border-grey);
} 
/* ------------------------- View Spezialisten -------------------------- */
.spezialisten-list .group-middle-right .button{
  cursor:pointer;
}

@media screen and (max-width:1200px){
  .referenzen .views-wrapper.slick-slider{
    max-width:600px;
  }
}
@media screen and (max-width:999px){
	.profile--type--expert .group-left{
	padding:0;
	}
	.container.main-container{
	padding:0 20px;
	}
}
@media screen and (max-width:949px){
	.profile--type--expert .group-middle{
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	    -ms-flex-direction:column;
	        flex-direction:column;
	}
	.profile--type--expert .group-right{
	padding:40px 0 0;
	}
	.profile--type--expert .group-middle-content.col-pl-60{	
	width:100%;
	}
  .referenzen .group-left{
  padding:0;
  }
}
@media screen and (max-width:767px){
  .referenzen .group-middle {
  padding: 0;
}
  .webform-kontakt-spezialist.visible{
    top:inherit;
    bottom:15%;
  }
  #ueber-uns{
    margin:40px 0 20px;
  }
  .content-nav{
    -webkit-box-ordinal-group:2;
        -ms-flex-order:1;
            order:1;
    padding:0 0 0 10px;
  }
  .content-nav ul{
    padding:0;
  }
  .content-nav .link-ueber-uns{
    display:inline-block;
  }
  .content-nav .link-referenzen{
    display:none;
  }
  hr.specialist-detail-header-hr{
    margin:50px 50px 10px 50px;
    border:none;
  }
  .page-node-type-referenzprojekt hr.specialist-detail-header-hr{
    margin:25px 50px 20px 50px;
  }
  figure.header-image img{
    min-height:250px;
    width:auto;
    -o-object-fit:cover;
       object-fit:cover;
  }
  .profile--type--expert .group-middle .group-bottom{
    -webkit-box-ordinal-group:2;
        -ms-flex-order:1;
            order:1;
  }
  .profile--type--expert .group-middle .group-middle-content{
    -webkit-box-ordinal-group:3;
        -ms-flex-order:2;
            order:2;
  }
  .profile--type--expert .group-middle .group-right{
    -webkit-box-ordinal-group:4;
        -ms-flex-order:3;
            order:3;
  }
  .profile--type--expert .group-content{
    padding:0 10px;
    -webkit-box-orient:vertical;
    -webkit-box-direction:reverse;
        -ms-flex-direction:column-reverse;
            flex-direction:column-reverse;
  }
	.profile--type--expert .group-left.col-pl-30{
	width:100%;
	max-width:inherit;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	    -ms-flex-direction:column;
	        flex-direction:column;
	}
	.profile--type--expert .group-left.col-pl-30 > .section{
	width:100%;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	}
	.profile--type--expert .group-left.col-pl-30 > .section > div{
	width:40%;
	margin:0 20px 20px 0;
	min-width:180px;
	}
	h3.block-title{
	width:100%;
	margin:8px 0 0 0;
	}
  .group-right h3.block-title{
    margin:8px 0 15px 0;
  }
	h4{
	margin:15px 0 0;
	}
  .profile--type--expert .group-left.col-pl-30 > .section .firmenadresse{
    margin-top:15px;
  }
	.zertifiziert img{
	width:120px;
	margin:0 auto;
	}
	.profile--type--expert .group-middle,
	.profile--type--expert .group-right{
	width:100%;
	padding:0;
  }
  .spezialist-header .views-element-container .views-row{
    margin:0;
  }
  .spezialist-header .views-element-container .views-row .logo{
  left:calc(50% - 75px);
  bottom:-20px;
  }
  .page-node-type-referenzprojekt .logo{
  left:calc(50% - 100px);
  bottom:-80px;
  }
  .spezialist-header .views-element-container .views-row h3{
    margin:0 auto;
    width:100%;
    height:auto;
    top:60px;
    left:0;
    position:absolute;
    text-align:center;
    max-height:55px;
    overflow:hidden;
  }
  h3.firma {
    margin:85px auto 0;
    width:100%;
    height:auto;
    text-align:center;
    max-height:55px;
    overflow:hidden;
    line-height:1.25em;
  }
  h3.firma .views-wrapper{
    -webkit-box-pack:center;
        -ms-flex-pack:center;
            justify-content:center;
  }
.page-node-type-referenzprojekt h3.firma,
.page-node-type-referenzprojekt .spezialist-header,
.page-node-type-referenzprojekt hr.specialist-detail-header-hr{
  display:none;
}
  .links{
    right:0;
    height:200px;
    bottom:-202px;
  }
  .profile--type--expert .group-bottom{
    margin:0;
  }
  .links{
    position:fixed;
    z-index:99;
    bottom:0;
    width:100%;
    height:50px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-pack:distribute;
        justify-content:space-around;
    background-color:var(--plaing-orange-light);
    padding:10px 0 5px;
  }
  .links > .header-btn{
    width:25%;
    max-width:100px;
    text-align:center;
    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-around;
    cursor:pointer;
  }
  .user-logged-in .links > .header-btn.no-login,
  .links > .header-btn.login{
    display:none;
  }
  .user-logged-in .links > .header-btn.login{
    display:block;
  }
  .user-logged-in .links > .header-btn.login .flag{
    margin:-10px auto 0;
    position:relative;
  }
  .links > .header-btn:empty{
    display:none;
  }
  .links .flag a,
  .links .flag:hover a,
  .header-link a,
  .header-link:hover a{
    border:none;
    background:none;
    font-size:1rem;
    color:var(--plaing-text-darkgrey);
    padding:0;
    width:auto;
    margin:0;
    background:none;
    border:none;
  }
  .links .btn-icon{
    display:block;
    height:auto;
    width:100%;
    padding:0;
    height:22px;
   }
   .user-logged-in .links .header-btn:last-child .btn-icon{
     height:18px;
   }
   .links .flag{
     width:100%;
     max-width:100px;
   }
   .links .flag a,
   .links .flag:hover a,
   .links .flag p,
   .links .flag:hover p{
     margin:0 auto;
     position:absolute;
     top:-15px;
     left:20px;
     width:60px;
     display:block;
     height:30px;
     padding:24px 0 0;
     z-index:9;
   }
  .links .btn-icon img{
    max-height:20px;
    width:auto;
  } 
  .links .btn-icon .fa{
    color:var(--plaing-text-darkgrey);
  }
  .links .btn-icon .fa-flag{
    height:18px;
    margin:-2px auto 0;
    display:block;    
  }
  .flag,
  .header-link{
    margin:0;
  }
  .link-telefon .fa,
  .link-web .fa{
    font-size:22px;
  }
  .header-btn:hover .link-telefon .show{
    display:block;
  }
  .header-btn:hover .link-telefon .hover-phone{
    display:none;
  }
  .link-mail .fa{
    margin-top:2px;
  }
  .links .header-btn a,
  .links .header-btn .flag:hover a,
  .links .header-btn.no-login,
  .links .header-btn.no-login:hover{
    text-transform:uppercase;
    font-size:70%;
    font-family:'Roboto', sans-serif;
  }
  .scrolltop{
    bottom:50px;
  }
    .page-node-type-referenzprojekt .group-left{
    display:none;
  }
    .page-node-type-referenzprojekt .spezialist-details-main-menu{
      margin:0 auto;
    }
    .referenz-pictures > div{
      -webkit-box-pack:center;
          -ms-flex-pack:center;
              justify-content:center;
    }
    .button-tooltip .tooltip{
      right:20px;
    }
    .spezialist-header .button-tooltip{
      padding:0;
      margin:0 0 2px;
    }
    .header-btn:last-child:hover .button-tooltip .tooltip{
      display:block;
    }
    .button-tooltip{
      width:100%;
      max-width:100px;
      border:none;
      background:none;
      text-transform:uppercase;
      font-weight:700;
      font-size:70%;
      color:var(--plaing-text-darkgrey);
    }
    .button-tooltip .tooltip{
      font-size:0.7rem;
      text-transform:initial;
      bottom: calc(100% + 30px);
    }
  .button-tooltip .tooltip::before{
    left:inherit;
    right:19px;
  }  
  .button-tooltip .tooltip::after{
    left:inherit;
    right:20px;
    }
  .back-link{
    bottom: -170px;
    left: 10px;
  }

}
@media screen and (max-width:569px){
  .group-content{
    padding:0;
  }
  .referenzen .views-wrapper {
    max-width: 550px;
  }
  .referenzen .views-row{
    max-width:180px;
  }
  .views-field-field-referenz-ort{
    top:139px;
  }
  .views-field-title{
    max-height:1.5em;
    overflow:hidden;
  }
 .button-tooltip{
     width:60px;
     height:auto;
     border:none;
     text-transform:uppercase;
     font-size:80%;
     padding:5px;
     background-color:transparent;
     display:-webkit-box;
     display:-ms-flexbox;
     display:flex;
     -webkit-box-orient:vertical;
     -webkit-box-direction:reverse;
     -ms-flex-direction:column-reverse;
     flex-direction:column-reverse;
  }
  .webform-kontakt-spezialist.visible{
  width:90%;
  left:5%;
  }

}
@media screen and (max-width:449px){
  .referenzen .views-wrapper {
    max-width: 420px;
  }
  .referenzen .views-row{
    max-width:140px;
  }
  .views-field-field-referenz-ort{
    top:98px;
  }
  .webform-kontakt-spezialist.visible{
    top:75px;
  }
  .profile--type--expert .group-content{
    padding:0;
  }
    .referenzen .slick-slide{
    max-width:140px;
    margin:0 10px;
  }
  .webform-kontakt-spezialist .close{
    padding:10px 0;
  }
}