* {
  margin: 0;
  padding: 0;
}

:root {
  --font-family-roboto: "Roboto", serif;
}

ul,
li {
  list-style: none;
}

.banner-wrapper {
  background-image: url("/assets/images/bg.jpg");
}

.mobile-menu {
  display: none;
}

#menu-toggle:checked + .mobile-menu {
  display: block;
}

.card-style {
  background-color: #3d4d67;
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.42);
}

.font-family-roboto {
  font-family: var(--font-family-roboto) !important;
}

body {
    font-family: var(--font-family-roboto);
}

.brand-1 {
  background-color: black;
  color: white;
}
.brand-2 {
  background-color: white;
  color: black;
}
.brand-3 {
  background-color: #58564f;
  color: white;
}
.brand-4 {
  background-color: #f39200;
  color: white;
}
.brand-5 {
  background-color: #92b9e0;
  color: black;
}
.brand-6 {
  background-color: black;
  color: #92b9e0;
}
.brand-7 {
  background-color: #dcc081;
  color: white;
}
.brand-8 {
  background-color: #58564f;
  color: white;
}

.textcolor-1 {
    color: black;
}
.textcolor-2 {
    color: white;
}
.textcolor-3 {
    color: #58564f;
}
.textcolor-4 {
    color: #f39200;
}
.textcolor-5 {
    color: #92b9e0;
}
.textcolor-6 {
    color: #dcc081;
}
.textcolor-7 {
    color: #58564f;
}

.background-1 {
    background-color: black;
}
.background-2 {
    background-color: white;
}
.background-3 {
    background-color: #58564f;
}
.background-4 {
    background-color: #f39200;
}
.background-5 {
    background-color: #92b9e0;
}
.background-6 {
    background-color: #dcc081;
}
.background-7 {
    background-color: #58564f;
}
.hero-wrapper {
  background-image: url("../images/bg.jpg");
}

.footer-wrapper {
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.42);
}

.container {
  width: 100%;
}

.swiper-container {
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 1023px){
  .nav-menu{
    position: fixed;
    width: 100%;
    top: -150%;
    left: 0;
    padding: 3.5rem 0;
    height: 100% !important;
    transition: .4s;
    z-index: 100;
    background-color: #3D4D67;
    border-radius: 0 0 1.5rem 1.5rem;
  }
}
.show-menu{
  top: 0;
}

@media (min-width: 300px) {
    .container {
      padding-left: 20px;
      padding-right: 20px;
    }
  }

@media (min-width: 640px) {
  .container {
    max-width: 640px !important;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px !important;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px !important;
  }
}

@media (min-width: 1280px) {
  .container {
    max-width: 1280px !important;
  }
}

#menu.slide-in {
  width: 400px; /* Adjust width as needed */
  transition: width 0.3s ease-in-out;
}

#menu.slide-out {
  width: 0;
  transition: width 0.3s ease-in-out;
}


.bg-yellowbrand {
    background-color: #ecd34f;
}

.text-yellowbrand {
    color: #ecd34f;
}

.hover:text-yellowbrand {
    color: #ecd34f;
}

.border-yellowbrand {
    border-color: #ecd34f;
}

a:hover {
    color: #ecd34f;
}

a:active {
    color: #ecd34f;
}

/* custom css */

div, p {
    letter-spacing: 0.3px;
    line-height: 2rem;
}

h1, h2, h3, h4, h5, h6, h7, h1 p, h2 p, h3 p, h4 p, h5 p, h6 p, h7 p {
   font-family: 'Suse', Tahoma, Geneva, Verdana, sans-serif;
   line-height: 4rem;
} 


.hauptsache_icon {
    position: relative;
    border-radius: 50%;
    display: inline-block;
    padding: 23px;
    height: 150px;
    width: 150px;
    border: 1px solid #d6b981;
} 

.font-heading {
    z-index: 1;
}

.light-opac {
    opacity: 0.9;
}

/* slider arrows opacity */
.oc-box button {
    opacity: 0;
}

.relative-in-editor {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
}

.oc-boxes-edit-mode .relative-in-editor {
    position: relative;
}