@import url("/assets/custom/css/redim.css");

.container{
	max-width: 100%;
}

html{
	height: 100%;
}

body{
	background: none;
	background-color: #fff;
}

app-root{
	height: 100%;
	display: flex;
	flex-direction: column;
}

#appContent{
	flex: 1 1 auto;
}

#appContent customer-header {
	display: none;
}

#appContent.sub-page customer-header {
	display: block;
}

#loginMatDialog .company-brand,
#loginMatDialog .company-brand-middle,
#loginMatDialog .company-brand,
#changePasswordMatDialog .company-brand,
#changePasswordMatDialog .company-brand #changePasswordMatDialog .company-brand{}

#loginMatDialog #errorDialog{}

#loginMatDialog .btn{}

#loginMatDialog .companiesSelect{}

#loginMatDialog .companiesSelect select{}

#loginMatDialog i{}

#loginMatDialog .form-control{}

#loginMatDialog .label{}

#loginMatDialog .agb-checkbox{}

#loginMatDialog .agb-text{
	/*   font-size: 1.2em;*/
}

.company-brand,
.company-brand-middle,
.company-brand-large{
	background: url("../../Images/Logo.png");
	-ms-background-size: 100% 100%;
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.company-brand{
	height: 56px;
	width: 120px;
}

.company-brand-middle{
	height: 180px;
	width: 260px;
}

.company-brand-large{
	height: 390px;
	width: 512px;
}

#home{
	margin-top: 30px;
}

#home .paddingleftright{
	padding-left: 15px;
	padding-right: 15px;
}

#home h2{
	color: #0076bd;
	font-size: 28px;
	font-weight: 100;
	margin-bottom: 10px;
}

#home li,
#home p{
	font-weight: 300;
	font-size: 16px;
}

#home .highlight{
	color: #0076bd;
	font-weight: 400;
}

#home .text-container{
	/* margin-left: 3em;
	margin-right: 3em; */
	text-align: left;
}

#home .btn-primary{
	margin-bottom: 2.9em;
}

#advantages ul > li{
	padding-bottom: 1em;
}

.defaultblock{
	display: flex;
	flex-wrap: wrap;
}

.block2{
	background-color: #f7f7f7;
	padding-top: 20px;
	padding-bottom: 20px;
}

#banner.container{
	padding-right: 15px;
	padding-left: 15px;
}

.filled-blue{
	background: url("../Images/filled_blue.PNG");
	background-size: 100% 100%;
}

.middle_banner{
	background: url("../Images/banner_2.jpg");
	background-size: 100% 100%;
}

.filled-light-blue{
	background: url("../Images/filled_light_blue.PNG");
	background-size: 100% 100%;
}

