/* CSS DATEI FÜR UCKERCCINO.DE */

/* WEBFONTS ############################# */

@font-face {
    font-family: 'Open Sans Bold';
    src: url('fonts/OpenSans-Bold.eot');
    src: url('fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Bold.woff2') format('woff2'),
        url('fonts/OpenSans-Bold.woff') format('woff'),
        url('fonts/OpenSans-Bold.ttf') format('truetype'),
        url('fonts/OpenSans-Bold.svg#OpenSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans Bold Condensed';
    src: url('fonts/OpenSansCondensed-Bold.eot');
    src: url('fonts/OpenSansCondensed-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSansCondensed-Bold.woff2') format('woff2'),
        url('fonts/OpenSansCondensed-Bold.woff') format('woff'),
        url('fonts/OpenSansCondensed-Bold.ttf') format('truetype'),
        url('fonts/OpenSansCondensed-Bold.svg#OpenSansCondensed-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Medium.eot');
    src: url('fonts/OpenSans-Medium.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Medium.woff2') format('woff2'),
        url('fonts/OpenSans-Medium.woff') format('woff'),
        url('fonts/OpenSans-Medium.ttf') format('truetype'),
        url('fonts/OpenSans-Medium.svg#OpenSans-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}



/* END WEBFONTS ######################### */

/* VARIABLEN ############################# */

:root {

--fontBold: 'Open Sans Bold';
--fontNormal: 'Open Sans';
--fontCondensedBold: 'Open Sans Bold Condensed';

--font16: 16px;
--font18: 18px;
--font20: 20px;
--font27: 27px;
--font30: 30px;
--font35: 35px;
--font50: 50px;
--vw8: 8vw;
--vw7: 7vw;


--grau: #a2a2a2;
--braun: #664014;
--schwarz: #000;
--weiss: #fff;

}

/* END VARIABLEN ######################### */

/* GLOBAL ############################# */

body {
    font-family: var(--fontNormal);
    background-image: url(../../../images/template/background.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

.sp-megamenu-parent .sp-menu-item>a {
    text-transform: uppercase;
    font-size: var(--font16);
}

.sp-megamenu-parent .sp-menu-item>a img {
    max-width: 70px;
    margin-left: 40px;
}

h1.sppb-addon-title,
h1.sppb-title-heading {
    font-size: var(--font50);
    font-family: var(--fontBold);
}

h3.sppb-addon-title {
    font-size: var(--font20);
    font-family: var(--fontBold);
}

ul.uc__pKill p {
    margin: 0;
    padding: 0;
}

/* END GLOBAL ######################### */

/* FOOTER ############################# */

footer#sp-footer {
    background-color: var(--schwarz);
}

#sp-footer .container-inner {
    border: 0;
}

#mod-custom112 p {
    margin: 0;
}

.footer1 {
    color: var(--grau);
}

/* END FOOTER ######################### */

/* WECHSELSHOPS ############################# */


.uc__shopSection .sppb-column {
    scale: 1;
    transition: .6s cubic-bezier(.17,.67,.83,.26);
}
.uc__shopSection .sppb-column:hover {
    scale: 1.1;
    transition: .3s cubic-bezier(.17,.67,.83,.26);
}

/* END WECHSELSHOPS ######################### */

/* FAQ ############################# */

button.sppb-w-full.sppb-panel-heading:hover {
    background: var(--braun)!important;
    color: var(--weiss);
}

button.sppb-w-full.sppb-panel-heading {
    padding: 20px;
}

button.sppb-w-full.sppb-panel-heading .sppb-panel-title {
    font-size: var(--font18);
}

/* END FAQ ######################### */

/* CONVERTFORMS ############################# */

input[type="text"]:not(.form-control),
input[type="email"]:not(.form-control), 
input[type="url"]:not(.form-control), 
input[type="date"]:not(.form-control), 
input[type="password"]:not(.form-control), 
input[type="search"]:not(.form-control), 
input[type="tel"]:not(.form-control), 
input[type="number"]:not(.form-control), 
select:not(.form-select):not(.form-control),

.convertforms textarea.cf-input {
    padding: 20px!important;
    border-radius: 0;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 3px solid var(--braun);
}

.convertforms .cf-content-wrap, .convertforms .cf-form-wrap {
    padding: 0;
}

/* END CONVERTFORMS ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */

/* GLOBAL ############################# */



/* END GLOBAL ######################### */



/* MEDIA QUERIES ###################### */

@media (max-width: 575px) {

#sp-header {
    height: 70px;
}

#sp-header .burger-icon {
    margin-top: 10px;
}


.offcanvas-menu .offcanvas-inner ul.menu li a {
    color: var(--schwarz);
    font-family: var(--fontNormal);
    opacity: 1;
    text-transform: uppercase;
}

.offcanvas-menu .offcanvas-inner ul.menu li:hover a,
.offcanvas-menu .offcanvas-inner ul.menu li.active a {
    color: var(--schwarz)!important;
    font-family: var(--fontBold);
}

.offcanvas-menu .offcanvas-inner ul.menu li a img {
    max-width: 90px;
    margin-left: 0px;
}

}


@media (300px <= width <= 767px) {
  
h1.sppb-addon-title,
h1.sppb-title-heading {
    font-size: var(--vw8);
    font-family: var(--fontBold);
}

h2.sppb-title-heading {
    font-size: var(--vw7);
}

h3.sppb-addon-title {
    font-size: var(--font20);
    font-family: var(--fontBold);
}

#sp-footer1,
#sp-footer2 {
    text-align: center;
    font-size: 80%;
}

#sp-footer2 {
    text-align: center!important;
}

button.sppb-w-full.sppb-panel-heading {
    color: var(--schwarz);
}

}

@media (993px <= width <= 1199px) {

.sp-megamenu-parent .sp-menu-item>a img {
    margin-left: 0;
}

}