.menuWrapper {
    position: fixed;
    left: 0;
    right: 0;
    height: 80px;
    margin: 0 auto;
    margin: 0px 20px;
    z-index: 50;
    background: rgba(0,0,0,0.4);
    border-bottom: 1px solid rgba(0, 0, 0, 0.0);
}

.menuWrapperScrolled {
    position: fixed;
    top: 0;
    margin: 0px 20px;
    height: 50px;
    background-color: rgba(255,255,255,1);
    border-bottom: 1px solid #ebebeb;
}

.menuLogo {
    position: absolute;
    top: 50%;
    left: 26px;
    height: 80px;
    fill: #fff;
    z-index: 101;
    display: block;
    margin: 0 auto;
    max-width: 450px;
    text-align: center;
    -webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	    transform: translateY(-50%);
}
.menuLogoScrolled {
    height: 50px;
    -webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	    transform: translateY(-50%);
    -webkit-filter: invert(1);
	-ms-filter: invert(1);
	    filter: invert(1);
}

.menu { font-size: 20px; font-size: 17pt; }
.menu ul {
    list-style-type: none;
    font-family: "Open Sans Condensed";
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-end;
    overflow: visible;
    z-index: 50;
    margin: 0;
    text-transform: uppercase;
    line-height: 80px;
}

/*** TRANSITIONS *********************************************************/
.menuWrapper, .menu ul, .menuLogo {
    -webkit-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	    transition: all 0.2s ease;
}

.menuScrolled ul {
    height: 50px;
    line-height: 50px;
}

.menu ul li {
    float: left;
}

.menu ul li a {
	font-weight: bold !important;
}

.menu ul li a, .dropbtn {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 0px 20px;
    text-decoration: none;
    font-weight: normal;
}
.menuScrolled ul li a, .dropbtn { color: black; }

.menu ul li a:hover, .dropdown:hover .dropbtn {
    background-color: rgba(3, 169, 244, 0.9);
    background-color: rgba(30,80,160,1);
    color: white!important;
    cursor: pointer;
}

.menu ul li.dropdown {
    display: inline-block;
}

.menu ul .dropdown-content {
    display: none;
    position: absolute;
    background-color: rgba(249, 249, 249, 0.9);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.menu ul .dropdown-content a {
    color: black;
    padding: 0px 20px;
    text-decoration: none;
    display: block;
    text-align: left;
    line-height: 50px;
}

.menu ul .dropdown-content a:hover {
    background-color: #03A9F4;
    background-color: rgba(32,128,255,1);
    background-color: rgba(30,80,160,1);
    color: white!important;
}

.menu ul .dropdown:hover .dropdown-content {
    display: block;
}

.give_now_menu span,
.give_now_menu:hover span{
	color: #FFF !important;
	padding: 1px 7px;
	background-color: #FF0000;
	border-radius: 10px;
	box-shadow: 2px 4px 2px 0px #000;
}

.give_now_menu:hover{
	background-color: transparent !important;
}

.menuTitle {
    display: none;
    opacity: 0;
    Content: "MENU";
    position: fixed;
    right: 60px;
    top: 12px;
    font-family: 'Open Sans Condensed', sans-serif;
    font-size: 20px;
    -webkit-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	    transition: all 0.2s ease;
}

.menuControl {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    float: right;
    height: 50px;
    width:  50px;
    padding: 0px;
    fill: #676a6f;
    z-index: 100;
    background: rgb(30,80,160);
}
.menuControlOpen, .menuControlClose {
    position: fixed;
    top: 0;
    right: 0;
    width: 50px;
    height: 50px;
    padding: 10px;
    stroke: white;
    stroke-width: 3;
}
.menuControlClose { display: none; }

/** Mobile Menus Drop Down **********************************************/
	@keyframes showMobileMenu {
		  0% { height:   0px; width:  50px; }
		 50% { height: 240px; width:  50px; }
		100% { height: 240px; width: 270px; }
		}
    @-ms-keyframes showMobileMenu {
		  0% { height:   0px; width:  50px; }
		 50% { height: 240px; width:  50px; }
		100% { height: 240px; width: 270px; }
		}
@-webkit-keyframes showMobileMenu {
		  0% { height:   0px; width:  50px; }
		 50% { height: 240px; width:  50px; }
		100% { height: 240px; width: 270px; }
		}

	@keyframes hideMobileMenu {
		  0% { height: 240px; width: 270px; }
		 50% { height: 240px; width:  50px; }
		100% { height:   0px; width:  50px; }
		}
    @-ms-keyframes hideMobileMenu {
    		  0% { height: 240px; width: 270px; }
		 50% { height: 240px; width:  50px; }
		100% { height:   0px; width:  50px; }
		}
@-webkit-keyframes hideMobileMenu { 
		  0% { height: 240px; width: 270px; }
		 50% { height: 240px; width:  50px; }
		100% { height:   0px; width:  50px; }
		}

/** Mobile Menus Links **********************************************/
.mobileMenuHide, .mobileMenuShow {
    position: fixed;
    top:	50px;
    right:	 0px;
    width:	50px;
    height:	 0px;
    background: rgb(30,80,160);
    z-index: 99;
    overflow: hidden;
    -webkit-filter: drop-shadow(4px 4px 7px #333);
}

.mobileMenuShow {
    -webkit-animation: showMobileMenu .5s ease;
       -moz-animation: showMobileMenu .5s ease;
            animation: showMobileMenu .5s ease;
    width:   270px;
    height:  325px;
}
.mobileMenuHide {
    -webkit-animation: hideMobileMenu .5s ease;
       -moz-animation: hideMobileMenu .5s ease;
            animation: hideMobileMenu .5s ease;
    width:   50px;
    height:  0px;
}

.mobileMenuLinks, .mobileMenuLinksShow, .mobileMenuLinksHide, .mobieMenuLinksClose {
    display:    block;
    float: 	right;
    margin:     0 auto;
    position:   absolute;
    width:	100%;
    right: 	-10%;
    opacity: 	0;
    pointer-events: none;
    -webkit-filter: blur(3px);
    -webkit-transition: all .3s ease;
       -moz-transition: all .3s ease;
        -ms-transition: all .3s ease;
         -o-transition: all .3s ease;
            transition: all .3s ease;
}

.mobileMenuLinksShow {
    pointer-events: all;
    transition: all .3s ease;
    right: 0%;
    opacity: 1;
    -webkit-filter: blur(0px);
        -ms-filter: blur(0px);
	    filter: blur(0px);
}
.mobileMenuLinksShow.Delayed {
    transition-delay: .3s;
}
.mobileMenuLinksHide {
    pointer-events: none;
    opacity: 0;
    -webkit-filter: blur(3px);
        -ms-filter: blur(3px);
	    filter: blur(3px);
}
.mobileMenuLinksClose {
    pointer-events: none;
    -webkit-filter: blur(3px);
        -ms-filter: blur(3px);
	    filter: blur(3px);
    opacity: 0;
    right: 0%;
    float: right;
    -webkit-transition: all .3s ease;
       -moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	 -o-transition: all .3s ease;
	    transition: all .3s ease;
}

.link, div#fontSizer {
    font-family: 'Oswald', 'Open Sans Condensed', sans-serif;
    font-size:   22px;
    font-weight: 400;
    letter-spacing: 0.05em;
    letter-spacing: 0.0em;
    padding: 0px 20px 0px 10px;
    height: 40px;
    line-height: 40px;
    position: relative;
    text-align: right;
    text-transform: uppercase;
    text-transform: capitalize;
    display: block;
    color: #fff;
    margin: 0;
    white-space: nowrap;
    border-bottom: 1px solid #3162AE;
}

#mobileMenuLinks .mainMenuLink{
	font-weight: 600;
	text-transform: uppercase;
}

