#pagehead {position:relative;}
/* titillium-web-300 - latin */
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('/services/gf/titillium-web/v15/latin-ext_latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/services/gf/titillium-web/v15/latin-ext_latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/services/gf/titillium-web/v15/latin-ext_latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('/services/gf/titillium-web/v15/latin-ext_latin-300.woff') format('woff'), /* Modern Browsers */
       url('/services/gf/titillium-web/v15/latin-ext_latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/services/gf/titillium-web/v15/latin-ext_latin-300.svg#TitilliumWeb') format('svg'); /* Legacy iOS */
}
/* titillium-web-700 - latin */
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/services/gf/titillium-web/v15/latin-ext_latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/services/gf/titillium-web/v15/latin-ext_latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/services/gf/titillium-web/v15/latin-ext_latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('/services/gf/titillium-web/v15/latin-ext_latin-700.woff') format('woff'), /* Modern Browsers */
       url('/services/gf/titillium-web/v15/latin-ext_latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/services/gf/titillium-web/v15/latin-ext_latin-700.svg#TitilliumWeb') format('svg'); /* Legacy iOS */
}


:root{
	--fntfam:'Titillium Web',sans-serif;
}

html, body, *:not(pre) {font-family:var(--fntfam);margin:0;}

@media only screen and (max-width:999px){
	body{font-size:2vh}
}
@media only screen and (max-width:999px) and (orientation: landscape) {
	body{font-size:2vw}
}
/* armata-regular - latin */
@font-face {
  font-family: 'Armata';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/services/gf/armata/v19/latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/services/gf/armata/v19/latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/services/gf/armata/v19/latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/services/gf/armata/v19/latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/services/gf/armata/v19/latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/services/gf/armata/v19/latin-ext_latin-regular.svg#Armata') format('svg'); /* Legacy iOS */
}
:root{
	--fnt-small:'Armata',sans-serif;
}

#pagefoot {background:var(--bgfoot);position:relative;font-size:.9rem;padding:2em 2em .8em;display:flex;flex-direction:column;justify-content:space-between}
#pagefoot .fourcols {display:flex;justify-content: space-between;gap:2em}
@media only screen and (max-width:800px) {
	#pagefoot .fourcols {flex-direction:column}
}
#pagefoot, #pagefoot a {color:var(--bgfootf);#eee;text-decoration:none}
#pagefoot a:hover {Xtext-decoration:underline;color:var(--bgfootfh);}
#pagefoot .alist {display:flex;flex-direction:column}

#pagefoot .poweredby {text-align:center;opacity:.5;font-size:13px}

#pagefoot h4, #pagefoot .alist>a {text-wrap: balance;}

@media only screen and (max-width:600px) { /*mobile*/
a[href$=pdf]:after {content:" (PDF)";font-size:.6em;opacity:.4;vertical-align:top;text-decoration:none}
}
#products>article{margin:1em 0 0 1em;}
/*#products{display:flex;flex-wrap:wrap;}*/
@media only screen and (min-width:1201px) { /* nebeneinander, aber nich tam tablet */
	/*#products{display:flex;flex-wrap:wrap;gap:1em;}
	#products.cols3>article{width:calc(33.33% - 1.666em)}
	#products.cols2>article{width:calc(50% - 1.5em)}
	
	margin versschiedbung mit einrechnen: */
	#products{gap:1em;}
	#products.cols3>article{width:calc(33.33% - 1.666em)}
	#products.cols2>article{width:calc(50% - 1.5em)}
}
/*@media only screen and (max-width:800px) {
	#products{flex-direction:column}
}*/
#strct_content .intro {}
#strct_content .intro .btn {text-decoration:none;background:var(--bg1);color:var(--bg1f);padding:.6em;display:inline-block;white-space:nowrap;}
.rnd_a #strct_content .intro .btn {border-radius:4px}
#strct_content .intro .inlinebtn {color:red;white-space:nowrap;}