.bannerContainer .imageBanner{
	background: url("../../Images/Keyvisual_Software_UEbersicht.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.bannerContainer{
	margin-bottom: 100px;
}

.bannerContainer .imageBanner .greyoverlay{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: auto;
	background-color: rgba(0, 0, 0, 0.3);
}

.bannerContainer .overlay{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: auto;
	background-size: center;
	background-position: 50% 100%;
}

/*-- START Webshop header --  Navigation --*/

.searchbox{
	top: 0 !important;
}

/*-- START Landscape Darstellung --*/

#header-navigation .navbar-nav{}

/* Webshop header -- Navigationsliste*/

#header-navigation .navbar-nav li{}

/* Webshop header -- Navigationsliste*/

#header-navigation .navbar-nav li:hover{}

#header-navigation .navbar-nav li a:active{}

#header-navigation .navbar-nav li a,
#header-navigation .navbar-nav li i,
.sidebar-item a{}

#header-navigation .navbar-nav li a:hover{}

#header-navigation .navbar-nav li a:before{}

#header-navigation .navbar-nav li a:hover:before{}

/* -- END Landscape Darstellung --*/

/* -- START Portrait Darstellung*/

.main{}

.sidebar{}

.bar{}

.button{}

.nav-right{}

.nav-right.visible-xs{}

.hidden-xs{}

.middle{}

.nav-right.visible-xs .active .bar{}

.button.active .top{}

.button.active .bottom{}

.button.active .middle{}

.move-to-right{}

.move-to-left{}

nav{}

.navbar-nav li a:active{}

#slidebar-btn{}

.sidebar-list{}

.sidebar-item{}

.sidebar-item:hover{}

.sidebar-item:first-child{}

.sidebar-item:nth-child(2){}

.sidebar-item:nth-child(3){}

.sidebar-item:nth-child(4){}

.sidebar-item:nth-child(5){}

.sidebar-item:last-child{}

.sidebar-item.active{}

.sidebar-anchor{}

.sidebar-anchor:before{}

.sidebar-anchor:hover:before{}

.portrait{}

/* -- END Portrait Darstellung*/

/*-- END Webshop header --  Navigation --*/

/*-- START Webshop buttons --*/

.btn-success{}

.btn{}

.btn-primary{}

.close-btn{}

.close-btn:hover{}

.close-btn:after{}

/*-- END Webshop buttons --*/

/*-- START Seitenübergreifend --*/

#errorDialog{}

.label{}

/* page title*/

.title{}

/*-- Aktuelle Adresse --*/

.block{}

.mat-dialog-container{
	max-width: none !important;
}

/*-- END Seitenübergreifend --*/

/*-- START customer page --*/

ul.custom{
	list-style: none;
	padding-left: 0;
	width: 100%;
	display: inline-flex !important;
	flex-wrap: wrap;
}

ul.custom li{
	background-color: /*#d1d2d3;*/ #efeff0;
	width: 50%;
	height: 100px;
}

ul.custom li:hover{
	background-color: #f6f7f9;
}

ul.custom li > div,
ul.custom li > p{
	width: 100%;
	text-align: center;
}

ul.custom li > p:hover{
	font-size: 20px;
}

#customTemplate .btn{
	background-color: #26415d;
	color: #ffffff;
	display: inline-block;
	height: 65px;
	width: 65px;
	-webkit-box-shadow: inset 5px 15px 12px #0075bf, inset 0px 15px 2px rgba(50, 144, 203, .5), inset 25px 12px 25px #0075bf;
	-moz-box-shadow: inset 5px 15px 12px #0075bf, inset 0px 15px 2px rgba(50, 144, 203, .5), inset 25px 12px 25px #0075bf;
	box-shadow: inset 5px 15px 12px #0075bf, inset 0px 15px 2px rgba(50, 144, 203, .5), inset 25px 12px 25px #0075bf;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	color: #fff;
	-webkit-text-shadow: 1px 1px 1px rgb(0, 0, 0);
	-moz-text-shadow: 1px 1px 1px rgb(0, 0, 0);
	text-shadow: 1px 1px 1px rgb(0, 0, 0);
}

#customTemplate .btn:hover{
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	background-color: rgba(76, 131, 187, 1.3);
	color: #ffffff;
}

#customTemplate p{
	font-size: 20px;
	display: inline-block;
	margin-top: 20px;
}

#customTemplate .btn i{
	font-size: 24px;
	padding-top: 10px;
}

/*-- END customer page --*/

/**** START Item Tile/Row *******/

.description1{}

.description2{}

.description13{}

.description4{}

.price{}

.tax{}

.total{}

.listPrice{}

.orderUnit{}

.priceUnit{}

.orderCount{}

.orderDate{}

.orderQuantity{}

.inventory{}

.itemOption{}

.priceUntil{}

.convFactor{}

.itemPriceSum{}

.itemPlanningShelfLife{}

.itemRealShelfLife{}

.itemText{}

.itemDetails{}

.item-detail-view .nav-pills .nav-link.active,
.nav-pills .show > .nav-link{
	background-color: var(--primary-color) !important;
	color: #fff !important;
}

