/* ====================================== 
   1. Kalibrierung und allgemeine Styles 
   ====================================== */

/* Kalibrierung der wichtigsten Abstände */
*  { padding: 0; margin: 0; border: 0;}

/* Allgemeine Selektoren */

html { height: 101%; } 

body {
	background-color: #3c3c3c;
	font-family: "Arial Black", Gadget, sans-serif;
	color: #FFF;
	font-size: 12px;
	height: 90%;
	}


a:link { color:#a6a6a6; text-decoration:none; }
a:visited { color:#a6a6a6; text-decoration:none; }
a:focus { color:white; text-decoration:none; }
a:hover { color:white; text-decoration:none; }
a:active { color:#a6a6a6; text-decoration:none; }


/* Allgemeine Klassen und IDs */

.skiplink { 
   position: absolute; 
   left: -3000px; 
   top: -2000px; 
   width: 0px; 
   height: 0px; 
   overflow: hidden; 
   display: inline; 
}

/* ============================================================
   2. Styles für die  Layoutbereiche des Preisschildassistenten
   ============================================================ */
  
#wrapper	{
		width: 80%;
		min-width: 1000px;
		height: 100%;
		min-height: 600px;
		/* min-height: 575px; */
		padding-top: 0.5em;
		padding-left:0.5em;
		padding-bottom: 0.3em;
		padding-right: 0.4em;
		margin-top: 1em;
		margin-right: auto;
		margin-left: auto;
		/* margin-bottom: 5em; */
		margin-bottom: 1em;
		background-color: #282828;
}




.grid_1		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf" 
    "spalte_1 spalte_1"
    "fuss_links fuss_rechts" 
  ; 
}

.grid_2		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf" 
    "spalte_1 spalte_2"
    "fuss_links fuss_rechts" 
  ; 
}

.grid_3		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:1fr 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf kopf" 
    "spalte_1 spalte_2 spalte_3"
    "fuss_links fuss fuss_rechts" 
  ;  
}


.grid_4		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:1fr 1fr 1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf kopf kopf" 
    "spalte_1 spalte_2 spalte_3 spalte_4"
    "fuss_links fuss_links fuss_rechts fuss_rechts" 
  ; 
}	

		
	
.grid_5		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:1fr 1fr 1fr 1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf kopf kopf kopf" 
    "spalte_1 spalte_2 spalte_3 spalte_4 spalte_5"
    "fuss_links fuss_links fuss fuss_rechts fuss_rechts" 
  ; 
}

.grid_6		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf kopf kopf kopf kopf" 
    "spalte_1 spalte_2 spalte_3 spalte_4 spalte_5 spalte_6" 
    "fuss_links fuss_links fuss fuss fuss_rechts fuss_rechts"
  ; 
}

.grid_7		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf kopf kopf kopf kopf kopf" 
    "spalte_1 spalte_2 spalte_3 spalte_4 spalte_5 spalte_6 spalte_7" 
    "fuss_links fuss_links fuss fuss fuss fuss_rechts fuss_rechts"
  ; 
}


.grid_8		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:1fr 1fr 1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf kopf kopf" 
    "spalte_1 spalte_2 spalte_3 spalte_4"
    "fuss_links fuss_links fuss_rechts fuss_rechts" 
  ; 
}	



.grid_12		{
	display: grid;
	grid-template-rows: 0.9fr 2.77fr 2.77fr 2.77fr 0.8fr;
  	grid-template-columns:1fr 1fr 1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf kopf kopf" 
	"spalte_1 spalte_2 spalte_3 spalte_4"
	"spalte_5 spalte_6 spalte_7 spalte_8"
	"spalte_9 spalte_10 spalte_11 spalte_12"  
    "fuss_links fuss_links fuss_rechts fuss_rechts"
  ; 
}

.grid_20		{
	display: grid;
	grid-template-rows: 0.9fr 1.66fr 1.66fr 1.66fr 1.66fr 1.66fr 0.8fr;
  	grid-template-columns:1fr 1fr 1fr 1fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf kopf kopf" 
	"spalte_1 spalte_2 spalte_3 spalte_4"
	"spalte_5 spalte_6 spalte_7 spalte_8"
	"spalte_9 spalte_10 spalte_11 spalte_12" 
	"spalte_13 spalte_14 spalte_15 spalte_16" 
	"spalte_17 spalte_18 spalte_19 spalte_20"    
    "fuss_links fuss_links fuss_rechts fuss_rechts"
  ; 
}

