/*
Theme Name: Ergotherapie Runkel
description: Ergotherapie Runkel - Theme - Ver. 01
Author: neo7
Author URI: https://neo7.de
Template: customify
Version: 1.0.0
Text Domain: ergotherapie-runkel
*/

/* comme-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Comme';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/comme-v3-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* comme-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Comme';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/comme-v3-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* comme-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Comme';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/comme-v3-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* comme-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Comme';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/comme-v3-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



body {
	--hellerblau: #f1f9ff;
    --hellblau: rgb(52, 169, 225);
    --blau: #004d9d;
    --dunkelblau: rgb(36, 59, 111);
    --grau: rgb(103, 103, 103);
    --hellgrau: rgb(153, 153, 153);
	--dunkelgrau rgb(55, 55, 55);
	--orange: rgb(255,102,0);
	--rot: #ff3333;
    font-family: "Comme", Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
    font-size: 110%;
    line-height: 1.4 !important;
    background-color: #f4f4f4 !important;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

body .comments-area .comment-reply-title, body .h1, body .h2, body .h3, body .h4, body .h5, body .h6, body h1, body h2, body h3, body h4, body h5, body h6 {
    font-weight: 400;
    font-family: "Comme", Arial, Helvetica, sans-serif;
    margin: 0 0 0.5407911001em;
	color: var(--blau);
	clear: both;
	
}

body .footer-main .light-mode {
    background: var(--hellerblau);
}

body .footer-bottom .dark-mode {
    background: var(--blau);
    border-bottom: solid 2px var(--rot);
}

body a {
	color: var(--blau);
}

body a:hover {
	color: var(--rot);
}

body #main a {
	text-decoration:underline;
}


body .light-mode .site-title, body .light-mode .site-title a {
    color: var(--blau);
}


div#cb-row--header-main {
    border-bottom: solid 2px var(--rot);
}

body .light-mode .nav-menu>li>a {
	color: var(--blau);
}

body .light-mode .nav-menu>li>a:hover, body .header-social-icons.customify-builder-social-icons.color-custom li a:hover {
	color: var(--rot) !important;
}

body .footer--row-inner.dark-mode a:not(.button) {
    color: var(--hellerblau);
}

body .footer--row-inner.dark-mode a:not(.button):hover {
    color: var(--rot);
}

body .footer--row-inner.light-mode {
    color: var(--dunkelgrau);
}

body nav#site-navigation-bottom-desktop {
    text-align: center;
}

body .light-mode .nav-menu-desktop.style-plain .nav-menu>li.current-menu-item>a, body .nav-menu-desktop .menu li.current-menu-item>a {
    color: var(--blau);
	    padding: 12px 0px 12px 12px;
}

p.site-description.text-uppercase.text-xsmall {
    color: var(--hellgrau);
    font-size: 2.32vw;
    font-weight: 600;
}

.zitat {
	color: #FFF;
	font-size: 0.7em;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
}

.pdflink {
	background-image:url(pdf.png);
	background-position:top left;
	background-repeat:no-repeat;
	padding-left:25px;
}

body .site-header .cb-row--mobile .site-branding img {
	color: var(--blau);
	width:15vw;
    max-width: 6em;
}

body h1.wp-block-heading {
	color: var(--blau);
	font-size: 2.5em;
	margin-top: 1em;
	font-weight:bold;	
}

body h2.wp-block-heading {
	color: var(--blau);
    font-size: 1.5em;
    margin-top: 1em;
    font-weight: 600;
}

body h3.wp-block-heading {
	color: var(--blau);
    font-size: 1.3em;
    margin-top: 0.5em;
    font-weight: 600;
}

body h4.wp-block-heading {
	color: var(--grau);
    font-size: 1.1em;
    margin-top: 0.5em;
    font-weight: 600;
}

body a.Behandlung {
	text-decoration:none;
}

body a.Behandlung div:hover {
	box-shadow: 0 3px 6px -4px rgba(0,0,0,.16), 0 3px 6px rgba(0,0,0,.23);
	transition:0.5s;
	transform: scale(1.025);
}

body .Behandlung div {
	max-width: 600px;
	display: block;
	padding: 0.5em;
	margin:auto;
	margin-top: 1.5em;
	min-height: 11em;	
}

body .Behandlung div h2 {
    font-size: 2em;
    margin-top: 1em;
    font-weight: 400;
	text-align:center;
	color:#fff;
	text-decoration:none;
}

body .Behandlung div p {
	text-align:center;
	letter-spacing: 2px;
	font-weight:400;
	color: #fff;
}

body a.Behandlung {
	text-align:center !important;
	letter-spacing: 2px;
	font-weight:400;
	text-decoration:none !important;
}
body a.Behandlung:hover {
	text-decoration:underline;
	color:#fff;
}

body .Kontakt {
	padding:2em;
}

.smalltext {
	font-size:85%
}

.boxshadow {
	box-shadow: 0 3px 6px -4px rgba(0,0,0,.16), 0 3px 6px rgba(0,0,0,.23);
}

body .nav-menu-desktop .sub-menu li a {
    color: var(--blau);
}

body .nav-menu-desktop .sub-menu li a:hover {
    background: rgba(0,0,0,.06);
    color:  var(--dunkelblau) !important;
}

body .wp-block-image.movelinked img {
    display: block;
    transition: ease-out 0.15s;
}

body .wp-block-image.movelinked img:hover {
    margin-left:-0.35em;
	margin-top:-0.35em;
    transition: ease-out 0.15s;
}

body .header--row.header-bottom .customify-grid, body .header--row.header-bottom .style-full-height .primary-menu-ul > li > a {
	min-height: 50vw;
}

figcaption h4 {
    text-align: center;
}

footer#site-footer a, #main a {
    font-family:Arial, Helvetica, sans-serif;
}

.outer-container {
    margin: 0;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50vw;
    right: 0;
    z-index: 9;
}

.slideshow-container {
    position: relative;
    width: 100vw;
    height: 50vw;
    overflow: hidden;
}

.slideshow-container a {
      position: absolute;
      left: 0; top: 0;
      width: 100%;
      height: 100%;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.7s;
      z-index: 99;
      display: block;
}

.slideshow-container a.active {
	opacity: 1;
    pointer-events: auto;
    z-index: 999;
}
.slideshow-container img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border: none;
      display: block;
}


body .customify-container {
    position: relative;
    padding: 0;
}

body #main, body #sidebar-primary, body #sidebar-secondary {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}

body.main-layout-content .entry-content>.alignfull {
    margin: 0 !important;
}

body [class*=customify-grid-], body [class*=customify-grid_], body [class~=customify-grid] {
    margin: 0;
}

body .comments-area .comment-reply-title, body .h1, body .h2, body .h3, body .h4, body .h5, body .h6, body h1, body h2, body h3, body h4, body h5, body h6, body ul, body ol, body p, body figure, body .header--row-inner, body form {
    padding-left: 2vw;
    padding-right: 2vw;
}

body .site-branding .site-title {
    font-size: 0.9em;
}

body form.fluent_form_1 .ff-btn-submit:not(.ff_btn_no_style) {
	background-color: var(--blau);
    color: #ffffff;
	border-radius: 5px;
}

body form.fluent_form_1 .ff-btn-submit:not(.ff_btn_no_style):hover {
	background-color: var(--rot);
}

#page.site, #page.site-framed .site {
    max-width: 1248px;
    box-shadow: 0 3px 6px -4px rgba(0, 0, 0, .16), 0 3px 6px rgba(0, 0, 0, .23);
    margin: 0 auto;
}

/* Sprungmarke Position – Abstand hinzufügen */
.sprungmarke::before {
	display: block;
	content: „“;
	height: 160px;
	margin-top: -160px;
	visibility: hidden;
}

@media (prefers-color-scheme: dark) {
  /* Dark theme styles go here */

}

@media screen and (max-width: 568px) {

}

@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 766px) {

}

@media screen and (max-width: 480px) {
}

@media screen and (max-width: 1024px) {

}

@media screen and (min-width: 569px) {
	body nav#site-navigation-bottom-desktop {
	    text-align: right;
	}
	
	p.site-description.text-uppercase.text-xsmall {
		color: var(--grau);
        font-size: 0.93em;
        font-weight: 600;
        text-transform: none;
	}
	
	.site-header .cb-row--mobile .site-branding img {
		max-width: 100%;
	}
	
	.zitat {
		font-size: 1.3em;
		text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
	}
	
	.autor {
		font-size:1.15em;
		text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
	}
	
	body .site-branding .site-title {
		font-size: 1.3em;
	}	

}

@media screen and (min-width: 1024px) {
	.zitat {
		font-size: 2em;
		text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
	}
	
	.autor {
		font-size:1.35em;
		text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
	}
	
}

@media screen and (min-width: 1260px) {
	body .header--row.header-bottom .customify-grid, body .header--row.header-bottom .style-full-height .primary-menu-ul > li > a {
		min-height: 630px;
	}	
}