/* blank */ 
body {
   background: #000;
   font-family: 'Lora', serif;
}

html,
button,
input,
select,
textarea {
    color: #aaa;
}

header {
   color: #ddd;
/*   height: 7em;*/
   overflow: visible;
   float: left;
}

header img {
   padding-top: 1em;
   float: left;
}

.main-nav a:hover {
/*   color: #315489;*/
/*   color: rgba(49,84,137, .75);/*#315489;*/
}


/* v2 */
.box-nav {
   border: 0px solid #444;
   float: left;
   margin: 0;
   padding-top: 2em;
}

.box-nav li {
   position: relative;
   background: #000;
/*
   width: 17em;
   height: 12em;
   margin: 4em 0 0 4.5em;
   background: #888;
   float: left;
*/
}

.box-nav li a {
   display: block;
   width: 100%;
   height: 100%;
   position: relative;
}

.box-nav .first {
   margin-left: 0;
}

.box-nav li a img {
   opacity: 0.75;
}

.box-nav li a:hover img {
   opacity: 1;
}

.box-nav li div {
/*   margin: 2em;*/ 
   position: absolute;
   top: 0;
   left: 0;
   width: 13em;
   background: rgba(61,60,58,.75);/*#444;*/
   background: rgba(68,68,68,.75);/*#444;*/
   background: rgba(80,102,137, .75);/*#506689;*/
   color: #aaa;
   padding: .5em 2em;
   font-weight: bold;
/*   text-align: center;*/
}
.box-nav li a:hover div {
   background: rgba(185,180,174,.75);/*#444;*/
   background: rgba(102,102,102,.75);/*#444;*/
   background: rgba(49,84,137, .75);/*#315489;*/
   color: #ddd;
}

.divider {
   opacity: 1;
   position: relative;
   width: 100%;
}

.divider img {
/*   position: absolute;
   top: -5em;
   right: 0;*/
   width: 100%;
}

a.subtle {
   color: #aaa;
}

a.subtle:hover {
   color: #4170b7;
}


.highlight {
   color: #000;
   background-color: #999;
   font-weight: bold;
   padding: 0.25em .5em;
}


a.subtle:hover .highlight {
   color: #444;
   color: #506689;
   color: #4170b7;
   background-color: #ddd;
}