/*
Theme Name: THEME
Description: Handcoded by wiegandt media - Based on Bootstrap 5
Author: wiegandt media UG
URI: http://www.wiegandt-media.de/
Version: 2026.03
Tags: wiegandt media UG
*/

/* ==========================================================================
   Fonts & Development
   ========================================================================== */

#wpadminbar {display: none;}

/* poppins-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: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/butchers/fonts/poppins-v24-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-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: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/themes/butchers/fonts/poppins-v24-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-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: 'Nunito';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/butchers/fonts/nunito-v32-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-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: 'Nunito';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/themes/butchers/fonts/nunito-v32-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

@keyframes zoom {
  0% {
    scale: 1.01;
  }
  50% {
    scale: 1.2;
  }
  100% {
   scale: 1.01;
  }
}

/* ==========================================================================
   Basics
   ========================================================================== */

body {height:100%;width:100%;margin: 0;padding: 0;font-weight: 400;font-family: 'Nunito', sans-serif;font-size: 18px;color: #1d1d1d;overflow-x: hidden;}
html {height: 100%; width: 100%; margin: 0; padding:0;}

p {line-height: 1.55em;}
a {transition: all 0.2s;cursor: pointer;}
a:hover,a:focus {color: #d61a27;text-decoration: none;}
:focus {outline: none !important}

.center {text-align: center;}
.left {text-align: left;}
.right {text-align:right;}
.clear {clear: left;}

::selection{background:#E5E5E5}
::-moz-selection{background:#E5E5E5}

img.responsive {width: 100%; height: auto;}

h1 {font-size: 62px; font-family: 'Poppins', sans-serif;font-weight: 700;margin-top: 3px;margin-bottom: 5px;line-height: 1.25em;text-transform: uppercase;}
h2 {font-size: 42px;font-family: 'Poppins', sans-serif;font-weight: 700;margin-top: 5px;margin-bottom: 25px;line-height: 1.05em;text-transform: uppercase;}
h3 {font-size: 28px;font-family: 'Poppins', sans-serif;font-weight: 700;margin-top: 3px;margin-bottom: 5px;line-height: 1.25em;text-transform: uppercase;}
h4 {font-size: 19px; font-family: 'Poppins', sans-serif;font-weight: 700; margin-top: 3px; margin-bottom: 5px; line-height: 1.25em;}
h5 {font-size: 14px; font-weight: 400; margin-top: 3px; margin-bottom: 5px; line-height: 1.5em;}
h6 {font-size: 12px; font-weight: 400; margin-top: 3px; margin-bottom: 5px; line-height: 1.5em;}

/* ==========================================================================
   Menu
   ========================================================================== */

header ul {
  padding-left: 0;
  display: inline-block;
}

.logo-box a {
    display: block;
    width: 280px;
    height: 78px;
    background-image: url(./img/butchers-logo.svg);
    background-size: 280px;
    background-position: center;
    background-repeat: no-repeat;
}

.logo-box {
    display: inline-block;
}

.hamburger {
    padding: 15px 0;
}

button.hamburger {
  display: none;
  z-index: 99;
}

.navbar-right {
    float: right;
}

ul.menu {
    padding-left: 0;
    list-style: none;
}

ul#menu-footer {
    display: inline-block;
}

ul#menu-footer li {
    display: inline-block;
}

.main-navbar ul li {
    display: inline-block;
}

.main-navbar ul li:last-child {
    margin-right: 0;
}

.main-navbar ul {
    margin-top: 35px;
}

.mobile-navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #191b1d;
    -webkit-transition: opacity .75s ease-in-out;
    -moz-transition: opacity .75s ease-in-out;
    -o-transition: opacity .75s ease-in-out;
    transition: all .75s ease-in-out;
    text-align: center;
    z-index: -150;
    opacity: 0;
    visibility: hidden;
}

.menu-active .mobile-navbar {
    transform: translateY(0);
    opacity: 1;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    transition: opacity .5s ease-in-out;
    z-index: 25;
    visibility: visible;
}

.mobile-navbar ul {
    padding-left: 0;
    list-style: none;
    position: relative;
    padding-top: 100px;
}

.mobile-navbar ul li a {
    font-size: 35px;
}

.mobile-navbar ul li a:hover {
    color: #000000;
}

.footer-menu ul {
    text-align: right;
    padding-left: 0;
    list-style: none;
}

.footer-menu ul li {
    display: inline-block;
    margin: 0 5px;
} 

.footer-menu ul li:last-child {
    margin-right: 0;
}

header.scroll-up {
    transform: translateY(-100%);
}

section#willkommen {
    min-height: 640px;
    position: relative;
    overflow: hidden;
}

.overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000;
    opacity: .25;
}

/* ==========================================================================
   Site
   ========================================================================== */

header {
    padding: 15px 0 20px;
    position: fixed;
    width: 100%;
    z-index: 40;
    transition: all .3s;
}

section#main {
    padding: 15px 0 20px;
    padding-top: 130px;
}

section#footer {
    background-color: #070707;
    padding: 50px 0 60px;
    font-size: 14px;
    color: #ffffff;
}

.header-overlay {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    background: linear-gradient(180deg, rgb(0,0,0,90%) 0%, rgba(0,0,0, 0) 90%);
    height: 300px;
    z-index: 5;
}

.main-navbar a {
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
    font-family: 'Poppins', sans-serif;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.main-navbar a:hover {
    color: #dab6a1;
}

ul#menu-links li {
    margin-right: 45px;
}

ul#menu-links li:last-child {
    margin-right: 0;
}

ul#menu-rechts li {
    margin-left: 45px;
}

ul#menu-rechts li:first-child {
    margin-left: 0;
}

.fronter {
    z-index: 10;
    position: relative;
}

.willkommen-text {
    text-align: center;
    color: #ffffff;
}

#willkommen .container-fluid {
    position: absolute;
    top: 50%;
    transform: translateY(-20%);
}

section#start {
    background-color: #f9f4e7;
    padding: 75px 0 95px;
}

.angebot-box {
    background-color: #f5edd9;
    color: #000000;
    text-align: center;
    padding: 45px 15px 25px;
}

img.angebot-img {
    max-width: 100px;
    max-height: 100px;
    margin-bottom: 20px;
}

.start-text {
    margin-bottom: 55px;
}

.header-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    animation: zoom 40s infinite;
    -webkit-animation: zoom 40s infinite;
}

.main-navbar li.highlighting a {
    color: #d61a27;
}

.main-navbar li.highlighting a:hover {
    color: #a20c17;
}

.willkommen-text h1 {
    text-shadow: 2px 2px 40px #000;
}

/* ==========================================================================
   Responsive MAX
   ========================================================================== */

@media screen and (min-width: 1430px) {

  .container {
    max-width: 1400px;
  }

}

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

  button.hamburger {
      display: block;
  }

  .main-navbar {
      display: none;
  }

}

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

}

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


}

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

}