.fix{
		background-color:white;
		position: fixed;
		z-index:99;
		width: 100%;
		top: 0;
	}
	
	.blurfilter{
		-moz-filter:blur(0px);
		-o-filter:blur(0px);
		-webkit-filter:blur(0px);
		filter:blur(0px);
	}
	
	
	.depth-1{
		top: 0;
	}
	
	.depth-2{
		top: 70px;
	}
	
	.logo{
		height:80px;
		object-fit:contain;
		transition: all 0.3s ease;
	}
	
	.menubar{	
		display:flex;
		align-items:center;
		height:100px;
				}
	
	
	.menologo{
		width:20%;
		padding-left:5%;
	}
	
	.menolink{
		width:79%;
	}
	
	.menu{
		width:100%;
		display:flex;
		float:right;
		padding-right:30px;
		justify-content:space-between;
	}
	
	.menucontent{
		display:block;
		text-align: center;
		list-style:none;
		position:relative;
		
	}
	
	.menucontent a{
		text-decoration: none;
		color: black;
		cursor:pointer;
	}
	
	.menu img{
		border:none;
		width:25px;
		height:25px;
		object-fit: contain;
		display:relative;
		margin:0 auto;
	}
	
	.submenu{
		top:100%;
		width:150%;
		max-width:150px;
		display:none;
		text-decoration:none;
		position:absolute;
		background-color:rgba(220,220,220,0.9);
	}
	
	#adminlist.submenu{
		min-width:200px;
	}
	
	.submenucontent{
		padding:12px;
		text-align:left;
	}
	
	
	.submenushow .submenu{
			display:block;
	}	
	
	.submenucontent .submenu{
			top:0;
			width:100%;
			text-decoration:none;
			position:absolute;
			left: 100%;
	}
	
	.show{
		display:block;
	}
	
	.menucontent a:hover{
		color:#20B2AA;
	}
	
	.submenucontent a:hover{
		color:#20B2AA;
	}
	
	.menucontent #black:hover{
		color:black;
	}
	
	.burger{
		display:none;
		cursor:pointer;
	}
	
	.burger div{
			width: 25px;
			height: 5px;
			margin: 5px;
			background:black;
			transition: all 0.2s ease;
	}
	
	.dropdown{
		cursor:pointer;		
		margin:auto;
	}

	
	.dropdown::after{
		position:relative;
		right:0px;
		content: "\f0d7";
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		transition:transform 0.3s ease;
	}
	
	.flip::after{
		transform: rotateX(180deg);
	}
	
	/* menu*/
	
	
	@media screen and (min-width: 900px) {
		
		.logo{
			height:60px;
		}
	}
	
	@media screen and (max-width: 980px) {
		
		.blurfilter{
			-moz-filter:blur(10px);
			-o-filter:blur(10px);
			-webkit-filter:blur(10px);
			filter:blur(10px);
		}
		
		.menu{
			z-index:1;
			background-color:#FFFFFF;
			position:absolute;
			min-height:92vh;
			top:100px;
			display:flex;
			flex-direction:column;
			align-items:center;
			width:50%;
			margin:0 auto;
			transform: translateX(100%); 
			transition: transform 0.5s ease;
			right:0px;
			padding:0px;
			justify-content:left;
		}
		
		.logo{
			height:40px;
		}
		
		.menucontent{
			width:100%;
			margin: 10px auto;
		}
		
		.submenu{
			position:static;
			width:100%;
			max-width:100%;
		}
		
		.submenucontent{
				text-align:center;
		}
		
		.submenucontent .submenu{
			position:static;
			width:100%;
		}
		
		.burger{
			display:block;
			float:right;
			margin-right:10%;
		}
	
	}	
	
	.menucontent-active{
		transform: translateX(0%);
	}
	
	.fade-in-out{
		-webkit-transition: all 2s ease;  
		-moz-transition: all 2s ease;  
		-o-transition: all 2s ease;  
		-ms-transition: all 2s ease;  
		transition: all 2s ease;
		animation-name: fading;
		animation-duration: 1.5s;
	}
	
	
	@keyframes fading{
		
		from{
			opacity:0;
		}
		
		to{
			opacity:1;
		}
	}
	
	.toggle .line1 {
		
		transform: rotate(-45deg) translate(-8px,6px);
	}
	
	.toggle .line2{
		opacity:0;
	}
	
	.toggle .line3 {
		transform: rotate(45deg) translate(-8px,-6px);
	}