@charset "utf-8";
@font-face {
    font-family: 'FontAwesome';
    src: url('../wf/fontawesome/fontawesome-webfont.eot?v=4.7.0');
    src: url('../wf/fontawesome/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../wf/fontawesome/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../wf/fontawesome/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../wf/fontawesome/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../wf/fontawesome/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_bold';
    src: url('../wf/roboto_bold/roboto-bold-webfont.woff2') format('woff2'), url('../wf/roboto_bold/roboto-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_regular';
    src: url('../wf/roboto_regular/roboto-regular-webfont.woff2') format('woff2'), url('../wf/roboto_regular/roboto-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_light';
    src: url('../wf/roboto_light/roboto-light-webfont.woff2') format('woff2'), url('../wf/roboto_light/roboto-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FontAwesome6Pro';
    font-style: normal;
    font-weight: 100;
    font-display: block;
    src: url("../wf/fontawesome_pro/fa-thin-100.woff2") format("woff2"), url("../wf/fontawesome_pro/fa-thin-100.ttf") format("truetype");
}

@font-face {
    font-family: 'FontAwesome6Pro';
    font-style: normal;
    font-weight: 300;
    font-display: block;
    src: url("../wf/fontawesome_pro/fa-light-300.woff2") format("woff2"), url("../wf/fontawesome_pro/fa-light-300.ttf") format("truetype");
}

@font-face {
    font-family: 'FontAwesome6Pro';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("../wf/fontawesome_pro/fa-regular-400.woff2") format("woff2"), url("../wf/fontawesome_pro/fa-regular-400.ttf") format("truetype");
}

@font-face {
    font-family: 'FontAwesome6Pro';
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("../wf/fontawesome_pro/fa-solid-900.woff2") format("woff2"), url("../wf/fontawesome_pro/fa-solid-900.ttf") format("truetype");
}

@font-face {
    font-family: 'FontAwesome6ProBrands';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("../wf/fontawesome_pro/fa-brands-400.woff2") format("woff2"), url("../wf/fontawesome_pro/fa-brands-400.ttf") format("truetype");
}


/* Standard-Elemente */

:root {
    --main-white-color: white;
    --main-black-color: black;
    --main-lightgrey-color: #f2f2f2;
    --main-color: #f00000;
    --main-color-second: #333333;
    --main-font: roboto, sans-serif;
    --main-font-fa: "roboto", "FontAwesome6Pro";
    --fa-font: "FontAwesome6Pro";
    --fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
    --fa-font-thin: normal 100 1em/1 "FontAwesome6Pro";
    --fa-font-light: normal 300 1em/1 "FontAwesome6Pro";
    --fa-font-solid: normal 900 1em/1 "FontAwesome6Pro";
}


/* Fahnenfabrik */

html,
body,
ul,
ol {
    margin: 0px;
    padding: 0px;
}

h1,
h2,
h3,
h4 {
    margin: 0px;
    padding: 0px;
    font-weight: normal;
    font-size: 100%;
}

body {
    font-family: 'roboto_light';
    font-size: 100%;
    font-weight: normal;
    color: #333333;
    background-color: #EEEEEE;
}

a {
    color: inherit;
    text-decoration: none;
}

p {
    margin: 0;
}

b,
strong {
    font-weight: normal;
    font-family: 'roboto_bold';
}

img {
    max-width: 100%;
    height: auto !important;
}

.clear {
    clear: both;
}

.error {
    background-color: #9f0000;
    color: #FFFFFF;
    font-size: 85%;
    padding: 10px 10px 10px 30px;
    margin-bottom: 20px;
    border-radius: 5px;
}

.error:before {
    display: inline-block;
    width: 20px;
    margin-left: -20px;
    content: '\f071';
    font-family: 'fontawesome';
    display: inline-block;
}

.success {
    background-color: #008b00;
    color: #FFFFFF;
    font-size: 85%;
    padding: 10px 10px 10px 30px;
    margin-bottom: 20px;
    border-radius: 5px;
}

.success:before {
    display: inline-block;
    width: 20px;
    margin-left: -20px;
    content: '\f00c';
    font-family: 'fontawesome';
    display: inline-block;
}

.containerLoading {
    background-color: rgba(0, 0, 0, 0.8);
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 999999;
}

.layerLoading {
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: #FFFFFF;
    background-image: url('/img/loadingcircle.gif');
    background-position: center;
    background-repeat: no-repeat;
    width: 70px;
    height: 70px;
    border-radius: 5px;
    margin-left: -35px;
    margin-top: -35px;
    box-shadow: 0 0 5px #000000;
}


/* Top */

#containerTop {
    padding: 0 20px;
    background-color: #eeeeee;
}

#layerTop {
    margin: 0 auto;
    padding: 10px 0;
    max-width: 1300px;
    overflow: hidden;
}

#layerTop a {
    display: block;
    float: right;
    padding: 5px 10px;
    font-size: 80%;
}

#layerTop a:hover {
    color: #e20613;
}

#layerTop .phone::before {
    content: '\f098\00A0';
    font-family: 'fontawesome';
}

#layerTop .form::before {
    content: '\f14b\00A0';
    font-family: 'fontawesome';
}


/* Head */

#containerHead {
    background: #f6f6f6;
    background: -moz-linear-gradient(top, #f6f6f6 0%, #f0f0ef 100%);
    background: -webkit-linear-gradient(top, #f6f6f6 0%, #f0f0ef 100%);
    background: linear-gradient(to bottom, #f6f6f6 0%, #f0f0ef 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#f0f0ef', GradientType=0);
    border: 3px solid #FFFFFF;
    padding: 0 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    z-index: 2;
    position: relative;
}

#layerHead {
    max-width: 1300px;
    margin: 0 auto;
}

#layerHeadLogo {
    position: absolute;
    top: 0;
    left: auto;
    z-index: 3;
}

#layerHeadLogo .layerHeadLogoLink {
    padding: 0;
    margin-left: 0;
}

#layerHeadText {
    padding-top: 28px;
    margin-left: 120px;
    line-height: 20px;
    float: left;
    font-size: 120%;
}

#layerHeadAction {
    float: right;
}

#layerHeadButtons {
    float: right;
    clear: right;
}


/* Head-Suche */

#layerHeadSearch {
    border: 1px solid #CCCCCC;
    padding-right: 35px;
    position: relative;
    width: 300px;
    float: left;
    margin-top: 19px;
    margin-right: 15px;
    box-shadow: 0 0 10px rgb(0 0 0 / 50%);
}

#layerSearch {
    border: 1px solid #CCCCCC;
    padding-right: 35px;
    position: relative;
    width: 300px;
    margin: 20px;
}

.search-input {
    box-sizing: border-box;
    width: 100%;
    height: 35px;
    border: none;
    background: none;
    padding: 0 10px;
    background: white;
    font-family: 'roboto_bold';
}

.search-button {
    box-sizing: border-box;
    width: 35px;
    height: 35px;
    border: none;
    background: none;
    position: absolute;
    right: 0;
    top: 0;
    padding: 0;
    cursor: pointer;
    font-family: 'fontawesome';
    color: #000;
    background: white;
}


/* Suchresultat */

.searchResult {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background-color: #FFFFFF;
    margin-top: 10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    overflow: hidden;
}

.searchResult-close {
    float: right;
    margin: 10px;
    font-family: 'fontawesome';
}

.searchResult-title {
    color: #e20613;
    font-family: 'roboto_bold';
    margin: 10px 20px;
}

.searchResult-results {
    font-size: 85%;
    margin: 0 20px 25px 20px;
}

.searchResult-results-title {
    margin: 10px 0;
    background-color: #efefef;
    padding: 5px 10px;
}

.searchResult-results-list {
    margin: 10px 20px;
}

.searchResult-results-list-item {
    display: block;
    margin: 5px 20px;
    padding-left: 10px;
}

