@charset "UTF-8";
/* CSS Document */



@font-face { font-family: 'font'; src:url(ami.otf)  }
@font-face { font-family: 'font2'; src:url(SuisseReg.otf)  }
@font-face { font-family: 'font3'; src:url(GT-Haptik-Regular-2.ttf)  }

body{
	margin:0;
	padding:0;
	background:black;
	}

.dreieck_klein { display:none}	
.dreieck_gross { display:block;}	

	
.schatten {
	box-shadow:5px 5px 5px rgba(0,0,0,0.3)}	
	
.floatL {
	float:left;}	
.floatR {
	float:right;}	
	
a {
	text-decoration:none;
	color:black;
	cursor:url(c_klein-01.png) 30 0, auto;
}	
	
a:hover {
	color:white;
	background:black;
}	
	
	
	
	/* M E N U */

#menu {
	width:90%;
	height:97vh;
	position:fixed;
	background:white;
	left:5%;
	box-shadow:0px 5px 10px rgba(0,0,0,0.3);
	z-index:200;
	transition:height 300ms;
	cursor:url(HAND-05.png) 30 0, auto;
	}
.menu_box_m_mobile {
	display:none;}

.menu_box_m_wrap:hover {
	width:90px;

}
.menu_box_mbox{	
	padding-top:27px;
	padding-bottom:20px;

}

.menu_box_m  {
	float:left;
	font: 27px font3;
	letter-spacing:0.5px;
	padding-left:20px;
	margin-right:0px;
	cursor:url(c_klein-01.png) 30 0, auto;
	}


.menu_box_m_titel {
	margin-left:20px;
	margin-top:-9px;
	margin-right:24px;

}	

.menu_box_mbox:hover .kreis {
	background:black;
}


#menu_links_1, #menu_links_2 {
	d}	


.kreisspan {
		font: 68px font2;
		line-height:0px;
		position:relative;
		top:12px;
		left:8px;
}

.kreisspan_klein {
		font: 23px font2;
		line-height:0px;
		position:relative;
		top:-1px;
		left:2px;
		right:3px;
}

.kreisspan_uhr {
		font: 34px font2;
		line-height:0px;
		position:relative;
		top:2px;
		left:5px;
}

.kreisspan_preis {
		font: 32px font2;
		line-height:0px;
		position:relative;
		top:-2px;
		left:0px;
}
.jahrspan{
	font-family:font3;
		line-height:0px;
		margin-bottom:30px;
}
	
.kreis {
	background:white;
	margin-top:-6px;
	float:left;
	width:18px;
	height:18px;
	border-radius:18px;
	border:1px solid black;
	margin-left:-6px;
	position:absolute;
	transition: all 150ms;
}
.kreis_t {
	background:white;
	margin-top:-6px;
	float:left;
	width:14px;
	height:14px;
	border-radius:14px;
	border:1px solid black;
	transition: all 150ms;
}
	
.pfeil_wrap {
	margin-top:-5px;
	float:left;
	width:28px;
	height:12px;
	position:absolute;
	overflow:hidden;
	transition: all 200ms;

	}
	
.pfeil {
	margin-top:5px;
	margin-left:5px;
	width:14px;
	height:14px;
	border:1px solid black;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transition: background 250ms;}
	
.kreuz_svg {fill:;stroke:white;stroke-width:1; transition:fill 130ms;}
.dreieck_svg {fill:white;stroke:black;stroke-width:1; transition:fill 130ms; }
.menu_box_mbox:hover .dreieck_svg {fill:black;}
.dreieckW_svg {fill:white;stroke:white;stroke-width:1; }

.dreieck_svg_wrap {viewbox:0 0 22 27}

	
.menu_box_mbox:hover .pfeil_wrap .pfeil {
	background:black;
}
	
	
#menu_bg {
	width:100vw;
	height:100vh;
	background:rgba(0,0,0,0.3);
	display:none;
	position:absolute;
	z-index:190;
	transition:background 250ms;
	cursor:url(c_klein-01.png) 30 0, auto;
}	
	
#menu_bg:hover {
	background:rgba(0,0,0,0);
	}		
	
.about {
	display:none;
	width:calc(100%-80px); 
	padding:20px 40px; 
	height:100%;
	overflow:scroll;
}

