/*
	Theme Name: Steuerberater OL
	Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
	Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
	Author: Elementor Team
	Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
	Version: 3.0.2
	Stable tag: 3.0.1
	Requires at least: 6.0
	Tested up to: 6.4
	Requires PHP: 7.3
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: hello-elementor
	Tags: accessibility-ready, flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready,
*/
/**
 * Loading first in the style.scss & classic-editor.scss
 */
/**
* Document basic styling
* Inspired by Normalize.css, HTML5 Boilerplate & Bootstrap Reboot Projects under MIT License
 */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.
 */

:root {
    --gal-img-wide: 45vw;
    --gal-img-narrow: 35vw;
    --gal-col-gap: 3vw;
    --col-1-gap: 6.25vw;
    --col-gap: 2vw;
    scroll-behavior: smooth;
}

#happy-headline h2 {
    font-size: 40px !important;
}

#happy-headline {
    top: 25vh !important;
}

html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
}

*,
*::before,
*::after {
    box-sizing: border-box; /* 3 */
}

  #loftloader-wrapper.loftloader-square #loader {
    width: 150px;
    height: 150px;
    transform-origin: 50% 50%;
    -webkit-animation: spinReturn 4s ease infinite;
    animation: spinReturn 4s ease infinite;
}

.gal-img-35 {
    --container-widget-width: var(--gal-img-narrow) !important;
    z-index: 99;
}

.gal-img-45 {
    --container-widget-width: var(--gal-img-wide) !important;
    z-index: 99;
}

.gal-img-35 video {
    width: var(--gal-img-narrow) !important;
}

.gal-img-45 video {
    width: var(--gal-img-wide) !important;
}

@media screen and (min-width: 1140px) {
    /* .gal-img-35 video {
    width: calc(var(--gal-img-narrow) * 0.7) !important;
  }

  .gal-img-45 video {
    width: calc(var(--gal-img-wide) * 0.7) !important;
  } */

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.75) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.75) !important;
    }

    #team-section {
        max-width: 600px !important;
    }
}

@media screen and (min-width: 1140px) and (min-height: 1024px) {
    /* .gal-img-35 video {
    width: calc(var(--gal-img-narrow) * 0.7) !important;
  }

  .gal-img-45 video {
    width: calc(var(--gal-img-wide) * 0.7) !important;
  } */

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.75) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.75) !important;
    }

    #team-section {
        max-width: 400px !important;
    }
}

@media screen and (min-width: 1024px) and (max-height: 768px) {
    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 0.55) !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 0.55) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.55) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.55) !important;
    }

    #team-section {
        max-width: 600px !important;
    }
}

@media screen and (max-width: 1540px) and (min-height: 768px) {
    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 0.7) !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 0.7) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.7) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.7) !important;
    }

    #team-section {
        max-width: 400px !important;
    }
}

@media screen and (min-width: 1540px) and (min-height: 1080px) {
    #team-section {
        max-width: 500px !important;
    }

    .h-scroll-wrapper {
        --gap: 100px !important;
    }
}

@media screen and (min-width: 1540px) and (max-height: 1080px) {
    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 0.7) !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 0.7) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.7) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.7) !important;
    }

    #team-section {
        max-width: 300px !important;
    }
}

@media screen and (min-width: 1850px) and (min-height: 1080px) {
    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 0.6) !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 0.6) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.6) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.6) !important;
    }

    #team-section {
        max-width: 400px !important;
    }

    .h-scroll-wrapper {
        --gap: 120px !important;
    }
}

@media screen and (min-width: 1850px) and (max-height: 1080px) {
    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 0.5) !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 0.5) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.5) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.5) !important;
    }

    #team-section {
        max-width: 300px !important;
    }

    .h-scroll-wrapper {
        --gap: 100px !important;
    }
}

@media screen and (min-width: 2560px) {
    .h-scroll-wrapper {
        --gap: 200px !important;
    }

    #team-section {
        max-width: 600px !important;
    }
}

html,
body {
    overflow-x: hidden;
    width: 100%;
}

.heading-line h2 {
    color: rgba(42, 64, 94, 0.5) !important;
}

.styled-word {
    color: rgba(42, 64, 94, 1);
}

