/*** RESET *******************************************************************/

body { margin: 0; border: none; padding: 0; font-size: 100%; }
main, header, article, aside, section, nav, footer, figure, figcaption { display: block; width: auto; }
main, header, article, aside, section, nav, footer, figure, figcaption,
div, h1, h2, p, img, ul, ol, li, dl, dt, dd,
table, thead, tbody, tfoot, tr, th, td,
form, fieldset, legend, input, label, select, option,
span, em, strong, i, b, address, cite, abbr, kbd, a, a:link, a:active, a:visited,
br { margin: 0; border: none; padding: 0; font: inherit; line-height: 1em; vertical-align: baseline; color: inherit; text-decoration: inherit; }
table { table-layout: auto; border-spacing: 0; border-collapse: collapse; empty-cells: show; }

/*** GENERIC TEXT ************************************************************/

body { font-family: sans-serif; font-weight: 400; }

h1 { font-size: 1.5em; line-height: 1em; margin-bottom: 1em; }
h2 { font-size: 1.25em; line-height: 1.2em; margin-bottom: 1.2em; }
h2 { font-size: 1em; line-height: 1.5em; margin-bottom: 1.5em; }
section h1 { font-size: 1.25em; line-height: 1.2em; margin-bottom: 1.2em; }
section section h1 { font-size: 1em; line-height: 1.5em; margin-bottom: 1.5em; }
section section section { margin-left: 1.5em; }
p, li, dt, dd { font-size: 1em; line-height: 1.5em; }

p, ul, ol, dl { margin-bottom: 1.5em; }
dd + dt { margin-top: 1.5em; }

ul p, ul ul, ul ol, ul dl,
ol p, ol ul, ol ol, ol dl { margin-bottom: 0em; }

h1, h2 { font-weight: 600; }

ul, ol, dd { padding-left: 1.5em; }
ul, ol { list-style-position: outside; }
ul { list-style-type: disc; }
ul ul { list-style-type: circle; }
ul ul ul { list-style-type: square; }
ol { list-style-type: decimal; }
ol ol { list-style-type: lower-latin; }
ol ol ol { list-style-type: lower-greek; }

a:hover { text-decoration: underline; }
cite, abbr, i { font-style: italic; }
strong, em, b, kbd { font-weight: 600; }

