/*
 * CSS Änderungen von ARA-Marketing für entsprechendes Template
 
 Prell-Versand - Blau  #0e4194  - 
 */
 
/* opc-Menü Einstellungen, da immer im Weg :-) */   
@media (min-width: 992px) {#opc #opc-startmenu button { margin-top:25px; }}
@media (max-width: 991px) {#opc #opc-startmenu button { display:none;}}
 
 
/*Farbe der Schrift - > Main-Navigation Megamenü*/


.navbar-expand-lg .navbar-nav a{color: #fff; font-weight:bold;}
.navbar-expand-lg .navbar-nav a:hover {color: #f2f2f2;}

@media (max-width: 991.98px){.navbar-expand-lg .navbar-nav a{color: #000; font-weight:bold;}}
@media (max-width: 991.98px) {.navbar-expand-lg .navbar-nav a:hover {color: #000; }}

@media (min-width: 1070px){.navbar-expand-lg .navbar-nav a{font-size: 1rem;color: #fff; font-weight:bold;}}
@media (min-width: 1070px){.navbar-expand-lg .navbar-nav a:hover {font-size: 1rem; color: #f2f2f2;}}


/*Hintergrundfarbe des Headers */
header {background: url(images/bg.jpg) top -50px center no-repeat;}

/*Farbe Balken unter Kategorie-Navigation-Top*/
header .navbar-nav > .nav-item > .nav-link::before {
    border-width: 0 0 4px;
    border-color: #0e4194;
    transition: width 0.4s;
   }
   
/*Farbe Balken unter Kategorie-Navigation-Links*/ 
aside .nav-panel > .nav > .active > .nav-link {
    border-bottom: 0.375rem solid #0e4194;
    cursor: pointer;
}

/*Farbe Balken unter Seitenzahl-Anzeige-Breadcrump*/
.page-item.active .page-link::after, .page-item.active .page-text::after {
    border-bottom: 4px solid #013ADF;
}
/*Farbe Balken unter Seitenzahl-Anzeige-Tab-Artikeldetailansicht*/
.tab-navigation .nav-link::after {
    border-width: 0 0 6px;
    border-color: #0e4194;
}
/*Farbe Swatches Artikeldetailansicht*/
.swatches-text.active {
    border: 1px solid #0e4194;
	background-color: #f5f7fa;}	
/*Buttonfarbe*/
.btn-primary {background-color: #FAAC58; border-color: #f2f2f2;}
.btn-primary:hover {background-color: #f2f2f2; border-color: #013ADF;}
.btn-outline-primary { border-color: #0e4194;}									

/*Farbe Preisspanne-Slider */
 .noUi-horizontal .noUi-connect {background: #0e4194;}
 .noUi-horizontal .noUi-handle {background: #0e4194;box-shadow: 0px 0px 0px 5px rgba(248, 191, 0, 0.5);}
 .input-group-text {color:#f2f2f2;}
  
  
  
/*Farbe Header-Top- Bar Megamenü */
#header-top-bar a, header a {text-decoration: none;color: #fff; }
#header-top-bar a:hover:not(.dropdown-item):not(.btn), header a:hover:not(.dropdown-item):not(.btn) {color: #f2f2f2;}

.cart-icon-dropdown a:hover:not(.dropdown-item):not(.btn) {color: #0e4194;}

/*Farbe Dropdowns von Header-top-bar-Menü */
#header-top-bar a.dropdown-item {text-decoration: none;color: #000;}
#header-top-bar a.dropdown-item:hover{text-decoration: none;color: #0e4194;}

/*Farbe Dropdowns von Header-top-bar-Menü */
#shop-nav a.dropdown-item {text-decoration: none;color: #000;}
#shop-nav a.dropdown-item:hover{text-decoration: none;color: #0e4194;}

/*Farbe Logo-Zeichen Anmelden & Warenkorb & Wunschliste */
header .nav-right .nav-link {color: #000;}
header .nav-right .nav-link :hover{color: #0e4194;}

#header-top-bar header .nav-right .nav-link .dropdown-item {color: #fff000 !important; }

header .dropdown-menu a{color: #000; }
header a.dropdown-item {text-decoration: none;color: #000;}
#shop-nav .cart-dropdown a{color: #000;}

/* Logo Größe */
@media (min-width: 992px) {header .navbar-brand img {height: 4.8rem; margin-top:-25px;}}
@media (max-width: 991.98px) {header .navbar-brand img {height: 3.40rem; margin-top:10px; margin-left:25px;}}
@media (max-width: 450px) {header .navbar-brand img {height: 3.00rem; margin-top:5px; margin-left:1px;}}


/* Abhängig von Logogröße das Sticky-top -> height ändern */
@media (min-width: 992px) {header .sticky-top { top: 0px; padding-top: 0px; height: 227px}}
@media (max-width: 991.98px) {header .sticky-top { top: 0px; padding-top: 0px; height: 140px}}
.sticky-top {position:relative;}

@media (max-width: 991.98px) {.cart-summary {/*height: 450px !important;*/ top:0px !important;}}
@media (min-width: 992px) {.cart-summary {position:sticky !important;}}

/*Kunden kaufen dazu -> weg bei mobile Ansicht, wegen Bestellübersicht */
@media (max-width: 991.98px) {.basket_wrapper .slick-slider-other.is-not-opc {display:none!important; }}


/* Abhängig von Logogröße das mainNavigation das margin-top ändern */
@media (min-width: 991.98px) {#mainNavigation {margin-top:149px; }}
 

  
/*Suche nach unter LG-Modus */
@media (max-width: 991.98px)
{.navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, .navbar-expand-lg > .container-sm, .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl {
    padding-right: 0;
    padding-left: 0;
	margin-top: 25px;
}}
 
@media (min-width: 1300px) {.container { max-width: 90rem;}}
.container-fluid-xl {max-width: 90rem;}
 
 
/*Main-Wrapper runter  */
#main-wrapper {margin-top: 0px;}

@media (min-width: 992px) {header #mainNavigation {margin-right: 0rem;}}

/* Änderungen in top bar */
#header-top-bar {
	color:#fff;
	background-color: #585858;
	position:relative;
	height:0px;
	left:0;
	right:0;
	z-index:1049;
}

#header-top-bar .nav-link {
  padding: 0.3rem 1rem;
}
@media (min-width: 992px){
#shop-nav .account-icon-dropdown {border:1px solid #707070; border-radius: 0.125rem; height: calc(1.5em + 1.25rem + 2px);}
#shop-nav .nav-link-custom {margin-top:-13px;height: calc(1.5em + 1.25rem + 2px)} 
#shop-nav .nav-link-custom:hover {color: #0e4194;}
#shop-nav .nav-link-custom::after {content:"Mein Konto"; color:#000; margin-left: 5px; margin-top:2px; font-size: 0.9rem; }
#shop-nav .nav-link-custom:hover::after {color:#0e4194;}

#shop-nav-compare {border:1px solid #707070; border-radius: 0.125rem; height: calc(1.5em + 1.25rem + 2px); margin-left:5px;}
#shop-nav-compare .nav-link {margin-top:-13px;height: calc(1.5em + 1.25rem + 2px)}
#shop-nav-compare .nav-link:hover {color: #0e4194;}
/*#shop-nav-compare .nav-link::hover::after {content:"Vergleichsliste"; position:absolute; bottom: -1.2rem; color:#0e4194; left: 0;transition: opacity 1.2s; font-size:0.8rem; }*/

#shop-nav-wish {border:1px solid #707070; border-radius: 0.125rem; height: calc(1.5em + 1.25rem + 2px);margin-left:5px;}
#shop-nav-wish .nav-link {margin-top:-13px;height: calc(1.5em + 1.25rem + 2px)}
#shop-nav-wish .nav-link:hover {color: #0e4194;}
/*#shop-nav-wish .nav-link:hover::after {content:"Wunschliste"; position:absolute; bottom: -1.2rem; color:#0e4194; left: 0;transition: opacity 1.2s; font-size:0.8rem; }*/

#shop-nav .cart-icon-dropdown {border:1px solid #707070; border-radius: 0.125rem; height: calc(1.5em + 1.25rem + 2px);margin-left:5px;}
#shop-nav .cart-icon-dropdown .nav-link {margin-top:-13px;height: calc(1.5em + 1.25rem + 2px)}
#shop-nav .cart-icon-dropdown .nav-link:hover {color: #0e4194;}
/*#shop-nav .cart-icon-dropdown:hover::after {content:"Zum Warenkorb"; position:absolute; bottom: -1.2rem; color:#0e4194; right: 0;transition: opacity 1.2s; font-size:0.8rem; }*/

}


@media (min-width: 992px) {#shop-nav {position:absolute; right:20px; top:30px;}}
@media (min-width: 1500px) {#shop-nav {position:absolute; right:200px; top:40px;}}
@media (min-width: 1800px) {#shop-nav {position:absolute; right:249px; top:40px;}}
@media (min-width: 1900px) {#shop-nav {position:absolute; right:249px; top:40px;}}

@media (min-width: 992px) {.toggler-logo-wrapper .logo-wrapper {position: absolute; margin-top:51px;}}
@media (min-width: 992px){.align-items-lg-end {align-items: flex-start!important;}}
@media (min-width: 1300px) {.container { max-width: 90rem;}}
 
/* Megamenü auf Breite  und Höhe */
#mainNavigation li.nav-item.nav-scrollbar-item {flex: auto; height: 57px; border-right:2px solid #fff;}
#mainNavigation li.nav-item.nav-scrollbar-item:last-child{border-right:0px solid #fff;}

/*Text im Megamenü mittig/links */
.nav-mobile-body .text-truncate {text-align:left;}

#mainNavigation .col.col-auto.nav-mobile-header-name.ml-auto-util a{color:#000;}
 
/*Icon Unterkategorie 
#mainNavigation > div.nav-mobile-body > ul > li.nav-item.nav-scrollbar-item.dropdown.dropdown-full.arakat-41 {text-align:center;}
*/

 /*Farben Main-Navigation */
#mainNavigation .arakat-8900 {background-color: #cd853f;}
#mainNavigation .arakat-8901 {background-color: #9e1e9a;}
#mainNavigation .arakat-8902 {background-color: #7daf01;}
#mainNavigation .arakat-8903 {background-color: #ff9c00;}
#mainNavigation .arakat-8904 {background-color: #0078ff;}
#mainNavigation .arakat-8905 {background-color: #027676;}
#mainNavigation .arakat-8906 {background-color: #254aa4;}
#mainNavigation .arakat-8907 {background-color: #958d7d;}
#mainNavigation .arakat-8908 {background-color: #e10112;}

/*Farbe Balken unter Kategorie-Navigation-Top*/
#mainNavigation .arakat-8900 .nav-link::before {border-color: #cd853f;}
#mainNavigation .arakat-8901 .nav-link::before {border-color: #9e1e9a;}
#mainNavigation .arakat-8902 .nav-link::before {border-color: #7daf01;}
#mainNavigation .arakat-8903 .nav-link::before {border-color: #ff9c00;}
#mainNavigation .arakat-8904 .nav-link::before {border-color: #0078ff;}
#mainNavigation .arakat-8905 .nav-link::before {border-color: #027676;}
#mainNavigation .arakat-8906 .nav-link::before {border-color: #254aa4;}
#mainNavigation .arakat-8907 .nav-link::before {border-color: #958d7d;}
#mainNavigation .arakat-8908 .nav-link::before {border-color: #e10112;}


/* Hintergrund der Bestseller usw. 
.abox-TopAngebot {background: transparent url(images/headline-blue-bg.png) no-repeat center top;}
.abox-TopAngebot  a{color:#0e4194;}

.abox-Bestseller {background: transparent url(images/headline-red-bg.png) no-repeat center top;}
.abox-Bestseller a{color:#298A08;}

.abox-Sonderangebote {background: transparent url(images/headline-red-bg.png) no-repeat center top;}
.abox-Sonderangebote a{color:#DF0101;}
 */
/*Linie in den Navs */
.navbar-expand-lg .navbar-nav a { background: url(images/dotted-menu.png) repeat-x left 42px;}

@media (min-width: 992px){header .navbar-nav > .nav-item > .nav-link {  position: relative; padding: 0.7rem;}}   

@media (min-width: 992px){.nav-mobile-heading {text-align:center; width: 100%;}}


/*Pfeil im Megamenü */
@media (min-width: 992px){.nav-mobile-body .dropdown-toggle::after {
    position: absolute;
    bottom: -12px;
    left: 0;
    width: 100%;
    text-align: center;
	margin-left: 0.0rem;
}}


/* Sicher-bezahlen-Text und logo oben bei Bestellvorgang rausgenommen*/
#jtl-nav-wrapper > div > nav > div.secure-checkout-icon.ml-auto-util.ml-lg-0 {display:none;}

/*  Schrift im Dropdown-Menü  */ 

.dropdown-menu a{color: #0e4194 !important; }
.dropdown-menu a:hover{color: #0e4194 !important;}

/*Artikeldetailseite - Menge und Warenkorbbutton*/
@media (min-width: 992px) and (max-width:1250px) {#add-to-cart .col-sm-6 {flex: 0 0 100%; max-width:90%; margin-top:5px;}}


#pushed-success img{max-width: 130px; height:auto;}

/*Warenkorb-Form*/
 .input-group-prepend {background-color: #81BEF7;}
 .input-group-append {background-color: #81BEF7;}
#quantity-grp .input-group-text.unit.form-control {background-color: #FBF8EF !important;}



/*Einstellungen Warenkorb  -> Text über Breite*/
@media (min-width: 1200px) {.cart-items-body .list-unstyled {width: 430px; padding-top:15px;}}
@media (min-width: 600px) {.cart-items-body .partlist-items {width: 420px; }}
.cart-items-body .fa-heart:before {content: "\f004"; color: green;}
.fa-trash-alt:before {content: "\f2ed"; color: red;}


/* Checkout  Kopfhöhe */

@media (max-width: 991.98px) {.is-checkout header, .is-checkout .navbar {height: 4.8rem;}}
@media (min-width: 992px) {.is-checkout header, .is-checkout .navbar {height: 9.325rem;}}

/*checkout Socialbar weg */
.is-checkout #socialBar {display:none;}



/* Bestellablauf - Farben */
.badge-primary { color: #525252; background-color: #31B404; }
.stepper .step-active .step-content::after {background:#31B404; }
.checkout-steps .step-check {color: #31B404;}
.custom-control-input:checked ~ .custom-control-label::before { color: #ffffff;  border-color: #31B404; background-color: #31B404;}


/*Newsletter Einstellungen */
#footer .newsletter-footer-heading {color:#0e4194;}
#footer .btn:hover {color: #000;}
#footer .input-group > .input-group-append > .btn, .input-group > .input-group-append > .input-group-text, .input-group > .input-group-prepend:not(:first-child) > .btn,
.input-group > .input-group-prepend:not(:first-child) > .input-group-text, .input-group > .input-group-prepend:first-child > .btn:not(:first-child),
.input-group > .input-group-prepend:first-child > .input-group-text:not(:first-child)  {background-color: #0e4194;}

@media (min-width: 992px) {.newsletter-footer {border: 1px solid #f2f2f2;}}
@media (min-width: 992px) {#footer .newsletter-footer {padding: 15px;}}





#footer {background-color: #ccc;}

#footer #copyright { background-color: #0e4194;}

#footer a{color: #000;}
#footer a:hover {color: #0e4194;}

#footer .productlist-filter-headline {
	border-bottom: 1px solid #f2f2f2;
	padding-bottom: 8px;
}

/* ANZEIGE FEHLER IM MOBILER ANSICHT*/
/* 
#footer .productlist-filter-headline {
	color:#0e4194; 
	border-bottom: 1px solid #f2f2f2;
	padding-bottom: 8px;
}
*/

/* Einstellungen-Social-Bar */
#socialBar {
-webkit-box-shadow: -3px 0px 7px 0px rgba(0,0,0,0.3);
-moz-box-shadow: -3px 0px 7px 0px rgba(0,0,0,0.3);
box-shadow: -3px 0px 7px 0px rgba(0,0,0,0.3);
position: fixed;
right: 0;
top: 280px;
z-index: 1049;
}

#socialBar ul {
margin: 0;
padding: 0;
list-style-type: none;
}

/* Einstellungen-Service-Station */

#serviceSection {
color: #0e4194;
text-align: center;
background-color: #fff;
position: relative;
width: 100%;
z-index: 1020;
background: url(images/bg.jpg) top 0px center no-repeat;
}

#serviceSection ul {
list-style-type: none;
margin: 0;
padding: 0;
}

#serviceSection ul li {
float: left;
margin-right: 52px;
}

@media (max-width: 1051px) {#serviceSection ul li {margin-right: 42px;}}

#serviceSection ul li.last {
margin-right: 0px;
margin-top: -21px;
float: right;
}

#serviceSection ul li i {
vertical-align: bottom;
}

#serviceSection ul li a {
color: #0e4194;
text-decoration: none;
}

#serviceSection-content {
max-width: 1140px;
text-align: center;
margin: auto;
padding: 14px 0 16px;
display: flex;
  align-items: center;
  justify-content: center;

}

#serviceSection ul li .fa-2x {
margin-right: 4px;
font-size: 1.5em;
}

.clearer {
clear: both;
display: block;
}


@media (max-width: 1150px) {.sB07 {display: none;} #serviceSection {padding-left: 20px;	}}


@media (max-width: 992px) {.sB06 {	display: none;}}

@media (max-width: 855px)  {.sB05 {display: none;}}

@media (max-width: 710px)  {.sB02 {display: none;}}

@media (max-width: 575px)  {.sB01 {display: none;}}

@media (max-width: 751px)  {#socialBar {display: none;}}

@media (max-width: 450px)  {#serviceSection {background: #FFF;border-bottom: 1px solid #EEE;}
							#serviceSection-content {padding: 10px 0 5px; margin-right:20px;}	
							.sB03, .sB04 {float: none; text-align: center;	width: 100%;}}


/*Formatierung Buybox zur Bestellübersicht */
#ara-direct-buybox {margin-top: 20px; }

/*MY TEST*/























