
#top_nav_wrapper {
	width: 100%;
	height: 100%;
	max-height: 1080px;
	position: relative;
	display: block;
	z-index: 15;
	
	background: url(../Images/top_nav_background.jpg); 
	background-repeat: no-repeat;
	background-position: top center;
	background-attachment: fixed;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	filter: url(grayscale.svg); /* Firefox 4+ */
	filter: gray; /* IE 6-9 */
	-webkit-filter: grayscale(25%);
	-moz-filter: grayscale(25%);
	-ms-filter: grayscale(25%);
	-o-filter: grayscale(25%);
	filter: grayscale(25%);
}

#top_nav_title {
	width: 250px;
	height: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	
	color: #FFFFFF;
	background: #131313;
	line-height: 50px;
	text-align: center;
	font-size: 24px;
	font-family: Roboto, sans-serif;
	text-decoration: none;
	
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%); /* IE 9 */
	-webkit-transform: translate(-50%, -50%); /* Chrome, Safari, Opera */	
}

#top_nav_top_wrapper {
	width: 100%;
	height: 50px;
}

#top_nav_top_wrapper * {
	color: #1a1a1a;
	text-align: center;
	line-height: 50px;
}

#top_nav_left_wrapper {
	width: auto;
	height: 100%;
	float: left;
}

#top_nav_n ul {
	width: auto;
	height: 100%;
	list-style: none;
}

#top_nav_n * {
	width: 100px;
	height: 100%;
	display: block;
	float: left;
	
	font-size: 18px;
}

#top_nav_n *:hover {
	cursor: pointer;
	color: #FFFFFF !important;
	background: #1a1a1a !important;
	
	-webkit-transition: all 75ms ease-out;
    -moz-transition: all 75ms ease-out;
    -o-transition: all 75ms ease-out;
    -ms-transition: all 75ms ease-out;
    transition: all 75ms ease-out;
}

#top_nav_right_wrapper {
	width: auto;
	height: 100%;
	float: right;
}

#top_nav_lang_wrapper {
	width: 125px;
	height: 100%;
	float: left;
	
	font-size: 18px;
}

#top_nav_lang_wrapper span {
	padding: 0px 5px;
}

#top_nav_lang_wrapper span:hover {
	cursor: pointer;
	color: #FFFFFF !important;
		
	-webkit-transition: all 75ms ease-out;
    -moz-transition: all 75ms ease-out;
    -o-transition: all 75ms ease-out;
    -ms-transition: all 75ms ease-out;
    transition: all 75ms ease-out;
}

#top_nav_drop_button {
	width: 50px;
	height: 100%;
	position: relative;
	display: none;
	float: left;
}

#top_nav_drop_button i {
	width: 100%;
	height: 100%;
	
	color: #FFFFFF;
	line-height: 50px;
	text-align: center;
	font-size: 21px;
}

#top_nav_drop_button ul {
	width: 100vw;
	height: auto;
	display: none;
	position: absolute;
	top: 50px;
	right: 0;
	list-style: none;
	
	background: #131313;
}

#top_nav_drop_button li {
	width: 100%;
	height: 50px;
	
	color: #FFFFFF;
	line-height: 50px;
	font-size: 16px;
}

#nav_hide_cover {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 50px;
	z-index: -1;
}

#top_nav_drop_button:hover {
	cursor: pointer;
	background: #dc6e55 !important;
	
	-webkit-transition: all 75ms ease-out;
    -moz-transition: all 75ms ease-out;
    -o-transition: all 75ms ease-out;
    -ms-transition: all 75ms ease-out;
    transition: all 75ms ease-out;
}

#top_nav_drop_button li:hover {
	cursor: pointer;
	color: #dc6e55 !important;
	
	-webkit-transition: all 75ms ease-out;
    -moz-transition: all 75ms ease-out;
    -o-transition: all 75ms ease-out;
    -ms-transition: all 75ms ease-out;
    transition: all 75ms ease-out;
}

@media screen and (max-width: 976px) {
	#top_nav_top_wrapper {
		display: block;
		position: fixed;
		
		background: #131313;
	}
	
	#top_nav_lang_wrapper, #top_nav_lang_wrapper span {
		color: #dc6e55;
	}
	
	#top_nav_left_wrapper {
		display: none;
	}
	
	#top_nav_drop_button {
		display: block;
	}
}


