/*.......... Begin of Variablen-Definition var(--xxxx);..........*/
:root {
	/*.......... Begin of background-color ..........*/
	--bg02: #f5f5f5; /*hellgrau*/
	--bg03: #cbcbcb; /*mittelgrau*/
	--bg10: #808080; /*dunklesmittelgrau*/
   --bg04: #444444; /*dunkelgrau*/
	--bg05: #2d2d2d; /*schwarzgrau*/
	--bg01: #d9edf7; /*hellblau*/
	--bg06: #006CB5; /*mittelblau*/
	--bg07: #F71619; /*dunkelrot*/
	--bg08: #ddd;
	--bg08moz: -moz-linear-gradient(#fff, #ccc);
	--bg08webkit: -webkit-linear-gradient(#fff, #ccc);
	--bg09: #0EB101; /*mittelgrün*/
-	/*.......... End of background-color ..........*/


	/*.......... Begin of color ..........*/
	--tc03: #d9edf7; /*hellblau*/
	--tc01: #006CB5; /*mittelblau*/
	--tc08: #0000FF; /*dunkelblau*/
	--tc04: #f5f5f5; /*hellgrau*/
   --tc09: #444444; /*dunkelgrau*/
	--tc02: #333333; /*schwarzgrau*/
	--tc05: #999999; /*grau*/
	--tc06: #111111; /*schwarz*/
	--tc07: #FF0000; /*rot*/   
   
	/*.......... End of color ..........*/

	
	/*.......... Begin of box-shadows ..........*/
	--bs01: 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.2), 0 0.35rem 1,25rem 0 rgba(0, 0, 0, 0.19);
	--bs02: 0 0 9px rgba(0, 0, 0, 0.75);
	/*.......... End of box-shadows ..........*/
	
	
	/*.......... Begin of text-shadows ..........*/
	--ts01: -0.1rem -0.1rem 0.1rem #eee9ff, 0.1rem 0.1rem 0.1rem #99aacc, 0.3rem 0.2rem 0.4rem #aaaa99;
   --ts02: -0.1rem -0.1rem 0 #af9015, 0.1rem 0.1rem 0 #f8f200;
	/*.......... Begin of text-shadows ..........*/
 

	/*.......... Begin of border ..........*/
	--bo01: 0.1rem solid #dddddd; /*hellgrau*/
	--bo02: 0.1rem solid #cbcbcb; /*mittelgrau*/
	--bo03: 0.1rem solid #006CB5; /*mittelblau*/
	/*.......... Begin of text-shadows ..........*/
 }

/*.......... Beginn of Standard-Buttons ..........*/
.button01, .button02, .button03 {
   padding: 0.25rem 1.0rem; border: none; -webkit-border-radius: 0rem; -moz-border-radius: 0rem; border-radius: 0rem; vertical-align: middle; display: inline-block; cursor: pointer;
}

.button01 {background-color: var(--bg09); color: var(--tc04);}
.button01:hover {background-color: var(--bg09); color: var(--tc06);}
.button01:active {background-color: var(--bg09); color: var(--tc06);}

.button02 {background-color: var(--bg07); color: var(--tc04);}
.button02:hover {background-color: var(--bg07) ; color: var(--tc06);}
.button02:active {background-color: var(--bg07); color: var(--tc06);}

.button03 {background-color: var(--bg06); color: var(--tc04);}
.button03:hover {background-color: var(--bg06); color: var(--tc06);}
.button03:active {background-color: var(--bg06); color: var(--tc06);}
/*.......... End of Variablen-Definition ..........*/




/*.......... Beginn of Resetter ..........*/

html {
	font-size: 100%;
	font: inherit;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
}

body {
	font-family: Helvetica, Arial, sans-serif;
	color: var(--tc02);
	/*font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;*/
	/*line-height: 100%;*/
}

h1 { font-size: 2.00rem;}
h2 { font-size: 1.50rem;}
h3 { font-size: 1.17rem;}
h4 { font-size: 1.00rem;}
h5 { font-size: 0.83rem;}
h6 { font-size: 0.67rem;}
p { font-size: 1.00rem;}
th { font-size: 1.00rem;}
td { font-size: 1.00rem;}


/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: baseline;
}

*|*:link, a {
	outline: 0;
	text-decoration: none;
	font-style: normal;
	/*text-shadow: -1px -1px 1px #EEE9FF, 1px 1px 1px #99AACC, 3px 2px 5px #AAAA99;*/
}

