/*
#preisanfrage-info { position: fixed; top: 45%; right: 0;
	transform: rotate3d(0, 0, 1, -90deg);
	transform-origin: bottom right;
	background: #2e75b6; color: white;
	cursor: pointer; font-size: 11px; text-transform: uppercase;
	padding: .6em 1.5em; font-weight: 500;
	border-top-left-radius: .5em;
	border-top-right-radius: .5em;
	box-shadow: -2px -2px 4px rgba(0, 0, 0, .6);
	opacity: 0; transition: opacity 800ms ease;
	pointer-events: none }
#preisanfrage-info.disp { opacity: 1; pointer-events: all }
#preisanfrage-num { background: #ff6600; font-size: 9px;
	position: absolute; top: 50%; left: -1.3em;
	width: 2.6em; height: 2.6em; border-radius: 1.5em;
	text-align: center; line-height: 1.4; padding: .6em 0;
	transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, 90deg);
	transform-origin: center center;
	box-shadow: -2px 2px 4px rgba(0, 0, 0, .6) }
#preisanfrage-info.changed #preisanfrage-num {
	animation: jump 800ms 1 both }

@keyframes jump {
	0% { transform: translate3d(-10%, -50%, 0) rotate3d(0, 0, 1, 90deg)
		scale3d(1, 1, 1) }
	10% { transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, 90deg)
		scale3d(1.1, .9, 1) }
	15% { transform: translate3d(0.2em, -50%, 0) rotate3d(0, 0, 1, 90deg)
		scale3d(1, 1, 1) }
	60% { transform: translate3d(1em, -50%, 0) rotate3d(0, 0, 1, 90deg)
		scale3d(1, 1, 1) }
	100% { transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, 90deg)
		scale3d(1, 1, 1) }
}
*/

#preisanfrage-info { position: fixed; top: 45%; right: 0;
	background: #2e75b6; color: white;
	cursor: pointer; font-size: 11px; text-transform: uppercase;
	padding: .6em 1.5em; font-weight: 500;
	border-top-left-radius: .5em;
	border-bottom-left-radius: .5em;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, .6);
	opacity: 0; transition: opacity 800ms ease;
	pointer-events: none;
	height: 120px; width: 30px }
#preisanfrage-info.disp { opacity: 1; pointer-events: all }
#preisanfrage-num { background: #ff6600; font-size: 9px;
	position: absolute; left: 15px; bottom: -1.3em;
	width: 2.6em; height: 2.6em; border-radius: 1.5em;
	text-align: center; line-height: 1.4; padding: .6em 0;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, .6);
	transform: translate3d(-50%, 0, 0) }
#preisanfrage-info.changed #preisanfrage-num {
	animation: jump 800ms 1 both }
.preisanfrage-info-label { display: block; white-space: nowrap;
	transform-origin: center center;
	transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -90deg);
	position: absolute; top: 50%; left: 15px }

@keyframes jump {
	0% { transform: translate3d(-50%, -10%, 0) scale3d(1, 1, 1) }
	10% { transform: translate3d(-50%, 0, 0) scale3d(1.1, .9, 1) }
	15% { transform: translate3d(-50%, 0.2em, 0) scale3d(1, 1, 1) }
	60% { transform: translate3d(-50%, 1em, 0) scale3d(1, 1, 1) }
	100% { transform: translate3d(-50%, 0, 0) scale3d(1, 1, 1) }
}

#preisanfrage-overlay { display: none; opacity: 0; pointer-events: none;
	background: rgba(0, 0, 0, .6); padding: 10vh 10vw; position: fixed;
	top: 0; left: 0; width: 100%; height: 100%; z-index: 1001;
	transition: opacity 400ms; overflow: auto; text-align: center }
#preisanfrage-overlay.disp { display: block; animation: fade-in 1 400ms 100ms both;
	pointer-events: all }
#preisanfrage-overlay.fade-out { animation: fade-out 200ms 1 both }
#preisanfrage-overlay::before { content: ''; display: inline-block;
	vertical-align: middle; width: 1px; margin-right: -1px; height: 75vh }
#preisanfrage-inner { width: 99%; min-height: 100px; display: inline-block;
	vertical-align: middle; background: white; color: black; padding: 20px;
	max-width: 1100px; transition: opacity 200ms; opacity: 0;
	pointer-events: none; text-align: left }
#preisanfrage-inner h2 { margin: 0 0 10px 0 }
#preisanfrage-inner.disp { opacity: 1; pointer-events: all }
#preisanfrage-loader { position: absolute; top: 50%; left: 50%; width: 100px;
	height: 100px; transform: translate3d(-50%, -50%, 0);
	border-top: 5px solid white; border-radius: 100px; opacity: 0;
	transition: opacity 400ms; pointer-events: none }
#preisanfrage-loader.disp {
	animation: spinning infinite 800ms linear,
		fade-in 1 1200ms 800ms ease both }

@keyframes fade-in {
	from { opacity: 0 }
	to { opacity: 1 }
}
@keyframes fade-out {
	0% { opacity: 1; display: block }
	99% { opacity: 0; display: block }
	100% { opacity: 0; display: none }
}
@keyframes spinning {
	0% { transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, 0deg) }
	25% { transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -90deg) }
	50% { transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -180deg) }
	50% { transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -270deg) }
	100% { transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -360deg) }
}

