/*+++++++++++++++++++++++++++++++++++ Allgemeine Angaben ++++++++++++++++++++++++++++++++*/
/*+++++++++++++++++++++++++++++++++                        ++++++++++++++++++++++++++++++*/

html{
		font-size:100%;
}

body {
		font-family:Open-Sans, Verdana, Arial, sans-serif;
		font-size:0.7rem;
		max-width:1140px;		
}

h1{
		margin:0.1% 0 4% 0;
		font-size:0.7rem;
}
h2{
		font-size:.8rem;
		margin:0.67rem 0;
}

*{padding:0; margin:0;  /*++ setzt die vom Browser im browsereigenen css-Stylesheet vordefinierten Abstände von padding und margin auf null ++*/

}

ul {
		list-style:none;
}
.clear{
		clear:both; /*++ CSS-Klasse zum Aufheben des floats ++*/
}

img{
		max-width:100%;
		height:auto;
		border:0px;     /*++ blauen Rahmen um verlinkte Bilder abschalten (IE) ++*/
}

#pageslide {
    /* These styles MUST be included. Do not change. */
    display:none;
    position:absolute;
    position:fixed;
    top:0;
    height:100%;
    z-index:999999;
    
    /* Specify the width of your pageslide here */
    width:55%;
    padding:20px;
    
    /* These styles are optional, and describe how the pageslide will look */
    background-color:#999;
    color:#FFF;
    -webkit-box-shadow:inset 0 0 5px 5px #222;
    -moz-shadow:inset 0 0 5px 5px #222;
    box-shadow:inset 0 0 5px 5px #222;
}

/*+++++++++++++++++++++++++++++++++++ Header ++++++++++++++++++++++++++*/
/*+++++++++++++++++++++++++++++++++              ++++++++++++++++++++++++++++++*/
header {
	width:100%;
	background-color:#4eff00;
	box-sizing:border-box;
}

#header_nav{
		display:none;
}

#header_nav li{
		padding:3%;
		margin-top:2%;
		background:white;
		font-size:1rem;
}

#header_nav p{
		color:black;
		font-size:1rem;
}

.open{
		
		
}

.hamburgersymbol{
		 width:8%;
		 margin-left:5%;
		 margin-bottom:3%;
		 margin-top:3%;
}

#logo{
	width:50%;
	margin-left:auto;
	margin-right:auto;
	font-size:0;
}
#logo img{
	margin-top:1%;
}

#header_headline{
	text-align:center;
	padding:0 3% 1% 3%;
	box-sizing:border-box;
}

/*+++++++++++++++++++++++++++++  Main_NAV   +++++++++++++++++++++++++++++++++++*/
/*+++++++++++++++++++++++++                  +++++++++++++++++++++++++++++++++++++++*/

nav{
		width:98%;
		padding:1%;
		margin:1%;
		box-sizing:border-box;
		background:#444;
}

nav a:hover { 
		color:#f54d03; 
}

/*+++++++++++++++++++++++  NAV TON  +++++++++++++++++++++++++++++++*/
#main_nav_ton{
		width:32%;
		float:left;
		text-align:center;
		background:white;
}

nav a[href="musikanlagen.php"] p{ 
		font-size:.7rem;
		font-weight:bold; 
		padding-bottom:3%;
		background:white;		
}

/*+++++++++++++++++++  NAV Licht  ++++++++++++++++++++++++++++++++++*/
#main_nav_licht{ 
		width:32%;
		float:left;
		margin-left:2%;
		text-align:center;
		background:white;	
}

nav a[href="licht.php"] p{
		font-size:.7rem; 
		font-weight:bold;
		padding-bottom:3%;
		background:white;		
}

/*+++++++++++++++++++++++++  NAV  DJ  +++++++++++++++++++++++++++++*/
#main_nav_dj{
		width:32%;
		float:left;
		margin-left:2%;
		text-align:center;	
		background:white;
}

nav a[href="dj-equipment.php"] p{
		font-size:.7rem; 
		font-weight:bold;
		padding-bottom:3%;
		background:white;
}		