a:hover, a:active, a:focus {
	outline: 0;
	text-decoration: none;
	font-style: normal;
}

ol, ul {
	list-style: none;
	padding-left: 0;
}

button {
	background-color: transparent;
	border: none;
	cursor: pointer;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}


label, input, textarea, select {
	width: inherit;
}




/*.......... End of Resetter ..........*/




/*.......... Beginn of Vorgabewerte-Global ..........*/
.wrapper_frontend {
}

.wrapper_backend {
	max-width: 85rem;
	margin: 0 auto;
}

.wrapper_kundenstamm {
	margin: 0 auto;
}

.grid_container_session,
.grid_container_session1,
.grid_container_session2,
.weitereartikel-global {
   max-width: 85rem;
	margin: 0 auto;
   padding: 0 1rem;
}



.pull_left {
	float: left;
	text-align: right;
}

.pull_right {
	float: right;
}

.clearfloat { /* Diese Klasse kann in einem <br />-Tag oder leeren div-Tag als letztes Element nach dem letzten fließenden div-Tag (im #container) platziert werden, wenn overflow:hidden im .container entfernt wird. */
	clear:both;
}

.ausblenden {
	display: none;
}

/*.......... End of Vorgabewerte-Global ..........*/










/*.......... Beginn of Header ..........*/
.header-global .grid_container_session {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	grid-template-areas:
	"lg tr";
}

.header-global .lg_logo {grid-area: lg;}
.header-global .tr_textblock_rechts {grid-area: tr;}

.header-global {
	background-image: linear-gradient(0deg,rgba(185,182,182,1.00) 0%,rgba(250,251,245,1.00) 99.48%);
	border-bottom: 0.2rem solid hsla(60,100%,50%,1.00);
	padding: 1rem 0 0.6rem 0;
}

.header-global .beratung {
	text-align: right;
	font-size: 1.3rem;
}

.header-global .oeffnungszeiten,
.header-global .adresse {
	text-align: right;
	font-size: 1rem;
}
/*.......... End of Header ..........*/





/*.......... Begin of Nav ..........*/
.nav-global  {
	background-color: var(--bg03);
}

.nav-global .grid_container_session {
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  grid-template-areas:
	"hm zm"
}

.nav-global .hm_hauptmenu {grid-area: hm;}
.nav-global .zm_zusatzmenu {grid-area: zm;}

.nav-global .zm_zusatzmenu {
	text-align: right;
	padding-top: 0.7rem;
}

.nav-global .hm_hauptmenu ul {
	margin-left: 2rem
}

.nav-global .hm_hauptmenu li {
	display: inline-block;
	padding-right: 1rem;
}

.nav-global .hm_hauptmenu li:last-of-type {
	padding-right: 0rem;
}

.nav-global .hm_hauptmenu a {
	font-size: 1.3rem;
}

.nav-global .zm_zusatzmenu li {
	display: inline-block;
	padding-left: 1rem;
}

.nav-global .zm_zusatzmenu button {
	font-size: 0.9rem;
	color: var(--tc01);
}

.nav-global .zm_zusatzmenu a {
	color: var(--tc01);
}

.nav-global .zm_zusatzmenu li:first-of-type {
	padding-left: 0rem;
}

.nav-global .zm_zusatzmenu a {
	font-size: 0.9rem;
}
/*.......... End of Nav ..........*/











/*.......... Begin of Breadcrump ..........*/
.breadcrumb-global .grid_container_session {
	display: grid;
	margin: 1.5rem auto 1rem ;
	grid-template-columns: auto max-content max-content max-content max-content;
	grid-template-rows: auto;
	grid-template-areas:
		"bc cg bb1 bb2 sf";
}

.breadcrumb-global .bc_breadcrumb {grid-area: bc;}
.breadcrumb-global .cg_costumergroup {grid-area: cg;}
.breadcrumb-global .bb1_backendbutton {grid-area: bb1;}
.breadcrumb-global .bb2_backendbutton {grid-area: bb2;}
.breadcrumb-global .sf_searchfield {grid-area: sf;}


.breadcrumb-global .bc_breadcrumb ul li {
	background-color: white;
	font-size: 10px;
	padding-left: 0;
	display: inline-block;
}


.breadcrumb-global .cg_costumergroup {
	margin-top: 0.2rem;
}