.swiper-button-prev {
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48.51 82.95"><defs><style> .cls-1 { fill: %2332417d; stroke-width: 0px; } </style></defs><g id="Layer_1" data-name="Layer 1"><path class="cls-1" d="M47.8,74.12c.94.94.94,2.47,0,3.41l-4.72,4.71c-.94.94-2.46.94-3.4,0L.71,43.28c-.5-.5-.73-1.15-.71-1.8-.02-.65.21-1.3.71-1.8L39.68.71c.94-.94,2.46-.94,3.4,0l4.72,4.71c.94.94.94,2.47,0,3.41L15.15,41.47l32.65,32.65Z"/></g></svg>');
    left: -35% !important;
    background-repeat: no-repeat;
    scale: 1.5;
}

.swiper-button-next {
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48.5 82.95"><defs><style> .cls-1 { fill: %2332417d; stroke-width: 0px; } </style></defs><g id="Layer_1" data-name="Layer 1"><path class="cls-1" d="M48.49,41.47c.02.65-.21,1.3-.71,1.8L8.82,82.24c-.94.94-2.47.94-3.41,0l-4.71-4.71c-.94-.94-.94-2.47,0-3.41l32.64-32.65L.71,8.82c-.94-.94-.94-2.47,0-3.41L5.42.71c.94-.94,2.47-.94,3.41,0l38.96,38.97c.5.5.73,1.15.71,1.8Z"/></g></svg>');
    right: -35% !important;
    background-repeat: no-repeat;
    scale: 1.5;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-family: inherit !important;
    content: initial !important;
}

/* Sections
 */
body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji",
        "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #333333;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden !important;
    max-width: 100% !important;
    padding: 0;
}

#say-hi {
    z-index: 5;
    right: 25px;
}

.site-footer {
    display: none;
}

.mySwiper {
    cursor: url("https://steuerberater-ol.de/wp-content/uploads/2024/06/RR_STB_FLIP_IT-1.svg"),
        auto !important;
}

.elementor-accordion .elementor-accordion-item:first-of-type {
    display: none;
}

a,
.menu-item a {
    color: #2c4260;
    text-decoration: none;
}

.menu-item a:hover {
    color: #2c4260 !important;
}
.cmplz-manage-consent {
    display: none;
}

.menu-item a::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #2c4260;
    transform: scaleX(0);
    transition: transform 0.3s ease;
}

.menu-item a:hover::before {
    transform: scaleX(1);
}

#greeting {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

#greeting h2 {
    font-size: calc(
        90px + (230 - 90) * ((100vw - 992px) / (2560 - 992))
    ) !important;
    color: white !important;
    font-family:
        sofia sans,
        Sans-serif;
    font-size: 180px;
    font-weight: 900;
    text-shadow: 8px 9px 10px rgba(0, 0, 0, 0.39);
}

#corporate-title {
    font-size: calc(
        18px + (26 - 18) * ((100vw - 992px) / (2560 - 992))
    ) !important;
}

h1 {
    /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
    font-size: clamp(64px, 4vw, 180px) !important;
}

.heading-line h2 {
    /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
    font-size: clamp(1em, 4vw, 4em) !important;
}

#hide-header {
    width: calc(
        250px + (380 - 250) * ((100vw - 768px) / (2560 - 768))
    ) !important;
}

.swiper {
    width: calc(
        400px + (600 - 400) * ((100vw - 768px) / (2560 - 768))
    ) !important;
    height: calc(
        56vh + (70 - 60) * ((100vw - 768px) / (2560 - 768))
    ) !important;
}

.swiper-slide h2,
.elementor-accordion-title {
    font-size: calc(30px + (44 - 30) * ((100vw - 992px) / (2560 - 992)));
}
.swiper-slide .swiper-desc,
.elementor-tab-content {
    font-size: calc(
        18px + (26 - 18) * ((100vw - 992px) / (2560 - 992))
    ) !important;
}

.dot {
    width: calc(10px + (25 - 10) * ((100vw - 768px) / (2560 - 768))) !important;
    height: calc(
        10px + (25 - 10) * ((100vw - 768px) / (2560 - 768))
    ) !important;
}

#say-hi img {
    width: calc(
        60px + (100 - 60) * ((100vw - 768px) / (2560 - 768))
    ) !important;
}