/*+++++++++++++++++++++++++  NAV  Veranstaltungstechnik Komplett-Set`s  +++++++++++++++++++++++++++++*/
#main_nav_veranstaltungstechnik{
		width:32%;
		float:left;
		margin-top:2%;
		text-align:center;	
		background:white;
}

nav a[href="veranstaltungstechnik-mieten-aschaffenburg.php"] p{
		font-size:.7rem; 
		font-weight:bold;
		padding-bottom:3%;
		background:white;
}	
/*+++++++++++++++++++++++++  NAV Traverse  +++++++++++++++++++++++++++++*/
#main_nav_traverse{
		width:32%;
		float:left;
		margin-left:2%;
		margin-top:2%;
		text-align:center;	
		background:white;
}

nav a[href="traverse-mieten.php"] p{
		font-size:.7rem; 
		font-weight:bold;
		padding-bottom:3%;
		background:white;
}	

#header_image{
		display:none;
}

/*+++++++++++++++++++++++++++++++++++ Main Container +++++++++++++++++++++++++++*/
main{
	width:100%;
	box-sizing:border-box;
}

/*+++++++++++++++++++++++++++++++++++ Kontakt ++++++++++++++++++++++++++*/
main section{
		width:100%; 
		padding:1% 3% 3% 3%;
		float:left;
		background-color:#4eff00;
		box-sizing:border-box;
}

#kontakt{ 
	width:100%;
	margin-top:1% 1% 0 1%;
	box-sizing:border-box;
	background:#555555;
}

#kontakt_inhalt{
		float:left;
		font-size:.9rem;		
}

#kontakt_inhalt a:hover {
		color:#f54d03;
}

#kontakt_inhalt h2{
		text-decoration:underline;
		font-size:1.2rem;
		font-weight:bold;
}

#kontakt_wuerfel{
		float:left;
		margin-top:4%;
		margin-left:4%;
		margin-right:6%;
}

#footer{
		background:#444444;
		color:#ffffff;
		width:100%;
		padding:1% 0 1% 7%;
		box-sizing:border-box;
}
#footer ul li a{
		color:#ffffff;
}
.footer_nav_row_1{
    width:50%;
	text-align:left;
	float:left;
}
.footer_nav_row_2{
    width:50%;
	text-align:left;
	float:left;
	padding-left:6%;
	box-sizing:border-box;
}
.footer_nav_row_3{
    width:100%;
	text-align:left;
	float:left;
	padding-top:1.2rem;
	box-sizing:border-box;
	
}

#footer_nav ul li{
    display:block;
	font-size:1.1rem;
	margin-bottom:1.2rem
}
#footer_nav ul li a:hover{
		color:orange;
}

#footer_copyright{
	float:right;
	margin:8% 2% .8% 0;
	font-size:.6rem;
}

#impressum_text{
		width:98%;
		margin-left:auto;
		margin-right:auto;
		padding:1% 4% 4% 4%;
		box-sizing:border-box;
}

.einruecken_links{
			padding-left:2rem;
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++        Media Queries      ++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/*++++++++++++++++++++++++++++++++++++        500px          ++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:500px) {
body {
		font-size:0.7rem;	
}

h1{
		font-size:1rem;
		margin:0.67rem 0;
}

h2{
		font-size:.9rem;
		margin:0.67rem 0;
}

#logo{
		
		margin-left:auto;
		margin-right:auto;
}

nav a[href="musikanlagen.php"] p{ 
		font-size:1rem;
}

nav a[href="licht.php"] p{
		font-size:1rem;
}

nav a[href="dj-equipment.php"] p{	
		font-size:1rem;
}

nav a[href="veranstaltungstechnik-mieten-aschaffenburg.php"] p{ 
		font-size:1rem;
}
nav a[href="traverse-mieten.php"] p{ 
		font-size:1rem;
}
.footer_nav_row_1{
    width:33.33333333333333%;
}
.footer_nav_row_2{
    width:33.33333333333333%;
	padding-left:4%;
}
.footer_nav_row_3{
    width:33.33333333333333%;
	padding-left:6%;
	padding-right:1%;
	padding-top:0;
}
	
}

/*++++++++++++++++++++++++++++++++++++        769px          ++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:769px){
body{
		margin-left:auto;
		margin-right:auto;
		border: solid 2px #006500;
}

h1 {
		font-size:1.2rem;
		margin:1% 0 4% 0;

}

header {
	width:96.49122807017544%; /* 1100 / 1140 */
	padding:0.5% 0 0.5% 0;
	margin-top:0.3rem;
	margin-left:auto;
	margin-right:auto;
	box-shadow:4px 4px 10px rgba(0,0,0,0.5);
}

