/* ########################################## */
/* Stylesheet-Datei für Leihladen Internet */

/* Farben Stadt Maintal
 * Maintal Logo: Rot #FF2208; Grün #00B53B; Blau: #0094FF
 * Maintal Internet: Rot: #A52D1F; Grün: #6EAD3B; Blau: #208BD0 
 */
 
/* Hier verwendet:
 * Blau #208BD0
 * Grün #6EAD3B
 * Rot  #A52D1F
 *
 * Hintergrund: #FFFDF0;
 * Menü hover helles blau: #70D0E0
 */
 
/* HTML-Elemente */

* { box-sizing: border-box; }

*  { margin-top:0px; }

html { height:100%; margin:0; padding:0; background-color:#D9D4C0; font-size:16px; } /* #FFFDF0; */
.font24 { font-size: 24px; }
.font20 { font-size: 24px; }
.font16 { font-size: 24px; }
.font14 { font-size: 24px; }
.font12 { font-size: 24px; }

body { font-family: Verdana; color:#000000; margin:0 auto; padding:0; height:100%; 
    background: #D9D4C0; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#E9E4D0, #D9D4C0); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#E9E4D0, #D9D4C0); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#E9E4D0, #D9D4C0); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#E9E4D0, #D9D4C0); /* Standard syntax */
} 
br {line-height:0.5em;}
p     { margin-top:0; margin-bottom:0.2em; padding-top:0; padding-bottom:0; }
img   { border-width:0; }
input[type=number] { width: 4em; } 

div .invisible { margin:0; padding:0; border-style:none; }

/* link */
.external {background-position:center right; background-image: url(../images/external-link-ltr-icon.png); background-repeat:no-repeat; padding-right: 13px;}

/* responsive column layout, enclose in div class 'vbrow' */

[class*="vbcol-"] {
    float: left;
    padding: 2px 2px 2px 2px;
    border: none;
}


@media only screen and (min-width:600px) {
	.vbcol-1 {width: 8.33%;}
	.vbcol-2 {width: 16.66%;}
	.vbcol-3 {width: 25%;}
	.vbcol-4 {width: 33.33%;}
	.vbcol-5 {width: 41.66%;}
	.vbcol-6 {width: 50%;}
	.vbcol-7 {width: 58.33%;}
	.vbcol-8 {width: 66.66%;}
	.vbcol-9 {width: 75%;}
	.vbcol-10 {width: 83.33%;}
	.vbcol-11 {width: 91.66%;}
	.vbcol-12 {width: 100%;}
}

.vbrow:after {
    content: "";
    clear: both;
    display: block;
}


/* hyphens */
.trennung {
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;  
}

/* Cursor */
.hrefElement { cursor:pointer; }

/* Farben */
.bg_weiss {background-color:#FFFFFF;}
.bg_standard {background-color:#FFFDF0;}

.bgmaintalrot{background-color:#A52D1F; color:white;}
.bgmaintalblau{background-color:#208BD0; color:white;}
.bgmaintalgruen{background-color:#6EAD3B; color:white;}

.maintalrot{color:#A52D1F; }
.maintalblau{color:#208BD0; }
.maintalgruen{color:#6EAD3B; }

.grau1 { background-color:#EEEEEE;}
.grau2 { background-color:#EEEDDD;}
.orange { background-color:#FF783C;}
.blau {	background-color:#666699;}


/* Schriftformatierung */
.font8 {font-family: Verdana; font-size:0.8em}
.font9 {font-family: Verdana; font-size:0.9em}
.font10 {font-family: Verdana; font-size:1em}
.font11 {font-family: Verdana; font-size:1.1em}
.font12 {font-family: Verdana; font-size:1.2em}
.font14 {font-family: Verdana; font-size:1.4em}

.font-grau {color:#666666}
.font-hellgrau {color:#999999}

h1,
.Headline { font-size: 1.8em; font-weight:bold; margin-bottom:0.2em; padding-bottom:2px; color:#208BD0; }
h2,
.Titel { font-size:1.6em; font-weight:bold; margin-top:0.5em; padding: 2px 0.5em 2px 0;}

.caption { font-size: 1.2em; font-weight:bold; margin: 0.2em 0 0.1em 0; padding: 2px 0.5em 2px 0;}
.captionOpen { background-color: #a0d0f8; background-image:url(../images/arrow_up_2.gif); background-repeat:no-repeat;  background-position:right; }
.captionClosed { background-color: #CCCCCC; background-image:url(../images/arrow_down_2.gif); background-repeat:no-repeat;  background-position:right; }
.belowCaption { padding: 0 3px 3px 3px; margin: 0 1px 1px 1px; border-top: none; border-left: solid black 1px; border-right: solid black 1px; border-bottom: solid black 1px;}

h3,
.Untertitel { font-size:1.4em; font-weight:bold; margin:0.1em 0 0.2em 0;}
h4 { font-size:1.2em; font-weight:bold; margin:0.1em 0 0.2em 0;}

.zentriert { text-align:center; }

/* Antrag */
.vorstand td {vertical-align:top;}
.vorstand p {margin-top:6px;}
.vorstand .funktion { font-weight:bold; padding-right:20px; }

.kontakt input { display:block; width:100%; font-size:1em; }
.kontakt input[id=abfrage]  { width:142px; }
.kontakt textarea { display:block; width:100%; height:4em; font-size:0.9em }
.kontakt label { display:block; font-size:0.9em; color:#666666; }
.kontakt input[type=submit]  { width:8em; min-height:1.8em; display:inline; }
.kontakt fieldset { width:100%; padding:0.8em; }

/* Katalog */
.katalog { display:block; }
.katalog .bildbereich { padding-right:2px; }
.katalog .textbereich { padding-left: 4px; }
.katalog .preisbereich { display:block; }
.katalog .Headline { font-size: 1.6em; font-weight:bold; margin-bottom:0.2em; padding-bottom:2px; color:#208BD0;  }
.katalog .Titel { font-size:1.5em; font-weight:bold; margin:0 0 0.5em 0;}
.katalog .Beschreibung { font-size:0.9em; margin:0.1em 0.2em 0.2em 12px;}
.katalog hr { height:0.1em; margin: 1em 0 1em 0; }
.katalog .artikel { font-weight: bold; font-size:1em; }

div.sterne { display:inline-block; margin:0 0 6px 0; padding:0; }
div.sterne img { padding: 0; position: relative; bottom:-8px;}

.infotext { font-family: Verdana; font-size:0.8em; margin: 2px 0 2px 0; padding: 6px 10px 8px 10px; background-color: #e8eba5; color: #666666; }

.containerwrapper { min-height:100%; padding:12px 0;}


/* großer Bildschirm */
/* ---------------------------------*/
@media screen and (min-width:856px){
	body {font-size: 1rem;}
	.contentwrapwrap { margin:0 auto; padding:0; width:100%; }
	
	.contentwrap { margin:auto; padding: 2px 0px 28px 0px; display:grid; grid-template-columns:760px 24px 236px; }
	.outercontent{ padding:4px 2px 4px 2px; grid-row:1; grid-column:1; }
	.infospacer {  grid-row:1; grid-column:2; }
	.teasersection { padding:4px 4px 4px 4px; color:#AAA; grid-row:1; grid-column:3; }
	.infosection { display:none; }
	
	.container { position:relative; min-height:100%; padding:0px 0px 0px 0px; margin:0 auto; max-width:1024px; background-color:#FFFEEF; border-radius:8px;}
	div.vbheadschrift { display: table-cell; height:100px; padding:4px 0 4px 0; vertical-align:middle; text-align:center; font-family:helvetica; font-size:54px; font-weight:800; color:#0094FF; opacity: 0.5; filter:alpha(opacity=50); text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white; }
	.inhaltsseite { max-width:760px; padding:0 14px;} 
	
	.KatalogDetail { margin: 5px; }
	.KatalogDetail > .dataGrid { background-color: #ffffff; }
	.KatalogDetail > .nvGrid { background-color: #ffbfbf; }
	.katalogDetailLabel { background-color: #c0c0c0;}
	.KatalogSliderItem {width:fit-content;}
	.KatalogSliderItem .sliderimage { height:360px; max-width: 480px; max-height: 360px; }
	.katalog img { margin:4px 6px 2px 0; border-radius: 12px;} 
	.KatalogNv { background-color: #ffbfbf; padding:0.3em; }
	.KatalogVerf { padding:0.3em }
	
	/* Grid-Design zwei Spalten: Label links, Daten rechts */
	.llGrid2Col {display:grid; grid-template-columns: auto auto; }
	.llGrid2Col > .llspan_1_2 { grid-column: 1 span 2; }
	.llGrid3Col {display:grid; grid-template-columns: auto auto auto; }
	.llGrid3Col > .llspan_1_2 { grid-column: 1 span 2; }
	.llGrid3Col > .llspan_2_3 { grid-column: 2 span 2; }
	.llGrid3Col > .llspan_1_3 { grid-column: 1 span 3; }
	/* datatables overwrite */
	.dt-search > input { width: 8em;}
	.dt-info { font-size:0.8em;}
	
	/* Content-Bereich */
	.content img { padding:6px 1px 6px 1px; }
}

/* schmaler Bildschirm z. B. handy */
@media screen and (max-width:855.99px) {
	body {font-size: 0.9rem;}
	.contentwrapwrap { margin:0 auto; padding:0; width:100%; }
	
	.contentwrap { margin:auto; padding: 2px 0px 28px 0px; display:grid; grid-template-columns:100%; }
	.outercontent{ padding:4px 2px 4px 2px; grid-row:2; grid-column:1; }
	.infospacer { display:none; }
	.teasersection { padding:1px 4px 4px 1px; grid-row:1; grid-column:1;  }
	.infosection { display:none; }
	
	div.headerFull {display:none; }
	.container { position:relative; min-height:100%; padding:0px 0px 0px 0px; margin:0 auto; max-width:644px; background-color:#FFFDF0; border-radius:8px;}
	div.vbheadschrift { display: table-cell; height:100px; padding:4px 0 4px 0; vertical-align: middle; text-align:center; font-family:helvetica; font-size:40px; font-weight:800; color:#0094FF; opacity: 0.5; filter:alpha(opacity=50); text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white; }
	.inhaltsseite { max-width:760px; padding:0 2px;} 
	h2, .caption { margin: 2px 0 2px 0;}
	/* Grid-Design statt zwei Spalten: Label oben, Daten darunter */
	.llGrid2Col {display:grid; grid-template-columns: auto; }
	.llGrid2Col > .llspan_1_2 { width:100% }
	.llGrid3Col {display:grid; grid-template-columns: auto auto auto; }
	.llGrid3Col > .llspan_1_2 { grid-column: 1 span 2; }
	.llGrid3Col > .llspan_2_3 { grid-column: 2 span 2; }
	.llGrid3Col > .llspan_1_3 { grid-column: 1 span 3; }
	.KatalogDetail { margin: 3px; }
	.KatalogDetail > .dataGrid { background-color: #ffffff; }
	.KatalogDetail > .nvGrid { background-color: #ffbfbf; }
	.katalogDetailLabel { background-color: #c0c0c0;}
	.KatalogSliderItem {width:100%; }
	.KatalogSliderItem .sliderimage { height:360px; max-width: 480px; max-height: 360px; }
	.katalog img { margin:4px 0 2px 0; border-radius: 12px;} 
	.KatalogNv { background-color: #ffbfbf; padding:2px 0 2px 0; }
	.KatalogVerf { padding:2px 0 2px 0; }
	
	/* datatables overwrite */
	.dt-info { font-size:0.8em;}
	.dt-search > input { width: 6em;}
	table.dataTable > thead > tr > th { padding: 0; }
	table.dataTable > tbody > tr > td { padding: 0; }
	div.dt-layout-cell.dt-start, div.dt-layout-cell.dt-start { padding: 2px 0 2px 0; }
	
	/* Content-Bereich */
	.content img { padding:6px 1px 6px 1px; }
	
}
/* Ende schmaler Bildschirm */
.oeffnungszeit { display:block; width:100%; text-align:center; padding:2px 6px 2px 6px; background-color:#EEE; color:#0094FF; }

.katalog select { font-size:1em; }


.footer { position:absolute; bottom:0; height:17px; 
	width:100%; padding:0; margin:0; 
}

.headertext	{ position:absolute; top:1px; right:5px; font-size:10px;
}

.header td {font-size:0.5em}
.header input{height:0.5em;}

.footertext	{ position:absolute; bottom:1px; right:5px; font-size:9px;
}

.content { margin:0 1px 1px 0; text-align:left; display:inline-block; }

/* Info- und teaser-Bereich */
.infosection a:link,
.infosection a:visited,
.infosection a:active
 { color:#999; text-decoration:underline; }

.teasersection a:link,
.teasersection a:visited,
.teasersection a:active
{ color:#999; text-decoration:underline; }

.infosection a:focus,
.infosection a:hover
{ color:#999; text-decoration:none; font-weight:bold; }

.teasersection a:focus, 
.teasersection a:hover
{ color:#999; text-decoration: none; font-weight:bold; }

.infosection h1,
.infosection headline
{ font-size: 1.6em; font-weight:bold; margin-bottom:0.2em; padding-bottom:2px; color:#999; }

.teasersection h1,
.teasersection headline
{ font-size: 1.6em; font-weight:bold; margin-bottom:0.2em; padding-bottom:2px; color:#999; }

.infosection h2,
.teasersection h2
{ font-size:1em; font-weight:bold; margin-top:0.5em; margin-bottom:0.2em; }

.infosection h3,
.teasersection h3
{ font-size:0.9em; font-weight:bold; margin:0.1em 0.2em 0.2em 0.2em;}

.infosection p,
.teasersection p
{ font-size:0.8em;}

.infosection hr
 { height:0.1em; margin: 1em 0 1em 0; }

 .teasersection hr 
 { height:0.1em; margin: 1em 0 1em 0; }

 .infosection img,
.teasersection  img
 { max-width:180px; height:auto; padding:0px; margin:0 auto; border:none; display:block; } 

 
/* Spezielle Anwendung */
img.clicksymbol { padding:0; float:none; height:1em; }
.picture_copyright { font-size:0.7em; }
.alignright { float:right; margin:0 0 14px 14px;}
.alignleft { float:left; margin:0 0 14px 14px;}
.nofloat { clear:both; }

.infotoggle { background-color:#F0F0F0; color:#404040; }

/* spacer */
.spacer {min-height: 1.2em;}
.smallspacer {min-height:0.4em;}

/* Menue */

#vbmmenu {
  font-family: Verdana, Helvetica, Arial, Sans-Serif;
  font-size: 0.9em;
  font-weight:bold;
  line-height: 1.1em;
  /* text-transform: uppercase; */
  text-align: left;
}
#vbmmenu > ul {
  width: auto;
  text-align:left;
  list-style-type: none;
  padding: 2px 10px 2px 4px;
  margin: 0;
  border-left: 0px;
  border-right: 0px;
/*  border-bottom: 3px solid #d9ced2; */
}
#vbmmenu > ul li#responsive-tab {
  display: none;
}
#vbmmenu > ul li {
  display: inline-block;
  text-align:left;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  /*display: inline;*/
  transform: scale(1);
}
#vbmmenu > ul li.right {
  float: right;
}
#vbmmenu > ul li.has-sub {
  position: relative;
}
#vbmmenu > ul li.has-sub:hover ul {
  display: block;
}
#vbmmenu > ul li.has-sub ul {
  display: none;
  width: 230px;
  position: absolute;
  margin: 0;
  padding: 0;
  list-style-type: none;
  background: #ffffff;
  border-left: 0px;
  border-right: 0px;
  border-bottom: 3px solid #d9ced2;
  border-top: 0 none;
}
#vbmmenu > ul li.has-sub ul li {
  display: block;
}
#vbmmenu > ul li.has-sub > a {
  background-image: url('../images/caret.png');
  background-repeat: no-repeat;
  background-position: 90% -95%;
}
#vbmmenu > ul li.has-sub > a.active{
  background: #208BD0 url('../images/caret.png') no-repeat; /* blau2 */
  background-position: 90% 195%;
}

#vbmmenu > ul li.has-sub > a:hover {
  background: #70D0E0 url('../images/caret.png') no-repeat; /* blau1 */
  background-position: 90% 195%;
}
#vbmmenu > ul li a {
  display: block;
  padding: 8px 24px 8px 18px;
  text-decoration: none;
  color: #747474;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  /* text-shadow: 0px 1px 0px #fff; */
}

#vbmmenu > ul li ul li a {
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
}

#vbmmenu > ul li a.active,
#vbmmenu > ul li.active {
  background: #208BD0; /* blau2 */
  color: #fff;
}

#vbmmenu > ul li a:hover {
  background: #70D0E0; /* blau1 */
  color: #fff;
  /* text-shadow: 0px 1px 1px #80D0FF; */
}
@media (max-width: 619.99px) {
  #vbmmenu > ul {
    width: 100%;
  }
  #vbmmenu > ul li#responsive-tab {
    display: none;
  }
  #vbmmenu > ul li#responsive-tab a {
/*    background: url('../images/menu.png') no-repeat; */
/*    background-position: 95% -35%; */
	  background-color:inherit;
  }
  #vbmmenu > ul li#responsive-tab a:hover {
    background-color: #70D0E0; /* blau1 */
    background-position: 95% 135%;
  }
  #vbmmenu > ul li {
    display: none;
  }
  #vbmmenu > ul li.right {
    float: none;
  }
  #vbmmenu > ul li.has-sub {
    position: relative;
  }
  #vbmmenu > ul li.has-sub ul {
    display: block;
    position: static;
    width: 100%;
    border: 0;
  }
  #vbmmenu > ul li.has-sub ul li {
    display: block !important;
  }
  #vbmmenu > ul li.has-sub ul li a span {
    display: block;
    padding-left: 24px;
  }
  #vbmmenu > ul li.has-sub > a {
    background-image: none;
  }
  
  #MenuButtonFloating { 
    background-image: url('../images/menu4.png'); 
    background-repeat: no-repeat;
    background-position: center;
  	width:50px; height:50px; 
  	position:fixed;
  	top: 40px;
  	right: 30px; 
  	z-index:101;
	background-color: #D9EDF733; 
  	border-radius: 50%;
  	border-color: lightgray;
  	border-width:thin;
  }
  
  #MenuButtonFloating:hover { 
      background-image: url('../images/menu3.png');
	  background-color: #FFE9377A; 
  }
}
/* Make sure they show even if hidden in mobile view by JS */
@media (min-width: 620px) {
  #MenuButtonFloating {
  	display:none;
  } 
	
  #vbmmenu > ul > li.collapsed {
    display: inline-block !important;
    transform: scale(1);
  }
  #vbmmenu > ul ul li.collapsed {
    display: block !important;
  }
}

/*  Menü 2. Version: Kacheln */
/*	vh 1/100th of the height of the viewport.
 *	vw 1/100th of the width of the viewport.
 */

.vbmenu2icon img { padding: 0 16px 0 16px; }

.kacheln { font-size:0.9em; }
.kachelnklein { font-size:0.7em; }
.kachelngross { font-size:1.1em; }

.vbmenu2lev1, .vbmenu2lev2, .vbmenu2lev3 {
	font-family:Verdana,Helvetica,Sans-Serif;
	font-weight:bold;
	padding-bottom:18px;
}

.vbmenu2lev1 ul, .vbmenu2lev2 ul, .vbmenu2lev3 ul {
	margin:0; padding:0;
}

.vbmenu2lev1>ul>li {
	position:relative;
	display:block; max-width:10em; max-height:10em; width:45vw; height:45vw; float:left; 
	margin:2px; 
	background-color:#6D96CB; color:white;
	text-align:center;
}

.vbmenu2lev1>ul>li.active {
	border: 6px solid #208BD0;
	background-color:#70D0E0;
}

.vbmenu2lev1>ul>li.active:hover {
	background-color:#208BD0;
}

.vbmenu2lev1>ul>li:hover {
	background-color:#70D0E0;
}

.vbmenu2lev2>ul>li {
	position:relative;
	display:block; max-width:10em; max-height:10em; width:45vw; height:45vw; float:left; 
	margin:2px; 
	background-color:#24ABB0; color:white;
	text-align:center;
}

.vbmenu2lev2>ul>li.active {
	border: 6px solid #24ABB0;
	background-color:#70D0E0;
}

.vbmenu2lev2>ul>li.active:hover {
	background-color:#24ABB0;
}

.vbmenu2lev2>ul>li:hover {
	background-color:#70D0E0;
}

.vbmenu2lev3>ul>li {
	position:relative;
	display:block; max-width:10em; max-height:10em; width:45vw; height:45vw; float:left; 
	margin:2px; 
	background-color:#8dd6b9; color:white;
	text-align:center;
}

.vbmenu2lev1>ul>li>div, .vbmenu2lev2>ul>li>div, .vbmenu2lev3>ul>li>div  {
	margin:0;
	position:absolute;
	top:50%;
	left:50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
}

.vbmenu2lev1 > ul li div > img, .vbmenu2lev2 > ul li div > img, .vbmenu2lev3 > ul li div > img {
	display:block; margin-left:auto; margin-right:auto; margin-bottom:1em; max-height: 100px; height:4.5em;
}

.vbmenu2lev2 .headline{
	margin-bottom:2px; margin-left:2px; margin-right:2px; padding:20px; background-color:#6D96CB; color:white;
}
.vbmenu2lev3 .headline{
	margin-bottom:2px; margin-left:2px; margin-right:2px; padding:20px; background-color:#24ABB0; color:white;
}

.vbmenu2lev1:after, .vbmenu2lev2:after, .vbmenu2lev3:after {
    content: "";
    clear: both;
    display: block;
}

/* Formular-Formatierung */

form  { margin-top:0; margin-bottom:1px; padding-top:0; padding-bottom:0;  }
textarea { font-size:1em; font-family: Verdana; background-color:white; color:#000000; border:1px solid #cccccc; border-radius:3px; padding:1px 1px 1px 1px; margin:1px; font-weight:normal; }
input { font-size:1em; font-family: Verdana; background-color:white; color:#000000; border:1px solid #cccccc; border-radius:3px; padding:1px 1px 1px 1px; margin:1px; font-weight:normal; }
input[type=file] {  font-size:1em; font-family: Verdana; background-color:white; color:#000000; border:1px solid #cccccc;padding:1px 1px 1px 1px; margin:1px; font-weight:normal}
select { margin-top:2px; margin-bottom:1px; padding-top:1px; padding-bottom:1px; font-family: Verdana; background-color:#FFFFC0}
label { font-family:Verdana;color:#333; }

.password {}
.password_wrong{background-color:#FF0000;}

input[type=submit],
.button { font-size: 1.1em; font-family:Verdana; color:#000033; font-weight:bold; background-color:#FFFFC0; padding:4px 5px 4px 5px; border-bottom-color:#333333; border-right-color:#333333; border-top-color:#CCCCCC;border-left-color:#CCCCCC;margin:4px 2px; border-radius: 6px} 

.button:disabled { color: #666; background-color: #CCC; }
.smallbutton { height:0.9em; font-size: 0.7em;font-family:Verdana;color:#000033; font-weight:normal; background-color:#FFFFC0; padding:3px 5px 3px 2px; border: none; margin:0; border-radius: 3px} 

input[disabled=disabled] { color:#888888; background-color:#E8E8E8; }

.buttonDisabled { font-size: 0.9em; font-family:Verdana; color:#CCC; font-weight:bold; padding:2px 5px 2px 5px;letter-spacing:0.1em; border-bottom-color:#333333; border-right-color:#333333; border-top-color:#CCCCCC;border-left-color:#CCCCCC;margin:1px;} 

.button_back {background-color:#fff; padding:2px 0 2px 0; border-bottom-color:#333333; border-right-color:#333333; border-top-color:#CCCCCC;border-left-color:#CCCCCC;margin:1px;} 
form .readonly { background-color:#eeeeee;} /* Hintergrund für Readonly Input-Felder*/

.required{border-bottom-color:#333333;border-bottom-width:2px} /*Mussfeld-Formatierung */

/* ############################################################## */
/* TABELLEN - FORMATIERUNG */

table{ font-family: Verdana; color:#000000; empty-cells:show;border-collapse:collapse; margin:0px; padding:0px} 

.tabinfo {}
.tabinfo th {background-color:#EEEEEE;border-bottom: 2px solid #333333;padding:2px 2px 2px 1px;height:20px;font-weight:bold;color:#000000; text-align:left;}
.tabinfo td {padding:1px 1px 1px 1px;}
.tabinfo tr:nth-child(2n+1) { background-color:#EAFAFD;} 

.tabdata {}
.tabdata th {}
.tabdata td {}
.tabdata tbody tr:nth-child(2n+1) { background-color:#EAFAFD;} 

tr.rowBigger{ min-height:2em; }

.mailbox { background-color:#FFFFFF; font-family:Arial,sans-serif; font-size:0.8em; text-align:left; vertical-align:middle; } 
.mailbox table { border:none; padding:0; margin:0; }
.mailbox th { font-weight:normal; border:1px solid #888; background-color:#EEE; padding:1px 0 1px 3px; margin:0; } 
.mailbox td { border:none; padding:0 0 0 3px; margin:0; }

.mailview { background-color:#CCC; }
.mailview_header { background-color:#CCC; font-family:arial,sans-serif; font-size:0.8em; padding:1px 3px 2px 3px; margin:2px 5px 1px 5px; }
.mailview_header td { font-family:arial,sans-serif; font-size:0.8em; }
.mailview_body { background-color:#FFF; font-family:verdana,sans-serif; font-size:1em; padding:1px 3px 2px 3px; margin:2px 5px 2px 5px; border-style:solid; border-width:1px; border-color:#999 }
.mailview_body p {line-height:normal; margin:0 0 2px 0; padding:0;}


/* diverse Schrift-Formatierung */
.error_global {color:red;font-size:0.9em;font-weight:bold;}
.error_inline {color:red;height:13px;}
.error_field {background-color:#FF0000;}
.status_global {color:#003399;font-size:1em;}
.ausgabefeld  { background-color:#FFEBB2; border-bottom:1px solid; border-color:#cccccc; padding-right:3px;color:#000033;}
.copyright { 
	color:#FFFFFF;
	padding:2px 2px 2px 2px;
 }

/* Bereichs - FORMATIERUNG */

.dialog         { font-family: Verdana; font-size: 0.8em; text-align: left; background-color:#FDF9EE;padding:5px 5px 5px 5px; }

span[rel=tooltip] { border-bottom: 0.5px dotted #333; }
/* Formatierung für den jQuery-Tooltip   */
#tooltip
{
    text-align: left;
	font-size:0.9em;
    color: black;
    background: #EEE;
    position: absolute;
    z-index: 100;
    padding: 15px;
}
/* no triangle decoration here 
 
  #tooltip:after
    {
        width: 0;
        height: 0;

        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #EEE;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }
 
    #tooltip.top:after
        {
            border-top-color: transparent;
            border-bottom: 10px solid #EEE;
            top: -20px;
            bottom: auto;
        }
 
        #tooltip.left:after
        {
            left: 10px;
            margin: 0;
        }
 
        #tooltip.right:after
        {
            right: 10px;
            left: auto;
            margin: 0;
        }
*/ 

.input_tip_wrapper { display:block; }
.input_tip_label { font-size:0.8em; color:#555; padding-left:6px; }
.input_tip_label_div { display:block; width:100px; overflow:hidden; }
@media (min-width: 420px) {
	.input_tip_label_div { display:inline-block; width:110px; overflow:hidden; }
	.input_tip_label { font-size:0.9em; color:#555; padding-left:6px; }
}
.input_tip_symbol { padding:8px; vertical-align:bottom; }
.input_tip_button { padding:0 8px; vertical-align:bottom; }
.input_tip_tip { background-color:RGBA(254, 252, 222, 0.85); color:black; padding:10px; font-size:1em; }
.input_tip_abs { position: absolute; z-index: 100; }

/* .input_tip_abs:after { content: ''; width:0; height:0; border-top:none; border-left:10px solid transparent; border-right:10px solid transparent; border-bottom:10px solid #EEE; position:absolute; top:-10px; left:0; } */
.captcha_button { border-radius:5px; vertical-align:middle; padding:4px; margin-left: 8px;}		


/* Formatierung für den jQuery-Tooltip   */
#tooltip {position: absolute; width: 50em; border: 1px solid #666; background: #999; color: #FFF; padding: 10px; opacity: 0.9}
#tooltip h3, #tooltip div { text-align: left; font-size: 1em; font-weight: normal; margin: 0}

/* Formatierung für Tabs */
.Tab {
	border-top-left-radius: 6px; border-top-right-radius: 6px; 
	border-width:1px 1px 0 1px; 
	padding: 3px 5px 5px 1px;
	margin: 3px 8px 0 0;
	min-width:40px;
	float:left;
	}
.TabAktiv {
	background-color:#FFF0C0;;
	}
.TabInaktiv {
	background-color:#EEE; color:#444;
	}
.TabBody { background-color: #FFF0C0; display:block; border:none; min-height:30em;padding:5px}

/* infobox */
.infobox { padding:6px 2px 6px 2px; margin: 0; background-color:#FFF0C0; color: black;}

/* Validator */
label.error {	color: red;	font-style: italic; display:block; }
div.error { color:red; font-style: italic; }
input.error { border: 1px dotted red; }
textarea.error { border: 1px dotted red; }
select.error { border: 1px dotted red; }
p.error {color: red;	font-style: italic;}

.dtsearch > input {width:8em;}