@import url(http://fonts.googleapis.com/css?family=Quattrocento);

.bildimtextresp	{
	display: none;
}

#t{
    position:fixed;
    top: 158px;
	margin-left: 612px;
    border:0px solid red;
    background-color: rgba(0,0,0, .8);
    color: #fff;
    padding: 7px 5px 7px 5px;
    width: 30px;
			border-radius: 3px;	
	   -moz-border-radius: 3px;
	-webkit-border-radius: 3px;
			box-shadow: 0px 1px 3px rgba(0,0,0, .5);	
	   -moz-box-shadow: 0px 1px 3px rgba(0,0,0, .5);
	-webkit-box-shadow: 0px 1px 3px rgba(0,0,0, .5);
    text-align: right;
    font: 10px/10px verdana, sans-serif;
}


html	{
	margin: 0;
	padding: 0; 
	font: 16px/22px 'Quattrocento', Georgia, Times New Roman, serif;
	color: #000;
	background: url(bilder/hintergrund.jpg) fixed;
	height: 100%;

}

body {
	border: 0px solid white;
	margin: 0;
	padding: 0;
	height: 100%;
}

.wrap 	{
	border: 0px solid red;
	text-align: center;	
	min-height: 100%;
	margin: auto;
	width: 750px;
	overflow: hidden;
	background-color: #fff;
	
			box-shadow: 0px 0px 15px #222;
	   -moz-box-shadow: 0px 0px 15px #222;
	-webkit-box-shadow: 0px 0px 15px #222;

}

.footer {
	width: 748px;
	border: 1px solid #d0d0d0;
	position: relative;
	height: 42px;
	margin-top: -42px;
	margin-left:auto;
	margin-right:auto;	
    background: url(bilder/head_hintergrund.jpg) fixed;	
}

.footer p{
	padding: 3px 45px 0 45px;
	text-decoration: none;
	text-shadow: none;
	color: #666;
	font: 12px/12px 'Quattrocento', Georgia, Times New Roman, serif;
	float: left;
	-moz-transition:  	0.5s ease-in-out;
	-webkit-transition: 0.5s ease-in-out;
	-o-transition:  	0.5s ease-in-out;
	transition:         0.5s ease-in-out;
}

.footer a{
	padding: 17px 60px 0 0;
	text-decoration: none;
	text-shadow: none;
	color: #666;
	font: 12px/12px 'Quattrocento', Georgia, Times New Roman, serif;
	float: right;
	-moz-transition:  	0.5s ease-in-out;
	-webkit-transition: 0.5s ease-in-out;
	-o-transition:  	0.5s ease-in-out;
	transition:         0.5s ease-in-out;
}


a.icontop	{
	position: absolute;
	left: 310px;
	border: 0px solid red;
}


.head	{
	border-bottom: 1px solid #c9c9c9;	
	background: url(bilder/head_hintergrund.jpg);
    background-size: 750px 224px;
	padding: 15px 40px 0 40px;
	text-align: left;
	text-decoration: bold;
	color: #000;
}

.headlinie	{
	margin: 45px 0 0 0;
	border-bottom: 1px solid #c9c9c9;
	height: 3px;
}

.headname	{
	font: 31px/31px 'Quattrocento', Georgia, Times New Roman, serif;
	color: #000;
	border: 0px solid red;
	text-transform: uppercase;
	margin: 45px 0 0 0;
}

.headname a	{
	text-decoration: none;
	color: #888;	
}

.headautor	{
	font: 12px/12px 'Quattrocento', Georgia, Times New Roman, serif;
	color: #000;
	border: 0px solid red;
	text-transform: uppercase;
	letter-spacing: 14px;
	margin: 20px 0 15px 1px;
}


.menue	{
	border: 0px solid red;
	margin: 10px 0 5px 0;
	height: 25px;
}

.menue a	{
	display: block;
	padding: 3px 0px 3px 0px;
	text-decoration: none;
	text-shadow: none;
	color: #666;
	font: 14px/14px 'Quattrocento', Georgia, Times New Roman, serif;
	float: left;
	-moz-transition:  	0.5s ease-in-out;
	-webkit-transition: 0.5s ease-in-out;
	-o-transition:  	0.5s ease-in-out;
	transition:         0.5s ease-in-out;
}

.menue div:after	{
	content: '|';
	text-shadow: none;
	font: bold 15px/15px 'Quattrocento', Georgia, Times New Roman, serif;
	padding: 2px 20px 0 20px;
	color: #888;
	border: 0px solid red;
	float: left;
}

.menue a:hover	{
	color: #000;
	text-shadow: 0px 1px 2px #999;
}


.content 	{
	background-color: #fff;
	text-align: left;
	overflow: hidden;
	padding-bottom: 50px;
}


.artikel 	{
	padding: 30px 30px 20px 30px;
}


.artikel pre	{
	white-space: pre-wrap;
	font: 16px/22px 'Quattrocento', Georgia, Times New Roman, serif;
}


.versal	{
	float: left;
	font:  46px/46px 'Quattrocento', Georgia, Times New Roman, serif;
	border: 0px solid red;
	height: 38px;
	margin: 1px 4px 0 0;
}