#logo img {
    margin-top:0;
}

.open{
		display:none;
		
}

#header_nav{
		display:block;
		margin-top:0;
		margin-left:0;
}

#header_nav li{
		float:left;
		padding:0.8% 1% 1% 1%;
		margin-top:.5%;
		margin-right:.3%;
		background:black;
		font-size:.75rem;
		display:inline;
		box-shadow:4px 4px 10px rgba(0,0,0,0.5);
}

#header_nav li a{
		text-decoration:none;
		color: white;
		background-color:black;
}
#header_nav li a:hover{
		color: orange;
}

#header_nav p{
		display:none;
}

#logo{

		width:30%;
		margin:0 2% 0 2%;
		float:left;
}

#header_headline{
	text-align:left;
	margin:0.6% 2% 0 0;
	padding-bottom:0;
} 

nav{
		float:left;
		width:19.298245614035086%; /* 220 / 1140 */
		padding:0 0 0 0;
		margin-left:1.7543859649122806%; /* 20 / 1140 */
		margin-right:0.8771929824561403%; /* 10 / 1140 */
		margin-top:1%;
		box-sizing:border-box;
		box-shadow:4px 4px 10px rgba(0,0,0,0.5);
}
/*+++++++++++++++++++++++  NAV TON  +++++++++++++++++++++++++++++++*/
#main_nav_ton{
		width:89.0909090909091%; /* 196 / 220 */
		text-align:center;
		margin-top:5%; /* 12 / 636 */
		margin-left:5.454545454545454%; /* 12 / 220 */
}

nav a[href="musikanlagen.php"] p{ 
		font-size:1rem;
		font-weight:bold; 
		padding:3% 0 3% 0;
		background:white;		
}

/*+++++++++++++++++++  NAV Licht  ++++++++++++++++++++++++++++++++++*/
#main_nav_licht{ 
		width:89.0909090909091%; /* 196 / 220 */
		text-align:center;
		margin-left:5.454545454545454%; /* 12 / 220 */
		margin-top:5.454545454545454%;
}

nav a[href="licht.php"] p{	
		font-size:1rem; 
		font-weight:bold;
		padding:3% 0 3% 0;
		background:white;		
}

/*+++++++++++++++++++++++++  NAV  DJ  +++++++++++++++++++++++++++++*/
#main_nav_dj{
		width:89.0909090909091%; /* 196 / 220 */
		margin-left:5.454545454545454%; /* 12 / 220 */
		margin-top:5.454545454545454%;
		margin-bottom:0;
		text-align:center;		 	
}

nav a[href="dj-equipment.php"] p{	
		font-size:1rem; 
		font-weight:bold;
		background:white;
		padding:3% 0 3% 0;
}

/*+++++++++++++++++++++++++  NAV  Veransatltungstechnik Komplett-Set`s  +++++++++++++++++++++++++++++*/
#main_nav_veranstaltungstechnik{
		width:89.0909090909091%; /* 196 / 220 */
		margin-left:5.454545454545454%; /* 12 / 220 */
		margin-top:5.454545454545454%;
		margin-bottom:0;
		text-align:center;		 	
}

nav a[href="veranstaltungstechnik-mieten-aschaffenburg.php"] p{	
		font-size:1rem; 
		font-weight:bold;
		background:white;
		padding:3% 0 3% 0;
}

