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

html{
	padding:0 0;
	margin:0 0;
	background-image: url(bilder/background.jpg);
  	background-size: cover;
	background-position:center;
	background-attachment:fixed;
	font-family: 'Oswald', sans-serif;
	color:#fff;
	overflow-y: scroll;
} 

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

a{
	text-decoration:none;
}
/*############################## MENU #########################*/
#menu h1{
	margin:0 0;
	padding:0 0;
	padding-top:0px;
	padding-bottom:5px;
	font-size:30px;
}


#menu{
	position:fixed;
	width:210px;
	height:100vh;
	background-color:rgba(0,0,0,0.7);
	padding-left:20px;
	padding-right:20px;
	margin-left:50px;
	box-shadow: 0px 0px 5px #111;
	text-align: center;
	font-size:18px;
}

#impressum{
	position:absolute;
	bottom:75px;
	right:10px;
}

#menu a{
	color:#fff;
	text-decoration:none;
}

#menu a:visited{
	color:#fff;
	text-decoration:none;
}

#menu a:active{
	color:#fff;
	text-decoration:none;
}

#menu a:hover{
	color:#0065A3;
	text-decoration:none;
}

#logotop{
	margin-top:25px;
	margin-bottom: 10px;
	width: 210px;
}

.menuactive{
	color:#0065A3!important;
}

#umenu{
	position:fixed;
	height:50px;
	width:inherit;
	margin-left:-20px;
	margin-top:-20px;
	z-index:3;
}







#topmenu{
	padding-top:30px;
	padding-bottom:30px;
	border-bottom:3px solid #fff;
}

.link{
	padding-left:15px;
	padding-right:15px;
	font-size:24px;
	color:#fff;
	transition:500ms ease;
}

.link:visited{
	color:#fff;
}

.link:hover{
	background-color:#338ce5;
}

.section{
	position:relative;
	width:20%;
	min-height:50px;
	padding:0 0;
	margin:0 0;
	float:left;
	margin-top:-15%;
	transition:0.4s ease;
	text-decoration:none;
}

	.section:hover{
		margin-top:0px!important;
		background:none!important;
	}

	.section img{
		width:100%;
		opacity:0;
		transition:0.4s ease;
	}
	
	.section:hover > .botbez{
		opacity:0;
	}
	
	.section:hover > img{
		opacity:1;
	}
	
	.section:hover > .section img{
		display:block!important;
	}
	
.section4{
	position:relative;
	width:25%;
	min-height:50px;
	padding:0 0;
	margin:0 0;
	float:left;
	margin-top:-20%;
	transition:0.4s ease;
	text-decoration:none;
}

	.section4:hover{
		margin-top:0px!important;
		background:none!important;
	}

	.section4 img{
		width:100%;
		opacity:0;
		transition:0.4s ease;
	}
	
	.section4:hover > .botbez{
		opacity:0;
	}
	
	.section4:hover > img{
		opacity:1;
	}
	
	.section4:hover > .section4 img{
		display:block!important;
	}

.botbez{
	position:absolute;
	width:100%;
	margin:0 auto;
	transition:0.5s ease;
	text-decoration:none;
	bottom:0px;
	color:#fff;
}

.anchor{
	height:75px;
}

#nienburg{
	font-size:22px;
}

#ebikelogo{
	margin-top:10px;
	width:100%;
	height:50px;
	background-image:url(bilder/ebike_logo_breit_sw.png);
	background-repeat:no-repeat;
}

#ebikelogo:hover{
	background-image:url(bilder/ebike_logo_breit.png);
}

#mlinks{
	width:100%;	
	border-top:1px solid #eee; 
	border-bottom:1px solid #eee; 
}
	
/*############################# STRUCTURE ####################*/

#wrapper{
	position: relative;
    width: 90%;
	min-width:500px;
    background:rgba(0, 0, 0, 0.7);
	min-height:100vh;
}

#bigwrapper{
	position: relative;
	margin-left: 350px;

}

#content{
	position:relative;
	padding:20px;
	padding-bottom:130px;
	margin:0 auto;
	text-align:center;
	font-size:18px;
	line-height:1.7;
}	

#content h1{
	font-size:32px;
	padding-bottom:0px;
	padding-top:0px;
	text-align: left;
	background-color:#0065A3;
	margin-left: -30px;
	padding-left: 50px;
	padding-right:10px;
	max-width:500px;
	width:auto;
	margin-top:75px;
	}

h1 img{
	position: absolute;
	margin-top:47px;
	margin-left:-50px;
}

.category{
	position:relative;
	width:90%;
	background-color:#0065A3;
	margin:1%;
	height:265px;
	display:inline-block;
}

	.category img{
		position:absolute; 
		bottom:0; right:0; 
		height:245px;
		 
		padding:10px; 
		background-color:rgba(255,255,255,0.75);
	}

.bikebox{
	text-align:center;
	display:inline-block;
	position: relative;	
	width:200px;
	background-color:rgba(255,255,255,1);
	margin:4px 2px;
	padding:23px 25px;
	color:#222;
}

