/*
 Theme Name:     Marco Tullner (Divi Child-Theme)
 Theme URI:      https://tullner.de
 Description:    Marco Tullner (Divi Child-Theme)
 Author:         agenturkappa.com – Alexander Sperrle
 Author URI:     https://agenturkappa.com
 Template:       Divi
 Version:        1.0.0
*/
 
/* ------------------------------------------------------- */

/* Webfonts */

/* inter-300 - Light latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  src: url('../divi-child/fonts/inter-v20-latin_latin-ext-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../divi-child/fonts/inter-v20-latin_latin-ext-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* inter-300italic - Light latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  src: url('../divi-child/fonts/inter-v20-latin_latin-ext-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../divi-child/fonts/inter-v20-latin_latin-ext-300italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* inter-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('../divi-child/fonts/inter-v20-latin_latin-ext-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../divi-child/fonts/inter-v20-latin_latin-ext-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* inter-italic - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  src: url('../divi-child/fonts/inter-v20-latin_latin-ext-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../divi-child/fonts/inter-v20-latin_latin-ext-italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* inter-500 - Medium latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('../divi-child/fonts/inter-v20-latin_latin-ext-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../divi-child/fonts/inter-v20-latin_latin-ext-500.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* inter-500italic - Medium latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  src: url('../divi-child/fonts/inter-v20-latin_latin-ext-500italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../divi-child/fonts/inter-v20-latin_latin-ext-500italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* inter-800 - ExtraBold latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  src: url('../divi-child/fonts/inter-v20-latin_latin-ext-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../divi-child/fonts/inter-v20-latin_latin-ext-800.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* inter-800italic - ExtraBold latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  src: url('../divi-child/fonts/inter-v20-latin_latin-ext-800italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../divi-child/fonts/inter-v20-latin_latin-ext-800italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* ibm-plex-serif-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'IBM Plex Serif';
  font-style: normal;
  font-weight: 400;
  src: url('../divi-child/fonts/ibm-plex-serif-v20-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ibm-plex-serif-italic - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'IBM Plex Serif';
  font-style: italic;
  font-weight: 400;
  src: url('../divi-child/fonts/ibm-plex-serif-v20-latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* Layout */
#main-header {
  margin: 0 auto!important;
  box-shadow: none;
}

#main-content {
  margin: 0 auto!important;
  overflow: hidden;
}

/* Inhalt vertikal zentrieren*/
.content-vertical-align-center {  
  display: flex;  
  flex-direction: column;  
  justify-content: center!important;
}

.centered {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
}

.bottomed {
  display: flex;
  align-items: flex-end;
  flex-direction: row;
  flex-wrap: wrap;
}

/* Inhalt vertikal unten ausrichten */
.content-vertical-align-bottom {  
  display: flex;  
  flex-direction: column;  
  justify-content: flex-end!important; 
}

/* Inhalt vertikal oben ausrichten */
.content-vertical-align-top {  
  display: flex;  
  flex-direction: column;  
  justify-content: flex-start!important; 
}


/* =Small Margins Template Shortcodes Columns
-------------------------------------------------------------- */

.full_width  {
  width: 100%;
}
.one_half {
  width: 49%;
  margin-right: 2%;
}
.one_half.last_column {
  width: 49%;
  margin-right: 0px;
}
.one_third {
  width: 32% !important;
  margin-right: 2% !important;
}
.one_third.last_column {
  width: 32% !important;
  margin-right: 0px !important;
}
.two_third {
  width: 66% !important;
  margin-right: 2% !important;
}
.two_third.last_column {
  width: 66% !important;
  margin-right: 0px !important;
}
.one_fourth {
  width: 23.5% !important;
  margin-right: 2% !important;
}
.one_fourth.last_column {
  width: 23.5% !important;
  margin-right: 0px !important;
}
.three_fourth {
  width: 74.5% !important;
  margin-right: 2% !important;
}
.three_fourth.last_column {
  width: 74.5% !important;
  margin-right: 0px !important;
}
.one_fifth {
  width: 18.4% !important;
  margin-right: 2% !important;
}
.one_fifth.last_column {
  width: 18.4% !important;
  margin-right: 0px !important;
}
.two_fifth {
  width: 39% !important;
  margin-right: 2% !important;
}
.two_fifth.last_column {
  width: 39% !important;
  margin-right: 0px !important;
}
.three_fifth {
  width: 59% !important;
  margin-right: 2% !important;
}
.three_fifth.last_column {
  width: 59% !important;
  margin-right: 0px !important;
}
.four_fifth {
  width: 79.6% !important;
  margin-right: 2% !important;
}
.four_fifth.last_column {
  width: 79.6% !important;
  margin-right: 0px !important;
}
.one_sixth {
  width: 15% !important;
  margin-right: 2% !important;
}
.one_sixth.last_column {
  width: 15% !important;
  margin-right: 0px !important;
}