.dialog-close-button,
#legal-close {
    right: calc(20px + (60 - 20) * ((100vw - 768px) / (2560 - 768)));
}

img.attachment-full.size-full.wp-image-3493 {
    width: 350px;
    margin-top: 20px;
}

.page-id-3032,
.page-id-3035 {
    background: #2e55a3 !important;
}

.page-id-3032 a,
.page-id-3035 a {
    color: white !important;
}

.elementor-accordion-icon.elementor-accordion-icon-right {
    margin-left: 20px;
    margin-top: 1px;
    font-size: 30px;
}

@media screen and (max-height: 1000px) {
    .cinemagraph {
        scale: 0.8;
    }
    .c-bottom-1 {
        margin-top: -20vh;
    }
    .c-bottom-2 {
        margin-top: -15vh;
    }

    #flipit {
        width: 55% !important;
    }

    .swiper-slide h2,
    .swiper-slide span {
        scale: 0.85;
    }
}

@media screen and (max-height: 1300px) and (min-width: 1900px) {
    .cinemagraph {
        scale: 0.7;
    }
    .c-bottom-1 {
        margin-top: -21vh;
    }
    .c-bottom-2 {
        margin-top: -16vh;
    }
}

@media screen and (max-height: 1000px) and (min-width: 1800px) {
    .cinemagraph {
        scale: 0.6;
        --container-widget-width: 95% !important;
    }

    /* .h-scroll-section {
    margin-top: 0;
  } */

    .c-top-1 {
        --container-widget-width: 75% !important;
    }

    .c-top-3 {
        margin-top: -30vh;
    }

    .c-bottom-1 {
        margin-top: -28vh;
    }
    .c-bottom-2 {
        margin-top: -35vh;
        --container-widget-width: 75% !important;
    }
    #flipit {
        width: 55% !important;
    }

    .swiper-slide h2,
    .swiper-slide span {
        scale: 0.85;
    }
}

/* @media screen and (min-width: 1700px) {
#service-headline {
  margin-top: -120px !important;
}
} */

img#flipit {
    vertical-align: middle;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    transform: translate(0, 50%);
}

@media screen and (min-width: 1700px) and (max-height: 1300px) {
    .heading-line h2 {
        /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
        font-size: 3em !important;
    }
}

@media screen and (min-width: 2000px) {
    /* .tooltip {
top: 85% !important;
padding-left: 10px !important;
} */

    #news-section {
        --justify-content: center;
    }

    #abo-container {
        margin-top: 15vh;
    }

    #jobs-accordion {
        padding-top: 0;
    }

    canvas {
        height: 70vh;
        margin-top: 3% !important;
    }
}

@media screen and (max-width: 992px) {
    .show-nav-left .mobmenu-panel.show-panel {
        scale: 1.05;
        transform: translate(15px, 5px);
    }

    .swiper-button-next,
    .swiper-button-prev {
        display: none;
    }

    #greeting h2 {
        font-size: 74px !important;
    }

    .heading-line h2 {
        /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
        font-size: clamp(3em, 4vw, 4em) !important;
    }

    .swiper {
        width: calc(
            350px + (600 - 350) * ((100vw - 768px) / (2560 - 768))
        ) !important;
        height: calc(
            58vh + (70 - 58) * ((100vw - 768px) / (2560 - 768))
        ) !important;
    }

    h1 {
        /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
        font-size: clamp(38px, 4vw, 180px) !important;
    }

    .nav-dots {
        display: none;
    }

    div#hide-header {
        top: 25px;
        width: 230px;
        z-index: 9999;
    }

    .intro-video {
        translate: none;
        rotate: none;
        scale: none;
        transform: translate3d(50vw, inherit, inherit) !important;
        transition: unset;
    }

    .elementor-accordion-title {
        font-size: 22px !important;
    }

    canvas {
        height: 48vh !important;
        scale: 1.7;
    }

    .mobmenul-container {
        top: 40px;
        left: -15px;
    }

    #say-hi {
        top: 35px;
        right: 15px;
        z-index: 99;
        position: fixed;
    }

    div#corner-logo {
        width: 100px !important;
        left: -5px;
        bottom: 0px;
    }

    .mobmenul-container,
    .mobmenur-container {
        position: fixed;
    }
}

/* END MEDIA QUERIES */

