* 	{
    -web-kit-box-sizing: border-box;
        -moz-box-sizing: border-box;
             box-sizing: border-box;
	}

html {
	min-height:100%;
		}
	
body {
	min-height:100%;
	color: black;
	/* max-width: 480px; */
	margin: 0 auto; /* Zentriert die Seite */ 
	}


.widthperc0,
.widthperc10,
.widthperc20,
.widthperc25,
.widthperc30,
.widthperc33,
.widthperc40,
.widthperc50,
.widthperc60,
.widthperc67,
.widthperc70,
.widthperc75,
.widthperc80,
.widthperc90,
.widthperc100
	{
	width:100%;
	}


div.wrap
	{
	background-color: transparent;
	}
	
div.bannerwrap
	{
	/*display:table;*/
	padding-right:2.3rem;
	}

div.banner_logowrap
	{
	display:inline-block;
	border-right-spacing:3rem;
	vertical-align:middle;
	margin-right:1rem;
	}
	
img.logo
	{
	max-height:5rem;
	margin:0;
	padding:0;
	}

div.banner_titlewrap
	{
	padding-left:;
	display:inline-block;
	vertical-align:middle;
	}

.adminbuttonwrap
	{
	display:inline-block;
	width:100%;
	}
	
div.adminbutton
	{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-flow:row nowrap;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	position:absolute;
	z-index:5;
	top: 0.5rem;
	background-color:#333;
	color: white;
}

.adminbutton span 
	{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	font-size: 1rem; /* anpassen je nach Gr��e der Icons */
	line-height: 1;
	vertical-align: middle;
	}

.adminbutton:has(span.genericon-edit),
.adminbutton.close
	{
	right:0.5rem;
	}	

.adminbutton:has(span.genericon-trash)
	{
	right:3rem;
	}
	
	
div.adminbutton_table
	{
	float:right;	
	}

.adminbutton_table span.genericon-trash,
.adminbutton_table span.genericon-edit
	{
	color: black;
	font-size: 1.5rem;
	}
	

.adminbutton span.genericon-trash,
.adminbutton span.genericon-edit,
.adminbutton.close
	{
	color: white;
	font-size: 2rem;
	}
	

div.banner_titlewrap h1 a
	{
	display: inline-block;	color: black;
	}
	
header[role="banner"]
	{
	background: #ccc;
	min-height:unset;
	}

footer[role="contentinfo"] 
	{
	background: #333333;
	color: white;
	}

/* Klasse zum Elemente-Verstecken in visuellen Layouts */
.hideme {
	position: absolute;
	top: -32768px;
	left: -32768px;
	}
	
/* Micro-Clearfix-Hack von Nicolas Gallagher. Stellt ausserdem die Klasse "clear" bereit */
.cf:before,
.cf:after 
	{
	content: " ";
	display: table;
	}
	
.cf:after,
.clear
	{
	clear:both;
	}	
	
/*
footer[role="contentinfo"] small a
	{
	color:white;
	text-decoration:none;
	}
*/

	
a[href^="http"]:before
	{
	content: "\2197";
	}
	


/* Padding f�r Layoutbereiche */ 
header[role="banner"] ,
div[class="wrap"],  
footer[role="contentinfo"] 
	{
	padding: 1em;
	}
/* !!!!!!Unterschied!!!!!!! */	
header[role="banner"] h1 
	{
	color: white;
	padding: 0;
	margin: 0;
	}

header[role="banner"] a 
	{	
	color: white;
	text-decoration: none;
	}

header[role="banner"] p 
	{
	padding: 0;
	margin: 0;
	}	

footer[role="contentinfo"] a 
	{
	color: white;
	text-decoration: none;
	}

header[role="banner"] h1
	{	
	font-family: Bad Script, tahoma, arial, sans-serif;
	font-size: 2rem;
	letter-spacing: 1px;
	}
	

html {
	font-size: 100%; /* Browser-Default: 16px, Kindle Fire 20px */	
	font-family: Open Sans, tahoma, arial, sans-serif;
	}	

body {
	font-size: 14px;
	font-size: 1.1rem;
	}

h2
	{
	color:black;
	font-family: Corinthia, tahoma, arial, sans-serif;
	}

h3
	{
	color:black;
	font-family: Open Sans, tahoma, arial, sans-serif;
	}
	
h1 {
	font-size: 32px; /* Fallback f�r alte Browser */
	font-size: 2rem;
	}
	
