/* NEW HEADER */
				
		:root{
			/*--itim: #f9f9f9;
			--puti: #36383F;*/
			
			
			--itim: #36383F;
			--puti: #ffffff;
			--gray: #85888C;
		} /* variables*/

		a.men{
			text-decoration: none;
		}

		/* Header --puti */
		.header{
			background-color: #FFFFFF;
			/* box-shadow: 1px 1px 5px 0px var(--gray); */
			border-bottom: 1px solid #E5E8E8;
			position: sticky;
			top: 0;
			width: 100%;
			z-index: 3;
		}



		/* Logo */
		.logo{
			display: inline-block;
			color: var(--itim);
			font-size: 20px;
			margin-left: 20px;
		}

		/* Nav menu */
		.nav{
			width: 100%;
			height: 100%;
			position: fixed;
			background-color: var(--puti);
			overflow: hidden;

		}



		ul.menu li.x:before {
		  content: '';
		  margin-left: 0px;
		}

		.menu a{
			display: block;
			padding: 15px;
			color: var(--itim);
		}
		.menu a:hover{
			background-color: var(--gray);
		}
		.nav{
			max-height: 0;
			transition: max-height .5s ease-out;
		}

		/* Menu Icon */
		.hamb{
			cursor: pointer;
			float: right;
			padding: 40px 20px;
		}/* Style label tag */

		.hamb-line {
			background: var(--itim);
			display: block;
			height: 2px;
			position: relative;
			width: 24px;

		} /* Style span tag */

		.hamb-line::before,
		.hamb-line::after{
			background: var(--itim);
			content: '';
			display: block;
			height: 100%;
			position: absolute;
			transition: all .2s ease-out;
			width: 100%;
		}
		.hamb-line::before{
			top: 5px;
		}
		.hamb-line::after{
			top: -5px;
		}

		.side-menu {
			display: none;
		

			
		} /* Hide checkbox */

		/* Toggle menu icon */
		.side-menu:checked ~ nav{
			max-height: 100%;
			position: sticky;

			
		}
		.side-menu:checked ~ .hamb .hamb-line {
			background: transparent;
		}
		.side-menu:checked ~ .hamb .hamb-line::before {
			transform: rotate(-45deg);
			top:0;
		}
		.side-menu:checked ~ .hamb .hamb-line::after {
			transform: rotate(45deg);
			top:0;
		}

		/* Responsiveness */
		@media (min-width: 768px) {
			.nav{
				max-height: none;
				top: 0;
				position: relative;
				float: right;
				width: fit-content;
				background-color: transparent;
			}
			.menu li{
				float: left;
			}
			.menu a:hover{
				background-color: transparent;
				color: var(--gray);

			}

			.hamb{
				display: none;
			}
		}	