/* auto include templates/default/style_fallback.css */

/* This is the templates/default/style_fallback.css file.
   It emits CSS rules that all templates should have.
   Classes are declared on top of the file, so if you
   want to make changes in your own template, you
   should override the rules on the bottom of your
   style.css or user.css template stylesheet file.
   IT IS NOT ADVISED TO CREATE YOUR OWN style_fallback.css FILE! */

/* default sizing for specific form element */
input[type="button"], input[type="checkbox"] {
    width: auto; }

figure {
    text-align: center;
    border: solid 1px #ccc;
    border-radius: 2px;
    background: rgba(0,0,0,0.05);
    padding: 10px;
    margin: 10px 20px;
    display: inline-block; }
    figure > figcaption {
      text-align: center; }

#serendipity_error_top {
    position: relative;
    top: 0;
    left: 0;
    z-index: 999;
    width: auto;
    height: auto;
    max-height: 11em;
    overflow-x: auto;
    padding: .5em;
    border-bottom: 1px solid #e4b9b9;
    background: #f2dede;
    color: #b94a48;
    text-align: left; }

/* Default listing without spacers */
.plainList {
    list-style: none;
    margin-left: 0;
    padding-left: 0; }

/* Messages: centered, important, success, notice */
.serendipity_center {
    margin-left: auto;
    margin-right: auto;
    text-align: center; }
    .serendipity_msg_important {
      color: #ff4136; /* new red */ }
    .serendipity_msg_success {
      color: #2ecc40; /* new green */ }
    .serendipity_msg_notice {
      color: #6495ed; /* new cornflowerblue */ }

/* this and that */
table.archives_listing {
    display: table;
    width: auto;
    border-collapse: separate;
    border-spacing: 4px; }
    .archives_row td {
      padding: 4px; }
      td.archives_graph img {
        height: 1em;
        border: 1px solid #000; }

ul#serendipity_categories_list {
    margin: 0;
    padding: 0;
    list-style-type: none; }

/* Plugin frontend_comment external link(s) SVG */
.bi.bi-box-arrow-up-right {
    vertical-align: text-bottom; }

/* xml svg icons default size */
.serendipity_xml_icon img {
    width: 1rem;
    height: auto; }

.serendipityPlug img {
    border: 0px;
    width: 120px;
    margin-bottom: 1em; }

.serendipity_calendar {
    width: 100%; }

/* Disables s9ymarkup, gravatar, spamblock markup and emoticate hooked text messages in contact-form template files, having at least this staticpage_plugin_contactform selector */
/* Disables spamblock and other user notifications for the adduser plugin forms, since more or less needed for comment or contact forms only */
.staticpage_plugin_contactform .serendipity_comment_emoticate,
.staticpage_plugin_contactform .serendipity_comment_gravatar,
.staticpage_plugin_contactform .serendipity_comment_s9ymarkup,
.staticpage_plugin_contactform .serendipity_comment_spamblock,
#adduserform .serendipity_comment_emoticate,
#adduserform .serendipity_comment_s9ymarkup,
#adduserform .serendipity_comment_spamblock {
    visibility: hidden;
    display: none; }

/*** Serendipity Styx default image handlers ***/

/* Default image classes for left/right/center usual layouts */
.serendipity_image_center {
    border: 0;
    padding-left: 5px;
    padding-right: 5px; }
    p > img.serendipity_image_center {
        margin: auto;
        clear: both; }

.serendipity_image_left {
    float: left;
    border: 0;
    padding-left: 5px;
    padding-right: 5px; }
.serendipity_image_right {
    float: right;
    border: 0;
    padding-left: 5px;
    padding-right: 5px; }

/* Embedded images with comments inside the styx image manager */
.serendipity_imageComment_center,
.serendipity_imageComment_left,
.serendipity_imageComment_right {
    border: 1px solid #ddd;
    background-color: #efefef;
    margin: 3px;
    padding: 3px;
    text-align: center;
    max-width: 100%; }

.serendipity_imageComment_center {
    clear: both;
    margin: auto; }

.serendipity_imageComment_left {
    float: left; }

.serendipity_imageComment_right {
    float: right; }

.serendipity_imageComment_img,
.serendipity_imageComment_img img {
    margin: 0;
    padding: 0;
    border: 0 none;
    text-align: center; }

.serendipity_imageComment_txt {
    overflow-wrap: break-word;
    border-top: 1px solid #ddd;
    margin: 0;
    padding: 3px;
    clear: both;
    font-size: 10px;
    text-align: center; }

/* Gallery-Container: default (fallback for no rows, no cols - no initial width here) */
.serendipity_image_block {
    display: inline-block; }
    .serendipity_image_block .serendipity_image_link {
      display: block; /* Chromium: Start a new block ! */ }
    .serendipity_image_block:not(.col):not(.row) .serendipity_image_link {
      display: inline-block; }
    /* Gallery-Container: default (fallback for rows) */
    .serendipity_image_block.row {
      display: inline-block; }

/* Gallery-Container: per row order, flexed */
/* This is used to enclose a gallery, using serendipity_image_left or _right floated images */
.serendipity_image_block.row {
    clear: both;
    display: -webkit-flex;
    display: flex; }

/* Gallery-Size: This sizes the origin single-line image gallery to be used as a real multi-item image container */
.serendipity_image_block.row {
    flex: auto;
    -webkit-flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-flow: row wrap;
    align-items: flex-start; /* the default is stretch, internally used by Chrome when flexing direct child images */
    justify-content: space-evenly;
    margin: auto auto 1em; }
    /* Fit image flexible inside the link container to not overlap */
    .serendipity_image_block.row .serendipity_image_link {
      display: -webkit-flex;
      display: flex; }
    /* The inline containers or items min/max size to scale gallery images to an affordable size */
    .serendipity_image_block.row .serendipity_imageComment_left,
    .serendipity_image_block.row .serendipity_imageComment_right,
    .serendipity_image_block.row .serendipity_image_link,
    .serendipity_image_block.row .serendipity_image_left,
    .serendipity_image_block.row .serendipity_image_right {
      width: 100%;
      max-width: 260px; }
    /* Line up a row gallery (manually) commented image to nearly fit the max-width 260px image sizes - important avoid theme % flexed max-width sizes */
    .serendipity_image_block.row .serendipity_imageComment_left {
      display: block;
      max-width: 260px;
      min-width: 250px; }
      .serendipity_image_block.row .serendipity_imageComment_left .serendipity_image_link,
      .serendipity_image_block.row .serendipity_imageComment_left .serendipity_image_left {
        max-width: 100%; }
    /* This is not possible automatically, but may be a customized "mid-flooted" set for rowed galleries */
    .serendipity_image_block.row > figure.serendipity_imageComment_center {
      width: auto;
      max-width: 260px; }

/* Gallery-Container: default mobile for cols - starting with img default size >= 400px will initiate their own */
@media only screen and (max-width: 399px) {
    .serendipity_image_block.col {
        display: initial; }
}

/* Gallery-Container: by columns, vertically ordered, screen sized 3:2:1 and 4:3:2 */
/* SMALL SCREENS */
.serendipity_image_block.col {
    width: auto;
    max-width: -webkit-fill-available;/*others*/
    max-width: max-content;/*Firefox*/
    max-width: fit-content;/*Chromium*/
    margin-bottom: .5em;
    column-count: 1;
    column-gap: .187rem;/*3*/
    justify-content: space-evenly; }
    .serendipity_image_block.col .serendipity_imageComment_left,
    .serendipity_image_block.col .serendipity_imageComment_right,
    .serendipity_image_block.col .serendipity_image_link,
    .serendipity_image_block.col .serendipity_image_left,
    .serendipity_image_block.col .serendipity_image_right {
        margin: auto auto .3125em;
        float: unset; }
    .serendipity_image_block.col .serendipity_image_link .serendipity_image_left {
        margin: auto auto .2667615em; /*3*/ }

@media only screen and (min-width: 340px) {
    .serendipity_image_block.col.c5 {
        display: block;
        column-count: 2;
        column-gap: .175rem;/*2*/
        column-fill: balance; }
}
@media only screen and (min-width: 400px) {
    .serendipity_image_block.col.c3 {
        column-count: 2;
        column-gap: .312rem;/*6*/ }
    .serendipity_image_block.col.c4 {
        column-count: 2; }
    .serendipity_image_block.col.c5 {
        column-count: 3; }
    .serendipity_image_block.col.c4,
    .serendipity_image_block.col.c5 {
        column-gap: .312rem;/*6*/
        column-fill: balance; }
}
.serendipity_image_block > div {
    float: none;
    display: inline-block; }

/* MEDIUM SCREENS */
@media only screen and (min-width: 552px) {
    .serendipity_image_block.col {
        column-count: 2;
        column-gap: .312rem;/*6*/
        display: block; }
    .serendipity_image_block.col.c2 {
        display: block; }
    .serendipity_image_block.col.c3 {
        display: block;
        width: 100%; }
    .serendipity_image_block.col.c4 {
        display: block;
        column-count: 3; }
    .serendipity_image_block.col.c5 {
        column-count: 4; }
    .serendipity_image_block.col.c2 .serendipity_image_link,
    .serendipity_image_block.col.c3 .serendipity_image_link,
    .serendipity_image_block.col.c4 .serendipity_image_link,
    .serendipity_image_block.col.c5 .serendipity_image_link {
        margin: auto; }
    .serendipity_image_block.col .serendipity_image_link .serendipity_image_left {
        margin: auto auto .25em;
        float: none; }
}

/* DEFAULT SCREENS */
@media only screen and (min-width: 768px) {
    .serendipity_image_block.col {
        margin-bottom: 1em;
        column-gap: .5rem;/*9*/
        column-fill: balance; }
    .serendipity_image_block.col.c2 {
        column-count: 2; }
    .serendipity_image_block.col.c3 {
        column-count: 3; }
    .serendipity_image_block.col.c4 {
        column-count: 4; }
    .serendipity_image_block.col.c5 {
        column-count: 5; }
}

.serendipity_image_block.col .serendipity_imageComment_left,
.serendipity_image_block.col .serendipity_imageComment_right,
.serendipity_image_block.col .serendipity_image_link,
.serendipity_image_block.col .serendipity_image_left,
.serendipity_image_block.col .serendipity_image_right {
    margin: .25em auto; }
.serendipity_image_block > div.serendipity_imageComment_left .serendipity_image_left,
.serendipity_image_block.col .serendipity_imageComment_left .serendipity_image_link,
.serendipity_image_block.col .serendipity_imageComment_left .serendipity_image_left,
.serendipity_image_block.col .serendipity_imageComment_right .serendipity_image_right {
    margin: auto;
    width: 100%; }
.serendipity_image_block:not(.row):not(.col) .serendipity_imageComment_left .serendipity_imageComment_img,
.serendipity_image_block:not(.row):not(.col) .serendipity_imageComment_right .serendipity_imageComment_img {
    display: -webkit-flex;
    display: flex; }
.serendipity_image_block.col .serendipity_imageComment_left,
.serendipity_image_block.col .serendipity_imageComment_right {
    display: inline-block;
    max-width: 100%; }

/* Gallery-Size: end */

/* Gallery-Margins: the default margins for all default level 1 gallery items (direct containers or direct items) */

.serendipity_image_block > .serendipity_imageComment_left,
.serendipity_image_block > .serendipity_imageComment_right,
.serendipity_image_block > .serendipity_image_link,
.serendipity_image_block > .serendipity_image_left,
.serendipity_image_block > .serendipity_image_right {
    margin: 5px 0 0 0; }
/* same for manually added helper containers */
.serendipity_image_block > div,
.serendipity_image_block > span,
.serendipity_image_block > div .serendipity_image_left,
.serendipity_image_block > div .serendipity_image_right,
.serendipity_image_block > span .serendipity_image_left,
.serendipity_image_block > span .serendipity_image_right {
    margin: 5px 0 0 0; }
    /* exception */
    .serendipity_image_block > div > figure .serendipity_image_left {
      margin: auto; }

/* so that a direct child image behaves like a containerized image - and the top/right is 2x5px */
.serendipity_image_block:not(.col):not(.row) > .serendipity_image_left,
.serendipity_image_block:not(.col):not(.row) > .serendipity_image_right {
    margin: 10px 10px 0 0;
}
/* Some special care when inside a link or comment container, to not break the "auto" left and top margin by the justify-content (i.e. in Next and Default themes) */
.serendipity_image_block .serendipity_imageComment_left .serendipity_imageComment_img,
.serendipity_image_block .serendipity_imageComment_right .serendipity_imageComment_img {
    border: 0 none !important;
    display: inline; }

/* Gallery-Margins: end */

/* END OF style_fallback.css */

/* auto include templates/pure/style.css */

/**! Modernizing Serendipity Styx default styles START **/

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%; }
body { margin: 0; }
main { display: block; }
h1 {
  font-size: 1.6em;
  margin: 0.67em 0; }
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }
pre {
  font-family: monospace, monospace;
  font-size: 1em; }
a { background-color: transparent; }
abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted; }
b, strong { font-weight: bolder; }
code, kbd, samp {
  font-family: monospace, monospace;
  font-size: 1em; }
small { font-size: 80%; }
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
img { border-style: none; }
button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0; }
button, input {
  overflow: visible; }
button, select {
  text-transform: none; }
button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button; }
button:focus-visible,
[type="button"]:focus-visible,
[type="reset"]:focus-visible,
[type="submit"]:focus-visible {
  border: 0;
  padding: 0; }
fieldset { padding: 0.25em 0.75em 0.625em; }
legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal; }
progress { vertical-align: baseline; }
textarea { overflow: auto; }
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0; }
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }
[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }
details { display: block; }
summary { display: list-item; }
template, [hidden] {
  display: none; }

/* normalize end */

/* Render Browser default styles */

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box }
ul,ol { list-style-position: outside; }
ol, ul, dl { display: flow-root } /* this allows correct list indentation in floats */

table { border-collapse: collapse; border-spacing: 0; }
table td { display: table-cell; vertical-align: top; }

[type="checkbox"],
[type="radio"] {
  vertical-align: middle;
  margin-right: 2px; }
[type="button"],
[type="reset"],
[type="submit"] {
  width: auto !important; }