.faq-player {
    width: 85% !important;
    position: absolute;
    bottom: 40px;
    left: 50% !important;
    transform: translateX(-50%) !important;
}

#mobmenuleft .mob-expand-submenu,
#mobmenuleft > .widgettitle,
#mobmenuleft li a,
#mobmenuleft li a:visited,
#mobmenuleft .mobmenu-content h2,
#mobmenuleft .mobmenu-content h3,
.mobmenu-left-panel .mobmenu-display-name,
.mobmenu-content .mobmenu-tabs-header li {
    font-family: "Sofia Sans Condensed" !important;
}

#mobmenuleft {
    padding-top: 10vh !important;
}

.mobmenu-left-panel .mobmenu-left-bt,
.mobmenu-right-panel .mobmenu-right-bt {
    position: absolute;
    right: 0 !important;
    top: 30px !important;
    font-size: 30px;
}

#mobmenuleft,
#mobmenuright {
    margin: 0;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.menu-item-type-custom a:hover {
    color: white !important;
}

.mob-icon-cancel-2:before {
    content: "\02df" !important;
    font-size: 100px !important;
}

[class^="mob-icon-"]:before,
[class*=" mob-icon-"]:before {
    margin-right: -0.3em !important;
}

.dot:hover .tooltip {
    opacity: 1;
    visibility: visible;
}

.copyright {
    display: none !important;
}

.tooltip {
    position: absolute;
    color: #2a405f;
    padding: 0;
    top: 55%;
    transform: translateY(-50%);
    left: 30px;
    white-space: nowrap;
    font-family: sofia sans condensed;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: 1px;
    opacity: 0;
    visibility: hidden;
    transition:
        opacity 0.3s,
        visibility 0.3s;
    pointer-events: none;
}

.elementor-accordion-item .elementor-tab-title,
.elementor-accordion-item .elementor-tab-content {
    background-color: #274889 !important;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-block-start: 0.5rem;
    margin-block-end: 1rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.2;
    color: inherit;
}

h1 {
    font-size: 2.5rem;
}

h2 {
    font-size: 2rem;
}

h3 {
    font-size: 1.75rem;
}

h4 {
    font-size: 1.5rem;
}

h5 {
    font-size: 1.25rem;
}

h6 {
    font-size: 1rem;
}

p {
    margin-block-start: 0;
    margin-block-end: 0.9rem;
}

/* Grouping content
 */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
    white-space: pre-wrap;
}

/* Text-level semantics
 */
a {
    background-color: transparent;
    text-decoration: none;
    color: #cc3366;
}
a:hover,
a:active {
    color: #333366;
}
a:not([href]):not([tabindex]) {
    color: inherit;
    text-decoration: none;
}
a:not([href]):not([tabindex]):hover,
a:not([href]):not([tabindex]):focus {
    color: inherit;
    text-decoration: none;
}
a:not([href]):not([tabindex]):focus {
    outline: 0;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
    border-block-end: none; /* 1 */
    text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
    font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* Embedded content
 */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
    border-style: none;
    height: auto;
    max-width: 100%;
}

/* Interactive
 */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
    display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
    display: list-item;
}

figcaption {
    font-size: 16px;
    color: #333333;
    line-height: 1.4;
    font-style: italic;
    font-weight: 400;
}

/* Misc
 */
/**
 * Add the correct display in IE 10+.
 */
template {
    display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
    display: none;
}

/* Print
 */
@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important; /* Black prints faster */
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    a,
    a:visited {
        text-decoration: underline;
    }
    a[href]:after {
        content: " (" attr(href) ")";
    }
    abbr[title]:after {
        content: " (" attr(title) ")";
    }
    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }
    pre {
        white-space: pre-wrap !important;
    }
    pre,
    blockquote {
        break-inside: avoid;
        border: 1px solid #cccccc;
    }
    thead {
        display: table-header-group;
    }
    tr,
    img {
        break-inside: avoid;
    }
    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }
    h2,
    h3 {
        break-after: avoid;
    }
}
/**
 * Form styling
 */
label {
    display: inline-block;
    line-height: 1;
    vertical-align: middle;
}

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
    font-family: inherit; /* 1 */
    font-size: 1rem; /* 1 */
    line-height: 1.5; /* 1 */
    margin: 0; /* 2 */
}