/* =Responsive shortcode Columns
-------------------------------------------------------------- */
/* Maximum width of 600 pixels. */
@media (max-width: 768px) {
  .full_width,
  .one_half,
  .one_third,
  .two_third,
  .one_fourth,
  .three_fourth,
  .one_fifth,
  .two_fifth,
  .three_fifth,
  .four_fifth,
  .one_sixth,
  .five_sixth
  .one_half.last_column,
  .one_third.last_column,
  .two_third.last_column,
  .one_fourth.last_column,
  .three_fourth.last_column,
  .one_fifth.last_column,
  .two_fifth.last_column,
  .three_fifth.last_column,
  .four_fifth.last_column,
  .one_sixth.last_column,
  .five_sixth.last_column {
    clear: both;
    width: 100%!important;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 1em;
  }
}

/* Tastaturnavi */

/* Basis: nur Tastaturnutzer sehen den Ring */
:where(a[href], button, input:not([type="hidden"]), select, textarea,
       [role="button"], [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 3px solid #EF7C00 !important;
  outline-offset: 5px !important;
  box-shadow: none !important; /* falls Plugin/Theme Fokus via Schatten macht */
}

/* Fallback für sehr alte Browser ohne :focus-visible (heute selten) */
:where(a[href], button, input:not([type="hidden"]), select, textarea,
       [role="button"], [tabindex]:not([tabindex="-1"])):focus {
  outline: 3px solid #EF7C00 !important;
  outline-offset: 5px !important;
}

/* Für Sprungmarken (#hash) */
a:focus-visible {
    outline: 3px solid #EF7C00 !important;
  outline-offset: 5px !important;
}

:target {
  outline: none;
}


/* Typography */

body, p, h1, h2, h3, h4, h5, h6 {
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    text-rendering: optimizeLegibility;
    font-synthesis: none;

strong {
  font-weight: 700!important;
}


h1 {

  background-color: #2d3c4b!important;
  box-shadow: 12px 0 0 #2d3c4b, -12px 0 0 #2d3c4b;
  line-height: 120%!important;
  display: inline;
  word-wrap: break-word;
  padding: 6px 0;
  margin-bottom: 1rem!important;
  margin-left: 12px;
  -webkit-box-decoration-break: clone;

  @media (min-width: 1281px) {
    font-size: 64px!important;
  }

}

h2 {

  background-color: #fff!important;
  box-shadow: 8px 0 0 #fff, -8px 0 0 #fff;
  line-height: 145%!important;
  display: inline;
  word-wrap: break-word;
  padding: 2px 0;
  margin-bottom: 1rem!important;
  margin-left: 8px;
  -webkit-box-decoration-break: clone;

    @media (min-width: 1281px) {
    font-size: 40px!important;
  }
}

@media only screen and (min-width: 981px) and (max-width: 1280px) {

    p, ul li {
    font-size: 18px!important;
    line-height: 150%;
    }

    .teaserbutton p {
      font-size: 40px;
      line-height: 100%;
    }

}

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

    p, ul li {
    font-size: 18px!important;
    line-height: 150%;
    }

    .bu p {
      font-size: 16px!important;
    }

}


@media only screen and (min-width: 981px) and (max-width: 1280px) {

      .teaserbutton p {
      font-size: 40px!important;
      line-height: 100%;
    }
  }


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

      .teaserbutton p {
      font-size: 22px;
      line-height: 100%;
    }


}


@media only screen and (min-width: 981px) and (max-width: 1080px) {

  .follow_button {
    display: none!important;
  }

}


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

  .follow_button {
    display: none!important;
  }
}


@media only screen and (min-width: 981px) and (max-width: 1080px){

    #top-menu li a {
      font-size: 14px;
    }

            #logo {
        max-height: 20%;
    }

}


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

            #logo {
        max-height: 35%;
    }
}


@media only screen and (min-width: 981px) and (max-width: 1280px) {

  .et_pb_button_two.et_pb_button {
    transform: translateX(-20px)!important;
    margin-top: 1rem!important;
  }

}

@media only screen and (max-width: 980px) {
    .et_pb_button_two.et_pb_button {
    margin-bottom: 2rem;
}

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

  .et_pb_button_two.et_pb_button {
    transform: translateX(-20px)!important;
    margin-top: 1rem!important;
    margin-bottom: 2rem;
  }

}



.et_mobile_menu {
  border-top: 0;
  padding: 0;
  width: 140%;
  margin-left: -13%;
}


.et_pb_menu_0_tb_footer {

  @media only screen and (max-width: 980px) {
    .et_mobile_nav_menu {
      display: none;
    }
    .et_pb_menu__menu {
      display: block;
    }

  }

}