/**! Pure, a mobile first responsive theme
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    Changed Serendipity consistency naming presets from -> to, in order of appearance:
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    id ""
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    class "serendipity_Entry_Date" to live inside a header container element (see removed section)
    class "serendipity_date" to "post_byline"
    class "serendipity_entry" to "post"
    class "serendipity_entry_extended" to ID "#extended" with class "post_content"
    class "serendipity_entryFooter" to "post_info", but still kept for hooks $entry.add_footer and $entry.plugin_display_dat
    class ".serendipitySideBarItem" to ".sidebar_widget" - while keeping serendipitySideBarItem, serendipitySideBarTitle, serendipitySideBarContent are a need for hooked plugins, eg sidebarhider
    class ".serendipity_commentBody" to ".comment_content"
    class ".serendipity_msg_*" to ".msg_*"
    class pagination "prev" to "pager_prev"
    class pagination "next" to "pager_next"
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    Removed "#mainpane" for HTML5 <header>, <nav>, <aside>, <main>, <aside>, <footer> elements, since the structure is set in <body>
    Removed ".serendipity_Entry_Date", since being a Heading "h" format element only
    Removed ".serendipity_commentsTitle", since being a Heading "h" format element only
    Removed ".info", since being an inner "p" element only
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    Use table class="expand" for posted entry tables.
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
 **/

/* Modern Serendipity image sizing default */

img {
  border: 0;
  vertical-align: middle;
  overflow: hidden;
  position: relative; }
embed, object, audio, video, img {
  max-width: 100%; }
img, video {
  height: auto; }

/* scrollbar */

/* Works on Chrome, Edge, and Safari */
html *::-webkit-scrollbar {
  width: 12px; }