/*+++++++++++++++++++++++++  NAV  Traverse   +++++++++++++++++++++++++++++*/
#main_nav_traverse{
		width:89.0909090909091%; /* 196 / 220 */
		margin-left:5.454545454545454%; /* 12 / 220 */
		margin-top:5.454545454545454%;
		margin-bottom:5.454545454545454%;
		text-align:center;		 	
}

nav a[href="traverse-mieten.php"] p{	
		font-size:1rem; 
		font-weight:bold;
		background:white;
		padding:3% 0 3% 0;
}

/*+++++++++++++++++++++++++  Header    +++++++++++++++++++++++++++++*/
#header_image{
		margin-top:1%;
		width:76.31578947368422%; /* 870 / 1140 */
		float:left;
		display:block;
		box-shadow:4px 4px 10px rgba(0,0,0,0.5);
}
#header_image img{
		width: 100%;
		float: left;
}
#header_image iframe{
		width: 40%;
		float: left;
}

/*+++++++++++++++++++++++++++++++++++   Main   ++++++++++++++++++++++++++*/
main{
		width:76.31578947368422%; /* 870 / 1140 */
		margin-top:1%;
		margin-right:1.7543859649122806%; /* 20 / 1140 */
		margin-left:0;
		float:right;
		background:#4eff00;
		box-sizing:border-box;	
		box-shadow:4px 4px 10px rgba(0,0,0,0.5);
}

main section{
		width:74.48275862068967%; /* 648 / 870 */
		float:left;
		background-color:#4eff00;
		padding:1% 3% 0 3%;
		box-sizing:border-box;
}

/*+++++++++++++++++++++++++++++++++++ Kontakt ++++++++++++++++++++++++++*/

#kontakt{ 
	width:24.367816091954023%;/* 212 / 870 */
	padding:0% 0 0% 1.5%;
	float:right;
	background:white;
	margin:0 0 0 0;
	border:0px solid black;
	box-sizing:border-box;
	box-shadow:4px 4px 10px rgba(0,0,0,0.5);	
}

#kontakt_wuerfel{
		width:32.54716981132076%; /* 69 / 212 */
		float:left;
		
}
#kontakt_inhalt{
		width:90%;
		float:left;
		padding:0rem;
		font-size:.74rem;		
}

#footer{
	width:96.49122807017544%; /* 1100 / 1140 */
	padding:0% 0 0% 0;
	margin:1% 0 1.6% 1.7543859649122806%; /* 20 / 1140 */
	box-shadow:4px 4px 10px rgba(0,0,0,0.5);
}

#footer_nav{
		width:79.0909090909091%; /* 870 / 1100 */
		margin-left:20.909090909090907%; /* 230 / 1100 */
}

#footer_nav ul li{
    display:block;
	margin-right:2%;
	font-size:.8rem;
	margin-bottom:0.4rem
}

#footer_nav a:hover {
		color:#f54d03;
}
		
#footer_copyright{
	float:right;
	margin:2% 2% .8% 0;
	font-size:.7rem;
}

#impressum_text{
		width:79.56140350877193%; /* 907 / 1140 */
		margin-left:none;
		margin-right:none;
		float:left;
		padding:1% 4% 4% 2%;
		box-sizing:border-box;
}
#impressum_text h1, #impressum_text h2, #impressum_text h3{
		text-align: left;
		padding: 0 0 0 0;
}
.video{ 
		width: 100%;
		margin:2% 0 4% 0;
		background:#999;
		padding:1% 2% 2% 2%;
		box-sizing:border-box;
		box-shadow:4px 4px 10px rgba(0,0,0,0.5);
}
.video p{ margin:2% 2% 4% 0;
}
}
/*++++++++++++++++++++++++++++++++++++        793px          ++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:840px){
#header_nav li{
		font-size:0.7rem;
}
}
/*++++++++++++++++++++++++++++++++++++        850px          ++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:850px){
#kontakt_inhalt{
		font-size:.9rem;		
}
}
/*++++++++++++++++++++++++++++++++++++        850px          ++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:850px){

}
/*++++++++++++++++++++++++++++++++++++        1140px          ++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:1100px){

}