@charset "UTF-8";
/* Add your css code here */
/*
Variable Definitions:
  --r-bg: Sets the background color.
  --r-tx: Sets the text color.
  --r-h1: Sets the color for h1, h2, and h3 headings.
  --r-lk: Sets the link text color.
  --r-lk-h: Sets the hover color for link text.
  --r-br: Sets the border color.
  --r-bg-fr: Sets the background color for input forms.
  --r-tx-lk: Sets the menu link text color.
  --r-tx-lk-h: Sets the hover color for menu link text.
  --r-bg-lk: Sets the background color for menu links.
  --r-bg-lk-h: Sets the hover background color for menu links.
  --r-tx-bt: Sets the button text color.
  --r-tx-bt-h: Sets the hover color for button text.
  --r-bg-bt: Sets the button background color.
  --r-bg-bt-h: Sets the hover background color for buttons.
*/
/* ---------- Colors ------------- */
:root {
  --r-bg:#75c0a7;
  /* Controls the background color */
  --r-bg-lgt: #def0ea;
  /* Hintergrundfarbe aufgehellt */
  --r-tx:#000;
  /* Determines the color of the text. */
  --r-h1:#023d82;
  /* Sets the color for h1, h2, and h3 headings. #2a3439*/
  --r-lk:#8a3324;
  /* Changes the link text color. */
  --r-lk-h:#79443b;
  /* Alters the hover color of link text. */
  --r-br:#f4f5f0;
  /* Specifies the border color. */
  --r-bg-fr:#f8f4ff;
  /* Defines the background color of input forms. */
  --r-tx-lk:#2c3e4c;
  /* Adjusts the menu link text color. */
  --r-tx-lk-h:#1520a6;
  /* Modifies the hover color of menu link text. */
  --r-bg-lk:#F2F7FD;
  /* Sets the menu link background color. */
  --r-bg-lk-h:#f8f8e8;
  /* Changes the hover background color of menu links. */
  --r-tx-bt:#354a21;
  /* Determines the button text color. */
  --r-tx-bt-h:#597d35;
  /* Alters the button text color on hover. */
  --r-bg-bt:#fdca07;
  /* Specifies the button background color. */
  --r-bg-bt-h:#efece1;
  /* Sets the button background color on hover. */
  --p-wd:1280px;
  /*Seitenbreite*/
  --solo-gap:0; }

#footer-container {
  background-color: var(--r-bg); }

/* Examples: */
#page-wrapper {
  background-color: var(--r-bg);
  color: var(--r-tx);
  border-color: var(--r-br); }

h1, h2, h3 {
  color: var(--r-h1); }

a:not(li.nav__menu-item a) {
  color: var(--r-lk);
  color: var(--r-lk-h); }

input:not(.button) {
  background-color: var(--r-bg-fr); }

li.nav__menu-item a {
  color: var(--r-tx-lk);
  background-color: var(--r-bg-lk); }

li.nav__menu-item a:hover {
  color: var(--r-tx-lk-h);
  background-color: var(--r-bg-lk-h); }

button:not(li.nav__menu-item button) {
  color: var(--r-tx-bt);
  background-color: var(--r-bg-bt); }

button:not(li.nav__menu-item button):hover {
  color: var(--r-tx-bt-h);
  background-color: var(--r-bg-bt-h); }

body {
  background: var(--r-bg), #fff;
  line-height: 1.5em; }

#sticky {
  position: sticky;
  top: 0;
  z-index: 2000; }

.solo-sticky .branding-first a {
  justify-content: flex-start; }
  .solo-sticky .branding-first a img {
    width: 50%; }

header {
  background-image: linear-gradient(var(--r-bg), #fff); }

#primary-menu a {
  background: var(--r-bg-bt); }

#main-neubar {
  background: inherit; }

#main-container-inner, #sidebar-box-main .region-inner {
  background: #fff; }

#main-container, #footer-container, #footer-menu {
  background: var(--r-bg); }

#footer-container-inner {
  background: var(--r-bg); }

#block-physio-karte {
  margin: auto; }

#block-physio-site-branding {
  padding: 1em 0; }