html *::-webkit-scrollbar-track {
  background: #f5f5f5; }
html *::-webkit-scrollbar-thumb {
  background-color: #1c2128;
  border-radius: 20px;
  border: 3px solid #f5f5f5; }
/* Others Browsers */
html, body, ol, ul, select, textarea, pre {
  scrollbar-width: thin;
  scrollbar-color: #1c2128 #f5f5f5; }

/* dark-theme */

/* the button */
img#daynight {
  width: 100%;
  height: 100%; }
.btn {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: .375rem .75rem;
  font-size: 1rem;
  border-radius: .25rem;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }
.float {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  position: fixed;
  top: auto;
  bottom: 10px;
  right: 10px;
  cursor: pointer;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  padding-top: 2px;
  z-index: 1000;
  background-color: #294564;
  display: flex; }
  [data-dark-theme="dark"] .float {
    box-shadow: 0 1px 0px #3d4c5a;
    background-color: #1c2128; }
  @media (min-width:640px) {
    .float {
      top: 12px; }
      [data-dark-theme="dark"] .float {
        box-shadow: 0 2px 3px #1c2128;
        background-color: #373e47; }
  }
.navbar-shader {
  padding-top: .3125rem;
  padding-bottom: .3125rem;
  margin-right: 1rem;
  font-size: 1.25rem;
  text-decoration: none;
  white-space: nowrap; }

/* Works on Chrome, Edge, and Safari */
html[data-dark-theme="dark"] *::-webkit-scrollbar-track {
  background: #1c2128; }
html[data-dark-theme="dark"] *::-webkit-scrollbar-thumb {
  background-color: #76787b;
  border-color: #1c2128; }
[data-dark-theme="dark"] *::-webkit-scrollbar-corner {
  background-color: #22272f; }
/* Others Browsers */
html[data-dark-theme="dark"], [data-dark-theme="dark"] body, [data-dark-theme="dark"] ol, [data-dark-theme="dark"] ul, [data-dark-theme="dark"] select, [data-dark-theme="dark"] textarea, [data-dark-theme="dark"] pre {
  scrollbar-color: #8899b1 #1c2128; }
/* Chromium default as fallback */
[data-dark-theme="dark"] input {
  color-scheme: dark; }
/* Chromium forced bg color for consistency */
[data-dark-theme="dark"] input:autofill {
  box-shadow: inset 0 0 0 100px #22272e !important; }

/* more or less sectioned dark-theme styles */
[data-dark-theme="dark"] body {
  background-color: #1c2128;
  color: #adbac7; }
  [data-dark-theme="dark"] #content,
  [data-dark-theme="dark"] #serendipityLeftSideBar,
  [data-dark-theme="dark"] #serendipityRightSideBar {
    background: #2d333b; }
  [data-dark-theme="dark"] #serendipity_banner {
    background-color: #232b33; }
  [data-dark-theme="dark"] #footer,
  [data-dark-theme="dark"] #menubar_mobile {
/*      Legend: insetOption leftPosition topPosition blurStrength spreadStrength color*/
    box-shadow: 0px 2px 3px rgba(0,0,0,.5), 0px -2px 3px rgba(0,0,0,.5);
    background: #1c2128; }
  [data-dark-theme="dark"] .serendipity_commentForm,
  [data-dark-theme="dark"] .archive_year,
  [data-dark-theme="dark"] .container,
  [data-dark-theme="dark"] .card,
  [data-dark-theme="dark"] .navbar,
  [data-dark-theme="dark"] .navbar a,
  [data-dark-theme="dark"] footer {
    background-color: #2d333b; }
  [data-dark-theme="dark"] a, [data-dark-theme="dark"] a:visited,
  [data-dark-theme="dark"] .navbar a,
  [data-dark-theme="dark"] footer {
    color: #c0c4d1 !important; }
  [data-dark-theme="dark"] #navbar ul {
    background-color: #22272e;
    background-image: -webkit-linear-gradient(top, #2d333b, #22272e);
    background-image: -moz-linear-gradient(top, #2d333b, #22272e);
    background-image: linear-gradient(to bottom, #2d333b, #22272e); }
    [data-dark-theme="dark"] #navbar a:visited {
      color: #ccdeef !important; }
    [data-dark-theme="dark"] #navbar a:hover, [data-dark-theme="dark"] #navbar a:focus {
      background-color: #ccdee7 !important;
      color: #222 !important; }
  [data-dark-theme="dark"] input[type="date"], [data-dark-theme="dark"] input[type="datetime"], [data-dark-theme="dark"] input[type="datetime-local"], [data-dark-theme="dark"] input[type="month"], [data-dark-theme="dark"] input[type="number"], [data-dark-theme="dark"] input[type="password"], [data-dark-theme="dark"] input[type="time"], [data-dark-theme="dark"] input[type="week"], [data-dark-theme="dark"] input[type="email"], [data-dark-theme="dark"] input[type="search"], [data-dark-theme="dark"] input[type="tel"], [data-dark-theme="dark"] input[type="url"], [data-dark-theme="dark"] select, [data-dark-theme="dark"] textarea, [data-dark-theme="dark"] textarea:invalid, [data-dark-theme="dark"] input[type="text"], [data-dark-theme="dark"] input:invalid, [data-dark-theme="dark"] .input_captcha {
    background-color: #22272e;
    border-color: #373e47 #373e47 #444c45;
    border-image: linear-gradient(135deg, #414141 0%, #414565 100%) 1;
    border-image-slice: 1;
    box-shadow: 2px 3px 7px rgb(32 32 33 / 90%);
    color: #adbac7; }
  [data-dark-theme="dark"] select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background: #22272e url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'><path fill='%23adbac7' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>") right .75rem center/8px 10px no-repeat; }
  [data-dark-theme="dark"] form button:not(.tox-tbtn), [data-dark-theme="dark"] input[type="button"], [data-dark-theme="dark"] input[type="reset"], [data-dark-theme="dark"] input[type="submit"] {
    background: #2c3d51;
    background: -webkit-linear-gradient(135deg, #1c2128, #2c3d51);
    background: linear-gradient(135deg, #1c2128, #2c3d51);
    color: #dcdcdc;
    text-shadow: none;
    border-color: #444c56;
    border-radius: 4px;
    padding: .325rem .625rem;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 1; }
  [data-dark-theme="dark"] form button:not(.tox-tbtn)::before, [data-dark-theme="dark"] input[type="button"]::before, [data-dark-theme="dark"] input[type="reset"]::before, [data-dark-theme="dark"] input[type="submit"]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: -webkit-linear-gradient(135deg, #4f46e5, #4338ca);
    background: linear-gradient(135deg, #4f46e5, #4338ca);
    z-index: -1;
    opacity: 0;
    transition: opacity 0.3s ease; }
  [data-dark-theme="dark"] form button:not(.tox-tbtn):hover, [data-dark-theme="dark"] input[type="button"]:hover, [data-dark-theme="dark"] input[type="reset"]:hover, [data-dark-theme="dark"] input[type="submit"]:hover {
    box-shadow: 0 3px 9px rgba(13, 13, 13, 0.9);
    background: linear-gradient(135deg, #4f46e5, #4338ca); }
  [data-dark-theme="dark"] form button:not(.tox-tbtn):hover::before, [data-dark-theme="dark"] input[type="button"]:hover::before, [data-dark-theme="dark"] input[type="reset"]:hover::before, [data-dark-theme="dark"] input[type="submit"]:hover::before {
    opacity: 1; }
  [data-dark-theme="dark"] form button:not(.tox-tbtn):active, [data-dark-theme="dark"] input[type="button"]:active, [data-dark-theme="dark"] input[type="reset"]:active, [data-dark-theme="dark"] input[type="submit"]:active {
    background: linear-gradient(135deg, #4f46e5, #4338ca);
    box-shadow: #cdd9e5 0 0 5px 0;
    border-color: #1c2128; }
  [data-dark-theme="dark"] form button:not(.tox-tbtn):focus, [data-dark-theme="dark"] input[type="button"]:focus, [data-dark-theme="dark"] input[type="reset"]:focus, [data-dark-theme="dark"] input[type="submit"]:focus {
    box-shadow: #cdd9e5 0 0 5px 0;
    border: none;
    color: #a3aaba; }
  [data-dark-theme="dark"] form button:not(.tox-tbtn):active, [data-dark-theme="dark"] form button:not(.tox-tbtn):visited, [data-dark-theme="dark"] form button:not(.tox-tbtn):hover, [data-dark-theme="dark"] form button:not(.tox-tbtn):focus, [data-dark-theme="dark"] input[type="button"]:active, [data-dark-theme="dark"] input[type="button"]:visited, [data-dark-theme="dark"] input[type="button"]:hover, [data-dark-theme="dark"] input[type="button"]:focus, [data-dark-theme="dark"] input[type="reset"]:active, [data-dark-theme="dark"] input[type="reset"]:visited, [data-dark-theme="dark"] input[type="reset"]:hover, [data-dark-theme="dark"] input[type="reset"]:focus, [data-dark-theme="dark"] input[type="submit"]:active, [data-dark-theme="dark"] input[type="submit"]:visited, [data-dark-theme="dark"] input[type="submit"]:hover, i[data-dark-theme="dark"] nput[type="submit"]:focus {
    color: #cdd9e5; }
  [data-dark-theme="dark"] form button:not(.tox-tbtn)[disabled], [data-dark-theme="dark"] select[disabled], [data-dark-theme="dark"] select[disabled] option, [data-dark-theme="dark"] select[disabled] optgroup, [data-dark-theme="dark"] textarea[disabled], [data-dark-theme="dark"] input[disabled] {
    color: #3c3c3c; }
  [data-dark-theme="dark"] .msg_notice, [data-dark-theme="dark"] .serendipity_msg_notice, [data-dark-theme="dark"] .msg_important, [data-dark-theme="dark"] .serendipity_msg_important {
    background-color: #1c2128; }
  [data-dark-theme="dark"] .msg_notice, [data-dark-theme="dark"] .serendipity_msg_notice {
    border-color: #517393;
    color: #6495ed; }
  [data-dark-theme="dark"] .msg_important, [data-dark-theme="dark"] .serendipity_msg_important {
    border-color: #7c1c2e;
    color: #ff5072; }
  [data-dark-theme="dark"] .icon-info {
    background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' role='img' fill='%23d9edf7' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/></svg>"); }
  [data-dark-theme="dark"] .has-error .form-control {
    border-color: #535; }
  [data-dark-theme="dark"] .card {
    border-color: #444c56; }
  [data-dark-theme="dark"] code {
    color: #b0a6ed;
    font-family: ui-monospace,"Cascadia Mono","Segoe UI Mono","Liberation Mono",Menlo,Monaco,Consolas,monospace; }
  [data-dark-theme="dark"] kbd {
      color: #dadada;
      background-color: #22272e;
      border-color: #484848; }
  [data-dark-theme="dark"] hr {
    color: #444c56;
    border-color: inherit;
    border: 0;
    border-top: 1px solid #444c56; }
  [data-dark-theme="dark"] table:not(.serendipity_calendar) thead {
    background-color: #191f27; }
    [data-dark-theme="dark"] .post thead tr, [data-dark-theme="dark"] .post_content thead tr {
      box-shadow: inset 0em -1px #00032b; }
    [data-dark-theme="dark"] table thead th {
      border-color: #444c56;
      border-width: 1px; }
  [data-dark-theme="dark"] tr td:first-of-type {
    padding-left: .25em; }
  [data-dark-theme="dark"] #content,
  [data-dark-theme="dark"] #serendipityLeftSideBar,
  [data-dark-theme="dark"] #serendipityRightSideBar,
  [data-dark-theme="dark"] .serendipity_commentForm,
  [data-dark-theme="dark"] .content_msg, [data-dark-theme="dark"] .serendipity_content_message, [data-dark-theme="dark"] .serendipity_commentDirection,
  [data-dark-theme="dark"] table td {
    border-color: #373f47; }
  [data-dark-theme="dark"] table:not(.table,.serendipity_calendar,.calendar-nav) td {
    border-style: solid;
    padding: 0 2px; }
  [data-dark-theme="dark"] .archive_year,
  [data-dark-theme="dark"] .post table, [data-dark-theme="dark"] .post_content table,
  [data-dark-theme="dark"] .post_info, [data-dark-theme="dark"] .serendipity_entryFooter,
  [data-dark-theme="dark"] .serendipity_imageComment_center, [data-dark-theme="dark"] .serendipity_imageComment_left, [data-dark-theme="dark"] .serendipity_imageComment_right {
    box-shadow: none;
    border-color: #3b434c; }
  [data-dark-theme="dark"] .post_content blockquote {
    border-left-color: #adbac7; }
    [data-dark-theme="dark"] .post_content :not(first-of-type) blockquote.odd {
      border-left-color: darkseagreen; }
  [data-dark-theme="dark"] .serendipity_date {
    color: #a3aaba; }
  [data-dark-theme="dark"] .serendipity_searchQuery {
    background-color: #c93c37; }
  [data-dark-theme="dark"] .search_msg .searchresults, [data-dark-theme="dark"] .search_msg .searchterm {
    color: #c93c37; }
  [data-dark-theme="dark"] #content > .serendipity_entrypaging:first-child {
    border-bottom-color: #1c2128; }
  [data-dark-theme="dark"] table:not(.serendipity_calendar) tbody tr:nth-child(2n) {
    background-color: #1c232b; }
  [data-dark-theme="dark"] table:not(.serendipity_calendar) tbody tr:nth-child(2n+1) {
    background-color: #212a34; }
  [data-dark-theme="dark"] fieldset.form-group {
    border-color: #444c56; }
  [data-dark-theme="dark"] figure {
    border-color: #444c56; }
  [data-dark-theme="dark"] .serendipity_imageComment_txt {
    border-color: #3b434c;
    background-color: #22252a; }
  [data-dark-theme="dark"] section.sidebar_widget {
    border-bottom-color: #444c56;  }
  [data-dark-theme="dark"] nav.pager {
    background-color: #2d333b;
    background-image: -webkit-linear-gradient(top, #2d333b, #22272e);
    background-image: -moz-linear-gradient(top, #2d333b, #22272e);
    background-image: linear-gradient(to bottom, #2d333b, #22272e);
    box-shadow: 1px 1px 2px rgba(43, 43, 43, 0.5);
    border-color: #444c56; }
  [data-dark-theme="dark"] .plugin_comment_wrap {
    border-top-color: #40454a;
    border-bottom-color: #40454a;
    background-color: #2d333b;
    color: #fdfcfa; }
  [data-dark-theme="dark"] .plugin_comment_body {
    color: #a4b5c6; }
  [data-dark-theme="dark"] .comment.odd, [data-dark-theme="dark"] .comment.even, [data-dark-theme="dark"] .trackback.tb-odd, [data-dark-theme="dark"] .trackback.tb-even {
    border-color: #444c56; }
  [data-dark-theme="dark"] .trackback.tb-odd {
    background-color: #22272e; }
  [data-dark-theme="dark"] #trackbacks li.pingback.tb-odd, [data-dark-theme="dark"] #trackbacks li.pingback.tb-even {
    background-color: transparent; }
  [data-dark-theme="dark"] .trackback_author {
    color: #a3aaba; }
  [data-dark-theme="dark"] #trackbacks li.pingback {
    border-color: #444c56; }
  [data-dark-theme="dark"] #trackbacks details > div {
    color: #b7c3ea; }
  [data-dark-theme="dark"] .comment.odd, [data-dark-theme="dark"] .comment.even, [data-dark-theme="dark"] .trackback.tb-odd, [data-dark-theme="dark"] .trackback.tb-even {
    border-color: #3b434c; }
  [data-dark-theme="dark"] .comment.odd {
    background-color: #313740; }
  [data-dark-theme="dark"] .comment.odd > .comment_content {
    background-color: #2c323b; }
  [data-dark-theme="dark"] pre,
  [data-dark-theme="dark"] .comment_content {
    border-color: #3b434c;
    color: #9eaabd; }
  [data-dark-theme="dark"] .comment_content {
    background-color: #2c323b; }
  [data-dark-theme="dark"] pre {
    background-color: #20272e; }
  [data-dark-theme="dark"] article.post.byauthor {
    background: #292f37;
    border-color: #444c56; }
    [data-dark-theme="dark"] article.post.byauthor h3 a, [data-dark-theme="dark"] article.post.byauthor h3 a:visited {
      color: #9ca1af !important; }
  [data-dark-theme="dark"] .serendipity_comment.odd {
    background-color: #2d353e;
    border-color: #3b434c; }
  [data-dark-theme="dark"] .comment_content blockquote,
  [data-dark-theme="dark"] .serendipity_comment_author_self h4 .pc-owner {
    border-color: #535b66; }
  [data-dark-theme="dark"] #c0 {
    border-color: #5b636e;
    background-image: repeating-linear-gradient(-45deg, #22272e00 0 20px, #22272e 20px 40px); }
  [data-dark-theme="dark"] .mediaItemFooter {
    background-color: #323941; }
  [data-dark-theme="dark"] .hljs {
    color: #c8c8c8;
    background: #22272f; }
    [data-dark-theme="dark"] .hljs-keyword, [data-dark-theme="dark"] .hljs-selector-tag, [data-dark-theme="dark"] .hljs-subst {
      color: currentColor; }
    [data-dark-theme="dark"] .hljs-tag, [data-dark-theme="dark"] .hljs-name, [data-dark-theme="dark"] .hljs-attribute {
      color: #bebeff; }
  :root .lightbox .lb-image {
    border-color: #495057; }
  [data-dark-theme="dark"] .serendipity_commentDirection {
    background: transparent;
    box-shadow: none; }
  [data-dark-theme="dark"] .staticpage_results, [data-dark-theme="dark"] .serendipity_search, [data-dark-theme="dark"] .serendipity_content_message, [data-dark-theme="dark"] .content_msg .serendipity_msg_success, [data-dark-theme="dark"] .msg_success, [data-dark-theme="dark"] .serendipity_msg_notice, [data-dark-theme="dark"] .msg_notice, [data-dark-theme="dark"] .serendipity_msg_important, [data-dark-theme="dark"] .msg_important, [data-dark-theme="dark"] .msg_question, [data-dark-theme="dark"] .serendipity_commentDirection {
    box-shadow: none; }
  [data-dark-theme="dark"] .search-results h3, [data-dark-theme="dark"] .pages_found h3, [data-dark-theme="dark"] .faq-results h3 {
    display: inline-block;
    background-color: #20242b;
    border: 1px solid #444c56;
    padding: .5em; }
  [data-dark-theme="dark"] .serendipity_Entry_Date.freetag_cloud {
    background-image: linear-gradient(#323941, #22272e);
    box-shadow: 1px 2px 6px rgba(0,0,0,.5);
    border-color: #323941; }
  [data-dark-theme="dark"] .freetag_cloud .serendipity_freetag_taglist {
    margin-top: .25rem;
    border: 1px solid transparent;
    color: #cdd9e5; }
  [data-dark-theme="dark"] .static-entries-list.odd {
    background-color: #2f353e; }
  [data-dark-theme="dark"] #staticpage_nav {
    border-color: #444c56; }
    [data-dark-theme="dark"] #staticpage_nav .staticpage_navigation_dummy {
      color: #545d68; }
    [data-dark-theme="dark"] #staticpage_nav .staticpage_navigation_breadcrumb {
      background-color: #444c56; }
  [data-dark-theme="dark"] #content .shariff-button {
    border-color: #444c56;  }
    [data-dark-theme="dark"] #content .shariff-button a {
      background-color: #22272e; }
    [data-dark-theme="dark"] #content .shariff-button a:hover {
      background-color: #554f4f; }
  [data-dark-theme="dark"] .faq_a {
    background: #22272e;
    border-color: #444c56; }
  [data-dark-theme="dark"] .faq_q {
    background: #3f4e60;
    border-color: #2d333b; }
  [data-dark-theme="dark"] table.serendipity_calendar a, [data-dark-theme="dark"] table.serendipity_calendar a:visited {
    color: #ff4136 !important; }
  [data-dark-theme="dark"] td.Today {
    background-color: rebeccapurple; }
  [data-dark-theme="dark"] .mediasidebaritem img {
    background-color: #fff; /* a transparent img case */}
  [data-dark-theme="dark"] .cke_inner,
  [data-dark-theme="dark"] .cke_wysiwyg_frame, [data-dark-theme="dark"] .cke_wysiwyg_div {
    background-color: #1b1f23; }
  [data-dark-theme="dark"] .cke_top {
    background: #2d333b;
    border-bottom-color: #444c56; }
  [data-dark-theme="dark"] select.cke_dialog_ui_input_select {
    background-color: #22272e;
    border-color: #373e47; }
  [data-dark-theme="dark"] .cke_dialog_title, [data-dark-theme="dark"] .cke_dialog_footer {
    border-color: #444c56 !important;
    box-shadow: none !important;
    outline: none !important; }
  [data-dark-theme="dark"] input.cke_dialog_ui_input_text, [data-dark-theme="dark"] input.cke_dialog_ui_input_password, [data-dark-theme="dark"] textarea.cke_dialog_ui_input_textarea {
    border-color: #444c56 #444c56 !important;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15) inset !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.15) inset !important; }
  [data-dark-theme="dark"] a.cke_dialog_ui_button {
    color: #cdd9e5 !important;
    background: #323941 !important;
    background-image: -webkit-linear-gradient(#444c56,#2d333b) !important;
    background-image: linear-gradient(#444c56,#2d333b) !important;
    border-color: #636e7b !important; }

/* toolbar and cke content CKEditor switch mode workaround styles */
/* for to-light-mode switch w/o page reload */
:not([data-dark-theme="dark"]) .cke_top {
  background: #f8f8f8;
  border-style: inset;
  border-color: #1c212817;
  border-width: 1px;
  border-bottom: 1px solid #d1d1d1;}
/* for to-dark-mode switch w/o page reload */
[data-dark-theme="dark"] .cke_chrome {
  border: 1px solid transparent; }
  [data-dark-theme="dark"] .cke_top {
    background: #2d333b;
    border: 0 none;
    border-bottom: 1px solid #444c56;
    -webkit-box-shadow: 0 1px 0 #353b44 inset;
    box-shadow: 0 1px 0 #353b44 inset; }
[data-dark-theme="dark"] #serendipity_authors_list.xmlsvg .serendipity_xml_icon img {
  background-color: #00ff70; }
[data-dark-theme="dark"] #serendipity_categories_list.xmlsvg .serendipity_xml_icon img {
  background-color: #fbe090; }
[data-dark-theme="dark"] #serendipity_syndication_list .serendipity_xml_icon img {
  background-color: #0ff; }
[data-dark-theme="dark"] .xmlsvg  .serendipity_xml_icon img {
  background: linear-gradient(to left bottom, rgba(0, 255, 255, 1) 0%, rgb(207 203 89) 50%, rgba(255, 255, 0, 1) 100%), linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 1)); }
[data-dark-theme="dark"] #serendipity_categories_list input[type="checkbox"],
[data-dark-theme="dark"] #serendipity_authors_list input[type="checkbox"] {
  accent-color: #777;
  filter: invert(100%) hue-rotate(18deg) brightness(1.7); }
[data-dark-theme="dark"] #serendipity_categories_list input[type="checkbox"] {
  margin-right: 4px; /*consistency space like for authors checkbox*/
}
/* spamblock captcha non-GD fallback */
[data-dark-theme="dark"] .serendipity_comment_captcha_image {
  background-color: transparent !important; }
[data-dark-theme="dark"] .serendipity_comment_captcha .captcha {
  border-color: #333941; }

/* defaults */

html {
  font-size: calc(.521rem + 1vw); /* sizes SMALL MOBILE SCREENS text responsively from ~11px to ~16px - see media queries */
}
body {
  margin: 0;
  min-width: 280px;
  width: 100%;
  background-color: #ddd;
  font-size: 16px;
  font-size: 1rem;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  overflow-x: hidden;
}
input, textarea {
  font-size: 14px;
  font-size: .875rem;
  font-family: verdana, arial, helvetica, sans-serif;
}
[type="checkbox"],
[type="radio"] {
  vertical-align: middle;
  margin-right: 2px;
}
th, td {
  font-size: 14px;
  font-size: .875rem;
}
h1 {
  font-size: 1.6rem;
  margin: 0.67em 0; }
h2 {
  font-size: 1.5rem;
  margin: 0 0 .6667em;
}
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; overflow: auto; }
pre {
  width: auto;
  min-width: 20em;
  display: inline-grid;
  overflow: auto;
  background: #fefefe;
  border: 1px solid #ccc;
  margin: .5em auto;
  padding: .5em; }
  pre code {
    font-size: 16px;
    font-size: 1rem;
    white-space: pre;
    white-space: pre-wrap !important;/* overwrite a possible "white-space: pre" via highlight.css */
    overflow-x: auto;
    padding: .5em 0; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

a, a:visited {
  color: #3e5f81; }
  a:hover, a:focus {
    color: #d52; }

dt {
  font-weight: bold; }

dd {
  margin: 0; }

pre, code, samp, kbd {
  font-size: 14px;
  font-size: 0.875rem;
}

kbd {
  padding: .25rem .5rem;
  color: #000;
  background-color: #fdfdfd;
  border-radius: .25rem;
  border: 1px solid #d0d0d0;
}

hr {
  color: #fefefe;
  clear: both;
  display: inline-block;
  width: 100%;
}

q {
  quotes: '“' '”' '‘' '’'; }

:lang(de) q {
  quotes: '„' '“' '‚' '‘'; }

p {
  overflow-wrap: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto; }
  p code, p samp, p kbd {
    overflow-wrap: anywhere;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    hyphens: none; }

nav { display: block; }
nav ul, nav ol {
  list-style: none;
  margin: 0;
  padding: 0; }

.disable-pointer-events {
  pointer-events: none !important; }

input[type="file"]:focus, input[type="file"]:active, input[type="radio"]:focus, input[type="radio"]:active, input[type="checkbox"]:focus, input[type="checkbox"]:active {
  box-shadow: none; }

::-webkit-input-placeholder {
  color: #888; }

::-moz-placeholder {
  color: #888; }

:invalid {
  box-shadow: none; }

optgroup {
  background: #fcfcfc;
  color: #222;
  font-style: normal; }

input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="number"], input[type="password"], input[type="time"], input[type="week"], input[type="email"], input[type="search"], input[type="tel"], input[type="url"], select, textarea, input[type="text"] {
  -webkit-appearance: none;
  background-clip: padding-box;
  background-color: #fcfcfc;
  border: 1px solid;
  border-color: #c1c1c1 #c1c1c1 #e1e1e1;
  border-radius: 0;
  box-sizing: border-box;
  color: #222;
  height: 1.8em;
  outline: 0;
  padding: 2px 3px;
  text-align: left; }
  input[type="date"][disabled], input[type="datetime"][disabled], input[type="datetime-local"][disabled], input[type="month"][disabled], input[type="number"][disabled], input[type="password"][disabled], input[type="time"][disabled], input[type="week"][disabled], input[type="email"][disabled], input[type="search"][disabled], input[type="tel"][disabled], input[type="url"][disabled], select[disabled], textarea[disabled], input[type="text"][disabled] {
    background-color: #eee; }

select[size], select[multiple], textarea {
  height: auto; }

@media (-webkit-min-device-pixel-ratio: 0) {
  select {
    background-image: url('data:image/gif;base64,R0lGODlhDQAEAIAAAAAAAP8A/yH5BAEHAAEALAAAAAANAAQAAAILhA+hG5jMDpxvhgIAOw==');
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 20px; }

  select[size], select[multiple] {
    background-image: none;
    padding: 0; }
}

blockquote {
  font-style: normal;
  display: inline-block;
}

textarea {
  min-height: 40px;
  overflow: auto;
  resize: vertical;
  width: 100%; }

form button:not(.tox-tbtn), input[type="button"], input[type="reset"], input[type="submit"] {
  background-color: white;
  background-image: -webkit-linear-gradient(top, #fff, #ddd);
  background-image: linear-gradient(to bottom, #fff, #ddd);
  background-clip: padding-box;
  border: 1px solid;
  border-color: #ddd #bbb #999;
  border-radius: 4px;
  color: #111;
  display: inline-block;
  line-height: normal;
  outline: 0;
  padding: 3px 10px;
  padding: 0.1875rem 0.625rem;
  text-align: center;
  text-decoration: none;
  text-shadow: #eee 0 1px 1px;
  width: auto; }
  form button:not(.tox-tbtn):hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
    background-color: white;
    background-image: -webkit-linear-gradient(top, #fff, #ccc);
    background-image: linear-gradient(to bottom, #fff, #ccc); }
  form button:not(.tox-tbtn):active, input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active {
    background-color: white;
    background-image: -webkit-linear-gradient(top, #fff, #ccc);
    background-image: linear-gradient(to bottom, #fff, #ccc);
    border-color: #999 #bbb #ddd;
    box-shadow: inset rgba(17, 17, 17, 0.25) 0 1px 2px 0; }
  form button:not(.tox-tbtn):focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus {
    box-shadow: #06f 0 0 5px 0;
    z-index: 1; }
  form button:not(.tox-tbtn):active, form button:not(.tox-tbtn):visited, form button:not(.tox-tbtn):hover, form button:not(.tox-tbtn):focus, input[type="button"]:active, input[type="button"]:visited, input[type="button"]:hover, input[type="button"]:focus, input[type="reset"]:active, input[type="reset"]:visited, input[type="reset"]:hover, input[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:visited, input[type="submit"]:hover, input[type="submit"]:focus {
    color: #111; }
  form button:not(.tox-tbtn)[disabled], select[disabled], select[disabled] option, select[disabled] optgroup, textarea[disabled], input[disabled] {
    box-shadow: none;
    color: #888;
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none; }

.form_instruct {
    /* display: inline-block;
    font-style: italic; */
}
.form_field, .form_select {
    margin: .5em auto;
}
.form_tarea {
    margin-bottom: 1em;
}
.form_buttons {
    margin: 1em auto;
}
.form_field label, .form_select label, .form_tarea label {
    display: block;
    font-weight: bold;
    padding-bottom: 1px;
}
.form_field input, .form_field select, .form_select input, .form_select select, .form_tarea input, .form_tarea select {
    width: 100%;
}
.form_hooks {
    display: inline-grid;
}

.has-error .checkbox,.has-error .checkbox-inline,.has-error .control-label,.has-error .help-block,.has-error .radio,.has-error .radio-inline,.has-error.checkbox label,.has-error.checkbox-inline label,.has-error.radio label,.has-error.radio-inline label{color:#a94442}
.has-error .form-control{border-color:#a94442;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}
.has-error .form-control:focus{border-color:#843534;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483}
.has-error .input-group-addon{color:#a94442;border-color:#a94442;background-color:#f2dede}
.text-hint{color:#dc3545}a.text-hint:focus,a.text-hint:hover{color:#a71d2a}
fieldset.form-group {border: 1px solid #dfdfdf}
.form-group.form-hook {margin: 1rem auto}

/* required attribute labeled */
input:invalid, textarea:invalid {
    background-color: #eee;
}

ul li > p, ol li > p {
    margin: 0.25em 0;
}

.plainList {
    font-weight: initial;
}

.mfp-figure figure {
    margin: 0;
    border: 0 none;
}

.ico {
    color: #294564;
    vertical-align: middle;
    background-color: transparent;
    padding: .375rem .75rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.icon-info {
    display: inline-block;
    content: "";/* fill %23 = # */
    background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' role='img' fill='%233367a2' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/></svg>");
    background-repeat: no-repeat;
    padding-bottom: .9125em;
    vertical-align: text-bottom;
}

/** Main grid **/

body {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    width: auto;
    min-height: 94vh;
    background-color: #f5f5f5;
}
#serendipity_banner {
    grid-column: span 3;
}
#content {
    width: 100%;
    margin: 0 auto 0;
    padding: .5em 1em;
    background-color: #FFF;
}
#serendipityLeftSideBar,
#serendipityRightSideBar {
    padding: .5em 1em;
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background-color: #FFF;
    width: 100%;
}
#footer {
    grid-column: span 3;
    text-align: center;
    width: 100%; }
    #footer p {
      visibility: hidden; }

#serendipityRightSideBar .sidebar_widget,
#serendipityLeftSideBar .sidebar_widget {
    min-width: 12em;
    margin: 0 0 auto;
}
#serendipityLeftSideBar > div,
#serendipityRightSideBar > div {
    width: auto;
    margin-right: 1em;
    border-bottom: 0 none;
}

/* Add the wrap bgcolor as a workaround, while sometimes a need,
   when #content contains elements like massive tables not being
   flexible enough for the wrap flex
#serendipityRightSideBar, #footer {
    background-color: #74784B;
} */

#serendipity_banner {
    width: 100%;
    display: none;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    height: auto;
    min-height: 4em;
    overflow: hidden;
    padding-bottom: .25em;
    z-index: 10;
    background-color: #294564;
    box-shadow: 0 1px 4px rgba(0,0,0,.5);
    color: #ccdde7;
    text-shadow: 1px 1px 1px rgba(0,0,0,.7);
}
#serendipity_banner h1 {
    display: initial;
}
/* do not show on mobile head */
#serendipity_banner h2 {
    display: none;
}
#serendipity_banner h1 {
    padding-top: 1em;
    padding-left: 0.5em;
}
a.homelink1,
a.homelink1:hover,
a.homelink1:link,
a.homelink1:visited {
    color: #fdfdfd;
    text-decoration: none;
}
#serendipity_banner h2 {
    margin: 0;
    padding-left: 0.75em;
    font-size: 1.15rem;
}
a.homelink2,
a.homelink2:hover,
a.homelink2:link,
a.homelink2:visited {
    color: #e0e0e0;
    text-decoration: none;
}
@media (min-width:520px) {
    #serendipity_banner h1 {
        padding-left: 1em;
    }
    #serendipity_banner h2 {
        padding-left: 1.391em;
    }
}
@media (min-width:640px) {
    #serendipity_banner {
        min-height: 10em;
    }
    #serendipity_banner h1, #serendipity_banner h2 {
        display: inherit;
    }
}

#navbar {
  margin: 1.25rem auto 0;
  padding: 0 .5rem; }
  #navbar ul {
    width: auto;
    background-color: #294564; }
  #navbar ul li {
    display: inline-block;
    margin-right: .5em;
    border: 1px solid #55656e;
    border-radius: 3px; }
    #navbar ul li.last {
      margin-right: 0; }
  #navbar a, #navbar span {
    padding: 4px 5px;
    padding: 0.25rem 0.3285rem;
    display: block; }
  #navbar a {
    text-decoration: none; }
    #navbar a, #navbar a:visited {
      color: #ccdeef;
      -webkit-transition: all 0.3s linear;
      transition: all 0.3s linear; }
    #navbar a:hover, #navbar a:focus {
      background-color: #ccdee7;
      border-radius: 3px;
      color: #222;
      -webkit-transition: all 0.3s linear;
      transition: all 0.3s linear;
      text-shadow: #16375c 0 1px 1px; }

#navbar #open-nav {
  font-size: 24px;
  font-size: 1.5rem;
  padding: 0; }
  #navbar #open-nav .icon-menu:before {
    margin: 0; }

#content a:link,
#content a:visited,
#content a:active {
    color: #001f3f;
}
#content a:hover {
    color: #0074d9;
}
nav.pager {
    text-align: center;
    font-size: .938rem;
    background-color: #fefefe; /* fallback color if gradients are not supported */
    background-image: -webkit-linear-gradient(top, #fefefe, #eee); /* For Chrome 25 and Safari 6, iOS 6.1, Android 4.3 */
    background-image:    -moz-linear-gradient(top, #fefefe, #eee); /* For Firefox (3.6 to 15) */
    background-image:         linear-gradient(to bottom, #fefefe, #eee); /* Standard syntax; must be last */
    box-shadow: 1px 1px 2px rgba(111, 111, 111, 0.5);
    border: 1px solid #eee;
    border-radius: 5px;
}

#reply .totop, nav.pager .totop, .closed_cf.totop {
  display: flex;
  justify-content: flex-end; }
  nav.pager .totop {
    margin: -2.5em .5em 0 0; }
  #reply .totop, .closed_cf.totop {
    margin: -2em .5em 0 0; }

nav.pager ul {
    margin: 0 3em 1.5em;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#navbar ul li.navsearch {
    border: initial;
    border-radius: initial;
    margin-right: .25em;
}
nav.pager + .serendipity_blogpdf {
    margin-top: 1rem;
}

#headsearch {
    margin: 1rem .25rem 0;
}
#headsearch, .navsearch {
    float: right;
}

#footer i {
    font-variant: small-caps;
}

/* The mobile Hamburger-Menu-Button */
#menu {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 5;
    width: 50px;
    -webkit-tap-highlight-color: transparent;
}
#menutxt {
    font-family: Arial;
    font-size: 10px;
    display: block;
    width: 50px;
    text-align: center;
    margin-top: -8px;
    padding-bottom: .5rem;
}
#buttonname {
    font-size: 0 }
    .c-menu {
        display: block;
        position: relative;
        overflow: hidden;
        margin: 0;
        padding: 0;
        width: 50px;
        height: 26px;
        border: none;
        cursor: pointer;
        transition: background .3s }
    .c-menu:focus {
        outline:0 }
    .c-menu span {
        display: block;
        position: absolute;
        top: 12px;
        left: 0;
        right: 0;
        height: 5px;
        background: #92a7b3 }
    .c-menu span::after,
    .c-menu span::before {
        position: absolute;
        display: block;
        left: 0;
        width: 100%;
        height: 5px;
        background-color: #92a7b3;
        content: '' }
    .c-menu--htx,
    .c-menu--htx.is-active {
        background-color: transparent }
        .c-menu span::before {
            top: -9px }
        .c-menu--htx.is-active span::after {
            bottom: -9px }
            .c-menu--htx span {
                transition: background 0s .3s }
            .c-menu--htx span::after,
            .c-menu--htx span::before {
                transition-duration: .3s,.3s;
                transition-delay: .3s,0s }
            .c-menu--htx span::before {
                transition-property: top,transform }
            .c-menu--htx span::after {
                transition-property: bottom,transform }
            .c-menu--htx.is-active span {
                background: 0 0 }
            .c-menu--htx.is-active span::before {
                top: 0;
                transform: rotate(13deg) }
            .c-menu--htx.is-active span::after {
                bottom: 0;
                transform: rotate(-13deg) }
            .c-menu--htx.is-active span::after,
            .c-menu--htx.is-active span::before {
                transition-delay: 0s,.3s }

#menubar_mobile {
    display: grid;
    width: 100%;
    bottom: 0;
    position: -webkit-fixed;
    position: fixed;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    background-color: #294564;
    box-shadow: 0 1px 4px rgba(0,0,0,.5);
    color: #ccdde7;
    text-shadow: 1px 1px 1px rgba(0,0,0,.7);
}
#menubar_mobile p {
    width: 78%;
    display: inline-block;
    margin-left: 1em;
    vertical-align: text-bottom;
}
#menubar_mobile nav#menu {
    display: inline-block;
    width: 100%;
    margin: .5em auto 0;
    color: #ccdde7;
}
/* reset the mobile hamburger styles */
@media (min-width:640px) {
    #footer p {
        visibility: visible;
    }
    #menubar_mobile {
        display: none;
    }
    #serendipity_banner {
        display: initial;
        position: initial;
        top: initial;
        padding-bottom: initial;
    }
    #menu {
        display: none;
    }
    #content {
        margin: 1em auto 0;
    }
}

/** Backend preview **/
#content.save_preview_content .msg_success {
    font-size: 1rem;
}
[data-dark-theme="dark"] #content.save_preview_content {
    background-color: #2d333b;
}
#content.save_preview_content {
    background: #FFF;
    border-radius: 0;
    width: 100%;
}
[data-dark-theme="dark"] #content.preview_preview_content {
    background-color: #2d333b;
}
#content.preview_preview_content {
    width: 100%;
    background: #FFF;
}
#content.save_preview_content a:hover {
    color: #001f3f;
}
#content.save_preview_content a:link, #content.save_preview_content a:visited, #content.save_preview_content a:active {
    color: #0074d9;
}
#content.preview_preview_content div.serendipity_entryFooter {
    display: none;
    visibility: hidden;
}
/* overwrites gallery 900px media 75% sizes for the entry preview */
#content.preview_preview_content .serendipity_image_block.col img {
    width: 100%;
    max-width: 100%;
}
#content.preview_preview_content div.serendipity_image_block.row .serendipity_image_left,
#content.preview_preview_content div.serendipity_image_block.row .serendipity_image_right {
    max-width: initial;
}



/** General rules **/

.serendipity_edit_nugget {
    font-size: 12px;
    font-size: .75rem;
    text-align: right;
    margin-top: .25rem;
    margin-bottom: .25rem;
}
.serendipityImageButton {
    cursor: pointer;
}
.serendipity_center {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1em;
    text-align: center;
    font-size: .8125rem;
}
.search_msg .searchterm,
.search_msg .searchresults {
    font-weight: bold;
    color: #3a87ad;
}
.search_msg .searchpage {
    float: right;
}
.serendipity_searchQuery {
  background-color: #37c9c2;
}


/** Messaging **/

.staticpage_results,
.serendipity_search,
.serendipity_content_message, .content_msg
.serendipity_msg_success, .msg_success,
.serendipity_msg_notice, .msg_notice,
.serendipity_msg_important, .msg_important,
.msg_question,
.serendipity_commentDirection {
  display: block;
  width: 100%;
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 1em;
  padding: .5em;
  border: 1px solid #aaa;
  border-radius: .25em;
  box-shadow: 1px 2px 3px #ccc; }
  .serendipity_msg_important p, .serendipity_msg_success p, .serendipity_msg_notice p, .msg_important p, .msg_success p, .msg_notice p, .msg_question p, .serendipity_commentDirection p {
    margin: 0; }
  .search_msg,
  .serendipity_search {
    background-color: lightgray; }
  .content_msg, .serendipity_content_message,
  .serendipity_commentDirection {
    background-color: #f0f8ff; }
  .serendipity_commentDirection.serendipity_comment_captcha .captcha {
    margin-top: .5em; }
  .msg_important, .serendipity_msg_important {
    background: #f2dede; /* light red */
    border-color: #eed3d7;
    color: #b94a2b; }
  .msg_success, .serendipity_msg_success {
    background: #dff0d8; /* light green */
    border-color: #d6e9c6;
    color: #468847; }
  .msg_notice, .serendipity_msg_notice {
    background: #d9edf7; /* light blue */
    border-color: #bce8f1;
    color: #3a87ad; }
  .msg_notice.serendipity_subscription_on,
  .msg_notice.serendipity_subscription_pending,
  .msg_notice.serendipity_subscription_off {
    margin-top: .5em; }
  .msg_notice.serendipity_subscription_off {
    display: none;
    visibility: hidden; }
  .msg_question {
    background: #fcf8e3; /* light yellow */
    border-color: #fbeed5;
    color: #c09853; }


/** Entries **/
#content p {
    word-break: break-word;
}
.post_content {
    clear: both;
    line-height: 1.6;
    width: 100%; }
    .post_content blockquote, .post_content blockquote:first-of-type {
      border-left: .2rem solid #ccc;
      padding-left: .75em;
      margin-left: 1.75em;
      display: flow-root;
      min-width: 10em }
      .post_content blockquote.odd {
        border-left-color: gainsboro; }
    /* this element now behaves again like a block element,
       expands to its auto width only,
       heights to a max viewport height before scroll and
       starts from left w/o having to style .hljs width fill-available */
    .post_content pre,
    .comment_content pre {
      display: block;
      width: auto;
      max-height: 100vh;
      margin-left: 0; }
    .post_content iframe {
      width: 100%; }
    .post_content table tr {
      width: 100%;
      display: flex; }
      .post_content table th,
      .post_content table td {
        width: inherit; }
.serendipity_title {
    font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
    font-size: .938rem;
    font-weight: bold;
    margin-top: 1em;
    color: #333;
    border-bottom: 2px ridge #DDD;
}
.serendipity_title a:link,
.serendipity_title a:visited {
    text-decoration: none;
    border: 0 none;
    color: #222;
}
.serendipity_title a:hover {
    color: #ff4136;
}
.post {
    width: 100%;
    margin-top: .5em;
}
.post_info,
.serendipity_entryFooter {
    background-color: #fafafa;
    border: 1px solid #eee;
    border-radius: 4px;
    box-shadow: 1px 1px 2px rgba(111, 111, 111, 0.5);
    margin: 1rem auto;
    padding-left: .25em;
    padding-right: .25em;
    font-size: .938rem;
    display: inline-block;
    width: 100%;
}
.post_info.listed_view .plainList li {
    display: inline-block;
}
.post_info.listed_view .plainList li:not(:first-of-type)::before {
    content: " | ";
    padding-right: .25em;
}
.post_info .serendipity_blogpdf {
    margin-bottom: 1rem;
}
.post table,
.post_content table {/* yes, since within #extended id knot */
    display: grid;
    max-width: 100%;
    width: auto;
    overflow: auto;
    border-collapse: separate;
    border: 1px solid #eee;
    padding: .5em;
    margin-bottom: .5em; }
.post thead,
.post_content thead {
    line-height: 1.8;
    background: #f6f6f6; }
.post thead tr, .post_content thead tr {
    box-shadow: inset 0em -1px #dcdcdc; }

.serendipity_entry_author_self {}
.serendipity_entry_read_more {
    text-align: right;
    margin-top: 1.5em;
}
.serendipity_entry_date,
.serendipity_Entry_Date {
    margin: auto;
}
.serendipity_Entry_Date:last-of-type + .serendipity_entrypaging {
    margin-top: 0.5em;
}
.serendipity_date {
    font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
    font-variant: all-petite-caps;
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: normal;/* for tagcloud h2 header */
    color: #333;
    margin: 0;
    text-align: right;
}
.post_more {
    clear: both;
    font-size: 14px;
    font-size: .875rem;
    text-align: right;
    display: inherit;
    width: 100%;
    padding-right: 1em;
}
@media (min-width: 1600px) {
    .post_more {
        margin-top: 2em;
    }
}
.serendipity_image_block + .post_more {
    margin-top: 1em;
}
img.serendipity_entryIcon {
    float: right;
    border: 0 none;
    padding: 0 0 .5em .5em;
}


/* serendipity_admin_image_selector */

#footer.mediaItemBlend {
    visibility: hidden;
    display: none;
}
@media (min-width: 640px) {
    #footer.mediaItemBlend {
        visibility: visible;
        display: initial;
    }
}
#content.mediaItemMain {
    margin-bottom: 1rem !important;
}
.mediaItemFooter {
    padding: .5em;
    text-align: center;
    margin: 0;
}
.mediaItemProperties {
    margin: auto auto 1.5em;
}
.mediaItem {
    margin: 0 1em;
    width: auto;
}


/** Event Plugins **/

.search-results li,
.pages_found dd,
li.post_category, li.post_comments, li.post_tags, li.post_reltags {
    margin-bottom: .5em;
}
li.post_reltags {
  margin-top: .5em;
}
li.post_reltags ul li {
  margin-left: 1em;
  padding-top: .25em;
}
.post_category span, .post_comments span, .post_tags span, .post_admin span, .post_reltags span {
    font-weight: bold;
}

#taglistentries {
  margin-bottom: 1.5rem; }
  .static-entries-list {
    line-height: 1.5; }
    .static-entries-list.odd {
      background: #fafafa; }
    .tag-list-entry-date {
      padding: 0 .25rem;
      font-style: italic;
      opacity: .6; }

.serendipity_multilingualInfo {
    margin-bottom: 1em;
    font-weight: bold;
}
.serendipity_multilingualInfo a {
    font-weight: normal;
}

/* dsgvo */
.dsgvo_gdpr_footer {
    text-align: center;
}
body.grid-flex .dsgvo_gdpr_footer {
    grid-area: ft;
    width: 100%;
    z-index: 100;
    padding: 2.5rem 0 0.5rem;
}
body.grid-col .dsgvo_gdpr_footer,
body.grid-block .dsgvo_gdpr_footer {
    margin: 1rem auto;
}
.dsgvo_gdpr_comment label {
    font-weight: normal;
}
#serendipity_emoticonchooser_comment, .form_toolbar.dsgvo_gdpr_comment {
    margin-bottom: 1em;
}
#checkbox_dsgvo_gdpr {
    margin-right: .5rem;
}

/* entryproperties */
#content > #entrypasswordform {
    padding: 1rem 0;
}

#content > .serendipity_entrypaging + #entrypasswordform {
    margin: 1.5em auto 1em;
    padding-top: 0;
}
#content > .serendipity_entrypaging:first-child {
    border-bottom: 1px solid #ddd;
}

ul.staticpage_result li {
    list-style: disclosure-open;
    font-style: oblique;
    margin: 0;
}

#content > .serendipity_staticpage {
    margin: 0 1em;
}
/* analogue to post/serendipity_entry [ff] */
.serendipity_staticpage {
    line-height: 1.6;
}
.serendipity_staticpage header h2 {
    margin: .5em 0 1em 0;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.staticpage_metainfo {
    width: 100%;
    display: inline-block;
}
.serendipity_staticpage .page_info {
    font-size: .875rem;
    width: 100%;
    display: inline-block;
}
.page_content blockquote {
    border-left: 5px solid #ccc;
    padding-left: 1em; }

.serendipity_freeTag {
    margin-bottom: 1em;
    font-weight: bold;
    width: 100%;
}
.serendipity_freeTag a {
    font-weight: initial;
}
.serendipity_freeTag_related {
    font-weight: bold;
}
.serendipity_freetag_taglist_related {
    display: grid;
    word-break: unset !important;
    min-width: 6rem;
}
.serendipity_freeTag_related ul li {
    margin-bottom: .5em;
}
.serendipity_Entry_Date.freetag_cloud {
    border: 1px solid #4D618A;
    padding: .5em;
    border-radius: .5rem;
    box-shadow: 1px 2px 3px #555;
}
#serendipity_banner .freetag_current,
.serendipity_Entry_Date.freetag_cloud .freetag_current {
    color: #20c997;
}
.freetag_cloud .serendipity_freetag_taglist {
    display: inline-flex;
    width: 100%; }
    .serendipity_freetag_taglist {
      padding: 0 .25em !important;
      border-radius: .25em; }

.newsbox {
    margin-top: 1em;
    border-color: azure; /* fieldset use a kind of ridge border default style so we need to make it thinner by color */
}
.newsbox legend {
    font-weight: bold;
    font-size: large;
    padding: 0 .25em;
    text-transform: uppercase;
    color: #666;
    margin-left: 75%;
}

@media (min-width: 640px) {
    .newsbox legend {
        margin-left: 85%;
    }
}
@media (min-width: 768px) {
    .newsbox legend {
        margin-left: 88%;
    }
}
@media (min-width: 860px) {
    .newsbox legend {
        margin-left: 90%;
    }
}
@media (min-width: 1024px) {
    .newsbox legend {
        margin-left: 86%;
    }
}
@media (min-width: 1200px) {
    .newsbox legend {
        margin-left: 90%;
    }
}

/** Comments **/

#serendipity_comment_page {
    margin: .5rem;
}

#trackbacks details > div {
    margin-left: 1.115em;
    padding-top: .25em;
    font-size: 14px;
    font-size: .875rem;
    line-height: 1.5;
    color: #686868;
}
#trackbacks summary em {
    font-size: 14px;
    font-size: .875rem;
}
.trackback details summary {
    cursor: pointer;
}
.trackback_author {
    display: block;
    margin: .5em 0;
    color: #222;
}
.js .trackback-hint {
    display: none;
}
.trackback.tb-odd {
    background-color: #eee; }

.post p.trackback-hint {
    margin-top: .5em;
    padding: .5em;
}

#c0 { /* a new unsaved comment preview only */
    border: 1px solid #ddd;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: .625em; }
.input_captcha {
    max-width: 10em;
    width: auto;
}
ol.plainList > .comment {
    margin-bottom: 1.5em;
}
/* VIEWMODE_THREADED in entry comments */
ol.plainList > .comment.commentlevel-1 {
    margin-left: 1.5em;
}
ol.plainList > .comment.commentlevel-2 {
    margin-left: 3em;
}
ol.plainList > .comment.commentlevel-3 {
    margin-left: 4.5em;
}
ol.plainList > .comment.commentlevel-4 {
    margin-left: 6em;
}
ol.plainList > .comment.commentlevel-5 {
    margin-left: 7.5em;
}
ol.plainList > .comment.commentlevel-6 {
    margin-left: 9em;
}
ol.plainList > .comment.commentlevel-7 {
    margin-left: 10.5em;
}
ol.plainList > .comment.commentlevel-8 {
    margin-left: 12em;
}
ol.plainList > .comment.commentlevel-9,
ol.plainList > .comment.commentlevel-10,
ol.plainList > .comment.commentlevel-11,
ol.plainList > .comment.commentlevel-12,
ol.plainList > .comment.commentlevel-13,
ol.plainList > .comment.commentlevel-14,
ol.plainList > .comment.commentlevel-15,
ol.plainList > .comment.commentlevel-16 {
    margin-left: 13.5em;
}
/* commentlevel-16 is the last available threaded depth - see comments.tpl */
@media (min-width: 440px) {
    ol.plainList > .comment.commentlevel-10 {
        margin-left: 15em;
    }
    ol.plainList > .comment.commentlevel-11 {
        margin-left: 16.5em;
    }
    ol.plainList > .comment.commentlevel-12 {
        margin-left: 18em;
    }
    ol.plainList > .comment.commentlevel-13 {
        margin-left: 19.5em;
    }
    ol.plainList > .comment.commentlevel-14 {
        margin-left: 21em;
    }
    ol.plainList > .comment.commentlevel-15 {
        margin-left: 22.5em;
    }
    ol.plainList > .comment.commentlevel-16 {
        margin-left: 24em;
    }
}
@media (min-width: 1024px) and (max-device-width: 1279px) {
    /* VIEWMODE_THREADED in entry comments */
    ol.plainList > .comment.commentlevel-1 {
        margin-left: 0.75em;
    }
    ol.plainList > .comment.commentlevel-2 {
        margin-left: 1.5em;
    }
    ol.plainList > .comment.commentlevel-3 {
        margin-left: 2.25em;
    }
    ol.plainList > .comment.commentlevel-4 {
        margin-left: 3em;
    }
    ol.plainList > .comment.commentlevel-5 {
        margin-left: 3.75em;
    }
    ol.plainList > .comment.commentlevel-6 {
        margin-left: 4.5em;
    }
    ol.plainList > .comment.commentlevel-7 {
        margin-left: 5.25em;
    }
    ol.plainList > .comment.commentlevel-8 {
        margin-left: 6em;
    }
    ol.plainList > .comment.commentlevel-9,
    ol.plainList > .comment.commentlevel-10,
    ol.plainList > .comment.commentlevel-11,
    ol.plainList > .comment.commentlevel-12,
    ol.plainList > .comment.commentlevel-13,
    ol.plainList > .comment.commentlevel-14,
    ol.plainList > .comment.commentlevel-15,
    ol.plainList > .comment.commentlevel-16 {
        margin-left: 6.75em;
    }
}

.comment.odd {
    background-color: #efefef;
}
.comment.odd, .comment.even,
.trackback.tb-odd, .trackback.tb-even {
    margin: 3px auto;
    margin: 0.188rem auto;
    padding: 4px 8px;
    padding: .25rem .5rem;
    border: 1px solid #ddd;
}
#trackbacks li.pingback {
    border: 1px solid #D1D1D1;
    /*margin-top: .5rem;*/
    padding: .15rem .625rem .25rem; }
    #trackbacks li.pingback.tb-odd,
    #trackbacks li.pingback.tb-even {
        background-color: #EBFBFB; }
.comments_for_entry .tp-url {
    display: inline-block;
    background-color: #a51584;
    border: 1px solid #360278;
    padding: 0 .25rem;
}
#content .comments_for_entry .tp-url a {
    color: #fff !important;
}
/*.serendipity_commentBody*/
.comment_content {
    margin: 0 .5em;
    padding: .5em;
    background-color: #fdfdfd;
    border: 1px solid #dcdcdc;
    font-family: "Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 15px;
    font-size: .938rem;
    font-weight: 500;
    line-height: 1.25rem;
    word-break: break-word;
}
/* Lucida has a default font weight of 700 which is too much for both comment normal and strong bolder! */
.comment_content strong {
    font-weight: 600;
}
.comment_content blockquote {
    border-left: 5px solid #ccc;
    margin-left: 1em;
    padding-left: 1em;
    min-width: 5em;
    width: 92%;
}
@media (min-width: 540px) {
    .comment_content blockquote {
        margin-left: revert;
        width: 86%;
    }
}
@media (min-width: 768px) {
    .comment_content blockquote {
        width: initial;
    }
}

.comment_content pre code {
    font-size: 14px;
    font-size: .875rem;
}
.comment.commentlevel-maxpart pre:after {
    content: '.. c o d e ';
}
.comment.commentlevel-maxpart code {
    display: none;
}
@media (min-width: 440px) {
    .comment.commentlevel-maxpart pre:after {
        content: '.. expand for c o d e ';
    }
}
@media (min-width: 640px) {
    .comment_content pre {
        min-width: 18em;
    }
    .comment.commentlevel-maxpart pre:after {
        content: initial;
    }
    .comment.commentlevel-maxpart code {
        display: inherit;
    }
}
/* mobile with 350x640 like Galaxy S5 - DPR:3 */
@media (min-width: 640px) and (orientation: landscape) {
    .comment_content pre {
        min-width: 16em;
    }
}
@media (min-width: 1200px) {
    .comment_content pre {
        min-width: 20em;
    }
}
.comment.odd > .comment_content {
    background-color: #fafafa;
}
.comment > footer, .comment-view, .comments-enable {
    font-size: 13px;
    font-size: 0.8125rem;
}
.comment ul.meta {
    padding: .25em .5em;
    font-size: 14px;
    font-size: .875rem; }
    .meta li {
      display: inline-block; }
      .meta li:after {
        color: #d827a0;
        font-weight: bold;
        content: ' | '; }
      .meta li:last-child:after {
        content: ''; }
.comments_permalink {
    margin: .5em auto;
    width: auto;
    overflow: hidden;      /* this is more or less for Chromium, */
    word-wrap: break-word; /* to explicit break a long bounded word in C/P/T comment pages, */
    overflow-wrap: break-word; /* CSS3 Draft */
    word-break: break-all; /* which does expand the flexing content width on certain screens */
}

/*.serendipity_commentsTitle*/
.comment > h4 {
    margin: .5em auto;
    padding-left: .5em;
    line-height: 1.5;
}
@media (min-width: 640px) {
    .comment > h4 {
        line-height: initial;
    }
}
.serendipity_commentsLabel {
    font-size: 15px;
    font-size: .938rem;
    font-weight: bold;
    vertical-align: top;
}
.serendipity_commentsLabel input {
    margin: .1em .2em 0 0;
}
.serendipity_commentsLabel label {
    vertical-align: bottom;
}
.serendipity_commentsValue input:not([type="button"]),
.serendipity_commentsValue select,
.serendipity_commentsValue textarea {
    font-size: 16px;
    font-size: 1rem;
    padding: 2px;
    width: 100%;
    max-width: 42em;
}
.serendipity_commentForm {
    padding: .5em;
    background-color: #fdfdfd;
    border: 1px solid #efefef;
}
.serendipity_comment {
    font-size: 13px;
    font-size: .8125rem;
    margin: 1em 1em 0;
    padding: 0.25em;
    overflow: auto;
}

.serendipity_comment h4 {
    margin: .25em auto .5em;
    line-height: 1.5;
}
.serendipity_comment blockquote {
    margin-right: auto;
}
.serendipity_commentForm table {
    border-collapse: separate;
    border-spacing: 2px;
}
.serendipity_comment_author_self h4 .pc-owner {
    background: #3e5f81e6;
    padding: .0075em .15em;
    border-radius: 3px;
    border: 1px solid #999;
    color: #efefef;
    font-style: normal;
    text-shadow: 1px 1px 2px #222;
}
.serendipity_comment.odd {
    background-color: #f8f8f8;
    border-width: 1px;
    border-style: solid;
    border-color: #ddd #efefef;
}
.serendipity_section_commentform {
    font-size: 15px;
    font-size: .938rem;
}
/* Serendipity Styx comment summary pages */
.comments_for_entry .comment_content {
    margin-bottom: 1em; }
.comments_by_author_pagination {
    text-align: center; }
.comments_by_author_pagination.top {
    margin-top: 1em; }
.comments_by_author_pagination.bottom {
    margin: 1.5em auto; }

article.post.byauthor {
    background: #fefefe;
    border: 1px solid #ddd;
    margin-bottom: .75em;
    padding-bottom: .75em;
}
.byauthor h3 {
    margin-top: .5em;
    margin-left: .25em;
}

/** Archives **/
.archive {
    width: 100%;
}
.archive_index dl {
    line-height: 1.4; }
    .archive_index dd {
      margin-bottom: .5rem; }

.archive_overview {
    width: 100%;
    display: block;
}
.archive h2 {
  margin: .5em auto; }
  .archive_summary_pageof {
    display: inherit;
    font-size: small;
    opacity: .7; }

.archive_year {
    width: 100%;
    display: inline-block;
    margin: auto 1em 1em auto;
    background-color: #f2f2f2;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 0 1em;
}
.archive dl {
    display: block;
}
.archive_summary dl {
    margin-bottom: 2rem;
}
.archive_overview dt, .archive_overview dd {
    width: 48%;
    display: inline-block;
    margin-bottom: .5em;
}
.archive_summary dt, .archive_summary dd {
    line-height: 1.4;
}
.archive dd {
    text-align: right;
}
.archives_graph img {
    height: 1em;
    border: 1px solid #000;
}
.archive_summary dd {
    text-align: left;
    width: 100%;
    margin-bottom: 1em;
}

/** Sidebars **/

/* Container for each item on the sidebar */
.serendipitySideBarItem {}
section.sidebar_widget {
    padding-bottom: .5rem;
    margin-bottom: 1em;
    font-size: 13px;
    font-size: .8125rem;
    font-weight: normal;
    border-bottom: 1px solid #DDD;
}
/* title of an individual sidebar item */
.serendipitySideBarTitle {}
/* content of sidebar widget */
.serendipitySideBarContent,
.sidebar_content {}

/* xml "icons/rss.svg" styles via categories and syndication */
.serendipity_xml_icon {
    line-height: 1.6; }
    .serendipity_xml_icon img {
      width: 1rem;
      height: 1rem;
      vertical-align: middle;
      fill: currentcolor;
      rotate: 0deg; }
      #serendipity_authors_list.xmlsvg .serendipity_xml_icon img,
      #serendipity_categories_list.xmlsvg .serendipity_xml_icon img {
        background-color: #e7e4e2;
        rotate: 180deg; }
      #serendipity_syndication_list .serendipity_xml_icon img {
        background-color: aqua;}

/* categories */
ul#serendipity_categories_list {
    margin: 1em 0;
}

/* calendar */
table.serendipity_calendar {
    border-collapse: separate;
    border-spacing: .5em;
}
.serendipity_calendar .icon-back::before {
    content: "<";
}
.serendipity_calendar .icon-next::before {
    content: ">";
}
.serendipity_calendar .icon {
    display: inline-table;
    font-weight: 600;
    font-size: 1.065rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.serendipity_calendarHeader {
    text-align: center;
}
table.serendipity_calendar td {
    font-size: 11px;
    font-size: .6875rem;
    text-align: center;
    padding: 0.25em;
}
table.serendipity_calendar a {
    color: #ff4136;
    font-weight: bold;
    text-decoration: none;
}
table.serendipity_calendar a:hover {
    text-decoration: none;
}
td.serendipity_weekDayName {
    font-size: 11px;
    font-size: .6875rem;
    font-weight: bold;
}
td.serendipity_calendarHeader a:link,
td.serendipity_calendarHeader a:visited,
td.serendipity_calendarHeader a:hover {
    border: 0 none;
    text-decoration: none;
}
td.Today {
    background-color: mediumaquamarine;
}
.calendar-nav {
    width: 100%;
    text-align: center;
}
.calendar-nav a {
    text-decoration: none;
}
.calendar-nav span {
    display: none;
}

/* Own category template */
.category_depth1 .cdp1 {
    padding-left: 6px;
}
.category_depth2 .cdp2 {
    padding-left: 12px;
}
.category_depth3 .cdp3 {
    padding-left: 18px;
}
.category_depth4 .cdp4 {
    padding-left: 24px;
}
.category_depth5 .cdp5 {
    padding-left: 30px;
}
.category_depth6 .cdp6 {
    padding-left: 36px;
}

/* Plugin authors */
.serendipity_plugin_authors form div:last-of-type {
    margin-top: .5rem;
}

/* Plugin multilingual */
#language_chooser select {
    font-size: .8125rem !important;
    width: fit-content;
    block-size: fit-content;
    min-width: calc(6vw);
}

/* Powered by */
div.serendipityPlug > a {
    padding-left: 1em;
}
div.serendipityPlug a {
    text-decoration: none;
    border: 0 none;
}
/* staticpage */
.staticpage_sbList {
    margin: 0;
    padding: 0; }
.staticpage_sbJsList {
    overflow: hidden;
    white-space: nowrap;
    padding-bottom: 1em;
}
.serendipity_plugin_staticpage .depth_10 {
    padding-left: 1em;
}
.serendipity_plugin_staticpage .depth_20 {
    padding-left: 2em;
}
.serendipity_plugin_staticpage .depth_30 {
    padding-left: 3em;
}
.serendipity_plugin_staticpage .depth_40 {
    padding-left: 4rem;
}
/* freetag no-scale cloud && !useRotCanvas && !useWordCloud for sidebars-to-bottom
   removes br-linebreaks when configured in plugin in footer sidebar mobile view */
.sidebar_widget.serendipity_plugin_freetag .plainList br {
  display: contents;
}
/* freetag popping into real sidebar mode - do what was configured */
@media (min-width: 1024px) {
    .sidebar_widget.serendipity_plugin_freetag .plainList br {
        display: initial;
    }
}
/* authors */
.container_serendipity_plugin_authors .serendipitySideBarContent div {
    margin: .5em 0;
    padding-left: 0;
}
/* adduser */
.serendipitySideBarContent .serendipity_comment_captcha label {
    padding: 0.25em 0;
    display: block;
}
/* history */
.serendipity_history_author {
    font-weight: bolder;
}
.serendipity_history_intro {
    margin-bottom: 1em;
}
.serendipity_history_outro {
    margin-top: 1em;
    margin-bottom: 1em;
}
.serendipity_history_body {
    margin-bottom: 1em;
}
/* recententries */
.serendipity_recententries_entrylink {
    margin-bottom: 2px;
}
.serendipity_recententries_entrydate {
    margin: 0 0 4px 0;
}
/* last comments */
.container_serendipity_plugin_comments {
    color: #333; }
    .container_serendipity_plugin_comments br {
        line-height: .5em; }
    .plugin_comment_wrap {
        margin: .5rem 0 0 0;
        border-top: 1px solid #ddecfb;
        border-bottom: 1px solid #ddecfb;
        background-color: #fafbfc;
        color: #333;
        font-size: 11.5px; }
        .plugin_comment_subject {
            font-family: sans-serif; }
        .plugin_comment_author {
            font-weight: bold; }
        .plugin_comment_body  {
            padding: .25em 0;
            hyphens: auto; /* run before break-word */
            word-wrap: break-word;
            overflow-wrap: break-word; /* CSS3 Draft */
            font-style: oblique; }
        .svg-inline.fa-clone {
            vertical-align: text-bottom; }
@media (min-width: 640px) {
    .plugin_comment_wrap {
        /* font-size: inherit; for auto-sizing */
        font-size: .875rem;/* auto-sizing and max will be 14px */
    }
}

/* shoutbox */
.serendipity_shoutbox_date {
    margin: .5em 0 2px 0;
}
.serendipity_shoutbox_comment {
    padding: 0.25em 0;
}
/* nugget */
.serendipity_plugin_html_nugget p {
    font-size: 14px;
    font-size: .875rem;
}
/* imagesidebar */
.mediasidebaritem img {
    width: 100%;
    max-width: 230px;
    border-radius: 5px;
    box-shadow: 1px 1px 4px #555;
    margin-bottom: 5px;
}

/* adduser login/logoutbox */
#serendipity_loginform #content {
    margin: 0.5em;
    min-height: 12em;
    width: auto;
}
#loginbox .button_link {
    margin-left: 6em;
}

/** Embedded images with the Serendipity Styx image manager **/

.serendipity_imageComment_center,
.serendipity_imageComment_left,
.serendipity_imageComment_right {
    border: 1px solid #DDD;
    background-color: transparent;
    margin: 0.25em;
    padding: 0.25em;
    text-align: center;
}
.serendipity_imageComment_center {
    margin: .25em auto;
}
.post p > .serendipity_image_left,
.post p > .serendipity_imageComment_center,
.post p > .serendipity_image_right {
    margin: .25em auto; }
.content.staticpage_content p > .serendipity_image_left,
.content.staticpage_content p > .serendipity_imageComment_center,
.content.staticpage_content p > .serendipity_image_right {
    margin: .25em auto; }
@media (max-width: 464px) {
  .post div .serendipity_image_left,
  .post div .serendipity_image_right {
    margin-bottom: .5em;
  }
}
/* left or right floated image within paragraphed text container to behave like aboves (.post p > .serendipity_image_left/right) floated images */
div + p {
  margin-top: 0;
}

/* adds a default margin bottom that mimics the size of the line-height - to prevent a margin less space issue - ie., when (l/r) floated text does not expand the height of the image and which has a following div figure block */
.serendipity_image_left,
.serendipity_image_right {
    margin-bottom: .5em; }
.serendipity_image_left,
.post p > .serendipity_image_left,
.post .serendipity_imageComment_left:not(figure) {
    margin-left: 0;
    margin-right: .5em; }
.serendipity_imageComment_left {
    float: left;
    margin-right: .5em; }
.serendipity_image_right,
.post p > .serendipity_image_right {
    margin-right: 0;
    margin-left: .5em; }
.serendipity_imageComment_right {
    float: right;
    margin-left: .5em; }
.serendipity_imageComment_img img {
    width: auto; }
.serendipity_imageComment_txt {
    border-top: 1px solid #ddd;
    background-color: #efefef;
    padding: .25rem 0;
    clear: both;
    font-size: 10px;
    font-size: .625rem;
    text-align: center; }

/* The image parent comment box responsiveness for mobile screens - touches all: old styled and new "figure" styled. */
.serendipity_imageComment_left,
.serendipity_imageComment_right {
    width: auto;
    display: inline-block;
}
.serendipity_imageComment_center {
    width: auto;
    display: block;
}
/* Set back to a block element for big screens, since we don't want the commentbox to expand into space. This was tested with an image of 1000px width. Others may vary! */
@media (min-width: 1595px) {
    figure.serendipity_imageComment_center {
        display: block; /* must be "block" on very big content width again .. to center */
    }
}
/* Default to media gallery image comment blocks and to (figured) comment image boxes fitting to the ordered "inset" image - div.incidences are old code - else see following auto scales */
figure.serendipity_imageComment_center, figure.serendipity_imageComment_left, figure.serendipity_imageComment_right,
div.serendipity_imageComment_center, div.serendipity_imageComment_left, div.serendipity_imageComment_right,
.grid-col .post .serendipity_image_block.col .serendipity_imageComment_left,
.grid-col .post .serendipity_image_block.col .serendipity_imageComment_right {
    width: auto;
    max-width: 100%;
}
/* Strange Chromium fix - else image may be empty */
.serendipity_image_block.col .serendipity_imageComment_img img {
    width: -webkit-fill-available;
}
/* Strange Chromium fix - imgs are inline elements by default, so display: block on column counts to not overflow each other */
.serendipity_image_block.col img {
    display: block;
    width: 100%;
    height: auto;
}
/* Strange Chromium fix for ~412px, ~430px, ~540px Mobile sizes (Pixel 7, Galaxy S20 Ultra and A51/71, Surface Duo) that needed an overwrite of defaulting inline-block */
.serendipity_image_block.col {
    display: block;
}

/* Auto scales
   - single set left/right oriented bigger images within p tags
   - sets left/right floated images within p or div followed p tags
   - 400px left/right oriented image thumbs with floated text
   - DOES NOT touch smaller defined images, which is perfect! */
.page .serendipity_imageComment_left,
.page .serendipity_imageComment_right,
.page p .serendipity_image_left,
.page p .serendipity_image_right,
.post .serendipity_imageComment_left,
.post .serendipity_imageComment_right,
.post p .serendipity_image_left,
.post p .serendipity_image_right,
.grid-col .post div .serendipity_image_left:not([srcset*=".400W."]),
.grid-col .post div .serendipity_image_right:not([srcset*=".400W."]),
.post div .serendipity_image_left,
.post div .serendipity_image_right {
    min-width: auto;
    max-width: 100%; }
    /* apply for rare cases to overrule the max-width percent behaviour on small screens */
    .grid-col .post div.serendipity_image_block.col .serendipity_image_left:not([srcset*=".400W."]),
    .grid-col .post div.serendipity_image_block.col .serendipity_image_right:not([srcset*=".400W."]),
    .grid-col .post div.serendipity_image_block.row .serendipity_image_left:not([srcset*=".400W."]),
    .grid-col .post div.serendipity_image_block.row .serendipity_image_right:not([srcset*=".400W."]) {
        min-width: -moz-available;
        min-width: -webkit-fill-available; }

/* Improve 1-sidebar single left- or right-sided images scaling for bound paragraphs - has calculated dependency to others in media-screens */
@media (min-width: 438px) {
    .grid-flex .post div:not(.serendipity_image_block) > .serendipity_imageComment_left,
    .grid-flex .post div:not(.serendipity_image_block) > .serendipity_imageComment_right {
        max-width: calc(100vw / 3); }
    /* we do not do this for normal (l/r sided) images here since that breaks more dependencies later on than it helps for the case.
       And it happens to be relative to screen dimensions from 425 tp 768 only. So no worry. */
}

@media (min-width: 552px) {
    .post .serendipity_image_block.col.c2 .serendipity_imageComment_left {
        display: inline-block;
        margin-top: 0; }
    /* Chromium display fix for a 2-column gallery block design with 2 images only, to place an image into both columns for both .grid-col and .grid-flex staticpage vs entry bodies, when having image comments! */
    /* Firefox reacts different and uses flex here to stick the two columns together on wider content place. */
    .serendipity_image_block.col.c2:not(:has(> :nth-child(3))):has(div.serendipity_imageComment_txt)  {
        display: flex; }
    /* Display:block dependency rule to stick the two columns together, when having more than 2 images and the available main content place goes beyond the max width of both inserts, like i.e. 810px
       for 2 x 400px + 10px for the comment boxes. This at min-width:1440px media screen having 2 x 230px on sidebars and ~814px + on main#content. */
    .serendipity_image_block.col.c2:has(> :nth-child(3)):has(div.serendipity_imageComment_txt)  {
        max-width: min-content; }
}

/* fake a min-width overwrite that has the most chance not to underflow the image size
   and still be big enough to fit the max-width scales
   - see default serendipity_image_block.row style_fallback.css which normally has 260px max width
     but here having example with div class="serendipity_imageComment_left" style="width:138px;"
     (normally border 10px = 128px) min-width now works with 100% and -moz/-webkit-fill-available in
     .serendipity_image_block.xxx gallery cases. Yee-haw! */
@media (min-width: 768px) {
    .post .serendipity_imageComment_left:not(figure) {
        margin-right: .5em; }
    .post figure.serendipity_imageComment_left {
        margin-right: 1.25em; }
    .page .serendipity_imageComment_left,
    .page .serendipity_imageComment_right,
    .page p .serendipity_image_left,
    .page p .serendipity_image_right,
    .post .serendipity_imageComment_left,
    .post .serendipity_imageComment_right,
    .post p .serendipity_image_left,
    .post p .serendipity_image_right,
    .post div.serendipity_image_block.row .serendipity_image_left,
    .post div.serendipity_image_block.row .serendipity_image_right {
        min-width: auto;
        max-width: calc(100vw / 3); }
    /* fixes 3-column design with 3 images only, one-in each column for both .grid-col and .grid-flex staticpage vs entry bodies, WHEN having image comments! */
    .serendipity_image_block.col.c3:not(:has(> :nth-child(4))):has(div.serendipity_imageComment_txt) {
        display: flex; }
    .serendipity_image_block.col.c3:has(> :nth-child(4)):has(div.serendipity_imageComment_txt) {
        max-width: 100%; }
    /* apply for rare cases to unset the "**-available" small screen and restore the max-width behaviour (see above) */
    .grid-col .post div.serendipity_image_block.col .serendipity_image_left:not([srcset*=".400W."]),
    .grid-col .post div.serendipity_image_block.col .serendipity_image_right:not([srcset*=".400W."]),
    .grid-col .post div.serendipity_image_block.row .serendipity_image_left:not([srcset*=".400W."]),
    .grid-col .post div.serendipity_image_block.row .serendipity_image_right:not([srcset*=".400W."]) {
        min-width: inherit; }
    /* special case, to have the image comment box, which normally is rendered by the image (smaller) box size, to expand to the parent imageComment box size */
    .post :not(.serendipity_image_block) .serendipity_imageComment_left,
    .post :not(.serendipity_image_block) .serendipity_imageComment_right,
    .grid-col .post div:not(.serendipity_image_block) div:not(.serendipity_image_block) .serendipity_image_left:not([srcset*=".400W."]),
    .grid-col .post div:not(.serendipity_image_block) div:not(.serendipity_image_block) .serendipity_image_right:not([srcset*=".400W."]) {
        display: inline-table; /* spans different (more independently) than inline-block containers */
        margin-bottom: auto; /* when gallery images including comments are not the same size -> span to top */
    }
    .serendipity_image_block.row .serendipity_imageComment_left {
        display: block; }
}
@media (min-width: 768px) and (max-width: 899px) {
    .serendipity_image_block.row .serendipity_imageComment_left {
        min-width: fit-content;
        max-width: fit-content;/* !important;*/
    }
}
@media (min-width: 1400px) {
    .serendipity_image_block.row .serendipity_imageComment_left {
        min-width: fit-content;
        max-width: fit-content;/* !important;*/
    }
}

@media (min-width: 640px) {
    .page .serendipity_imageComment_left,
    .page .serendipity_imageComment_right,
    .page p .serendipity_image_left,
    .page p .serendipity_image_right,
    .post .serendipity_imageComment_center:not(figure),
    .post .serendipity_imageComment_left:not(figure),
    .post .serendipity_imageComment_right:not(figure),
    .post p .serendipity_image_left,
    .post p .serendipity_image_right,
    .post div .serendipity_image_left,
    .post div .serendipity_image_right {
        max-width: 100%; } /* galleries with mixed orientations span better with 100% than fit-content */
}
@media (min-width: 900px) {
    .page .serendipity_imageComment_left,
    .page .serendipity_imageComment_right,
    .page p .serendipity_image_left,
    .page p .serendipity_image_right,
    .post p .serendipity_image_left,
    .post p .serendipity_image_right,
    .post div .serendipity_image_left,
    .post div .serendipity_image_right {
        max-width: 75%; }
    .preview_preview_body .post div .serendipity_image_left,
    .preview_preview_body .post div .serendipity_image_right {
        max-width: 100%; }
    .grid-flex .post div .serendipity_image_left,
    .grid-flex .post div .serendipity_image_right {
        max-width: calc(100vw / 3); }
    /* 1-sidebar | for content image block galleries in 100% */
    .grid-flex .page .serendipity_image_block .serendipity_imageComment_left,
    .grid-flex .page .serendipity_image_block .serendipity_imageComment_right,
    .grid-flex .page p .serendipity_image_block .serendipity_image_left,
    .grid-flex .page p .serendipity_image_block .serendipity_image_right,
    .grid-flex .post p .serendipity_image_block .serendipity_image_left,
    .grid-flex .post p .serendipity_image_block .serendipity_image_right,
    .grid-flex .post div .serendipity_image_block .serendipity_image_left,
    .grid-flex .post div .serendipity_image_block .serendipity_image_right {
        max-width: 100%; } /* galleries with mixed orientations span better with 100% than fit-content */
}
@media (min-width: 1024px) {
    .post .serendipity_imageComment_left:not(figure) {
        margin-right: 1.25em; }
    /* 2-sidebars */
    .grid-col .page .serendipity_imageComment_left,
    .grid-col .page .serendipity_imageComment_right,
    .grid-col .page p .serendipity_image_left,
    .grid-col .page p .serendipity_image_right,
    .grid-col .post p .serendipity_image_left,
    .grid-col .post p .serendipity_image_right,
    .grid-col .post div .serendipity_image_left,
    .grid-col .post div .serendipity_image_right {
        max-width: 46.75%; }
    /* 1-sidebar | 0-sidebars | !in responsiveimages plugin cases */
    .grid-flex .page .serendipity_imageComment_left,
    .grid-flex .page .serendipity_imageComment_right,
    .grid-flex .page p .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .page p .serendipity_image_right:not([srcset*=".400W."]),
    .grid-flex .post .serendipity_imageComment_left,
    .grid-flex .post .serendipity_imageComment_right,
    .grid-flex .post p .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .post p .serendipity_image_right:not([srcset*=".400W."]),
    .grid-flex .post div .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .post div .serendipity_image_right:not([srcset*=".400W."]) {
        max-width: 100%; }
    /* 1-sidebar | for content image block galleries in 100% | !in responsiveimages plugin cases */
    .grid-flex .page .serendipity_image_block .serendipity_imageComment_left,
    .grid-flex .page .serendipity_image_block .serendipity_imageComment_right,
    .grid-flex .page p .serendipity_image_block .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .page p .serendipity_image_block .serendipity_image_right:not([srcset*=".400W."]),
    .grid-flex .post .serendipity_image_block .serendipity_imageComment_left,
    .grid-flex .post .serendipity_image_block .serendipity_imageComment_right,
    .grid-flex .post p .serendipity_image_block .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .post p .serendipity_image_block .serendipity_image_right:not([srcset*=".400W."]),
    .grid-flex .post div .serendipity_image_block .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .post div .serendipity_image_block .serendipity_image_right:not([srcset*=".400W."]) {
        min-width: auto;
        max-width: 100%; } /* galleries with mixed orientations span better with 100% than fit-content */
    .grid-flex .post .serendipity_image_block.row .serendipity_imageComment_left {
        max-width: 260px; }
}
@media (min-width: 1440px) {
    /* 2-sidebars */
    .grid-col .page .serendipity_imageComment_left,
    .grid-col .page .serendipity_imageComment_right,
    .grid-col .page p .serendipity_image_left,
    .grid-col .page p .serendipity_image_right,
    .grid-col .post p .serendipity_image_left,
    .grid-col .post p .serendipity_image_right,
    .grid-col .post div .serendipity_image_left,
    .grid-col .post div .serendipity_image_right {
        max-width: 75%; }
    /* 1-sidebar | 0-sidebars | !in responsiveimages plugin cases */
    .grid-flex .page .serendipity_imageComment_left,
    .grid-flex .page .serendipity_imageComment_right,
    .grid-flex .page p .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .page p .serendipity_image_right:not([srcset*=".400W."]),
    .grid-flex .post .serendipity_imageComment_left,
    .grid-flex .post .serendipity_imageComment_right,
    .grid-flex .post p .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .post p .serendipity_image_right:not([srcset*=".400W."]),
    .grid-flex .post div .serendipity_image_left:not([srcset*=".400W."]),
    .grid-flex .post div .serendipity_image_right:not([srcset*=".400W."]) {
        max-width: 100%; }
}
@media (min-width: 1520px) {
    /* 2-sidebars | !in responsiveimages plugin cases */
    .grid-col .page .serendipity_imageComment_left,
    .grid-col .page .serendipity_imageComment_right,
    .grid-col .page p .serendipity_image_left:not([srcset*=".400W."]),
    .grid-col .page p .serendipity_image_right:not([srcset*=".400W."]),
    .grid-col .post p .serendipity_image_left:not([srcset*=".400W."]),
    .grid-col .post p .serendipity_image_right:not([srcset*=".400W."]),
    .grid-col .post div .serendipity_image_left:not([srcset*=".400W."]),
    .grid-col .post div .serendipity_image_right:not([srcset*=".400W."]) {
        max-width: 87.25%; }
}
@media (min-width: 1640px) {
    .grid-flex .post .serendipity_image_block.row .serendipity_imageComment_left,
    .grid-flex .post .serendipity_image_block.row .serendipity_image_link {
        min-width: fit-content;
        width: auto;
        max-width: 100%; }
}

/* re-span max-width scales for some legacy poor man galleries mostly in comment boxes */
.grid-col .post div.serendipity_image_block.row .serendipity_image_left,
.grid-col .post div.serendipity_image_block.row .serendipity_image_right,
.grid-col .post .serendipity_image_block > div > div .serendipity_image_left:not([srcset*=".400W."]),
.grid-col .post .serendipity_image_block > div > div .serendipity_image_right:not([srcset*=".400W."]),
.grid-col .post .serendipity_image_block > div > div .serendipity_image_left:not([srcset*=".800W."]),
.grid-col .post .serendipity_image_block > div > div .serendipity_image_right:not([srcset*=".800W."]),
.grid-col .post div .serendipity_image_left:not([srcset*=".400W."]),
.grid-col .post div .serendipity_image_right:not([srcset*=".400W."]),
.grid-col .post figure div .serendipity_image_left:not([srcset*=".400W."]),
.grid-col .post figure div .serendipity_image_right:not([srcset*=".400W."]),
.grid-col .post figure div .serendipity_image_left:not([srcset*=".800W."]),
.grid-col .post figure div .serendipity_image_right:not([srcset*=".800W."]) {
    max-width: 100%; }

/* overwrite fallback plain image padding */
.serendipity_image_center {
    padding: .25em;
}
/* style to center */
.serendipity_image_center {
    display: block;
    margin: 0 auto 1em; }
.serendipity_image_block {
    width: 100%;
    /* stop stretching above a certain range? */
    /*max-width: 1600px;*/
}
.serendipity_image_block:not(.col):not(.row) > .serendipity_image_left,
.serendipity_image_block:not(.col):not(.row) > .serendipity_image_right {
    margin: .5em 0 0 0;
    float: none;
}
/* overwrite fallback gallery comment container margins and some of this comment styles */
.serendipity_image_block .serendipity_imageComment_left,
.serendipity_image_block .serendipity_imageComment_right {
    margin-top: auto;
    margin-right: unset;
    background-color: unset;
}

@media (min-width: 1024px) {
  .serendipityPlug img {
    width: 65.2225% !important;
    max-width: 150px; }
}

/** MEDIA QUERIES **/

/* For SMALL SCREENS above */
@media (min-width: 480px) {
  #navbar {
    padding: 0;
    text-align: center; }
  #navbar ul {
    display: initial;
    max-width: initial;
    margin: initial;
    background-image: -webkit-linear-gradient(top, #294564, #122942); /* For Chrome 25 and Safari 6, iOS 6.1, Android 4.3 */
    background-image:    -moz-linear-gradient(top, #294564, #122942); /* For Firefox (3.6 to 15) */
    background-image:         linear-gradient(to bottom, #294564, #122942); }
  #serendipityRightSideBar .sidebar_widget,
  #serendipityLeftSideBar .sidebar_widget {
    margin: 0 1rem auto; }
  .form_field input, .form_field select, .form_select input, .form_select select {
    max-width: 360px;
    max-width: 22.5rem; }
  /* image parent comment box responsiveness - resets auto !important */
  .serendipity_imageComment_left,
  .serendipity_imageComment_center,
  .serendipity_imageComment_right {
     width: max-content; }
  .archive_year {
    width: 46%;
    margin: auto 1.5% 1.5% auto;
    vertical-align: top; }
}

/* For SMALL SCREENS + above */
@media (min-width: 540px) {
  #navbar {
    margin: 1.25rem auto 0 1.5rem;
    text-align: left; }
}

/* For SMALLER SCREENS above */
@media (min-width: 680px) {
  html {
    font-size: calc(.45rem + 1vw); /* sizes SMALLER SCREENS text responsively from ~14px to 15.7833px; */
  }
}

/* For MIDDLE SCREENS above */
@media (min-width: 768px) {
  body {
    min-height: initial; }
  #content {
    min-height: 6em; }
  .form_field input, .form_field select, .form_select input, .form_select select {
    max-width: 400px;
    max-width: 25rem; }
  .form_tarea {
    max-width: 720px;
    max-width: 45rem; }
  #login_error, #login_instructions, #loginbox, .login_error {
    margin: auto 25%; }
}

/* For MID SCREENS above */
@media (min-width: 860px) {
  html {
    font-size: calc(.35rem + 1vw); /* sizes SMALL SCREENS text responsively from ~14.2px to 15.8167px; */
  }
}
@media (min-width: 860px) and (max-width: 1023px) {
  .archive_year { width: 47.875%; }
}

/* For TABLET SCREENS PLUS - sizing depends on default font + size and sidebar width */
@media (min-width: 1024px) {
  html {
    font-size: calc(.235rem + 1vw); /* sizes SMALL SCREENS text responsively from 14px to 15.95px; */
  }
  body {
    width: 100%;
    margin: 0 auto; }
    /* two sidebars - 3 implicit cols */
    body.grid-col {
      display: -webkit-flex;
      display: flex;
      grid-template-rows: initial; }
    /* no OR one sidebar - flexible cols */
    /* chrome workaround */
    body.grid-flex {
      display: grid;
      grid-gap: 1em;
      grid-template-columns: auto 1fr auto;
      grid-template-areas:  "hd hd hd"
                            "lft main rht"
                            "ft ft ft";
      grid-template-rows: auto; }
    body.grid-flex #serendipity_banner {
      grid-area: hd; }
    body.grid-flex #serendipityLeftSideBar {
      grid-area: lft; }
    body.grid-flex #content {
      margin: 0;
      width: 100%;
      grid-area: main; }
    body.grid-flex #serendipityRightSideBar {
      grid-area: rht; }
    body.grid-flex #footer {
      grid-area: ft; }
    /* no sidebars */
    body.grid-block #content {
      margin: 1em 1em 0;
      width: auto; }
  /* set section grid */
  section.grid {
    display: inline-grid;
    grid-gap: 1em;
    grid-template-columns: minmax(auto, 280px) 1fr minmax(auto, 280px);
    grid-template-rows: auto 1fr auto;
    grid-template-areas: "left content right"; }
    section.grid aside:first-child {
      grid-area: left; }
    section.grid aside:last-child {
      grid-area: right; }
    section.grid main {
      grid-area: content; }
    section.grid aside {
      margin-top: 1em; }
  #content {/* for all grids - keeps content flexible! */
    min-width: 33.3em; }
  #serendipityLeftSideBar {
    margin-left: 1em; }
  #serendipityRightSideBar {
    margin-right: 1em; }
  #serendipityLeftSideBar,
  #serendipityRightSideBar {
    display: initial;
    min-height: 67vh;
    width: auto; }
  .grid-flex #serendipityLeftSideBar,
  .grid-flex #serendipityRightSideBar {
    width: 280px; }
  #content,
  #serendipityLeftSideBar,
  #serendipityRightSideBar {
    border-radius: 4px;
    border: 1px solid #eee; }
  #serendipityRightSideBar .sidebar_widget,
  #serendipityLeftSideBar .sidebar_widget {
    margin: initial;
    /*overflow-x: auto;*/ }
  /* disables first SideBarItem h3 top margin */
  #serendipityLeftSideBar > div.sidebar_widget:nth-of-type(1) > h3,
  #serendipityRightSideBar > div.sidebar_widget:nth-of-type(1) > h3 {
    margin-top: 0; }
  #content .post {
    word-wrap: break-word;  /* this is more or less for Chromium, to explicitly break loooong urls */
    overflow-wrap: break-word; /* CSS3 Draft */
    word-break: break-word; /* and words, which do expand the flexing content width on certain screens */
  }
  .serendipity_Entry_Date:not(:last-of-type) {
    margin-bottom: 1.5em; }
  .serendipity_Entry_Date:last-of-type {
    margin-bottom: .5em; }
  /* workaround a post(s) (wide) table behaviour */
  .grid-col .post table,
  .grid-col .post_content table {/* yes, since within the #extended id knot */
    max-width: 432px;/* valid until ~540px, which is 2*280px for the sidebars = 560px + 432px = 992px + 4*8px margins = 1024px page width */
    border-spacing: 0; }
  .grid-col .post table,
  .grid-col .post_content table.expand {/* yes, since within the #extended id knot */
    border-spacing: 5px;
    width: 100%;
    padding: 0; }
  /* sadly necessary when using 3-char[+] notation */
  .serendipity_calendar th {
    font-size: x-small; }
  #login_error, #login_instructions, #loginbox, .login_error {
    margin: auto 30%; }
}

/* workaround post table end; depending the exact entries table size(s) though */
@media (min-width: 1132px) {
  .post table,
  .post_content table {/* yes, since within the #extended id knot */
    max-width: initial; }
}

/* For DESKTOP SCREENS PLUS sizing depends on default font + size and sidebar width */
@media (min-width: 1220px) {
  html {
    font-size: initial; /* default 16px */
  }
  .grid-col .post table,
  .grid-col .post_content table {/* yes, since within the #extended id knot */
    max-width: initial; }
  #navbar ul li.navsearch {
    margin-right: 1em; }
  #login_error, #login_instructions, #loginbox, .login_error {
    margin: auto 35%; }
}
@media (min-width: 1490px) {
  .archive_year { width: 47.875%; }
}

/* serendipity_event_spamblock_bee start */

.spambeehidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.comment_phone_input {
    max-width: 100%;
    display:none;
    visibility:hidden;
}

/* serendipity_event_spamblock_bee end */


/* serendipity_event_emoticate start */

.emoticon {
    display: inline;
    vertical-align: bottom;
    border: 0 none;
}

/* serendipity_event_emoticate end */



/* nl2br plugin start */

p.whiteline, /* keep whiteline for compat */
p.wl_nobottom {
    margin-bottom: 0em;
}
p.wl_notop {
    margin-top: 0em;
}
p.wl_notopbottom {
    margin-top: 0em;
    margin-bottom: 0em;
}

/* nl2br plugin end */


/*** START staticpage event plugin css ***/

/*
 shorten very long staticpage titles by CSS,
 width: 16em is for small sidebars.
 Please overwrite for your templates needs.
*/
.sidebar_content .spp_title,
.serendipitySideBarContent .spp_title,
.sidebar_content .node,
.serendipitySideBarContent .node {
    padding-left: 0px;
    text-overflow: ellipsis;
    display: inline-block;
    width: 16em;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top;
    font-weight: normal;
}

.staticpage_index_navigation {
    margin: 0 2em 1em;
}
#staticpage_nav {
    border: 1px solid #aaa;
    margin-bottom: 1em;
}
#staticpage_nav .staticpage_navigation {
    text-align: center;
    padding: 0.2em 0.5em;
    margin: 0;
    display: block;
    border: 0 none;
    background-color: inherit;
}
#staticpage_nav .staticpage_navigation li,
#staticpage_nav .staticpage_navigation_breadcrumb {
    display: inline-block;
}
#staticpage_nav .staticpage_navigation_left {
    float: left;
}
#staticpage_nav .staticpage_navigation_center {
    text-align: center;
}
#staticpage_nav .staticpage_navigation_right {
    float: right;
}
#staticpage_nav .staticpage_navigation_breadcrumb {
    background: none repeat scroll 0% 0% #EEE;
    padding: 0.2em 0.5em;
}
#staticpage_nav .staticpage_navigation_dummy {
    color: #bbb;
}

.staticpage_metainfo {
    margin-top: 1em;
}

.staticpage_results {
    text-align: left;
}

/* for older sidebar templates not using ul li lists and the plugin_staticpage non-smartified option */
.serendipity_plugin_staticpage .spp_title {
    display: list-item;
    list-style: none;
}

.sidebar_content .spp_title:after,
.serendipitySideBarContent .spp_title:after {
    content:"\a";
    white-space: pre;
}

/*** END staticpage event plugin css ***/



/* auto include templates/tati3p/user.css */

#blink {
    background: #373e47;
}
.serendipity_entrypaging_left {
    float: left;
}
.serendipity_entrypaging_right {
    float: right;
}
span.epicon.sep {
    margin: auto 3%;
}

#serendipity_banner {
    background-image: url('templates/tati3p/i/snova.jpg');
    background-size: cover;
    /*background-blend-mode: exclusion;*/
}
.serendipity_plugin_html_nugget .serendipity_image_link img {
    width: 65.2225% !important;
    max-width: 150px;
}

.serendipity_Entry_Date:last-of-type + .serendipity_entrypaging {
    margin-top: 1.5em;
}