/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/

/* oswald-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: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/oswald-v53-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-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: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/open-sans-v40-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* roboto-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: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/roboto-v30-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-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: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/roboto-v30-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900 - 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: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/roboto-v30-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



body {
  font-size: 20px;
  line-height: 1.8; 
  font-family: 'Roboto','Helvetica neue', 'Helvetic', 'Arial', sans-serif !important;
  font-weight: 400 !important;
  font-style: normal;
}


.estrala-header {
     position: relative; 
    width: 100% !important; 
    z-index: 999;
    transition: all 0.3s ease-in-out;
}
.estrala-header .email-info {
    background-color: #081c2f;
}

/* erste teil header*/
.estrala-header .email-info ul.elementor-icon-list-items.elementor-inline-items {
    justify-content: flex-end;
    list-style-type: none;
}

.estrala-header .email-info ul.elementor-icon-list-items .elementor-inline-item {
    padding-left: 10px;
}

.estrala-header .email-info ul.elementor-icon-list-items a {
    color: #fff;
    font-size: 0.8em;
    font-weight: 400;
}

.estrala-header .email-info ul.elementor-icon-list-items .elementor-icon-list-item span:hover {
    color: red;
}

.icon-denthoai,
.icon-thudientu {
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    fill: #fff;
}
.icon-denthoai:hover,
.icon-thudientu:hover {
    fill: red;
}

/* zweite teil header*/
.estrala-header .site-header {
    transition: all 0.3s ease-in-out;
    padding: 0;
    min-height: 81px;
}
/* ausschalten der toggle*/
.estrala-header .site-header .site-navigation-toggle-holder {
    display: none;
}
.estrala-header .site-header .site-navigation ul.menu li a {
    font-size: 1em;
    font-weight: bold;
}

.estrala-header .site-header .site-navigation ul.menu li a:hover,
.estrala-header .site-header .site-navigation ul.menu li a:active,
.estrala-header .site-header .site-navigation ul.menu li.current-menu-item a {
    font-size: 1em;
    font-weight: bold;
    color: #B52222;
}
.icon-mo {
    height: 1.5em;
    width: 1.5em;
    fill: red;
}

.icon-dong {
    height: 1.5em;
    width: 1.5em;
    fill: red;
}

.site-navigation-toggle-holder .icon-dong {
    display: none;
     transition: all 0.3s ease-in-out;
}

.site-navigation-toggle-holder.elementor-active .icon-mo {
    display: block;
     transition: all 0.3s ease-in-out;
}

.site-navigation-toggle-holder.elementor-active .icon-mo {
    display: none;
     transition: all 0.3s ease-in-out;
}

.site-navigation-toggle-holder.elementor-active .icon-dong {
    display: block;
     transition: all 0.3s ease-in-out;
}


@media (max-width: 1400px) {
    /* ausschalten erste Zeile, die info email */
    .estrala-header .email-info {
        display: none;
    }
    /* ausschalten navigation und anschalten den toggle*/
    .estrala-header .site-header .site-navigation {
        display: none;
    }

    .estrala-header .site-header .site-navigation-toggle-holder {
        display: block;
        z-index: 9999;
    }
    .estrala-header .site-header .site-navigation-toggle-holder .site-navigation-toggle {
        background-color: transparent;
        padding: 10px;
    }
/* toggler - Größe */

    .site-navigation-toggle-holder {
        max-width: 30%;
    }

    .estrala-header .site-header .site-navigation-toggle-holder .site-navigation-toggle i {
        font-size: 2.5rem;
        color: #B52222;
        
    }

    .estrala-header .site-header .site-navigation-toggle-holder.elementor-active .site-navigation-toggle i {
        font-size: 2.5rem;
        color: #B52222;
        
    }

    .estrala-header .site-navigation-dropdown ul.menu {
         background: rgba(8, 28, 47, 0.1) !important;
    }

    .estrala-header .site-navigation-dropdown ul.menu li:not(:last-child) {
        border-style: solid;
        border-bottom-width: 1px;
        border-color: #19324c;
    }
    .estrala-header .site-navigation-dropdown ul.menu li a {
          background: rgba(0, 34, 68, 0.85) !important;
    text-transform: uppercase;
    color: #fff;
    }
    
}
/* Logo*/
.site-logo {
    max-width: 250px;
}

@media (max-width: 576px) {
    .site-header .header-inner:not(.header-stacked) .site-branding {
        max-width: 150px;
    }
    .site-logo {
        max-width: 150px;
    }

}
