:root {
    --bs-light-2: #c4c6e8;
}

body,
html {
    scroll-padding-top: 1rem;
}

* {
    font-family: "Lato";
}

.cursor-pointer {
    cursor: pointer;
}

hr {
    margin-bottom: 2rem;
    margin-top: 2rem;
}

/* TYPOGRAPHY */
h1,
h2,
h3,
h4,
h5,
h6,
h1 span,
h2 span,
h3 span,
h4 span,
h5 span,
h6 span {
    font-family: "Oswald";
    text-transform: uppercase;
    color: var(--bs-primary);
}

.alert h2 {
    color: inherit;
}

a {
    text-decoration: none;
}

a:not(.btn):hover {
    text-decoration: underline;
}

.text-decoration-hover-underline:hover {
    text-decoration: underline !important;
}

.text-gray-600 {
    color: var(--bs-gray-600) !important;
}

.text-gray-500 {
    color: var(--bs-gray-500) !important;
}

.text-gray-400 {
    color: var(--bs-gray-400) !important;
}

.text-light-2 {
    color: var(--bs-light-2) !important;
}

.col p:last-child {
    margin-bottom: 0px;
}

.form-control:read-only {
    color: #aaa;
    background-color: #f8f9fa;
}

/* BUTTONS */

.btn {
    font-family: "Oswald";
    text-transform: uppercase;
    text-decoration: none;
}

.btn.btn-white {
    background-color: #fff;
}

.btn.btn-white:hover {
    background-color: #ddd;
    color: var(--bs-primary);
}

.btn.btn-outline-white {
    border-color: #fff;
    color: #fff;
}

.btn.btn-outline-white:hover {
    background-color: #fff;
    color: var(--bs-primary);
}

.btn.btn-font-body {
    font-family: "Lato" !important;
    text-transform: unset !important;
}

.btn.btn-gray-600 {
    background-color: #6c757d;
    color: #fff;
}

.btn.btn-gray-600.btn-link {
    color: #6c757d;
    background-color: transparent;
}

.btn.btn-gray-600.btn-link:hover {
    color: #fff;
    background-color: #6c757d;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active,
.btn.btn-secondary {
    color: #fff;
}

.btn.btn-link.btn-danger-light {
    background-color: transparent;
    color: var(--bs-danger);
}

.btn.btn-link.btn-danger-light:hover {
    background-color: #f0d2d4;
    color: #6d1319;
}

.btn.btn-link.btn-primary:hover,
.btn.btn-link.btn-primary:focus,
.btn.btn-link.btn-primary:active {
    color: #fff;
}

.btn.btn-link.btn-primary-light {
    background-color: transparent;
    color: var(--bs-primary);
}

.btn.btn-link.btn-primary-light:hover {
    background-color: #ccdaea;
    color: #002959;
}

/* BADGE */
.badge.badge-lg {
    font-size: 0.9rem;
}

/* NAVBAR */
nav.navbar {
    padding-top: 0px;
    padding-bottom: 0px;
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 1);
    text-decoration: none !important;
    transition: all 0.2s ease-in-out;
}

.navbar-nav > .nav-item > .dropdown > .nav-link,
.navbar-nav > .nav-item > .nav-link {
    padding: 1rem;
    font-size: 16px;
    font-family: "Oswald";
    text-transform: uppercase;
}

.navbar-expand-md .navbar-nav > .nav-item > .dropdown > .nav-link,
.navbar-expand-md .navbar-nav > .nav-item > .nav-link {
    padding-left: 1rem;
    padding-right: 1rem;
}

.navbar-dark .navbar-nav > .nav-item:hover > .dropdown > .nav-link,
.navbar-dark .navbar-nav > .nav-item:focus > .dropdown > .nav-link,
.navbar-dark .navbar-nav > .nav-item:hover > .nav-link,
.navbar-dark .navbar-nav > .nav-item:focus > .nav-link {
    opacity: 0.75;
}

.megamenu {
    position: static;
}

.navbar-dark .navbar-nav .nav-item.megamenu:hover > .dropdown-menu {
    display: block;
    opacity: 1;
}

.megamenu .dropdown-menu {
    background: none;
    border: none;
    width: 100%;
    left: 0;
    right: 0;
}

.megamenu .nav-link,
.megamenu .megamenu-heading {
    text-decoration: none;
}

.megamenu .megamenu-heading:hover {
    text-decoration: underline;
}

.megamenu .dropdown-menu .nav-link {
    color: #212529 !important;
    padding-left: 0px;
    padding-right: 0px;
}

.megamenu .dropdown-menu .nav-link:hover {
    color: var(--bs-primary) !important;
}

.megamenu .dropdown-menu > .container > .row {
    margin-left: 0px;
}

.megamenu .dropdown-menu > .container > .row .row {
    margin-bottom: 2rem;
}

.megamenu .dropdown-menu > .container > .row .row:last-child {
    margin-bottom: 0px;
}

.navbar-nav .dropdown-toggle::after {
    display: none;
}

.nav-item.dropdown.megamenu > .nav-link > i.fal {
    transition: all 0.2s ease-in-out;
}

.nav-item.dropdown.megamenu.show > .nav-link > i.fal {
    transform: rotate(180deg);
}

.btn-navbar-toggle i.fa-bars {
    display: none;
}

.btn-navbar-toggle.collapsed i.fa-bars {
    display: inline;
}

.btn-navbar-toggle i.fa-angle-up,
.btn-navbar-toggle i.fa-times {
    display: inline;
}

.btn-navbar-toggle.collapsed i.fa-angle-up,
.btn-navbar-toggle.collapsed i.fa-times {
    display: none;
}

