﻿.mobilenav {
width:100%;
/*max-width:1000px;*/
max-width:100%;
background: #222222;
/*background: rgb(231, 223, 210,0.9);*/
padding-top:7px;
/*top:0;*/
margin-top:0px;
padding-bottom:7px;
/*z-index:1;*/

/*position:fixed;
display: block;*/

/*position:absolute;*/
}	

#laclec-a-div {
	width:50%;
}

nav .nav-arnyek {
		display: block;
		/*background: #1552FF;*/
		/*background: url(dust_scratches.png) repeat;*/
		-webkit-box-shadow: 0px 0px 0px 0px rgba(242,228,212,0.55);
		-moz-box-shadow: 0px 0px 0px 0px rgba(242,228,212,0.55);
		box-shadow: 0px 0px 0px 0px rgba(242,228,212,0.55);
		padding: 0px;
		margin: 0 0 2px 0;
	}
	
ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    position: relative;
	background:transparent;
}
 
ul li {
    display: inline-block;
	  
	/*BL*/
	font-family: 'Courgette-Regular','BarlowSemiCondensed-Regular', Arial !important;
	font-size: 22px !important;
    color: #FAF3E1 !important;
	background:#E76E0F !important;
	/*padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 12px;
	padding-right: 12px;*/
	/*border:2px solid transparent;*/
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border: 1px outset #DB4714;
	margin-right:7px;
}

.lenyilo {
font-family: 'Courgette-Regular','BarlowSemiCondensed-Regular', Arial !important;
	font-size: 22px !important;
    color: #FAF3E1 !important;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 12px;
	padding-right: 12px;
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	/*border:2px solid transparent;*/
	}	

ul li i {

	margin-left:-15px;
	color: #FAF3E1 !important;
}
 
ul li a {
	/*BL*/
	font-family: 'Courgette-Regular','BarlowSemiCondensed-Regular', Arial !important;
	font-size: 22px !important;
    color: #FAF3E1 !important;
    text-decoration: none;
    display: block;
	
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 12px;
	padding-right: 12px;
}
 
ul li:hover {
    background: #FE9F0D !important;
	/*border: 2px solid #777777 !important;*/
	transition: background-color .5s;
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
}

 
/*BL*/
/*.nav-transparent ul li:hover{
	background:transparent !important;
}*/

/*BL*/
.nav-transparent{
	background:transparent !important;
	padding-left:30px;
	padding-right:170px;
}
.nav-transparent:hover{
	background:transparent !important;
}

ul ul {
      position: absolute;
      min-width: 200px;
      background: transparent;
	  /*background-color: #FE9F0D;*/
	  display: none;
	  margin-top:11px;
	  border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border: 0;

}
 
ul ul li {
      display: block;
      background: #FE6D14;
	  
	  /*BL*/
	   border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	/*margin-top:5px;*/
	margin-top:0px;
	border: 1px outset #DB4714 !important;
	margin-right:0px !important;
}

ul ul li:hover {
    background: #FE9F0D !important;
	/*border: 2px solid #777777 !important;*/
	transition: background-color .5s;
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
}
 
ul li:hover ul {
      display: block;
}
 
ul li i {
      color: #FAF3E1;
      float: right;
      padding-left: 20px;
}
 
nav div {
      background: transparent;
      color: #222222;
      font-size: 24px;
      padding: 0.6em;
      cursor: pointer;
      display: none;
}

* {
  margin: 0;
  padding: 0; 
}

/* Icon 1 */

#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
  width: 16px;
  height: 30px;
  position: relative;
  /*margin: 50px auto;*/
  margin-top:10px;
  margin-bottom:0;
  margin-right:55px;
  margin-left:auto;
  
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  text-align:right;
}

#nav-icon1 span, #nav-icon3 span, #nav-icon4 span {
  display: block;
  position: absolute;
  height: 4px;
   width: 100%;
  background: #FAF3E1;
  border-radius: 4px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon1 span:nth-child(1) {
  top: 0px;
}

#nav-icon1 span:nth-child(2) {
  top: 14px;
}

#nav-icon1 span:nth-child(3) {
  top: 28px;
}

#nav-icon1.open span:nth-child(1) {
  top: 14px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

#nav-icon1.open span:nth-child(2) {
  opacity: 0;
  left: -40px;
}

#nav-icon1.open span:nth-child(3) {
  top: 14px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

/* Icon 2 */

#nav-icon2 {
}