.bikebox:hover{
	box-shadow:	0px 0px 10px #0065A3,
				0px 0px 10px #0065A3,
				0px 0px 10px #0065A3,
				0px 0px 10px #0065A3,
				0px 0px 10px #0065A3,
				0px 0px 10px #0065A3,
				0px 0px 10px #0065A3,
				0px 0px 10px #0065A3;
}

.bikebox h3{
	margin:0 0;
	padding:0 0;
	font-size:20px;
	line-height:20px;
	height:40px;
}

.bikeboximg{
	width: 200px;
	height: 135px;
}

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

.man{
	font-size:13px;
	display:block;
	color:#0065A3;
}

#slider{
	position:relative;
	width:80%;
	display:inline-block;
	}

.slide img{
	width:100%;
	}

.verleih td{
	width:48%;
	padding:1%;
}

.verleih img{
	width:90%;
	background-color:rgba(255,255,255,0.7);
	padding:5%;
}

.preise{
	margin:50px auto 0px;;
	width:50%;
	font-size:1.4em;
	min-width:150px;
	max-width:250px;
	border-collapse:collapse;
}

.preise td{
	width:50%;
	border-bottom:2px solid #0065A3
}

.preise td:nth-child(even){
	text-align:right
}

.zbh{
	width:200px;
	height: 100px;
    background-color:rgba(255,255,255,0.75);
    position: relative;
	display:inline-block;
	padding:20px;
}

.zubehoer{
	display:inline-block;
	position:relative;
	}

.zbh img{
	max-height: 100px;  
    max-width: 200px;  
    position: absolute;  
    top: 0;  
    bottom: 0;  
    left: 0;  
    right: 0;  
    margin: auto; 
}

.teambox{
	background-color:rgba(255,255,255,0.75);
	width:50%;
	display:inline-block;
	padding:25px;
	margin-top:50px;
}

.teambox h1{
	margin-top:25px !important ;
}

.teambox h2{
	color:#111;
}

.kontaktinfo{
	text-align:left;
}

.kontaktinfo p{
	display:inline-block;
	vertical-align:bottom;
	margin-right:50px;
}

#zeiten{
	margin-top:50px;
}

#zeiten th{
	font-weight:normal;
	text-decoration:underline;
}

#left{
	display:inline-block;
	width:33%;
	min-width:275px;
	vertical-align:top;
}

#right{
	display:inline-block;
	width:60%;
	min-width:450px;
}

.scanimg{
	float:right;
	max-width:40%;
	margin-left:20px;
	margin-bottom:20px;
	background-color:rgba(255,255,255,0.7);
	max-height:350px;
}

.sitimg{
	float:left;
	max-width:60%;
	margin-right:20px;
	margin-bottom:20px;
	background-color:rgba(255,255,255,0.7);
	max-height:350px;
}

#werkstattimg{
	float:right; 
	max-width:40%; 
	padding:20px; 
	max-height:450px;
}

.smallwrapper{
	position:relative;
	width:100%;
	text-align:center;
	}

.inspektion{
	position:relative;
	display:inline-block;
	width:350px;
	padding:20px;
	margin:20px;
	border:1px solid #eee;
	text-align:left;
}

.reprice{
	text-align: right;
	display:block;
	font-size:30px;
}

/*########################~KONTAKT~#######################*/


.kontaktform{
	width:43%;
	display:inline-block;
	padding:0 3%;
	min-width:450px;
	margin-left:-1.5%;
	border:none;
	height:650px;
}

#kontakttable{
	width:100%;
	text-align:left;
}

.style1 {
	font-size:14px;
}

.margintop{
	padding-top:25px;
}

.isub{
	width:	100%;
	font-size:		18px;
	}
.iput{
	color:			#555;
	font-size:		18px;
	background-color:rgba(255,255,255,0.75);
	border:none;
	width:100%;
	padding:5px;
	font-family: 'Oswald', sans-serif;
	}
.iput:active{
	color:			#000;
	background-color:rgba(255,00,00,0.75);
	}
.iput:focus{
	color:			#222;
	background-color:rgba(255,255,255,0.95);
	}
	
textarea{
	height:200px;
}

#maps{
	display:inline-block;
	padding:0 3%;
	width:43%;
	min-width:450px;
	margin-left:-1.5%;
}
	

/*########################~FOOTER~########################*/


#footer{
	position:fixed;
	width:100%;
	background-color:#0065A3;
	bottom:0px;
	z-index:2;
	text-align:center;
	padding:5px 0px;
}

#footer img{
	padding-top:0px;
	padding-bottom:0px;
	padding-left:10px;
	padding-right:10px;
	display:inline-block;
	vertical-align:middle;
}

#social{
	width: 100%;
	margin-top: 20px;
}

.social-button{
	width: 50%;
	height: 100%;
	float: left;
}

.social-button img{
	width: 70%;
}