.searchResult-results-list-item::before {
    content: '\f0da';
    font-family: 'fontawesome';
    color: #e20613;
    display: inline-block;
    width: 10px;
    margin-left: -10px;
}

.searchResult-results-list-item:hover {
    color: #e20613;
}

.searchResult-results-navigation {
    text-align: center;
    margin: 10px;
}

.searchResult-results-navigation-item:hover,
.searchResult-results-navigation-item.active {
    color: #e20613;
    font-family: 'roboto_bold';
}

.searchResult-results .shopTemplate-list {
    margin: 0 -1.25%;
    display: flex;
    flex-wrap: wrap;
}

.searchResult-results .shopTemplate-list .shopTemplate-list-item {
    width: 22.5%;
    margin: 10px 1.25%;
}

.searchResult-results .shopTemplate-list .shopTemplate-list-item-inner {
    display: block;
    margin: 0;
    border: 1px solid #999999;
}

.searchResult-results .shopTemplate-list .shopTemplate-list-item-title {
    height: 65px;
}

.searchResult-results .shopTemplate-list .shopTemplate-list-item-title .title {
    font-size: 120%!important;
    color: black;
}

.searchResult-results .shopTemplate-list .shopTemplate-list-item-title .subtitle {
    font-size: 120%!important;
    color: black;
    padding-top: 5px;
    line-height: 1.25;
    font-family: 'roboto_bold';
}

.searchResult-results .shopTemplate-list-item-image {
    line-height: 0;
    margin: 10px 10px 0 10px;
    min-height: 190px;
    text-align: center;
    overflow: hidden;
    display: flex;
    align-items: center;
}


/* Head-Warenkorb */

#layerHeadCart {
    float: left;
    margin-left: 5px;
}

.shopCart {
    position: relative;
}

.shopCart-button {
    height: 74px;
    width: 74px;
    color: #999999;
    cursor: pointer;
    border: none;
    background: none;
    position: relative;
}

.shopCart.open .shopCart-button::after {
    content: '\f107';
    font-size: 110%;
    font-family: 'fontawesome';
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
}

.shopCart-button-icon {
    display: inline-block;
    font-family: 'fontawesome';
    font-size: 150%;
    margin-bottom: 5px;
    position: relative;
}

.shopCart-button-count {
    position: absolute;
    top: 10px;
    right: 5px;
    font-family: 'roboto_bold';
    color: #FFFFFF;
    background-color: #999999;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    border-radius: 50%;
    font-size: 90%;
}

.shopCart-content {
    position: absolute;
    top: 100%;
    width: 170px;
    left: 50%;
    margin-left: -100px;
    background-color: #FFFFFF;
    padding: 15px;
    display: none;
    font-size: 80%;
}

.shopCart.open .shopCart-content {
    display: block;
}

.shopCart-content-title {
    font-family: 'roboto_bold';
    margin-bottom: 10px;
}

.shopCart-content-success {
    font-size: 80%;
    margin-bottom: 10px;
    padding: 10px;
}

.shopCart-content-success::before {
    display: none;
}

.shopCart-content-link {
    display: block;
    margin-top: 10px;
    width: 100%;
    height: 25px;
    line-height: 24px;
    text-align: center;
    background-color: #e20613;
    color: #FFFFFF;
}


/* Head-Login */

#layerHeadLogin {
    float: left;
    margin-left: 5px;
}

.loginSmall {
    position: relative;
}

.loginSmall-button {
    height: 74px;
    width: 74px;
    color: #999999;
    cursor: pointer;
    border: none;
    background: none;
    position: relative;
}

.loginSmall-button-icon {
    display: inline-block;
    font-family: 'fontawesome';
    font-size: 150%;
    margin-bottom: 5px;
    position: relative;
}

.loginSmall.open .loginSmall-button::after {
    content: '\f107';
    font-size: 110%;
    font-family: 'fontawesome';
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
}

.loginSmall-form {
    position: absolute;
    top: 100%;
    width: 170px;
    left: 50%;
    margin-left: -100px;
    background-color: #FFFFFF;
    padding: 15px;
    display: none;
    font-size: 80%;
}

.loginSmall.open .loginSmall-form {
    display: block;
}

.loginSmall-form-title {
    font-family: 'roboto_bold';
    margin-bottom: 10px;
}

.loginSmall-form-text {
    margin-bottom: 10px;
}

.loginSmall-form-error {
    font-size: 80%;
    margin-bottom: 10px;
    padding: 10px;
}

.loginSmall-form-error:before {
    display: none;
}

.loginSmall-form-item {
    margin-bottom: 5px;
}

.loginSmall-form-input {
    box-sizing: border-box;
    width: 100%;
    padding: 5px;
    height: 25px;
    border-radius: 3px;
    border: 1px solid #999999;
}

.loginSmall-form-button {
    box-sizing: border-box;
    width: 100%;
    height: 25px;
    border: none;
    background: #e20613;
    color: #FFFFFF;
    cursor: pointer;
}


/* Theme */

#containerTheme {
    z-index: 1;
    position: relative;
}

#layerTheme {
    max-height: 280px;
    overflow: hidden;
}

#layerTheme img {
    width: 100%;
    height: auto;
}

.itemTheme {
    line-height: 0;
}

#layerTheme .bx-prev,
#layerTheme .bx-next {
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    line-height: 0;
    font-family: 'fontawesome';
    color: rgba(255, 255, 255, 0.5);
    font-size: 500%;
}

#layerTheme .bx-prev {
    left: 3%;
}

#layerTheme .bx-next {
    right: 3%;
}


/* Navigation */

#containerNavigation {
    background-color: #e20613;
    padding: 0 20px;
}

.containerStartNavigation {
    box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.8);
}

#buttonNavigation {
    display: block;
    height: 40px;
    line-height: 40px;
    color: #FFFFFF;
    text-transform: uppercase;
    font-family: 'roboto_bold';
    font-size: 90%;
    cursor: pointer;
    overflow: hidden;
    display: none;
}

#buttonNavigation:after {
    content: '\f0c9';
    font-family: 'fontawesome';
    float: right;
    font-size: 120%;
}

#layerNavigation {
    max-width: 1300px;
    margin: 0 auto;
}

#layerNavigation ul {
    list-style: none;
}

.naviLinkTopItem1 {
    float: left;
    position: relative;
}

.naviLinkTop1 {
    display: block;
    padding: 10px 15px;
    color: #FFFFFF;
    text-transform: uppercase;
    font-family: 'roboto_regular';
    font-size: 90%;
}

.naviLinkTopItem1:hover .naviLinkTop1,
.naviLinkTop1.open {
    background-color: #e0e0e0;
    color: inherit;
}

.naviLinkTop1.open {
    font-family: 'roboto_bold';
}

.naviLinkTopItem1 .containerNaviMouseOver1 {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #e0e0e0;
    width: 1000px;
    padding: 15px 20px;
    display: none;
    z-index: 9;
}

.naviLinkTopItem1:hover .containerNaviMouseOver1 {
    display: block;
}

.containerNaviMouseOver1 .naviLinkTopOver2Root {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
}

.containerNaviMouseOver1 .naviLinkTopOver2Root .naviLinkTopOverItem2 {
    width: 30%;
}

.containerNaviMouseOver1 .naviLinkTopOver2Root .naviLinkTopOverItem2 .naviLinkTopOver2 {
    border-bottom: 1px solid #CCCCCC;
}

.naviLinkTopOver2 {
    font-family: 'roboto_bold';
    display: block;
    padding: 5px 0;
}

.naviLinkTopOverOver3Root {
    margin-bottom: 15px;
}

.naviLinkTopOverOver3 {
    display: block;
    padding: 5px 0;
}

.naviLinkTopOverItem2:hover .naviLinkTopOver2,
.naviLinkTopOverOver3:hover {
    color: #e20613;
}


/* Navigation-Mobile */