.grid_login		{
	display: grid;
	grid-template-rows: 0.9fr 8.3fr 0.8fr;
  	grid-template-columns:0.7fr 1.6fr 0.7fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf kopf" 
    "spalte_1 spalte_2 spalte_3"
    "fuss_links fuss fuss_rechts" 
  ;  
}


.grid_portal		{
	display: grid;
	grid-template-rows: 0.9fr 1.3fr 7.0fr 0.8fr;
  	grid-template-columns: 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_3a"
	"spalte_2b spalte_3b"
    "fuss_links fuss_rechts" 
  ;  
}

.grid_portal_vl		{
	display: grid;
	grid-template-rows:  1.0fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 1.0fr;
  	grid-template-columns: 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_3a"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3c"
	"spalte_2b spalte_3d"
	"spalte_2b spalte_3d"
	"spalte_2c spalte_3e"
	"spalte_2d spalte_3f"
	"spalte_2d spalte_3f"
	"spalte_2d spalte_3f"
	"spalte_2d spalte_3f"
	"spalte_2d spalte_3f"
    "fuss_links fuss_rechts" 
  ;  
}

.grid_portal_vl_1	{
	display: grid;
	grid-template-rows: 0.9fr 1.3fr 4.8fr 0.8fr 1.2fr 0.8fr;
  	grid-template-columns: 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_3a"
	"spalte_2b spalte_3b"
	"spalte_2c spalte_3b"
	"spalte_2d spalte_3b"
    "fuss_links fuss_rechts" 
  ;  
}

.grid_portal_bl		{
	display: grid;
	grid-template-rows:  1.0fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 0.8fr 1.0fr;
  	grid-template-columns: 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_3a"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3b"
	"spalte_2c spalte_2c"
	"spalte_2d spalte_2d"
	"spalte_2d spalte_2d"
	"spalte_2d spalte_2d"
	"spalte_2d spalte_2d"
	"spalte_2d spalte_2d"
    "fuss_links fuss_rechts" 
  ;  
}

.grid_portal_gl		{
	display: grid;
	grid-template-rows: 0.9fr 1.0fr 2.0fr 0.5fr 1.0fr 1.0fr 0.5fr 1.0fr 1.0fr 0.9fr;
  	grid-template-columns: 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_3a"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3b"
	"spalte_2b spalte_3b"
	"spalte_2c spalte_3b"
	"spalte_2d spalte_3b"
	"spalte_2d spalte_3b"
    "fuss_links fuss_rechts" 
  ;  
}



.grid_portal_pa_alt		{
	display: grid;
	grid-template-rows: 0.9fr 0.6fr 3.0fr 0.6fr 3.0fr 0.8fr;
  	grid-template-columns: 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_3a"
	"spalte_2b spalte_3b"
	"spalte_2c spalte_3c"
	"spalte_2d spalte_3d"
    "fuss_links fuss_rechts" 
  ;  
}

.grid_portal_pa		{
	display: grid;
	grid-template-rows: 0.9fr 0.6fr 3.0fr 0.6fr 3.0fr 0.8fr;
  	grid-template-columns: 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_3a"
	"spalte_2b spalte_3b"
	"spalte_2c spalte_3b"
	"spalte_2d spalte_3b"
    "fuss_links fuss_rechts" 
  ;  
}



.grid_portal_ma		{
	display: grid;
	grid-template-rows: 0.9fr 1.3fr 7.0fr 0.8fr;
  	grid-template-columns: 0.75fr 1.25fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_2a"
	"spalte_2b spalte_2b"
    "fuss_links fuss_rechts" 
  ;  
}

.grid_portal_ma_2		{
	display: grid;
	grid-template-rows: 0.9fr 1.3fr 3.5fr 3.5fr 0.8fr;
  	grid-template-columns: 0.75fr 1.25fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_2a"
	"spalte_2b spalte_2b"
	"spalte_2c spalte_2c"
    "fuss_links fuss_rechts" 
  ;  
}

