

/*.content  */
:root,
body
{
  --bea-lila-color: #892B86;
  --bea-tuerkis-color: #4cbabf;
  --bea-gruen-color: #238236;
  --bea-petrol-color: #0d6f76;

  --bea-dunkelrot-color: #923144;
  --bea-hellgruen-color: #74b796;

  /* --the7-base-font-family: "Commissioner", Helvetica, Arial, Verdana, sans-serif; */
}



strong, b
{
  color: var(--bea-lila-color);
}

a {
    text-decoration: none;
}

a:hover, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    text-decoration: underline;
}



body .bg-bottom
{
	background-position: center bottom !important;
}

/*
.dunkelrot 
{
	color: #923144 !important;
}

.orange
{
	color: #e97d1f !important; 

}

.honig
{
	color: #FFBE00 !important;
}

.honig-bg, .bg-honig                        {     background-color: #FFBE00;  }
.p70-honig-bg, .bg-honig-p70                {     background-color: #ffd14c;  }

.dunkelrot-bg, .bg-dunkelrot                        {     background-color: #923144;  }
.p70-dunkelrot-bg, .bg-dunkelrot-p70                {     background-color: #b26e7c;  }

*/



.bg-lila:not(.vc_column_container),
.vc_column_container.bg-lila > .vc_column-inner,
.vc_column_container.inner-bg-lila > .vc_column-inner > .wpb_wrapper,
.ult-just-icon-wrapper.bg-lila .aio-icon-img
{
    background-color: var(--bea-lila-color) !important;  
}


.bg-tuerkis:not(.vc_column_container),
.vc_column_container.bg-tuerkis > .vc_column-inner,
.vc_column_container.inner-bg-tuerkis > .vc_column-inner > .wpb_wrapper,
.ult-just-icon-wrapper.bg-tuerkis .aio-icon-img
{
    background-color: var(--bea-tuerkis-color) !important;  
}


.bg-gruen:not(.vc_column_container),
.vc_column_container.bg-gruen > .vc_column-inner,
.vc_column_container.inner-bg-gruen > .vc_column-inner > .wpb_wrapper,
.ult-just-icon-wrapper.bg-gruen .aio-icon-img
{
    background-color: var(--bea-gruen-color) !important;  
}


.bg-petrol:not(.vc_column_container),
.vc_column_container.bg-petrol > .vc_column-inner,
.vc_column_container.inner-bg-petrol > .vc_column-inner > .wpb_wrapper,
.ult-just-icon-wrapper.bg-petrol .aio-icon-img
{
    background-color: var(--bea-petrol-color) !important;  
}




.block
{
	display: block !important;
}

h1, h2, h3, h4, h5, h6 {
    margin-bottom: 20px;
    clear: both;
}

.h3-size,
.h4-size,
.h5-size
{
	display: block !important;

}


.contains-bg-2000 .upb_row_bg
{
	background-size: contain !important;
}


@media (min-width: 2000px)
{
	.contains-bg-2000 .upb_row_bg
	{
		background-size: cover !important;
	}
}


/* ################################### */

.masthead .branding
{
	/* margin-bottom: -34px; */
	transition: width 0.6s ease, margin-left 0.8s ease;
	width: 350px;
  margin-left: 0px;
}

.masthead.sticky-on .branding
{
	/* margin-bottom: -34px; */
    width: 200px;
    margin-left: 10px;
}

/* ######################## */

#branding-bottom img
{
  max-width: 250px;
  height: auto;
}


.footer-headline
{
    font-weight: bold;
    font-size: 113%;
    margin-bottom: 8px;
    margin-top: 27px;
}

.footer-contact-info li
{
    padding-left: 20px;
}

.footer-contact-info i
{
    margin-left: -20px;
    position: absolute;
    margin-top: 5px;
}


.menu-footer-menu-container ul
{
  margin-top: 27px;
}

.footer .menu li
{
  text-align: right;
  border: none;
  padding: 5px 0 5px;
  margin: 0;
}

/* ########################  */

