/*INTRO TO THESE MQs.  Diffcult set of MQs to work-out.  Together, ensure 1) tablets/mobiles always have at least have sticky plain nav in portrait 2) sticky plain nav never appears if height of screen in viewport is not big-enough to accomodate it when nav is expanded, 3) On a FS device, sticky plain nav will still appear in landscape (assuming window height isn't too short)*/


/*This portrait mq means only get sticky plain nav on devices (which'll be tablets and mobiles) in portrait.  Thus, don't get sticky plain nav in landscape on tablets/mobiles - where a) it'd eat up too much real-estate, and b) more importantly, where an expanded-menu could be bigger than the height of the screen in landscape - thus there'd be a problem with how to scroll the page-proper underneath it */


/*For slide-out menu I've changed the criterion to max-width 510, rather than 'portrait.  Dont want the sticky meny disappearing with non-portrait screens*/
@media screen and (max-width: 510px){

.sticky_header_upper {
position: fixed;
top:0;
/* z-index of 101 would do here; 150 is just for good measure.  It's to stop the paypal buttons being on top of the sticky mobile menu.  This problem happened because, as I discovered via experimentation, the paypal buttons have a z-index of 100. */
z-index:150;
color:;
/*Affects stikcy 'menu' word, and the sticky expanded menu.  If no value, both are soid when sticky*/
opacity: 0.9;
}

/* Background colour here apples to ALL pages.  Is re slideout menu.  Applies to box containing Menu or X; when it is sticky - i.e. when scrolling has happened.  Opacity for this is same as for the whole slideoutmenu, and controlled by opacity above - in .sticky_header_upper*/
.sticky_navbarmob {
/*An absence here of specifying a background colour will produce the same colour as non-sticky mob menu; Ie the blue with reduced alpha (background-color: rgba(0, 0, 214, 0.31))*/
/*#280044 is same blue as on pages 2-6.   Blue on pages 2-6 is #000040 with a bit of red; that is rgb(40, 0, 68) aka #280044*/
background:#280044;

/*Padding 0 reduces the size of the 'menu' box from its size on the non-sticky menu*/
padding:;
}

.fixed-nav {
/*
position: fixed;*/
/*Can't adjust opacity properly here. Just alters brightness*/
opacity: ;
z-index:10;
}

/*Hides header's logo when sticky nav shows*/
.header_logo_gone {
display:none;
}

}



/*This MQ  has, atypically, MIN-HEIGHT.  Means in landscape, screen must be at least 480px high for sticky plain nav to show.  450px is big enough to see it and have a bit of screen not covered by it at the botton.  And the sticky nav won't be appearing on smaller height screens, where it would cover everything, and maybe even be bigger than the screen*/

/* Not needed for slide out menu.  Menu control always stays at the screen's top, so is always visible.*/
/*
@media screen and (orientation: landscape) and (min-height: 400px) and (max-width: 768px){
.fixed-nav {
position: fixed;
top: 0;
left: 0;
opacity:;
z-index:10;
width:100%;
}
}
*/

/*This was used in first website with sticky mobile nav*/
/*
@media screen and (min-width: 530px) and (max-width: 768px){
.fixed-nav {
position: fixed;
top: 0px;
left:0;
opacity:0.9;
z-index:10;
width:100%;
}
}