/* DROPDOWNS */
.dropdown-item:hover {
    text-decoration: none !important;
}

/* WARENKORB */
.anfrage-dropdown .dropdown-title {
    white-space: nowrap;
    display: block;
}

.anfrage-dropdown .dropdown-menu {
    width: 360px;
}

#anfrage-dropdown-mobile .dropdown-menu {
    width: 94vw;
}

#anfrage-dropdown .anfrage-warenkorb-badge {
    position: absolute;
    bottom: 5px;
    right: 5px;
    transform: scale(0.8);
}

.anfrage-dropdown .render-target {
    max-height: 50vh;
    overflow-y: auto;
    overflow-x: hidden;
}

#anfrage-dropdown-mobile hr:last-child,
#warenkorb-render-target hr:last-child,
.anfrage-dropdown .dropdown-menu .render-target hr:last-child {
    display: none;
}

/* HEADER */

@media (max-width: 1199px) {
    #header-contact-opening-times {
        font-size: 0.875em;
    }
}

#header-secondary-nav .nav-link {
    font-family: "Oswald";
    text-transform: uppercase;
    color: var(--bs-primary);
    font-size: 1.25rem;
    text-decoration: none;
}

#header-secondary-nav .nav-link:hover {
    text-decoration: none;
    color: var(--bs-secondary);
}

/* CONTENT */
#content {
    margin-top: 149px;
}

/* FOOTER */

footer a {
    color: var(--bs-dark);
    text-decoration: none;
}

footer a:hover {
    color: var(--bs-primary);
    text-decoration: none;
}

#meta-footer a,
#meta-footer .list-inline-item {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
}

#meta-footer a:hover {
    text-decoration: none;
    color: rgba(255, 255, 255, 1);
}

/* POPOVER */
.oeffnungszeiten-popover .popover-header {
    background: var(--bs-primary);
    color: #fff;
}

.oeffnungszeiten-popover.bs-popover-auto[data-popper-placement^="bottom"]
> .popover-arrow::after {
    border-bottom-color: var(--bs-primary);
}

.oeffnungszeiten-popover.bs-popover-auto[data-popper-placement^="bottom"]
> .popover-arrow::before {
    border-bottom-color: var(--bs-primary);
}

.oeffnungszeiten-popover.bs-popover-auto[data-popper-placement^="bottom"]
.popover-header::before {
    border-color: var(--bs-primary);
}

/* RAL COLORS */
.ral-color-circle {
    display: block;
    height: 35px;
    width: 35px;
    border-radius: 50%;
}

.ral-color-circle.ral7016 {
    background-color: #363d43;
}

.ral-color-circle.ral9002 {
    background-color: #dadbd5;
}

/* ACTION BOX */
.action-box-title {
    font-size: 2.5rem;
}

.action-box-content h1,
.action-box-content h2,
.action-box-content h3,
.action-box-content h4,
.action-box-content h5,
.action-box-content h6 {
    color: #fff !important;
}

.action-box-content p {
    font-size: 1.1rem;
    color: #fff;
}

/** SCROLL TOP BUTTON **/
#button-to-top {
    width: 49px;
    height: 49px;
    position: fixed;
    bottom: 35px;
    right: 35px;
    z-index: 900;
}

#button-to-top .btn {
    color: #fff !important;
}

/* LINK CARD BOX */
.link-card-box {
    transition: all 0.2s ease-in-out;
}

.link-card-box:hover {
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%) !important;
    transform: translateY(-10px);
}

.link-card-box .card-title {
    font-size: 1.25rem;
}

.link-card-box .card-footer {
    background-color: transparent;
    padding-top: 0px;
    border-top: none;
}

/* SONDERPOSTEN / ARTIKEL */
.article-card {
    transition: all 0.2s ease-in-out;
}

.article-card:hover {
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%) !important;
    transform: translateY(-10px);
}

.article-card h4 {
    min-height: 48px;
    font-size: 1.25rem;
}

.artikelpreis,
.article-card .artikelpreis,
.artikel-warenkorb .preis,
.sonderposten-modal .artikelpreis,
.sonderposten .artikelpreis {
    display: block;
    font-family: "Oswald";
    font-size: 32px;
    line-height: 32px;
    color: var(--bs-danger);
}

.article-info-wrapper,
.article-card .info-wrapper {
    position: absolute;
    top: 0;
    left: 0;
}

.article-info-wrapper .info-new,
.article-info-wrapper .info-dach,
.article-info-wrapper .info-wand,
.article-info-wrapper .info-not-available,
.article-card .info-wrapper .info-new,
.article-card .info-wrapper .info-dach,
.article-card .info-wrapper .info-wand,
.article-card .info-wrapper .info-not-available {
    margin-bottom: 0.25rem;
    display: block;
    width: 100%;
    color: #fff;
    font-size: .8em;
    text-align: center;
    line-height: 1;
    padding: 0.5rem;
    text-transform: uppercase;
    font-family: "Oswald";
}

.article-info-wrapper .info-dach,
.article-info-wrapper .info-wand,
.article-card .info-wrapper .info-dach,
.article-card .info-wrapper .info-wand {
    background: var(--bs-primary);
}

.article-info-wrapper .info-not-available,
.article-card .info-wrapper .info-not-available {
    background: var(--bs-danger);
}

.article-info-wrapper .info-new,
.article-card .info-wrapper .info-new {
    background: var(--bs-danger);
}

.article-card .info-i {
    position: absolute;
    top: 0px;
    right: 0px;
    display: inline-block;
    background: var(--bs-primary);
}

.article-card .info-i .btn {
    color: #fff;
    font-size: 18px;
    height: 43px;
}

/** slider **/
.carousel-control-prev, .carousel-control-next {
    width: 5%;
}