.grid_portal_ma_4		{
	display: grid;
	grid-template-rows:  1.0fr 0.8fr 2.0fr 0.2fr 2.0fr 0.5fr 2.3fr 0.2fr 1.2fr 1.0fr;
  	grid-template-columns: 1fr 1fr;
	grid-auto-flow: row;
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_2a"
	"spalte_2b spalte_2b"
	"spalte_2c spalte_2c"
	"spalte_2d spalte_2d"
	"spalte_2e spalte_2e"
	"spalte_2f spalte_2f"
	"spalte_2g spalte_2g"
	"spalte_2h spalte_2h"
    "fuss_links fuss_rechts" 
  ;  
}


.grid_portal_admin		{
	display: grid;
	grid-template-rows: 0.9fr 2.15fr 2.95fr 2.15fr 0.8fr;
  	grid-template-columns:0.1fr 1.9fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf" 
    "spalte_2a spalte_2a"
	"spalte_2b spalte_2b"
	"spalte_2c spalte_2c"
    "fuss_links fuss_rechts" 
  ; 
}

.grid_portal_admin_a		{
	display: grid;
	grid-template-rows: 0.9fr 2fr 3.3fr 2fr 0.8fr;
  	grid-template-columns:0.4fr 1.6fr;
	grid-auto-flow: row; 
	grid-template-areas:  
    "kopf kopf" 
    "spalte_1a spalte_2a"
	"spalte_1b spalte_2b"
	"spalte_1c spalte_2c"
    "fuss_links fuss_rechts" 
  ; 
}




#spalte_1   {
    grid-area: spalte_1;          
} 

#spalte_1a   {
    grid-area: spalte_1a;            
} 

#spalte_1b   {
    grid-area: spalte_1b;            
} 

#spalte_1c   {
    grid-area: spalte_1c;            
} 



#spalte_2   { 
    grid-area: spalte_2;
} 

#spalte_2a   { 
    grid-area: spalte_2a;
} 

#spalte_2b   { 
    grid-area: spalte_2b;
} 

#spalte_2c   { 
    grid-area: spalte_2c;
} 

#spalte_2d   { 
    grid-area: spalte_2d;
} 

#spalte_2e   { 
    grid-area: spalte_2e;
} 

#spalte_2f   { 
    grid-area: spalte_2f;
} 

#spalte_2g   { 
    grid-area: spalte_2g;
} 

#spalte_2h   { 
    grid-area: spalte_2h;
} 


#spalte_3   { 
    grid-area: spalte_3;
} 

#spalte_3a   { 
    grid-area: spalte_3a;
} 

#spalte_3b   { 
    grid-area: spalte_3b;
} 

#spalte_3c   { 
    grid-area: spalte_3c;
} 

#spalte_3d   { 
    grid-area: spalte_3d;
} 

#spalte_3e   { 
    grid-area: spalte_3e;
} 

#spalte_3f   { 
    grid-area: spalte_3f;
} 


#spalte_4   { 
    grid-area: spalte_4;
} 

#spalte_5   { 
    grid-area: spalte_5;
} 

#spalte_6   { 
    grid-area: spalte_6;
} 

#spalte_7   { 
    grid-area: spalte_7;
} 


#marke_1 	{
			grid-area: spalte_1; 
			display: grid;
			align-content:space-evenly;			
} 

#marke_2 	{ 
			grid-area: spalte_2;
			display: grid;
			align-content:space-evenly;
} 

#marke_3 	{ 
			grid-area: spalte_3;
			display: grid;
			align-content:space-evenly;
} 

#marke_4 	{ 
			grid-area: spalte_4;
			display: grid;
			align-content:space-evenly;
} 

#marke_5 	{ 
			grid-area: spalte_5;
			display: grid;
			align-content:space-evenly;
} 

#marke_6 	{ 
			grid-area: spalte_6;
			display: grid;
			align-content:space-evenly;
} 

#marke_7 	{ 
			grid-area: spalte_7;
			display: grid;
			align-content:space-evenly;
} 

#marke_8	{
			grid-area: spalte_8;
			display: grid;
			align-content:space-evenly;
}

#marke_9	{
			grid-area: spalte_9;
			display: grid;
			align-content:space-evenly;
}

#marke_10	{
			grid-area: spalte_10;
			display: grid;
			align-content:space-evenly;
}

