@font-face { 
	font-family: "BodyFont";
	src: url('fonts/fontmedium.ttf'), url('fonts/fontmedium.ttf');
}


a:link, a:active, a:visited {
	font-family: "BodyFont";
	text-decoration: none;
}

@media screen and (min-width: 0px) and (max-width: 640px) {
  .NavMobile{ display: true; }  /* show it on smaller screen */
}
@media screen and (min-width: 641px) and (max-width: 6000px) {
  .NavMobile{ display: none; }   /* hide it larger screens */
}

@media screen and (min-width: 0px) and (max-width: 640px) {
  .NavMain{ display: none; }  /* show it on larger screen */
}
@media screen and (min-width: 641px) and (max-width: 6000px) {
  .NavMain{ display: true; }   /* hide it smaller screens */
}


.NavBackground {

background-color: rgba(0,0,0, 0.65);

-webkit-backdrop-filter: blur(4px) !important;
backdrop-filter: blur(4px) !important;

z-index: 10000001; 
color: rgba(255,255,255, 1);
position: fixed; 
left: 0; 
top: 0; 
margin: 0; 
height: 40px; 
width: 100%; 
border: 0px;
text-align: center;
border-collapse: collapse;

}



#MenuSpacer {

height: 18px;
width: 3%;

}


a.Navigation {

font-weight: normal !important;
  
  color: rgba(255,255,255, 1); 
  -o-transition:color .2s ease-out, background .2s ease-in;
  -ms-transition:color .2s ease-out, background .2s ease-in;
  -moz-transition:color .2s ease-out, background .2s ease-in;
  -webkit-transition:color .2s ease-out, background .2s ease-in;
  /* ...and now override with proper CSS property */
  transition:color .25 s ease-out, background .2s ease-in;
}
a.Navigation:hover { color: rgba(255,255,255, 0.5); 

text-decoration: none !important;

}


@font-face { 
	font-family: "BodyFont";
	src: url('fonts/fontmedium.ttf'), url('fonts/fontmedium.ttf');
}



.MouseOver {

margin: 0px;
padding: 5px;
font-size: 14pt;
color: rgba(255,255,255, 1); 

}



.MouseOver:hover {

color: rgba(255,255,255, 1) !important; 
animation-name: FadeIn !important;
animation-duration: 0.4s !important;  
animation-fill-mode: forwards !important;
animation-timing-function: cubic-bezier(0.1, -1, 0.2, 1) !important;
border-radius: 6px !important;


}

@keyframes FadeIn {
  from {background: rgba(200,200,200, 0);}
  to {background: rgba(200,200,200, 0.5);}
}