.tab-content > .tab-pane.active{
	padding: 15px 0;
}

.item-detail-view .nav-pills a{
	color: var(--primary-color) !important;
}

/**** END Item Tile *******/

/**** START Catalogue Menu *******/

#catalogueCollection{}

#catalogueCollection .dropdown{}

#catalogueCollection .dropdown-menu{}

#catalogueCollection .headerButton{}

#catalogueCollection .menuListItem{}

#catalogueCollection .catalogueGroup{}

#catalogueCollection .catalogue{}

#catalogueCollection .catalogueDescription2{}

#catalogueCollection .catalogueCount{}

/**** END Catalogue Menu *******/

/*-- START catalogue page --*/

.dropdown{}

.dropdown-menu{}

.dropdown-menu li{}

.item-table-header{}

/*-- END catalogue page --*/

/*-- START catalogue/lastorder/basket page --*/

.table-responsive{}

#pagination-container{}

#pagination-container ul{}

.page-link{}

/*-- START catalogue/lastorder/basket page --*/

/*-- START Bestelldatum --*/

.date-group{}

/*-- END Bestelldatum --*/

/*-- START Webshop Footer--*/

#footer .link-container{
	background-color: #262626;
	/*min-height: 100%;*/
	/* height: 100%; */
	padding-top: 15px;
}

#footer.container{
	padding-right: 15px;
	padding-left: 15px;
}

#footer h4{
	font-size: 1.2em;
	color: #0076bd;
}

#footer h6{
	font-size: 0.8em;
}

#footer h6,
#footer h6 a,
#footer h6 a:focus,
#footer h6 a:hover{
	color: #9d9c9c;
	text-decoration: none;
}

/*-- START Retour Page --*/

#delivery-returns .item-table-header{
	background-color: #0076bd;
	color: #fff;
	border-top-left-radius: 0.25rem;
	border-top-right-radius: 0.25rem;
}

/*-- END Retour Page --*/

/*-- END Webshop Footer --*/

@media (max-width: 768px){
	#header-navigation .landscape .navbar-nav{
		width: 100%;
	}
	
	#header-navigation .landscape .navbar-nav li{
		border-top-left-radius: 0.25rem;
		border-top-right-radius: 0.25rem;
	}
	
	#banner div{
		height: 20.95em;
	}
	
	.navbar,
	.navbar-nav,
	.container-fluid{
		padding-left: 0em !important;
		padding-right: 0em !important;
	}
	
	#header-navigation .navbar-nav li{
		display: block !important;
		text-align: center;
		border-radius: 0.25rem;;
	}
	
	#header-navigation .top-navigation .dropdown-menu{
		left: auto !important;
		right: 0 !important;
		transform: translateY(0px) !important;
		top: auto !important;
	}
	
	.bannerContainer .overlay{
		background-position: 57% 100% !important;
	}
	
	.bannerContainer .imageBanner p{
		font-size: 40px;
		margin-top: 80px;
	}
}

@media (max-width: 574px){
	.landscape{
		display: none;
	}
	
	.portrait{
		display: block;
	}
}

@media (max-width: 467px){
	.main{
		width: 100%;
		left: -100%;
	}
	
	.sidebar{
		width: 100%;
		left: -100%;
		z-index: 200;
	}
	
	.bar{
		height: 3px;
		width: 35px;
		margin: 8px auto;
	}
	
	.button.active .top{
		-webkit-transform: translateY(7px) rotateZ(45deg);
		-moz-transform: translateY(7px) rotateZ(45deg);
		-ms-transform: translateY(7px) rotateZ(45deg);
		-o-transform: translateY(7px) rotateZ(45deg);
		transform: translateY(7px) rotateZ(45deg);
	}
	
	.button.active .bottom{
		-webkit-transform: translateY(-15px) rotateZ(-45deg);
		-moz-transform: translateY(-15px) rotateZ(-45deg);
		-ms-transform: translateY(-15px) rotateZ(-45deg);
		-o-transform: translateY(-15px) rotateZ(-45deg);
		transform: translateY(-15px) rotateZ(-45deg);
	}
}