#preisanfrage-main,
#preisanfrage-result { position: relative }
#preisanfrage-close { position: absolute; font-weight: normal;
	font-size: 20px; top: 0; right: 0; cursor: pointer;
	width: 1em; height: 1em; line-height: 1em; color: black;
	text-align: center }
#preisanfrage-close::before { display: inline; content: '×' }
#preisanfrage-main h2:first-child { margin: 0 0 .5em 0 }
.preisanfrage-title { /* background: #002c52; */ color: white; font-weight: 600;
	font-size: 12px; margin: 0; padding: .3em 2em; text-align: center }
.preisanfrage-productlist { overflow-y: scroll }
.preisanfrage-productlist-head { display: flex; border-bottom: 1px solid #d8d8d8;
	font-size: .9em }
.preisanfrage-productlist-head .presianfrage-article-qty,
.preisanfrage-productlist-head .preisanfrage-article-artnum,
.preisanfrage-productlist-head .preisanfrage-article-text { padding: 5px 10px }
/*
@media (min-width: 992px) {
	.preisanfrage-productlist { height: 30vh }
}
*/

.preisanfrage-article { display: flex; flex-wrap: wrap }
.preisanfrage-article.odd { background: #f2f2f2 }
.preisanfrage-article img { max-width: 100%; height: 100%;
	object-fit: contain; background: white }
.preisanfrage-article input[type=text] { max-width: 3em; text-align: center;
	border-radius: 0; border: 1px solid #002c52 }
.preisanfrage-article-qty { width: 60px; text-align: center;
	display: flex; justify-content: center; flex-direction: column }
.preisanfrage-article-qty input { margin: 0 auto }
.preisanfrage-article-artnum { padding: 1em; width: 140px;
	text-align: center; display: flex; justify-content: center;
	flex-direction: column }
.preisanfrage-article-qty,
.preisanfrage-article-artnum { border-right: 1px solid #d8d8d8 }
.preisanfrage-article-img { width: 100px; flex: 1 1 100px }
.preisanfrage-article-text { flex: 0 0 100%; padding: 1em }
.preisanfrage-article-del { padding: 0 5px; text-align: right;
	display: flex; justify-content: center; flex-direction: column;
	flex: 1 0 2em }

/* .preisanfrage-bot { height: 210px; background: #f2f2f2 } */
.preisanfrage-bot .btn-primary { /* background: #002c52; */ border: none;
	width: 100%; border-radius: 10px;
	background: white linear-gradient(90deg, #3e9ea6cc, #3e9ea6) }
#preisanfrage-exceldl { margin-top: 1em }
.preisanfrage-bot label { width: 33%; display: inline-block;
	vertical-align: top; margin-bottom: 0; white-space: nowrap;
	text-overflow: ellipsis }
.preisanfrage-bot input[type=text],
.preisanfrage-bot textarea { width: 60%; vertical-align: middle;
	border: none; background: transparent;
	font-size: inherit; line-height: inherit }
.preisanfrage-bot input[type=text] { height: 20px }
.preisanfrage-bot textarea { height: 150px }
.preisanfrage-bot
.preisanfrage-box { padding: 10px; font-size: 12px; /* height: 200px */ }
.preisanfrage-box { box-shadow: 5px 5px 14px rgba(0, 0, 0, .25) }
.preisanfrage-left .preisanfrage-box { padding: 5px 10px }
.preisanfrage-bglines { font-size: 11px; line-height: 25px;
	background: white url(../../img/preisanfrage-bglines.png) repeat 0 0 }

@media (min-width: 992px) {
	.preisanfrage-row { display: flex }
	.preisanfrage-left { flex: 1 1 66%; padding-right: 10px;
		display: flex; flex-direction: column }
	.preisanfrage-right { flex: 1 1 33%; padding-left: 10px }
	.preisanfrage-left .preisanfrage-box { display: flex; flex-direction: column;
		flex: 1 1 auto; height: 300px }
	.preisanfrage-productlist { flex: 1 1 }
	.preisanfrage-article { flex-wrap: nowrap }
	.preisanfrage-article-del { order: 5; flex-grow: 0 }
	.preisanfrage-article-img { flex-grow: 0 }
	.preisanfrage-article-text { flex: 1 1 0% }
	.preisanfrage-article-text > div { font-size: .9em }
}

#preisanfrage-info-prod { width: 0; overflow: hidden }
@media (min-width: 992px) {
	#preisanfrage-info.showprod { animation: open-close 3s ease }
	#preisanfrage-info-prod { background: white; color: #333; width: 550px;
		overflow: hidden; height: calc(100% - 2em); position: absolute;
		left: 35px; top: 1em; text-decoration: none; text-transform: none;
		font-weight: normal; font-size: 12px; padding: 10px 0 }
	#preisanfrage-info-prod .pricebasket { display: none }
	#preisanfrage-info-prod .col-md-2 { width: 25% }
	#preisanfrage-info-prod .title a { font-weight: bold; color: #3e9ea6 }
}
@keyframes open-close {
	0% { width: 30px }
	20% { width: 585px }
	80% { width: 585px }
	100% { width: 30px }
}