#layerNavigationMobile {
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    z-index: 9999;
    background-color: #e20613;
    overflow: auto;
    display: none;
    -webkit-transition: width 500ms;
    transition: width 500ms;
}

#buttonNavigationMobileClose {
    font-family: 'fontawesome';
    position: absolute;
    right: 20px;
    top: 20px;
    color: #FFFFFF;
    font-size: 160%;
    cursor: pointer;
}

#layerNavigationMobile ul {
    list-style: none;
}

.naviLinkMobile1Root {
    padding: 20px 60px 20px 20px;
}

.naviLinkMobile1Root ul {
    font-size: 95%;
}

.naviLinkMobile2Root {
    border-top: 1px solid #FFFFFF;
}

.naviLinkMobile3Root {
    border-top: 1px dotted #FFFFFF;
}

#layerNavigationMobile a {
    display: block;
    color: #FFFFFF;
    padding: 10px;
}

#layerNavigationMobile a:hover,
#layerNavigationMobile a.open {
    background-color: rgba(255, 255, 255, 0.2);
}

.naviLinkMobile1 {
    font-family: 'roboto_bold';
}


/* Main */

#containerMain {
    padding: 20px 20px 0 20px;
    margin-bottom: 30px;
}

.containerStart {
    position: relative;
}

#background-video {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
}

#layerMain {
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

#layerMainNavigation {
    position: fixed;
    overflow: auto;
    z-index: 10;
    background: white;
    padding: 10px 20px 10px 40px;
    left: 0;
    box-shadow: 0 0 20px rgb(0 0 0 / 30%);
}

#layerMainNavigation.open {
    min-width: 20%;
    top: 190px;
    bottom: 10px;
}

#buttonMainNavigation {
    display: block;
    overflow: hidden;
    cursor: pointer;
    width: 100%;
    text-align: right;
}

#buttonMainNavigation.open {
    margin-bottom: 0.5rem;
}

#buttonMainNavigation:after {
    content: '\f061';
    font: var(--fa-font-light);
    font-size: 1.4rem;
}

#buttonMainNavigation.open:after {
    content: '\f00d';
}

#mainNavigation {
    height: 0;
    width: 0;
    overflow: hidden;
}

#mainNavigation.open {
    width: 100%;
    height: auto;
    min-height: 500px;
    overflow-y: auto;
}

#layerMainContent {
    width: 100%;
}

#layerMainContent .bottom {
    width: 100%;
    margin-top: 20px;
}

#layerMainBottom {
    width: 100%;
}

#buttonTop {
    position: fixed;
    right: 20px;
    bottom: 20px;
    background-color: #CCCCCC;
    font-family: 'fontawesome';
    display: block;
    width: 35px;
    height: 35px;
    line-height: 34px;
    text-align: center;
    font-size: 120%;
    display: none;
}


/* Contentlayer */

.contentlayer {
    position: absolute;
    margin: 0 auto;
    top: 50px;
    left: 0;
    right: 0;
    max-width: 800px;
    z-index: 99;
}

.contentlayer-inner {
    margin: 0 20px;
    background-color: #FFFFFF;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

.contentlayer-head {
    overflow: hidden;
    margin: 0 20px;
}

.contentlayer-head-close {
    font-family: 'fontawesome';
    float: right;
    color: #CCCCCC;
    font-size: 200%;
    margin-top: 20px;
}

.contentlayer-footer {
    border-top: 1px dotted #CCCCCC;
    margin: 20px;
    padding: 5px 0;
    color: #CCCCCC;
    text-align: right;
    font-size: 90%;
}


/* Breadcrumbs */

#layerMainBreadcrumbs {
    width: 100%;
    margin-bottom: 20px;
    color: #e20613;
    font-size: 90%;
}

.breadcrumbs-title {
    font-family: 'roboto_bold';
    margin-right: 10px;
}

.breadcrumbs-item-link:hover {
    color: #333333;
}


/* Main-Navigation */

#layerMainNavigation ul {
    list-style: none;
}

.naviLinkLeftItem2 {
    position: relative;
    margin-bottom: 10px;
}

.naviLinkLeft2 {
    display: block;
    font-family: 'roboto_bold';
    padding: 5px 10px;
    font-size: 90%;
}

.naviLinkLeftItem2:hover .naviLinkLeft2,
.naviLinkLeft2.open {
    background-color: #CCCCCC;
}

.naviLinkLeft3Root {
    margin-bottom: 10px;
    border-bottom: 1px dotted #CCCCCC;
    padding-bottom: 10px;
}

.naviLinkLeft3 {
    font-size: 90%;
    display: block;
    padding: 5px 5px 5px 20px;
}

.naviLinkLeft3:before {
    content: '\f0da';
    font-family: 'fontawesome';
    width: 10px;
    margin-left: -10px;
    display: inline-block;
}

.naviLinkLeft3:hover,
.naviLinkLeft3.open {
    font-family: 'roboto_bold';
}

.naviLinkLeftItem2 .containerNaviMouseOver2 {
    position: absolute;
    left: 100%;
    top: 0;
    background-color: #CCCCCC;
    width: 240px;
    z-index: 9;
    display: none;
}

.naviLinkLeftItem2:hover .containerNaviMouseOver2 {
    display: block;
}

.naviLinkLeftOver3 {
    display: block;
    padding: 5px 10px;
    font-size: 90%;
}

.naviLinkLeftOver3:hover {
    color: #CCCCCC;
    background-color: #333333;
}


/* Shop Filter Head */

.containerShopHead {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    width: 100%;
    align-items: stretch;
}

.containerShopHead .containerNaviLeft {
    margin: 20px;
    padding: 10px 20px;
    border: 1px solid #eee;
    width: 200px;
}

.containerShopHead .containerNaviLeft a {
    display: block;
    font-family: 'roboto_bold';
    margin: 2px 0;
}

.containerShopHead .containerNaviLeft a:hover {
    color: #e20613;
    transition: all 0.5s ease-out;
}

.containerFilterRight {
    width: 100%;
}


/* Content */

.itemContent {
    background-color: #FFFFFF;
    overflow: hidden;
    margin-bottom: 20px;
    position: relative;
}

.itemContent .head {
    margin: 20px;
    overflow: hidden;
}

.itemContent .title {
    color: #e30613;
    font-size: 140% !important;
}

.itemContent .subtitle {
    font-size: 100%;
}

.itemContent .text {
    margin: 20px;
    font-size: 90%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.itemContent .text .special-container {
    margin-bottom: 10px;
}

.itemContent .text .text-box.col-2 {
    width: 47.5%!important;
    padding: 0!important;
    border: none!important;
    float: none!important;
    margin-bottom: 10px;
}

.itemContent .text .text-box.col-3 {
    width: 30%!important;
    padding: 0!important;
    border: none!important;
    float: none!important;
}

.itemContent .text .text-box.col-4 {
    width: 22%!important;
    padding: 0!important;
    border: none!important;
    float: none!important;
}

.itemContent .text .text-box.column-2 {
    width: 100%!important;
    padding: 0!important;
    border: none!important;
    columns: 2;
    column-gap: 5%;
    margin-bottom: 10px;
}

.itemContent .text hr {
    margin: 0;
    border: none;
    height: 1px;
    background: #ccc;
    width: 100%;
    margin-bottom: 10px;
}

.itemContent .text h1 {
    color: #e30613;
    font-size: 150%;
}

.itemContent .text h2 {
    font-size: 110%;
}

.itemContent .text p,
.contentbox-text p {
    margin: 10px 0;
    width: 100%;
}

.itemContent .text p:last-child,
.contentbox-text p:last-child {
    margin-bottom: 0;
}

.itemContent .text a,
.contentbox-text a {
    color: #e30613;
    font-family: 'roboto_bold';
}

.itemContent .text a:hover,
.contentbox-text a:hover {
    opacity: 0.5;
    transition: all 0.5s ease-out;
}

.itemContent .text ul {
    margin-left: 20px;
}

.itemContent .form {
    margin: 20px;
}

.imageContentLeft {
    width: 180px;
    height: auto;
    float: left;
    margin: 0 20px 20px 0;
}

.imageContentRight {
    width: 180px;
    height: auto;
    float: right;
    margin: 0 0 20px 20px;
}

.itemContent.imageTop .image {
    line-height: 0;
    margin: 20px 0;
}

.itemContent.imageTop .image img {
    width: 100%;
    height: auto;
}


/* Content Layer */

#containerContentLayer {
    left: 50%;
    margin-left: -300px;
    position: absolute;
    z-index: 7;
    width: 600px;
    top: 150px;
    z-index: 99;
    background-color: rgba(255, 255, 255, 0.98);
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2);
}