body { color: #444; background-color: #fff; }
a, a:link, a:active, a:visited { color: #26b; }

body { padding: 1em; accent-color: #69b; }

article > img, section > img { display: block; margin: 0 auto 1.5em auto; }
img.floating { float: right; margin-left: 1em; }

/*** TABLE *******************************************************************/

table { margin: 0 auto 1.5em auto; min-width: 100%; }
th, td { border-width: 1px; border-style: solid; line-height: 1.5em; padding: 0.75em 0.75em 0.75em 0.75em; }
th, td { vertical-align: middle; } /* without vertical-align Firefox computes empty cell height wrong */
th { text-align: center; background-color: #eee; font-weight: bold; }
td { text-align: left; }
table { margin-top: -1px; } /* border compensation */
th, td { padding-top: calc(0.75em - 1px); } /* border compensation */

/*** HEADER & FOOTER *********************************************************/

body > header {	font-variant: small-caps; text-transform: lowercase; letter-spacing: 2px; }
body > header > nav > ul { padding-left: 0; }
body > header > nav > ul > li { list-style-type: none; }
body > header > nav.portal-menu { font-size: 0.9em; font-style: italic; }
body > header > nav.portal-menu > ul > li + li { display: none; }
body > header > nav.portal-menu a { color: #9bd; }
body > header > h1 > a, body > header > h1 > a:link, body > header > h1 > a:active, body > header > h1 > a:visited { text-decoration: none; color: inherit; }
body > header > nav.portal-menu ul { margin-bottom: 0em; }
body > header > h1 { margin-bottom: 0.125em; margin-top: 0.125em; }

body > footer { font-size: 0.75em; text-align: center; margin-top: 5em; color: #888; font-variant: small-caps; }
body > footer img.si-logo { padding-bottom: 0.5em; border-bottom: 1px solid #ddd; }
body > footer a, body > footer a:link, body > footer a:active, body > footer a:visited { color: inherit; }

nav.language-menu { position: absolute; right: 20px; top: 20px; font-variant: small-caps; letter-spacing: 2px; font-size: 0.75em; color: #9BD; }
nav.language-menu li { list-style-type: none; text-align: right; margin-bottom: 5px; }

@media all and (min-width: 820px) {
    
    body { padding: 0; margin-top: 50px; margin-bottom: 50px; text-align: center; }
    body > header { margin: 0 auto; margin-bottom: 3em; }
    body > header > nav.portal-menu { font-size: 1em; }
    body > header > nav.portal-menu > ul > li { display: inline; }
    body > header > nav.portal-menu > ul > li + li { display: inline; margin-left: 1em; }
    body > header > h1 { font-size: 2.5em; font-weight: normal; }
    body > header > nav.application-menu { font-size: 1.25em; }
    body > header > nav.application-menu > ul > li { display: inline; }
    body > header > nav.application-menu > ul > li + li { display: inline; margin-left: 1em; }
    body > main { max-width: 800px; margin: 0 auto; padding: 0; text-align: justify; }
    ul.columns, ol.columns { column-count: 3; column-gap: 2em; }

}

ul.columns, ol.columns { text-align: left; }

/*** FORM ********************************************************************/

form { border: 1px solid #EEE; padding: 1em; text-align: center; margin-bottom: 1.5em; }
form fieldset { display: block; }
form fieldset + fieldset { margin-top: 1.5em; }
fieldset#expression-fieldset { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; }
fieldset#expression-fieldset label { display: none; }
form datalist { display: none !important; }
input#expression-text-input { max-width: 240px; height: 32px; margin: 0; border: 1px solid #BBB; padding: 2px; font-size: 20px; line-height: 26px; box-sizing: border-box; }
input#submit-button, form input#options-button { width: 32px; height: 32px; margin: 0px; border: none; padding: 0; font-size: 0; text-indent: 32px; overflow: hidden; }
input#submit-button { background-image: url('/mjenja/search-button.png'); }
form.without-options input#options-button { background-image: url('/mjenja/options-on-button.png'); }
form.with-options input#options-button { background-image: url('/mjenja/options-off-button.png'); }
form.without-options fieldset#options-fieldset { display: none; }
fieldset#options-fieldset { display: grid; grid-template-columns: 2em auto; gap: .5em; font-size: 0.75em; }
fieldset#options-fieldset label { text-align: left; }
fieldset#options-fieldset label { place-self: center left; }
fieldset#options-fieldset input { place-self: center right; }
fieldset#options-fieldset { grid-template-areas:
"languageLowerSorbianOptArea   languageLowerSorbianLabelArea   "
"languageGermanOptArea         languageGermanLabelArea         "
"languageLocalOptArea          languageLocalLabelArea          "
".                             .                               "
"categoryPlacenamesOptArea     categoryPlacenamesLabelArea     "
"categoryAdministrativeOptArea categoryAdministrativeLabelArea "
"categoryFirstnamesOptArea     categoryFirstnamesLabelArea     "
"categorySecondnamesOptArea    categorySecondnamesLabelArea    "
".                             .                               "
"includeObsoleteOptArea        includeObsoleteLabelArea        "
"extendedQueryOptArea          extendedQueryLabelArea          "
}
fieldset#options-fieldset input#categoryPlacenamesOpt { grid-area: categoryPlacenamesOptArea; }
fieldset#options-fieldset label[for='categoryPlacenamesOpt'] { grid-area: categoryPlacenamesLabelArea; }
fieldset#options-fieldset input#categoryAdministrativeOpt { grid-area: categoryAdministrativeOptArea; }
fieldset#options-fieldset label[for='categoryAdministrativeOpt'] { grid-area: categoryAdministrativeLabelArea; }
fieldset#options-fieldset input#categoryFirstnamesOpt { grid-area: categoryFirstnamesOptArea; }
fieldset#options-fieldset label[for='categoryFirstnamesOpt'] { grid-area: categoryFirstnamesLabelArea; }
fieldset#options-fieldset input#categorySecondnamesOpt { grid-area: categorySecondnamesOptArea; }
fieldset#options-fieldset label[for='categorySecondnamesOpt'] { grid-area: categorySecondnamesLabelArea; }
fieldset#options-fieldset input#languageLowerSorbianOpt { grid-area: languageLowerSorbianOptArea; }
fieldset#options-fieldset label[for='languageLowerSorbianOpt'] { grid-area: languageLowerSorbianLabelArea; }
fieldset#options-fieldset input#languageGermanOpt { grid-area: languageGermanOptArea; }
fieldset#options-fieldset label[for='languageGermanOpt'] { grid-area: languageGermanLabelArea; }
fieldset#options-fieldset input#languageLocalOpt { grid-area: languageLocalOptArea; }
fieldset#options-fieldset label[for='languageLocalOpt'] { grid-area: languageLocalLabelArea; }
fieldset#options-fieldset input#includeObsoleteOpt { grid-area: includeObsoleteOptArea; }
fieldset#options-fieldset label[for='includeObsoleteOpt'] { grid-area: includeObsoleteLabelArea; }
fieldset#options-fieldset input#extendedQueryOpt { grid-area: extendedQueryOptArea; }
fieldset#options-fieldset label[for='extendedQueryOpt'] { grid-area: extendedQueryLabelArea; }
@media all and (min-width: 640px) {
    fieldset#expression-fieldset { justify-content: center; }
	fieldset#options-fieldset { grid-template-columns: 2em auto 2em auto; justify-content: center; }
    fieldset#options-fieldset label { margin-right: 1em; }
    fieldset#options-fieldset input { margin-left: 1em; }
    fieldset#options-fieldset { grid-template-areas:
    "languageLowerSorbianOptArea languageLowerSorbianLabelArea categoryPlacenamesOptArea     categoryPlacenamesLabelArea     includeObsoleteOptArea      includeObsoleteLabelArea "
    "languageGermanOptArea       languageGermanLabelArea       categoryAdministrativeOptArea categoryAdministrativeLabelArea extendedQueryOptArea        extendedQueryLabelArea   "
    "languageLocalOptArea        languageLocalLabelArea        categoryFirstnamesOptArea     categoryFirstnamesLabelArea     .                           .                        "
    ".                           .                             categorySecondnamesOptArea    categorySecondnamesLabelArea    .                           .                        "
    }
}

/*** ARTICLE: ... ************************************************************/

[data-flexem-id], [data-stems][data-paradigm-id] { cursor: pointer; }

div#paradigm-window { display: block; position: fixed; top: 0; bottom: 0; left: 0; right: 0; text-align: center; background-color: rgba(255,255,255,0.75); overflow: auto; }

table#inflection-table { table-layout: auto; border-spacing: 0; border-collapse: collapse; empty-cells: show; min-width: auto; margin: 1em auto; background-color: #ffd; font-size: 0.9em; }
table#inflection-table td, table#inflection-table th { border: 1px solid #000; padding: 0.5em; text-align: center; vertical-align: middle; }
table#inflection-table th { background-color: #eec; font-weight: bold; }

#close-paradigm-window { cursor: pointer; font-size: 2em; font-weight: bold; position: absolute; top: 0; right: 0.25em; }

ul#derivates { list-style: none; }
ul#derivates li { display: inline; }
ul#derivates li + li:before { content: ", "; }

datalist { display: none !important; }

p.similar-results, p.inflection-results { font-size: 0.75em; }


/*** OTHER *******************************************************************/

p.message { padding: 0.5em; background-color: #cde; text-align: center; }
p#status-message { color: #faa; position: fixed; top: 0; right: 0; margin: 0.25em; background-color: rgba(255, 255, 255, 0.75); padding: 0.1em 0.25em; }
address.author { text-align: right; }
p.footnote { font-size: 0.75em; }

p#cookie-info { position: fixed; bottom: 0; left: 0; right: 0; margin: 0; padding: 0.5em; padding-right: 3em; background-color: rgba(22, 66, 121, 0.89); overflow: hidden; color: #cde; font-size: 1.33em; font-variant: normal; text-align: left; z-index: 9999; }
#close-cookie-info { cursor: pointer; font-size: 2em; font-weight: bold; position: absolute; top: 0.125em; right: 0.25em; }
body > footer { margin-bottom: 10em; }

/*** MJENJA *****************************************************************/

article.ndb-item h1 { background-color: #cde; padding: 0.25em 0.5em; }
article.ndb-item > h1 { padding: 0.5em 0.5em; }
article.ndb-item section h1 { background-color: #e1ebf5; }
article.ndb-item section section h1 { background-color: #edf3f9; }
a.external-link:after { content: url('/mjenja/external-link.png'); margin-left: 0.25em; white-space: nowrap; }
span.name { font-weight: bold; }
span.lexeme { font-weight: bold; }
span.comment { font-style: italic; }
span.inflectable:after { content: url('/mjenja/inflection-table.png'); margin-left: 0.25em; white-space: nowrap; }
span.inflectable:hover { border-bottom: 1px dotted #444; cursor: pointer; }
section.result-category > h1 { font-size: 1em; }
section.folded > * { display: none; }
section.folded > h1, section.folded > p.teaser { display: block; }
section.folded > p.teaser::after { content: ' […]'; cursor: pointer; color: #26b; }
section.unfolded > p.teaser::after { content: ' [×]'; cursor: pointer; color: #26b; }
 
/*** PRINT STYLE *************************************************************/

@media print {
	body > header, body > footer { display: none; }
	form { display: none; }
	nav { display: none !important; }
	body > main { max-width: none; }
	body, a, a:link, a:active, a:visited, .bible-fragment .footnote-reference, .bible-fragment .footnotes, .bible-fragment .end-mark, .bible-fragment .footnotes a { color: #000; }
	.print-media-notice { display: block; text-align: right; color: #888; margin-top: 1em; padding-bottom: 97px; background-image: url(/si-logo.png); background-repeat: no-repeat; background-position: bottom right; }
	
}

/*****************************************************************************/