#nav-icon2 span {
  display: block;
  position: absolute;
  height: 7px;
  width: 50%;
  background: #FAF3E1;
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon2 span:nth-child(even) {
  left: 50%;
  border-radius: 0 7px 7px 0;
}

#nav-icon2 span:nth-child(odd) {
  left:0px;
  border-radius: 7px 0 0 7px;
}

#nav-icon2 span:nth-child(1), #nav-icon2 span:nth-child(2) {
  top: 0px;
}

#nav-icon2 span:nth-child(3), #nav-icon2 span:nth-child(4) {
  top: 14px;
}

#nav-icon2 span:nth-child(5), #nav-icon2 span:nth-child(6) {
  top: 28px;
}

#nav-icon2.open span:nth-child(1),#nav-icon2.open span:nth-child(6) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon2.open span:nth-child(2),#nav-icon2.open span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon2.open span:nth-child(1) {
  left: 5px;
  top: 7px;
}

#nav-icon2.open span:nth-child(2) {
  left: calc(50% - 5px);
  top: 7px;
}

#nav-icon2.open span:nth-child(3) {
  left: -50%;
  opacity: 0;
}

#nav-icon2.open span:nth-child(4) {
  left: 100%;
  opacity: 0;
}

#nav-icon2.open span:nth-child(5) {
  left: 5px;
  top: 25px;
}

#nav-icon2.open span:nth-child(6) {
  left: calc(50% - 5px);
  top: 25px;
}

/* Icon 3 */

#nav-icon3 span:nth-child(1) {
  top: 0px;
}

#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) {
  top: 12px;
}

#nav-icon3 span:nth-child(4) {
  top: 24px;
}

#nav-icon3.open span:nth-child(1) {
  top: 15px;
  width: 0%;
  left: 50%;
}

#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon3.open span:nth-child(4) {
  top: 12px;
  width: 0%;
  left: 50%;
}

/* Icon 4 */

#nav-icon4 {
}

#nav-icon4 span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4 span:nth-child(2) {
  top: 14px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4 span:nth-child(3) {
  top: 28px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -3px;
  left: 7px;
}

#nav-icon4.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
}

#nav-icon4.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 29px;
  left: 7px;
}

#nav-icon3:after {
	font-family: 'YanoneKaffeesatz-Light', Arial, serif;
    font-size:20px;
        content: "MENÜ";
        display: block;
		position: absolute; /*BL*/
        color: #FAF3E1;
        left: 33px;
        top: 0;
        margin-left: 0px;
		margin-top:6px;
        width: 55px;
        text-align: right;
    }

@media(max-width: 999px) {
      nav div {
            display: block;
      }
	  
	  nav .nav-arnyek {
		display: block;
		background: #D9AE7E;
		/*background: url(debut_dark.png) repeat;*/
		-webkit-box-shadow: inset 0px 0px 5px 0px rgba(5,5,5,0.55);
		-moz-box-shadow: inset 0px 0px 5px 0px rgba(5,5,5,0.55);
		box-shadow: inset 0px 0px 5px 0px rgba(5,5,5,0.55);
		padding: 5px;
		margin: 1px 0 1px 0;
	}
	
	nav .nav-arnyek:hover {
		display: block;
		background: #F9CE9E;
		/*background: url(dark_fish_skin.png) repeat;*/
		-webkit-box-shadow: inset 0px 0px 5px 0px rgba(5,5,5,0.55);
		-moz-box-shadow: inset 0px 0px 5px 0px rgba(5,5,5,0.55);
		box-shadow: inset 0px 0px 5px 0px rgba(5,5,5,0.55);
		padding: 5px;
		margin: 1px 0 1px 0;
	}
 
      ul {
            display: none;
           position: static;
            background: #FE9F0D;
			
			/*BL*/ margin-top:3px;
			-webkit-box-shadow: inset 0px 0px 5px 0px rgba(85,85,85,0.55);
		-moz-box-shadow: inset 0px 0px 5px 0px rgba(85,85,85,0.55);
		box-shadow: inset 0px 0px 5px 0px rgba(85,85,85,0.55);
		padding: 10px;
		margin: 2px 0 0 0;
			/*padding: 10px;
		margin: 2px 0 0 0;*/
      }
 
      ul li {
            display: block;
			background: #FE6D14 !important;
	
		/*padding: 10px;
		margin: 2px 0 0 0;*/
      }
 
      ul ul {
            position: static;
            background: #FE9F0D;
			margin-top:0px;
      }
}
