a {
    color:#000000;
    text-decoration:underline;
}

a:hover {
    color:#225799;
    text-decoration:none;
}

a.vocab {
    color: rgba(0,0,190,0.8);
    text-decoration: none;
}

a.vocab:hover {
    text-decoration: underline;
}

body {
    padding:0;
    margin: 1em 0;
    background: #4C6B91 url('../images/blue-sky-clouds-960.jpg') center center no-repeat fixed;
    background-size: cover;
    color:# 000000;
    font-family: "Droid Sans", serif;
    font-size: 100%;
}

p {
    padding: 0;
    margin: 0.5em 0 0 0;
}


p.title {
    text-align: center;
    font-size: 90%;
    font-weight: bold;
}

p.caption {
    text-align: center;
    line-height: 120%;
    font-size: 80%;
}

table {
    width: 90%;
    margin-left: 5%;
}

.numerical {		/* numerical columns (right align, a little padding) */
    padding-right: 0.5em;
    text-align: right;
}

ul {
    list-style: none;
}

ul.bullet {
    list-style: disc outside;
}

ul.rocket {
    list-style: square outside url("/images/rocket-15m.png");
}

li.current {
    font-size: 110%;
    font-weight: bold;
}

.strike { text-decoration: line-through; }

/*structural elements*/
#container {
    width: 88%;
    margin:0px auto;
    background: #ffffff;
    background: rgba(255,255,255,0.75);
    border-radius: 2em;
    text-align:center;
}

#holder {
    width: 96%;
    padding: 0;
    margin: 0 auto 0.5em auto;
    background: transparent;
    text-align: left;
    line-height: 160%;
}

#heading: {
}

.nira {
    width 100%;
    padding: 1px 0 0 0;
    text-align: center;
    font-family: OrbitronMedium, sans-serif;
    font-variant: small-caps;
    font-size: 160%;
    line-height: 125%;
}

#header {
    padding: 10px;
    background-color: #DADADA;
}

#content {
    margin: 1em 0.5em 0 0.5em;
    line-height:160%;
}

#news {
    width: 15em;
    padding: 0.5em;
    border:1px solid #FFEB70;
    background:#FEFFD5;
    font-size:90%;
    line-height:140%;
}

#footer {
    clear:both;
    width:100%;
    font-size:80%;
    background:#DADADA;
    border-bottom-left-radius: 2em;
    border-bottom-right-radius: 2em;
    padding: 1em 0;
    text-align: center;
    border-top:2px solid #2765AF;
}

#copyright { float:right; }


/*headings*/

.news-title {
    text-align: center;
    color:#225799;
    font-size:130%;
}

h1, h2 {
    font-family: "Droid Serif", serif;
    font-weight: normal;
}

h1 {
    text-align: center;
    font-size: 170%;
}

h2 {
    margin: 0.5em 0 0.5em 0;
    font-size: 120%;
}

h3 {
    font-family: "Droid Sans Serif", sans-serif;
    font-weight: bold;
    font-size: 90%;
}

/* #navigation is obsolete aside from legacy gallery pages, I think.  2013-02-13 */

#navigation {
    clear: both;
    margin: 1em 0 0 0;
}

#navigation ul, #footer ul {
    padding:0;
    margin:0;
}
#navigation li, #footer li {
    display:inline;
}
#navigation a {
    padding:0 20px 0 0;
    color:#225799;
    text-decoration:none;
}
#navigation a:hover {
    color:#000000;
}

#title {
    clear: both;
    border-top:1px solid #DADADA;
}

#footer a {
    padding:0 5px 0 0;
    color:#000000;
    text-decoration:underline;
    font-weight:bold;
}

#footer a:hover	{
    color:#000000;
    text-decoration:none;
}

/* 2013 (plus changes to above) */

.float-left {
    float: left;
    border: 0;
    margin: 0.25em 1em 0.25em 0;
}

/* to align images next to headers, eg. - does NOT apply to floats inside <p>
   NB: with .figure, the dual classes make !important necessary
       also, div has to preceed the <h> tag (or <p> tag, viz., it's between elements)
   p + .float-left may not be obsolete yet?
*/
p + .float-left, p + div.figure {
    margin-top: 1em ! important;
}

.float-right {
    float: right;
    border: 0;
    margin: 0.25em 0 0.25em 1em;
}



.figure {
    border: 0;
}

.figure.left {
    float: left;
    clear: left;
    margin: 0.25em 1em 0.25em 0;
}

.figure.right {
    float: right;
    clear: right;
    margin: 0.25em 0 0.25em 1em;
}

.left.clear {
    clear: left;
}

.two3rd { width: 65%; }
.half { width: 49%; }
.half-google { width: 49vw; height: 49vw; }
.third { width: 32%; }
.fourth { width: 24%; }
.sixth { width: 15%; }

img.liquid { width:100%; }

#logo {
    float: left;
    margin: 0.5em 1em 0 0;
}

/* laid out for three MotM images across - 3 * 32 + 4 * 0.6 = 98.4% */

.motm-cell, .motm-meeting {
    width: 32%;
    margin: 0.5em 0.6%;
}

img.motm {
    max-width: 100%;
}

/* MotY layouts for one, two or three images (all using standard MotM markup) */

.moty-single {
    width: 100%;
    margin-left: 33.2%;
}

.moty-double {
    width: 100%;
    margin-left: 17.2%;
}

.moty-triple {
    width: 100%;
}


.breaker {
    clear: both;
}

.doc-thumbs + h2 {
    clear: both;
}

/* sized for a 175x175 (bounding box) thumbnail size */
.doc-thumbs > div {
    width: 200px;
    height: 235px;
    text-align: center;
}

.doc-thumbs > div a {
    line-height: 110%;
    font-size: 0.9rem;
}


@font-face {
    font-family: 'OrbitronMedium';
    src: url('fonts/orbitron-medium-webfont.woff') format('woff'),
         url('fonts/orbitron-medium-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

*  also slightly modified to move labels off the left side of the box, etc.
*/
#nav {		/* designed to be an enclosing div, to clear a dangling logo image & add a bit of air */
  clear: left;
  margin-top: 0.5em;
}

#nav ul {
  padding: 0;
  margin: 0;
  border-top: 1px solid #DADADA;	/* adds top of menubar; next div draws bottom */
  list-style: none;
}

#nav a {
  display:block;
  color: black;
  text-decoration: none;
}

#nav a:hover {
  color: blue;
}

#nav li {
  float: left;
  width: 7.5em;
  padding-left: 0.5em;
  background-color: #cfd8e8;
  margin-right: 1em;
}

#nav li ul {
  position: absolute;
  width: 7.5em;
  margin-left: -0.5em;
  left: -199em;
}

#nav li:hover ul {
  left: auto;
}