/* Reset Select */
.breadcrumb-global .cg_costumergroup select {
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	appearance: none;
	outline: 0;
	box-shadow: none;
	/*border: 0 !important;*/
	background-color: var(--bg06);
	/*background-image: none;*/
}
/* Custom Select */
.breadcrumb-global .cg_costumergroup .select {
	position: relative;
	display: inline-block;
	width: 12rem;
	
	/*line-height: 1;*/
	
	overflow: hidden;
}
.breadcrumb-global .cg_costumergroup select {
	width: 100%;
	height: 100%;
	text-align: center;
	margin: 0;
	padding: 0 0 0 .5em;
	color: white;
	cursor: pointer;
}
.breadcrumb-global .cg_costumergroup select::-ms-expand {
	display: none;
}
/* Arrow */
/* Transition */
.breadcrumb-global .cg_costumergroup .select:hover::after {
	color: #f39c12;
}
.breadcrumb-global .cg_costumergroup .select::after {
	-webkit-transition: .25s all ease;
	-o-transition: .25s all ease;
	transition: .25s all ease;
}




.breadcrumb-global .bb1_backendbutton {
	margin: 0.2rem 0.5rem 0 1rem;
}

.breadcrumb-global .bb1_backendbutton a,
.breadcrumb-global .bb2_backendbutton a{
	color: var(--tc02);
}


.breadcrumb-global .bb1_backendbutton a:hover,
.breadcrumb-global .bb2_backendbutton a:hover{
	color: var(--tc01);
}


.breadcrumb-global .bb2_backendbutton {
	margin: 0.3rem 1rem 0 0.25rem;
}


.breadcrumb-global .sf_searchfield {
	text-align: right;
	margin: 0.1rem 0 0 0;
}


/*.......... End of Breadcrump ..........*/





/*.......... Beginn of Footer ..........*/
.footer-global .grid_container_session {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	grid-column-gap: 2rem;
	grid-template-areas:		
		"br za un sv lu"
		"zt zt zt zt zt";
}

.footer-global .br_beratung {grid-area: br;}
.footer-global .za_zahlarten {grid-area: za;}
.footer-global .un_unternehmen {grid-area: un;}
.footer-global .sv_service {grid-area: sv;}
.footer-global .lu_likeus {grid-area: lu;}
.footer-global .zt_zusatztext {grid-area: zt;}


.footer-global .za_zahlarten .small {
	font-size: 0.7rem;
}

.footer-global {
	margin-top: 5rem;
	
}

.footer-global .footer_headline {
	font-size: 1.3rem;
}

.footer-global .footer_headline {
	margin: 0;
}

.footer-global {
	background-color: #444444;
	padding-top: 1rem;
}

.footer-global p, .footer-global li, .footer-global a, .footer-global a:hover, .footer-global a:active, .footer-global a:focus {
	color: #A2A2A2;
}

.footer-global ul {
	padding-left: 0;
}

.footer-global li {
	margin-bottom: 0.7rem;
	font-size: 0.85rem
	
}

.footer-global hr {
	margin-top: 0.7rem;
}

.footer-global a:hover {
	color: white;
}

.footer-global .zt_zusatztext {
	background-color: #2D2D2D;
   margin-top: 2rem;
	padding: 1rem 2rem 1rem 2rem;
	text-align: center;
}
.footer-global .zt_zusatztext p {
	font-size: 0.9rem;
}
/*.......... End of Footer ..........*/





/*.......... Beginn of Modal ..........*/
.myModal-global .modal-header .close:hover, .close:focus {
    color: black;
	background-color: #E9E9E9;
}

.myModal-global .modal-header .close {
	background-color: white;
	color: grey;
	width: 30px;
	height: 30px;
	font-size: 20px;
	border-radius: 15px;
	position: absolute;
	right: -8px;
	top: -8px;
	opacity: 1;
}
/*.......... End of Login-Modal ..........*/