.test {
  color: #def0ea; }

.h3 {
  font-weight: normal;
  font-size: 0.5em; }

html {
  background: var(--r-bg-lgt); }

#welcome-text {
  position: relative;
  background-image: url("images/hero.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  height: 85vh; }

#welcome-text-inner {
  width: 100vw; }

/* ----------------- Team ----------------- */
.views-element-container .view-team {
  display: flex; }
  .views-element-container .view-team .view-content {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }

.view-team .views-row {
  padding: 0 2em;
  flex-basis: 25%;
  flex-grow: 1;
  flex-shrink: 0; }
.view-team .views-field-field-image {
  margin: 0 3em; }

/* --------- Leistungen ----------- */
.view-unsere-leistungen .view-content {
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
  .view-unsere-leistungen .view-content .views-row {
    background: lightgray;
    flex-basis: 20%;
    flex-shrink: 1;
    flex-grow: 1;
    flex-wrap: wrap;
    hyphens: auto;
    word-break: break-word;
    overflow-wrap: break-word;
    margin: 1em;
    padding: 1em;
    align-content: start;
    justify-content: center; }
    .view-unsere-leistungen .view-content .views-row .views-field-field-image {
      margin: 0 auto !important; }
    .view-unsere-leistungen .view-content .views-row img {
      bottom: 0; }
    .view-unsere-leistungen .view-content .views-row .views-field-body {
      position: absolute;
      top: 0;
      left: 0;
      display: none; }
      .view-unsere-leistungen .view-content .views-row .views-field-body hover {
        display: block; }
    .view-unsere-leistungen .view-content .views-row ul {
      padding: 1em; }

/* ------------- Stoßwellentherapie ----------- */
.w3-two-columns .w3-col {
  width: 50%;
  padding: 0 1em; }
  @media (width < 900px) {
    .w3-two-columns .w3-col .w3-col {
      width: 100%; } }

/* -------------- Preise ------------ */
table {
  max-width: 75%; }
  @media (width < 800px) {
    table {
      width: 100%; } }

.tab_links {
  text-align: left; }

.tab_rechts {
  text-align: right !important;
  white-space: nowrap; }

.page-wrapper table tr:nth-child(2n+1) {
  background-color: var(--solo-even-light, var(--r-bg-lgt)); }

/* ------------- Kontakt -------------- 
input, textarea {
	background-color:var(--r-bg-lgt) !important;
	
	#edit-submit, #edit-preview {
		background-color:var(--r-bg-bt) !important;
	}
}*/
/*  --------- Animation ------------ */
#block-physio-animation-2 {
  animation: rennen 4s forwards;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
  background: rgba(255, 255, 255, 0.95);
  display: block;
  margin-left: 0;
  position: absolute;
  padding: 1.5em;
  border-radius: 1em;
  width: auto; }

@keyframes rennen {
  0% {
    transform: translate(0) rotate3d(1, 1, 1, 0);
    opacity: 0; }
  100% {
    transform: translate(60em) rotate3d(1, 1, 1, 360deg);
    opacity: 1; } }
@media (width < 1700px) {
  #welcome-text {
    width: 100%;
    min-height: 100%;
    min-width: 100%;
    max-width: 10000% !important;
    margin: 0 auto !important;
    max-height: 33vh; }

  @keyframes rennen {
    0% {
      transform: translate(0) rotate3d(1, 1, 1, 0);
      opacity: 0; }
    100% {
      transform: translate(2em) rotate3d(1, 1, 1, 360deg);
      opacity: 1; } } }
/* ---------- Allgemein ------------- */
html {
  scroll-padding-top: 4rem; }

h2 {
  padding: 0.5em; }

.odd {
  background-color: var(--r-bg-lgt); }

.even {
  background-color: #fff; }

h4 {
  color: var(--r-h1); }

.w3-row {
  width: 100%; }

/* Breite der Page */
#header-inner,
#primary-menu-inner,
.p-container-inner,
#footer-container-inner {
  max-width: var(--p-wd);
  margin: auto; }

#sidebar-box-main {
  width: 100%;
  padding: 0; }

.solo-outer .region-inner {
  padding: 0 !important; }

.main-container-inner solo-inner {
  padding: 0 !important; }

.paragraph.w3-card-2 {
  width: auto;
  height: auto; }

#main-container-inner .solo-inner {
  padding: 0; }

.hoehe100 {
  min-height: 100vh;
  margin: auto;
  display: flex;
  justify-content: center; }

.paragraph.w3-card-2 {
  margin: unset; }

#footer-menubar--2, #account-menuebar--2, #footer-menubar {
  flex-direction: column; }
  #footer-menubar--2 a, #account-menuebar--2 a, #footer-menubar a {
    background: transparent; }

#block-physio-fusszeile {
  margin: auto; }

/* --------- Hauptmenue ---------- */
#main-menubar a {
  background-color: var(--r-bg-bt); }
  #main-menubar a a:hover {
    background-color: var(--r-bg-bt-h); }

/* ------------- Impressum - Datenschutz -------------- */
#block-physio-content {
  max-width: var(--p-wd);
  margin: auto; }

/*# sourceMappingURL=physio-style.css.map */