/*!
 * Hamburger Icon
 * @description Tasty CSS-animated Desktop & Resonsive menu
 * @author Ton / Hoteliers.Guru
 */
 /* z-index: 600 - 900 to top of screen */


/*-----------------------------------------------------------------------------------*/
/*  Hamburger
/*-----------------------------------------------------------------------------------*/

.hamburger-wrapper{
	width:120px;
	height:50px;
	display:none;
	position:fixed;
	top:17px;
	right:20px;
	margin:auto;
	cursor:pointer;
	z-index:999;
	overflow:hidden;
	animation-name: fadeIn;
	animation-duration: 0.8s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-timing-function: ease-in-out;
	animation-delay:0s;
	transition:  all 0.4s;
}
.hamburger-wrapper.top10{
	top: 11px;
}
.hamburger-wrapper .hamburger-icon{
	width:auto;
	height:auto;
	position:relative;
	float:right;
}
.hamburger-wrapper .hamburger-icon::before,
.hamburger-wrapper .hamburger-icon::after{
	display:block;
	color: #2a272e;
	font-weight:400;
	transition: all 0.5s;
	font-size: 12px;
	text-transform:uppercase;
	letter-spacing:0.08em;
}
.hamburger-wrapper .hamburger-icon::before{
	content: "menu";
	position:relative;
	left: -50px;
	top: 12px;
}
.hamburger-wrapper .hamburger-icon::after{
	content: "close";
	position:absolute;
	left: 190px;
	top: 12px;
}
.hamburger-wrapper .hamburger-icon span{
	display:block;
	height:3px;
	background: #2a272e;
	position:relative;
	top:0;
	transition: all 0.5s;
}
.hamburger-wrapper .hamburger-icon span::before,
.hamburger-wrapper .hamburger-icon span::after{
	content: "";
	display:block;
	background: #2a272e;
	position:relative;
	height:3px;
	transition: all 0.3s;
}
.hamburger-wrapper .hamburger-icon span::before{
	width:40px;
	top:-8px;
	right:0;
	transition: all 0.3s;
}
.hamburger-wrapper .hamburger-icon span{
	width:30px;
}
.hamburger-wrapper .hamburger-icon span::after{
	width:20px;
	bottom:-5px;
}

.hamburger-wrapper.white .hamburger-icon span,
.hamburger-wrapper.white .hamburger-icon span::before,
.hamburger-wrapper.white .hamburger-icon span::after{
	background: #000;
}
.hamburger-wrapper.white .hamburger-icon::before,
.hamburger-wrapper.white .hamburger-icon::after{
	color: #000;
}

/* Icon Hover */

.hamburger-wrapper:hover .hamburger-icon span,
.hamburger-wrapper:hover .hamburger-icon span::before,
.hamburger-wrapper:hover .hamburger-icon span::after,
.hamburger-wrapper.active .hamburger-icon span{
	width:40px;
}

/* Icon Style When Menu Show */

.hamburger-wrapper.show{
	position: fixed !important; 
}
.hamburger-wrapper.show .hamburger-icon span,
.hamburger-wrapper.show .hamburger-icon span::before,
.hamburger-wrapper.show .hamburger-icon span::after{
	background: #ffffff;
}
.hamburger-wrapper.show .hamburger-icon::before,
.hamburger-wrapper.show .hamburger-icon::after{
	color: #ffffff;
}
.page-wrapper .page-container .content.padding{
	padding: 20px;
}
.hamburger-wrapper.show .hamburger-icon::before{
	left: -230px;
}
.hamburger-wrapper.show .hamburger-icon::after{
	left: -60px;
}
.hamburger-wrapper.show .hamburger-icon span::after{
	opacity:0;
}
.hamburger-wrapper.show .hamburger-icon span{
	width:40px;
	-ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.hamburger-wrapper.show .hamburger-icon span::before{
	width:40px;
	-ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
	top:0px;
	left:0;
}


@media(max-width: 900px){
	.hamburger-wrapper{
		display: block;
	}
}
@media (max-width: 414px){

}