/*@media (max-width: 479px) {
	.header-global h1 {font-size: 30px;}
	.header-global h3{font-size: 18px ;}
	.textblock-rechts {float: left !important; text-align: left;}
	.header-global .beratung {text-align: left; font-size: 18px; margin-top: 15px;}
	.header-global .oeffnungszeiten {text-align: left; font-size: 14px;}
	.header-global .adresse {text-align: left; font-size: 14px;}
	.nav-global .navbar-toggle {margin-top: 0; margin-bottom: 0;}
	.nav-global .suchfeld {display: none;}
	.nav-global .navbar-collapse {padding-left: 15px;}
	.nav-global .hauptmenu .nav > li {float: left;}
	.nav-global .hauptmenu a {font-size: 18px; color: #337ab7;}
	.nav-global .hauptmenu .dropdown-submenu:hover>.dropdown-menu {display: none;}
	.nav-global .zusatzmenu li {float: left;}
	.nav-global .zusatzmenu a {font-size: 12px;}
	.nav-global .zusatzmenu ul {background-color: #EEEEEE;}
	.artikel-global .kalkulationsergebnis {margin-top: 0;}
	.artikel-global .artikelbilder .zusatzbilder img {width: 55px;}
	.artikel-global .padlinks {padding: 0; margin-bottom: 5px;}
	.artikel-global .padrechts {padding: 0; margin-bottom: 5px;}
	.weitereartikel-global .bildergalerie img {width: 65px;}
	.weitereartikel-global .bildergalerie p {font-size: 7px;}
	.weitereartikel-global .bildergalerie  {margin-left: 8px;}
	.footer-global .footer-inner1 hr {margin-top: 0;}
   .footer-global .footer-inner1  hr {margin-bottom: 0;}
	.footer-global .footer-inner1 {margin-top: 0;}
	.myModal-global .modal-header {display: none;}
	#myModal-Login .modal-dialog  {width: 300px;}
	#myModal-Kontakt .modal-dialog  {width: 370px;}
	#myModal-Kontakt header {display: none;}
	#myModal-Kontakt .form-middle, #myModal-Kontakt .form-right {margin-top: 35px;}
	#myModal-Kontakt .footer-left {margin-bottom: 20px; text-align: right;}
	#myModal-Kontakt .plzort div:first-of-type {padding-bottom: 5px;}
	.artikelgruppe-global .header-artikelgruppe .ueberschrift {background-color: #dddddd;}
	.artikelgruppe-global .artikelblock li:nth-child(3), .artikelgruppe-global .artikelblock li:nth-child(4) {border-top: none;}
	.artikelgruppe-global .artikelblock li {width: calc(50% - 4px);}
	.artikelgruppe-global .artikelblock li:nth-child(2n) {border-right: 1px solid #dddddd;}
	.copyshopgruppe-global .header-copyshopgruppe img {max-width: none;}
	.copyshopgruppe-global .header-copyshopgruppe .ueberschrift {font-size: 20px;}
	.copyshopgruppe-global .navblock {display: none;}
	.copyshopgruppe-global .copyshopblock .box p {height: 30px;font-size: 10px;}
	.copyshopgruppe-global .copyshopblock li {width: calc(50% - 4px);}
	.ueberunsform-global .ueberunsform .team > div {margin-right: 0; float: none;}
	.ueberunsform-global .ueberunsform h1 {font-size: 30px;text-align: center; padding-bottom: 0;}
	.ueberunsform-global .ueberunsform .team p {margin-bottom: 35px;}
	.ueberunsform-global .ueberunsform .team img {margin-bottom: 0;}
}

@media (min-width: 480px)  and (max-width: 767px) {
	.header-global h1 {font-size: 30px;}
	.header-global h3{font-size: 18px ;}
	.textblock-rechts {text-align: left;}
	.header-global .beratung {font-size: 18px; margin-top: 15px;}
	.header-global .oeffnungszeiten {font-size: 14px;}
	.header-global .adresse {font-size: 14px;}
	.nav-global .navbar-toggle {margin-top: 0; margin-bottom: 0;}
	.nav-global .suchfeld {display: none;}
	.nav-global .navbar-collapse {padding-left: 15px;}
	.nav-global .hauptmenu .nav > li{float: left;}
	.nav-global .hauptmenu a {font-size: 18px; color: #337ab7;}
	.nav-global .hauptmenu .dropdown-submenu:hover>.dropdown-menu {display: none;}
	.nav-global .zusatzmenu li {float: left;}
	.nav-global .zusatzmenu a {font-size: 12px;}
	.nav-global .zusatzmenu ul {background-color: #EEEEEE;}
	.artikel-global .kalkulationsergebnis {margin-top: 0;}
	.artikel-global .artikelbilder .zusatzbilder img {width: 55px;}
	.artikel-global .padlinks {padding: 0; margin-bottom: 5px;}
	.artikel-global .padrechts {padding: 0; margin-bottom: 5px;}
	.weitereartikel-global .bildergalerie img {width: 65px;}
	.weitereartikel-global .bildergalerie p {font-size: 7px;}
	.weitereartikel-global .bildergalerie  {margin-left: 8px;}
	.footer-global .footer-inner1 hr {margin-top: 0;}
   .footer-global .footer-inner1  hr {margin-bottom: 0;}
	.footer-global .footer-inner1 {margin-top: 0;}
	.myModal-global .modal-header {display: none;}
	#myModal-Login .modal-dialog  {width: 300px;}
	#myModal-Kontakt .modal-dialog  {width: 445px;}
	#myModal-Kontakt header {display: none;}
	#myModal-Kontakt .form-middle, #myModal-Kontakt .form-right {margin-top: 35px;}
	#myModal-Kontakt .footer-left {margin-bottom: 20px; text-align: right;}
	#myModal-Kontakt .plzort div:first-of-type {padding-bottom: 5px;}
	.artikelgruppe-global .header-artikelgruppe .ueberschrift {background-color: #dddddd;}
	.artikelgruppe-global .artikelblock li:nth-child(3), .artikelgruppe-global .artikelblock li:nth-child(4) {border-top: none;}
	.artikelgruppe-global .artikelblock li {width: calc(50% - 4px);}
	.artikelgruppe-global .artikelblock li:nth-child(2n) {border-right: 1px solid #dddddd;}
	.copyshopgruppe-global .header-copyshopgruppe img {max-width: none;}
	.copyshopgruppe-global .navblock {display: none;}
	.copyshopgruppe-global .copyshopblock li {width: calc(50% - 4px);}
	.ueberunsform-global .ueberunsform .team p {margin-bottom: 35px;}
	.ueberunsform-global .ueberunsform .team > div {margin-left: 15px;}
	
}

@media (min-width: 768px) and (max-width: 991px) {
	h3 {font-size: 20px;}
	.nav-global .hauptmenu .menuebene1  li:nth-of-type(1) ul {columns: 3;}
	.nav-global  .suchfeld {display: none;}
	.artikel-global .padlinks {padding: 0; margin-bottom: 5px;}
	.artikel-global .padrechts {padding: 0; margin-bottom: 5px;}
	.artikelgruppe-global .header-artikelgruppe .ueberschrift {background-color: #dddddd;}
	#myModal-Login .modal-dialog  {width:350px;}
	#myModal-Kontakt .modal-dialog  {width: 650px;}
	#myModal-Kontakt .plzort div:first-of-type {padding-bottom: 5px;}
	.ueberunsform-global .ueberunsform .team p {margin-bottom: 35px;}
	.ueberunsform-global .ueberunsform .team > div {margin-left: 15px;}
}

@media (min-width: 992px) and (max-width: 1199px) {
	/*h3 {font-size: 22px;}*/
	.artikel-global .padlinks {padding: 0; margin-bottom: 5px;}
	.artikel-global .padrechts {padding: 0; margin-bottom: 5px;}
	.artikelgruppe-global .header-artikelgruppe {background-color: #dddddd;}
	.artikelgruppe-global .header-artikelgruppe .filter .dropdown {float: left;}
	.artikelgruppe-global .header-artikelgruppe .filter .dropdown {padding: 10px;border-left: solid 1px #F3F3F3;width: 145px;text-align: center;}
	.artikelgruppe-global .header-artikelgruppe .filter .dropdown:last-child {border-right: solid 1px #F3F3F3;}
	#myModal-Kontakt .modal-dialog  {width: 950px;}
	.ueberunsform-global .ueberunsform .team > div {margin-left: 15px;}
}	

@media (min-width: 1200px) {
	.artikel-global .padlinks {	padding: 0 5px 0 0;margin-bottom: 5px;}
	.artikel-global .padrechts {padding: 0 0 0 5px;margin-bottom: 5px;}
	.artikelgruppe-global .header-artikelgruppe {background-color: #dddddd;}
	.artikelgruppe-global .header-artikelgruppe .filter .dropdown {float: left;}
	.artikelgruppe-global .header-artikelgruppe .filter .dropdown {padding: 10px;border-left: solid 1px #F3F3F3;width: 145px;text-align: center;}
	.artikelgruppe-global .header-artikelgruppe .filter .dropdown:last-child {border-right: solid 1px #F3F3F3;}
	.copyshopgruppe-global .header-copyshopgruppe {background-color: #dddddd;}
}

*/