@font-face {
	font-family: 'opensans';
	src: url('/fonts/open-sans/OpenSans-Regular.ttf');
}
*{
        margin: 0;
        padding: 0;
        user-select: none;
        box-sizing: border-box;
        font-family: 'Poppins', sans-serif;
}
:root{
		--gray-color:#dddddd;
		--blue-color:#95acc4;
		--white-color:#fff;
} 
nav{
	background:var(--blue-color);
}
nav:after{
	content:'';
	clear:both;
	display:table;
}
nav .logo{
	float:right;
	color:var(--white-color);
	font-size: 30px;
	font-weight: 600;
	line-height: 70px;
	padding-right: 60px;
}
nav ul{
	float:left;
	margin-right:40px;
	list-style: none;
	position:relative;
}
nav ul li{
	float:left;
	display:inline-block;
	background:var(--blue-color);
	margin:0 5px;
}
nav ul li a{
	color:var(--white-color);
	line-height: 70px;
	text-decoration: none;
	font-size: 18px;
	padding:8px 10px;
	transition: 0.3s all ease;
}
nav ul li a:hover{
	color:var(--gray-color);
	border-radius: 5px;
	box-shadow: 0 0 5px var(--gray-color), 0 0 10px var(--gray-color);
}
nav ul ul li a:hover{
	box-shadow: none;
}
nav ul ul{
	position:absolute;
	top:90px;
	z-index: 100;
	border-top:3px solid var(--gray-color);
	opacity:0;
	visibility:hidden;
	transition: top .3s;
}
nav ul ul ul{
	border-top:none;
}
nav ul li:hover > ul{
	top:70px;
	opacity:1;
	visibility:visible;
}
nav ul ul li{
	position:relative;
	margin:0px;
	width:150px;
	float:none;
	display:list-item;
	border-bottom:1px solid rgba(0,0,0,0.3);
}
nav ul ul li a{
	line-height: 50px;
}
nav ul ul ul li{
	position:relative;
	top:-60px;
	left:150px;
}
nav .show{
	display:none;
}
nav .icon{
	display:none;
}
nav input{
	display:none;
}
.fa-plus{
	font-size:15px;
	margin-left:40px;
}
.content{
	position:relative;
}
.content::before{
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-image:url('images/bg.jpg');
	background-repeat:no-repeat;
	background-position:center;
	background-size: cover;
	width:100%;
	height:calc(100vh - 70px);
}
.content::after{
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	width:100%;
	height:calc(100vh - 70px);
	background-color: rgba(0,0,0,.50);
}

@media all and (max-width:968px){
	nav ul{
		margin-right:0px;
		float:left;
	}
	nav .logo{
		padding-left:30px;
		width:100%;
	}
	.show + a, ul{
		display:none;
	}
	nav ul li, nav ul ul li{
		display:block;
		width:100%;
	}
	nav ul li a:hover{
		box-shadow: none;
	}
	.show{
		display:block;
		color:var(--white-color);
		font-size: 18px;
		padding:0 12px;
		line-height: 70px;
		cursor:pointer;
	}
	.show:hover{
		color:var(--gray-color);
	}
	.icon{
		display:block;
		color:var(--white-color);
		position:absolute;
		top:0;
		right:40px;
		line-height: 70px;
		cursor:pointer;
		font-size: 25px;
	}
	nav ul ul{
		top:70px;
		border-top:0px;
		float:none;
		position:static;
		display:none;
		opacity:1;
		visibility:visible;
	}
	nav ul ul a{
		padding-left: 40px;
	}
	nav ul ul ul a{
		padding-left: 80px;
	}
	nav ul ul ul li{
		position:static;
	}
	[id^=btn]:checked + ul{
		display:block;
	}
	nav ul ul li{
		border-bottom:0px;
	}
	span.cancel:before{
		content:'\f00d';
	}
}