@charset "utf-8";
/* CSS Document */

#menu-custom {
	position: fixed;
	top: 0;
	left: 0;
	//width: 50%;
	height: 50px;
	
	}
	
#menu-button {
    width: 100%;
    height: 50px;
    }

#menu-button:hover {
    width: 50px;
    height: 50px;
    //background-color: #EEE;
	background-color: #d4a50d;
}

#menu {
    width: 100%;
    display:none;
    //background-color:rgba(34,34,34,.95);
    background-color: #db1c21;
	border-top: 4px solid #d4a50d;
	border-bottom: 4px solid #d4a50d;
}

#menu .invisible {
	display: none;
	}

#menu ul {
    width: 100%;
}

#menu ul li {
    width: 100%;
    display: block;
    font-size: 1.5em;
    color:#FFF;
}

#menu ul li a, #menu ul li .active {
    width: 90%;
	padding: 0.5em 5% 0.5em 5%;
	border-bottom:1px solid #b90a00;
    display: block;
    color:#DDD;
	transition: padding 1.2s ease;
}

#menu ul li .active {
	background-color: #FFF;
	color: #555;
	}

#menu ul li:hover a {
    padding: 0.5em 2% 0.5em 8%;
    color:#FFF;
}
#menu_desktop {
	z-index: 8900;
	width: 100%;
	padding-top: 58px;
	padding-bottom: 4px;
	background-color: #db1c21;
	}
	
#menu_desktop .invisible {
	display: none;
	}

#menu_desktop ul li {
	display: inline-block;
	}

#menu_desktop ul li a {
	display: block;
	padding: 6px 25px;
	color: #FFF;
	font-weight: normal;
	border-right: 1px solid #FFF;
	transition: background-color 0.5s ease;
	transition: color 0.5s ease;
	}
	
#menu_desktop ul li strong {
	display: block;
	padding: 6px 25px;
	color: #db1c21;
	font-weight: normal;
	border-right: 1px solid #FFF;
	background-color: #FFF;
	}	
#menu_desktop ul li a:hover {
	background-color: #d4a50d;
	color: #333;
	}

@media (min-width: 1200px) {
	#menu-custom {
		//width: 50%;
		width: 100%;
		z-index: 8500;
		}
	#menu-button {
		display: none;
		}
}
@media (max-width: 1199px) and (min-width: 600px) {
	#menu_desktop {
		display: none;
		}
	#menu-custom {
		width: 100%;
		z-index: 9500;
		}
}
@media (max-width: 599px) {
	#menu_desktop {
		display: none;
		}

	#menu-custom {
		width: 100%;
		z-index: 9500;
		}
}