a.link.home::before, a.link.menuNext::after {
    width: 0;
    content: '';
    height: 0px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    margin: 16px 7px;
    font-size: 0px;
    top: 0px;
    position: absolute;
}
a.link.home::before, a.link.menuPrev::before {
    border-right: 5px solid white;
    left: 0px;
}
a.link.menuNext::after {
    border-left: 5px solid white;
}
a.link.home { float: left; z-index: 101; padding-left: 20px;}
a.link.menuPrev { float: left; z-index: 101; padding-left: 20px; }
a.link.menuNext, a.link.title {
    font-weight: 600;
    text-transform: uppercase;
}
a.link.title::before, a.link.title::after { content: ''; }
div#fontSizer { padding-right: 3px; }
div#fontLarge, div#fontNormal, div#fontSmall {
    width: 30px;
    color: white;
    display: inline-block;
    bottom: 0;
    right: 0;
    content: "";
    text-align: center;
    padding: 0px 10px;
}

div#fontSmall  { font-size: 12pt; }
div#fontNormal { font-size: 15pt; }
div#fontLarge  { font-size: 18pt; }
.invert    { -webkit-filter: invert(1); -ms-filter: invert(1); filter: invert(1); }
.invertSVG { stroke: black; }

@media (max-width: 1023px) {
    .menuWrapper         	{ height: 50px; margin: 0px; }
    .menuLogo            	{ height: 50px; left: 5px; }
    .menuLogoScrolled    	{ -webkit-filter: invert(1); -ms-filter: invert(1); filter: invert(1); }
    .menu a 			{ margin-left: 0px; padding: 5px; }
    .menu ul          		{ height: 50px; line-height: 50px; }
    .menu ul li a     		{ padding: 0 10px; }
    .menu ul .dropdown-content a { padding: 0px 10px; }
}

@media (max-height: 900px) {
    .menuWrapper      		{ height: 50px; margin: 0px; }
    .menu ul          		{ height: 50px; line-height: 50px; }
    .menuLogo 			{ height: 50px; left: 5px; }
}

@media (max-width: 767px) {
    .menu             		{ font-size: 13pt; }
}

@media (max-width: 600px) {
    .menuWrapper           	{ height: 50px; position: fixed; top: 0; margin: 0; }
    .menu                  	{ display: none; }
    .menuTitle			{ color: white; }
    .menuTitleScrolled		{ color: black; }
    .menuControl     		{ display: block; }
    .menuControlOpen 		{ display: block; }
}

@media (max-width: 600px) and (orientation: landscape), (max-width: 767px) and (orientation: landscape) {
    .menuTitle			{ color: white; }
    .menuTitleScrolled		{ color: black; }
    .menuWrapper       		{ height: 50px; position: fixed; top: 0; margin: 0; }
    .menu                  	{ display: none; }
    .menuControl   		{ display: block; }
    .menuControlOpen		{ display: block; }
}

@media (max-width : 320px) {
    .menuTitle 			{ display: none; }
    H1 				{ font-size: 20px; }
}

@media (max-width : 480px) and (orientation : landscape) {
}

