@charset "utf-8";
/* CSS Document */
body						{margin:0px 0px 0px 0px; 
							font-family: 'Roboto', 
							sans-serif; font-size:100%;
							color:rgba(106,106,106,1.00);
							/*background-color:#000;*/}
html, body  			{height:100%;}
h1, h2, h3, h4, h5, h6		{font-family: 'Open Sans Condensed', Arial Narrow, sans-serif;font-weight:300; color:#000;}
						
p							{font-family: 'Roboto', sans-serif;
							 font-weight:300;}
 
 /* VIDEOS */
 
 .responsive-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.responsive-video {
position: relative;
padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
padding-top: 0px;
height: 0;
overflow: hidden;
}
 
 
/*NAVI*/

.logo						{width:150px; 
							height:68px; 
							margin:auto; 
							margin-bottom:20px; 
							margin-top:10px;}
/*.logo_weiss					{width:150px; 
							height:68px; 
							margin:auto; 
							margin-bottom:20px; 
							margin-top:10px;}*/
.logo_weiss					{ display:none;}		
nav							{width:170px; 
							height:auto; 
							margin-top:0px;
							float:left;
							font-family: 'Open Sans Condensed', Arial Narrow, sans-serif;
							font-weight:300;}
#navigation					{position:absolute; 
							left: 0px; }
nav h2						{margin:0px 0px 20px 0px;}
.titel						{width:170px;
							text-align:center;  
							font-weight:300; 
							color:#000; 
							font-size:0.875em;
							margin:5px 0px 30px 0px;
							font-family: 'Roboto', sans-serif;
							 font-weight:300;}	
.tags, .meta				{text-align: left;
							font-family: 'Open Sans Condensed', Arial Narrow, sans-serif;
							font-weight:300;
							font-size:1.25em;
							padding-left:10px; 
							height:auto; 
							margin-bottom:30px; 
							width:150px;}													
.tags a, .meta a, .box_c a
							{color:rgba(106,106,106,1.00);
							text-decoration:none;
							display:block;}
.tags a:hover, 
.meta a:hover, .box_c a:hover 	
							{color: rgba(0,187,255,1.00);
							text-decoration:none;}
.farben						{padding-left:10px}
#weiss, #grau, #schwarz, #blau	, #beige, #dblau, #rot, #dgrau			{width:15px; height:15px; border:1px solid #fff;}	
#weiss						{border:1px solid #dedede;}				
		


/*INDEX*/

.box_a						{display:block;
							width:250px;
							height:210px;
							background-color: #fff;
							float:left;
							margin:5px;
							box-shadow: rgba(0,0,0,1.00) ;
							-webkit-box-shadow: 2px 2px 3px #ededed;
							-moz-box-shadow: 2px 2px 3px #ededed;
							box-shadow: 2px 2px 3px rgba(0,0,0,0.10);}
.box_b						{display: table;
							width:250px;
							height:55px;}
.box_c						{/*	background-color: rgba(255,192,193,1.00);*/
							display:table-cell;
							vertical-align: middle ;
							width:230px;
							line-height:22px;
							text-align:center;
							font-family: 'Open Sans Condensed', Arial Narrow, sans-serif;
							font-weight:300;
							font-size:1.25em;
							padding-bottom:3px;}		
.image 						{width:250px; 
							height:155px;
							float:left; 
							overflow:hidden; 
							cursor:pointer;
							background-size: 100% 100%;
							-moz-transition: all .5s;
							-webkit-transition: all .5s;
							transition: all .5s;
							background-position: center; 
							transform:rotate(0.2deg); } 
.image:hover				{background-size: 120% 120%;}

					
/*CONTENT*/	

.wrapper_main				{padding-top:5px; 
							overflow:hidden}							
.content					{float:left; 
							min-width:255px;
							max-width:990px; 
							margin: 10px 5px 0px 170px;
							height:100%;}
.content_text				{width:97%; padding: 0px 5px;}
.grossbild					{float:left; 
							width:100%; 
							min-width:255px;
							display:block;
							padding: 0% 0% 1.3% 0%;}

.links						{float:left; 
							width:50%;}
.rechts						{float:right; 
							width:50%;}
.bildl      				{ float:left; 
							width:98.6%;
							max-width:487px;}
.bildr      				{float:right; 
							width:98.6%; 
							max-width:487px;}
