@media (max-width: 800px) and (orientation: portrait;) {
    :root {
        font-size: 1.5rem;
    }
}

a {text-decoration: none; font-weight: bold; color: #00F; }
a:link     {color: #00F;}
a:visited  {color: #707;}
a:active   {color: #F00;}

a span { display: none; }

#nav {  float: right; margin: 0px 1em 0px 0px; padding: 0px; }
#nav ul {     margin: 0px; padding: 0px; }
#nav ul li {float: left;
            list-style-type: none; }
#nav ul li a { display: block; width: 12em; border: solid 1px #360;
            background-color:#9FF;  margin: 0.5em; padding: 0.3em;
            font-size: smaller;
            position: relative; }

#nav ul li a span { display: none; }
#nav ul li a:hover span {
	display: block;
	font-weight: normal; color: black;
	position: absolute; top: 50px;
    width: 20em;
	padding: 0.5em; z-index: 100;
	background: #FFC; border: 1px solid black;
}

#nav ul li a #Here  { color: #9FF !important; background-color: #333 !important; }


.box500 { width: 500px; padding: 1em; margin: 0.5em; }
.box800 { width: 800px; padding: 1em; margin: 0.5em; }

@media (max-width: 700px) {
   .box500, .box800 {
        width: 700px;
    }
}



.border { border: 2px solid black; }
#Patrons { display: none; }
.centre { margin-left: auto; margin-right: auto; }

div.Edit, p.Edit {color: #000066; margin-left: 36px; margin-right: 36px;}
span.Edit {color: #000066;}
div.Quote {color: #000066; margin-left: 36px; margin-right: 36px;}
p.Quote {color: #000066; margin-left: 36px; margin-right: 36px;}
.Small {font-size: smaller;}
.Large {font-size: larger;}
.Indent  {margin-left: 36px; margin-right: 36px;}
.Hang {text-indent: -36pt; margin-left:36pt;}
.Right {text-align: right; }
#Refs p {text-indent: -36pt; margin-left:36pt;}

.noTop {margin-top: 0px; }
.noBot {margin-bottom: 0px; }
.noTopBot {margin-top: 0px; margin-bottom: 0px; }

body {background-color: #ffffe5;  font-family: Verdana, "Trebuchet MS", Georgia, sans-serif; }
.sans {font-family: Arial, Verdana, sans-serif; font-size: smaller; }
.spread {font-family: Arial; font-size: smaller; color: #004400; }
.dialog {font-family: Arial; color: #004400; }


p  {margin-top: 0.5em; margin-bottom: 0.5em;}
th, td  {margin-top: 0.5em; margin-bottom: 0.5em; vertical-align: top; }

th, td h4 {margin-top: 0pt; }

dt {font-weight: bold; margin-top: 1.0em; margin-bottom: 0.5em;}
dd {margin-top: 0.5em; margin-bottom: 0.5em; margin-left: 36px;}
li {margin-top: 0.5em; margin-bottom: 0.5em; margin-left: -5px;}
ol ol { list-style-type: lower-alpha; }

.fLeft  {float: left;  margin: 0px 10px 10px 0px; }
.fRight {float: right; margin: 0px 0px 10px 10px; }


#pix ul { float: left; margin: 0px; padding: 0px; }
#pix ul li { list-style-type: none; float: left; width: 170px; height: 120px; border: none;
             margin: 0px; padding: 0.3em;
            font-size: smaller; position: relative; }



/* =============== MEDIA PRINT ========================== */
@media print {
a {text-decoration: none; font-weight: bold; color: #000000; }

.Spaced {page-break-after: always !important; display: none !important; }
.S100   {page-break-after: always !important; display: none !important; }
.S200   {page-break-after: always !important; display: none !important; }
.S500   {page-break-after: always !important; display: none !important; }

.noPrint {display: none;}


}

/* =============== MEDIA SCREEN ========================== */
@media screen {

.Spaced {margin-bottom: 1000px;}
.Sextra {margin-bottom: 40px; }
.S100 {margin-bottom: 100px;}
.S200 {margin-bottom: 200px;}
.S500 {margin-bottom: 500px;}

body { margin:0; padding:0 10px 0 10px; border:0; height:100%;
      overflow-y:auto; background-color: none; }


}