.biotext	{
	overflow: hidden;
}



/**** Home ***/

.startcontent 	{
	background-color: #fff;
	text-align: left;
	overflow: hidden;
	padding-bottom: 50px;
}

.startartikel	{
	border: 0px solid red;
	padding: 40px 0px 40px 0px;
	overflow: hidden;
	display: table;
	margin-left: -2px;
	
			transition:	0.3s ease-in-out;
		 -o-transition:	0.3s ease-in-out;			
	   -moz-transition:	0.3s ease-in-out;
	-webkit-transition: 0.3s ease-in-out;
}


.starttext	{
	border: 0px solid green;
	padding: 30px 30px 20px 30px;
	float: left;
}


.startbilddiv {
	vertical-align: middle;
	float: right;
}

.startbild {
	background-size: cover;	
	width: 160px;
	height: 120px;	
	
			box-shadow: inset 0px 0px 5px #777;	
	   -moz-box-shadow: inset 0px 0px 5px #777;
	-webkit-box-shadow: inset 0px 0px 5px #777;
	
			border-radius: 3px;	
	   -moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	
			transition:	0.3s ease-in-out;
		 -o-transition:	0.3s ease-in-out;
	   -moz-transition:	0.3s ease-in-out;
	-webkit-transition: 0.3s ease-in-out;
}

h1	{
	color: #000;
	font:  32px/23px 'Quattrocento', Georgia, Times New Roman, serif;
	margin: 22px 0 0 0;
}


h2 {
	color: #000;
	font:  25px/25px 'Quattrocento', Georgia, Times New Roman, serif;
	padding-top: 30px;
	margin-bottom: -10px;
}



/*** Kontakt Form ***/
#form { 
    width: 670px;}

#forma {
    text-align:center;
    padding:3px;}        

label {
    display:block;}
    
.inp {
    width: 275px;
    padding:3px;
    margin:1px 0;
    border:solid 1px #d0d0d0;
    border-radius: 5px;
    box-shadow: 2px 4px 6px rgba(50,50,50,0.3);}

.inp2 {
    width: auto;
    padding:3px;
    margin:1px 0;
	border-radius: 5px;}

input[type="button"]:hover {
    color: rgba(255,255,255,0.9);
    background-color: #CA9E57;
    border-color: #CA9E57;
    box-shadow: inset 0 1px 0 #CA9E60;}



/*** Mobile Devices ***/
@media only screen and (min-device-width: 176px) and (max-device-width: 600px),
only screen and (min-width: 176px) and (max-width: 600px) {


#t{
    position:fixed;
    top: 41px;
	right: 0;
	margin-right: 6px;
    border:0px solid red;
}

.wrap 	{
	border: 0px solid red;
	width: 95%;
}

.footer {
	width: 95%;
}

a.icontop	{

	position: absolute;
	left: 46%;
}

.head	{
	height: auto;
	overflow: hidden;
	padding: 15px 15px 10px 15px;
	background-color: #e0e0e0;
}

.headname	{
	font: 23px/23px 'Quattrocento', Georgia, Times New Roman, serif;
	color: #000;
	border: 0px solid red;
	text-transform: uppercase;
	margin: 10px 0 0 0;
}

.menue	{
	border: 0px solid red;
	margin: 10px 0 0 0;
	padding: 0 0 0px 0;
	height: 0;

}

.menue a	{
	border: 0px solid blue;
	display: block;
	padding: 6px 0px 6px 0px;
	margin-right: 15px;
	text-decoration: none;
	text-shadow: none;
	color: #666;
	font: 12px/12px 'Quattrocento', Georgia, Times New Roman, serif;
	float: left;
}

.menue div:after	{
	display: none;
}

.startartikel	{
	border: 0px solid red;
	padding: 20px 0px 20px 15px;
	font: 14px/18px 'Quattrocento', Georgia, Times New Roman, serif;

}

.startbilddiv {
	display: none;
}

.starttext	{
	border: 0px solid green;
	width: 95%;
	padding-left: 0;
}

.starttrennlinie	{
	margin: 0 10% 1px 10%;
}


.biotext	{
	clear: left;
}


h1	{
	font:  22px/25px 'Quattrocento', Georgia, Times New Roman, serif;
	margin: 15px 0 0 0;
}


h2 {
	font: 20px/20px 'Quattrocento', Georgia, Times New Roman, serif;
}

h3	{
	font:  17px/20px 'Quattrocento', Georgia, Times New Roman, serif;
	margin: 16px 0 0 0;
}

h4	{
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #999;
	font:  10px/10px 'Quattrocento', Georgia, Times New Roman, serif;
	margin: 0 0 0 2px;
}

.content img	{
	max-width: 100%;
	height:  auto;
}


.artikel 	{
	border: 0px solid red;
	padding: 20px 15px 40px 15px;
	font:  14px/20px 'Quattrocento', Georgia, Times New Roman, serif;
}

.mobile	{
	display: none;
}

.bildimtextresp	{
	display: inherit;
}
}