.contentLayerClose {
    height: 27px;
    width: 27px;
    display: block;
    background-image: url(../img/lb/close.png);
    background-repeat: no-repeat;
    position: absolute;
    right: 25px;
    top: 25px;
}

#layerContentLayerHead {
    padding: 35px 60px;
    text-align: center;
    background-color: #FFFFFF;
}

#layerContentLayerHead img {
    max-height: 100%;
    width: auto;
}

#layerContentLayerBody {
    text-align: left;
}

.areaContentLayerText {
    padding: 10px 0px;
    margin: 0px 25px;
    border-bottom: 1px solid #CCC;
    border-top: 1px solid #CCC;
    color: #666666;
}

.areaContentLayerText a {
    color: #e20613;
}

.areaContentLayerText .pusherTitle {
    font-family: 'roboto_bold';
    color: #e20613;
}

.areaContentLayerText .pusherSubTitle {
    font-family: 'roboto_bold';
    font-size: 90%;
    color: #e20613;
}

#layerContentLayerFooter {
    height: 30px;
}

#areaContentLayerTextFooter {
    height: 30px;
    line-height: 30px;
    text-align: right;
    padding-left: 25px;
    padding-right: 25px;
}

.contentLayerLink {
    color: #000;
    text-decoration: none;
    font-size: 10pt;
}

.contentLayerLink:hover {
    color: #e20613;
    text-decoration: none;
}


/* Youtube */

.itemContent .video {
    margin: 20px;
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 */
    overflow: hidden;
}

.videoplayer {
    position: absolute;
    display: block;
    height: 100%;
    width: 100%;
}


/* Contentbox */

.contentbox {
    margin: 0 -10px;
    margin-bottom: -20px;
}

.contentbox-item {
    margin-bottom: 20px;
    display: inline-block;
    width: 25%;
    vertical-align: top;
}

.contentbox-inner {
    margin: 0 10px;
    background-color: #FFFFFF;
    overflow: hidden;
    border: 1px solid #eee;
}

.contentbox-inner .video {
    margin: 10px 0;
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 */
    overflow: hidden;
}

.contentbox-head {
    margin: 10px 15px;
}

.contentbox-title {
    color: #e30613;
    font-family: 'roboto_bold';
}

.contentbox-subtitle {
    font-size: 90%;
    color: #999999;
}

.contentbox-image {
    margin: 10px 0;
    line-height: 0;
}

.contentbox-image a:hover {
    opacity: 0.7;
    transition: all 0.5s ease-out;
}

.contentbox-image img {
    width: 100%;
    height: auto;
}

.contentbox-text {
    font-size: 85%;
    margin: 10px 15px;
}


/* Contentbox links */

.contentboxLeft {
    margin-bottom: 0;
}

.contentboxLeft .contentbox-item {
    width: 100%;
}


/* Start */

#containerStart {
    margin-bottom: 40px;
}

#layerStartContent {
    max-width: 1300px;
    margin: 0 auto 20px auto;
    padding: 0 20px;
}

#layerStartContent.bottom {
    margin: 20px auto 0 auto;
}

#layerStartContent .itemContent {
    margin-bottom: 0;
    background: none;
}

#layerStartContent.bottom .itemContent {
    margin-bottom: 20px;
}

#layerStartContent .itemContent .head,
#layerStartContent .itemContent .text,
#layerStartContent .itemContent .video {
    margin: 0 0 20px 0;
}

#layerStartBox {
    max-width: 1020px;
    margin: 0 auto;
    padding: 0 10px;
    margin-bottom: 20px;
}

.itemStartBox {
    width: 25%;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 20px;
}

.itemStartBoxInner {
    margin: 0 10px;
    background-position: center;
    background-size: cover;
    position: relative;
}

.itemStartBoxImage {
    line-height: 0;
    visibility: hidden;
}

.itemStartBoxImage img {
    width: 100%;
    height: auto;
}

.itemStartBoxTitle {
    position: absolute;
    bottom: 20px;
    left: 0;
    width: 100%;
}

.itemStartBoxTitle h2 {
    display: block;
    margin: 0 20px;
    background-color: #CCCCCC;
    padding: 10px;
    text-align: center;
    text-transform: uppercase;
    font-family: 'roboto_bold';
    font-size: 90%;
}

.itemStartBoxLink {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

#layerStartContentBox {
    max-width: 1300px;
    padding: 0 20px;
    margin: 0 auto;
}

.contentboxStart .contentbox-item {
    width: 25%;
}


/* Formulare */

.tableElementRow {
    width: 100%;
}

.validateMessage {
    background-color: #9f0000;
    color: #FFFFFF;
    font-size: 90%;
    padding: 8px 10px;
    margin-bottom: 20px;
    border-radius: 5px;
}

.validateMessage::before {
    content: '\f071';
    font-family: 'fontawesome';
    display: inline-block;
    margin-right: 10px;
}

.formLabel {
    width: 120px;
    vertical-align: top;
    font-family: 'roboto_bold';
    font-size: 95%;
    padding-bottom: 5px;
}

.formLabelMandatory {
    padding-left: 120px;
    font-size: 80%;
}

.formValue,
.formValueZIP,
.formValuePlace,
.formValueZIPSmall {
    padding-bottom: 5px;
}

.formValueZIPSmall {
    width: 50px;
}

.formValueZIP {
    width: 100px;
    padding-right: 5px;
}

.formInput,
.formInputMandatory,
.formSelect,
.formSelectMandatory,
.formTextarea,
.formInputCaptchaMandatory,
.buttonRefreshCaptcha,
.cmdSendLarge {
    box-sizing: border-box;
    width: 100%;
    height: 25px;
    border: 1px solid #CCCCCC;
    font-size: 95%;
    padding: 0 5px;
}

.formInputMandatory,
.formSelectMandatory {
    background-color: #f1f1f1;
}

.formTextarea {
    height: auto;
    min-height: 180px;
    padding: 5px 10px;
    resize: vertical;
    font-family: 'roboto_light';
}

.count_text {
    display: none;
}

.labelCaptcha {
    font-size: 80%;
}

.buttonRefreshCaptcha {
    font-size: 80%;
    margin-top: 5px;
    background: #f1f1f1;
    cursor: pointer;
}

.buttonRefreshCaptcha:hover {
    background: #CCCCCC;
}

.functionBarLarge {
    text-align: right;
}

.cmdSendLarge {
    width: auto;
    background: #e20613;
    color: #FFFFFF;
    border: none;
    font-family: 'roboto_bold';
    font-weight: normal;
    padding: 0 10px;
    cursor: pointer;
}

.formValueCheckbox {
    padding-left: 120px;
    padding-bottom: 5px;
    width: 25px;
}

.formValueCheckbox input {
    vertical-align: middle;
}

.formLabelCheckbox {
    padding-bottom: 5px;
    font-size: 95%;
}


/* Footer */

#containerFooter {
    border-top: 10px solid #e20613;
    padding: 0 20px;
}

.containerFooterStart {
    box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.8);
    background: #eee;
}