h2 {
	font-size: 22px; /* Fallback f�r alte Browser */
	font-size: 3rem;
	}

h3 {
	font-size: 20px; /* Fallback f�r alte Browser */
	font-size: 1.5rem;
	}

main {
	/*padding: 4px;
	padding: 0.25rem;*/
	line-height: 1.7;
	}
	
/* Social-Media-Genericons im Footer */


.socialmedia a[href^="http"]:before
	{
	content: none;
	}	

ul.socialmedia 
	{
	padding: 0;
	margin: 0;
	}
	

		
	
.socialmedia li 
	{
	display: inline-block;
	margin-right: 32px;
	margin-right: 2rem;
	width:2rem;
	}
.socialmedia li:last-of-type
	{
	margin-right: 0;
	margin-right: 0;
	margin-bottom:3rem;
	}
		
	
.socialmedia a.genericon 
	{
	font-size: 32px;
	font-size: 2rem;
	}
	
.socialmedia a
	{	
	width:2rem;
	text-align:left;	
	}


.socialmedia a.webicon-mail 
	{
	color:white;
	}	
.socialmedia a.webicon-mail:hover 
	{
	color:#cccccc;
	}		
.socialmedia a.webicon-phone 
	{
	color:white;
	}	
.socialmedia a.webicon-phone:hover 
	{
	color:#cccccc;
	}	
.socialmedia a.webicon-twitter 
	{
	color:white;
	}	
.socialmedia a.webicon-twitter:hover 
	{
	color: #010101;
	}		
.socialmedia a.webicon-facebook 
	{
	color:white;
	}	
.socialmedia a.webicon-facebook:hover 
	{
	color: #3b5998;
	}		
.socialmedia a.webicon-foursquare 
	{
	color:white;
	}	
.socialmedia a.webicon-foursquare:hover 
	{
	color: #fa4779;
	}		
.socialmedia a.webicon-instagram 
	{
	color:white;
	}	
.socialmedia a.webicon-instagram:hover 
	{
	color: #fb3958;
	}		
.socialmedia a.webicon-pinterest 
	{
	color:white;
	}	
.socialmedia a.webicon-pinterest:hover 
	{
	color: #E60023;
	}		
.socialmedia a.webicon-vimeo 
	{
	color:white;
	}	
.socialmedia a.webicon-vimeo:hover 
	{
	color: #86c9ef;
	}		
.socialmedia a.webicon-youtube 
	{
	color:white;
	}	
.socialmedia a.webicon-youtube:hover 
	{
	color: #FF0000;
	}
.socialmedia a.webicon-xing 
	{
	color:white;
	}
.socialmedia a.webicon-xing:hover 
	{
	color: #126567;
	}
.socialmedia a.webicon-linkedin 
	{
	color:white;
	}
.socialmedia a.webicon-linkedin:hover 
	{
	color: #0e76a8;
	}	
.socialmedia a.webicon-tiktok 
	{
	color:white;
	}
.socialmedia a.webicon-tiktok:hover 
	{
	color: #00f2ea;
	}	
.socialmedia a.webicon-tumblr 
	{
	color:white;
	}
.socialmedia a.webicon-tumblr:hover 
	{
	color: #314358;
	}	
.socialmedia a.webicon-flickr 
	{
	color:white;
	}
.socialmedia a.webicon-flickr:hover 
	{
	color: #0063DB;
	}	
.socialmedia a.webicon-ricardo:hover
	{
	color: #fc9013;
	}


	
.selfcreatedicons 
	{
	vertical-align: top;
	text-align: center;
	-moz-transition: color .1s ease-in 0;
	-webkit-transition: color .1s ease-in 0;
	display: inline-block;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	//line-height: 1;
	text-decoration: inherit;
	text-transform: none;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	speak: none;
	font-size: 48px;
	font-size: 3rem;
	font-family: 'own_webiconsregular';
	}	

.webicon-info
	{
	color:#003e87;
	}

.webicon-attention
	{
	color:#e01616;
	}

.webicon-success
	{
	color:#0c750e;
	}

.webicon-handicapped
	{
	color: #003e87;
	}

.webicon-blind
	{
	color:#ffff00;
	}

.webicon-recycling
	{
	color:#0c750e;
	}
	
td.messagescontent
	{
	padding-left:1rem;
	width:100%;
	}
	
td.messages
	{
	display:table-cell;
	vertical-align:middle;
	padding:3px;
	}

tr.messages:first-of-type
	{
	border:0;
	}	