.flag{position:Absolute;right:0;top:0;width:4em;height:4em;}
/*.flag span{visibility:hidden}*/
.shoplist .ptbCard>div>h1,.shoplist .ptbCard>div>h2,.shoplist .ptbCard .desc {padding-right:4em}
.flag:before{content:"";display:block;position:absolute;left:.5em;top:.5em;right:.5em;bottom:.5em;background:50% 50% no-repeat;background-size:contain}
/*.flag.flag_bestseller:before{background-image:url(/img/tool/flag_bestseller.gif)}
.flag.flag_expiring:before{background-image:url(/img/tool/flag_expiring.gif)}
.flag.flag_pricetip:before{background-image:url(/img/tool/flag_pricetip.gif)}*/
.flag.flag_pricetip:before{background-image:url(https://app-ins.de/svg/conf/shape-27.svg?s=100&c=hdd0000)}
.flag.flag_bestseller:before{background-image:url(https://app-ins.de/svg/conf/shape-27.svg?s=100&c=h008000)}
.flag.flag_expiring:before{background-image:url(https://app-ins.de/svg/conf/shape-27.svg?s=100&c=h9fd3ff)}
/*.flag.flag_pricetip span{    visibility: visible;*/ .flag span{
    line-height: .9em;
    text-align: center;
    display: block;
    margin: 1.2em auto;
    transform: rotate(15deg);
    color: #fff;
    font-size: .95em;
	max-width:3em;
}



.price_info{display:block;font-size:.9em;color:#a4a4a4;text-align:right;}
.price_info a {color:inherit}
.price_info.pi_none{}
.price_info.pi_small{}
.price_info.pi_normal{}
.prodpic{width:100%}
.hasTranspic .prodpic{width:90%} /* ? */
@media only screen and (max-width:600px) {
	.prodpic{width:100%}
}
@media only screen and (max-width:800px) {
	.prodpic{width:60vw}
}



/*.shoplist .haspics {padding-left:1em}*/
.shoplist .haspics .desc {margin-top:1em;}
.shoplist .haspics .picwrap {border:6px solid var(--bg1);background:#fff;width:12em;height:9em;overflow:hidden}
.rnd_a .shoplist .haspics .picwrap{border-radius:6px;}
@media only screen and (min-width:601px) {
	.shoplist .haspics .desc {padding-left:11em;position:relative;margin-top:-9em;min-height:9em}
	.shoplist .haspics .picwrap {position:relative;left:-2em;top:0em;}
}

.shoplist .hasTranspic {padding-left:2em}
.shoplist .hasTranspic .desc {padding-left:10em;position:relative;margin-top:-12em}
.shoplist .hasTranspic .picwrap {width:12em;height:12em;position:relative;left:-3em;top:0em;overflow:hidden}
@media only screen and (min-width:601px) {
}



#showcart{display:none;height:0;overflow:hidden;height:0;position:fixed;z-index:50;top:4.1rem;left:0;right:0;transition:height .5s}
.showcart #showcart{xJSxheight:var(--hshowcart);display:block}
.showcart #strct_main{margin-top:var(--hshowcart)}

.loading{background:url(https://app-ins.de/svg/loader/blocks.svg?c=hff4f4f) 50% 3em no-repeat;}

#showcart>div{max-width:var(--headerwidth);padding:0;margin:0 auto;}

#showcart .main{height:var(--hshowcart);background:var(--bgshowcart);color:var(--fgshowcart);display:flex;justify-content:space-around;}
.rnd_a #showcart .main{border-radius:0 0 6px 6px}
#showcart .main>*{height:var(--hshowcart);line-height:var(--hshowcart);}
#showcart .main .cico {padding:0;width:var(--hshowcart);background:url(https://app-ins.de/svg/83.svg?c=hfff) 50% 50% no-repeat}
#showcart .main .cico .bubble {position:absolute;right:-.5em;top:1px;background:red;color:#fff;width:1.1em;height:1.1em;line-height:1.1em;text-align:center;border-radius:50%;font-size:.8em}
#showcart .main .cprice	{padding:0 1em;}
#showcart .main a {width:7em;color:inherit;var(--fgshowcart);text-decoration:none}
/*#showcart .main a:not(.cico):before		{content:"";display:inline-block;width:.5em;margin-right:.2em;height:.6em;background:url(https://app-ins.de/svg/menu_deeper.svg?s=10&c=hfff) 50% 50% no-repeat;/ *pagination_solo* /background-size:contain;xtransform:rotate(180deg)} */

#showcart .arr{position:absolute;z-index:501;bottom:-.8em;background:silver;left:50%;left:calc(50% - .6em);border-radius:50%;}

#showcart .full{display:none;position:fixed;z-index:500;left:1em;bottom:1em;right:1em;top:calc(var(--hhead) + 2em)}
#showcart .full>div{background:blur;max-width:var(--headerwidth);margin:0 auto;padding:1em}
#showcart .full>div>div{background-color:greenyellow;min-height:calc(99vh - var(--hhead) - 2em - 2em)}

#strct_main{transition:.3s}
.showcartfull #strct_main {
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-o-filter: blur(5px);
	-ms-filter: blur(5px);
	filter: blur(5px);}
	
.showcartfull #showcart .full {xdisplay:block}
html, body {width:100%;position:relative;height:100%}
/*html, body, pre, hr, section, aside, main, header, footer,div {padding:0;}*/
* {padding:0;box-sizing:border-box;position:relative;font-family:inherit;font-size:inherit;}
p, .p {padding:1rem}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {padding:1em 1rem .5em}
h1,.h1 {font-size:1.3em}
h2,.h2 {font-size:1.2em}
h3,.h3 {font-size:1.1em}
h4,.h4 {font-size:1em;font-weight:bold}
h5,.h5 {font-size:.8em;font-weight:bold}
h6,.h6 {font-size:.7em;font-weight:bold}
img,embed,object,video{max-width: 100%;}
.streich{text-decoration:line-through;}


#ptbOverlay {transform:translateX(110%);transition:translate .4s;z-index:10001;position:fixed;top:0;bottom:0;left:0;right:0;background:rgba(0,0,0,.8);padding:3vh}
body.show_ptbOverlay {overflow:hidden}
body.show_ptbOverlay #ptbOverlay {transform:translateX(0%)}
#ptbOverlay .close {position:absolute;right:1em;top:1em;color:#aaa;z-index:1002;cursor:pointer;font-size:2rem}
#ptbOverlay>div {display:flex;flex-direction:column;justify-content: center;width:100%;height:100%;}
#ptbOverlay .inner {max-width:min(600px,calc(100vw - 6vh));background:#fff;color:#222;margin:0 auto;padding:2em;}
#ptbOverlay .inner>div {max-height: 60vh;overflow: auto;}
#ptbOverlay .inner>div>ul {margin:1em 1em 1em 2.2em}
#ptbOverlay .inner>div>h1 {padding-left:0}
#ptbOverlay .inner>div>h1:first-child {padding-top:0}
#ptbOverlay .inner>footer{margin-top:.5em;display:flex;justify-content:space-between}
#ptbOverlay .inner>footer .btn{background:var(--bg1);color:var(--bg1f);padding:.5em;text-decoration:none}
#strct_main{transition:.3s}
.show_ptbOverlay #strct_main {
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-o-filter: blur(5px);
	-ms-filter: blur(5px);
	filter: blur(5px);}

form .hideInForm{display:none}


/* einheitliches flexing */
.pagebox{}
@media only screen and (max-width:1200px) {
	.intro,.pagebox{padding-left:1rem;padding-right:1rem}
	.intro{}
}
.flxbox.cols3{} /*not under pagewidth */
.flxbox.cols2{}
.flxbox.flxever{display:flex;--gap:1rem}
.flxbox.flmo-t2b{flex-direction:column;gap:var(--gap);}
.flxbox.flmo-t2b-c{align-items: center;}
.flxbox.flxever.flw{flex-wrap:wrap;}
.flxbox.flxever.flj-sb{justify-content:space-between}
.flxbox.flxever.flj-sb-autow>*{width:revert}
.flxbox.flxever.flj-sa{justify-content:space-around}
@media only screen and (min-width:1201px) {
	.flxbox{display:flex;--gap:1rem}
	.ptbCard>div.flxbox{display:flex !important}
	.flxbox.cols3, .flxbox.cols2 {flex-direction: row;flex-wrap:wrap;gap:var(--gap);}
	.flxbox.cols3>*{width:calc((100% - (2 * var(--gap))) / 3)}
	.flxbox.cols2>*{width:calc((100% - var(--gap)) / 2)}
	.flxbox.flw{flex-wrap:wrap;}
	.flxbox.flj-sb{justify-content:space-between}
	.flxbox.flj-sb-autow>*{width:revert}
	.flxbox.flj-sa{justify-content:space-around}
	.flxbox.flmo-t2b{flex-direction:row}
	.flxbox.flmo-t2b-c{align-items: revert;}
	.flxbox.fldt-t2b{flex-direction:column;gap:var(--gap);}
	.flxbox.fldt-t2b-c{align-items: center;}
}
@media only screen and (min-width:601px) {
	.intro, .flxbox.tad{display:flex;--gap:1rem}
	.intro {justify-content:space-between;}
	.intro,.flxbox.tad.cols3, .flxbox.tad.cols2 {flex-direction: row;flex-wrap:wrap;gap:var(--gap);}
	.flxbox.tad.cols3>*{width:calc((100% - (2 * var(--gap))) / 3)}
	.intro>*,.flxbox.tad.cols2>*{width:calc((100% - var(--gap)) / 2)}
}



/* einheitliches flexing - neue Logik*/
.df		{display:flex}
.df-g	{--gap:1em;gap:var(--gap)}
.df-a	{justify-content:space-between;} /* außen */
.df-m	{align-items:center;} /* horizontal mittig */
.df-b	{align-items:flex-end;} /* horizontal unten bottom */
@media only screen and (max-width:600px) {
	.df-t2b-b600	{flex-direction: column;}
}
body {background:url(/pic/tool/bg1.jpg) no-repeat 40% 50%;background-size:cover;background-attachment:fixed;}
#headwrap {
	/*aaa-display:flex;
	aaa-x-nunrwennwenig-;justify-content:space-between;around;xx vielleicht auch besser flowaten;
	aaa-align-items:center;*/
	height:var(--hhead);background:var(--bgHead);
	padding:0;
}
.rnd_a #headwrap {border-radius:0 0 1em 1em;transition:border-radius .2s;}
.showcart #headwrap{border-radius:0}
@media only screen {
	.scrolled #headwrap {position:sticky;position:fixed;top:0;width:var(--headerwrpwidth);z-index:50}
	.scrolled #headwrap #head {width:100%;max-width:var(--headerwidth);}
	.scrolled #strct_main {Xnicht bei sticky footermargin-top:var(--hhead);}
}
#headwrap a {text-decoration:none;color:var(--fgHead)}
#headwrap a:hover{color:var(--fgHeadHov)}
#head>* {xborder:1px dashed orange;line-height:var(--hhead);margin-left:10px;float:right}

#logo {float:left;}
#logo h2{padding:0}

#nav1 {overflow:auto;cfloat:right;xxxflex-basis:60%;height:var(--hhead)}
#nav1 li {
	list-style:none;padding:0;
}
#nav1 a {
	display:block;
	padding:0 1em;line-height:var(--hhead);
}
#nav1 .active {
	background:rgba(0,0,0,.1);
}
#nav1 .active a {

}
#opennav1{position:absolute;visibility:hidden;z-index:-2000;cursor:pointer}
#opennav1~label {display:none}


@media only screen and (min-width:1000px){
	#nav1 {max-width:50%;x-sprengt seitenbreite...display:flex}
	#nav1 li {float:left;}
	#nav1 a {color:var(--fgHead);}
	#nav1 a:hover {
		color:var(--fgHeadHov);
		background:rgba(255,255,255,.3);
	}
}
@media only screen and (max-width:999px){
	#head{position:fixed;z-index:12/*vor slide*/;}
	#headwrap{overflow-x:hidden}
	:root{
		--navspace: 5px;
	}
	#nav1 {
		xdisplay:none;
		background:#f0f0f0f0;#615b52;color:#444;var(--bg1);
		position:fixed;
		width:calc(100% - var(--navspace) - var(--navspace));max-width:100%;height:calc(100% - var(--hhead) - var(--navspace) - var(--navspace));
		left:var(--navspace);top:calc(var(--navspace) + var(--hhead));z-index:100;
		transform:translateX(110%);
		transition:.3s ease-in;
		margin:0;
	}
	#headwrap a {color:#444} #headwrap a:hover {color:#000} /*mobil anders wg #nav1 bg*/
	.rnd_a #nav1 , .rnd_a .rnd_navlike_4{border-radius:12px;}
	#head{--navpad:calc(var(--hhead) / 9);1vh}
	#opennav1~label{
		display:block;z-index:200;
		line-height:calc(var(--hhead) - var(--navpad));
		padding:var(--navpad)}
/*	#opennav1~label>div{height:calc(var(--navpad) / 2);width:calc(4 * var(--navpad));background:#fff;margin:var(--navpad);padding:0;transition:.3s;cransform-origin:0 0}*/
	#opennav1~label>div{
		height:var(--navpad); calc((var(--hhead) - (2 * var(--navpad))) / 6);
		width: calc(6 * var(--navpad));3.1;
		background: #fff;
		margin: var(--navpad);calc((var(--hhead) - (2 * var(--navpad))) / 7);
		padding:0;transition:.3s;transform-origin:left
	}
	#logo {max-width:calc(min(100%, var(--headerwidth)) - 40px - (8 * var(--navpad)))}
	#logo a h2 { /* besser nach typ trennen^^ und separaten Text ermöglichen, damit nix gekürzt werden muss */
		max-height:calc(var(--hhead) - var(--navpad));
		overflow:hidden;
	}
	#opennav1:checked ~ #nav1 {
		display:flex;flex-direction: column;
		transform:translateX(0%);
	}
	/*:root{--x:calc(1.1 * var(--navpad)); --xx:calc(-1.1 * var(--navpad))}*/
	#opennav1:checked ~ label>div:nth-of-type(1) {cbackground:red;transform:rotate(45deg)/* translate(var(--x),var(--x))*/;width: calc(5.5 * var(--navpad))}
	#opennav1:checked ~ label>div:nth-of-type(2) {cbackground:blue;opacity:0}
	#opennav1:checked ~ label>div:nth-of-type(3) {cbackground:yellow;transform:rotate(-45deg)/* translate(var(--x),var(--xx))*/;width: calc(5.5 * var(--navpad))}
	/* BUG wenn cartrow da ist ist home überdeckt */
	#nav1 a {text-align:center}
}