@media (min-width: 768px){
	.nav-right{
		position: absolute;
	}
	
	.hidden-xs{
		display: block;
	}
	
	.visible-xs{
		display: none;
	}
}

@media (min-width: 480px){
	.nav-list{
		display: block;
	}
	
	ul.custom{
		display: block;
	}
	
	p{
		font-size: 14px;
	}
}

.nonDisplay{
	display: none;
}

.text-center{
	text-align: center !important;
}

.print{
	display: none;
}

@media print{
	header{
		background: #bbb;
		width: 100%;
		/*/position: fixed;*/
		left: 0;
		top: 20px;
		border-bottom: 1px solid #666;
		border-top: 1px solid #666;
		margin-bottom: 15px;
		padding-bottom: 15px;
		padding-top: 15px;
	}
	
	footer{
		background: #bbb;
		width: 100%;
		position: fixed;
		left: 0;
		bottom: 0;
		/*border-bottom:1px solid #666;*/
		border-top: 1px solid #666;
	}
	
	header div{
		width: 100%;
	}
	
	header div span{
		width: 30%;
	}
	
	.content{
		margin-bottom: 25px;
	}
	
	.no-print{
		display: none;
		height: 0
	}
	
	.print{
		display: inline-block !important;
	}
	
	.itemtable .itemtable-header td,
	.itemtable .itemtable-body td{
		border-right: 1px solid #4d4d4d;
		border-bottom: 1px solid #4d4d4d;
	}
	
	.itemtable .itemtable-header td{
		border-top: 1px solid #4d4d4d !important;
		border-left: 1px solid #4d4d4d !important;
	}
	
	.itemtable .itemtable-header{
		font-size: 12px !important;
		font-weight: bold;
		background-color: gainsboro;
		border-left: 1px solid #4d4d4d;
	}
	
	.itemtable .itemtable-body td{
		font-size: 12px !important;
		border-top: 1px solid #4d4d4d !important;
		border-left: 1px solid #4d4d4d !important;
	}
	
	.itemtable .itemtable-body td{
		height: auto;
		max-width: 140px !important;
	}
	
	.itemtable .itemtable-col-unit button{
		display: block !important;
		background: none !important;
		border: none !important;
		font-size: 11px;
		color: inherit !important;
	}
	
	.itemtable input{
		border: none !important;
	}
	
	.itemtable #pagination-container{
		display: none !important;
	}
	
	button{
		display: none;
	}
}

/*Toggle switch for subquantities of retour*/
input:checked + .slider{
	background-color: #0076bd;
}

/* .cat29 #header-navigation .navbar-nav li{
  background-color: chocolate!important;
}

.cat29 .bannerContainer .imageBanner {
  background: url('https://www.prinz.cc/media/wysiwyg/slider-alte-sorten-original-prinz.jpg') no-repeat;
  background-size: cover;
  background-position: center;
}

.cat29 #banner div {
  height: 300px;
}

.cat29 .bannerContainer .imageBanner p {
  margin-top: 100px;
} */

/*AB HIER FÜR DELICIA*/