#marke_11	{
			grid-area: spalte_11;
			display: grid;
			align-content:space-evenly;
}

#marke_12	{
			grid-area: spalte_12;
			display: grid;
			align-content:space-evenly;
}

#marke_13	{
			grid-area: spalte_13;
			display: grid;
			align-content:space-evenly;
}

#marke_14	{
			grid-area: spalte_14;
			display: grid;
			align-content:space-evenly;
}

#marke_15	{
			grid-area: spalte_15;
			display: grid;
			align-content:space-evenly;
}

#marke_16	{
			grid-area: spalte_16;
			display: grid;
			align-content:space-evenly;
}

#marke_17	{
			grid-area: spalte_17;
			display: grid;
			align-content:space-evenly;
}

#marke_18	{
			grid-area: spalte_18;
			display: grid;
			align-content:space-evenly;
}

#marke_19	{
			grid-area: spalte_19;
			display: grid;
			align-content:space-evenly;
}

#marke_20	{
			grid-area: spalte_20;
			display: grid;
			align-content:space-evenly;
}



#fuss	{
        grid-area: fuss;
        position: relative;
}

#fuss_links			{
					display: grid;
					align-content:space-evenly;
					grid-area: fuss_links;
					padding-left: 8px;

}


#fuss_rechts			{
					display: grid;
					grid-area: fuss_rechts;
					align-content:space-evenly;
					padding-right: 8px;
}



#kopf	{
		 background-size: 100% 90%;
         background-image: url(hintergrund_kopf_flex.jpg);
		 background-repeat: no-repeat;
		 background-position: right 0em top 0.5em;
		 
         grid-area: kopf;


}

#kopf_ug	{
	background-size: 100% 90%;
	background-image: url(hintergrund_kopf_ug.gif);
	background-repeat: no-repeat;
	background-position: right 0em top 0.5em;
	
	grid-area: kopf;


}


#kopf_links	{
			float: left;
			width: 11%;
			min-width: 115px;
			margin-top: 0.7em;
			margin-left: 0.8em;

}


#kopf_rechts	{
	float: right;
	width: 11%;
	min-width: 115px;
	margin-top: 0.7em;
	margin-right: 0.8em;
}

.kopf_fotec {
              background-image: url(kopf_fotec.gif);
              background-size: 90%;
              background-repeat: no-repeat;
}

.kopf_fotec:hover {
                    background-image: url(kopf_fotec_b.gif);
                    background-size: 90%;

}

.kopf_pax_1 {
	background-image: url(kopf_pax_1.gif);
	background-size: 100%;
	background-repeat: no-repeat;
}

.kopf_pax_1:hover {
		  background-image: url(kopf_pax_1_b.gif);
		  background-size: 100%;

}

.kopf_pax_2 {
	background-image: url(kopf_pax_2.gif);
	background-size: 95%;
	background-repeat: no-repeat;
}

.kopf_pax_2:hover {
		  background-image: url(kopf_pax_2_b.gif);
		  background-size: 95%;

}




.kopf_photair {
              background-image: url(kopf_photair.gif);
              background-size: 100%;
              background-repeat: no-repeat;
}

.kopf_photair:hover {
                    background-image: url(kopf_photair_b.gif);
                    background-size: 100%;

}	


.fusszeile_formulare 	{
	width: 200px;
	float: left;
	  background-image: url(fusszeile_formulare.gif);
	  background-size: 100%;
	  background-repeat: no-repeat;

}



.fusszeile_formulare:hover		{
			 background-image: url(fusszeile_formulare_b.gif);
			background-size: 100%;

}

.fusszeile_technik 	{
					width: 200px;
					float: right;
              		background-image: url(fusszeile_technik.gif);
              		background-size: 100%;
              		background-repeat: no-repeat;
}

.fusszeile_technik:hover		{
                 			background-image: url(fusszeile_technik_b.gif);
							background-size: 100%;

}

.fusszeile_ug 	{
	width: 430px;
	float: left;
	  background-image: url(fusszeile_ug.gif);
	  background-size: 100%;
	  background-repeat: no-repeat;

}



.fusszeile_ug:hover		{
			 background-image: url(fusszeile_ug_b.gif);
			background-size: 100%;

}

.fusszeile_ug_r 	{
	width: 430px;
	float: right;
	  background-image: url(fusszeile_ug.gif);
	  background-size: 100%;
	  background-repeat: no-repeat;

}



