*
{
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color: transparent;
}	

::selection{
color: white !important;
background: #ffffff !important;
}

	.body-overlay {
			position: fixed;
			left: 0;
			right: 0;
			top: 0;
			height: 100vh;
			pointer-events: none;
			opacity: 0;
			cursor: pointer;
			-webkit-transition: opacity .3s ease;
			transition: opacity .3s ease;
			z-index: 99999;
			background-color: rgba(0,0,0,0.3);
		}

		body.active .body-overlay {
			opacity: .5;
			pointer-events: auto;
		}

		.menu-box {
			width: 100%;
			position: fixed;
			left: -100%;
			top: 0;
			z-index: 999999;
			height: 100vh;
			padding: 0;
			opacity: 0;
			-webkit-overflow-scrolling: touch;
			overflow: auto;
			-webkit-transition: all .3s ease-out;
			transition: all .3s ease-out;
			background-color: rgba(0,0,0,0.8);
    		backdrop-filter: blur(5px);
    		-webkit-backdrop-filter: blur(5px);
		}

		.menu-box.active {
			left: 0;
		}

		.active {
			visibility: visible;
			opacity: 1 !important;
		}

		.header-icons {
			display: inline-block;
			cursor: pointer;
			float: right;
			margin-left: 0px;
			margin-top: 0px;
		}

		.bar1,
		.bar2,
		.bar3 {
			width: 25px;
			height: 2px;
			background-color: #333;
			margin: 6px 0;
			transition: .4s;
		}

		.change .bar1 {
			-webkit-transform: rotate(-45deg) translate(-5px, 4px);
			transform: rotate(-45deg) translate(-5px, 4px);
		}

		.change .bar2 {
			opacity: 0;
		}

		.change .bar3 {
			-webkit-transform: rotate(45deg) translate(-7px, -7px);
			transform: rotate(45deg) translate(-7px, -7px);
		}
		
		
		
		
		.bar1
		{
			margin-top:0px;
		}
		.bar3
		{
			margin-bottom:0px;
		}