/* .item-row {
  grid-template-columns: auto auto 1fr auto !important;
  grid-template-areas:
    "desc1 desc1 desc1 ."
    "img . . ."
    "img . . ."
    "img . . ."
    "img price conv ."
    "img quantity units ."
    "img . . ."
    "img . . ."
    "img . . buttons" !important
}

.item-row--itemkey {
  display: none;
}

.item-row--image {
  grid-area: img;
}

.item-row--image .item-image {
  height: 100px !important;
}

.item-row--description1 {
  grid-area: desc1;
}

.item-row--description2 {
  display: none;
}

.item-row--description3 {
  display: none;
}

.item-row--description4 {
  display: none;
}

.item-row--description5 {
  display: none;
}

.item-row--featuredesc1 {
  display: none;
}

.item-row--featuredesc2 {
  display: none;
}

.item-row--sortgroup {
  display: none;
}

.item-row--alcohol {
  display: none;
}

.item-row--frozenflag {
  display: none;
}

.item-row--preorderflag {
  display: none;
}

.item-row--itemtextinfo {
  display: none;
}

.item-row--shorttext {
  display: none;
}

.item-row--price {
  grid-area: price;
}

.item-row--priceandtax {
  display: none;
}

.item-row--convfactor {
  grid-area: conv !important;
}

.item-row--inventory {
  display: none;
}

.item-row--promotiondate {
  display: none;
}

.item-row--measure {
  display: none;
}

.item-row--measuresum {
  display: none;
}

.item-row--density {
  display: none;
}

.item-row--conditiontabl {
  display: none;
}

.item-row--quantity {
  grid-area: quantity;
}

.item-row--units {
  grid-area: units;
}

.item-row--buttons {
  grid-area: buttons;
} */


/**
 * reDim Anpassungen
 */
/* amatic-sc-regular - latin */
@font-face{
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Amatic SC';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/amatic/amatic-sc-v27-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* amatic-sc-700 - latin */
@font-face{
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Amatic SC';
	font-style: normal;
	font-weight: 700;
	src: url('../fonts/amatic/amatic-sc-v27-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-300 - latin */
@font-face{
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 300;
	src: url('../fonts/poppins/poppins-v23-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-regular - latin */
@font-face{
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/poppins/poppins-v23-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-600 - latin */
@font-face{
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	src: url('../fonts/poppins/poppins-v23-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

:root{
	--primary-color: #193e68;
	--primary-lighter-color: #214a79;
	--accent-color: #fb9573;
	--maxwidth: 1400px;
}

body{
	font-family: 'Poppins', sans-serif;
}

h1, h2, h3, h4, h5, h6, .title{
	font-family: 'Amatic SC', sans-serif;
	position: relative;
	margin-bottom: 25px;
}

h1::after, h2::after, h3::after, h4::after, h5::after, h6::after, .title::after{
	content: '';
	position: absolute;
	top: 100%;
	left: 0;
	height: 10px;
	width: 75px;
	background: url("../../Images/web/heading_underline.png") no-repeat;
	display: block;
}

.max-width{
	max-width: var(--maxwidth);
	margin: 0 auto;
}

.btn-success{
	background: var(--primary-color);
	border-color: var(--primary-color);
}

.btn-success.disabled, .btn-success:disabled{
	background: var(--primary-color) !important;
	border-color: var(--primary-color) !important;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active{
	background: var(--primary-lighter-color) !important;
	outline-color: var(--primary-lighter-color) !important;
	border-color: var(--primary-lighter-color) !important;
}

/***************************************************************************** Header **/
#header-navigation[_ngcontent-c5]{
	margin-top: 0 !important;
}

#header-navigation{
	position: fixed;
	background: transparent;
	z-index: 100;
	padding: 15px;
	transition: background .27s ease;
}

#header-navigation.sub-page{
	-position: sticky;
	background: transparent;
}

#header-navigation.scrolled {
/*#header-navigation.sub-page{*/
	background: var(--primary-color);
}

#header-navigation .top-navigation{
	max-width: var(--maxwidth);
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#header-navigation .top-navigation > :first-child{
	order: 1;
}

#header-navigation .top-navigation > :nth-child(2){
	order: 3;
	
}

#header-navigation .top-navigation > :last-child{
	order: 2;
}

#header-navigation .top-navigation > *{
	flex: 0 0 auto;
	width: auto;
}

/***************************************************************************** Navbar **/
#header-navigation .navbar-nav > li:first-child{
	display: none !important;
}