input[type="text"],
input[type="date"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
select,
textarea {
    width: 100%;
    border: solid 1px #666666;
    border-radius: 3px;
    padding: 0.5rem 1rem;
    transition: all 0.3s;
}
input[type="text"]:focus,
input[type="date"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus {
    border-color: #333333;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
    /* 1 */
    overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
    /* 1 */
    text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
    width: auto;
    --webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}

button,
[type="submit"],
[type="button"] {
    display: inline-block;
    font-weight: 400;
    color: #cc3366;
    text-align: center;
    white-space: nowrap;
    user-select: none;
    background-color: transparent;
    border: 1px solid #cc3366;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    border-radius: 3px;
    transition: all 0.3s;
}
button:focus,
[type="submit"]:focus,
[type="button"]:focus {
    outline: 5px auto -webkit-focus-ring-color;
}
button:hover,
button:focus,
[type="submit"]:hover,
[type="submit"]:focus,
[type="button"]:hover,
[type="button"]:focus {
    color: #ffffff;
    background-color: #cc3366;
    text-decoration: none;
}
button:not(:disabled),
[type="submit"]:not(:disabled),
[type="button"]:not(:disabled) {
    cursor: pointer;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
    padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
    vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
    overflow: auto;
    resize: vertical;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
}

select {
    display: block;
}

/**
 * Table styling
 */
table {
    background-color: transparent;
    width: 100%;
    margin-block-end: 15px;
    font-size: 0.9em;
    border-spacing: 0;
    border-collapse: collapse;
}
table th,
table td {
    padding: 15px;
    line-height: 1.5;
    vertical-align: top;
    border: 1px solid rgba(128, 128, 128, 0.5019607843);
}
table th {
    font-weight: bold;
}
table thead th,
table tfoot th {
    font-size: 1em;
}
table caption + thead tr:first-child th,
table caption + thead tr:first-child td,
table caption + thead tr:first-child th,
table caption + thead tr:first-child td,
table colgroup + thead tr:first-child th,
table colgroup + thead tr:first-child td,
table colgroup + thead tr:first-child th,
table colgroup + thead tr:first-child td,
table thead:first-child tr:first-child th,
table thead:first-child tr:first-child td,
table thead:first-child tr:first-child th,
table thead:first-child tr:first-child td {
    border-block-start: 1px solid rgba(128, 128, 128, 0.5019607843);
}
table tbody > tr:nth-child(odd) > td,
table tbody > tr:nth-child(odd) > th {
    background-color: rgba(128, 128, 128, 0.0705882353);
}
table tbody tr:hover > td,
table tbody tr:hover > th {
    background-color: rgba(128, 128, 128, 0.1019607843);
}
table tbody + tbody {
    border-block-start: 2px solid rgba(128, 128, 128, 0.5019607843);
}
@media (max-width: 767px) {
    table table {
        font-size: 0.8em;
    }
    table table th,
    table table td {
        padding: 7px;
        line-height: 1.3;
    }
    table table th {
        font-weight: 400;
    }
}

/**
 * List styling
 */
dl,
dt,
dd,
ol,
ul,
li {
    margin-block-start: 0;
    margin-block-end: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

/* All modern Retina iPads in Portrait */
@media only screen and (min-width: 740px) and (max-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2),
    only screen and (min-device-width: 740px) and (max-device-width: 1024px) and (orientation: portrait) and (min-resolution: 192dpi) {
    /* Your CSS rules for all modern Retina iPads in portrait mode */

    .cinemagraph {
        scale: 0.8 !important;
    }

    #happy-headline h2 {
        font-size: 28px !important;
    }

    audio.faq-player {
        bottom: 100px !important;
    }

    audio:nth-child(1) {
        padding-left: 30px;
    }

    audio:nth-child(2) {
        padding-left: 60px;
        padding-bottom: 30px;
    }
    audio:nth-child(3) {
        padding-left: 90px;
        padding-bottom: 60px;
    }
    audio:nth-child(4) {
        padding-left: 120px;
        padding-bottom: 90px;
    }

    #gal-col-1,
    #gal-col-2,
    #gal-col-3 {
        --container-max-width: 1140px !important;
    }

    canvas {
        height: 48vh !important;
        scale: 1.3 !important;
    }

    h1 {
        /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
        font-size: 64px !important;
    }

    .show-nav-left .mobmenu-panel.show-panel {
        scale: 1.05;
        transform: translate(15px, 5px);
    }

    .heading-line h2 {
        /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
        font-size: clamp(3em, 4vw, 4em) !important;
    }

    .swiper {
        width: calc(
            350px + (600 - 350) * ((100vw - 768px) / (2560 - 768))
        ) !important;
        height: calc(
            58vh + (70 - 58) * ((100vw - 768px) / (2560 - 768))
        ) !important;
    }

    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 1.5) !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 1.5) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 1.5) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 1.5) !important;
    }

    .h-scroll-wrapper {
        --gap: 80px !important;
    }

    #team-section {
        max-width: 700px !important;
    }

    .nav-dots {
        display: none;
    }

    div#hide-header {
        top: 25px;
        width: 230px;
        z-index: 9999;
    }

    .intro-video {
        translate: none;
        rotate: none;
        scale: none;
        transform: translate3d(30vw, inherit, inherit) !important;
        transition: unset;
    }

    .mobmenul-container {
        top: 40px;
        left: -15px;
    }

    #say-hi {
        top: 35px;
        right: 15px;
        z-index: 99;
        position: fixed;
    }

    div#corner-logo {
        width: 100px !important;
        left: -5px;
        bottom: 0px;
    }

    .swiper {
        width: 55vw !important;
    }

    .mobmenul-container,
    .mobmenur-container {
        position: fixed;
    }

    #news-section {
        --justify-content: center;
    }

    .cinemagraph {
        scale: 0.6;
        --container-widget-width: 95% !important;
    }

    /* .h-scroll-section {
  margin-top: 20vh;
} */

    .c-top-1 {
        --container-widget-width: 95% !important;
        margin-top: 3vh;
    }

    .c-top-2 {
        padding-top: 0;
        margin-bottom: 10vh !important;
    }

    .c-top-3 {
        margin-top: -30vh;
        --container-widget-width: 100% !important;
    }

    .c-bottom-1 {
        margin-top: -5vh;
    }
    .c-bottom-2 {
        margin-top: -14vh;
        --container-widget-width: 75% !important;
    }

    #newsletter {
        margin-top: -30vh;
    }

    #faq-swiper-section {
        margin-top: -10vh;
    }
}

