@charset "UTF-8";
:root {
  --box-shadow: 0.3em 0.3em 0.3em 0.3em rgba(0,0,0,0.7);
	--box-shadow-medien: 0.3em 0.3em 0.2em 0.2em rgba(0,0,0,0.7);

  --background-color-1: #ececec;
	--background-color-2: #e9e9e9;
  --background-color-3: #e8e8e8;
  --background-color-4: #e7e7e7;
}
.underline {text-decoration: underline;} 

.basis-button {
	width: auto;
	cursor:pointer;
	background-color:lightgray;
	white-space:nowrap;
  padding:.15em;
  border: .15em white solid;
  border-style: outset;
  box-shadow: 0.1em 0.1em 0.1em 0.1em rgba(0,0,0,0.7);	
}
.basis-button:hover, .basis-button-small:hover {box-shadow: 0.2em 0.2em 0.2em 0.2em rgba(0,0,0,0.7);background-color:#ececec;}
@media (hover: hover) {.basis-button:hover, .basis-button-small:hover {box-shadow: 0.2em 0.2em 0.2em 0.2em rgba(0,0,0,0.7);background-color:#ececec;}}

.basis-button-small {
	font-size:.7rem;
	width: auto;
	cursor:pointer;
	background-color:lightgray;
	white-space:nowrap;
  padding: 0 .14em 0 .14em;
  border: .15em white solid;
  border-style: outset;
  box-shadow: 0.1em 0.1em 0.1em 0.1em rgba(0,0,0,0.7);	
}

.default-button-small {font-size:.7rem;}


/* Ein Block mit display:contents wird mitsamt seinen Eigenschaften völlig außer Acht gelassen,
   so als wären sein öffnendes und schließendes HTML-Tag gar nicht vorhanden.
	 Das Element wird sozusagen unsichtbar im Layout. Seine Kinder bleiben unangetastet und verhalten sich,
	 als säßen sie direkt im übergeordneten Container.*/
.mobile-block {display:contents;}
/*
.title-1-0 {font-size:1rem;}
.shadow01 {box-shadow: .3em .3em .45em black;}
.shadow02 {box-shadow: .3em .3em .45em black;border:0.1em lightgray inset;}
.lg-rc-shadow {background: lightgray;box-shadow: .3em .3em .45em black;border-radius: 6%;}
.small-text {font-size:0.8rem;}
.small-text-inside * {font-size:0.8rem;}
.larger-text {font-size:1.1rem;}
.select-small-text {font-size:.8rem;}
.select-small-text option {font-size:.8rem;} 

.unset-padding {padding: unset;}
*/
/* input.caret-color-red{caret-color: red;}  Cursor Farbe wird im Input feld auf rot geändert */
/* textarea.caret-color-red{caret-color: red;}  Cursor Farbe wird im Input feld auf rot geändert */


.no-margin  			{margin:unset!important;}
.no-margin-top  	{margin-top:unset!important;}
.no-margin-right  {margin-right:unset!important;}
.no-margin-bottom {margin-bottom:unset!important;}
.no-margin-left  	{margin-left:unset!important;}

.margin-l-auto {margin-left:auto;}
.margin-r-auto {margin-right:auto;}
.margin-t-auto {margin-top:auto;}
.margin-b-auto {margin-bottom:auto;}

.margin-a-1 {margin:1em}
.margin-l-1 {margin-left:1em;}
.margin-b-1 {margin-bottom:1em;}
.margin-r-1 {margin-right:1em;}
.margin-t-1 {margin-top:1em;} 

.margin-a-05 {margin:.5em}
.margin-l-05 {margin-left:.5em;}
.margin-b-05 {margin-bottom:.5em;}
.margin-r-05 {margin-right:.5em;}
.margin-t-05 {margin-top:.5em;}

.margin-a-04 {margin:.4em}
.margin-l-04 {margin-left:.4em;}
.margin-b-04 {margin-bottom:.4em;}
.margin-r-04 {margin-right:.4em;}
.margin-t-04 {margin-top:.4em;} 
  
.margin-a-03 {margin:.3em}
.margin-l-03 {margin-left:.3em;}
.margin-b-03 {margin-bottom:.3em;}
.margin-r-03 {margin-right:.3em;}
.margin-t-03 {margin-top:.3em;}
  
.margin-a-02 {margin:.2em}
.margin-l-02 {margin-left:.2em;}
.margin-b-02 {margin-bottom:.2em;}
.margin-r-02 {margin-right:.2em;}
.margin-t-02 {margin-top:.2em;}

.no-padding  			{padding:unset!important;}
.no-padding-top  	{padding-top:unset!important;}
.no-padding-right  {padding-right:unset!important;}
.no-padding-bottom {padding-bottom:unset!important;}
.no-padding-left  	{padding-left:unset!important;}

.padding-l-1-5 {padding-left:1.5em;}

.padding-a-1 {padding:1em}
.padding-l-1 {padding-left:1em;}
.padding-b-1 {padding-bottom:1em;}
.padding-r-1 {padding-right:1em;}
.padding-t-1 {padding-top:1em;} 

.padding-a-05 {padding:.5em}
.padding-l-05 {padding-left:.5em;}
.padding-b-05 {padding-bottom:.5em;}
.padding-r-05 {padding-right:.5em;}
.padding-t-05 {padding-top:.5em;}

.padding-a-04 {padding:.4em}
.padding-l-04 {padding-left:.4em;}
.padding-b-04 {padding-bottom:.4em;}
.padding-r-04 {padding-right:.4em;}
.padding-t-04 {padding-top:.4em;} 
  
.padding-a-03 {padding:.3em}
.padding-l-03 {padding-left:.3em;}
.padding-b-03 {padding-bottom:.3em;}
.padding-r-03 {padding-right:.3em;}
.padding-t-03 {padding-top:.3em;}
  
.padding-a-02 {padding:.2em}
.padding-l-02 {padding-left:.2em;}
.padding-b-02 {padding-bottom:.2em;}
.padding-r-02 {padding-right:.2em;}
.padding-t-02 {padding-top:.2em;}  

.line-height-1-5 {line-height:1.5;}

.info-text {font-size:smaller;}
.nowrap {white-space:nowrap;}

.cursor-default {cursor:default;}
.cursor-pointer {cursor:pointer;}
.zoom-wheel-pointer {cursor:n-resize;}

.text-blue {color:blue;}
.text-red {color:red;}
.text-black {color:black;}
.text-white {color:white;}
.text-darkred {color:darkred;}
.text-green {color:green;}
.text-yellow {color:yellow;}

.text-center {text-align:center;}
.text-left {text-align:left;}
.text-right {text-align:right;}
.vertical-align-top {vertical-align: top;}
.vertical-align-middle {vertical-align: middle;}

.background-green {background-color:green;}
.background-white {background-color:white;}
.background-yellow {background-color:yellow;}
.background-red {background-color:red;}
.background-lightgray {background-color:lightgray;}
.background-beige {background-color:beige;}
.background-darkgray {background-color: darkgray}

.bold {font-weight:bold;}
.font-normal {font-weight: normal;} 
 
.icon-button {cursor:pointer;}
.icon-button > img {height:.8em;vertical-align:baseline;border:none;}
.icon-button.height-1 > img {height:1em;}
.icon-button.height-1-2 > img {height:1.2em;}
.icon-button {border:none;background-color:transparent;}
.icon-button:hover {border:none;background-color:transparent;transform: scale(1.3);}
.icon-speissewert {height:2.5em;width:2.5em;object-fit:scale-down;}
.icon-email img {height:1em;cursor:pointer;}

.border-black {border:0.2em black solid!important;}
.border-red {border:0.2em red solid!important;}
.border-green {border:0.2em green solid!important;}
.border-blue {border:0.2em blue solid!important;}
.border-gray {border:0.2em gray solid!important;}
.border-yellow {border:0.2em yellow solid!important;}
.border-pink {border:0.2em pink solid!important;}
.border-white {border:0.2em white solid!important;}

.border-buttom-none {border-bottom:none!important;}
.border-top-none {border-top:none!important;}
.border-left-none {border-left:none!important;} 
.border-right-none {border-right:none!important;}   


.display-none {display:none!important}
.nowrap {white-space:nowrap;}
.nonedispl {display:none;}

.float-left {float:left;}
.float-right {float:right;}


.zoom-200 img:hover {transform: scale(2);}
.zoom-300 img:hover {transform: scale(3);}
.zoom-400 img:hover {transform: scale(4);}

.secure-block {display:block;}
.secure-block img {
	height:1.5em;
	vertical-align: middle;
}
.secure-block input {
	width:6em!important;
	vertical-align: middle;
	margin-right:1em;
}

/*-------------------------------------------------------------------------------------------*/ 
/* Keine Maus und kein Touchscreen                                                  				 */
/*-------------------------------------------------------------------------------------------*/ 
@media (pointer: coarse) {}
/*-------------------------------------------------------------------------------------------*/ 
/* Mit Touchscreen ohne Maus                                                        				 */
/*-------------------------------------------------------------------------------------------*/ 
@media  (pointer: none) {}
/*-------------------------------------------------------------------------------------------*/ 
/* Mit Maus                                                                         				 */
/*-------------------------------------------------------------------------------------------*/ 
@media  (pointer: fine) {}
/*-------------------------------------------------------------------------------------------*/ 
/* Grosse Aufloesung                                                                         */
/*-------------------------------------------------------------------------------------------*/ 
@media only screen and (min-width: 1025px) and (min-resolution: 200dpi) {
	* {font-size:1em!important;} 
} 
/*-------------------------------------------------------------------------------------------*/ 
/* Handy Querformat                                                                          */
/*-------------------------------------------------------------------------------------------*/ 
@media only screen and (min-width: 360px) and (max-width: 1024px) and (orientation:landscape) {
	.zoom-wheel-pointer {cursor:default;} 	
	.zoom-wheel-pointer.mobile-pointer {cursor:pointer;}
  input[type=button],input[type=submit] {margin-bottom:.2em;} 	
}
/*-------------------------------------------------------------------------------------------*/ 
/* Handy Hochformat                                                                          */
/*-------------------------------------------------------------------------------------------*/ 
@media only screen and (min-width: 150px) and (max-width: 1024px) and (orientation:portrait) {
	.mobile-text-left-important {text-align:left!important;}
	.small-text-mobile {font-size:0.8rem;}
	.small-text-inside-mobile * {font-size:0.8rem;}
	.text-mobile-left {text-align:left!important;}
	.radio-mobile-block {display:block;}
	.zoom-wheel-pointer {cursor:default;} 	
  .zoom-wheel-pointer.mobile-pointer {cursor:pointer;}
  input[type=button],input[type=submit] {margin-bottom:.2em;} 	
}