#header-navigation .navbar-nav > li{
	background: transparent !important;
}

#header-navigation .navbar-nav > li > i{
	display: none !important;
}

#header-navigation .navbar-nav > li a{
	position: relative;
	padding: 10px 0;
}

#header-navigation .navbar-nav > li a::before{
	background: var(--accent-color) !important;
}

#header-navigation .navbar-nav > li.active a::before{
	width: 100% !important;
}

#header-navigation nav{
	padding: 0 !important;
}

#header-navigation a[name="/basket"] span{
	background: var(--accent-color);
	color: var(--primary-color);
	font-size: 12px;
	line-height: 12px;
	width: 25px;
	height: 25px;
	border-radius: 100%;
	position: absolute;
	top: 0;
	left: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}


/***************************************************************************** Toasts **/
#infoDialog[_ngcontent-c3]{
	z-index: 990;
}

.toast-body{
	background: var(--primary-color) !important;
}

.toast-body h3{
	font-weight: 700 !important;
	margin-bottom: 5px;
	font-size: 18px !important;
	line-height: 18px !important;
	
}

.toast-body div{
	font-size: 14px !important;
	line-height: 14px !important;
	font-weight: 300 !important;
	color: #fff !important
}

.toast-body h3::after{
	display: none;
}

/***************************************************************************** Banner **/
#banner div{
	height: auto;
}

#banner > div,
#banner .imageBanner{
	height: 100vh;
}

.bannerContainer .imageBanner{
	background: url("../../Images/web/Ozean.jpg") no-repeat;
	background-size: auto 100%;
}

#banner .flex-center{
	height: 100%;
	display: flex;
	justify-content: space-between;
	gap: 50px;
	align-items: center;
}

#banner .max-width{
	height: 100%;
}

#banner .text-side > p{
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
	margin-bottom: 15px;
	/*text-shadow: 0px 0px 15px rgba(0, 0, 0, 1);*/
	color: #fff;
}

#banner .text-side > p:last-child{
	margin-bottom: 0;
}

#banner h1{
	color: #fff;
	font-weight: 700;
	font-size: 32px;
	line-height: 36px;
}

/***************************************************************************** Footer **/
#real-footer {
    padding: 45px 15px;
    position: relative;
    margin-top: 100px;
    color: #fff;
    
}

#real-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("../../Images/web/Ozean_2.png") no-repeat top center;
    transform: scaleX(-1);
    z-index: 0;
	height: calc(100% + 30px);
	top: -30px;
}

/* Damit der Inhalt des Footers über dem Pseudo-Element liegt */
#real-footer > * {
    position: relative;
    z-index: 1;
}
/*
#real-footer::before{
	content: '';
	position: absolute;
	height: 50px;
	width: 100%;
	background-image: url("../../Images/web/trenner_breit_blau.png");
	background-size: auto 50px;
	background-repeat: repeat;
	background-position: top center;
	top: -50px;
	left: 0;
}
*/
#real-footer .company-brand{
	height: 100px;
	width: 214px;
}

#real-footer .icon-content{
	display: flex;
	gap: 8px;
}

#real-footer .icon-content i{
	color: var(--accent-color);
}

#real-footer .footer-content{
	display: flex;
	gap: 30px;
	justify-content: flex-start;
}

#sub-footer{
	background: var(--primary-lighter-color);
	color: #fff;
	padding: 15px;
}

#sub-footer p,
#sub-footer a{
	font-size: 14px;
	line-height: 14px;
	margin: 0;
	font-family: 'Montserrat', sans-serif;
}

#sub-footer p{
	color: rgba(247, 247, 247, 0.4);
}

#sub-footer > div{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#sub-footer ul{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 15px;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#sub-footer ul a{
	text-decoration: none !important;
	text-transform: uppercase;
	font-size: 12px;
	color: rgb(247, 247, 247);
}

