/* video */
#video { 
	position: absolute; 
	top: 0; 
	left: 0; 
	bottom: 0; 
	right: 0; 
	width: 100%; 
	height: 100%; 
	background: rgba(0,0,0,1);
	overflow: hidden;
}
video { 
	min-width: 100%; 
	min-height: 100%; 
	position: absolute; 
	top: 0; 
	left: 0; 
	bottom: 0; 
	right: 0;
	position: fixed;
}
.overlay { 
	background: rgba(255.255.255,0.0); 
	position: absolute; 
	position: fixed;
	top: 0; 
	left: 0; 
	bottom: 0; 
	right: 0; 
	width: 100%; 
	height: 100%; 
	z-index: 1;
	}

body, html { 	
	margin: 0; 
	padding: 0;
	width: 100%; 
	height: 100%; 
	font-family: "Lato",sant-serif;
	letter-spacing: 0px;
	word-spacing: 5px;
    font-size: 16px;
    font-weight: 300;
    color: rgba(34,34,34,1);
}

h1 {
	margin: 0;
	padding: 0;
	font-family: 'Julius Sans One', sans-serif;
	font-size: 50px;
	color: rgba(188,188,188,1);
	letter-spacing: 4px;
	word-spacing: 4px;
}
h2 {
	margin: 0;
	padding: 0;
	font-family: 'Julius Sans One', sans-serif;
	font-size: 30px;
	color: rgba(255,106,0,0.7);
	letter-spacing: 0px;
	word-spacing: 0px;
}
h3 {
	margin: 0;
	padding: 0;
    font-size: 20px;
    font-weight: 300;
	letter-spacing: 1px;
	word-spacing: 1px;
	color: rgba(255,106,0,1);
}
h4 {
	margin: 0;
	padding: 0;
    font-size: 20px;
    font-weight: 300;
	letter-spacing: 1px;
	word-spacing: 1px;
}

/* navigation */
#navigon {
	margin: 0;
	padding: 0;
	width: 100%;
	position: fixed;
	background-color: rgba(255,255,255,1);
	z-index: 90;
}
.navigation {
	margin: 0 auto;
	padding: 0;
	max-width: 1100px; 
	height: 100px; 
}
.owner {
	float: left;
	margin: 30px 0 0 0;
}
.owner a {
	text-decoration: none;
	outline: none;
}
nav ul {
	float: right;
	margin: 55_px 10px 0 0;
	padding: 0;
	list-style: none;
	text-align: center;
}
nav li {
	list-style: none;
	display: inline-block;
/*	width: 200px; */
	margin: 0 0 0 20px;
	padding: 0;
}	
nav a { 
	text-decoration: none;
	outline: none;
	display: block;
	width: 110%;
	font-family: 'Julius Sans One', sans-serif;
    font-size: 20px;
    font-weight: 300;
	word-spacing: 3px;
	letter-spacing: -0.5px;
	color: rgba(188,188,188,1);
}
nav a:hover {
	transition: 250ms;
	color: rgba(255,106,0,1);
}
.line_nav{
	clear: both;
	top: 90px;	
	width: 100%;
	height: 1px;
	background-color: rgba(255,106,0,0.7);
}

/* wrapper */
#wrapper  {  
	position: absolute;
	width: 100%;
	height: auto;
}

/* header */
#header { 
	margin: 0;
	padding: 0;
	width: 100%; 
	height: auto;
	background-color: rgba(255,255,255,1);
}
.header_1 {
	margin: 0;
	padding: 0;
	width: 950px; 
	height: 200px; 
}
.header_2 {
	margin: 0;
	padding: 0;
	width: 100%; 
	height: auto; 
}
.uh_image { 
	margin: 0 auto;
	padding: 0;
	width: 1100px;
	height: 395px;
	background-image: url(../image/uh4.png); 
	animation: fadein 4s;
    -moz-animation: fadein 4s; 
    -webkit-animation: fadein 4s; 
    -o-animation: fadein 4s;    
}
@keyframes fadeIn {
    from {opacity:0;}to {opacity:1;}
}
@-moz-keyframes fadein { /* Firefox */
    from {opacity:0;}to {opacity:1;}
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {opacity:0;}to {opacity:1;}
}
@-o-keyframes fadein { /* Opera */
    from {opacity:0;}to {opacity: 1;}
}
.header_3 {
	margin: 0 auto;
	padding: 0;
	width: 1100px; 
	height: 470px; 
}
.bowie_image {
	float: left;
	margin: 100px 0 0 100px;
	padding: 0;
	width: 100px;
	height: 100px;
	background-image: url(../image/rip_bowie.jpg);
}
.bowie_image_text {
	float: left;
	margin: 160px 0 0 10px;
	padding: 0;
	height: 23px;
	width: 400px;
	font-family: "Julius Sans One",sans-serif;
	letter-spacing: 4px;
}