#layerFooter {
    max-width: 1300px;
    margin: 0 auto;
    padding: 30px 0;
}

#layerFooterAddress {
    width: 26%;
    float: left;
    font-size: 85%;
}

#layerFooterAddress .title {
    font-size: 110%;
}

#layerFooterAddress p {
    margin-bottom: 10px;
}

#layerFooterAddress a {
    color: #e30613;
}

#layerFooterNavigation {
    width: 20%;
    float: left;
    font-size: 85%;
}

#layerFooterNavigation ul {
    list-style: none;
}

.naviLinkFooter1Root {
    margin-right: 20px;
}

#layerFooterNavigation a {
    display: block;
}

.naviLinkFooterItem1 {
    margin-bottom: 10px;
}

.naviLinkFooter1 {
    font-family: 'roboto_bold';
}

.naviLinkFooter2Root {
    margin-top: -10px;
    margin-bottom: 10px;
}

#layerFooterContent {
    width: 54%;
    float: right;
}

#layerFooterText .itemContent {
    background: none;
}

#layerFooterText .itemContent .head,
#layerFooterText .itemContent .text,
#layerFooterText .itemContent .video {
    margin: 0 0 20px 0;
}

#layerFooterImprint {
    font-size: 80%;
}


/* ShopTemplate */

.buttonBack {
    margin: 0 20px;
    display: flex;
    justify-content: space-between;
}

.buttonBack .backLink {
    padding: 5px 10px;
    background-color: #efefef;
    font-size: 0.8rem;
    cursor: pointer;
}

.buttonBack .backLink:hover {
    color: white;
    background-color: #e20613;
    transition: all 0.5s ease-out;
}

.shopTemplate-error {
    margin: 20px;
}

.shopTemplate-title {
    margin: 20px;
    background-color: #efefef;
    padding: 10px;
    font-family: 'roboto_bold';
}

.shopTemplate-filter {
    margin: 20px;
    background-color: #efefef;
    overflow: hidden;
}

.shopTemplate-filter.attributes {
    background-color: #e30613;
}

.shopTemplate-filter-title {
    margin: 10px;
    font-family: 'roboto_bold';
}

.shopTemplate-filter-item {
    margin: 10px;
    overflow: hidden;
}

.shopTemplate-filterDeko {
    position: absolute;
    right: 30px;
    font-size: 0.9rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-top: 30px;
}

.shopTemplate-filter-label {
    width: 60px;
    float: left;
    line-height: 25px;
    font-size: 90%;
    font-family: 'roboto_bold';
    color: #FFFFFF;
}

.shopTemplate-filter-value {
    margin-left: 60px;
}

#articleGroupKanton {
    margin-bottom: 5px;
}

.shopTemplate-filter-select,
.shopTemplate-filter-input {
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    border: none;
    color: #666666;
    background: #ffffff;
    padding: 0 10px;
    /*background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 100%);
    background: -webkit-linear-gradient(top, #ffffff 0%, #f3f3f3 100%);
    background: linear-gradient(to bottom, #ffffff 0%, #f3f3f3 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f3f3', GradientType=0);*/
}

.shopTemplate-filter-select option {
    background-color: #FFFFFF;
}

.shopTemplate-filter-input {
    padding: 0 5px;
}

.ui-autocomplete {
    position: absolute;
    top: 0;
    left: 0;
    list-style: none;
    background-color: #f3f3f3;
    border: 1px solid #b2b2b2;
    border-top: none;
    font-size: 90%;
}

.ui-menu-item-wrapper {
    position: relative;
    padding: 5px 10px;
    cursor: pointer;
}

.ui-state-active {
    border: 1px solid #999999;
    background: #b2b2b2;
    color: #ffffff;
}

.shopTemplate-filter-error {
    display: none;
    margin: 10px 0;
    font-size: 80%;
}

.shopTemplate-carousel {
    margin: 20px;
    overflow: hidden;
    padding-top: 15px;
}

.flipster__item__content {
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

.shopTemplate-carousel-item {
    width: 200px;
    position: relative;
    list-style-type: none;
}

.flipster__item__content .shopTemplate-carousel-item-lowest {
    position: absolute;
    width: 60px;
    height: 47px;
    padding-top: 13px;
    border-radius: 50%;
    background-color: #e20613;
    color: #FFFFFF;
    text-align: center;
    top: -10px;
    right: -10px;
    z-index: 1;
    font-family: 'roboto_bold';
    line-height: 15px;
    font-size: 90%;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    border: 2px solid #FFFFFF;
}

.shopTemplate-carousel-item .shopTemplate-carousel-item-lowest {
    position: absolute;
    width: 60px;
    height: 47px;
    padding-top: 13px;
    border-radius: 50%;
    background-color: #e20613;
    color: #FFFFFF;
    text-align: center;
    top: -10px;
    left: -15px;
    z-index: 1;
    font-family: 'roboto_bold';
    line-height: 15px;
    font-size: 90%;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    border: 2px solid #FFFFFF;
}

.shopTemplate-carousel-item-image {
    margin: 10px;
    position: relative;
}

.shopTemplate-carousel-item-image img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}

.shopTemplate-carousel-item-link {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.7);
    -webkit-transition: opacity 500ms;
    transition: opacity 500ms;
    opacity: 0;
}

.shopTemplate-carousel-item-link::after {
    font-size: 200%;
    font-family: 'fontawesome';
    content: '\f00e';
    color: #FFFFFF;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.shopTemplate-carousel-item.flipster__item--current .shopTemplate-carousel-item-link {
    display: block;
}

.shopTemplate-carousel-item.flipster__item--current .shopTemplate-carousel-item-image:hover .shopTemplate-carousel-item-link {
    opacity: 1;
}

.shopTemplate-carousel-item-info {
    margin: 10px;
    overflow: hidden;
}

.shopTemplate-carousel-item-title {
    font-family: 'roboto_bold';
    font-size: 90%;
}

.shopTemplate-carousel-item-number {
    color: #999999;
    font-size: 80%;
    float: left;
}

.shopTemplate-carousel-item-price {
    color: #e30613;
    font-size: 80%;
    float: right;
}

.shopTemplate-list {
    margin: 20px 0 20px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}

.shopTemplate-list-item {
    width: 20%;
    margin: 0 2.5% 20px 2.5%;
    transition: transform .2s;
}

.shopTemplate-list-item-inner {
    display: block;
    /*margin: 0 10px;
    border: 1px solid #999999;*/
}

.shopTemplate-list-item:hover {
    transition: all 0.5s ease-out;
    transform: scale(1.1);
}

.shopTemplate-list-item-image {
    display: block;
    line-height: 0;
    margin: 0;
    min-height: 50px;
    text-align: center;
}

.shopTemplate-list-item-title {
    display: block;
    font-size: 75%;
    margin: 0;
    height: 40px;
    position: relative;
}

.shopTemplate-list-item-title-inner {
    display: block;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    line-height: 100%;
}

.shopTemplate-list-item-lowestPrice {
    display: block;
    font-size: 70%;
    height: 50px;
    width: 50px;
    position: relative;
    float: right;
    border-radius: 50px;
    background-color: #e20613;
    color: #FFFFFF;
    margin-top: -85px;
    margin-right: -8px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    border: 2px solid #FFFFFF;
    text-align: center;
}

.shopTemplate-list-item-lowestPrice-inner {
    vertical-align: middle;
    text-align: center;
    top: 15%;
    position: relative;
}

.button-show-all {
    margin: 0 20px;
    color: #FFF;
    background: #008e00;
    text-align: center;
    padding: 5px 20px;
    border-radius: 3px;
    cursor: pointer;
}

.button-show-all:hover {
    color: #FFF;
    background: #555;
    transition: all 0.75s ease-out;
}

.shopTemplate-table {
    margin: 20px;
}

.shopTemplate-table-head {
    font-family: 'roboto_bold';
    border-bottom: 2px solid #000000;
}

