/*
Theme Name: Marion Becker | Modell • Actress
Theme URI: http://www.kundenurl.de/
Author: SIGN+DESIGN Werbeagentur
Author URI: https://www.signunddesign.com/
Description: Wozu lange um den „heißen Brei“ reden: Unser Ziel ist Ihr Erfolg! Denn nur erfolgreiche Kunden sind auf Dauer glückliche Kunden. Und um Sie glücklich zu machen, richten wir unsere Energie auf Ihren stimmigen Auftritt und die Entwicklung zielführender Kommunikationsmaßnahmen. Werbung darf bei uns Spaß machen und ist trotzdem niemals Selbstzweck. Was zählt ist Ihr Erfolg! Die Früchte unserer Bemühungen: treue, langjährige Kunden und zahlreiche Weiterempfehlungen – mit ein Grund dafür, dass viele unserer Kunden aus dem Bereich Immobilien stammen. Und hier liegt auch seit über 20 Jahren ein Schwerpunkt unserer Arbeit.
Version: 2.1
*/@charset "UTF-8";

/*WICHTIG BackgroundImages webp - background-image: url('<?php $img = get_sub_field('img'); echo $img['sizes']['1280width']; ?>.webp');*/

/*Global Reset*/

body,html,h1,h2,h3,h4,h5,h6,p,ul,ol,li{padding:0;margin:0;}
body,html{overflow-x: hidden!important;width:100%;-webkit-font-smoothing:antialiased;-webkit-overflow-scrolling:touch;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}

/* ########## Fonts ++ WICHTIG font-display: swap; ++ ########## */

