/* thumbs external style sheet, overrides with internal style sheets */

* { box-sizing: border-box; margin: 0; border: 0; padding: 0; }
.nUp { width: 4ch; text-align: center; text-decoration: none; float: left;
 color: white; background-color: red; margin: 2px; border: black solid 1px; }
.photo { float: left; width: 100%; padding: 1px; }
@media screen and (min-width: 500px) { .photo { width: 50%; } }
@media screen and (min-width: 750px) { .photo { width: 33%; } }
@media screen and (min-width: 1000px) { .photo { width: 25%; } }

/* default colors */
body { color: white; background-color: #333; }
#cn1 { background-color: rgba(255,255,255,0.75); /* transparent white */ }
#cn1 { color: black; border: black; }
.text { color: black; }
.nUp { border-color: black; color: black; background-color: rgba(0,0,0,0); }
button, .button, .mag1, .mag2 { background-color: yellow; }
input { background-color: white; }
.mag1, .mag2 { background-color: yellow; }
.thHWL { /* hide when loaded */ background-color: yellow; }

/* background image (url specified per page) */
body { background-attachment: fixed; background-size: 100% auto; }

/* structure */
body { z-index:-9; overflow: scroll; }
#cpage { max-width: 1000px; margin: 0 auto; } /* centered page */
#cn1 { max-width: 975px; margin: 10px auto 80vh auto;
 border: double; padding: 10px 10px 30px 10px; }
#cn2 { padding: 0; }
h1 { clear: both; text-align: left; padding: 0 0 5px 0; }
h1.fo { margin-top: 20px; border-top: double 3px; padding-top: 10px; }
p { text-align: justify; padding: 5px; }
img { width: 100%; border: solid 1px; }
input { border: solid 1px; }
.mag1, .mag2 { padding: 0 .2em; text-decoration: none; }
button, .button { margin-bottom: 5px; border: solid 1px; padding: 1px 2px;
 text-decoration: none; }
textarea { width: 100%; border: solid 1px; }
.pixn { vertical-align: top; text-align: center; }
.pixc { vertical-align: top; text-align: left; }
.pcell { max-width: 940px; margin: 10px 5px 5px 0; float: left; }

/* text */
#cn1 { text-shadow: 0 0 2px white; }
.fs200 { font-size: 200%; }

/* generics */
.centered { text-align: center; }
.smaller { font-size: 64%; font-family: sans-serif; }

/* table is deprecated (almost) */
table { display: table;
  border-spacing: 0; border-collapse: separate;
  margin-top: 0; margin-bottom: 0;
  text-indent: 0; }
td { text-align: center; padding: 0 5px; }
td.section { font-size: 150%; font-weight: bold; padding: 10px 0 0 0; }
td.photo { text-align: center; vertical-align: bottom; }
td.vatop { vertical-align: top; }
td.text { padding: 0 12px 12px 12px; }

@media print {
 body { font-size: 8pt; }
 /* @page { margin: 1cm; } */
 #cn1 { border: black thin solid; }
 .noprint, #ph0, #ph1 { display: none; }
}