@font-face {
   font-family: "fnt"; src: url("ng.woff");
   font-weight: normal; font-style: normal;}
@font-face {
   font-family: "fnt"; src: url("ngb.woff");
   font-weight: bold; font-style: normal;}
@font-face {
   font-family: "grotesk"; src: url("freeav.otf");}
body {
   margin:0px; font:14pt fnt, sans-serif; text-align:center;}

h1, h2 {
   font:15pt grotesk, sans-serif; color:#041961;}
h1 {
   font-size:140%; margin-top:5px;}
h2 {
   font-weight:bold; font-size:110%; margin:0px 0px 10px; text-align:left;
   letter-spacing:1px;}
h3 {
   font:100% fnt; color:#041961; margin:18pt 0px 0px;
   padding-top:12pt; border-top:2px solid #ccc; text-align:left;}
h3:first-of-type {
   margin-top:0px; padding-top:0px; border-top:none;}

header {
   text-align:right; padding:5px; background:#041961;}
header span {
   display:inline-block; color:white; font:bold 28px fnt, sans-serif; cursor:pointer; margin:-10px 10px 0px 10px;}
header input {
   height:20px; border:none; border-radius:3px; width:20em; max-width:75%;
   padding:2px; font-size:16px;}
header input#pwd {
   width:1em; text-align:center; background:#041961; color:white;
   font-weight:bold; cursor:pointer;}
header input#pwd:focus {
   width:20em; text-align:left; color:black;
   background:white; cursor:default;}
header #go {
   display: none; font-size: 0.9em; color: lightgray;}

details {
   display:inline-block; width:200px; max-width:95%; margin-right:20px;
   text-align:left; vertical-align:top; margin-bottom:20px;}
details summary {
   border:none; outline:none; color:#041961; font-weight:bold; cursor:pointer;}
details div {
   height:100px; overflow-y:auto; background:#eee;}
details p {
   margin:3px; padding-left:10px; color:#00c; cursor:pointer;
   font-weight:bold; text-indent:0px; font-size:90%;}
details p:hover {
   text-decoration:underline; color:blue;}
details ul {
   margin:5px 0px; padding:5px; height:300px; overflow-y: auto;
   background:#eee;}
details li {
   list-style-type:none; font-size:90%; margin:2px 0px;}
details a {
   text-decoration:none;}
details a:hover {
   text-decoration:underline;}

section {
   display:inline-block; width:960px; max-width:95%; margin:0px;
   padding:5px;}
section div {
   background:#eee; padding:5px; margin-bottom:20px; margin-top:-5px;
   display:none;}
section div h3 {
   text-align:center; font-weight:bold; margin-bottom:10px;}
section div input#newTitle, section div textarea {
   display:block; width:95%; margin:5px auto; font-size:100%;}
section div textarea {
   font-family:fnt, sans-serif; height:10em; resize:none;}
section div input#newPubl {
   transform:scale(2);}
section div input#newPubl:focus {
   outline: none;}

article {
   display:inline-block; width:960px; max-width:95%; margin:0px;}
article p {
   text-indent:1.5em; margin:3pt 0px; text-align:justify;
   -webkit-hyphens:auto; -moz-hyphens:auto; -ms-hyphens:auto; hyphens:auto;}
article h2 span {
   padding:0px 5px; cursor:pointer;}

blockquote {
   margin:6pt 24pt 3pt; padding:6pt; font-size:90%; text-align:left;}
img {
   display:block; margin:12pt auto; width:960px; max-width:100%;
   border:1px solid gray;}
figcaption {
   font-size:90%; margin-top:-6pt; color:#666;}
span#top {
   position:fixed; bottom:10px; left:10px; padding:2pt 5pt; background:white;
   color:#00c; text-decoration:underline; cursor:pointer;
   box-shadow: 2px 2px 3px 2px #999; border-radius:5px;}
footer {
   font-size:90%; margin:50px 0px;}

@media (max-width: 960px) {
   header {text-align:left;}
   article blockquote p {text-indent:0px;}
   blockquote {margin:6pt 0pt 3pt; padding:6pt 0pt;}
   section div input#newPubl {transform:none;}
}
