/*
 Theme Name:     Ocean
 Theme URI:      https://oceanwp.org/
 Author:         pixeltypen / Tobias Bals
 Author URI:     https://pixeltypen.de
 Template:       oceanwp
 Version:        1.0.0
*/

/* Ab hier kannst du deine CSS-Anpassungen eintragen
------------------------------------------------------- */

/* Load fonts locally */

@font-face {
    font-family: 'Lato';
    src: url('./fonts/Lato-BoldItalic.woff2') format('woff2'),
        url('./fonts/Lato-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('./fonts/Lato-Italic.woff2') format('woff2'),
        url('./fonts/Lato-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('./fonts/Lato-BlackItalic.woff2') format('woff2'),
        url('./fonts/Lato-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('./fonts/Lato-Black.woff2') format('woff2'),
        url('./fonts/Lato-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('./fonts/Lato-Bold.woff2') format('woff2'),
        url('./fonts/Lato-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato Hairline';
    src: url('./fonts/Lato-HairlineItalic.woff2') format('woff2'),
        url('./fonts/Lato-HairlineItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('./fonts/Lato-LightItalic.woff2') format('woff2'),
        url('./fonts/Lato-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Lato Hairline';
    src: url('./fonts/Lato-Hairline.woff2') format('woff2'),
        url('./fonts/Lato-Hairline.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('./fonts/Lato-Light.woff2') format('woff2'),
        url('./fonts/Lato-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('./fonts/Lato-Regular.woff2') format('woff2'),
        url('./fonts/Lato-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



/* General Settings */

/* Adjust Custom Colors here */
:root {
  --primary: #506dfa;
  --black: #111517;
  --yellow: #fbc900;
  --dark-blue: #004076;
  --light-blue: #006eb6;
}

body {
  overflow-x: hidden;
}

#site-header {
  z-index: 9999;
}

/* Typography */
.elementor :is(h1, h2, h3, h4, h5, h6) {
  -webkit-hyphens: auto !important;
  -ms-hyphens: auto !important;
  hyphens: auto !important;
}

/* Text Stroke */

.text-stroke {
  --stroke-width: 5px;
}

.text-stroke.white {
  --stroke-color: #fff;
}

.text-stroke.brightblue {
  --stroke-color: #006eb6;
}

.text-stroke.darkblue {
  --stroke-color: #004076;
}

.text-stroke.yellow {
  --stroke-color: #fbc900;
}

/* Top bar Wrap */

#top-bar-wrap {
  display: none !important;
}

/* Fullscreen Menu */

.fullscreen-menu h3 a {
  font-family: "Bjola", Sans-serif !important;
}

#elementor-popup-modal-562 .dialog-message {
  overflow-x: hidden;
}

/* SHRINKING LOGO */

.sticky-logo img {
  width: 240px !important;
}

.sticky-logo,
.bazi-logo {
  -webkit-transition: 0.2s all ease-in-out;
  -o-transition: 0.2s all ease-in-out;
  transition: 0.2s all ease-in-out;
  margin: 0 !important;
}

header.sticky-header {
  -webkit-transition: 0.2s all ease-in-out;
  -o-transition: 0.2s all ease-in-out;
  transition: 0.2s all ease-in-out;
}

header.sticky-header .sticky-logo {
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
}

header.sticky-header .bazi-logo {
  position: absolute;
  -webkit-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px);
  opacity: 0;
}

header .bazi-logo img {
  width: 50px !important;
}

header.elementor-sticky--effects.sticky-header {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  background-color: #004076ff !important;
}

header.elementor-sticky--effects .bazi-logo {
  opacity: 1;
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
}

header.elementor-sticky--effects .sticky-logo {
  opacity: 0;
  -webkit-transform: translateY(-50px);
  -ms-transform: translateY(-50px);
  transform: translateY(-50px);
}

header.elementor-sticky--effects .elementor-icon-box-icon {
  margin-bottom: 0 !important;
  line-height: 1 !important;
}

header.elementor-sticky--effects .elementor-icon-box-content {
  height: 0;
  opacity: 0 !important;
}

header.elementor-sticky--effects
  .elementor-widget-wrap.elementor-element-populated {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

/* Start Teaser-Boxes with Border Radius */

/* Safari Fix */

.elementor-cta .elementor-cta__bg-wrapper {
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
}

/* Fun Foto */
.funfoto-form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 20px;
  -moz-column-gap: 20px;
  column-gap: 20px;
}

.funfoto-form input#funfoto-code {
  border: 0;
  border-radius: 5px;
  background-color: white;
  color: var(--dark-blue);
  padding: 10px;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.funfoto-form :is(button#funfoto-button, button#funfoto-button:hover) {
  border: 0;
  background-color: var(--yellow);
  color: white;
  font-weight: 600;
  font-size: 16px;
  padding: 5px 20px;
  border-radius: 30px;
  -webkit-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}

.funfoto-form :is(button#funfoto-button:hover) {
  background-color: var(--dark-blue);
}

.funfoto-image-wrapper {
  padding: 20px;
  border-radius: 20px;
  background-color: white;
  margin-top: 20px;
  border: 4px solid var(--dark-blue);
  display: none;
}

.funfoto-image-wrapper img {
  width: 100%;
  display: none;
}

/* Fix Safari Issue */

/* .dialog-prevent-scroll {
  pointer-events: none;
  overflow: hidden !important;
  touch-action: none;
}
*/

@media screen and (max-width: 1024px) {
  .dialog-prevent-scroll .dialog-widget {
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
  }

  .mega-menu-popup
    .dialog-message
    .elementor-section:not(.elementor-inner-section):last-child
    > .elementor-container {
    min-height: 100vh;
    align-items: flex-start;
  }
}

/* Responsive */

@media screen and (max-width: 1270px) {
  .fullwidth-menu-bazi {
    right: 0 !important;
    bottom: 0 !important;
  }

  .fullwidth-menu-bazi .elementor-widget-container {
    text-align: right !important;
  }

  .fullwidth-menu-bazi img {
    max-width: 60% !important;
    -webkit-transform: translateY(50%);
    -ms-transform: translateY(50%);
    transform: translateY(50%);
  }
}

@media screen and (max-width: 767px) {
  .sticky-logo img {
    min-width: 180px;
  }

  .elementor-sticky--effects .sticky-logo img {
    width: 180px !important;
  }

  /* Popup Header with Logo + Socials */
  .fullwidth-menu-header .elementor-col-50 {
    width: 100% !important;
  }

  .fullwidth-menu-header .elementor-social-icons-wrapper {
    text-align: left;
  }

  /* Start Dogs Allowed Badge */

  .dogs-allowed-badge {
    top: -100px !important;
    right: 0 !important;
    text-align: right !important;
    padding-right: 20px;
  }

  .dogs-allowed-badge img {
    max-width: 150px !important;
  }
}

@media screen and (max-width: 478px) {
  .text-stroke {
    --stroke-width: 4px;
  }
}