/*
 * Platz für eigene Änderungen direkt als CSS
 * Die hier gemachten Änderungen überschreiben ggfs. andere Styles, da diese Datei als letzte geladen wird.
 */

/* Button */

.btn-primary {
	color: #fff;
}

.btn-primary:hover {
	color: #fff;
}

.badge-primary {
	color: #fff;
}

.rating .fas {
	color: #A6C54D;
}

/* Top-Bar */

#header-top-bar {
	border-width: 1px 0;
	border-style: solid;
	border-color: #98AB3F;
}

#header-top-bar > div {
	justify-content: space-between;
}

.nav-span {
	display: block;
	padding: .5rem 1rem;
}

.nav-span i {
	color: #a6c54d;
}

.nav-dividers .nav-item:not(:last-child)::after {
	display: none;
}

/* Header */

.menu-wrapper {
	background-color: #A6C54D;
}

@media (min-width: 992px) {
	header .navbar-collapse {
		height: auto;
	}
	
	.nav-scrollbar-inner {  
		padding-bottom: 0;
	}
	
	header .navbar-nav > .nav-item > .nav-link {
		position: relative;
		padding: 1rem 1.5rem;
		color: #fff;
	}
	
	header .navbar-nav > .nav-item > .nav-link:hover {
		color: #f5f5f5;
		background-color: #57524F;
	}
	
	header .navbar-nav > .nav-item > .nav-link::before {
		display: none;
	}
}

.cart-icon-dropdown .fa-sup {
	color: #fff;
}

/* Info-Elemente */

.info-icons-wrapper-element {
	display: inline-block;
	padding-left: 60px;
	position: relative;
}

.info-icons-wrapper-element.element-2 {
	padding-left: 50px;
}

.info-icons-wrapper-element:before {	
	display: block;
	width: 50px;
	height: 50px;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.info-icons-wrapper-element.element-1:before {
	content: '';
	background: url("img/fleischrei_proverenoenexpertom.png") no-repeat;
	background-size: contain;
	background-position: center;
}

.info-icons-wrapper-element.element-2:before {
	content: '';
	background: url("img/euro-icon.png") no-repeat;
	background-size: contain;
	background-position: center;
}

/* Suche */

@media (min-width: 992px) {
	.full-width-mega .main-search-wrapper {		
		max-width: 350px;
	}
}
	
#search {
	margin-right: 0;
}

.search-wrapper .form-control {
	background-color: #F1F1F1;
	border-radius: 1rem 0 0 1rem;
	border: none;
}

.search-wrapper .form-control:focus {
	box-shadow: none;
}

.search-wrapper .btn.btn-secondary {
	background-color: #F1F1F1;
	border-color: #F1F1F1;
	color: #525252;
	border-radius: 0 1rem 1rem 0 !important;
	box-shadow: none;
}

.search-wrapper .btn.btn-secondary:active, .search-wrapper .btn.btn-secondary:focus, .search-wrapper .btn.btn-secondary:active:focus {
	background-color: #F1F1F1;
	border-color: #F1F1F1;
	color: #525252;	
	box-shadow: none;
}

/* Slider */

.slider-pause-overlay {
	display: none;
}

/* vor dem Footer */

.before-footer {
	background-color: #57524F;
	color: #fff;
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.before-footer-wrapper {
	align-items: center;
}

@media (min-width: 992px) {
	.before-footer-wrapper > div {
		text-align: center;
	}
}

.contact-element {
	position: relative;
	display: inline-block;
	padding-left: 3rem;
	text-align: left;	
}

@media (max-width: 991px) {
	.contact-element {
		margin-bottom: 1rem;
	}
}

.contact-element a {
	color: #fff;
	text-decoration: none;
}

.contact-element a:hover {
	color: #f5f5f5;
}

.contact-element:before {
	display: block;	
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	font-size: 2rem;
}

.contact-element.element-1:before {
	content: "\f095";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

.contact-element.element-2:before {
	content: "\f0e0";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

.contact-element.element-3:before {
	content: "\f1ac";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

/* Footer */

#footer {  
	padding: 2rem 0 0;
	background-color: #fff;
}

#footer .productlist-filter-headline {  
	font-size: 1.1rem;
	color: #98AB3F;  
}

/* OPC-Klassen */

.no-opc .category-slide-inner {
	max-width: calc(100% - 32px);
	margin: 0 auto;    
	margin-top: -32px;
	background-color: #fff;
}

.no-opc .category-slide-inner > div {
	padding: .5rem;
}

.no-opc .image-gallery-text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate3d(-50%,-50%,0);
	width: 100%;
	padding: 1rem;
	text-align: center;
	color: #fff;
	text-shadow: 1px 1px #000;
	font-size: 1.5rem;
	font-weight: 700;
	text-transform: uppercase;
	pointer-events: none;
}

.no-opc .custom-gallery-4 > div {
	flex: 0 0 100%;
	max-width: 100%;
}

@media (min-width: 768px) {
	.no-opc .custom-gallery-4 > div {
		flex: 0 0 50%;
		max-width: 50%;
	}
}

@media (min-width: 992px) {
	.no-opc .custom-gallery-4 > div {
		flex: 0 0 33.33333333%;
		max-width: 33.33333333%;
	}
}

@media (min-width: 1300px) {
	.no-opc .custom-gallery-5 > div {
		flex: 0 0 20%;
		max-width: 20%;
	}
	
	.no-opc .opc-Gallery.opc-Gallery-grid.custom-gallery-height .opc-Gallery-item .opc-Gallery-btn {		
		padding-top: 200%;
	}
}