.kleinbilder-toggle			{display: none}
.grossbilder-toggle			{float:left; 
							width:100%; 
							min-width:255px;
							display:block;}							

.content img				{float:left; 
							box-shadow: rgba(0,0,0,1.00) ; 
							-webkit-box-shadow: 2px 2px 3px #ededed; 
							-moz-box-shadow: 2px 2px 3px #ededed; 
							box-shadow: 2px 2px 3px rgba(0,0,0,0.10);  
							border: 1px solid rgba(0,0,0,0.10);
							width:100%;height:auto;}

iframe						{box-shadow: rgba(0,0,0,1.00) ; 
							-webkit-box-shadow: 2px 2px 3px #ededed; 
							-moz-box-shadow: 2px 2px 3px #ededed; 
							box-shadow: 2px 2px 3px rgba(0,0,0,0.10);  
							border: 1px solid rgba(0,0,0,0.10);}
.vidplatz				{width:100%; height:1.3%; line-height:90%}
.kat						{margin:-5px 0px 0px 5px}
						
/*FORMULAR*/							

textarea, input 			{font-family:'Roboto', sans-serif; 
						 	font-size:80%; 
						  	letter-spacing:0.0625em}																
input[type=text]			{width:97%; min-width:15em;
							box-shadow: rgba(0,0,0,1.00) ; 
							-webkit-box-shadow: 2px 2px 3px #ededed; 
							-moz-box-shadow: 2px 2px 3px #ededed; 
							box-shadow: 2px 2px 3px rgba(0,0,0,0.10);  
							border: 1px solid rgba(0,0,0,0.10);}
textarea					{width:97%; min-width:15em; height:15em;
							box-shadow: rgba(0,0,0,1.00) ; 
							-webkit-box-shadow: 2px 2px 3px #ededed; 
							-moz-box-shadow: 2px 2px 3px #ededed; 
							box-shadow: 2px 2px 3px rgba(0,0,0,0.10);  
							border: 1px solid rgba(0,0,0,0.10);}
.kontakt			{width:15%; min-width:10em;
							background-color: hsla(0,0%,100%,1.00);
							color:rgba(106,106,106,1.00);
							box-shadow: rgba(0,0,0,1.00) ; 
							-webkit-box-shadow: 2px 2px 3px #ededed; 
							-moz-box-shadow: 2px 2px 3px #ededed; 
							box-shadow: 2px 2px 3px rgba(0,0,0,0.10);  
							border: 1px solid rgba(0,0,0,0.10);}
							
/*TEXT*/

.form						{margin-top:-10px;}
.kurztext					{width:97%; min-width:15em;}
.kleintext					{/*background-color: hsla(255,100%,40%,0.2)*/;
							display: inline-block;
							margin:5px 5px 0px 5px;
							text-align:justify}
.kleintext a					{color: rgba(106,106,106,1.00); text-decoration:none;}
.kleintext a:hover		{color:rgba(0,187,255,1.00);}
.kleintext_meta 			{margin:5px 5px 0px 5px;}
.kleintext_meta a 			{color:rgba(0,187,255,1.00);
									text-decoration:none;}
.con						{/*background-color: hsla(255,100%,40%,0.2)*/;
							margin:5px 5px 0px 5px;}
							
/*FOOTER*/

footer						{width:100%;
								float:left;
								margin-top:70px;
								/*position: absolute;
								bottom:0px;
								background-color:#EF3134;*/}
footer .meta, footer p			
								{width:100%;
								margin-bottom:0px;
								padding:0px; 
								text-align:center;
								word-spacing:3px;
								margin:10px auto;}
footer p					{font-size:80%;}
footer  .meta a 		{display:inline;  margin: 0px 10px;}

/*FARBEN*/