/***************************************************************************** Maximalbreiten **/
#orderLists,
#delivery-returns,
#orderView,
#lastorder-view,
#basket-view,
#catalog-view{
	max-width: var(--maxwidth);
	margin: 0 auto;
}

/***************************************************************************** Größen **/
#changePasswordMatDialog h3{
	font-size: 26px;
	line-height: 30px;
}

/***************************************************************************** Katalog **/
#itemView item-row > .item-row{
	color: #fff;
	background: linear-gradient(90deg, #193e68 0%, #214a79 60%, #2f5d91 100%);
	margin-bottom: 25px;
	grid-template-columns: 45% 1fr 1fr auto;
	position: relative;
	grid-template-areas:
  		"img desc1        desc1          desc1"
  		"img desc3        desc3          desc3"
  		"img desc4        desc4          desc4"
  		"img desc2        price     price"
  		"img desc5        priceandtax      priceandtax"
  		"img feature1     convfactor  convfactor"
  		"img feature2     inventory        inventory"
  		"img sortgroup    promotiondate     ."
  		"img alcohol      measure        ."
  		"img frozenflag   measuresum ."
  		"img preorderflag density       ."
  		"img itemtextinfo conditiontable              ."
  		"img shorttext    quantity              units"
  		"img .            .              ."
  		"img .            .              buttons";
	font-family: 'Poppins', sans-serif;
	font-weight: 300;
	
}

#itemView item-row > .item-row .item-image-container{
	display: flex;
	align-items: center;
	justify-content: center;
}

#itemView item-row > .item-row .item-row--itemkey{
	position: absolute;
	left: 15px;
	top: 15px;
	background: var(--accent-color);
	color: #333;
	border-radius: 12px;
	padding: 2px 8px;
	font-size: 18px;
	line-height: 18px;
	font-family: 'Amatic SC', sans-serif;
	font-weight: 700;
}

#itemView item-row > .item-row .description1{
	font-family: 'Amatic SC', sans-serif;
	position: relative;
	font-size: 28px;
	line-height: 30px;
	margin: 15px 0 20px;
}

#itemView item-row > .item-row .description1::after{
	content: '';
	position: absolute;
	top: 100%;
	left: 0;
	height: 10px;
	width: 75px;
	background: url("../../Images/web/heading_underline.png") no-repeat;
	display: block;
}

#itemView item-row > .item-row .description3{
	font-size: 14px;
	line-height: 16px;
	font-style: italic;
}

#itemView item-row > .item-row .description4{
	margin-bottom: 20px;
}

#itemView item-row > .item-row h4{
	font-family: 'Poppins', sans-serif;
	margin-bottom: 0;
}

#itemView item-row > .item-row h4::after{
	display: none;
}

#itemView item-row > .item-row .item-row--buttons{
	margin: 15px 0;
}

#itemView item-row > .item-row .item-row--buttons > .btn-success{
	margin-bottom: 0;
	background-color: var(--accent-color);
	border-color: var(--accent-color);
}

#itemView .item-table-header{
	margin-bottom: 15px;
}

#itemView .item-table-header .nav > li:nth-child(1),
#itemView .item-table-header .nav > li:nth-child(2),
#itemView .item-table-header .nav > li:nth-child(3),
#itemView .item-table-header .nav > li:last-child{
	display: none !important;
}

#itemView .item-table-body{
	width: 100%;
}