.ptbCard.btmspc{margin:0 0 1em}
.ptbCard>div {display:block;/*height:100%;*/padding:.55em 1em;position:relative;background:var(--box1bg);flex: auto;}
.rnd_a .ptbCard:not(.ptbCardwFoot)>div, .rnd_a .rnd_boxlike_4 {border-radius:6px;}
	.rnd_a .ptbCard.ptbCardwFoot>div:first-child{border-radius:6px 6px 0 0;}
	.rnd_a .ptbCard.ptbCardwFoot>footer{border-radius:0 0 6px 6px;}
.shdw_a .ptbCard {box-shadow:1px 1px 8px -3px #333}
	.shdw_a.rnd_a .ptbCard:not(.haspics){border-radius:6px;}
.ptbCard>div>h1,.ptbCard>div>h2{color:var(--bg1);padding-top:.5rem}
.ptbCard>div>h1 *,.ptbCard>div>h2 *{color:var(--bg1);}
.ptbCard>div>h1,.ptbCard>div>h2,.ptbCard .desc{padding-left:1rem}
.ptbCard ul,.ptbCard ol{padding-inline-start:1.5rem}
.ptbCard ul{padding-inline-start:1.5rem}

																							/*.ptbCardwFoot>div{padding-bottom:3em}*/
																							/*.ptbCardwFoot footer{position:absolute;bottom:0;left:0;right:0;}*/
																							.ptbCardwFoot{display:flex;flex-direction:column;}
																							.ptbCardwFoot>div:first-child{flex:auto}
.rnd_a .ptbCardwFoot footer, .rnd_a .rnd_boxlike_u{border-radius:0 0 6px 6px}

/* aus shop */

																		/*.ptbCardwFoot>div{padding-bottom:6em}*/
																		/*.ptbCardwFoot.wprice>div{padding-bottom:8em}*/
.ptbCardwFoot.wOpts_1>div{}
.ptbCard .price p{text-align:right;font-size:1.2em;padding:0/*1em 0 0 */}
																		.ptbCardwFoot.wprice .price{/*position:absolute;bottom:3.8em;left:.8em;right:.8em;*/padding-bottom: 1.4em;}




.shoplist .ptbCardwFoot{}
.shoplist .ptbCardwFoot footer{background:var(--box1fbg);padding:.4em;text-align:right}
.shoplist .ptbCardwFoot footer input {background:#f4f4f4;border:1px solid silver;text-align:right}
.rnd_a .shoplist .ptbCardwFoot footer input {border-radius:4px;}
.shoplist .ptbCardwFoot footer .times {display:inline-block;padding:0 6px 0 3px}
.shoplist .ptbCardwFoot footer button, .shoplist .ptbCardwFoot footer .btn {background:var(--btnBG1);color:var(--btnBG1F);}
.rnd_a .shoplist .ptbCardwFoot footer button,.rnd_a .shoplist .ptbCardwFoot footer .btn {border-radius:6px;}
.shoplist .ptbCardwFoot footer button, .shoplist .ptbCardwFoot footer .btn, .shoplist .ptbCardwFoot footer .buttonreplace {padding:.3em .6em;border:none;display:inline-block;margin:1px 0}
.rnd_a .shoplist .ptbCardwFoot footer button,.rnd_a .shoplist .ptbCardwFoot footer .btn,.rnd_a .shoplist .ptbCardwFoot footer .buttonreplace {border-radius:6px;}
.shoplist .ptbCardwFoot footer .buttonreplace {background:url(https://app-ins.de/svg/loader/blocks.svg?c=hff4f4f) 3px 60% no-repeat;background-size:12px auto;padding-left:1em}
.shoplist .ptbCardwFoot footer .buttonreplace span {font-size:.7em}

.shoplist .ptbCardwFoot footer .options {display:flex;justify-content: flex-end;padding:0 0 .5em 1em}
.shoplist .ptbCardwFoot footer .options select{margin-left:1em;min-width:40%}

@media only screen and (max-width:600px) {
	.shoplist .ptbCardwFoot>div{padding-bottom:8em}
	.shoplist .ptbCardwFoot footer .line {display:block;height:1px}
}
/* aus shop */

.btn, button {cursor:pointer}

.ptTc{text-align:center}
.ptTr{text-align:right}
.nob{font-weight:normal}
.bold{font-weight:bold;}
a.nou,a.uoh{text-decoration:none}
a.uoh:hover{text-decoration:underline}
a.ucoh{text-decoration:none;border-bottom:1px dashed silver;transition:border .2s}
a.ucoh:hover{border-bottom:1px solid black;border-color: inherit;}

.ptFl{float:left}
.ptFhalf{float:left;width:50%}
.ptFquarter{float:left;width:25%}
.ptF3quarter{float:left;width:75%}
.ptClb{clear:both}

.inputblock{margin-bottom:.3em}
.inputblock.ptFfirst{padding-right:.3em}
.inputblock label:not(.forcbor) {position: absolute;z-index:2;left: .2rem;font-size: 0.8em;}
.inputblock label~input:not([type=hidden]):not([type=checkbox]):not([type=radio]){padding-top:1em}
.inputblock input:not([type=hidden]):not([type=checkbox]):not([type=radio]){display:block;width:100%;width:calc(100% - 2px)}
.inputblock label~select{padding-top:1em}
.inputblock select{display:block;width:100%;}
label.forcbor{margin-left:.5em}
label.forcborb{margin-left:.5em;margin-right:.5em}

.ptbShowChanges:after, .ptbShowPWCopy:after{content:"";display:inline-block;width:3px;background:silver;position:absolute;left:0;height:100%;bottom:0;transition:height .1s;}
.res {padding-Bottom:.5em}
.res .error, .fail, .error, .warn {color:red;}
.res .success, .success, .ok {color:green;}

dl.infoout {margin:1em;}
dl.infoout>dt {float:left;margin-right:1em;font-weight:bold}
dl.infoout.infoout-fail>dd {color:red}

.ptbShowChanges input:not([type=hidden]),
.ptbShowChanges textarea,
.ptbShowChanges select,
.ptbShowPWStrength input:not([type=hidden]),
.ptbShowPWCopy input:not([type=hidden])
	{padding-left:calc(.2rem + 3px)}
.ptbShowChanges label,
.ptbShowPWStrength label,
.ptbShowPWCopy label {left:calc(.2rem + 3px) !important}

.ptbShowPWStrength>input {margin-bottom:0 !important}
	.ptbShowPWStrength>div{content:"";display:inline-block;background:silver;position:absolute;left:0;width:100%;bottom:0;
			height:4px;position:relative;margin:4px auto 10px;
			background: rgb(255,0,0);
			background: -moz-linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(255,248,0,1) 60%, rgba(31,180,0,1) 100%);
			background: -webkit-linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(255,248,0,1) 60%, rgba(31,180,0,1) 100%);
			background: linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(255,248,0,1) 60%, rgba(31,180,0,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff0000",endColorstr="#1fb400",GradientType=1);}
	.ptbShowPWStrength>div>div {position:absolute;z-index:2;top:-4px;left:0%;Border:7px solid transparent;border-top-color:gray;transition:left .2s}

.change_none:after,.ptbAccord-Card .change_none:after{background:gray;}
.change_dif:after,.ptbAccord-Card .change_dif:after{background:red;}
.change_saved:after,.ptbAccord-Card .change_saved:after{background:green;}
.showTimer:after,.ptbAccord-Card .showTimer:after{transition:height 2s;}
.changeTimer:after,.ptbAccord-Card .changeTimer:after{height:0%}


.bigBtn {padding:2em 0 1em;text-align:center}
.smallBtn {padding:1em 0;}
#showsums .bigBtn {text-align:right}
.bigBtn>a, .bigBtn>button,.smallBtn>a, .smallBtn>button {border:0;background:var(--bg1)/* url(https://app-ins.de/svg/menu_deeper.svg?s=100&c=h000) .3em 50% no-repeat;background-size:auto 1.3em*/;padding:.4em .6em .4em 1.6em;text-decoration:none;color:var(--bg1f);transition:all .1s}
	.bigBtn>a::before, .bigBtn>button::before,.smallBtn>a::before, .smallBtn>button::before {font-weight: 900;
	content: "\f0da";
	font-family: "Font Awesome 5 Free";
	position:absolute;top: .95em;
	left: .5em;/*padding: 0 .3em 0 .2em;
	vertical-align: middle;
	top:-1em;*/
	font-size: 1.3em;
	line-height: 0;transition:all .1s;}
.bigBtn>a:hover, .bigBtn>button:hover,.smallBtn>a:hover, .smallBtn>button:hover {/*color switch*/}
.bigBtn>a:hover::before, .bigBtn>button:hover::before,.smallBtn>a:hover::before, .smallBtn>button:hover::before {top: .85em;font-size: 1.5em;}
.bigBtn>a, .bigBtn>button {font-size:1.8em;}
.smallBtn>a, .smallBtn>button {}
.bigBtn>a.bigBtn_error, .smallBtn>a.bigBtn_error {display:block;background-color:var(--warnRed);/*background-image:url(https://app-ins.de/svg/menu_deeper.svg?s=100&c=hfff);*/color:#fff;margin:0 0 1em;}
.bigBtn>a.bigBtn_error span, .smallBtn>a.bigBtn_error span{display:block;font-size:.9rem;line-height:1.2rem}
.bigBtn>a.bigBtn_error strong,.smallBtn>a.bigBtn_error strong{font-weight:bold}/*
#showsums .bigBtn {padding:2em 0 1em;text-align:right}
#showsums .bigBtn>a,#showsums .bigBtn>button {border:0;background:var(--bg1) url(https://app-ins.de/svg/menu_deeper.svg?s=100&c=h000) .3em 50% no-repeat;background-size:auto 1.3em;font-size:1.8em;padding:.4em .6em .4em 1.6em;text-decoration:none;color:var(--bg1f)}
#showsums .bigBtn>a.bigBtn_error {display:block;background-color:var(--warnRed);background-image:url(https://app-ins.de/svg/menu_deeper.svg?s=100&c=hfff);color:#fff;margin:0 0 1em;}
#showsums .bigBtn>a.bigBtn_error span{display:block;font-size:.9rem;line-height:1.2rem}
#showsums .bigBtn>a.bigBtn_error strong{font-weight:bold}*/


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #999;font-style:italic;
	opacity: 1; /* Firefox */
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #999;font-style:italic;
}
::-moz-placeholder { /* Firefox 19+ */
	color: #999;font-style:italic;
}
:-moz-placeholder { /* Firefox 18- */
	color: #999;font-style:italic;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #999;font-style:italic;
}
::-ms-input-placeholder { /* Microsoft Edge */
	color: #999;font-style:italic;
}

.masterinputs {display:flex;flex-direction: column;align-items: center;}
.masterinputs input:not([type=hidden]) {margin:.5em auto;width:80%;font-size:1.3em}


sup {font-size:.7em;color:gray}

.onlypicker{vertical-align:bottom;border:0;border:none;background:none}
.onlypicker::datetime-edit { display:none }
.onlypicker::-webkit-datetime-edit { display:none }
.onlypicker::calendar-picker-indicator { margin:0 }
.onlypicker::-webkit-calendar-picker-indicator { margin:0;}

.waiter{background: gray; color: var(--ptCol);padding:.5em;text-align:center}

.curBtn,.ptBtn{cursor:pointer}
.curInfo, .smallInfoOpener{cursor:help}
.smallInfoOpener {font-size:12px;opacity:.4;font-style:italic}


.hovergrow-master {}
.hovergrow-master .hovergrow-bg {background:50% 50% no-repeat;transition:background .2s;}
.hovergrow-master .hovergrow-bg-g2s {background-color:#fff}
.hovergrow-master:hover .hovergrow-bg-g2s {Xbackground-color:#eee}
.hovergrow-master .hovergrow-bg-h90 {background-size:auto 90%;}
.hovergrow-master:hover .hovergrow-bg-h90 {background-color:#fff;background-size:auto 99%}
.hovergrow-master .hovergrow-bg-w90 {background-size:90% auto;}
.hovergrow-master:hover .hovergrow-bg-w90 {background-color:#fff;background-size:99% auto}



.saCard {margin:2em auto;max-width:900px;width:90%;background:#fff;padding:2rem}
.saCard.saHalfCard {max-width:400px;}

.saCard.saAccord {padding:0}
.saAccord>input{ display:none}
.saAccord>label{ font-weight:bold;font-size:1.1em;display:block;padding:2rem}
.saAccord>label>i{transition:transform .2s}
.saAccord>input:checked ~ label{padding-bottom:1rem}
.saAccord>input:checked ~ label>i{transform:rotate(90deg)}
.saAccord>input ~ .saAccord-body{height:0px;overflow:hidden;transition:height .2s}
.saAccord>input:checked ~ .saAccord-body{height:300px;height:auto;overflow:auto;padding:0 2rem 2rem}



.tooltip {position: relative;display: inline-block;}
	.tooltip .tooltiptext {
		font-size:.9rem;
		visibility: hidden;
		width: 140px;
		background-color: #555;
		color: #fff;
		text-align: center;
		padding: 5px;
		position: absolute;
		z-index: 10;
		bottom: 110%;
		left: 50%;
		margin-left: -75px;
		opacity: 0;
		transition: opacity 0.3s;
		text-wrap: balance;
	}
	.rnd_a .tooltip .tooltiptext{border-radius: 6px;}
	.tooltip .tooltiptext::after {
		content: "";
		position: absolute;
		top: 100%;
		left: 50%;
		margin-left: -5px;
		border-width: 5px;
		border-style: solid;
		border-color: #555 transparent transparent transparent;
	}
	.tooltip:hover .tooltiptext {
		visibility: visible;
		opacity: 1;
	}


.showChildsOnHover .hoverchild {display:none}
.showChildsOnHover:hover .hoverchild {display:revert}














.respTable {margin:1em 0}
.respTable .rtH {background:var(--bg1);color:#000}
.respTable .rtH .rtC {text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.respTable .rtB>.rtR {background:#f0f0f0;color:#333}
.respTable .rtB .rtR:not(.nohov):hover {background:var(--bg1Light);color:var(--bg1LightF);}
.respTable .rtB .rtR:not(.nohov):hover .onclick:hover {cursor:help;background:rgba(0,0,0,.1);}
.respTable .rtR {padding:.2em;margin-top:2px;position:relative;width:100%;}
.respTable .rtR.disabled {opacity:.4}
.respTable .rtC {padding:0 .2em;}

.respTable .rtC .respTable {font-size:.95em}

.respTable .rtC>.fit {width:100%}
.respTable .rtH:after,.respTable .rtR:after {content:"";clear:both;display:block}
.respTable .l form button {width:1em;margin:0 .2em}

.respTable .r input, .respTable .r textarea {border:0;border-bottom:1px solid #ccc;padding:1px 3px}

@media only screen and (min-width:1000px){
	.respTable .rtR>.rtC, .respTable .rtR>form>.rtC, .respTable .rtR>.rtColGrp>.rtC, .respTable .rtR>.rtColGrp>form>.rtC{float:left}
	.respTable .rtC>.rtT {display:none}
	.respTable .l {position:relative;width:3%}
	.respTable .r {position:relative;width:97%}
}
@media only screen and (max-width:999px){
	.respTable .rtH {display:none}
	.respTable .rtC>.rtT {display:block;text-align:left;font-size:.9em;color:var(--bg1);}
	.respTable .rtR {margin-top:1em}
	.respTable .l {float:right;width:3em}
	.respTable .r {}
	.respTable .r input,.respTable .r textarea {width:calc(100% - 10px)}
}

.respTable .rtC select {border:0;font-size:.9em}
.respTable .rtC input {border:0;font-size:.9em;padding:0 3px}
.rnd_a .respTable .rtC select, .rnd_a .respTable .rtC input, .rnd_a .rnd_inplike_4 {border-radius:4px;}


.respTable .ptOpen_contMenu {padding:5px 8px;cursor:pointer}
.respTable .ptOpen_contMenu.open {color:#000}
.respTable .contMenu {position:absolute;right:0;z-index:9;background:#fff;list-style:none;border:2px solid var(--bg1);}
.respTable .contMenu:before {content:"";position:absolute;right:2px;border:5px solid transparent;border-top:0;border-bottom-color:var(--bg1);top:-6px}
.respTable .contMenu li {font-size:.9em;margin:0;padding:4px;cursor:pointer;white-space:nowrap;}
.respTable .contMenu li:hover {background:rgba(0,0,0,.1)}



/* beidseitig möglichst gleich */
.choosablesgrpw:has(.k) {display:flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 0.5em;
	padding-bottom: 0.5em;}
.choosablesgrp {width:fit-content;display:flex;align-items:flex-start}
.choosablesgrp:not(.view) {cursor:pointer}
.choosablesgrp>div.k {padding:.2em .5em}
.choosablesgrp>div.v {min-width:12ch;padding:.2em 1.5em .2em .5em;text-align:left;background:#fff;color:#000}
.cont_cart .choosablesgrp>div {width: min-content;}
.choosablesgrp:not(.view):has(>div.v):after {position:absolute;
	right: 0.5em;
	content: "";
	border: 2px solid transparent;
	border-top-color: #000;
	border-right-color: #000;
	width: 0.2em;
	height: 0.2em;
	transform: rotate(135deg);
	top: 0.7em;}
.choosablesgrp>div .ap {opacity:.6}
.choosablesgrpw .v span {text-wrap:nowrap;}

#co_cart .choosablesgrpw-view{font-size:.9em}
#co_cart .choosablesgrp>div.k{padding:0 .5em 0 0}
#co_cart .choosablesgrp>div.v{padding:0}

.C-prc.exprc {
display:inline-block
}
.C-prc.exprc:before {
	background: tomato;
	content: "";
	height: 2px;
	width: calc(100% + 1em);
	display: block;
	transform: rotate(-12deg) translate(-0.65em, 0.8em);
	transform-origin: center;
}
.C-prc.exprc:after {
	display: block;
	content: attr(data-prcub) attr(data-actprc) attr(data-prcu);
	color: green;
}
.C-prc.exprc.exprc-chngd {color:gray}
.C-prc.exprc.exprc-chngd:after {
	display: block;
	content: 'Seite neu laden';
	color: tomato;
	font-style:italic;
	font-weight:100;
	font-size: .7em;
}
.C-prc.exprc.inlabel {color: black;
	width: 7ch;
	display: inline-block;
	text-align: right;
}

#ptbOverlay .lists2choose {}
#ptbOverlay .cglwo{width:100%;}
#ptbOverlay .cglwo>div{overflow:auto;width:100%;}
/* visual hint of hor scrolling */
#ptbOverlay .cglwo:before,#ptbOverlay .cglwo:after{display:block;content:"";width:2em;position:absolute;z-index:1;top:0;bottom:0;margin:1px;}
#ptbOverlay .cglwo:before{background:linear-gradient(90deg, #fff 0, #fff 30%, transparent);left:0}
#ptbOverlay .cglwo:after{background:linear-gradient(270deg, #fff 0, #fff 30%, transparent);right:0}
#ptbOverlay .cglwo.A-scrollB:before, #ptbOverlay .cglwo.A-scrollE:after{display:none}
#ptbOverlay .cglwi{display:flex;gap:2px;}
#ptbOverlay .clw{border:1px solid #e5e5e5;padding:2px;min-width:160px;min-height:min(20vh, 200px);max-height: min(40vh,380px);overflow:auto}
#ptbOverlay .clw>div{font-weight:bold;color:var(--bg1)}
#ptbOverlay .clw>*{padding:.4em .7em;}
#ptbOverlay .clvw{background:#fff5de;display:flex;justify-content:space-between;align-items:center;margin-top:2px;}
#ptbOverlay .clvw:has(:checked){background:var(--bg1);color:var(--bg1f);font-weight:bold}
#ptbOverlay .clvw input{display:none;visibility:hidden}
#ptbOverlay .clvw i{font-size:.8em;display.inline-block;margin:.1em .5em .1em 0}
#ptbOverlay .clvw:has(:checked) i.off, #ptbOverlay .clvw:not(:has(:checked)) i.on {display:none}
#ptbOverlay .clvw .ap{font-size:.75em;margin-left: 0.5em;}
#ptbOverlay .clvw .tdd{display:none}








.textlabels{display:flex;gap:.5em;margin:.3em 0}
.textlabels>label{text-align:center;max-width:50%;cursor:pointer}
.textlabels>label input{display:none;visibility:hidden}
.textlabels>label input~div, .textlabels>label .item{color:#444;border-radius:2px;font-size:.9em;padding:.4em;height:100%;transition:color .2s, background .2s}
.textlabels>label:hover input~div, .textlabels>label:hover .item{}
.textlabels>label input~div:not(.noborder),.textlabels>label input~div:not(.noborder) .borderhere, .textlabels>label .item:not(.noborder), .textlabels>label .item:not(.noborder) .borderhere{border:1px solid;transition:color .2s}
.textlabels>label:hover input~div:not(.noborder),.textlabels>label:hover input~div:not(.noborder) .borderhere, .textlabels>label:hover .item:not(.noborder), .textlabels>label:hover .item:not(.noborder) .borderhere{color:var(--hlcol)/*hovercolor, dann besser auch text-farbe - bei gelb ggf doof !?*/;background:rgba(var(--hlcolrgb), 0.2); /*neuerdings geht auch "color-mix(in srgb, var(--hlcol), transparent 20%);" so dass rgb nicht mehr nötig sit... */}
.textlabels>label input~div p{margin:0;padding:.3em 0}
.textlabels>label input~div .on, .textlabels>label input:checked~div .off{display:none}
.textlabels>label input:checked~div{color:var(--bg1)}
.textlabels>label input~div .off, .textlabels>label input:checked~div .on{display:inline-block}
.textlabels>label {}
	/* infos groß */
	.showSelfGiftInfo {display:none;visibility:hidden}
	.showSelfGiftInfo~form .option2c .detailinfo {display:none;transition:all .2s;margin-top:1em}
	.showSelfGiftInfo:checked~form .option2c .detailinfo {display:block}
	.showSelfGiftInfo:checked~form .textlabels>label input:checked~div {color:var(--bg1f);background:var(--bg1)}

/* OnOff far Away: die Radio-input stehen in einer Form zusammen, die labels aber viel Später (ggf innerhalb anderer <form>tags. Das ist mit CSS allein nicht möglich. also per JS */
form.oofa input{display:none;visibility:hidden}
label.oofa .on{color:var(--bg1)}
label.oofa .off{color:#c7c7c7 /* muss zu row-bg (.passTableRow) passen */}



.tozoom{cursor:zoom-in;}
.tozoom:not(.zoomed)::before{content:"Zoom";position:absolute;top:0;left:0;right:0;bottom:0;text-align:center;line-height:70px;color:#ffffff;font-weight:bold;font-size:22px;z-index:3;transition:opacity .2s;opacity:0}
.tozoom:not(.zoomed):hover::before{opacity:1}
.zoomed{cursor:zoom-out;position:fixed;z-index:20000;top:0;left:0;right:0;bottom:0;background:#000000aa;width:100%!important;height:100%;}
.zoomed img{transition:all .2s;width:auto!important;max-width:96vw;max-height:calc(100vh - 4vw);display:block;margin:2vw auto!important}