/*	
OBEN NAVI auskommentieren:
.logo_weiss					{ display:none;}

UNTEN NAVI auskommentieren:
.logo_weiss					{ display:none;}
						
body						{background-color: rgba(204,204,204,1);
							color: rgba(102,102,102,1);}
.logo						{ display:none}
.logo_weiss					{width:150px; 
							height:68px; 
							margin:auto; 
							margin-bottom:20px; 
							margin-top:10px;}
h1, h2, h3, h4, h5, h6		{color:#000;}	
.box_c						{	background-color:#fff;
							border-top:1px solid rgba(204,204,204,1);}

.titel						{color:#000;}

.tags a, .meta a, .box_c a
							{color: rgba(102,102,102,1));}
.tags a:hover, 
.meta a:hover, .box_c a:hover 	
							{color: rgba(0,187,255,1.00);}
.kontakt					{background-color: hsla(0,0%,100%,1.00);
							color:rgba(106,106,106,1.00);}
							
.kleintext a				{color:rgba(0,187,255,1.00);
								text-decoration:none;}
												
	 @media screen and (max-width: 439px) {
							
nav h2:hover, nav h2:active { color: rgba(0,187,255,1.00); -webkit-user-select: none; -webkit-touch-callout: none}
*/


/*SCHWARZ*/

/*
OBEN NAVI auskommentieren:
.logo_weiss					{ display:none;}

body						{background-color:#000;
							color: rgba(153,153,153,1);}
.logo						{ display:none}
.logo_weiss					{width:150px; 
							height:68px; 
							margin:auto; 
							margin-bottom:20px; 
							margin-top:10px;}
h1, h2, h3, h4, h5, h6		{color:#fff;}	
.box_c						{	background-color:#fff;
							border-top:1px solid #000;}
.titel						{color:#fff;}

.tags a, .meta a, .box_c a
							{color: rgba(153,153,153,1);}
.tags a:hover, 
.meta a:hover, .box_c a:hover 	
							{color: rgba(0,187,255,1.00);}
.kontakt					{background-color: hsla(0,0%,100%,1.00);
							color:rgba(106,106,106,1.00);}*/


/*GRAU*/
	
/*body						{background-color: rgba(204,204,204,1);
							color: rgba(102,102,102,1);}

h1, h2, h3, h4, h5, h6		{color:#000;}	
.box_c						{	background-color:#fff;
							border-top:1px solid rgba(204,204,204,1);}

.titel						{color:#000;}

.tags a, .meta a, .box_c a
							{color: rgba(102,102,102,1));}
.tags a:hover, 
.meta a:hover, .box_c a:hover 	
							{color: rgba(0,187,255,1.00);}
.kontakt					{background-color: hsla(0,0%,100%,1.00);
							color:rgba(106,106,106,1.00);}*/

@media screen and (max-width: 439px) {
							
h1, h2, h3, h4, h5, h6				{width:100%;
							text-align:center; 
							margin:0px;
							padding:0px;
							margin-bottom: 10px;}		
.kleintext_meta				{text-align:center;}
.kat						{margin:0px auto;padding:0px}
.logo						{margin: 5px auto;}

/*.logo						{display:none}
.logo_weiss					{margin: 5px auto;}*/
nav							{width:100%;}
#navigation					{position: inherit;}
nav h2						{padding:0px 0px 10px 0px; 
							margin-bottom:0px;}
nav h2:hover				{color: rgba(0,187,255,1.00);
							text-decoration:none;}
.titel						{width:100%;
							margin:8px 0px 5px 0px}
.titel_a					{display:inline; 
							margin: 0px 10px;}
.tags   					{height: 50px;
							margin:0px;
							padding:0px; 
							overflow:hidden;
							width:100%;
							text-align:center;}		
.tags a						{display:none;}
.tags:hover					{width:100%; height:100%;}
.tags:hover span:after 		{content: " hover";
							display:none}
.tags:hover a				{display:block;}
.meta						{width:100%;
							margin-bottom:5px;
							padding:0px;
							text-align:center;}															
.tags a, .meta a, .box_c a 	{display:inline;  margin: 0px 10px;}
.tags						{border-bottom:3px solid  rgba(106,106,106,1.00);}
.wrapper_main				{clear:left;
							padding-top:0px;}
.center						{width:255px; margin:0px auto}

.content					{clear:left;
							margin:0px;
							width:100%;}
.form						{margin-top:0px;}	

.farben						{border-bottom:3px solid  rgba(106,106,106,1.00);}						
							
		
			}
			
@media screen and (min-width: 650px) {	
			
.kleinbilder-toggle			{float:left; 
							width:100%; 
							min-width:255px;
							display:block;
							padding: 0% 0% 1.3% 0%;}
.grossbilder-toggle			{display:none}														
	
input[type=text]			{width:70%;}
textarea					{width:70%;}

.kurztext					{width:70%; min-width:15em;}




			}