#about_zu {
	background:black;
	text-align:center;
	width:40px;
	height:40px;
	font:23px font3;
	border-radius:40px;
	color: white;
	position:absolute;
	top:15px;
	right:calc(2% + 25px);
	box-shadow:3px 3px 10px rgba(0,0,0,0.2);
	z-index:2000;
	cursor:url(c_klein-01.png) 30 0, auto;
	transition:all 200ms;
	display:none;
}

#about_zu:hover {
	background:white;
	}

#about_zu:hover .kreuz_svg { stroke:black;}
.img_about {
	height:23px; }	
	
	
	
	/* C O N T E N T */	

.content_wrap {
	perspective: 1px;
  	height: 100vh;
  	overflow-x: hidden;
  	overflow-y: auto;
	cursor:url(HAND-05.png) 30 0, auto;
}

.cont_spalten {
	width:50%;
	height:100vh;
	float:left;
	position: absolute;
}
	
#cont_spalte_2 {	
	-webkit-transform: translateZ(-0.5px) scale(1.5);
    -moz-transform: translateZ(-0.5px) scale(1.5);
    -ms-transform: translateZ(-0.5px) scale(1.5);
    -o-transform: translateZ(-0.5px) scale(1.5);
    transform: translateZ(-0.5px) scale(1.5);
	left:62.5%;
}


.cont_box {
	width:100%;
	position:relative;
	overflow:hidden;
	transition:opacity 300ms;

	}

.cont_box_sliderwrap {
	width:100%;
	overflow:hidden;
}
		

.cont_box_sliderboxwrap {
	transition:left 300ms;

	}
	
.cont_box_sliderbox {
	float:left;
	position:relative; 
}		
	

	
	
.cont_box_credit_wrap {
	width:100%;
	height:100%;
	overflow:hidden;
	position:absolute;
	bottom:0;
	z-index:2;
}
.cont_box_credit {
	font: 27px font3;
	width:calc(100% - 50px);
	padding:25px;
	bottom:-100%;
	background:white;
	position:absolute;
	/*box-shadow:-5px -5px 5px rgba(0,0,0,0.2);*/
	
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
	
}	
	

	
.cont_box_fragezeichen {
	width:50px;
	height:50px;
	position: absolute;
    bottom: 9px;
    right: 50px;
	font: 20px font;
	color:white;
	cursor:url(c_klein-01.png) 30 0, auto;
	z-index:2000;
}

.dreieckwrap {
	margin-top:26px;
	margin-left:16px;
	width:21px;
	height:21px;}


	
	
.cont_box_dreieck {
	width:70px;
	height:70px;
	position: absolute;
    bottom: 0px;
    right:  0px;
	cursor:url(c_klein-01.png) 30 0, auto;
	z-index:1002;
	background:;
}






.cont_box_prev {
	position:absolute;
	left:0;
	width:50%;
	height:100%;
	z-index:999;
	cursor:url(HAND2-02.png) 50 10, auto;}

.cont_box_next {
	position:absolute;
	right:0;
	width:50%;
	height:100%;
	z-index:1000;
	cursor:url(HAND2-03.png) 10 10, auto;}
.cont_box_play {
	width:50%;
	height:100%;
	left:25%;
	position:absolute;
	z-index:1001;
	cursor:url(play1-01.png) 50 10, auto;}







.slbox_first{	
}

.slbox_mitte {
	margin: auto; 
	position: absolute; 
	top: 0; 
	left: 0; 
	bottom: 0; 
	right: 0;
}
		
.w100 {
	width:100%;
}

.w80 {
	width:80%;
}	

.w50 {
	width:52%;
}		


.loadmore {
	width:100%;
	height:500px;}
	
	
	
	
	
	
	
	
	
/* Let's get this party started */
.content_wrap::-webkit-scrollbar {
    width: 3px;
	background:black
}
  .content_wrap::-webkit-scrollbar-thumb {
	background:white
	;}

.about::-webkit-scrollbar {
    width: 1px;
}
   .about::-webkit-scrollbar-thumb {
	background:black
	;}
	





.img_popup{
	
	width:52%; float:right;}
.text_popup {
	width:46%; 
	float:left;
	font:27px font3;  
	float:left;}