/* roboto-slab-100 - latin */
@font-face {
	font-family: 'Roboto Slab';
	font-style: normal;
	font-weight: 100;
	src: url('../fonts/roboto-slab-v24-latin-100.eot'); /* IE9 Compat Modes */
	src: local(''),
			 url('../fonts/roboto-slab-v24-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
			 url('../fonts/roboto-slab-v24-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
			 url('../fonts/roboto-slab-v24-latin-100.woff') format('woff'), /* Modern Browsers */
			 url('../fonts/roboto-slab-v24-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
			 url('../fonts/roboto-slab-v24-latin-100.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}
/* roboto-slab-300 - latin */
@font-face {
	font-family: 'Roboto Slab';
	font-style: normal;
	font-weight: 300;
	src: url('../fonts/roboto-slab-v24-latin-300.eot'); /* IE9 Compat Modes */
	src: local(''),
			 url('../fonts/roboto-slab-v24-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
			 url('../fonts/roboto-slab-v24-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
			 url('../fonts/roboto-slab-v24-latin-300.woff') format('woff'), /* Modern Browsers */
			 url('../fonts/roboto-slab-v24-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
			 url('../fonts/roboto-slab-v24-latin-300.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}
/* roboto-slab-regular - latin */
@font-face {
	font-family: 'Roboto Slab';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/roboto-slab-v24-latin-regular.eot'); /* IE9 Compat Modes */
	src: local(''),
			 url('../fonts/roboto-slab-v24-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
			 url('../fonts/roboto-slab-v24-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
			 url('../fonts/roboto-slab-v24-latin-regular.woff') format('woff'), /* Modern Browsers */
			 url('../fonts/roboto-slab-v24-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
			 url('../fonts/roboto-slab-v24-latin-regular.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}
/* roboto-slab-700 - latin */
@font-face {
	font-family: 'Roboto Slab';
	font-style: normal;
	font-weight: 700;
	src: url('../fonts/roboto-slab-v24-latin-700.eot'); /* IE9 Compat Modes */
	src: local(''),
			 url('../fonts/roboto-slab-v24-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
			 url('../fonts/roboto-slab-v24-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
			 url('../fonts/roboto-slab-v24-latin-700.woff') format('woff'), /* Modern Browsers */
			 url('../fonts/roboto-slab-v24-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
			 url('../fonts/roboto-slab-v24-latin-700.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}
/*======================================================= 
				 S I M P L E   R E S E T 
=======================================================*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

body { 
	font-size:1em; 
}
/* end Reset */


/*======================================================= 
		  K L A S S E N   D E F I N I T I O N 
=======================================================*/
.marg-bottom-20	{ margin-bottom:20px; }
.marg-top-20 	{ margin-top:20px; }
/* end Klassen-Definition */

/*======================================================= 
					F O N T S 
=======================================================*/
@font-face { 
	font-family: 'trade-gothic-light'; 
	src: ulr('../fonts/tradegothic-light.eot');
	src: url('../fonts/trade-gothic-light.ttf') format('truetype'), 
		 url('../fonts/tradegothic-light.woff') format('woff'); 
}


p { 
	font-family: 'Roboto Slab', serif; 
	font-size:1.2em; 
	color:white;
}

a { 
	text-decoration:none; 
	color:white; 
}

h1, h2 		{ font-size:4em; font-weight:800; color:white; font-family:helvetica; }
h3, h4, h5 	{ font-family: helvetica; }
h1 span {
    font-size: 1em;
    font-family: sans-serif;
    color: rgba(63, 78, 87, 1);
    text-shadow: 1px  1px 1px white,
                  1px -1px 1px white,
                 -1px  1px 1px white,
                 -1px -1px 1px white;
}

.p_first {  
	font-family: 'Roboto Slab', serif; 
	font-size:1.2em; 
	color:white;
	text-align:right; 
	margin-right:20px; 
	margin-top:20px;
}

.p_second {  
	padding-bottom:30px; 
	margin-top:5px;
	font-size:.97em;
	font-family: 'trade-gothic-light', format('truetype'); 
	font-weight:100;
}

.p_third {  
	font-size:1.2em; 
	color:white; 
	font-weight:300; 
	font-family: 'Roboto Slab', serif; 
}

.p_fourth {  
	margin:0; 
	font-size:1em; 
	font-weight:500; 
	font-family: 'Roboto Slab', serif;

}
/* end Fonts */



/*======================================================= 
					C O N T E N T
=======================================================*/

ul 					{ list-style:none; clear:both; padding-left:20px; }
li 					{ float:left;  }
li:first-child 		{ width:500px; margin-right:5%; }
li:nth-child(2) 		{ text-align:right;  }
li:nth-child(2) span 	{ text-align:left; } 

#wrapper {
	position:relative;
	margin:auto;
	margin-top:0.2%; 			
	width:100%;
	background:white;
	height:100%; 
}

#container {
	position:relative;
	width:100%;
	margin:auto;
	overflow:hidden;
	background:white;
}

/* clear fix */
#container:after {
	content: '';
	display:block;
	clear:both;
}

.item { 
	position:relative;
	z-index:3;
	width:10%;				
	height:0;
	margin:0;
	padding:0;
	padding-bottom:7.8%;		
	counter-increment: item;
	border:2px solid white;
	background:white;
}

.item img {
	//width:100%;
	
}

.item.w2 { 
	width:20%;	
	margin-right:-0.1%;			
	height: 0;
	padding-bottom:7.8%;
}

.item.w4 { 
	width:40.3%;	
	margin-right:-0.3%;
	height: 0;
	padding-bottom:15.8%;
	margin-bottom:0.1%;
}

.item.w6 {
	z-index:1;
	width:60.5%;		
	margin-right:-0.5%;
	height: 0;
	padding-bottom:24%;
	margin-bottom:-0.1%;
	margin-top:-0.1%;
	background-image:url(../images/pattern.jpg);
	background-repeat:repeat;
	background-size:contain;
}

.item.h2 {
	width:10%;
	height:0;
	padding-bottom:15.9%;
}

.pic-1 { 
	background-image:url(../images/orgassa_end_1.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-2 { 
	background-image:url(../images/orgassa_end_2.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-3.item.w4 { 
	background-image:url(../images/orgassa_end_3.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-4 { 
	background-image:url(../images/orgassa_end_4.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-5 { 
	background-image:url(../images/orgassa_end_5.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-6 { 
	background:#65747C;
}

.pic-7 { 
	background-image:url(../images/orgassa_end_6.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-8 { 
	background-image:url(../images/orgassa_end_7.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-9 { 
	background-image:url(../images/orgassa_end_8.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-10.item.w2 { 
	background-image:url(../images/orgassa_end_9.jpg);
	background-size:120%;
	background-repeat:no-repeat;

}

.pic-11 { 
	background-image:url(../images/orgassa_end_10.jpg);
	background-size:120%;
	background-repeat:no-repeat;

}

.pic-12 {
	background:#D7DDE1;
}

.pic-13 {
	background-image:url(../images/orgassa_end_11.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-14 {
	background:#78868E;
}

.pic-15 {
	background-image:url(../images/orgassa_end_12.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-16 {
	background-image:url(../images/orgassa_end_13.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-17 {
	background-image:url(../images/orgassa_end_14.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-18 {
	background-image:url(../images/orgassa_end_15.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-19.item.w2 {
	background-image:url(../images/orgassa_end_16.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-20 {
	background:#78868E;
}

.pic-21 {
	background-image:url(../images/orgassa_end_17.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-22 {
	background-image:url(../images/orgassa_end_18.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-23 {
	background-image:url(../images/orgassa_end_19.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-24 {
	background-image:url(../images/orgassa_end_20.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-25 {
	background-image:url(../images/orgassa_end_21.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-26 {
	background-image:url(../images/orgassa_end_27.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-27 {
	background:#78868E;
}

.pic-28 {
	background-image:url(../images/orgassa_end_22.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-29 {	
	background:#78868E;
}

.pic-30.item.h2 {	
	background-image:url(../images/orgassa_end_23.jpg);
	background-size:120%;
	background-position:center center;
	background-repeat:repeat;
}

.pic-31 {
	background-image:url(../images/orgassa_end_24.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-32 {
	background-image:url(../images/orgassa_end_25.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-33 {
	background-image:url(../images/orgassa_end_26.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-34 {
	background-image:url(../images/orgassa_end_28.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-35 {
	background:#B0BBC2;
}

.pic-36 {
	background:#D7DDE1;
}

.pic-37 {
	background-image:url(../images/orgassa_end_33.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-38 {
	background-image:url(../images/orgassa_end_29.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-39 {
	background-image:url(../images/orgassa_end_30.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-40 {
	background-image:url(../images/orgassa_end_31.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-41 {
	background:#78868E;
}

.pic-42 {
	background-image:url(../images/orgassa_end_32.jpg);
	background-size:120%;
	background-repeat:no-repeat;
}

.pic-90 {
	background:#B0BBC2;
	display:none;
}

.pic-91 {
	background-image:url(../images/orgassa_end_14.jpg);
	background-size:120%;
	background-repeat:no-repeat;
	display:none;
}

.pic-92 {
	background:#B0BBC2;
	display:none;
}

.pic-93 {
	background-image:url(../images/orgassa_end_14.jpg);
	display:none;
}

#impressum {
	position:absolute;
	z-index:1;
	margin:auto;
	left:-100%;
	width:100%;
	height:103%;
	margin-left:-5%;
	margin-top:-5%;
	padding-bottom:10%;
	padding-left:20px;
	padding-top:20px;
	background:white;
	opacity:1;
	padding-right:40%;
	overflow:scroll;
}

#footer { 
	position:absolute; 
	right:0; 
	bottom:10px;
	clear:both;  
	text-align:right; 
	margin-right:20px; 
}


/*======================================================= 
				I M P R E S S U M
=======================================================*/
#impressum p 	{ font-size:1em; color:black; font-family:helvetica; font-weight:light;}
#impressum a		{ font-size:1em; color:black; font-family:helvetica; font-weight:light; }
#impressum h3 	{ font-size:2em; font-weight:800; }
#impressum h4 	{ font-size:1em; font-weight:800; }
#impressum h5 	{ font-size:1em; }

.klick 			{ cursor:pointer; }
div.klick 		{ font-size:2em; position:absolute; bottom:20px; right:20px; font-family:helvetica; font-weight:100;}
/* end Impressum */


/*======================================================= 
			M E D I A    Q U E R I E S
=======================================================*/
@media only all and (max-width: 1600px) {
	#wrapper { 
		width:99%;
	}
	
	.item.w6 	{ 
		width:70%; 
		padding-bottom:32.1%;
		margin-bottom:0%;
		margin-top:0%;
		
	}
	
	.item.w4 	{ 
		width:40%; 
		padding-bottom:15.9%; 
		margin-bottom:0%;
	}
	
	.item.w2 	{ 
		width:20%; 
		padding-bottom:7.8%; 
	}
	
	.item.h2 	{ 
		padding-bottom:15.9%; 
	}
	
	.pic-41, .pic-42, .pic-40 { display:none; }
	
	
	h1, h2		{ font-size:3.65em; }
	h1 span		{ font-size:1em; }
	.p_first 	{ font-size:.9em; }
	.p_second 	{ font-size:.9em; }
	.p_third 	{ font-size:.9em; } 
	.p_fourth 	{ font-size:.9em; }
}

@media only all and (max-width: 1360px) {
	.item.w6 { 
		width:80.0%; 
		padding-bottom:32.2%;
		margin-bottom:0;
		margin-right:-1%;
		padding-right:1%;
		margin-top:-0.1%;
	}
	
	.item.w4 	{ 
		width:40.4%; 
		padding-bottom:15.9%; 
		margin-right:-0.4%;
	}
	
	.item.w2 	{ 
		width:20.1%; 
		padding-bottom:7.7%; 
		margin-right:-0.1%;
		margin-bottom:0.2%;
	}
	
	.pic-13, .pic-14 { display:none; }
	.pic-41, .pic-42 { display:none; }
	.pic-40 { display:block; }
}

@media only all and (max-width: 1250px) {
	#wrapper { 
		width:100%; 
	}
	
	.item.w6 { 
		width:99.9%; 
		padding-bottom:39%; 
	}
	
	.item.w4 { 
		width:39.9%; 
		margin:0;
	}
	
	.item.w2 { 
		width:19.9%; 
		margin:0;
	}
	
	.pic-13, .pic-14 { display:none; }
	.pic-41, .pic-42 { display:block; }
	
	
	h1, h2		{ font-size:4.4em; }
	h1 span		{ font-size:1.1em; }
	.p_first 	{ font-size:1.1em; }
	.p_second 	{ font-size:1.1em; }
	.p_third 	{ font-size:1.1em; } 
	.p_fourth 	{ font-size:1.1em; }
}

@media only all and (max-width: 960px) {
	h1, h2		{ font-size:3.6em; }
	h1 span		{ font-size:1em; }
	.p_first 	{ font-size:.9em; }
	.p_second 	{ font-size:.9em; }
	.p_third 	{ font-size:.9em; } 
	.p_fourth 	{ font-size:.9em; }
}

@media only all and (max-width: 850px) {
	.item.w6 { 
		width:99.2%; 
		padding-bottom:93%; 
		margin-right:-0.2%; 
		margin-bottom:0.1%; 
		overflow:scroll; 
	}
	
	
	.item.w4 			{ 
		width:39.7%; 
		padding-bottom:15.9%; 
	}
	
	.item.w2 			{ display:none; }
	.pic-13, .pic-14, 
	.pic-90, .pic-91 	{ display:block; }
	li 					{ clear:both; margin-bottom:50px; height:250px; }
	li:last-child 		{ height:200px;  }
	#footer 				{ position:relative; margin-bottom:-300%;}
	h1, h2 				{ font-size:4.5em; }
	.p_first 			{ font-size:1.1em; }
	.p_second 			{ font-size:1.1em; }
	.p_third 			{ font-size:1.1em; } 
	.p_fourth 			{ font-size:1.1em; }
}	


@media only all and (max-width: 650px) {
	.item { 
		width:9.9%; 
		border:2px solid white; 
		background-size:130%;
	}
	
	.item.w6 { 
		width:99.5%; 
		margin-right:-0.2%; 
		height:230px; 
		padding-bottom:0; 
		margin-bottom:0.1%; 
		overflow:scroll; 
	}
	
	.item.w4 { 
		width:39.5%; 
		padding-bottom:16%; 
	}
	
	.item.w2 { display:none; }
	
	.pic-13, .pic-14, 
	.pic-90, .pic-91
	.pic-92	{ display:block; }
	
	li { 
		clear:both; 
		margin-bottom:50px; 
		height:230px; 
	}
	h1, h2 		{ font-size:2em; }
	.p_first 	{ font-size:.9em; }

	.p_second 	{ font-size:.9em; }

	.p_third 	{ font-size:.9em; } 

	.p_fourth 	{ font-size:.9em; }
	
	li:last-child 		{ height:150px;  }
	#impressum 			{ margin-top:-22%; }
	#footer 				{ position:relative; }
}

@media only all and (max-width: 420px) {
	.item		{ width:9.8%; border:1px solid white; }
	.item.w4	{ width:39%; padding-bottom:16%; }
	.item.w6	{ width:98.0%; height:470px; padding-bottom:0px;}
	h1, h2 		{ font-size:2em; }
	li			{ height:200px; margin-bottom:20px; padding-bottom:0;}
	li:last-child{ clear:both; float:left; text-align:left; margin-bottom:0px;}
	.item.w6 ul li	{ width:98%; }
	.p_first 	{ font-size:.9em; }

	.p_second 	{ font-size:.9em; }

	.p_third 	{ font-size:.9em; } 

	.p_fourth 	{ font-size:.9em; }
	div.klick 	{ font-size:1.8em; position:relative; padding-top:50px; margin-left:20px; }
	#footer		{ margin-left:.3%; padding-bottom:20px;}
	.p-fourth	{ text-align:justify; }
	#impressum 	{ margin-top:-12%; }

}
/* end Responsiv */


/************* >>> T A T O R T   W E B <<< *************/
/************* >>> www.tatort-web.com <<< **************/