#two_wheels {
	clear: both;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 500px;
	background-image: url(../image/eni.png);
	background-position: 50% 50%;
}
.two_wheels_text {
	position: absolute; 
	margin: 50px 0 0 0;
	padding: 7px 0 0 30px;
	height: 23px;
	width: 780px;
	font-family: "Julius Sans One",sans-serif;
	font-weight: bold;
	letter-spacing: 4px;
    color: rgba(255,255,255,1);
	background-color: rgba(255,106,0,0.7);
}

/* headline */
.section_headline {
	margin: 0;
	padding: 110px 0 0 5px;
	font-family: 'Julius Sans One', sans-serif;
	font-size: 30px;
	color: rgba(255,106,0,0.7);
	letter-spacing: 0;
	word-spacing: 0;
}

/* about */
#about {
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	background-color: rgba(255,255,255,1);
} 
.about {
	margin: 0 auto;
	width: 1100px;
}
.about-text_l { 
	padding: 0 2% 160px 0;
	float: left;
	width: 48%;	
	height: 510px;
	line-height: 25px;
}
.about-text_r { 
	padding: 30px 0 25px 2%;
	float: right;	
	width: 48%;
	height: auto;
}
.about-image{ 
	margin: 0 auto;
	padding: 0;
	width: 374px;
	height: 500px;
	background-image: url(../image/uh2.png);
}
.about_dias {
	clear: both;
	margin: 0 auto;
	padding: 0;
	width: 1100px;
	height: 198px;
	background-image: url(../image/dia.png);
	background-position: 50% 50%;
}
.about_end {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 50px;
} 

/* video fenster */
#video_fenster { 
	margin: 0;
	padding: 0;
	width: 100%;
	height: 500px;	
}
.video_fenster_text {
	position: absolute;
	margin: 100px 0 0 0;
	padding: 7px 0 0 40px;
	height: 23px;
	width: 650px;
	font-family: "Julius Sans One",sans-serif;
	font-weight: bold;
	letter-spacing: 4px;
    color: rgba(255,255,255,1);
	background-color: rgba(255,106,0,0.7);
}

/* portfolio */
#portfolio {
	margin: 0; 
	padding: 0;
	width: 100%; 
	height: auto; 
	background-color: rgba(255,255,255,1);	
}
.portfolio_o {
	height: 780px;
}
.portfolio {
	margin: 0 auto;
	width: 1100px;	
}
.portfolio_text_1 {
	margin: 10px 0 0 8px;
	height: 20px;
}
.portfolio ul {
	margin: 20px 0px 0 8px; 
	padding: 0;
	width: 100%;
}
.portfolio li {
	margin: 0; 
	width: 100%;
	list-style: none;
	display: inline;
}

.work_box { width:350px; height:250px; margin: 8px; float:left; position:relative; overflow:hidden;}
.work_box .work_hover { z-index:20; width:350px; height:250px; position:absolute; top:0px; left:-370px; background: rgba(255,106,0,0.7); border: 1px solid; border-color:  rgba(255,106,0,0.7); transition:all 500ms; -moz-transition:all 500ms; -ms-transition:all 500ms; -o-transition:all 500ms; -webkit-transition:all 500ms;}
.work_box:hover .work_hover { left:0px; background: rgba(255,255,255,0.9);}
.work_box:hover h5 { left:0%;}
.work_box:hover h6 { left:0%;}
.work_box img { position:absolute; top:0; left:0; z-index:1;}
h5 { position:absolute; top:25%; left:-100%; z-index:30; color: rgba(255,106,0,0.9); text-align:center; width:100%; font-size:22px; letter-spacing: 3px;}
h6 { position:absolute; top:45%; left:-100%; z-index:30; color:rgba(34,34,34,1); text-align:center; width:100%; font-size:14px; font-weight: 200; letter-spacing: 0px;}
h5,h6, .work_hover{ transition:all 500ms; -moz-transition:all 500ms; -ms-transition:all 500ms; -o-transition:all 500ms; -webkit-transition:all 500ms;}