.shopTemplate-table table {
    border-collapse: collapse;
}

.shopTemplate-table td {
    padding: 5px;
    border-bottom: 1px solid #bbbbbb;
    vertical-align: top;
    font-size: 80%;
}

.shopTemplate-table-highlight {
    background-color: #efefef;
}

.shopTemplate-table-highlight:hover,
.shopTemplate-table-column-active {
    background-color: #cccccc;
    font-family: 'roboto_bold';
    font-size: 85% !important;
}

.shopTemplate-table-title {
    font-family: 'roboto_bold';
    font-size: 85% !important;
}

.shopTemplate-table-link {
    display: block;
    height: 20px;
}

.shopTemplate-table-reset {
    width: 100%;
    height: 40px;
}

.shopTemplate-table-reset-link {
    display: block;
    float: right;
    margin-top: 10px;
    padding: 5px;
    border: 2px solid #e20613;
    border-radius: 5px;
    font-family: 'roboto_regular';
    font-size: 90%;
    color: #e20613;
    background: linear-gradient(to left, #e20613 50%, #FFFFFF 50%);
    background-size: 200% 100%;
    background-position: left bottom;
    transition: all 1s linear;
}

.shopTemplate-table-reset-link:hover {
    background-position: right bottom;
    color: #FFFFFF;
}


/* Shopdetail */

.shopDetail-content.text {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-start;
    align-items: stretch;
}

.shopDetail-image {
    width: 50%;
    text-align: center;
    line-height: 0;
}

.shopDetail-image-inner {
    border: 1px solid #CCCCCC;
}

.shopDetail-image-pager {
    overflow: hidden;
    margin: 0 -5px;
    text-align: left;
}

.shopDetail-image-pager-item {
    display: inline-block;
    vertical-align: top;
    width: 50%;
    margin-top: 10px;
}

.shopDetail-image-pager-item-inner {
    border: 1px solid #CCCCCC;
    margin: 0 5px;
}

.shopDetail-right {
    width: 45%;
    display: flex;
    flex-wrap: wrap;
}

.shopDetail-text {
    margin-bottom: 15px;
    width: 100%;
}

.shopDetail-attributes {
    margin-bottom: 15px;
    width: 100%;
}

.shopDetail-attributes-item {
    margin-bottom: 5px;
    overflow: hidden;
}

.shopDetail-attributes-label {
    width: 120px;
    float: left;
    font-family: 'roboto_bold';
}

.shopDetail-attributes-label.select {
    width: 120px;
    float: left;
    font-family: 'roboto_bold';
    line-height: 280%;
}

.shopDetail-attributes-value {
    margin-left: 120px;
    overflow: hidden;
    position: relative;
}

.shopDetail-element-select,
.shopDetail-element-deko {
    font-family: 'roboto_light';
    padding: 5px;
    width: 80%;
    margin: 5px 0;
}

#shopDetail-select-articleSize,
#shopDetail-select-articleModel,
#shopDetail-select-articleDeko {
    border: 1px solid #ccc;
}


/* Inhalt Accordion */

.shopDetail-accordion {
    width: 100%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.accordion-button {
    background-color: #efefef;
    color: rgba(0, 0, 0, 0.5);
    cursor: pointer;
    padding: 10px;
    width: 33.333%;
    border: none;
    text-align: left;
    outline: none;
    transition: 0.4s;
    position: absolute;
    top: 0;
    left: 0;
    margin-bottom: 8px;
    font-size: 0.75rem;
    border: 2px solid white;
}

#accordion-button-2 {
    left: 33.333%;
}

#accordion-button-3 {
    right: 0;
    left: unset;
}

.accordion-button h2 {
    font-weight: 300;
    font-size: 1.2rem;
    text-transform: uppercase;
    letter-spacing: 0.25px;
    font-family: 'fontawesome';
}

.accordionActive,
.accordion-button:hover {
    background: rgba(0, 0, 0, 0.7);
    color: white;
}

.shopDetail-accordion .accordion-content {
    padding: 0;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    margin-top: 1.25rem;
}

.shopDetail-accordion .accordion-content .head,
.shopDetail-accordion .accordion-content .text {
    margin: 10px 0;
}

.imageSizeTable {
    margin-top: 1rem;
}

.accordion-button:after {
    content: '\f0dd';
    font-family: 'fontawesome';
    font-size: 1rem;
    color: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0;
    right: 10px;
    line-height: 1.65rem;
}

.accordionActive:after {
    content: '\f0de';
    line-height: 2.5rem;
    color: white;
}

.accordion-button:hover:after {
    color: white;
}

.shopDetail-info-button {
    display: inline-block;
    color: #e30613;
    cursor: pointer;
    position: absolute;
    top: 5px;
    left: 83%;
}

.shopDetail-info-button a {
    font-size: 30px;
    font-family: 'fontawesome'!important;
    color: #e30613;
    cursor: pointer;
}

.shopDetail-info-button a:hover {
    color: #333;
    text-decoration: none!important;
    transition: all 0.5s ease-out;
}

.infoShow p {
    margin: 0;
}

.shopDetail-info-button:hover span {
    display: block;
}

.shopDetail-attributes-file::before {
    font-family: 'fontawesome';
    content: '\f0f6\00A0';
}

.shopDetail-addItem {
    height: 25px;
    padding-right: 25px;
    position: relative;
}

.shopDetail-addItem-input {
    box-sizing: border-box;
    height: 25px;
    width: 100%;
    border: 1px solid #008E00;
    background: #FFFFFF;
    border-radius: 3px 0 0 3px;
    padding: 0 5px;
    width: 80px;
}

.shopDetail-addItem-button {
    box-sizing: border-box;
    height: 25px;
    border: none;
    background: #008E00;
    color: #FFFFFF;
    position: absolute;
    top: 0;
    cursor: pointer;
    font-family: 'fontawesome';
    border-radius: 0 3px 3px 0;
}

.shopDetail-addItem-button:hover {
    background: rgba(0, 142, 0, 0.3);
    color: #008E00;
    transition: all 0.75s ease-out;
}

.shopDetail-addItem-button span {
    font-family: 'roboto_light';
    font-size: 95%;
}


/* ShopOrder */

.shopOrder-error,
.shopOrder-success {
    margin: 20px;
}

.shopOrder-PDF {
    float: right;
    font-family: 'fontawesome';
    text-decoration: none;
    color: #e20613;
    font-size: 160%;
}


/* ShopOrder-Progress */

.shopOrder-progress {
    overflow: hidden;
    margin: 20px;
}

.shopOrder-progress-item {
    float: left;
    display: block;
    width: 16.6666%;
    color: #333;
    text-align: center;
}

.shopOrder-progress-item.open {
    background-color: #eee;
    color: #333;
}

.shopOrder-progress-item.current {
    border-radius: 0 3px 3px 0;
}

.shopOrder-progress-item-icon {
    display: block;
    margin: 10px;
    font-family: 'fontawesome';
    font-size: 150%;
}

.shopOrder-progress-item-label,
.shopOrder-progress-item-num {
    display: block;
    margin: 10px;
    font-size: 80%;
}


/* ShopOrder-Action */

.shopOrder-action {
    overflow: hidden;
    margin: 20px;
}

.shopOrder-action-left {
    float: left;
}

.shopOrder-action-right {
    float: right;
}

.shopOrder-action-button {
    box-sizing: border-box;
    vertical-align: middle;
    display: inline-block;
    font-size: inherit;
    font-family: inherit;
    color: #FFFFFF;
    background: #333333;
    border: none;
    height: 25px;
    line-height: 24px;
    padding: 0 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 85%;
    text-align: center;
}

.itemContent-shopOrder-back {
    box-sizing: border-box;
    vertical-align: middle;
    display: inline-block;
    font-size: inherit;
    font-family: 'roboto_regular';
    color: #FFFFFF;
    background: #008E00;
    height: 25px;
    line-height: 24px;
    padding: 0 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 85%;
    text-align: center;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    margin-left: 20px;
}

