@font-face {
	font-family: SamsungOne;
	src: url("SamsungOne.woff");
}

@font-face {
	font-family: SamsungSharpSans;
	src: url("SamsungSharpSans.woff");
}

body {
        font-family: SamsungOne, Times;
        font-style: normal;
        font-variant: normal;
        font-stretch: normal;
        font-weight: normal;
        font-size: 10pt;
        padding: 1em;

        counter-reset: sect1 0 page 1;

        max-width: 64em;
}

table { font-size: 12pt; }


*:link {text-decoration: underline; color: gold;}
*:visited {text-decoration: underline; color: gold;}

h1, h2 {
        /*font-family: SamsungSharpSans;*/
	font-size: 140%;
        font-weight: bold;
	text-align: left; 

        margin-top: 1em;  /* for page headers */
        padding-top: 0.5em;
        margin-bottom: 0.8em;
	page-break-before: always;
	break-before: always;
        clear: both;
}

h1  { counter-reset: sect2 0; }

h1 + details, h2 + details { padding-top: 1em; }

:is(div, p) + details { margin-top: 1.5em; }

header {
        font-family: SamsungSharpSans;
	font-size: 180%; font-weight: bold;

	text-align: center;
	page-break-before: always;
	break-before: always;
        position: relative;
        padding: 1em;
}

div { padding: 1em 1em 0 0;}

textarea[name="text"] {
    font: fixed;
    font-size: 12pt;
    resize: none;
    background-color: inherit;
    color: #ccffff;
    border: 1px solid black;
    width: 100%;
}

header > div {
    position: relative;
    text-align: center;
    display: inline-block;
    margin:0; padding:0;
    width: 100%;
}

header > div > img {
        width: 100%;
        overflow: hidden;
}

.testimage {
    max-height: calc(min(12em, 45vh));
    width: calc(min(24em, 45%));
    background-image:url('noimage.jpg');
}

footer {
	padding: 3em;
        height: 2em;
        text-align: center;
}

h1.title:before {
	counter-increment: sect1 0;
	content: none;
}

h1:before {
	counter-increment: sect1;
	content: counter(sect1 /*, upper-roman*/) ".\00a0";
}

h2.h1:before {
        counter-reset: sect2 1;
        counter-increment: sect1;
}

h2.h1 { counter-reset: sect2 1; }

h2:before {
        counter-increment: sect2; 
        content: counter(sect1) "." counter(sect2) ".\00a0";
}

header:first-of-type, /*h1:first-of-type,*/ section > h1:first-child {
	page-break-before: avoid;
	break-before: avoid;
}

details summary {
  /*color: lightblue; */
  font-style: initial;
}

details, .details {
    margin-left: 1.5em;
    margin-top: 0.7em;
    margin-bottom: 0.7em;
    font-style:oblique;

    font-size: 70%;
    color: lightblue;
}

details + details { margin-top: 0.5em; } 
details.condensed { margin-top: 0.33em; margin-bottom: 0.33em; font-size: 70%; }
li.condensed { padding-bottom: 0.2em; }
.condensed { line-height: 0.8; }

h3, h4, h5, h6 {margin-top: 2em;}
h3 {font-size: 120%; font-weight: bold;}
h4 {font-size: 110%; font-weight: bold;}
h5, h6 {font-size: 110%; font-weight: normal;}

strong {font-variant: small-caps; font-stretch: expanded; }
em {font-style: oblique;}

q {quotes: "\00ab" "\00bb" "\201e" "\201d";}

dd {padding-bottom: 0.5em;}
li {padding-bottom: 0.5em;}
dt  {font-weight: bold;}

img {border: 1px solid black; }

p {text-align: justify; max-width: 80em; text-indent: 1.5em; 
	margin-bottom: 0.5em; margin-top: 0.5em;}
p + p {text-indent: 1.5em; margin-top: 0;}

svg, .picture {
    max-width:90%;
    border: none;
    margin: 0.5em 0.5em 0.5em;
}

@media screen {
    body {
        background-color: #132d46;
        background-image: url("picture.jpg");
        background-repeat: no-repeat;
        color: white;
        margin: 0 auto;
    }
}