/* montserrat-300 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url('assets/fonts/montserrat-v24-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('assets/fonts/montserrat-v24-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('assets/fonts/montserrat-v24-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
  url('assets/fonts/montserrat-v24-latin-300.woff') format('woff'), /* Modern Browsers */
  url('assets/fonts/montserrat-v24-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
  url('assets/fonts/montserrat-v24-latin-300.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-regular - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/montserrat-v24-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('assets/fonts/montserrat-v24-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('assets/fonts/montserrat-v24-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
  url('assets/fonts/montserrat-v24-latin-regular.woff') format('woff'), /* Modern Browsers */
  url('assets/fonts/montserrat-v24-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
  url('assets/fonts/montserrat-v24-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-600 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('assets/fonts/montserrat-v24-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('assets/fonts/montserrat-v24-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('assets/fonts/montserrat-v24-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
  url('assets/fonts/montserrat-v24-latin-600.woff') format('woff'), /* Modern Browsers */
  url('assets/fonts/montserrat-v24-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
  url('assets/fonts/montserrat-v24-latin-600.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-700 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('assets/fonts/montserrat-v24-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('assets/fonts/montserrat-v24-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('assets/fonts/montserrat-v24-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
  url('assets/fonts/montserrat-v24-latin-700.woff') format('woff'), /* Modern Browsers */
  url('assets/fonts/montserrat-v24-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
  url('assets/fonts/montserrat-v24-latin-700.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* ########## Variables ########## */

* {
  --font-family: "Montserrat", sans-serif;
  --transition: .2s ease;
  --wrp-width: 1240px;
  --font-size: 16px;
  --line-height: calc(var(--font-size) * 1.7);
  --box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.3);
  --border-radius: 5px;
  --primary-color: #97C0D8;
  --secundary-color: #2F7790;
  --text-color: #094067;
}

/* ########## Globals ########## */

html {background-color: #f5f5f5;}
body {font-size: var(--font-size); font-family: var(--font-family); background: #FFFFFE; line-height: var(--line-height); color: var(--text-color); max-width: 1920px; margin: 0 auto;}
img {-ms-interpolation-mode:bicubic; vertical-align: bottom;}
svg {width: 100%; height: 100%;}
hr {border:none;height:1px;background:#ddd; margin:0;}

.wrp {max-width: var(--wrp-width); width: 90%; margin: 0 auto; position:relative; box-sizing:border-box;}

.btn {width: 325px; height: 65px; position: relative;  font-weight: 700; display: block; }
.btn .mainspan {background: var(--primary-color); var(--transition); position: relative; z-index: 2; overflow: hidden; text-transform: uppercase; color: #fff; width: 100%; height: 100%; display: grid; place-items: center;}
.btn .backspan {background: var(--secundary-color); var(--transition); position: absolute; z-index: 1; width: 100%; height: 100%; left: 5px; top: 5px;}

.btn:hover .mainspan {background: var(--secundary-color); transition: var(--transition);}
.btn:hover .backspan {background: var(--primary-color); transition: var(--transition);}

/* Margins */

.mb {margin-bottom: 150px;}
.mb50 {margin-bottom: 50px;}
.mb75 {margin-bottom: 75px;}

@media (max-width: 550px) {
  .mb {margin-bottom: 75px;}
  .mb75 {margin-bottom: 50px;}
}

/* Page Build */

main.withsidebar .page-build {display: grid; grid-template-columns: 75% 20%; align-items: flex-start; justify-content: space-between; max-width: var(--wrp-width); width: 90%; margin: 0 auto;}
main.withsidebar .content .wrp {width: 100%;}
main.withsidebar .sidebar {width: 100%; position: -webkit-sticky; position: sticky; top: 150px; background: #f5f5f5; padding: 25px; box-sizing: border-box;}

@media (max-width: 768px) {
  main.withsidebar .page-build {grid-template-columns: 100%;}
  main.withsidebar .page-build .sidebar {display: none;}
}

/* Typo Styles */

h1{margin:0; font-size: 25px; line-height: 30px;}
h2{margin:0 0 40px 0; font-size: 28px; line-height: 34px; font-weight: 600;}
h3{margin:0;}
h4{margin:0 0 20px 0; font-size: 14px; line-height: 14px; text-transform: uppercase; color: var(--secundary-color);}

a {text-decoration: none; outline:none !important; color: var(--text-color); transition: var(--transition);}
a:hover {color: var(--primary-color); transition: var(--transition);}

p {font-size: var(--font-size); color: var(--text-color); margin-bottom: var(--line-height); font-weight: 500;}
address {font-style: normal; color: var(--text-color);}
address a {display: block;}
ol, ul {margin-bottom: var(--line-height);}
li {margin-left: 20px;}

@media (max-width: 500px) {
  h2{margin:0 0 25px 0; font-size: 20px; line-height: 25px;}
}

/* ########## Mainnav ########## */

#mainnav {display: block; transform: translate(0);}
#mainnav ul.mainnav {display: grid; grid-template-columns: repeat(3, auto) 25% repeat(3, auto); align-items: center; margin: 0; gap: 50px;}
#mainnav ul.mainnav li.offset {grid-column: 4;}
#mainnav ul.mainnav li.offset a {font-size: 0;}
#mainnav ul.mainnav li {list-style-type: none; font-size: 16px; margin: 0;}
#mainnav ul.mainnav li:first-child {margin-left:0;}

#mainnav ul.mainnav li:nth-child(5),
#mainnav ul.mainnav li:nth-child(6),
#mainnav ul.mainnav li:nth-child(7) {text-align: right;}

#mainnav ul.mainnav li a{display:block; color: var(--text-color); transition: var(--transition); text-transform: uppercase; font-weight: 700; padding: 30px 0;}
#mainnav ul.mainnav li a:hover, #mainnav ul > li.current-menu-item > a{color: var(--primary-color); transition: var(--transition);}

/* Submenu */

@media (min-width: 1151px){
    #mainnav ul.mainnav li.no-desktop {display: none;}
    #mainnav ul.mainnav li.menu-item-has-children {position: relative;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu {position: absolute; top: 84px; left: 0; display: block; height: auto; max-height: 0; overflow: hidden;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li {width:200px; height: 100%; padding: 8px 0 8px 7px; transition: 0.8s ease; background: #f5f5f5; margin: 0;}
    #mainnav ul.mainnav li.menu-item-has-children:hover > ul.sub-menu {max-height: 674px; padding: 0; overflow: visible; margin-top: -6px;}

    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:hover {background: var(--primary-color);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:hover a {color: #fff;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li a {padding: 3px;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:last-child {margin-bottom: 0;}

    /* Zweite Ebene */

    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu {position: absolute; left: 100%; top: 6px; overflow: hidden;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children:hover ul.sub-menu {overflow: visible;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li {background: #f5f5f5;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li a {color: var(--text-color);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li:hover a {color: var(--primary-color);}

    /* Desktop ausblenden */

    #mainnav .head,
    #mainnav address.contact,
    #mainnav ul.mainnav li.back {display: none;}
}

@media (max-width: 1150px) {

  /* Offcanvas */

    #mainnav {position: fixed; top: 0; right: 0; bottom: 0; z-index: 6; background: #fff; width: 100%; max-width: 500px; transform: translateX(100%); transition: var(--transition); box-shadow: var(--box-shadow); overflow-y: scroll;}
    #mainnav.active {transform: translateX(0); transition: var(--transition);}
    #mainnav.active .head {display: grid; height: 110px; grid-template-columns: auto auto 55px; align-items: center; padding: 20px; box-sizing: border-box; box-shadow: 0 0 10px rgba(0,0,0,0.1);}
    #mainnav.active .head p {margin: 0; font-size: 25px; color: var(--text-color);}
    #mainnav.active .head .buttons {display: flex; justify-content: flex-end;}

    #mainnav .head .buttons a {width: 50px; height: 50px; border-radius: 2px; background: #f5f5f5; margin-left: 5px; display: flex; align-items: center; justify-content: space-around; }
    #mainnav .head .buttons a:first-child {margin-left: 0;}
    #mainnav .head .buttons a svg {width: 25px; height: 25px;}
    #mainnav .head .buttons a svg g path {stroke: #a4a4a4;}

    #mainnav ul.mainnav {display: block;}
    #mainnav ul.mainnav li {padding: 0 5%; box-sizing: border-box; margin: 0; background: #efefef; border-bottom: 1px solid #dedede;}
    #mainnav ul.mainnav li.offset {display: none;}
    #mainnav ul.mainnav li:nth-child(5),
    #mainnav ul.mainnav li:nth-child(6),
    #mainnav ul.mainnav li:nth-child(7) {text-align: left;}
    #mainnav ul.mainnav li a {font-size: var(--font-size); padding: 15px 0;}
    #mainnav address.contact {padding: 5%; box-sizing: border-box; display: block;}

    /* Submenu */

    #mainnav ul.mainnav li.back {display: block; background: #cdcdcd; position: relative; z-index: 5;}
    #mainnav ul.mainnav li.back a {padding: 10px 0; font-weight: 700;}
    #mainnav ul.mainnav > li.menu-item-has-children > a {position: relative;}
    #mainnav ul.mainnav > li.menu-item-has-children > a:before {content: '';position: absolute;top: 50%;right: 5%;border: 4px solid transparent;border-left-color: #555;width: 0;height: 0;margin-top: -4px;}
    #mainnav ul.mainnav > li.menu-item-has-children > ul.sub-menu {position: fixed; top: 110px; z-index: 2; height: 100vh; right: 0; width: 500px; background: #fff; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: -webkit-transform .3s ease-in-out, box-shadow .3s ease-in-out;transition: transform .3s ease-in-out, box-shadow .3s ease-in-out;overflow-y: scroll;-webkit-overflow-scrolling: touch;}
    #mainnav ul.mainnav li.open ul.sub-menu {-webkit-transform:none; transform:none; pointer-events:auto;}

    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu {position: fixed; top: 110px; z-index: 2; right: 0; width: 500px; background: #fff; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: -webkit-transform .3s ease-in-out, box-shadow .3s ease-in-out;transition: transform .3s ease-in-out, box-shadow .3s ease-in-out;overflow-y: scroll;-webkit-overflow-scrolling: touch;}

    #mainnav ul.mainnav li.menu-item-has-children a {position: relative;}
    #mainnav ul.mainnav li.menu-item-has-children a:before {content: '';position: absolute;top: 50%;right: 5%;border: 4px solid transparent;border-left-color: #555;width: 0;height: 0;margin-top: -4px;}
    #mainnav ul.mainnav li.menu-item-has-children.open .sub-menu {-webkit-transform:none; transform:none; pointer-events:auto;}

    #mainnav ul.mainnav li.back a:before {display: none;}

    /* Mainnav Toggle */

    .mainnav-toggle {border-radius: 2px; display: block!important; position: absolute; transition: var(--transition); z-index: 10; top: 50%; right: 0;transform: translateY(-50%);width: 50px;height: 50px;background: var(--primary-color);box-shadow: 1px 2px 10px 0px rgba(0,0,0,0.3);}
    .mainnav-toggle.active {top: -5px; right: -2%; transition: var(--transition);}
    .mainnav-toggle .btn-mainnav-toggle {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 35px;cursor: pointer;}
    .mainnav-toggle .btn-mainnav-toggle span {display: block;width: 100%;box-shadow: 0 2px 10px 0 rgba(0,0,0,0.3);border-radius: 4px;height: 2px;background: #fff;transition: all .3s;position: relative;}
    .mainnav-toggle .btn-mainnav-toggle span + span {margin-top: 7px;}
    .mainnav-toggle .btn-mainnav-toggle.active span + span {margin-top: 13px;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(1) {animation: ease .7s top forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(1) {animation: ease .7s top-2 forwards;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(2) {animation: ease .7s scaled forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(2) {animation: ease .7s scaled-2 forwards;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(3) {animation: ease .7s bottom forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(3) {animation: ease .7s bottom-2 forwards;}

    @keyframes top { 0% {top: 0; transform: rotate(0);} 50% {top: 15px;transform: rotate(0);} 100% {top: 15px;transform: rotate(45deg);} }
    @keyframes top-2 { 0% {top: 15px;transform: rotate(45deg);} 50% {top: 15px;transform: rotate(0deg);} 100% {top: 0;transform: rotate(0deg);} }
    @keyframes bottom { 0% {bottom: 0;transform: rotate(0);} 50% {bottom: 15px;transform: rotate(0);} 100% {bottom: 15px;transform: rotate(135deg);} }
    @keyframes bottom-2 { 0% {bottom: 15px;transform: rotate(135deg);} 50% {bottom: 15px;transform: rotate(0);} 100% {bottom: 0;transform: rotate(0);} }
    @keyframes scaled { 50% {transform: scale(0);} 100% {transform: scale(0);} }
    @keyframes scaled-2 { 0% {transform: scale(0);} 50% {transform: scale(0);} 100% {transform: scale(1);} }
}

/* ########## Header ########## */

header {position: sticky; top: 0; width: 100%; z-index: 10; padding: 40px 0; transition: var(--transition); box-sizing: border-box; background: #fff; max-width: 1920px;}
header .header-grid {position: relative;}
header .header-grid .logo {width: 200px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 5; transition: var(--transition)}
header .header-grid .logo a {display: flex; align-items: center;}
header .header-grid .logo a svg #Zusatz {display: none;}
header .header-grid .mainnav-toggle {display: none;}

@media (max-width: 1150px) {
  header {padding: 60px 0;}
}

@media (max-width: 900px) {
  header .header-grid .logo {width: 120px;}
}

@media (max-width: 800px) {
  header .header-grid {display: block;}
}

/* Kopfbereich Startseite / Unterseite  */

.stage {width: 100%; aspect-ratio: 3/1; min-height: 350px; border-radius: var(--border-radius); max-width: 1240px; margin-left: auto; margin-right: auto; position: relative;}
.stage .btn {position: absolute; left: 50%; bottom: -30px; transform: translateX(-50%); max-width: 90%;}
.stage .instalink {position: absolute; bottom: -20px; left: 0; z-index: 10;}
.stage .instalink:before {position: absolute; content: ''; width: 40px; height: 2px; background: var(--secundary-color); left: 0; top: calc(50% + 1px);}
.stage .instalink .icon-wrp {width: 15px; height: 15px; display: block; margin-left: 50px;}
.stage .instalink .icon-wrp svg {width: 100%; height: 100%;}
.stage .instalink .icon-wrp svg path {stroke: var(--primary-color);}

.splideheader {width: 100%; aspect-ratio: 1240/415; border-radius: var(--border-radius); position: relative; z-index: 0; overflow: hidden;}
.splideheader .splide__track {height: 100%; position: relative;}
.splideheader .splide__track .splide__slide {width: 100%;}
.splideheader .splide__track .splide__slide img {height: 100%; width: 100%; object-fit: cover; border-radius: var(--border-radius);}

.stage img {width: 100%; height: 100%; object-fit: cover;}

.stage.subpage {margin: 0 auto; max-width: 1240px; border-radius: var(--border-radius); margin-bottom: 50px; overflow: hidden; position: relative;}

@media (max-width: 1150px) {
  .stage {min-height: 180px;}
}

@media (max-width: 500px) {
  .stage .instalink {display: none;}
}

/* ########## Content ########## */

/* Text */

.text.gray-bg {background: #f5f5f5; padding: 50px;}
.text.gray-bg.mb {margin-bottom: 50px!important;}
.text.small-wrp .wrp {max-width: 767px;}

/* Headline */

.headline h4,
.headline h2 {display: block; text-align: center;}
.headline.align-left h4,
.headline.align-left h2 {display: block; text-align: left;}
/* Text Bild */

.textbild .wrp {display: grid; align-items: stretch; grid-template-columns: 42% 50%; justify-content: space-between; box-sizing: border-box; background: #fff;}
.textbild .text {border-radius: 5px 0 0 5px; box-sizing: border-box;}
.textbild .bild { box-sizing: border-box; flex: 1; background-position: center center; background-size: cover; background-repeat: no-repeat; border-radius: var(--border-radius); overflow: hidden;}
.textbild .bild img {width: 100%; height: auto; vertical-align: bottom; visibility: hidden;}

.textbild strong.distance {width: 140px; display: inline-block;}

@media (max-width: 768px) {
  .textbild .wrp {grid-template-columns: 100%!important; gap: 50px;}
  .textbild .text {order: 1!important;}
  .textbild .bild {aspect-ratio: 1/1; order: 1!important;}
}

/* Image */

.image img{display:block;width:100%;height:auto;}

/* Call To Action */

.calltoaction {display: grid; place-items: center;}

/* Bildtrenner */

.bildtrenner {position: relative; width: 100%;}
.bildtrenner .bildtrenner-img {width: 100%; aspect-ratio: 4/1; min-height: 350px;}
.bildtrenner .bildtrenner-img img {width: 100%; height: 100%; object-fit: cover;}

.bildtrenner .wrp {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.bildtrenner .wrp .insta-banner {background: rgba(255,255,255,.7); backdrop-filter: blur(5px); width: 100%; max-width: 450px; padding: 50px; border-radius: var(--border-radius); box-sizing: border-box;}
.bildtrenner .wrp .insta-banner a {font-size: 20px; font-weight: 700;}

/* Galerie */

.gallery .filterrow {display: grid; grid-template-columns: auto auto; justify-content: space-between;}
.gallery .filterrow #filter {display: flex; gap: 20px;}
.gallery .filterrow #filter li {padding: 0 15px; background: var(--primary-color); color: #fff; font-weight: 600; list-style-type: none; margin: 0; border-radius: var(--border-radius); font-size: 14px; line-height: 45px; cursor: pointer;}
.gallery .filterrow #filter li.active {background: var(--secundary-color);}

.gallery .fresco-gallery:not(.masonry) {display: grid; gap: 50px; margin-bottom: 0;}
.gallery .fresco-gallery li {list-style-type: none; margin: 0 0 25px 0; border-radius: 5px;overflow: hidden;}
.gallery .fresco-gallery:not(.masonry) li {margin: 0 0 50px 0;}
.gallery .fresco-gallery li a {position: relative; display: block; border-radius: var(--border-radius); overflow: hidden;}
.gallery .fresco-gallery li a .overlay {width: 100%; position: absolute; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: var(--secundary-color); opacity: 0; transition: var(--transition);}
.gallery .fresco-gallery li a:hover .overlay {opacity: 0.6; transition: var(--transition);}
.gallery .fresco-gallery li a .overlay .icon-wrp {position: absolute; top: 50%; left: 50%; width: 45px; height: 45px; transform: translate(-50%, -50%);}
.gallery .fresco-gallery li a .overlay .icon-wrp svg {width: 100%; height: 100%; transform: scale(0); transition: var(--transition);}
.gallery .fresco-gallery li a .overlay .icon-wrp svg path {fill: #fff;}
.gallery .fresco-gallery li a:hover .overlay .icon-wrp svg { transform: scale(1); transition: var(--transition);}
.gallery .fresco-gallery li img {width: 100%;}

.gallery .fresco-gallery.masonry {gap: 25px; columns: 4; margin: 0 auto;}

.gallery .video-gallery-grid {display: grid; grid-column-gap: 50px; grid-row-gap: 50px;}
.gallery .video-gallery-grid .video-gallery-item {height: 220px; width: 100%; display: block; position: relative; overflow: hidden; border-radius: var(--border-radius);}
.gallery .video-gallery-grid .video-gallery-item .overlay {width: 100%; position: absolute; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: var(--secundary-color); opacity: 0; transition: var(--transition); z-index: 4;}
.gallery .video-gallery-grid .video-gallery-item:hover .overlay {opacity: 0.6; transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp {position: absolute; top: 50%; left: 50%; width: 45px; height: 45px; transform: translate(-50%, -50%);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp svg {width: 100%; height: 100%; transform: scale(0); transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp svg path {fill: #fff!important;}
.gallery .video-gallery-grid .video-gallery-item:hover .overlay .icon-wrp svg { transform: scale(1); transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item img {height: 100%; width: 100%; object-fit: cover; object-position: center; transform: scale(1.2);}

.gallery .video-gallery-grid h4 {padding: 10px 0 0 0; display: block; margin-bottom: 0;}

@media (max-width: 1024px) {
  .gallery .fresco-gallery {grid-template-columns: repeat(4, 1fr)!important;}
  .gallery .video-gallery-grid {grid-template-columns: repeat(2, 1fr)!important;}
  .gallery .filterrow {display: grid; grid-template-columns: 100%; gap: 25px;}
  .gallery .filterrow #filter {flex-wrap: wrap;}
  .gallery .fresco-gallery.masonry {columns: 3;}

}

@media (max-width: 550px) {
  .gallery .video-gallery-grid {grid-template-columns: 100%!important;}
  .gallery .fresco-gallery {grid-template-columns: repeat(2, 1fr)!important;}
  .gallery .fresco-gallery.masonry {columns: 2;}
}

/* oEmbed */

.embed .respo-video{position: relative;height: 0;overflow: hidden; padding-bottom: 56.25%;}
.embed .respo-video iframe {position: absolute; top: 0; left: 0; width: 100%;	height: 100%;}

/* Shortcode */

.shortcode.small-wrp .wrp {max-width: 767px;}

/* Teasercards */

.teasercards .splide ul.cards {display: flex; grid-column-gap: unset;}

.teasercards ul.cards li {overflow: hidden;}

.teasercards ul.cards li a img {transition: var(--transition); width: 100%; aspect-ratio: 2/1.5; height: auto; object-fit: cover;}
.teasercards ul.cards li:hover a img {transform: scale(1.1); transition: var(--transition);}

.teasercards ul.cards li a .text {position: absolute; transition: var(--transition); bottom: 25px; left: 25px; font-size: 28px; font-weight: 600;}
.teasercards ul.cards li a .learnmore {position: absolute; bottom: 15px; left: 25px; color: #fff; font-size: 14px; font-weight: 600; opacity: 0; transition: .2s ease-in-out;}

.teasercards ul.cards li:hover a .text {transform: translateY(-20px); transition: var(--transition);}
.teasercards ul.cards li:hover a .learnmore {opacity: 1; transition: .4s ease-in-out; color: #fff;}

.teasercards ul.cards.no-carousel {display: grid; grid-column-gap: 50px; grid-row-gap: 50px; margin: 0;}
.teasercards ul.cards.no-carousel li {list-style-type: none; margin: 0; position: relative;}

@media (max-width: 767px) {
  .teasercards ul.cards.no-carousel {grid-template-columns: 100%!important;}

}

/* Accordion */

.accordion .item-accordion-head {cursor: pointer; position: relative; background: #f2f2f2; margin-bottom:10px; padding:10px 25px 10px 10px; border:1px solid #f2f2f2;}
.accordion .active .item-accordion-head {background-color:#f8f8f8}
.accordion .item-accordion-btn {width: 26px; height: 26px;float: right; margin: 0; cursor: pointer; position: absolute; right: 5px; top: 50%; transform: translateY(-50%);}
.accordion .item-accordion-btn:before {content: '-'; color: #555; position: absolute; width: 26px; height: 26px; text-align: center; line-height: 22px; font-size: 24px;}
.accordion .item-accordion {margin-bottom: 5px; }
.accordion .item-accordion.hidden .item-accordion-btn:before {content: '+'; line-height: 26px;}
.accordion .item-accordion.active .item-accordion-btn:before {content: '-'; line-height: 22px; }
.accordion .item-accordion.hidden.active .item-accordion-btn:before {content: '-'; line-height: 22px;}
.accordion .item-accordion.hidden .item-accordion-content {display: none;padding:20px 20px;background:#f8f8f8;margin-bottom:10px;}
.accordion .item-accordion.hidden .item-accordion-content:after {display:block;width: 0;height: 0;border-right: 100px solid #037CA9;border-top: 50px solid transparent;border-bottom: 50px solid transparent;}

/* ########## Blog ########## */

main.withsidebar .content .blog-grid {display: grid; grid-template-columns: repeat(3, 1fr); grid-column-gap: 50px; grid-row-gap: 50px;}
main.withsidebar .content .blog-grid .post {width: 100%;}
main.withsidebar .content .blog-grid .post img {width: 100%; height: auto; object-fit: cover;}

article.singlepost .post-image {}
article.singlepost .post-image img {width: 100%; height: auto; object-fit: cover;}

@media (max-width: 768px) {
  main.withsidebar .content .blog-grid {grid-template-columns: repeat(2, 1fr);}
}

/* ########## Footer ########## */

footer {background: rgba(151,192,216,0.1); padding: 75px 0;}
footer .footer-logo {display: block; margin: 0 auto 50px auto; width: 170px;}
footer .footernav {display: flex; justify-content: center;}
footer .footernav .bottom_nav {display: flex; gap: 50px;flex-wrap: wrap;justify-content: center;}
footer .footernav .bottom_nav li {flex-basis: 150px; list-style: none; margin: 0; text-align: center;}
footer .footernav .bottom_nav li:first-child {margin-left: 0;}
footer .footernav .bottom_nav li a {font-weight: 700; text-transform: uppercase;}

footer .mail {display: block; text-align: center;}
footer .mail a {font-size: 35px; font-weight: 600;}

@media (max-width: 600px) {
  footer .mail a {font-size: 20px;}
}

/* Bottom */

.bottom {display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
.bottom .copyright,
.bottom .copyright a {font-size: 14px; font-weight: 600; text-align: center;}

/* 404 */

body.error404 {position: relative; height: 100vh;}
body.error404 main .content {margin-top: 150px;}
body.error404 footer {position: absolute; bottom: 0; width: 100%;}

.page-id-32 p {word-break: break-word;}
