/* Menu icon styles */

.menu-icon-wrapper {
	position: relative;
	display:block;
    width: 34px;
    height: 34px;
	margin:10px 15px 0px 0px;
	pointer-events: none;
	transition: 0.1s;
	float:right;
}

.menu-icon-wrapper.scaled {
	-webkit-transform: scale(0.5);
	-ms-transform: scale(0.5);
	transform: scale(0.5);
}

.menu-icon-wrapper svg {
	position: absolute;
	top: -33px;
	left: -33px;
	-webkit-transform: scale(0.1);
	-ms-transform: scale(0.1);
	transform: scale(0.1);
	-webkit-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	transform-origin: 0 0;
}

.menu-icon-wrapper svg path {
	stroke: #555;
	stroke-width: 60px;
	stroke-linecap: round;
    stroke-linejoin: round;
	fill: transparent;
}

.menu-icon-wrapper .menu-icon-trigger {
	position: relative;
	width: 100%;
	height: 100%;
	cursor: pointer;
	pointer-events: auto;
	background: none;
	border: none;
	margin: 0;
	padding: 0;
}

.menu-icon-wrapper .menu-icon-trigger:hover,
.menu-icon-wrapper .menu-icon-trigger:focus {
	outline: none;
}

.mmenugovde {
position:fixed;
width:0%;
background-color:#fff;
left:0;
z-index:9999;
overflow:hidden;
transition:all 0.5s;-moz-transition:all 0.5s;-ms-transition:all 0.5s;-o-transition:all 0.5s;-webkit-transition:all 0.5s;
height:100%;
}

.mobil--active {
position:fixed;
width:100%;
background-color:#fff;
left:0;	
z-index:9999;
overflow:hidden;
height:100%;
}


	
.mobil_item {
	padding:25px 0px;
	margin:0;
	background: rgba(0, 0, 0, 0.1);
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
	-webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
	transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
	display:block;
	text-align:center;
	width:100%;
	background-color:#1ec5ee;
	color:#fff;
	font-size:18px;
	position:relative;
}

.mobil_item::before { 
	position:absolute;
	content:"";
	left:10px;
	top:10px;
	width:11px;
	height:52px;
	background-image:url(../images/leftpoint.png);
	background-repeat:no-repeat;
}

.mobil_item::after { 
	position:absolute;
	content:"";
	right:10px;
	top:10px;
	width:11px;
	height:52px;
	background-image:url(../images/rightpoint.png);
	background-repeat:no-repeat;
}


.mobil_item {
	-webkit-transform: translate3d(-100%, 0, 0) translate3d(-2em, 0, 0) scale3d(0.5, 1, 1);
	transform: translate3d(-100%, 0, 0) translate3d(-2em, 0, 0) scale3d(0.5, 1, 1);
	-webkit-transform-origin: 100% 50%;
	transform-origin: 100% 50%;
}


.device--alt .mobil_item {
	-webkit-transform: translate3d(0, 260px, 0) scale3d(1, 0.2, 1);
	transform: translate3d(0, 260px, 0) scale3d(1, 0.2, 1);
}


.mobil--active .mobil_item {
	-webkit-transition-timing-function: cubic-bezier(0.56, 1.19, 0.2, 1.05);
	transition-timing-function: cubic-bezier(0.56, 1.19, 0.2, 1.05);
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);


	
}

.mobil_item:nth-child(4),
.mobil--active .mobil_item:first-child {
	-webkit-transition-delay: 0.05s;
	transition-delay: 0.05s;
}

.mobil_item:nth-child(3),
.mobil--active .mobil_item:nth-child(2) {
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}

.mobil_item:nth-child(2),
.mobil--active .mobil_item:nth-child(3) {
	-webkit-transition-delay: 0.15s;
	transition-delay: 0.15s;
}

.mobil_item:first-child,
.mobil--active .mobil_item:nth-child(4) {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}
.mobil_item:first-child,
.mobil--active .mobil_item:nth-child(5) {
	-webkit-transition-delay: 0.8s;
	transition-delay: 0.3s;
}

.mobil--active .mobil_item:nth-child(6) {
	-webkit-transition-delay: 0.9s;
	transition-delay: 0.3s;
}
.mobil_item:nth-child(even) {
	background-color:#1cb7dc;
	}

@media screen and (min-device-width:667px) and (max-device-width:1335px) and (orientation: landscape) 
{
.mobil_item {float:left;width:50%;}
.mobil--active .mobil_item:nth-child(3) {background-color:#1cb7dc;}
.mobil--active .mobil_item:nth-child(4) {background-color:#1ec5ee;}
.mobil--active .mobil_item:nth-child(5) {float:right;background-color:#1cb7dc;}
.mobil--active .mobil_item:nth-child(6) {float:right;background-color:#1ec5ee;}
}

@media screen and (max-device-width:1334px) and (orientation: landscape) {
.mobil_item {float:left;width:50%;}
.mobil--active .mobil_item:nth-child(3) {background-color:#1cb7dc;}
.mobil--active .mobil_item:nth-child(4) {background-color:#1ec5ee;}
.mobil--active .mobil_item:nth-child(5) {float:right;background-color:#1cb7dc;}

.mobil--active .mobil_item:nth-child(6) {float:right;background-color:#1ec5ee;}
}