/* For Mobile Portrait View */
@media screen and (max-device-width: 480px) and (orientation: portrait) {
    body {
        width: 100%;
    }

    audio.faq-player {
        bottom: 50px !important;
    }

    audio:nth-child(1) {
        padding-left: 30px;
    }

    audio:nth-child(2) {
        padding-left: 60px;
        padding-bottom: 30px;
    }
    audio:nth-child(3) {
        padding-left: 90px;
        padding-bottom: 60px;
    }
    audio:nth-child(4) {
        padding-left: 120px;
        padding-bottom: 90px;
    }

    #happy-headline {
        top: 10vh !important;
    }

    #happy-headline h2 {
        font-size: 24px !important;
    }
    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 1.6) !important;
    }

    #wordcloud-ph img {
        width: 120% !important;
        margin-top: 50px !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 1.6) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 1.6) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 1.6) !important;
    }

    .h-scroll-wrapper {
        --gap: 50px !important;
    }

    #team-section {
        max-width: 1800px !important;
    }
}

@media only screen and (min-width: 480px) and (max-width: 767px) and (orientation: landscape) {
    body {
        width: 100%;
    }

    audio.faq-player:nth-child(1) {
        margin-bottom: 10px !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        display: block;
    }

    audio.faq-player:nth-child(2) {
        margin-bottom: 25px !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        display: block;
    }

    audio.faq-player:nth-child(3) {
        margin-bottom: 40px !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        display: block;
    }

    audio.faq-player:nth-child(4) {
        margin-bottom: 55px !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        display: block;
    }

    #happy-headline {
        top: 3vh !important;
    }

    #happy-headline h2 {
        font-size: 16px !important;
    }

    .elementor-accordion {
        margin-top: 80px !important;
    }

    #jobs-section {
        --content-width: 60% !important;
    }

    #abo-container {
        width: 60% !important;
    }

    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 0.55) !important;
    }

    #service-headline {
        margin-top: -120px;
    }

    #team-heading {
        margin-top: 0 !important;
    }

    #faq {
        margin-top: -50px !important;
    }

    .swiper {
        height: 60vh !important;
        width: 60vw !important;
        margin-top: 50px;
    }

    #faq-swiper-section {
        margin-top: 0 !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 0.55) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.55) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.55) !important;
    }
    .h-scroll-wrapper {
        --gap: 40px !important;
    }

    #team-section {
        max-width: 150px !important;
    }

    canvas {
        height: 80vh !important;
        margin-top: 3% !important;
    }

    #wordcloud-ph img {
        width: 50%;
        margin-top: 0px !important;
    }

    .swiper-slide h2,
    .elementor-accordion-title {
        font-size: 16px !important;
    }
    .swiper-slide .swiper-desc,
    .elementor-tab-content {
        font-size: 12px !important;
    }

    #flipit {
        width: 26% !important;
    }

    #mobmenuleft li a {
        font-size: 20px;
        text-align: left;
        margin-left: 10%;
    }
    #mobmenuleft {
        padding-top: 0 !important;
    }

    .mobmenu-content {
        overflow: hidden !important;
    }

    #news-headline {
        margin-top: -50px !important;
    }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) and (orientation: landscape) {
    /* Your CSS rules for all modern Retina iPads in landscape mode */

    .mobmenu {
        display: block !important;
    }

    #scroll-sign {
        display: block !important;
    }

    #wordcloud-ph img {
        width: 70% !important;
    }

    .cinemagraph {
        scale: 0.8 !important;
    }

    #faq {
        margin-top: -50px !important;
    }

    #happy-headline {
        top: 25vh !important;
    }

    #happy-headline h2 {
        font-size: 28px !important;
    }

    #gal-col-1,
    #gal-col-2,
    #gal-col-3 {
        --container-max-width: 1140px !important;
    }

    canvas {
        height: 48vh !important;
        scale: 1.3 !important;
    }

    h1 {
        /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
        font-size: 64px !important;
    }

    .show-nav-left .mobmenu-panel.show-panel {
        scale: 1.05;
        transform: translate(15px, 5px);
    }

    .heading-line h2 {
        /* font-size: calc(54px + (90 - 54) * ((100vw - 992px) / (2560 - 768))) !important; */
        font-size: clamp(3em, 4vw, 4em) !important;
    }

    .swiper {
        width: calc(
            350px + (600 - 350) * ((100vw - 768px) / (2560 - 768))
        ) !important;
        height: calc(
            58vh + (70 - 58) * ((100vw - 768px) / (2560 - 768))
        ) !important;
    }

    .gal-img-35 video {
        width: calc(var(--gal-img-narrow) * 0.7) !important;
    }

    .gal-img-45 video {
        width: calc(var(--gal-img-wide) * 0.7) !important;
    }

    .gal-img-35 {
        --container-widget-width: calc(var(--gal-img-narrow) * 0.7) !important;
    }

    .gal-img-45 {
        --container-widget-width: calc(var(--gal-img-wide) * 0.7) !important;
    }

    .h-scroll-wrapper {
        --gap: 80px !important;
    }

    #team-section {
        max-width: 300px !important;
        margin-bottom: 80px;
    }

    .nav-dots {
        display: none;
    }

    div#hide-header {
        top: 25px;
        width: 230px;
        z-index: 9999;
    }

    .intro-video {
        translate: none;
        rotate: none;
        scale: none;
        transform: translate3d(30vw, inherit, inherit) !important;
        transition: unset;
    }

    .mobmenul-container {
        top: 40px;
        left: -15px;
    }

    #say-hi {
        top: 35px;
        right: 15px;
        z-index: 99;
        position: fixed;
    }

    div#corner-logo {
        width: 100px !important;
        left: -5px;
        bottom: 0px;
    }

    .swiper {
        height: 45vw !important;
    }

    .mobmenul-container,
    .mobmenur-container {
        position: fixed;
    }

    #news-section {
        --justify-content: center;
    }

    .cinemagraph {
        scale: 0.6;
        --container-widget-width: 95% !important;
    }

    /* .h-scroll-section {
margin-top: 20vh;
} */

    #newsletter,
    #faq-swiper-section {
        margin-top: -20vh;
    }

    .elementor-accordion {
        margin-top: 15vh;
    }
}