tr.messages
	{
	display:table;
	border-top: 1px solid #cccccc;
	}
/*		
div.messages:first-of-type
	{
	border-top:0;
	}
*/
	
p.back2admin
	{
	margin-top:1.5rem;
	}
	

div.headerwrap
	{
	position:relative;
	background:red;
	}
	
div.mainheader_adminbutton
	{
	flex: 0 0 auto;
	text-decoration:none;
	display:flex;
	justify-content:center;
	align-items:center;
	flex-flow:row nowrap;
	width: 3rem !important;
	height: 3rem;
	border-radius: 50%;
	position:absolute;
	z-index:5;
	top: 0.5rem;
	background-color:#333;
	color: white;
	right:0.5rem;	
	}	

	
	
div.mainheader_adminbutton a
	{
	text-decoration:none;
	}
	
.mainheader_adminbutton span.genericon-edit
	{
	font-size:32px;
	font-size:2rem;
	color: white;
	}	
	
header[role="banner"] p.slogan
	{
	display: inline-block;	color: black;
	font-size: 1.5rem;
	font-family: Corinthia, tahoma, arial, sans-serif;
	}


	
body.layout div.wrap main section#content article
	{
	width:100%;
	}

body.layout div.wrap main section#content article div
	{
	display:inline-block;
	}
	
body.design div.wrap main section#content article
	{
	width:100%;
	}

body.design div.wrap main section#content article div
	{
	display:inline-block;
	}

.nobr
	{
	white-space:nowrap;
	}
	
/****** Anpassungen f�r Desktop-Version ******/
@media screen and (min-width: 768px)
	{
	body 
		{
		width: auto;
		max-width: none;
		/*box-shadow: 0 2px 6px rgba(0,0,0,0.3);*/
		margin: 0;
		}
	
	html {
		/*background: #ddd url("../bilder/big_bg.jpg") no-repeat center center fixed;*/
				-webkit-background-size: cover;
		   -moz-background-size: cover;
		     -o-background-size: cover;
		        background-size: cover;
		background-color:#eee;
		/*background-attachment:fixed;*/
		}
		
	div.wrap
		{
		overflow: hidden;		
		background: transparent;
		margin-bottom: 0;
		border-radius: 0 0 0 0;
		
		}
		
	img.logo
		{
		height:10rem;
		}
	img.logo
		{
		max-height:10rem;
		}	
/*
	div.banner_logowrap
		{
		max-height:96px; 
		height:6rem; 
		padding-right:48px;
		padding-right:3rem;
		}
*/	
	footer[role="contentinfo"]
		{
		border-radius: 0 0 0 0;
		clear: both;
		}
		
	header[role="banner"]
		{
		border-radius: 0 0 0 0;
		margin-bottom:0;
				-webkit-background-size: 100% auto;
		   -moz-background-size: 100% auto;
		     -o-background-size: 100% auto;
		        background-size: 100% auto;
		min-height: 0		}
	
	nav#nav
		{
		margin-bottom:0;
		}
		
	.adminbutton span.genericon-trash,
	.adminbutton span.genericon-edit
		{
		font-size: 1.5rem;
		}
		
	header[role="banner"] h1
		{	
		font-size: 4rem;
		}
	
	div.banner_titlewrap h1 a
		{
		display:inline-block;
		}
	
	
	
	header[role="banner"] p.slogan
		{			
		font-size: 3rem;
		display:inline-block;
		
		}
		
	.adminbutton span.genericon-trash,
	.adminbutton span.genericon-edit
		{
		font-size: 1.5rem;
		}
		
	.socialmedia li:last-of-type
		{
		margin-bottom:0;
		}
	
	.widthperc0
		{
		width:100%;
		}
	.widthperc10
		{
		width:10%;
		}
	.widthperc20
		{
		width:20%;
		}
	.widthperc25
		{
		width:25%;
		}
	.widthperc30
		{
		width:30%;
		}
	.widthperc33
		{
		width:33%;
		}
	.widthperc40
		{
		width:40%;
		}
	.widthperc50
		{
		width:50%;
		}
	.widthperc60
		{
		width:60%;
		}
	.widthperc67
		{
		width:67%;
		}
	.widthperc70
		{
		width:70%;
		}
	.widthperc75
		{
		width:75%;
		}
	.widthperc80
		{
		width:80%;
		}
	.widthperc90
		{
		width:90%;
		}
	.widthperc100
		{
		width:100%;
		}

	div.bannerwrap
		{
		padding-right:0;
		}	
	}