.itemContent-shopOrder-back::before {
    content: "\f060\00A0";
    font-family: 'fontawesome';
}

.itemContent-shopOrder-back:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
}

.shopOrder-action-button::-moz-focus-inner {
    border: none;
    padding: 0;
}


/* ShopOrder-Cart */

.shopOrder-cart {
    margin: 20px;
    overflow: hidden;
}

.shopOrder-cart-list {
    margin-bottom: 20px;
    border-top: 1px dotted #CCCCCC;
    overflow: hidden;
}

.shopOrder-cart-item {
    overflow: hidden;
    border-bottom: 1px dotted #CCCCCC;
    padding: 10px 0;
}

.shopOrder-cart-item-delete {
    float: right;
}

.shopOrder-cart-item-delete-button {
    height: 25px;
    width: 25px;
    border: none;
    background: #333333;
    color: #FFFFFF;
    cursor: pointer;
    font-family: 'fontawesome';
    border-radius: 3px;
}

.shopOrder-cart-item-image {
    float: left;
    width: 20%;
    line-height: 0;
    border: 1px solid #CCCCCC;
    text-align: center;
}

.shopOrder-cart-item-right {
    margin-left: 20%;
    padding-left: 20px;
}

.shopOrder-cart-item-title {
    font-family: 'roboto_bold';
    color: #e20613;
}

.shopOrder-cart-item-subtitle {
    color: #999999;
}

.shopOrder-cart-item-attributes {
    margin-top: 10px;
    font-size: 85%;
}

.shopOrder-cart-item-attributes-item {
    margin-bottom: 5px;
}

.shopOrder-cart-item-attributes-label {
    font-family: 'roboto_bold';
    float: left;
    width: 120px;
}

.shopOrder-cart-item-attributes-value {
    margin-left: 120px;
    overflow: hidden;
}

.shopOrder-cart-item-attributes-link {
    overflow: hidden;
    float: right;
    margin-top: -20px;
}

.shopOrder-cart-item-update {
    height: 25px;
    padding-right: 25px;
    position: relative;
    width: 80px;
}

.shopOrder-cart-item-update-input {
    box-sizing: border-box;
    height: 25px;
    width: 100%;
    border: 1px solid #333333;
    background: #FFFFFF;
    border-radius: 3px 0 0 3px;
    padding: 0 5px;
}

.shopOrder-cart-item-update-button {
    box-sizing: border-box;
    height: 25px;
    width: 25px;
    border: none;
    background: #333333;
    color: #FFFFFF;
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    font-family: 'fontawesome';
    border-radius: 0 3px 3px 0;
}

.shopOrder-cart-item-price {
    margin-top: 20px;
    font-family: 'roboto_bold';
    text-align: right;
    background-color: #f3f3f3;
    padding: 5px 10px;
    border-radius: 3px;
}

.shopOrder-cart-voucher {
    margin: 20px 0;
    overflow: hidden;
}

.shopOrder-cart-voucher-label {
    width: 140px !important;
    line-height: 25px;
}

.shopOrder-cart-voucher-value {
    margin-right: 85px;
    margin-left: 140px !important;
}

.shopOrder-cart-voucher-input {
    border-radius: 3px 0 0 3px !important;
    vertical-align: middle;
}

.shopOrder-cart-voucher-action {
    float: right;
    width: 85px;
}

.shopOrder-cart-voucher-button {
    width: 85px;
    border-radius: 0 3px 3px 0 !important;
    vertical-align: middle;
}

.shopOrder-cart-summary {
    background-color: #f3f3f3;
    padding: 10px;
    border-radius: 3px;
}

.shopOrder-cart-summary-item {
    overflow: hidden;
    font-size: 85%;
}

.shopOrder-cart-summary-item.total {
    font-family: 'roboto_bold';
    border-top: 1px dotted #333333;
    padding-top: 10px;
    margin-top: 10px;
    font-size: 100%;
}

.shopOrder-cart-summary-label {
    float: left;
}

.shopOrder-cart-summary-currency {
    float: right;
}

.shopOrder-cart-summary-value {
    min-width: 100px;
    float: right;
    text-align: right;
}


/* ShopOrder-Address */

.shopOrder-address {
    margin: 20px;
    overflow: hidden;
}

.shopOrder-address-item {
    float: left;
    width: 50%;
}

.shopOrder-address-title {
    font-family: 'roboto_bold';
    margin-bottom: 5px;
    font-size: 85%;
}

.shopOrder-address-text {
    font-size: 85%;
}


/* ShopOrder-Attributes */

.shopOrder-attributes {
    margin: 20px;
    padding-bottom: 20px;
    border-bottom: 1px dotted #CCCCCC;
    overflow: hidden;
}

.shopOrder-attributes-item {
    overflow: hidden;
    font-size: 85%;
}

.shopOrder-attributes-label {
    font-family: 'roboto_bold';
    width: 170px;
    float: left;
}

.shopOrder-attributes-value {
    margin-left: 170px;
}


/* ShopOrder-Form */

.shopOrder-form {
    margin: 20px;
    overflow: hidden;
}

.shopOrder-form-item {
    overflow: hidden;
    margin-bottom: 5px;
}

.shopOrder-form-item a {
    color: #e20613;
    font-family: 'roboto_bold';
}

.shopOrder-form-item.half {
    float: left;
    width: 50%;
}

.shopOrder-form-label {
    font-family: 'roboto_bold';
    width: 120px;
    float: left;
    font-size: 85%;
}

.shopOrder-form-label.checkbox {
    width: auto;
    float: none;
    margin-left: 25px;
    font-family: inherit;
}

.shopOrder-form-label.checkbox1 {
    width: auto;
    float: none;
    margin-left: 25px;
    font-family: inherit;
}

.shopOrder-form-label.image {
    width: 300px;
    margin-top: 10px;
}

.shopOrder-form-value {
    margin-left: 120px;
    overflow: hidden;
}

.shopOrder-form-value.checkbox {
    margin-left: 0;
    width: 25px;
    float: left;
}

.shopOrder-form-input {
    box-sizing: border-box;
    font-family: inherit;
    width: 100%;
    border: 1px solid #CCCCCC;
    height: 25px;
    padding: 0 5px;
    background-color: #efefef;
    border-radius: 3px;
}

.shopOrder-form-textarea {
    box-sizing: border-box;
    font-family: inherit;
    width: 100%;
    border: 1px solid #CCCCCC;
    min-height: 100px;
    padding: 5px;
    background-color: #efefef;
    border-radius: 3px;
}

.shopOrder-form-input.zip {
    width: 20%;
    float: left;
}

.shopOrder-form-input.place {
    width: 78%;
    float: right;
}


/* Bewertungslinks */

.shopOrder-summary-google-link {
    margin: 20px;
}

.button-link {
    color: #FFF;
    background: #008e00;
    text-align: left;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
    margin: 5px 10px 5px 0;
    width: 45%;
    float: left;
}

.button-link:hover {
    color: #FFF;
    background: #555;
    transition: all 0.75s ease-out;
}

.captcha.formLabel {
    font-weight: normal;
    padding-left: 120px!important;
    font-family: 'roboto_light';
    width: unset;
}

.captcha.formLabel label {
    font-family: 'roboto_bold';
    line-height: 250%;
    font-size: 95%;
}

@media only screen and (max-width: 1000px) {
    /* ShopTemplate */
    .shopTemplate-list-item {
        width: 45%;
    }
    /* Main */
    .contentboxMain .contentbox-item {
        width: 50%;
    }
    /* Start */
    .contentboxStart .contentbox-item,
    .itemStartBox {
        width: 33.3333%;
    }
    .shopTemplate-table-link {
        background-color: #eee;
        border-radius: 10px;
        padding: 5px;
    }
    .shopTemplate-table-link:hover,
    .shopTemplate-table-column-active .shopTemplate-table-link {
        background-color: #cccccc;
    }
    /* Layer */
    #containerContentLayer {
        width: 90%;
        left: 50%;
        margin-left: -45%;
        margin-top: 50px;
    }
    .searchResult-results .shopTemplate-list .shopTemplate-list-item {
        width: 45%;
    }
}

