* {
  margin: 0;
  padding: 0;
}
#myCookie {
	position: fixed;
	top: 0px;
	width: 100%;
	left: 0px;
	background-color: rgba(0,0,0,0.5);
	color: white;
	z-index:19999;
}
.myNewsURLEmail {
	width: 50px;
	display: inline-block;
}
#myCookie button {
	padding: 5px;
	margin: 5px;
	float: right;
}
#myCookie div {
	margin: 5px;
}
ul {
	padding-left: 20px;
}	
select:invalid { color: gray; }
.myComment {
	padding-bottom: 20px;
}
.myFile_download {
display:block;
padding-bottom:15px;
}
.myCalendar {
	width:100%;
}
.myCalendar .after, .myCalendar .before {
	color: silver;
}
.myViewElement, .myForm_Buttons {
	text-align: left;
}
.myComment div {
	font-size: 0.75em;
	font-style:italic;
}
.myGallery img {
	padding-left: 6px;
	padding-right: 6px;
}
#direct .myView {
	margin-bottom: 0px;
}
#direct .myForm_Buttons {
	padding-top: 0px;
}

.myTableMove {
	display: none;
}

img {
	border: 0px;
}

.myLB img {
	max-width: 100vw;
	max-height: 100vh;
}

.myNewsPages {
 text-align: center;
}

#myLB .bg, #myLB .front {
	display: table; 
	z-index:9999; 
	position:fixed;
	top:0px; 
	width:100%;
	height:100vh;
	left:0px; 
	right:0px; 
	bottom:0px;
}

#myLB .bg {
	background:black; 
	opacity: 0.85; 
}
 
#myLB_info {
	position:fixed;
	top:50vh; 
	z-index:9999; 
	color: white;
	left:50vw; 
	font-size: 50pt;
	text-shadow: 0 0 12px black;
}

hr {
	border: 0px; /* Für Firefox und Opera */
	border-bottom: transparent;
	border-top: 1px solid black;
}
.myViewHelp {
	font-size: 0.7em;
}
.myIL {
	-width: 80%;
}
.myView {
	width: 100%;
}
.myList tr td:first-child {
        white-space: nowrap;
	vertical-align: top;
	padding: 3px 3px 3px 0px; 
}
.myViewTH {
	width: 150px;
	padding-bottom: 10px;
	padding-top: 10px;
	padding-right: 5px;
	text-align: right;
}
.myView textarea {
	height: 200px;
}
.myForm_Buttons {
	padding: 12px;
	padding-left: 155px;
}
.myForm_Buttons button {
	padding: 5px 10px 5px 10px;
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-top: 5px;
}
form {
	display: inline;
}

.hint {
	padding: 20px;
	font-weight: bold;
	margin: 20px;
}
.hint_error {
	color: red;
	background-color: #FFEEEE;
	border: 1px solid red;
}
.hint_warning {
	color: orange;
	background-color: #FFEEEE;
	border: 1px solid orange;
}
.hint_okay {
	color: green;
	background-color: #EEFFEE;
	border: 1px solid green;
}
.myViewTitle {
	font-size: 1.25em;
	text-align: left;
	font-weight: bold;
}
.myImage_left {
	float: left;
	margin: 10px 10px 10px 0px;
}
.myImage_right {
	float: right;
	margin: 10px 0px 10px 10px;
}

.myTabControl ul {
	list-style:none;
	font-weight:bold;
	margin-bottom:10px;
	padding: 0px;
	margin: 0px;
	/* Clear floats */
	float:left;
	width:100%;
	/* Bring the nav above everything else--uncomment if needed.
	position:relative;
	z-index:5;
	*/
}
.myTabControl li {
	float:left;
	margin-right:10px;
	position:relative;
        display:block;
}
.myTabActive a, .myTabInactive a, .myTabHead a {
	display:inline-block;
	height:15px;
	    padding: 4px;
	text-decoration:none;
}
.myTabControl a:hover{
	
	/*text-decoration:underline;*/
}
.myTabControl a img {
	vertical-align: middle;
}
.mySelfWrite {
  width: 40%;
}


/*--- *** MENU *** ---*/
.myNavLine ul, .myNavList ul {
	list-style:none;
	font-weight:bold;
	margin-bottom:10px;
	padding: 0px;
	margin: 0px;
	/* Clear floats */
	float:left;
	width:100%;
	/* Bring the nav above everything else--uncomment if needed.
	position:relative;
	z-index:5;
	*/
}
.myNavLine li{
	float:left;
	margin-right:10px;
	position:relative;
}
.myNavList li{
	position:relative;
}
.myNavLine a, .myNavList a{
	display:block;
	padding:5px;
	text-decoration:none;
}
.myNavLine a:hover, .myNavList a:hover{
	text-decoration:none;
	/*text-decoration:underline;*/
}
.myNavLine a img, .myNavList a img {
	vertical-align: middle;
}

