body {
  background-image: linear-gradient(to bottom right, magenta,blue);
  background-image: URL(https://cloudflare-ipfs.com/ipfs/uAXAAMxItChgBcBEUwg3lDSIaAsZsl3TKfSJGL6lDQHgSDWFic3B1cnBsZS5qcGcYmpAGCgIIAQ/abspurple.jpg);
  background-image: URL(//cdn.jsdelivr.net/gh/iglake/cssjs@master/assets/abspurple.jpg);
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
  /*
  background-size: cover;
  background-size: 680px, auto;
  background-size: 100%, auto;
  */
  background-size: cover, 100%;
  /* min-height: 100%; */
  color: darkgrey;
}
.layer { display: none; }
/*
#render { border-color: white; border-size: 1px; }
*/
img#logo { max-height: 280px; }
div.content {
 position: relative;
 margin-left: 100px;
 margin: auto;
 color: rgb(2,3,5);
 background: lightgreen;
 background-image: linear-gradient(to bottom left, white,lightgreen);
 opacity: 0.98;
}
div #hero,#first,.first {
 opacity: 0.96;
 color: lightgrey!important;
 background: rgba(1,0,2,.6)!important; opacity: 1.0;
 /* background: lightpink; */
 position: sticky;
 /* right: 50%; margin-right: -382px; */
 top: 10px;
}

.shadow {
 border-radius: 4px;
 box-shadow:2px 20px 8px rgba(0, 0, 0, 0.40);
}

div {
 background-color: lightgrey;
 font-size: 14px;
 text-align: justify;
}

div.content {
 width: 100%;
 padding: 3em;

}
div.footer {
 margin: auto;
 padding: 0.5em 3em 0 3em;
 background-color: transparent;
}


@media screen and (orientation:portrait) {
div { width: calc(100vw - 4px); }

div.content {
 width: calc(100% - 2em);
 padding: 1em;
}

}
@media screen and (orientation:landscape) {
div { max-width: 740px; }

div.content {
 width: calc(100% - 6em);
 padding: 3em;
}

}


#banner {
  /* left: -6px; */
  padding: 12px 0 12px 24px;

  width: 98%; margin: auto;  
  margin-bottom: 0; top:0; z-index: -1;
  background-color: black; /* rgba(20,20,20,0.5); */
  background-image: linear-gradient(to right, lightblue,darkblue);
  background-size: auto 100%;
  background-position: right bottom;
  background-repeat: no-repeat;
  opacity: -1;
  /* position: fixed; */
  color: red;
}

h1,h2,h3,h4,h5 { text-align: left; }

pre { overflow: auto }

img { max-width: 90%; max-height: 720px; margin: auto;} 

@font-face { /* code39 by Dr. David Allais and Ray Stevens of Intermec in 1974. */
      font-family: "Barcode 39 Text";
      font-style: normal;
      font-weight: 400;
      src: url("https://fonts.gstatic.com/l/font?kit=sJoa3KhViNKANw_E3LwoDXvs5Un0HQ1vT-030Aw50_riSWzIUN2y4R7myIoll_6NvZfoMkH4nprSLcJNkI0ZGl68WskbnJn2rra7Iy_nWZs2AAfeCSkKYKiF4_s16Zi1X6BMAohd4usGxzAYOSpoqFaS0oDRbzdP-SB60JrrGS5y331NyX3pmfdUwSNNOYsYGoFiyQ&skey=a91ebaf074a37bd0&v=v5") format("woff2");
}
/* latin */
@font-face {
  font-family: 'Loved by the King';
  font-style: normal;
  font-weight: 400;
  src: local('Loved by the King'), local('LovedbytheKing'), url(https://fonts.gstatic.com/s/lovedbytheking/v7/Gw6gwdP76VDVJNXerebZxUMeRXUF2MiKn3A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

#sig {
      font-family: "Loved by the King";
      font-size: 2em;
}

.bcode39 {
      font-family: "Barcode 39 Text";
      font-size: 200%;
}