@media only screen and (max-width: 935px) {
    #buttonNavigation {
        display: block;
    }
    .naviLinkTop1Root {
        display: none;
    }
    #layerMainNavigation {
        display: none;
    }
}

@media only screen and (max-width: 700px) {
    .containerShopHead .containerNaviLeft {
        display: none;
    }
}

@media only screen and (max-width: 700px) {
    #layerMainContent {
        width: 100%;
    }
    /* Head */
    #layerHeadText {
        display: none;
    }
    #layerHeadAction {
        float: none;
        position: relative;
    }
    #layerHeadSearch {
        float: right;
        max-width: 100%;
        box-sizing: border-box;
        margin: 7px 0 0 0;
    }
    .shopCart-button,
    .loginSmall-button {
        height: 47px;
    }
    .loginSmall-button-icon,
    .shopCart-button-icon {
        margin-bottom: 0;
        font-size: 120%;
    }
    .shopCart-button-text,
    .loginSmall-button-text {
        font-size: 90%;
    }
    .loginSmall-form {
        left: auto;
        margin-left: 0;
        right: 0;
    }
    .loginSmall.open .loginSmall-button::after,
    .shopCart.open .shopCart-button::after {
        display: none;
    }
    .shopCart-button-count {
        top: 5px;
        height: 18px;
        width: 18px;
        line-height: 18px;
        font-size: 80%;
    }
    /* Start */
    .itemStartBox {
        width: 100%;
    }
    /* Navigation */
    #layerNavigationMobile {
        display: block;
    }
    /* Main */
    #buttonMainNavigation {
        display: none;
    }
    #layerMainNavigation {
        width: 100%;
        position: relative;
        top: unset;
        left: unset;
        box-shadow: none;
        height: auto;
        padding: 0;
        background: none;
    }
    #mainNavigation {
        height: unset;
        width: unset;
        overflow: hidden;
    }
    .naviLinkLeft2Root {
        display: none;
    }
    #layerMainContent,
    #layerMainBottom {
        margin-left: 0;
    }
    .imageContentLeft,
    .imageContentRight {
        float: none;
        margin: 0 0 20px 0;
        width: 100%;
    }
    /* Contentbox */
    .contentboxMain .contentbox-item,
    .contentboxStart .contentbox-item {
        width: 100%;
    }
    /* Footer */
    #layerFooterAddress {
        float: none;
        width: 100%;
        margin-bottom: 20px;
    }
    #layerFooterNavigation {
        display: none;
    }
    #layerFooterContent {
        float: none;
        width: 100%;
    }
    #layerFooterImprint {
        text-align: center;
    }
    .shopTemplate-carousel-item {
        width: 150px;
    }
    /* Shopdetail */
    .shopDetail-image {
        float: none;
        width: 100%;
        margin-bottom: 20px;
    }
    .shopDetail-right {
        margin-left: 0;
        padding-left: 0;
        width: 100%;
    }
    .shopDetail-attributes-label {
        width: auto;
        float: none;
    }
    .shopDetail-attributes-value {
        margin-left: 0;
    }
    /* ShopOrder-Progress */
    .shopOrder-progress-item-icon {
        font-size: 100%;
    }
    .shopOrder-progress-item-label {
        display: none;
    }
    /* ShopOrder-Action */
    .shopOrder-action {
        overflow: hidden;
        margin: 20px;
    }
    .shopOrder-action-left {
        float: none;
    }
    .shopOrder-action-right {
        float: none;
    }
    a.shopOrder-action-button {
        margin-bottom: 5px;
    }
    .shopOrder-action-button {
        width: 100%;
    }
    /* ShopOrder-Cart */
    .shopOrder-cart-item-image {
        float: none;
        width: auto;
        margin-bottom: 20px;
    }
    .shopOrder-cart-item-right {
        margin: 0;
        padding: 0;
    }
    .shopOrder-cart-item-attributes-label {
        float: none;
        width: auto;
    }
    .shopOrder-cart-item-attributes-value {
        margin-left: 0;
    }
    .shopOrder-cart-summary-label {
        float: none;
    }
    .shopOrder-cart-summary-value {
        min-width: 0;
        padding-left: 5px;
    }
    /* ShopOrder-Form */
    .shopOrder-form-label {
        width: auto;
        float: none;
    }
    .shopOrder-form-value {
        margin-left: 0;
    }
    .shopOrder-form-item.half {
        width: auto;
        float: none;
    }
    /* ShopOrder-Address */
    .shopOrder-address {
        margin-bottom: 0;
    }
    .shopOrder-address-item {
        float: none;
        width: auto;
        margin-bottom: 10px;
    }
    /* ShopOrder-Attributes */
    .shopOrder-attributes-label {
        width: auto;
        float: none;
    }
    .shopOrder-attributes-value {
        margin-left: 0;
    }
    /* Formulare */
    .formLabel {
        display: block;
        width: auto;
    }
    .formValue,
    .formValueZIP,
    .formValuePlace,
    .detailValue,
    .formValueZIPSmall {
        display: block;
        width: auto;
    }
    .formValueZIP {
        width: 30%;
        padding-right: 0;
    }
    .formValueCheckbox {
        padding-left: 0;
    }
    .layerCaptchaLeft,
    .layerCaptchaRight {
        display: block;
    }
    .formLabelMandatory {
        padding-left: 0;
        padding-top: 10px;
    }
    .labelCaptcha {
        display: block;
        font-family: 'droidsans_bold';
        margin-bottom: 5px;
        font-size: 85%;
    }
}

@media only screen and (max-width: 500px) {
    .accordion-button {
        background-color: #efefef;
        color: rgba(0, 0, 0, 0.5);
        cursor: pointer;
        padding: 10px;
        width: 100%;
        border: none;
        text-align: left;
        outline: none;
        transition: 0.4s;
        position: relative;
        top: unset;
        left: unset;
        margin-bottom: 8px;
        font-size: 0.75rem;
        border: 2px solid white;
    }
    #accordion-button-2 {
        left: unset;
    }
    .shopDetail-accordion .accordion-content {
        margin-top: 0;
    }
    .shopTemplate-table table {
        font-size: 0.8rem;
    }
    .shopTemplate-table td {
        padding: 2px;
        border-bottom: 1px solid #bbbbbb;
        vertical-align: middle;
        text-align: center;
    }
    .shopTemplate-table-link {
        background-color: #eee;
        border-radius: 8px;
        padding: 0;
        height: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        line-height: 1.2;
    }
}

@media only screen and (max-width: 460px) {
    #layerHeadSearch {
        float: right;
        width: 100%;
        box-sizing: border-box;
        margin: 57px 0 0 0;
    }
    /* ShopTemplate */
    .shopTemplate-list-item {
        width: 100%;
        margin: 20px;
    }
    .shopTemplate-list-item-image img {
        width: 100%;
    }
}

@media only screen and (max-width: 420px) {
    .searchResult-results .shopTemplate-list .shopTemplate-list-item {
        width: 97.5%;
        margin: 10px 1.25%;
    }
    #layerSearch {
        width: 75%;
    }
    .shopTemplate-filterDeko {
        font-size: 0.7rem;
    }
}

@media only screen and (max-width: 360px) {
    #layerTop a {
        display: block;
        float: right;
        padding: 5px 10px;
        font-size: 80%;
    }
    #layerTop .phone,
    #layerTop .form {
        width: 48%;
    }
    #layerHeadSearch {
        margin: 35px 0 0 0;
    }
}