.bg-signet-overlay .upb_row_bg:after
{
  content: '';
  display: block;
  position: absolute;
  width: calc(90vh + 5vw);
    height: 100%;
    background: url(https://osteopathie-grohme.de/wp-content/uploads/Signet-osteo-grohme.svg);
    background-size: contain;
    background-position: bottom right;
    background-repeat: no-repeat;
    bottom: -20%;
    right: -2%;
   
}

.bg-signet-overlay-fixed .upb_row_bg:after
{
  position: fixed;
}

.bg-signet-overlay-trans-50p .upb_row_bg:after
{
  opacity: 0.5;
}



/* ####################################### */

#HeaderSlider
{
  width: 100%;
  height: 350px;
  position: relative;
  overflow: hidden;
}

#HeaderSlider.size-homeslide
{
  height: 550px;
}

/*
@media (min-width: 992px)
@media (min-width: 768px)
*/

@media (min-width: 992px)
{

#HeaderSlider
{
  /* height: 530px; */
  height: 450px;
}

#HeaderSlider.size-homeslide
{
  height: 550px;
}



}

#HeaderSlider .slides,
#HeaderSlider .slick-list,
#HeaderSlider .slides .slide,
#HeaderSlider .slides .slide .slide-image,
#HeaderSlider .slides .slide .slide-video
{
  width: 100%;
  height: 100%;
}

#HeaderSlider .slick-track
{
  height: 100%;
}

#HeaderSlider .slides .slide .slide-image,
#HeaderSlider .slides .slide .slide-video
{
  background-repeat: no-repeat;
  background-size: cover;
    position: relative;
}

#HeaderSlider .slides .slide .slide-image .mask
{
  display: block;
  position: absolute;
  width: 100%;
  bottom: 0px;
  height: 210px;
  background: rgb(0,98,49);
  background: linear-gradient(0deg, rgba(0,98,49,0.7) 0%, rgba(0,98,49,0) 100%);
}

/*
.slick-prev
{
  left: 30px;
}

.slick-next
{
  right: 30px;
}
*/

/*
.video-wrap { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; width: 100%;}
.video-wrap video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
*/

.video-wrap {
    overflow: hidden;
    width: 100%;
    height: 100%;
}
.video-wrap video {
    height: 100%;
    width: 177.77777778vh; /* 100 * 16 / 9 */
    min-width: 100%;
    min-height: 56.25vw; /* 100 * 9 / 16 */

    max-width: none;
}

/* merge with above css */
.video-wrap {
    position: relative; /* or absolute or fixed */
}
.video-wrap video {
    position: absolute;
    left: 50%; /* % of surrounding element */
    top: 50%;
    transform: translate(-50%, -50%); /* % of current element */
}



.slick-dots {
    position: absolute;
    bottom: 15px !important;
    display: block;
    width: 50% !important;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: right !important;
    right: 20px;
}

.slick-dots li button:before
{
  font-family: 'slick';
    font-size: 20px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    content: '•';
    text-align: center;
    opacity: .25;
    color: #ffffff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

}

.slick-dots li.slick-active button:before {
    opacity: .75;
    color: #ffffff
}


#main
{
  z-index: 1;
}


.header-caption-wrap
{
  width: 100%;
  position: absolute;
  bottom: 90px;
}

/*
#HeaderSlider .vc_column_container > .vc_column-inner 
{
    padding-left: 15px;
    padding-right: 15px;
}
*/

.header-caption::after {
    content: '';
    position: absolute;

    width: calc(100% + 2530px);
    left: -2500px;

    height: calc(100% + 60px);
    top: -30px;

    z-index: -1;
    background: rgba(255,255,255,0.8);

}


.header-caption-wrap > .wf-wrap 
{
  max-width: 1300px;
  margin: 0 auto;
  position: relative;
  padding: 0 50px 0 50px; 
  
}

.header-caption
{
  text-shadow: 0px 0px 8px #FFFFFF;
  padding-left: 10px;
  font-size: 20px;
  line-height: 28px;
  font-family: Roboto, Helvetica, Arial, Verdana, sans-serif;
}

.header-caption p
{
  margin: 0;
  padding: 0;
}

.header-caption strong, .header-caption b
{
  display: inline-block;
  padding-bottom: 3px;

  color: var(--wes-base-color);
  font-size: 25px;
  line-height: 35px;
}

/*
@media (min-width: 992px)
@media (min-width: 768px)
*/
@media (min-width: 992px)
{
/*
.header-caption::after {
    height: calc(100% + 105px);
    top: -40px;

}
*/
.header-caption-wrap
{
  bottom: 20%;
}

.header-caption strong, .header-caption b
{
  font-size: 35px;
  line-height: 45px;
}
}



/* ------------------------- */

.vc_row.quote-row
{
    margin-bottom: 100px;
    overflow: visible;
    padding-top: 70px;
}

.vc_row.quote-row .vc_column-inner
{
  padding-top: 0px !important;
}

.quote-text-column
{
    margin-bottom: 10px;
}

.quote-text-column .wpb_text_column,
.quote-text-column .quote-source
{
    margin-bottom: 40px;
    text-align: right;
    padding-right: 60px;
    opacity: 0.8;
    font-style: italic;
}


.quote-text-column .quote-text
{
    margin-top: 70px;
    font-size: 150%;
    line-height: 2;
    font-style: italic;
    margin-bottom: 10px;
    text-align: left;
    padding-right: 0;
    opacity: 1;
}

.quote-text-column .wpb_content_element:last-child
{
    margin-bottom: 40px;  
}


.quote-text:before 
{
    display: block;
    position: absolute;
    content: '"';
    font-size: 120px;
    opacity: 0.5;
    left: -58px;
    /* margin-top: -9px; */
    bottom: -69px;
    font-family: Verdana;
    line-height: 165px;
}

.quote-text:after 
{
    display: block;
    position: absolute;
    content: '"';
    font-size: 120px;
    opacity: 0.5;
    right: -25px;
    top: 70px;
    font-family: Verdana;
    line-height: 0px;
}

@media (max-width: 767px)
{
  .vc_row.quote-row {
    margin-bottom: 100px;
    padding-top: 120px;
  }

  .wpb_column.quote-image-column > .vc_column-inner:before 
  {
      display: block;
      position: absolute;
      content: "ZITAT";
      font-size: 60px;
      opacity: 0.5;
      left: 50px;
      margin-top: -75px;
      line-height: 20px;
  }

  .wpb_column.quote-image-column > .vc_column-inner > .wpb_wrapper:before 
  {
      display: block;
      position: absolute;
      content: "ZITAT";
      font-size: 23px;
      font-weight: 700;
      margin-top: -61px;
      left: 103px;
  }

  .quote-text {
    margin-top: 10px;
    padding-left: 10%;
    padding-right: 10%;
    margin-bottom: 50px;
  }


  .quote-text:before 
  {
    left: 0px;
  }

  .quote-text:after 
  {

    right: 40px;
    bottom: 23px;
  }

}

@media (min-width: 768px)
{
  .wpb_column.quote-text-column > .vc_column-inner:before 
  {
      display: block;
      position: absolute;
      content: "ZITAT";
      font-size: 60px;
      opacity: 0.5;
      left: -40px;
      margin-top: -85px;
      line-height: 20px;
  }

  .wpb_column.quote-text-column > .vc_column-inner > .wpb_wrapper:before 
  {
      display: block;
      position: absolute;
      content: "ZITAT";
      font-size: 23px;
      font-weight: 700;
      margin-top: -70px;
  }

  .wpb_single_image.quote-image
  {
    width: 78%;
    margin-bottom: -50px;
    z-index: 9999;
    position: absolute;
  }



}

.quote-row.semi-much-text-quote .quote-text-column .quote-text
{
    font-size: 130%;
    line-height: 1.5;
}

.quote-row.much-text-quote .quote-text-column .quote-text
{
    font-size: 120%;
    line-height: 1.4;
}


@media (max-width: 450px)
{
  .quote-text-column .quote-text
  {
    margin-top: 40px;
    font-size: 120%;
    line-height: 1.5;
    padding-left: 3%;
  }
  .quote-text:before
  {
    margin-top: -53px;
  }
}

/* ---------------------- */


/*
@media (min-width: 768px)
{
.wpb_single_image.quote-image {
    margin-top: -20px;
  }
}

.quote-text-column .quote-text
{
  margin-top: 10px;
}


.wpb_column.quote-text-column > .vc_column-inner > .wpb_wrapper:before,
.wpb_column.quote-text-column > .vc_column-inner:before 
{
    display: none;
}

*/

/* ########################## */


.themenscroller .dt-owl-item .themenscroller-item
{
  background-color: var(--wes-accent-color);

}

.themenscroller .dt-owl-item:nth-of-type(even) .themenscroller-item
{
  background-color: var(--wes-accent-color-70p);

}

.themenscroller .dt-owl-item > .vc_row
{
	padding: 0;
	margin: 0; 
}

.themenscroller .dt-owl-item .vc_column_container>.vc_column-inner
{
	padding: 20px;
	margin: 0; 
  height: 100%;
}

.themenscroller .dt-owl-item .vc_column_container>.vc_column-inner > .wpb_wrapper
{
    display: flex;
    flex-direction: column;
    height: 100%;
}

.themenscroller .dt-owl-item .vc_column_container>.vc_column-inner > .wpb_wrapper > .wpb_content_element 
{
    display: flex;
    flex-direction: column;
}

/*
.themenscroller .dt-owl-item > .vc_row {
  position:relative;
  width: 100%;
  max-width: 100%;
  display:block;
}
*/

.themenscroller .dt-owl-item > .vc_row:before {
  content: "";
  display:block;
  padding-top: 100%;
}
 
.themenscroller .dt-owl-item > .vc_row .wpb_column {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
}
/*
.themenscroller .dt-owl-item .icon-with-text-shortcode.themenscroller-icon {
    padding: 20px;
}
*/

.themenscroller .dt-owl-item .item-text
{
    margin: 0;
    flex-grow: 1;
    flex-basis: 30px;
}

.themenscroller .dt-owl-item .item-text *
{
	color: #ffffff;
}

.themenscroller .dt-owl-item .item-text h4
{
    /*
    margin-bottom: 10px;
    margin-top: 15px; */
    padding: 0;
    margin: 0;
    text-transform: uppercase;
    font-weight: normal;
}

.themenscroller .dt-owl-item .item-icon
{
  	/* margin-bottom: 20px; */
    flex-grow: 6;
    flex-basis: 40px;
    margin: 0;
}

.themenscroller .dt-owl-item .item-icon .vc_figure
{
    width: 50%;
    max-width: 120px;
    margin: auto auto;
}


.themenscroller .carousel-shortcode .owl-nav a:hover i
{
	font-size: 40px;
}


@media (max-width: 767px)
{

	.themenscroller .carousel-shortcode .owl-nav a i, 
	.themenscroller .carousel-shortcode .owl-nav a i:before
	{
		color: #ffffff !important;
	}

}


/* -------------------------- */


.hr-thin,
.hr-thin.hr-left,
.hr-thin.hr-right,
.hr-thin.hr-center
{
  margin: 10px 0 15px;
  border-color: #0D6F76 !important; 
}


/* --------------------------- */


#cf7md-form .cf7md-item, #cf7md-form input, #cf7md-form label, #cf7md-form textarea, #cf7md-form p, #cf7md-form .mdc-select, #cf7md-form.cf7md-form + .wpcf7-response-output, #cf7md-form .wpcf7-not-valid-tip, #cf7md-form .cf7md-card-title, #cf7md-form .cf7md-card-subtitle, #cf7md-form .mdc-button, #cf7md-form .mdc-floating-label, #cf7md-form .mdc-text-field-helper-text, #cf7md-form .mdc-text-field__input, #cf7md-form .mdc-select__native-control, #cf7md-form .mdc-form-field {
    font-family: var(--the7-base-font-family);
}

#cf7md-form .mdc-button
{
  border-radius: 0;
}

/* -------------------------- */

@media screen and (max-width: 992px) {
    .footer .widget {
        width: 100%;
        text-align: center;
    }

    .footer .menu li {
      text-align: center;
    }
    .mobile-header-bar .mobile-branding img {
        max-width: 180px;
        height: auto;
    }    
}