.fusszeile_ug_r:hover		{
			 background-image: url(fusszeile_ug_b.gif);
			background-size: 100%;

}

.fusszeile_logout 	{
	width: 200px;
	float: right;
	  background-image: url(fusszeile_logout.gif);
	  background-size: 100%;
	  background-repeat: no-repeat;
}

.fusszeile_logout:hover		{
			background-image: url(fusszeile_logout_b.gif);
			background-size: 100%;

}

.fusszeile_logout_l 	{
	width: 200px;
	float: left;
	  background-image: url(fusszeile_logout_l.gif);
	  background-size: 100%;
	  background-repeat: no-repeat;
}

.fusszeile_logout_l:hover		{
			background-image: url(fusszeile_logout_l_b.gif);
			background-size: 100%;

}

.fusszeile_portal 	{
	width: 140px;
	float: left;
	  background-image: url(fusszeile_portal.gif);
	  background-size: 100%;
	  background-repeat: no-repeat;
}

.fusszeile_portal:hover		{
			background-image: url(fusszeile_portal_b.gif);
			background-size: 100%;

}

.fusszeile_portal_r 	{
	width: 140px;
	float: right;
	  background-image: url(fusszeile_portal_r.gif);
	  background-size: 100%;
	  background-repeat: no-repeat;
}

.fusszeile_portal_r:hover		{
			background-image: url(fusszeile_portal_r_b.gif);
			background-size: 100%;

}


.responseImage img {
	max-width: 85%;
	max-height:auto;
	display:block;
	margin-left: auto;
	margin-right: auto;
	/* margin-top: 20px; */
   }


.border {
		border-top-width:thin;
		border-right-width: thin;
		border-left-width: thin;
		border-bottom-width: medium;
		border-style: solid;
		border-top-color: #787878;
		border-right-color: #000;
		border-left-color: #787878;
		border-bottom-color: #000;	
}

.border_links {
		border-top-width:thin;
		border-right-width: 0;
		border-left-width: thin;
		border-bottom-width: medium;
		border-style: solid;
		border-top-color: #787878;
		border-right-color: #000;
		border-left-color: #787878;
		border-bottom-color: #000;	
}

.border_mitte {
		border-top-width:thin;
		border-right-width: 0;
		border-left-width: 0;
		border-bottom-width: medium;
		border-style: solid;
		border-top-color: #787878;
		border-right-color: #000;
		border-left-color: #787878;
		border-bottom-color: #000;	
}

.border_rechts {
		border-top-width:thin;
		border-right-width: thin;
		border-left-width: 0;
		border-bottom-width: medium;
		border-style: solid;
		border-top-color: #787878;
		border-right-color: #000;
		border-left-color: #787878;
		border-bottom-color: #000;	
}

.border_portal_oben {
	/* border-top-width:thin; */
	border-right-width: thin;
	border-left-width: thin;
	border-bottom-width: medium;
	border-style: solid;
	/* border-top-color: #787878; */
	border-right-color: #000;
	border-left-color: #787878;
	border-bottom-color: #000;	
}

.border_portal_mitte {
	/* border-top-width:thin; */
	border-right-width: thin;
	border-left-width: thin;
	/* border-bottom-width: medium; */
	border-style: solid;
	/* border-top-color: #787878; */
	border-right-color: #000;
	border-left-color: #787878;
	/* border-bottom-color: #000; */	
}

.border_portal_unten {
	border-top-width:thin;
	border-right-width: thin;
	border-left-width: thin;
	/* border-bottom-width: medium; */
	border-style: solid;
	border-top-color: #787878;
	border-right-color: #000;
	border-left-color: #787878;
	/* border-bottom-color: #000; */	
}



.schild {
		position: relative;
		background-color: #3c3c3c;

}

.scroll {
		overflow: auto;

}


.bild {
		border-style: solid;
		border-width: medium;
		border-color: green;
		background-color: white;

} 


.login {
	
	padding: 15px;
	text-align: left;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #c8c8c8;
	font-size: 1.5em;
	
}

.login_center {
	
	padding: 15px;
	text-align: center;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 2.0em;
}

.login_klein {
	
	padding: 10px;
	text-align: left;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #c8c8c8;
	font-size: 1.5em;
	
}