.item-detail-view > .row{
	background: linear-gradient(90deg, #193e68 0%, #214a79 60%, #2f5d91 100%);
	color: #fff;
}

.item-detail-view > .row h3,
.item-detail-view > .row h4{
	font-family: 'Poppins', sans-serif;
	font-weight: 300;
	margin: 0;
}

.item-detail-view > .row h3::after,
.item-detail-view > .row h4::after{
	display: none;
}

.item-detail-view > .row h3 > :first-child{
	position: absolute;
	right: 15px;
	top: -15px;
	font-size: 14px;
	line-height: 14px;
	padding: 2px 8px;
	border-radius: 12px;
	color: var(--primary-color);
	background: var(--accent-color);
	font-family: 'Amatic SC', sans-serif;
	font-weight: 700;
}

.item-detail-view .slider{
	background: transparent !important;
}

/***************************************************************************** Pagination **/
.pagination{

}

.pagination .page-link{
	background-color: transparent;
	border-color: transparent;
	padding: 0;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100% !important;
	transition: background .27s ease, color .27s ease;
}

.pagination .active .page-link,
.pagination .active .page-link:hover,
.pagination .page-link:hover{
	background: var(--primary-color);
	color: #fff !important;
}

.pagination .page-link i{
	font-size: 14px;
}

#paginator-first-page-img-2, #paginator-last-page-img-2{
	margin-left: -.55em;
}


/***************************************************************************** Bestellungen **/
#orderView .active{
	color: var(--primary-color) !important;
	border-left: 3px solid var(--primary-color) !important;
}

/***************************************************************************** Bestelllisten **/
#orderLists .active{
	color: var(--primary-color) !important;
	border-left: 3px solid var(--primary-color) !important;
}

/***************************************************************************** Überschrift **/
.title{
	border: none !important;
	box-shadow: none !important;
	background: transparent;
	top: -200px;
	font-size: 40px;
	line-height: 46px;
	font-weight: 700;
	margin: 0;
	color: #fff;
}

#orderLists > br,
#delivery-returns > br,
#orderView > br,
#lastorder-view > br,
#basket-view > br,
#catalog-view > br{
	display: none;
}

/***************************************************************************** Language-Switcher & User-Info **/
#language-selection{
	color: #fff;
}

.userInfo .btn{
	background-color: var(--accent-color) !important;
	border: none !important;
	border-radius: 30px !important;
	padding: 4px 12px;
}

.userInfo .dropdown-menu{
	white-space: nowrap;
}

/***************************************************************************** Modul: mod-company **/
#mod-company{
	text-align: left;
	margin: 150px 0;
	padding: 50px 0;
	background: url(/assets/custom/img/fisch_breit.jpg) no-repeat;
	background-size: 65% auto;
	font-weight: 300;
}

#mod-company .text-block{
	margin-left: auto;
	max-width: 700px;
	transform: translateY(100px);
	background: var(--primary-lighter-color);
	padding: 25px;
	color: #fff;
}

.module h2{
	color: #fff !important;
	font-weight: 700 !important;
	margin-bottom: 30px !important;
}

/***************************************************************************** Modul: mod-contact **/
#mod-contact{
	text-align: left;
	margin: 150px 0 -120px;
	padding: 50px 0;
	background: url(/assets/custom/img/fisch_breit.jpg) no-repeat;
	background-size: 100% auto;
	font-weight: 300;
}

#mod-contact .text-block{
	margin-left: auto;
	max-width: 700px;
	transform: translateY(75px);
	background: var(--primary-lighter-color);
	padding: 60px 25px;
	color: #fff;
	position: relative;
	z-index: 100;
}

.btn-contact{
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0);
	font-family: 'Poppins', sans-serif !important;
	font-size: 12px !important;
	line-height: 14px !important;
	font-weight: 700;
	padding: 16px 32px;
	color: #fff;
	transition: background .27s ease, border .27s ease;
}

.btn-contact:hover{
	color: #fff !important;
	background: rgba(255, 255, 255, 0);
	border: 1px solid rgba(255, 255, 255, 0.1);
}

#mod-contact .btn-contact{
	margin-top: 10px;
}


/***************************************************************************** Basket-Dialog **/
#basketDialog .item-row h3::before,
#basketDialog .item-row h3::after{
	display: none !important;
}


@media print{
	#basketDialog h3::before,
	#basketDialog h3::after{
		display: none !important;
	}
	
	#basketDialog h3{
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}
}