.portfolio_u {
	height: 680px;
}
.portfolio_text_2 {
	margin: -10px 0 0 8px;
	height: 20px;
}

/* galerie */
#galerie {
	margin: 0px auto;
	padding: 0;
	width: 100%;
	height: auto;
	background-color: rgba(255,255,255,1);
}
.or {
	margin: 0;
	width: 100%;
	height: 500px;
	background-image: url(../image/or.png);
	background-position: 50% 50%;
}
.or_text_1 {
	position: absolute;
	margin: 40px 0 0 0;
	padding: 7px 0 0 0;
	height: 23px;
	width: 320px;
	background-color: rgba(255,106,0,0.7);
	text-align: center;
	font-family: "Julius Sans One",sans-serif;
	font-weight: bold;
    font-size: 16px;
    color: rgba(255,255,255,1);
    letter-spacing: 4px;
}
.or_text_2 {
	margin: 10px 0 0 20px;
	padding: 5px 0 0 0;
	height: 16px;
	width: 280px;
	text-align: center;
	font-family: "Julius Sans One",sans-serif;
    font-size: 10px;
    color: rgba(255,255,255,0.3);
    letter-spacing: 2px;
}
.opel { 

	margin: 10px 0 0 0;
	width: 100%;
	height: 500px;
	background-image: url(../image/opel01.png);
	background-position: 50% 50%;
}
.opel_text_1 {
	position: absolute;
	margin: 40px 0 0 0;
	padding: 7px 0 0 0;
	height: 23px;
	width: 320px;
	background-color: rgba(255,106,0,0.7);
	text-align: center;
	font-family: "Julius Sans One",sans-serif;
	font-weight: bold;
    font-size: 16px;
    color: rgba(255,255,255,1);
    letter-spacing: 4px;
}
.opel_text_2 {
	margin: 10px 0 0 20px;
	padding: 5px 0 0 0;
	height: 16px;
	width: 280px;
	text-align: center;
	font-family: "Julius Sans One",sans-serif;
    font-size: 10px;
    color: rgba(255,255,255,0.3);
    letter-spacing: 2px;
}

/* contact start */
#contact {
	margin:0; 
	padding:0;
	width: 100%; 
	height: 280px; 
	background-color: rgba(255,255,255,1);
}
.contact{ 
	margin: 0 auto;
	width: 1100px;
}

.contact ul {
	margin: 30px 0 50px 0;
	padding: 0;
	text-align: center;
}
.contact li {
	margin: 0 10px 0 0;
	padding: 0;
	list-style: none;
	display: inline-block;
}
.contact a{
	margin: 0;
	padding: 5px 0 0 0;
	display: block;
	text-decoration: none;
	text-align: left;
	color: rgba(34,34,34,1);
	width: 110%;
	height: 22px;
}
.contact a:hover { 
	transition: 250ms;
	color: rgba(255,106,0,1);
}

#four_wheels { 
	margin: 0;
	padding: 0;
	width: 100%;
	height: 500px;
	background-image: url(../image/fourwheels.png);
	background-position: 50% 50%;
}
.four_wheels_text {
	position: absolute;
	right: 0px;
	margin-top: 100px;
	padding: 7px 0 0 0;
	height: 23px;
	width: 700px;
	background-color: rgba(255,106,0,0.7);
	text-align: center;
	font-family: "Julius Sans One",sans-serif;
	font-weight: bold;
    font-size: 16px;
    color: rgba(255,255,255,1);
    letter-spacing: 4px;
}

/* footer start*/
#footer {
	margin: 0;
	padding: 0;
	width: 100%; 
	height: auto;
	background-color: rgba(255,255,255,0.9);
}
.footer_text {
	padding: 60px 0 0 0;
	height: 220px;
	text-align: center;
	font-family: "Julius Sans One",sans-serif;
    font-size: 12px;
    color:  rgba(188,188,188,1);
    letter-spacing: 4px;
}