.logout	{
	position: absolute;
	top: 87%;
	left: 10%;
	width: 80%;
	padding: 0px;
	text-align: center;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 2.0em;
}

.admin	{
	padding-top: 5px;
	padding-bottom: 10px;
	text-align: center;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.8em;
}


label {
		width: 18em;
		margin-bottom: 10px;
		display: block;
		float: left;

}

input {
	font-size: 1.0em;
	text-align: center;
	background-color: #9f9696;
	height: 1.75em;

}



table, tr, td {
	table-layout: fixed;
	width: 95%;
	font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	font-size: 13px;
	color: #c8c8c8;
	text-align: center;
  	border-collapse: collapse;
  	border: 1px solid;
	border-color: rgb(128, 128, 128);
	padding: 3px;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: auto;
	margin-right: auto;

	}

th {
		table-layout: fixed;
		width: 95%;
		font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
		font-size: 13px;
		color: white;
		text-align: center;
		  border-collapse: collapse;
		  border: 1px solid;
		border-color: rgb(128, 128, 128);
		padding: 3px;
		margin-bottom: 5px;
		margin-left: auto;
		margin-right: auto;
}

.text	{
		position: absolute;
		top: 87%;
		left: 10%;
		width: 80%;
		padding: 0px;
		text-align: center;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size: 1.2em;
}


.text_trainer	{
	position: absolute;
	top: 85%;
	left: 10%;
	width: 80%;
	padding: 0px;
	text-align: center;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;

}

.text_rot{
	color: red;
}

/* ===================================================
   3. Styles für die  Layoutbereiche "Urlaubsgesuche"
   =================================================== */



#button {
		background-color: #3c3c3c;
		font-family: "Arial Black", Arial, Helvetica, sans-serif;
		font-size: 20px;
		padding-top: 10px;
		margin-right: 10px;
        width: 210px;
		color: #988f8f;
	  }
	  
#button:hover {
		background-color: #3c3c3c;
		color: #fff;
	  }


#button_01 {
		background-color: #3c3c3c;
		font-family: "Arial Black", Arial, Helvetica, sans-serif;
		font-size: 20px;
		padding-top: 10px;
		margin-right: 10px;
        width: 250px;
		color: #988f8f;
	  }
	  
#button_01:hover {
		background-color: #3c3c3c;
		color: #fff;
	  }

#button_pw_email_reset {
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size: 1.4em;
		padding-top: 10px;
		margin-left: auto;
		margin-right: auto;
        /* width: 500px; */
		color: #988f8f;
	  }
	  
#button_pw_email_reset:hover {
		background-color: #3c3c3c;
		color: #fff;
	  }

#button_anmelden {
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		/* font-family: "Arial Black", Arial, Helvetica, sans-serif; */
		font-size: 1.6em;
		padding-top: 10px;
		margin-left: auto;
		margin-right: auto;
        width: 500px;
		color: #988f8f;
	  }
	  
#button_anmelden:hover {
		background-color: #3c3c3c;
		color: #fff;
	  }

#button_vergessen {
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		/* font-family: "Arial Black", Arial, Helvetica, sans-serif; */
		font-size: 1.2em;
		padding-top: 10px;
		margin-left: auto;
		margin-right: auto;
        width: 500px;
		color: #988f8f;
	  }
	  
#button_vergessen:hover {
		background-color: #3c3c3c;
		color: red;
	  }

#button_tabelle_a {
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: rgb(128, 128, 255);
	  }
	  
#button_tabelle_a:hover {
		background-color: #3c3c3c;
		color: lightblue;
	  }


#button_tabelle_b {
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: rgb(5, 187, 5);
	  }
	  
#button_tabelle_b:hover {
		background-color: #3c3c3c;
		color: lightgreen;
	  }


#button_tabelle_c {
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: red;
	  }
	  
#button_tabelle_c:hover {
		background-color: #3c3c3c;
		color: orange;
	  }


#button_suche {
		/* float: right; */
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size: 1.8em;
		padding-top: 10px;
		margin-right: 1.0em;
		/* margin-left: auto; */
		color: #988f8f;
	  }
	  
#button_suche:hover {
		background-color: #3c3c3c;
		color: #fff;
	  }