/*--- DROPDOWN ---*/
.myNavLine ul ul, .myNavList ul ul {
	background:#fff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
.myNavLine ul ul li, .myNavList ul ul li {
	padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
.myNavLine ul ul a, .myNavList ul ul a {
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
.myNavLine li:hover ul, .myNavList li:hover ul { /* Display the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
}
.myNavLine li:hover ul a, .myNavList li:hover ul a { /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
}
.myNavLine li:hover ul li a:hover, .myNavList li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	/*background:#333;*/
}

.myTB {
	padding: 3px 10px 3px 10px;
	white-space: nowrap;
	cursor: pointer; 
}

.myMiniCalendar .disabled {
  color: transparent;
}

.myPriceOld {
	text-decoration: line-through;
	font-size: 0.75em;
}
.myPriceSpecial {
	color: red;
}

.myCartMini .buttons button {
	padding: 5px 10px 5px 10px;
}
.myCartMini .item {
	padding-top: 10px;
	clear: both;
}
.myCartMini .image{
	float: left; 
	padding-right: 5px;
}
.myCartMini .text {
	text-align: left;
}
.myCartMini .price {
	text-align: right;
}
.myCartMini {
	font-size: 8pt;
}
.myCartMini .sum {
	padding-top: 10px;
	text-align: right;
	font-weight: bold;
}

.myArticleBox {
	margin: 10px;
	width: 178px;
	height: 220px;
	float: left;
	background-color: white;
}
.myArticleBox th {
	padding: 5px;
	text-align: center;
	font-size: 10pt;
}
.myArticleBox .image {
	text-align: center;
}
.myArticleBox .image img{
	width: 178px;
}
.myArticleBox .price {
	text-align: center;
	font-size: 15pt;
}

.myArticleItem .images {
	float: right;
	width: 360px;
}
.myArticleItem .ima2ges {
	float: right;
	padding: 10px;
}
.myArticleItem .images .main{
	width: 360px;
}
.myArticleItem .price {
	font-size: 2em;
	float: left;
}
.myArticleItem .price_info {
	font-size: 0.4em;
}
.myArticleItem .cart {
	width: 250px;
	padding-top: 30px;
	float: right;
}
.myArticleItem .myViewTH {
	width: 100px;
}
.myArticleItem .myForm_Buttons {
	padding: 0px;
}
.myArticleItem .myForm_Buttons button {
	margin: 0px;
}

.myArticleLine .image {
	width: 155px;
	text-align: left;
}
.myArticleLine .image img{
	width: 150px;
}
.myArticleLine th {
	text-align: left;
}
.myArticleLine .price {
	width: 200px;
	text-align: right;
	font-size: 2em;
}

.myCart .amount {
	text-align: center;
}
.myCart .price {
	text-align: right;
}
.myCart .tax {
	text-align: center;
}
.myCart .text {
	font-size: 9pt;
}
.myCart .sum {
	text-align: right;
}

.myViewLabel {
  font-weight: normal;
  flex: 0 0 auto;  
   
 }
.myViewLine {
  padding-top: 7px;
  padding-bottom: 7px;
  display: flex;
  width: 100%;
  --flex-direction: column;
  --flex-wrap: wrap;
}
.myViewHead {
  padding-top: 7px;
  padding-bottom: 7px;
  --flex-direction: column;
  --flex-wrap: wrap;
  font-weight: bold;
  font-size: 1.25em;
}
  .myIL {
    width: 98%;
}
.myViewElement {
        --width: 90%;
       --float: left;
       --display: block;
       flex:1 1 auto;
  }
  .myViewUnit {
	padding-left: 5px;
  }
  .myViewHelp {
font-weight: normal;
}
.myError {
color: red;
font-weight: bold;
}

button {
   border-radius: 3px;
    -webkit-box-shadow: none;
    box-shadow: none;
    
    background-color: rgb(220,220,220);
    border: 1px solid rgb(77,135,198);
}
button[type=submit], .myButtonSubmit  {
	background-color: rgb(77,135,198);
	border: 1px solid transparent;
	color: white;
}

@media only screen and (min-width: 801px) {
.myViewLine {
  -padding-top: 15px;
  --clear: both;
}
.myViewHead {
  padding-left: 160px;
}
.myViewLabel {
       width: 155px;
       text-align: right;
       padding-right: 5px;       
  }
  
  .myViewUnit {
	padding-right: 40px;
  }
  .myError {
padding-left: 0px;
}

  
}

@media only screen and (max-width: 800px) {
.myViewLine {
 flex-wrap: wrap;
}
.notMobile {
	display: none;
}
.myForm_Buttons {
  padding: 10px;
  padding-left: 10px;
}

.myIL {
	-width: 90%;
	font-size: 14pt;
}

select, .myFilterInput {
	font-size: 10pt;
}

.myForm_Buttons button {
  font-size: 18pt;
}


.myViewHelp {
display: inline;
padding-left: 5px;
}
   .myViewUnit {
	padding-right: 5px;
  }
   .myViewLabel {
    --flex-wrap: wrap;
    width: 100%;
    --display: block;
   }

}
.myNoSPAM {
	display:none;
}