#button_suche_reset {
		/* float: right; */
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size: 1.8em;
		padding-top: 10px;
		margin-right: auto;
		color: #988f8f;
	  }
	  
#button_suche_reset:hover {
		background-color: #3c3c3c;
		color: red;
	  }

#button_loeschen {
		/* float: right; */
		background-color: #3c3c3c;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size: 2.0em;
		padding-top: 10px;
		margin-right: auto;
		color: red;
	  }
	  
#button_loeschen:hover {
		background-color: #3c3c3c;
		color: white;
	  }

.zeile {
		float: left;
		padding-top: 5px;
		padding-left: 0px;
		padding-right: 0px;
		padding-bottom: 0px;
		margin-top: 5px;
		margin-bottom: 0px;
		border-bottom: 2px solid white;
		
	}

.zeile_portal {
		float: right;
		padding-top: 5px;
		padding-left: 0px;
		padding-right: 0px;
		padding-bottom: 0px;
		margin-top: 5px;
		margin-bottom: 0px;
		/* border-bottom: 2px solid white; */
		
	}

.button_portal {

	width: 95%;
	margin-left: auto;
	margin-right: auto;

}


.button_mitte {
	position: relative;
   	display:flex;
   	justify-content: center;

}

.button_center {
	position: relative;
	margin-left: auto;
	margin-right: auto;

}

.clear {
		clear: left;
	}


.right {
		float: right;

	}

.right_portal {
		float: right;


	}


.inline {
		display: inline;
	}



.u {
		border-bottom: 2px solid black;


	}

.u2 {
		border-bottom: 4px solid black;

	}

.o {
		border-top: 2px solid black;

	}

.o2 {
		border-top: 4px solid black;
		padding-top: 5px;
		margin-bottom: 0px;


	}

.o3 {
		border-top: 4px solid white;
		padding-top: 5px;
		margin-bottom: 0px;


	}


.fett {
		font-weight: bold;

	}

.x1 {
		width: 100%;

	}


.x2 {
		width: 50%;

	}

.x15 {
		width: 15%;

	}

.x25 {
		width: 25%;

	}


.x3 {
		width: 33.3%;

	}

.x37 {
		width: 37%;

	}

.x4 {
		width: 40%;

	}


.x75 {
		width: 75%;

	}

.x85 {
		width: 84.9%;

	}


.x_button {
		width: 12%;
		margin-left: 7px;
		margin-bottom: 3px;

	}

.text_rot {
		color: red;
		font-weight: bold;
	}

.text_gruen {
		color: green;
		font-weight: bold;
	}


.submit_login {
		border: none;
		background-color: #fff;
		padding: 5;
		margin: 5;
		width: 5em;
	   }

	

.submit_gruen_portal	{
		border: 1px solid black;
		background-color: green;
		color: white;
		/* padding: 5px; */
		margin-right: 10px;
		margin-left: auto;
		font-family: "Arial Black", Gadget, sans-serif;
		font-size: 1em;
	}

.submit_rot_portal	{
		border: 1px solid black;
		background-color: red;
		color: white;
		/* padding: 5px; */
		margin-right: 10px;
		margin-left: auto;
		font-family: "Arial Black", Gadget, sans-serif;
		font-size: 1em;
	}

.submit_blau_portal	{
		border: 1px solid black;
		background-color: blue;
		color: white;
		/* padding: 5px; */
		margin-right: 10px;
		margin-left: auto;
		font-family: "Arial Black", Gadget, sans-serif;
		font-size: 1em;
	}



.reset {
	background-image: url(ug_button_reset.gif);
	background-size: 100%;

}

.reset:hover {
	background-image: url(ug_button_reset_b.gif);
	background-size: 100%;

}

.senden_bl {
	background-image: url(ug_button_bl.gif);
	background-size: 100%;

}

.senden_bl:hover {
	background-image: url(ug_button_bl_b.gif);
	background-size: 100%;

}

.border {
	border-top-width:thin;
	border-right-width: thin;
	border-left-width: thin;
	border-bottom-width: medium;
	border-style: solid;
	border-top-color: #787878;
	border-right-color: #000;
	border-left-color: #787878;
	border-bottom-color: #000;	
}







/* ======================================= 
   E N D E   D E S   S T Y L E S H E E T S 
   ======================================= */