/**
  Offline App 2014-2022 for Dr Toolbox
  Written by Petko Yotov www.pmwiki.org/petko

  This text is written for PmWiki; you can redistribute it and/or modify
  it under the terms of the GNU General Public License as published
  by the Free Software Foundation; either version 3 of the License, or
  (at your option) any later version. See pmwiki.php for full details
  and lack of warranty.

  Copyright 2014-2022 Petko Yotov www.pmwiki.org/petko
  
  jQuery Mobile Icon Pack - Font Awesome See license below
*/

:root {
  --theme-color: #005eb8;
  --theme-darker-color: #004a91;
  --theme-bgcolor-light: #c9edff;  
  --link-color: var(--theme-color);
  --link-color-visited: #7600b8;
  --theme-color-text: var(--theme-color);
  --ppp: #555;
  --sss: #777;
  --ooo: #888;
  --nnn: #999;
  --aaa: #aaa;
  --bbb: #bbb;
  --ccc: #ccc;
  --ddd: #ddd;
  --eee: #eee;
  --ggg: #f8f8f8;
  --text-color: #333;
  --text-color-black: black;
  --bgcolor: white;
  --orangered: #ff4400;
  --text-color-header: white;
  --inputbox-bgcolor: var(--bgcolor);
  --inputbutton-bgcolor: var(--eee);
  --inputbox-color: var(--text-color);
  --heading-color: #08acfe;
  --highlight: #ffa;
  --logogreen: #bdd62d;
  --bgsalmon: #fed;
  --salmon: #fdc;
}


#understatus {
  position: fixed; width: 10000px; height: 10000px; top: -10000px; left: -2000px; z-index: 99999; background-color: #f9f9f9;
}
#crash-reload {
  display: none; border: 4px solid red; height: 50vh; 
}
#contactloginform, #editloginform
{display: none;}
#ui-logo-drt {
  margin-left: 4em;
}
#ui-commentform {
  max-width: 350px; padding: 2mm; display: none;
}
.displaynone {
  display: none;
}
.ypi {
  margin: 5mm 0 !important;
}
.margin-left-3mm { margin-left: 3mm; }
.margintop-5mm { margin-top:5mm;}
.margin-1em0 {margin:1em 0 !important;}
.padding-dot5em { padding: .5em !important; }
.previewcolortheme {
  margin: .5em; padding: 0 .5em; border: 1px solid #ccc;
}
.previewcolortheme > * {
  font-weight: normal !important;
}

html {font-size: 95%; }

html.makeposter, html.makeposter * {
  scrollbar-width: none;
  scrollbar-height: none;
}

@font-face {
  font-family: 'Raleway';
  src: url('/raleway/raleway-bold-webfont.woff2') format('woff2');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Raleway';
  src: url('/raleway/raleway-bolditalic-webfont.woff2') format('woff2');
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: 'Raleway';
  src: url('/raleway/raleway-italic-webfont.woff2') format('woff2');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Raleway';
  src: url('/raleway/raleway-regular-webfont.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}


body { 
  --theme-color: #326CC0; 
  
  --theme-color-teal: teal; 
  --theme-color-blue: #326CC0; 
  --theme-color-chocolate: #7B3F00; 
  --theme-color-coffee: #6F4E37; 
  --theme-color-shamrock: #009E60; 
  --theme-color-grape: #6F2DA8; 
  --theme-color-gold: #DAA520; 
  --theme-color-slate: #2F4F4F; 
  --theme-color-indigo: indigo; 
  --theme-color-orchid: #9932CC; 
  
  --theme-color-burgundy: #900020; 
  --theme-color-auburn: #A52A2A; 
  
  --theme-color-pink: #FF1493; 
  --theme-color-invert: #0cc;
  
  --preview-element-width: 100%;
  --preview-flip-degrees: 0deg;
  
  --tablescale: .4;
  --preview-offset-top: 71px;
  --header-height: 50px;
  --window-height: 100vh;
}


body {
  font-family: 'Raleway', 'Arial', 'Helvetica', sans-serif;
  line-height: 1.67;
  overscroll-behavior-y: auto;
}

html {
  min-height: 100vh;
/*   position: fixed; */
/*   top:0; left:0; width: 100%; */
}
body {
  min-height: 100vh;
}
#ui-editframe, #ui-editframe .eframe {
  height: 100vh;
}

@media (orientation: landscape) {
  .nolandscape { display: none; }
}

@media (orientation: portrait) {
  .noportrait { display: none; }
}

.hide {
  display: none;
}

h2, h3, h4 { color: var(--theme-color); margin: 0; padding: 0; background-color: #eee; }
h3 { color: black; }
p {margin: 0; padding: 0; }

.drt-input, input.drt-btn {
  -webkit-appearance: none;
  border-radius: .5em;
  width: 100%;
  max-width: calc(100% - 5mm);
  background-color: #eee;
  border: 1px solid #eee;
  padding: .5em;
  cursor: pointer;
}
select.drt-input {
  max-width: calc(100%);
}
input.drt-btn {
  font-weight: bold;
  color: var(--theme-color);
  max-width: calc(100%);
}


drt-tel a.ui-link {
  font-weight: bold;
}

#ui-headlink {color: white;}
#ui-HomePage > h1:nth-child(1) {display: none;}

div.frame {
  border: 1px solid #ccc;
  padding: 8px;
  margin: 8px;
  font-size: 95%;
  background-color: #eee;
}

#ui-fsize-smaller span { font-size: 90%; font-weight: normal; }
#ui-fsize-larger span { font-size: 110%; font-weight: normal; }



/* 2017 */
#ui-tblist { max-width: 100%; margin: 0 3mm; }
#ui-tblist li { border-bottom: 1px solid #aaa; padding: .4em !important;  }
#ui-tblist li a { color: black; border: none !important; }
#ui-tblist li a b { color: var(--theme-color); float: right; margin-left: 1em; }
#ui-changetblink { margin-left: 1em; font-weight: bold; }
#ui-selectedtbname, #ui-selectedtbname2 { font-weight: bold; font-size: 1.4em; }
#ui-tbselect {display: none;}
#ui-mapframe {border: none; width:100%; position:absolute; top:40px; bottom:0px; left:0px; right:0px;}

#ui-tblist:not(:empty) + #loading-domains { display: none; }
#clearrecent {
  float: right;
  cursor: pointer;
  color: var( --theme-color );
}

#ui-topheader {
  line-height: 1;
  z-index: 1001;
}
#ui-topheader, #ui-menu { background-color: var(--theme-color); border-color: var(--theme-color); }
#ui-topheader a { background-color: transparent; }

#ui-menu a.wikilink, #ui-menu a.urllink{
  color: white;
}
#ui-menu .worse-content h2 {
  color: white;
  background-color: rgba(255, 255, 255, .2);
}
#ui-menu figure.attachment--file {
  color: white;
}

#ui-menu figure {
  border: none;
  background: none;
  padding: 0;
  width: 100%;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: pre;
}

.ui-grid-b {font-size: 90%;}
.ui-grid-b a { white-space: nowrap; text-overflow: ellipsis; }
#ui-menulist li a { padding-left: 35px !important; font-size: 105%; }



.ui-mobile label, .ui-controlgroup-label {
  margin-bottom: 1mm !important;
}


#commentfield {display: block; max-width: 99%;}

#ui-loginform label {
  line-height: 1.5em;
}

#ui-logout label {
  padding-left: 2.5em !important;
  font-weight: normal !important;
}

div.coverpicture {
  text-align: center;
  padding: 20px 10px;
  margin-bottom: 20px;
  font-size: 1.2em;
}
div.coverpicture svg {
  width: 400px;
  max-width: 100%;
}


div.coverpicture h1 {
  color: black;
  border: none;
  background: transparent !important;
}


.link404 { border-bottom: 1px dotted red; }
a.imgtextlink {padding: .4em;}


.center {text-align: center;}


a {text-decoration: none; }
/* .ui-content a { margin: 3mm 0 !important; } */

#ui-loginform {padding: .5em;}

.ui-content h1 { font-size: 1.4em; padding:0 0 0 8px; margin:0; background-color:#eee; color: var(--theme-color); border-bottom: 1px solid #ccc; }
.ui-content h2 { font-size: 1.2em; }
.ui-content h3 { font-size: 1.1em; }
.ui-content h2, .ui-content h3 { margin: 1em 0; }

a.ui-btn.urllink {color: var(--theme-color);}

/* default tables from the old site */
table.valign_top td {vertical-align: top;}
table.valign_top select { max-width: 30em; }
table.simpletable {border:2px solid #888; border-collapse:collapse; margin-left: 8px;}
table.simpletable tr:nth-child(odd) {background-color:#f4f4f4;}
table.simpletable tr:nth-child(even) {background-color:#fff;}
table.simpletable td, th {border:1px solid #888; vertical-align: top;}
table.simpletable th { background-color:#ddd; }
td.left, th.left {text-align: left;}
td.center, th.center {text-align: center;}
td.right, th.right {text-align: right;}

div.scrollable {
  max-width: calc(100vw - 16px);
  overflow: auto;
  padding:0;
}

div.scrollable::before {
  content: 'swipe ↔ to scroll or rotate to zoom';
  color: #999;
  text-align: center;
  display: block;
}

#ui-searchresults li a span { float: right; background-color: yellow; font-weight: bold; padding: 1px 5px; margin-left: .5em; }
#ui-searchresults li a b { }


li.filetable-item div.exturl a {
  white-space: nowrap !important;
}

.filetable_ul li[data-role="list-divider"] {
  cursor: pointer;
}

.filetable_ul li[data-role="list-divider"]:before {
  content: '▾ ';
}

.filetable_ul li[data-role="list-divider"].really-closed:before {
  content: '▸ ';
}

.filetable_ul li.filetable-item.really-closed {
  display:none !important;
}

.filetable_ul h5 small {
  display: block;
  color: #444;
  font-weight: normal;
}

li[data-role="list-divider"] h4 {
  display: inline;
  background-color: transparent;
}

.filetable_ul h4 {
  font-size: 1.1rem !important;
}
.filetable_ul h5 {
  font-size: 1rem !important;
  font-weight: normal !important;
}


.ui-listview * {white-space: normal !important;}
.ui-listview > li.filetable-item {
  padding: 0 .5em;
}
.ui-listview.filetable_ul > .ui-li-divider {
  padding: .5em;
}

#ui-reset, #ui-smaller, #ui-larger, #ui-tblist-reload, #ui-tblist-order { font-weight: bold; }
#ui-loading .ui-panel-wrapper, #previewloading {
  background-image: url('/dr-toolbox/app/images/ld.gif');
  background-repeat:no-repeat;
  background-position: center center;
}
#ui-loading p {
  padding: 2em 0;
  text-align: center;
}
.ui-page-theme-a a:visited, .ui-page-theme-a a:hover {color: #066;}
.ui-page-theme-a a {font-weight: normal; color: var(--theme-color);}

.ui-btn, .ui-listview > li > a.ui-btn, .ui-listview > .ui-li-static { white-space: normal; }
.ui-btn { font-size: inherit; }

.ui-btn-icon-notext {padding: 0 !important;}
.ui-btn {padding: 2mm 0; font-family: inherit;}

ul .ui-btn {text-align: left;}

.ui-page .ui-listview {padding-right: 0;}


.ui-btn-icon-right::after { right: 0; }
.ui-btn-icon-right { padding-right: 25px; }



img {max-width: 100%; height: auto; }


#kp_call {  font-size: 6mm; color: green; font-weight: bold; width: 5em; }
#kp_input {  font-size: 6mm; font-weight: bold; text-align: center; }

#ui-keypad u { color: green; }
#kp_pick_pfx {display: none;}
#kp_pick_pfx label {padding: 2mm !important;}

.ui-listview {margin-bottom: 10px;}

#articles h2, #articles h3 { margin-top: 1em; }
.ui-header .ui-title { white-space: normal; margin: 0px 40px; padding: 16px 0 14px 0; }
.ui-title a.ui-link { text-decoration: none; color: white; }

#ui-logo-drt { padding: 0; text-align:center; }
#ui-logo-drt img { position: relative; margin: 0px 0px; max-width: 60%; }
/*   #ui-logo-drt table { border-collapse: collapse; } */
/* #ui-logo-drt td { margin: 0; padding: .2em; vertical-align: bottom; } */

.ui-content {padding: 0 0 20mm 0; margin: 0;}



#ui-mapcredits {
  display:inline-block;
  width: auto;
  position: absolute;
  right: 0px;
  bottom: 0px;
  z-index: 3;
  background-color: rgba(255, 255, 255, .5);
  font-size: .8em;
  padding: 2px 4px !important;
}
#ui-map, #ui-map * {padding: 0 !important; margin: 0 !important;}


.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none;           /* non-prefixed version, currently
                                  not supported by any browser */
}


.ui-selectmenu.ui-popup .ui-input-search {
    margin-left: .5em;
    margin-right: .5em;
}
.ui-selectmenu.ui-dialog .ui-content {
    padding-top: 0;
}
.ui-selectmenu.ui-dialog .ui-selectmenu-list {
    margin-top: 0;
}
.ui-selectmenu.ui-popup .ui-selectmenu-list li.ui-first-child .ui-btn {
    border-top-width: 1px;
    border-radius: 0;
}
.ui-selectmenu.ui-dialog .ui-header {
    border-bottom-width: 1px;
}

#li-feedback:empty { display: none; }


@media (min-width:35em) {
 
  /* wrap on wide viewports once open */
 
  .ui-panel-page-content-open.ui-panel-page-content-position-left {
    margin-right: 17em;
  }
  .ui-panel-page-content-open.ui-panel-page-content-position-right {
    margin-left: 17em;
  }
  .ui-panel-page-content-open {
    width: auto;
  }
 
  /* disable "dismiss" on wide viewports */
  .ui-panel-dismiss {
    display: none;
  }
 
  /* same as the above but for panels with display mode "push" only */
 
  .ui-panel-page-content-open.ui-panel-page-content-position-left.ui-panel-page-content-display-push {
    margin-right: 14em;
  }
  .ui-panel-page-content-open.ui-panel-page-content-position-right.ui-panel-page-content-display-push {
    margin-left: 14em;
  }
  .ui-panel-page-content-open.ui-panel-page-content-display-push {
    width: auto;
  }
 
  .ui-panel-dismiss-display-push {
    display: none;
  }
}

.ui-icon-bleep:after { background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2217.717%22%20height%3D%2217.717%22%20viewBox%3D%220%200%20500%20500%22%20fill-rule%3D%22evenodd%22%20clip-path%3D%22url(%23presentation_clip_path)%22%20stroke-width%3D%2228.222%22%20stroke-linejoin%3D%22round%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cdefs%3E%3CclipPath%20id%3D%220%22%3E%3Cpath%20d%3D%22m0%200h500v500h-500z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22m250%20499h-250v-499h499v499h-249%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m402%20293h-300c-61%200-83-23-83%201v85c0%2023%2051%2042%20112%2042h229c61%200%20112-19%20112-42v-85c0-24-9-1-70-1%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%2240%22%20stroke-linejoin%3D%22miter%22%20d%3D%22m361%2081h-222c-63%200-113%2040-113%2090v178c0%2048%2050%2088%20113%2088h222c59%200%20109-40%20109-88v-178c0-50-50-90-109-90%22%2F%3E%3C%2Fsvg%3E');
}



#ui-site-sidebar .sblinks p a, #ui-site-sidebar .worse-main-links ul li a, #ui-menulist p a {
  color: #fff;
  text-shadow: 0 1px 0 #111;
  display: block;
  padding: .2em 0;
  white-space: pre;
  overflow: hidden;
  text-overflow: ellipsis;
}



#ui-autolink-search {border-bottom: 2px solid rgba(0, 0, 0, .3);}


#ui-menulist p a {
  color: rgba(255,255,255,.7);
}
#ui-site-sidebar .worse-main-links ul, #ui-site-sidebar .worse-main-links ul li, 
.childrenlist ul, .childrenlist ul li
{
  margin:0;
  padding: 0;
  list-style-type: none;
}

.childrenlist {
/*   border-top: 1px dashed #ddd; */
  margin-top: 1em;
/*   padding-top: 1em; */
}
.childrenlist p {
  font-weight: bold;
  line-height: 1cm;
}
.childrenlist ul {
  margin:0;
  margin: 0 0 0 2mm;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  grid-gap: 4px;
}

html.mockup .childrenlist ul {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

@media screen and (max-width:30em) {
  .childrenlist ul {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

@media screen and (max-width:18em) {
  .childrenlist ul {
    grid-template-columns: auto;
  }
}


.childrenlist ul li {
  list-style-type: none;
  padding: 0;
  margin: 0;
  
  display: inline-block;
  width: 97%;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
}
.childrenlist ul li a {
  
  border: 1px solid var( --theme-color ) ;
  background-color: #eee;
  padding: 0 4px;
  border-radius: 3px;
  
  display: inline-block;
  width: 100%;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
  
  line-height: 1cm;
  white-space: pre;
  overflow: hidden;
  text-overflow: ellipsis;
}

.childrenlist li.bg-pastelgreen a { background-color: #b4d3b2; }
.childrenlist li.bg-fuchsia a { background-color: #df88b7; }
.childrenlist li.bg-turquoise a { background-color: #71dbd4; }
.childrenlist li.bg-purple a { background-color: #b09fca; }

.childrenlist li.bg-nhsblue a { background-color: #005EB8; color: white; }
.childrenlist li.bg-blue a { background-color: #9df; }
.childrenlist li.bg-lavender a { background-color: #ecf; }
.childrenlist li.bg-green a { background-color: #cfc; }
.childrenlist li.bg-red a { background-color: #fcc; }
.childrenlist li.bg-orange a { background-color: #fda; }
.childrenlist li.bg-yellow a { background-color: #ffa; }


.childrenlist > p:first-child {
  color: var( --theme-color );
  background-color: #eee;
  font-size: 22px;
  padding: 0 .4em;
  margin: .4em 0;
}



drt-tel, .drt-tel {
  white-space: pre;
  font-family: inherit;
  font-weight: bold;
  color: var(--theme-color);
}
drt-tel a {
  font-weight: bold;
}
drt-tel::after, .drt-tel::after {
  content:"\202F✆"; 
}
drt-tel a {
  color: inherit;
}
drt-bleep, span.drt-bleep {
  white-space: pre;
  font-family: inherit;
  font-weight: bold;
  background-position: right 3px bottom 50%;
  background-repeat: no-repeat;
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2210%22%20height%3D%228%22%20stroke%3D%22%23f40%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Asvg%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20height%3D%227%22%20width%3D%229%22%20y%3D%220.5%22%20x%3D%220.5%22%20fill%3D%22none%22%2F%3E%3Crect%20fill%3D%22%23f40%22%20x%3D%221.0%22%20y%3D%225.0%22%20width%3D%228%22%20height%3D%222.0%22%2F%3E%3C%2Fsvg%3E');
  color: #f40;
/*   border: 1px solid #f40; */
  padding: 2px 16px 2px 2px;
}
.copy-drt {
  text-align: center; font-size: 90%; margin-top: 1em;
}

html.beta-app .copy-drt::after {
  content: "Beta app (experimental)";
  display: block;
  text-align: center;
  color: #ccc;
  font-weight: normal;
  font-style: italic;
}


html.beta-app body::before {
  content: attr(data-version);
  display: block;
  position: fixed;
  bottom: 1mm;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10000;
  color: #0f0;
/*   background-color: white; */
  font-size: 14px;
  line-height: 1;
  text-shadow: none;
}

.ui-page figure {
  padding: 0;
  margin: 0;
}

figure.attachment--file {
  color: #333;
  line-height: 1;
  margin: 0 2px 2px 0;
  padding: 0.4em 1em;
  border: 1px solid #bbb;
  border-radius: 5px;
  width: 24em;
  max-width: calc(100% - 3em);
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M%205%207%20h%2012%20a%205%205%2C%200%2C%200%2C%201%2C%200%2010%20h%20-12%20a%203.5%203.5%200%200%201%200%20-7%20h%2011%20a%202%202%200%200%201%200%204%20h%20-10%20%22%20fill%3D%22transparent%22%20stroke%3D%22lightgrey%22%20transform%3D%22rotate%28-45%2C%2011%2C%2011%29%22%20stroke-width%3D%221.5%22%20%2F%3E%3C%2Fsvg%3E');
  background-position: 99% 99%;
  background-repeat: no-repeat;
  background-size: 24px 24px;
}

table figure.attachment--file {
  width: auto;
}


figure.attachment.attachment--preview {
  text-align: center;
  margin: 0 auto;
  display: block;
}

.prevideoframe {
  width: 320px;
  height: 180px;
  
  background-image: url(images/video-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  
  text-align: center;
  line-height: 180px;
  font-size: 5em;
  color: white;
  text-shadow: 2px 2px 8px #000;
  border-radius: 6px;
  
}

figure a.vlink {
  position: relative;
  float: right;
  margin: 2px 1px 0 0;
  z-index: 2;
  background-color: white;
  border-top-right-radius: 3px;
}

figcaption span.attachment__size {
  display: none;
}


figure.attachment {
  display: inline-block;
  position: relative;
}

figure video { max-width: 100%; }

#ui-site-sidebar .sblinks p {
  border: none;
}
#ui-site-sidebar form {
  display: none;
}

#ui-site-sidebar .sbtitle {
  color: white;
  font-size: inherit;
  background-color: rgba(255, 255, 255, .3);
}

body.font-arial, #ui-fonts a#ui-font-arial {
  font-family: Arial, Helvetica, sans-serif;
}

body.font-times, #ui-fonts  a#ui-font-times {
  font-family: "Times New Roman", serif;
}

body.font-comic, #ui-fonts  a#ui-font-comic {
  font-family: "Comic Sans MS", "Chalkboard SE", "Comic Sans Neue", "Comic Sans", "Comic", sans-serif;
}

body.font-verdana, #ui-fonts  a#ui-font-verdana {
  font-family: "Verdana", sans-serif;
}

body.font-mono, #ui-fonts  a#ui-font-mono {
  font-family: monospace;
}

body.font-georgia, #ui-fonts  a#ui-font-georgia {
  font-family: "Georgia", serif;
}
#ui-fonts  a#ui-font-default {
  font-family: "Raleway", Arial, Helvetica, sans-serif;
}

body.font-opensans, #ui-fonts  a#ui-font-opensans {
  font-family: "Open Sans", "OpenSans", sans-serif;
}

body.font-roboto, #ui-fonts  a#ui-font-roboto {
  font-family: "Roboto", sans-serif;
}

body.font-helvetica, #ui-fonts  a#ui-font-helvetica {
  font-family: "Helvetica Neue", Helvetica, sans-serif;
}

#ui-color-themes a {
/*   background-color: var(--theme-color); */
  color: white !important;
  text-shadow: none !important;
}
#ui-color-themes a#ui-color-invert {
  background-color: #111;
  color: #f90;
}

body.color-invert { 
  -webkit-filter: invert(1) hue-rotate(180deg); 
  filter: invert(1) hue-rotate(180deg);
}
body.color-invert div.ui-content img, body.color-invert  #ui-color-themes, body.color-invert div.coverpicture, body.color-invert #ui-logo-drt svg, 
body.color-invert iframe, body.color-invert .trix-content a[href*="://youtu.be/"], body.color-invert .trix-content a[href*=".youtube.com/"], body.color-invert .trix-content a[href*="://youtube.com/"] { 
  -webkit-filter: invert(1) hue-rotate(-180deg); filter: invert(1) hue-rotate(-180deg);
  text-shadow: none;
}

body.color-invert #ui-site-sidebar .sblinks p a, body.color-invert #ui-site-sidebar .worse-main-links ul li a, body.color-invert #ui-menulist p a {
  text-shadow: none;
}


body.color-invert .ui-bar-b,body.color-invert  .ui-page-theme-b .ui-bar-inherit, html body.color-invert  .ui-bar-b .ui-bar-inherit, html body.color-invert .ui-body-b .ui-bar-inherit, html body.color-invert .ui-group-theme-b .ui-bar-inherit, html body.color-invert  .ui-body-b, html body.color-invert  .ui-body-b .ui-btn {
  text-shadow: none;
}





div.talkpost {
  color: #888;
  margin-bottom: .4em;
  padding: .4em 0em;
}
div.talkpost p {
  padding: 8px;
  white-space: pre-wrap;
}

div.talkpost ~ div.talkpost {
  border-top: 2px dashed #ccc;
}

div.talkpost:before {
  content: "User contributions (pending review):";
  color: #F40;
  font-weight: bold;
  background-color: #eee;
  display: block;
  padding: 8px;
  margin: .4em 0;
}
div.talkpost ~ div.talkpost:before {
  display:none;
}


.talkpost-new {
  background-color: #ffa;
  color: black;
  font-weight: bold;
}

#ui-editframe {
  position: fixed;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background-color: white;
/*   height: 100vh; */
  overflow: auto;
  
  display: none;
}

#ui-editframe.open {
  display: block;
  z-index: 2000;
}

.eframe {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  border: none;
  width: 100%;
  height: 100%;
  height: 100vh;
}

p.updated {
  background-color: #ffc;
  text-align: center;
  cursor: pointer;
}

.ui-listview > li.ui-last-child {
  padding-bottom: .6em;
}

.ui-listview > li.ui-first-child {
  padding-top: .6em;
}

p.revheader {
  color: #777;
  font-style: italic;
}

article[data-id$=".HomePage"] .pageattachcount {
  background-color: white;
  position: absolute;
  right: 1mm;
  top: 1mm;
}

button.eframebacklink,  button.eframesavelink {
  padding: .5em;
  color: red;
  float: right;
  z-index:2;
}

button.eframebacklink::hover,  button.eframesavelink::hover {
  background-color: inherit;
}



div.collapsible {
  position: relative;
  overflow: hidden;
  z-index:1;
}

#abs_reload {
  position: fixed;
  bottom: 78px;
  left: 0;
  z-index: 1005;
  padding: 0px;
  border-radius: 5em;
  color: red;
  opacity: .3;
  line-height:10mm;
  white-space: nowrap;
  padding: 0 1em;
  display: none;
}

#abs_reload:hover {
  opacity: 1;
  background-color: white;
}

html.beta-app #abs_reload {
  display: inline;
}

#abs_updateready {
/*   display: none; */
  position: fixed;
  
  padding: 8mm 0;
  line-height: 1;
  bottom: calc( -16mm - 1em - 3px);
  
  
  white-space: nowrap;
  overflow: hidden; 
  z-index: 1006;
  background-color: white;
  color: var( --theme-color );
  font-weight: bold;
  border-top: 3px solid var( --theme-color );
  text-align: center;
  width: 100%;
  cursor: pointer;
  text-shadow: none;
  user-select: none;
  
  transition: bottom 1s;
  
}
body.updateready:not([data-downloading]) #abs_updateready {
  bottom: 0px;
  display: block;
}

html.beta-app body.updateready:before {
  color: red;
}

.worse-content img + figcaption.caption {
/*   display: none; */
}

.worse-content > *, .revheader, .talkpost, .childrenlist .talkpost::before {
  margin-left: 8px;
}
.worse-content > ol, .worse-content > ul {
/*   padding-left: 24px; */
}
.worse-content > .fullwidth {
  margin-left: 0;
}


.trix-content a[data-trix-content-type^="image"] {
    display: table;
    text-align: center;
    clear: left;
/*     margin: 0 auto; */
    padding: 2px;
}


.trix-content img + figcaption.caption, .trix-content img + figcaption.attachment__caption, .trix-content img + figcaption.attachment__caption--edited, .trix-content img + figcaption.attachment__caption--editing {
/*   display: none; */
}


.trix-content .attachment-gallery {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  margin: 0;
  padding: 0; }
.trix-content .attachment-gallery .attachment {
  flex: 1 0 33%;
  padding: 0;
  max-width: 32%; }
.trix-content .attachment-gallery.attachment-gallery--2 .attachment, .trix-content .attachment-gallery.attachment-gallery--4 .attachment {
  flex-basis: 50%;
  max-width: 49%; }

div.ytdiv {position: relative; padding: 0px;}
div.ytdiv.clicked div.ytoverlay {
  position: absolute;
  top: 0;
  bottom: 36px;
  left: 0;
  right:0;
  border: 2px dotted green;
  z-index:5;
}


.ui-panel {
    width: 14em;
}
.ui-panel-position-left {
    left: -14em;
}
/* positioning: content wrap, fixed toolbars and dismiss */
/* panel left open */
.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open,
.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open,
.ui-panel-dismiss-position-left.ui-panel-dismiss-open {
    left: 14em;
    right: -14em;
}
/* animated: panel left open (for reveal and push) */
.ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-reveal,
.ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-push,
.ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal,
.ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push,
.ui-panel-animate.ui-panel-page-content-position-left {
    -webkit-transform: translate3d(14em,0,0);
    -moz-transform: translate3d(14em,0,0);
    transform: translate3d(14em,0,0);
}
.ui-panel-page-content-open.ui-panel-page-content-position-left.ui-panel-page-content-display-push {
/*     margin-right: 0em; */
}


#domlist_anchor + style + div.ui-page h1, 
#domlist_anchor + div.ui-page h1 {display: none;}
#ui-conditions .ui-content {
  padding: 4px .5em;
}

#ui-appmenu .ui-listview a {
  padding: .8em;
}

ul, ol {padding-left: 1em; }

#ui-create-msg, #ui-settings-msg { font-weight: bold; color: red; margin:.5em 0; }
#ui-create-msg a, #ui-settings-msg a { font-weight: bold !important; }
#ui-create-msg:empty, #ui-settings-msg:empty { display: none; }


#ui-color-default { --theme-color: var(--theme-color-teal); }

body.color-invert, #ui-color-themes a[data-color="invert"] { --theme-color: var(--theme-color-invert); }
body.color-invert { background-color: black; }

body.color-blue, #ui-color-blue { --theme-color: var(--theme-color-blue); }

body.color-orchid, #ui-color-orchid {  --theme-color: var(--theme-color-orchid); }

body.color-chocolate, #ui-color-chocolate {  --theme-color: var(--theme-color-chocolate); }
body.color-coffee, #ui-color-coffee {  --theme-color: var(--theme-color-coffee); }

body.color-burgundy, #ui-color-burgundy {  --theme-color: var(--theme-color-burgundy); }
body.color-auburn, #ui-color-auburn {  --theme-color: var(--theme-color-auburn); }


body.color-shamrock, #ui-color-shamrock {  --theme-color: var(--theme-color-shamrock); }
body.color-grape, #ui-color-grape {  --theme-color: var(--theme-color-grape); }

body.color-gold, #ui-color-gold {  --theme-color: var(--theme-color-gold); }
body.color-slate, #ui-color-slate {  --theme-color: var(--theme-color-slate); }
body.color-indigo, #ui-color-indigo { --theme-color: var(--theme-color-indigo); }

body.color-pink, #ui-color-pink {  --theme-color: var(--theme-color-pink); }


.ui-page-theme-b .ui-btn:focus, html .ui-bar-b .ui-btn:focus, html .ui-body-b .ui-btn:focus, html body .ui-group-theme-b .ui-btn:focus, html head + body .ui-btn.ui-btn-b:focus, .ui-page-theme-b .ui-focus, html .ui-bar-b .ui-focus, html .ui-body-b .ui-focus, html body .ui-group-theme-b .ui-focus, html head + body .ui-btn-b.ui-focus, html head + body .ui-body-b.ui-focus {
  box-shadow: none;
}

h2, h4, #ui-tblist li a b, .ui-content h1, 
a.ui-btn.urllink, .ui-page-theme-a a, drt-tel
{ color: var( --theme-color ); }

/* #ui-menu li, #ui-menu li a, */
#ui-topheader, #ui-menu,  #ui-color-themes a, .ui-panel-page-container-themed .ui-page-active
{
  background-color: var( --theme-color );
  border-color: var( --theme-color );
}
.ui-shadow-inset {
  -webkit-box-shadow: inset 0 1px 3px var( --theme-color );
  -moz-box-shadow: inset 0 1px 3px var( --theme-color );
  box-shadow: inset 0 1px 3px var( --theme-color );
}
#ui-shortcuts:empty {display: none;}

#SuppoRTT\.HomePage .fpltemplate ul li a.wikilink {
  font-weight: bold;
  background-color: yellow;
  padding: 4px 1em;
}


.pmcontactcard-inline + .pmcontactcard-inline-cat {display: none;}
.pmcontact-url, .pmcontact-mail {color: var(--theme-color);}

.pmcontactcard-inline * { font-weight: normal; }

.ui-page-theme-a a.ui-btn.pmcontact-dial-link {font-weight: bold; color: var(--theme-color);}

.pmcontactcard-inline a[href^="mailto:"],
.pmcontactcard-inline drt-bleep,
.pmcontactcard-inline drt-tel {
  margin: 1mm;
  display: inline-block;
  font-weight: bold;
}
.ui-listview > .pmcontact-item.ui-li-static {
    padding: 1mm;
}
.pmcontact-note {
  display: block;
}
.pmcontactcard {
  padding: .5em;
  max-width: 99%;
  margin: 0 auto;
}
.ui-panel-inner > .pmcontactcard.ui-listview, .ui-content .pmcontactcard.ui-listview {
  margin: 0 auto;
  max-width: 99%;
}

div.ui-input-search input {
  font-size: 6mm;
}
div.ui-input-search:after {
  width: 20px;
  height: 20px;
  background-size: 20px 20px;
  margin-top: -10px;
  left: 10px;
}

li.drt-tel:after, li.drt-bleep:after {
  content: none;
  background-image: none;
}
.pmcontactcard li a, .pmcontactcard li.drt-bleep, .pmcontactcard li.pmcontact-fax, .pmcontactcard li.catname {
  display: block;
  text-align: center;
}

.pmcontactcard li a, .pmcontactcard li.drt-bleep, .pmcontactcard li.pmcontact-fax, .pmcontactcard li.catname {
  border-bottom: 1px solid #ddd;
  padding: .3em;
  font-weight: bold;
}
.pmcontactcard li.catname, .pmcontactcard li.pmcontact-note, {
  font-weight: normal;
}

li.pending, li.flagged,
drt-tel.pending, span.pending, a.pending, drt-bleep.pending,
drt-tel.flagged, span.flagged, a.flagged, drt-bleep.flagged {
  background-color: #fd7;
}
.ui-listview > li h5.pmcontact-name {
  margin: 0 0 0 0;
}
h2.contactheading {
  margin-bottom: 0;
  padding: 1mm 2mm
}

ul.pmcontactlist.ui-listview >  li.ui-li-divider.pmcontactcat {
  padding: .5em .25em;
}

.collapsible .nosearch { display: none; }


/* .worse-content summary:focus, .worse-content summary:focus > h2, .worse-content summary:focus > h3{ background-color: #ff8; } */
.trix-content summary { cursor: pointer; color: var( --theme-color ); background-color: #eee; }
.trix-content summary > h2, .trix-content summary > h3 { 
  display: inline; 
  margin: 0; 
  padding: 0;
  line-height: 1;
}

.worse-content details > details > summary {
  color: black;
}

.worse-content details {
/*   padding-left: 1em;  */
  margin-bottom:4px; 
  position: relative;
}
.worse-content details > summary { 
  padding-left: 1em;
  text-indent: -1em;
  position: relative;
  background-color: #eee;
/*   margin-left: -1em; */
}


/*.worse-content details:not([open]) > summary::after {
  content: "■ ■ ■";
  display: block;
  font-size: 0.6rem;
  position: absolute;
  bottom: 2px;
  right: 0;
}*/

.worse-content details summary + *, details[open] + details, .worse-content {
  margin-top: 1em;
}


ul.filetable_ul .filedetails {
  color: #999;
}

ul.filetable_ul abbr.ok { color: var( --theme-color ); }
ul.filetable_ul abbr.duesoon { color: orange; }
ul.filetable_ul abbr.expired { color: red; }
ul.filetable_ul abbr.never { display: none; }

li.filetable-item div.exturl a {
  white-space: nowrap;
  width: 100%;
  max-width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #999;
  display: block;
}





.ui-page-theme-a a,
html .ui-bar-a a,
html .ui-body-a a,
html body .ui-group-theme-a a,
.ui-page-theme-a a:visited,
html .ui-bar-a a:visited,
html .ui-body-a a:visited,
html body .ui-group-theme-a a:visited,
.ui-page-theme-a a:hover,
html .ui-bar-a a:hover,
html .ui-body-a a:hover,
html body .ui-group-theme-a a:hover,
.ui-page-theme-a a:active,
html .ui-bar-a a:active,
html .ui-body-a a:active,
html body .ui-group-theme-a a:active, .pmcontact-url, .pmcontact-mail, drt-tel, span.drt-tel {
  color: var( --theme-color ) /*{a-link-active}*/;
}


/* Active button */
.ui-page-theme-a .ui-btn.ui-btn-active,
html .ui-bar-a .ui-btn.ui-btn-active,
html .ui-body-a .ui-btn.ui-btn-active,
html body .ui-group-theme-a .ui-btn.ui-btn-active,
html head + body .ui-btn.ui-btn-a.ui-btn-active,
/* Active checkbox icon */
.ui-page-theme-a .ui-checkbox-on:after,
html .ui-bar-a .ui-checkbox-on:after,
html .ui-body-a .ui-checkbox-on:after,
html body .ui-group-theme-a .ui-checkbox-on:after,
.ui-btn.ui-checkbox-on.ui-btn-a:after,
/* Active flipswitch background */
.ui-page-theme-a .ui-flipswitch-active,
html .ui-bar-a .ui-flipswitch-active,
html .ui-body-a .ui-flipswitch-active,
html body .ui-group-theme-a .ui-flipswitch-active,
html body .ui-flipswitch.ui-bar-a.ui-flipswitch-active,
/* Active slider track */
.ui-page-theme-a .ui-slider-track .ui-btn-active,
html .ui-bar-a .ui-slider-track .ui-btn-active,
html .ui-body-a .ui-slider-track .ui-btn-active,
html body .ui-group-theme-a .ui-slider-track .ui-btn-active,
html body div.ui-slider-track.ui-body-a .ui-btn-active {
  background-color:     var( --theme-color ) /*{a-active-background-color}*/;
  border-color:       var( --theme-color ) /*{a-active-border}*/;
  color:           #fff /*{a-active-color}*/;
  text-shadow: 0 /*{a-active-shadow-x}*/ 1px /*{a-active-shadow-y}*/ 0 /*{a-active-shadow-radius}*/ var( --theme-color ) /*{a-active-shadow-color}*/;
}

/* Active radio button icon */
.ui-page-theme-a .ui-radio-on:after,
html .ui-bar-a .ui-radio-on:after,
html .ui-body-a .ui-radio-on:after,
html body .ui-group-theme-a .ui-radio-on:after,
.ui-btn.ui-radio-on.ui-btn-a:after {
  border-color:      var( --theme-color ) /*{a-active-background-color}*/;
}
/* Focus */
.ui-page-theme-a .ui-btn:focus,
html .ui-bar-a .ui-btn:focus,
html .ui-body-a .ui-btn:focus,
html body .ui-group-theme-a .ui-btn:focus,
html head + body .ui-btn.ui-btn-a:focus,
/* Focus buttons and text inputs with div wrap */
.ui-page-theme-a .ui-focus,
html .ui-bar-a .ui-focus,
html .ui-body-a .ui-focus,
html body .ui-group-theme-a .ui-focus,
html head + body .ui-btn-a.ui-focus,
html head + body .ui-body-a.ui-focus {
  -webkit-box-shadow: 0 0 12px   var( --theme-color ) /*{a-active-background-color}*/;
  -moz-box-shadow: 0 0 12px     var( --theme-color ) /*{a-active-background-color}*/;
  box-shadow: 0 0 12px       var( --theme-color ) /*{a-active-background-color}*/;
}

#ui-site-sidebar .worse-main-links > ul > li > ul {
/*     border: 1px dotted white; */
    background-color: rgba(255, 255, 255, 0.15);
    padding: 0 0 0 .5em;

}

#ui-site-sidebar .worse-main-links > ul > li > ul > li {
/*     background-color: rgba(255, 255, 255, 0.3); */
/*     padding: 0 0 0 .5em; */
}

#ui-ukmenu {
  background-color: rgba(255, 255, 255, 0.15);
  padding: .2em;
  display: none; 
  border-radius: 0.5em;
}

#ui-ukmenu h4 {
  color: white;
  background-color: transparent;
  margin: 0 0 0 -0.2em;
}

#ui-ukmenu h4 > a {
  color: white;
}
#ui-ukmenu > div {
    padding: 0 0 0 .5em;
}

#ui-ukmenu ul.sidebar-ul li:not(:first-child) a {
  font-weight: normal;
  text-shadow: none;
}


details#apprc summary { color:  var( --theme-color ); cursor: pointer; }

#modalert, #modialog { 
  display: none;
  background-color: rgba(0,0,0,.4);
  position: fixed;
  top:0;
  bottom:0;
  width:100%;
  overflow: hidden;
  z-index:1500;
}

#modalert-box, #modialog-box { 
  text-align: center;
  background-color: white;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  width: 20em;
  max-height: 90vh;
  max-width: 80vw;
  overflow: auto;
  padding: .5em;
  border-radius: .5em;
}
#modalert-button, #modialog-buttons span {
  color: var( --theme-color ); 
  cursor: pointer;
  text-align: center;
  font-weight: bold;
  display: inline-block;
  padding: 1mm 2mm;
}
#modialog-buttons, #modialog-content {
  text-align: center;
  color: black;
  text-shadow: none;
}
#modialog-buttons {
  user-select: none;
}

html.beta-app #ui-footer:empty {
  display: block !important;
  min-height: 0;
  padding: 0;
}


#ui-footer:empty, #ui-bookmarks:empty, #user-bookmarks:empty {display: none !important;}

/* #ui-bookmarks:empty + .childrenlist {margin-top: 0;} */

#ui-footer {
  border-top: 2px solid var( --theme-color ); 
  border-bottom: 5mm solid var( --theme-color ); 
  padding: 4px;
/*   column-gap: 5px; */
  background-color: white;
  white-space: nowrap;
  overflow: auto;
  text-align: center;
}

@media screen and (max-height:700px) and (orientation: landscape) {
  #ui-footer {
    display: none;
  }
}

#user-bookmarks, #ui-bookmarks {
  text-align: center;
}

#ui-footer a.shortcutlink {
  text-shadow: none;
  font-weight: normal;
  font-size: 13.6833px;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  text-align: center;
  padding: 2mm;
  box-sizing: border-box;
  background-color: #f6f6f6;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin-right: 2mm;
}


#ui-bookmarks, #user-bookmarks {
  padding: 0;
/*   margin: 2mm 0 3mm 0; */
}
#ui-bookmarks a.shortcutlink, #user-bookmarks  a.shortcutlink {
/*   width: 30%; */
/*   margin:1mm; */
  border-color: var( --theme-color );
}
#user-bookmarks a.shortcutlink {
  color: #f40;
  border-color: #888;
  position: relative;
}

#user-bookmarks a.shortcutlink::after {
  content: "⭐";
  position: absolute;
  top: 2px;
  right: 2px;
  line-height:1;
}

#ui-menu a, #ui-menulist p a, #ui-site-sidebar .worse-main-links ul li a {
  padding: 2mm 0;
}


#try_reloading_list {
  display: none;
  text-align: center;
}

article[data-id] {
  padding-bottom: 10mm;
  position: relative;
}

#ui-login .ui-content > div {
  margin: 5mm 0;
}

#li-dev { display: none; }
#li-dev a { color: white; }
html.beta-app #li-dev { display: block; }

.devbtn { 
  display: inline-block;
  border: 1px solid red;
  border-radius: 5px;
  margin: 4px 8px;
  padding: 4px 8px;
  cursor: pointer;
}
.clearlog {
  float: right;
  font-size: 1rem;
  font-weight: normal;
  cursor: pointer;
}

#devresult, #consolelog {
  border: 1px dashed orange;
  border-radius: 5px;
  padding: 4px 8px;
  white-space: pre-wrap;
}
#cacheprogress {
  --progress-height: 3px;
  color: #fff;
  white-space: nowrap;
  overflow: visible;
  font-size: calc( .9 * var( --progress-height) );
  line-height: calc( var( --progress-height)  );
/*   text-align: right; */
  font-weight: normal;
  
  width: 0px;
  height: var( --progress-height);
  background-color: rgba(0,0,0,.3);
  position: absolute;
  bottom:0px;
  transition: background-color 6s, color 6s;
  transition-timing-function: ease-in;
  padding: 0 1mm;
  text-shadow: none;
}
#cacheprogress[data-progress="done"] {
  background-color: transparent;
  color: transparent;
}

#cacheprogress[data-progress="0%"] {
  display: none;
}
#cacheprogress.animate {
  width: 100% !important;
  display: block !important;
  transition: none;
  transition: width 2s !important;
  transition-timing-function: linear !important;
}


.scroll-nowrap, 
.scroll-nowrap * {
  box-sizing: border-box;
}

#wrappagecontrols label {
  display: inline-block;
  min-width: 7mm;
  height: calc(8mm - 2px);
  overflow: hidden;
}

#ui-preview label, #zoomflip {
  cursor: pointer;
}

#wrappagecontrols.disabled {
  opacity: .5;
  cursor: not-allowed;
}

#ui-preview #wrappagecontrols.disabled label {
  cursor: not-allowed;
}
.scroll-nowrap {
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2mm 1mm;
  display: flex;
  justify-content: space-between;
}
#pageselect {
  -webkit-appearance: none;
  border: 0px;
  vertical-align: middle;
  background-color: transparent;
  color: var(--theme-color);
  text-align: center;
}
#lbl_pageselect {
  background-color: var(--theme-color);
}

#zoomflip {
  width: 5.5em;
  text-align: center;
  line-height: 8mm;
}

#wrappagecontrols, #directlink, #zoomflip {
  display: inline-block;
  border: 1px solid var(--theme-color);
  background-color: #eee;
  border-radius: 5px;
  padding: 0 2mm;
  height: 8mm;
  overflow: hidden;
  text-overflow: ellipsis;
  user-select: none;
}


#embedimg, #canvasPDF, #flipwrap canvas {
  margin: 0;
/*   max-width: 100%; */
  transition: max-width .3s;
  image-rendering: optimizequality;
}



#nopreviewlink {
  display: block;
  max-width: 90%;
  border-radius: 5px;
  margin: 2mm auto;
}

#nopreviewlink b {
  color: var(--theme-color);
}

#previewcaption {
/*   font-weight: normal; */
/*   white-space: nowrap; */
  padding: 0 1mm;
/*   width: max-content; */
/*   min-width: calc(100% - 3mm); */
  color: unset;
}

#previewarea {
  max-width: 100%;
  overflow-x: hidden !important;
  padding: 0;
  margin: 0;
  min-height: calc( 100vh - var( --preview-offset-top ) );
  position: relative;
}

@media (orientation: portrait) {
  #previewarea[data-active="image"]:before,
  #previewarea[data-active="pdf"]:before  {
    content: "Pinch or rotate to zoom";
    display: block;
    position: absolute;
    top: 1mm;
    left: 50%;
    transform: translateX(-50%);
/*     opacity: 0.67; */
    z-index: 2;
    font-size: .9em;
/*     text-shadow: 1px 1px 1px white; */
    background-color: yellow;
    padding: 0 2mm;
  }
}



#directlink  {
  border: 1px solid  var(--theme-color);
  border-radius: 5px !important;
  padding: 1mm 2mm;
  min-width: 1cm;
  text-align: center;
  -webkit-appearance: none;
}
#flip2 + label, #prevpage {
  margin-right: .5mm;
}

#ui-preview {
  text-align: center;
}

#previewarea > *:not(a.ui-link.ui-btn.ui-btn-icon-notext.ui-corner-all) {
  display: none;
}

#videopreview {
  max-width: 100%;
  max-height: calc( var(--window-height) - var(--header-height) ) ;
  
}

#previewarea[data-active="video"] > #videopreview {
  display: inline;
}


#rotateright, #nextpage2, #prevpage2, #pageselect {
  display: none;
  border-color: black;
}
html.beta-app #previewarea[data-active="pdf"] ~ #rotateright,
#previewarea[data-active="pdf"] ~ #pageselect,
#previewarea[data-active="pdf"]:not([data-nbpages="1"]):not([data-currentpage="1"]) ~ #prevpage2,
#previewarea[data-active="pdf"]:not([data-nbpages="1"]):not([data-currentpage="last"]) ~ #nextpage2 {
  display: inline;
}


#previewarea[data-currentpage="1"] ~ #prevpage2 {
  display: none;  
}

#previewarea[data-currentpage="last"] ~ #nextpage2 {
  display: none;  
}

#previewarea > #previewcaption {
  display: block;
}

#previewarea[data-active="none"] > #nopreview,
#previewarea[data-active="loading"] > #previewloading {
  display: block;
}

#previewarea[data-active="image"] > #embedimg,
#previewarea[data-active="pdf"] > #pdfnew {
  display: inline-block;
  max-width: none;
}

#previewarea[data-active="map"] > #mapframe {
  display: block;
}

#maplink, #previewarea[data-active="map"] ~ #directlink2 {
  display: none;
}

#previewarea[data-active="map"] ~ #maplink {
  right: auto;
  left: 0px;
  bottom: 0;
  padding: 0mm 8px;
  background-color: rgba(255,255,255,.75);
  display: inline;
  position: fixed;
  z-index: 3;
}

#mapframe {
  position: fixed;
  width: 100%;
  height: calc( var(--window-height)  - var(--header-height) );
}

#previewloading {
  height: calc( 100vh - var( --preview-offset-top ) );
}

#directlink .opt, #zoomflip .opt {
  display: none;
}

@media screen and (min-width:24em) {
  #directlink .opt { display: inline; }
}

.childrenlist, .childrenlist * {
  box-sizing: border-box;
}

.childrenlist {
  padding-right: 1mm;
}



#ui-topheader #ui-back, #ui-topheader #ui-menubtn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

#ui-topheader #ui-back {
  left: 1mm;
}
#ui-topheader #ui-menubtn {
  right: 1mm;
}


input[type=button] {
  -webkit-appearance: none;
}

.filetable-item audio {
  width: 100%;
  border-radius: 1ex;
}


.intranet-link {
  position: relative;
}
.intranet-link:hover::before,
.intranet-link:active::before {
  content: 'Intranet link, may be unreachable from a mobile device.';
  display: block;
  background-color: rgba(0,0,0,.67);
  color: white;
  padding: 5px;
  border-radius: 5px;
  line-height: 1;
  font-size: 90%;
  position: absolute;
  width: 10em;
  top: calc( -3em - 12px );
  right: 0;
}
.intranet-link::after {
  content: ' (intranet)';
  color: red;
  font-style: italic;
  position: relative;
  display: inline;
  background: none;
  margin-top: 0;
  width: auto;
  height: auto;
}
.worse-content .attachment--file.attachment--mp4 {
  width: 100%;
  border: none;
  background-image: none;
  padding: 0;
}

.worse-content .attachment--file.attachment--mp4 video {
  border: 1px solid #ccc;
}

figure img {
  border-radius: 5px;
}

a[data-embed-provider] img, .ytframe  {
  border: 1px solid #ccc;
  border-radius: 10px;
}


figure a[href^="https://youtu.be/"],
figure a[href^="https://www.ted.com/"],
figure a[href^="https://vimeo.com/"],
a[data-embed-provider] {
  position: relative;
  display: inline-block;
  
}

figure a[href^="https://youtu.be/"]::before,
figure a[href^="https://www.ted.com/"]::before,
figure a[href^="https://vimeo.com/"]::before,
a[data-embed-provider]::before {
  content: "▷";
  display: block;
  position: absolute;
  line-height: 1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 6em;
  color: white;
  text-shadow: 2px 2px 8px #000;
}

a[data-embed-provider$="Calendar"]::before {
  content: "";
}

a[data-embed-provider]::after {
  content: attr(data-embed-provider);
  display: block;
  position: absolute;
  line-height: 1;
  top: 14px;
  right: 8px;
  color: white;
  background-color: rgba(0,0,0,.5);
  padding: 5px;
  border-radius: 5px;
  text-shadow: none;
}

a[data-embed-provider$="Calendar"]::after {
  content: "Tap to load " attr(data-embed-provider);
}

iframe.ytframe, iframe.ytframe + a.closevideo {
  display: block;
  max-width: 100%;
  margin: 0 auto 6mm auto;
}
a.closevideo + a { display: none; }

.closevideo ~ figcaption {
  display: none !important;
}

iframe.ytframe + a.add-ical + a.closevideo + a {display: none !important; }
iframe.ytframe + a.add-ical + a.closevideo + figure {display: none !important; }

html.mockup.touching * {
  cursor: url("images/cursor-down.svg") 20 20, pointer !important;
}

html.mockup * {
  cursor: url("images/cursor.svg") 20 20, pointer !important;
}

::-webkit-scrollbar {
  width: 0;
  background: transparent;
}



ul.drt-podcast {
  border: 2px solid #ccc;
  margin: 0 8px !important;
  padding: 5px 0;
  border-radius: 5px;
}
ul.drt-podcast audio {
  border-radius: 4px;
  width: 100%;
}
ul.drt-podcast li {
  list-style-type: none;
  padding: 2mm !important;
  margin:0;
  border-bottom: 1px solid #ccc;
  cursor: pointer;
}

ul.drt-podcast h5 {
  margin:0;
  font-weight: normal;
}

ul.drt-podcast div.description {
  display: none;
}
ul.drt-podcast li.playing div.description {
  display: block;
}
ul.drt-podcast li.playing {
  background-color: #fed;
}

ul.drt-podcast li.playing h5 {
  font-weight: bold;
}


ul.drt-podcast li[data-role="list-divider"] {
  background-color: #eee;
  font-weight: bold;
}
ul.drt-podcast li[data-role="list-divider"] small {
  font-weight: normal;
}
ul.drt-podcast li:first-child {
  border-top: 1px solid #ccc;
}
ul.drt-podcast audio.loading + .description::before {
  content: 'Loading audio...';
  display: block;
  text-align: center;
  color: #f40;
}

/* Bookmarks */
article[data-id] > #user-bookmarks + h1,
article[data-id] > h1:first-child {
  position: relative;
  cursor: pointer;
}

article[data-id] > #user-bookmarks + h1::after,
article[data-id] > h1:first-child::after {
/*   content: "☆"; */
/*   color: #aaa; */
  position: absolute;
  right: 5px;
  top:50%;
  transform: translateY(-50%);
  font-weight: bold;
  font-size: 133%;
  line-height: 1;
  content: "⭐";
  filter: saturate(0) opacity(1);
}


article[data-id] > #user-bookmarks + h1::after {
  content:"🏠";
}

article[data-id].bookmarked > #user-bookmarks + h1::after,
article[data-id].bookmarked > h1:first-child::after {
  filter: saturate(1) opacity(1);
}

/* Search boxes */
div.ui-input-search {
  border-radius: 1em !important;
  border: none;
  box-shadow: none !important;
  margin: 3mm;
  background-color: #e8e8e8 !important;
}




ul.ref-contacts {
  list-style-type: none;
  margin: .3em 0;
  padding: 0;
  column-width: 20em;
}
ul.ref-contacts li {
  padding: 2mm 2mm;
  border-bottom: 1px solid #ddd;
  margin:0;
}

ul.ref-contacts li.cname {
  column-span: all;
  background-color: #eee;
  padding: 1mm 1mm 1mm calc(2mm + 24px + 0.5em);
  background-repeat: no-repeat;
  background-position: 2mm 50%;
  background-size: 24px;
  display: block !important;
/*   width: 100%; */
  line-height: 1.67;
}

ul.ref-contacts li.cname {
  border-radius: 8px 8px 0 0;
}


span.onecontact {
  background-image: url(images/fontawesome-user-regular.svg);
  background-color: transparent;
  
  background-position: 1mm 50%;
  background-size: contain;
  padding-left: 6mm;
  background-repeat: no-repeat;
}

ul.ref-contacts a.email,  ul.ref-contacts a.url {
  color: #005eb8 !important;
}


ul.ref-contacts li.cname {
  background-image: url(images/fontawesome-user-friends-solid.svg);
}


.tip.nolandscape {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

#prevpage2, #nextpage2 {
  position: fixed;
  top: 50%;
  transform: translateY(-50%) scale(1.5);
  opacity: .5;
}

#rotateright {
  position: absolute;
  top: 20px;
  right: 10px;
  transform: translateY(-50%) scale(1.5);
  opacity: .5;
}

#nextpage2::after {
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22enable-background%3Anew%200%200%2014%2014%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20style%3D%22fill%3A%23000000%3B%22%20points%3D%223.404%2C2.051%208.354%2C7%203.404%2C11.95%205.525%2C14.07%2012.596%2C7%205.525%2C-0.071%20%22%2F%3E%3C%2Fsvg%3E");
  background-color: yellow !important;
}
#prevpage2::after {
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22enable-background%3Anew%200%200%2014%2014%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20style%3D%22fill%3A%23000000%3B%22%20points%3D%2210.596%2C11.949%205.646%2C7%2010.596%2C2.05%208.475%2C-0.071%201.404%2C7%208.475%2C14.07%20%22%2F%3E%3C%2Fsvg%3E");
  background-color: yellow !important;
}

#prevpage2 {
  left: 10px;
}

#nextpage2 {
  right: 10px;
}

#pageXofY, #pageselect {
  position: fixed;
  bottom: 8px;
  left: 8px;
  color: var(--theme-color);
}
#pageXofY {
  display: none;
}
#directlink2 {
  position: fixed;
  bottom: 8px;
  right: 8px;
}

#canvasPDF, #pdfnew .page {
  border: 1px solid #999;
  box-shadow: 10px 10px 20px #999;
}

.fbc-badge {
  display: none !important;
}


#ui-settings .tbx-msg {
  display: none;
}

#ui-settings[data-status="restricted"] .tbx-restricted,
#ui-settings[data-status="closed"] .tbx-closed,
#ui-settings[data-status="planned"] .tbx-planned
{
  display: block;
}

#ui-settings[data-status="closed"] .ui-li-create, 
#ui-settings[data-status="closed"] .ui-li-join,
#ui-settings[data-status="planned"] .ui-li-create, 
#ui-settings[data-status="planned"] .ui-li-join {
  display: none;  
}


div.cover {
  text-align: center;
}

.ui-content {
  max-width: 56em;
  margin: 0 auto;
}
iframe.ytframe {
  width: 54em;
  max-width: 96vw;
  height: calc( 54em / 16 * 9 );
  max-height: calc(96vh - 120px); /* header and footer */
}

iframe.ytframe[src^="https://www.canva.com"] {
  height: calc(96vh - 120px);
  max-height: calc( 100vw * 1.4142 );
}

iframe.ytframe[src^="https://open.spotify.com/embed"] {
  max-height: 234px;
  border: none;
}

#ui-preview .ui-content {
  max-width: 100%;
}

img.domaincovers {
  display: block;
  margin: 0 auto;
}



@media (min-width: 60em) {
  #ui-menu {
    visibility: visible;
    position: relative;
    left: 0;
    clip: initial;
    float: left;
    width: 16em;
/*     background: none; */
    -webkit-transition: none !important;
    -moz-transition: none !important;
    transition: none !important;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    transform: none !important;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  #ui-topheader, .ui-panel-wrapper {
      width: calc(100% - 16em);
      margin-left: 16em;
  }
  .ui-mobile body {
    height: auto;
  }
  #ui-menubtn {
    display: none;
  }
  #prevpage2, #pageselect {
    left: calc(10px + 16em);
  }
  
  .ui-page {
    background: linear-gradient(to right, var(--theme-color) 16em, #f9f9f9 16em 100%);
  }

  iframe.ytframe {
    width: 54em;
    max-width: calc(96vw - 16em);
    height: calc( 54em / 16 * 9 );
    max-height: calc( 96vw / 16 * 9 - 16em  / 16 * 9 );
  }
}





.synclistwrap  {
  margin-top: 4mm;
}
.synclistwrap .syncshow {
  margin-left: 2mm;
}

@media (max-width: 23em) {
  .synclistwrap .syncshow {
    display: block;
  }
}

.synclistwrap label {
  white-space: nowrap;
  margin-right: 0.5em;
}


ul.synclist {
  margin: 2mm !important;
}

ul.synclist span.keywords {
  display: none;
}

ul.synclist li[data-updated]:after {
  content: attr(data-updated);
  margin-left: .4em;
  font-weight: normal;
}

ul.synclist li s {
  display:none;
}

ul.synclist li a  {
  padding-top: 2mm;
  padding-bottom: 2mm;
  padding-left: 2mm;
}

ul.synclist li .xnote {
  display: block;
  margin-left: 1em;
  color: black;
  font-style: italic;
  font-size: 90%;
}
ul.synclist li div.gp {
  font-weight: normal;
}

ul.synclist li div.gp:after {
  content: '/';
}

ul.synclist li a:before {
  content: "● ";
}

ul.synclist.nobullet li a:before {
  display: none !important;
}

ul.synclist.ui-listview > .ui-li-static {
  padding: 0.1em 0.4em;
}

@media (min-width: 36em) {
  ul.synclist li a:before {
    content: attr(data-mtime);
    float: right;
    font-size: 90%;
  }
}

.llchk_expired + label,
.synclistwrap .chk_expired + label,
ul.synclist li.expired a:before {
  color: #a00;
}

.llchk_due + label,
.synclistwrap .chk_due + label,
ul.synclist li.due a:before {
  color: #f60;
}

.llchk_valid + label,
.synclistwrap .chk_valid + label,
ul.synclist li.valid a:before {
  color: green;
}

.llform label,
.synclistwrap label {
  display: inline;
}

.llform ul {
  list-style-type: none;
  padding-left: 0;
}

.synclistwrap .chk_unknown:not(:checked) ~ ul.synclist li.unknown,
.synclistwrap .chk_expired:not(:checked) ~ ul.synclist li.expired,
.synclistwrap .chk_due:not(:checked) ~ ul.synclist li.due,
.synclistwrap .chk_valid:not(:checked) ~ ul.synclist li.valid { 
  display: none; 
}

ul.synclist li.ui-li-divider {
  padding: 2mm 1mm 2mm 2mm !important;
}



#abs_edit_or_comment {
  position: fixed;
  right: 2mm;
  bottom: 80px;
  z-index: 1000;
  font-size: 7mm;
  display: inline-block;
  max-width: 1cm;
  text-align: center;
  border-radius: 2mm;
  border: 1px solid #ccc;
  box-shadow: 2px 2px 2px rgba(0,0,0,.5);
  opacity: 0.6;
  background-color: #eee;
}


#commentform {
  z-index: 1010;
  max-width: 90vw;
  max-height: 100vh;
  position: fixed;
  bottom: 8mm;
  right: 2mm;
  box-shadow: 1mm 1mm 5mm rgba(0,0,0,.5);
  border-radius: 2mm;
  padding: 2mm;
  background-color: white;
  text-align: center;
}


#commentform, #commentform * {
  box-sizing: border-box;
}

#commentform textarea {
  display: block;
  max-width: 100%;
  padding: 1mm;
  border-radius: 1mm;
  border: 1px solid #ddd;
  font-family: inherit;
  border: 1px solid #aaa;
  height: 6.5em;
  width: 18em;
}

#commentform[data-state="hidden"] {
  display: none;
}
#commentform > * {
  display: none;
}

#commentform[data-state="sending"] > div[data-state="sending"],
#commentform[data-state="sent"] > div[data-state="sent"],
#commentform[data-state="editing"] > div[data-state="editing"] {
  display: block;
}



.flex-around {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

.my-buttons {
  line-height: 2.5em;
}

.my-buttons a {
  font-weight: bold;
  color: var( --theme-color );
}

div.ui-page-active ~ #abs_edit_or_comment {
  display: none;
}

div.ui-page-active[id^="ui-"] ~ #ui-footer {
  display: none;
}

#commentform:not([data-state="hidden"]) + #abs_edit_or_comment {
  display: none;
}


#abs_pending_attachments {
  position: absolute;
  right: 2mm;
  top: 100px;
  z-index: 1000;
  display: inline-block;
  text-align: center;
  border: 1px solid #ccc;
/*   box-shadow: 2px 2px 2px rgba(0,0,0,.5); */
  opacity: 0.6;
  background-color: #eee;
  
  border-radius: 1mm;
  padding: 0 1.5mm;
  font-size: .9em;
  cursor: pointer;
}


#abs_pending_attachments[data-count="0"] {
  display: none;
}

span.pageattachcount,
span.attachcount {
  float: right;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 1mm;
  padding: 0 1.5mm;
  font-size: .9em;
  cursor: pointer;
  font-style: normal;
  text-align: center;
}
span.pageattachcount {
  margin: 1mm;
  line-height: 1.3;
}


#abs_pending_attachments:before, span.attachcount:before, span.pageattachcount:before {
  content: attr(data-count) "↓";
  font-weight: bold;
}


article[data-id$=".HomePage"] span.pageattachcount:before {
  content: attr(data-count);
}


article[data-id$=".HomePage"] span.pageattachcount:after {
  content: "files";
  font-weight: bold;
  display:block;
  text-align: center;
}


span.attachcount[data-count="0"] {
  border: none;
}

span.pageattachcount[data-count="0"],
span.attachcount[data-count="-1"] {
  display: none;
}

span.attachcount[data-count="0"]:before {
  content: "";
}

body[data-downloading] #abs_pending_attachments, 
body[data-downloading] span.pageattachcount, 
body[data-downloading] span.attachcount {
  display: none;
}


.annotationLayer .linkAnnotation,
.annotationLayer .buttonWidgetAnnotation.pushButton {
/*   z-index: 1002; */
/*   background-color: rgba(255,255,0,0.6); */
}

img[src$="images/ld.gif"][data-fname] {
  width: 36px !important;
  height: 36px !important;
  margin: 1cm;
}


.trix-content img {
  display: block;
  margin: 1mm auto;
}


a[data-embed-provider="OpenStreetMap"]::after {
  content: "Tap to load OpenStreetMap";
}

a[data-embed-provider="OpenStreetMap"]::before {
  content: "";
}
#ui-preview, #ui-preview .ui-content {
  margin-bottom: 0px !important;
  padding-bottom: 0px !important;
}

figure.attachment--preview figcaption {
/*   opacity: 0.6; */
}
figure.attachment--preview figcaption.attachment__caption--edited {
  display: block;
}
figure.attachment--preview a {
  color: inherit !important;
  font-size: inherit;
}


.worse-content figure.attachment--preview figcaption:not(.attachment__caption--edited) {
  display: none;
}

.attachment__caption.attachment__caption--edited {
  padding-bottom: 1em;
}

.worse-content figure[data-trix-content-type="video/mp4"] {
  border: none;
  padding: 0;
  display: block;
  margin: 2mm auto;
}



/**
  EventCalendar: 
  Written by (c) Petko Yotov 2021   www.pmwiki.org/Petko

  This text is written for PmWiki; you can redistribute it and/or modify
  it under the terms of the GNU General Public License as published
  by the Free Software Foundation; either version 3 of the License, or
  (at your option) any later version. See pmwiki.php for full details
  and lack of warranty.
*/

#ecaldate {

}
#ecaldate:focus {
/*   border: none; */
}
#weekday {
  font-weight: bold;
}

aside.eventcal {
  box-sizing: border-box;
  border: 2px dotted var(--theme-color);
  padding: 4px 8px;
  border-width: 2px 0;
}

.ecalmonth {
  border-collapse: separate;
/*   border-radius: 8px; */
  border-spacing: 0;
  margin: 0 auto;
}
  

.ecalmonth tbody tr:last-child > td:first-child {
  border-radius: 0 0 0 7px;
}

.ecalmonth tbody tr:last-child > td:last-child {
  border-radius: 0 0 7px 0;
}

.ecalmonth .prevnext {
  cursor: pointer;
  color: var(--theme-color);
}





.ecalmonth thead td {
  font-size: 90%;
}


.ecalmonth th {
  background-color: #eee;
}

.ecalmonth thead th, .ecalmonth td {
  border-color: #ccc;
}

.ecalmonth thead th {
  border-style: solid;
  border-width: 1px 0 1px 0;
}


.ecalmonth td {
  width: 3em;
  text-align: center;
  border-style: solid;
  border-width: 0 0 1px 1px;
}


.ecalmonth tr > th:last-child,
.ecalmonth tr > td:last-child {
  border-right-width: 1px;
}


.ecalmonth tr > th:first-child {
  border-left-width: 1px;
}

.ecalmonth td.today {
  background-color: var(--theme-color-light);
}


.ecalmonth td.past {
  color: #888;
}

.eventcal a, .eventcal time  {
  color: var(--theme-color);
}
.ecalmonth td a {
  display: block;
}

.ecalmonth td.past a {
  color: inherit;
}

.ecalmonth {
  --active-color: var(--theme-color);
}

.ecalmonth td.past {
  --active-color: #888;
}

.ecalmonth td.single {
  background-image: linear-gradient(135deg, var(--active-color) 5px, transparent 1px);
  background-repeat: no-repeat;
}
.ecalmonth td.multiple {
  background-image: linear-gradient(135deg, var(--active-color) 4px, transparent 2px, var(--active-color) 2px, transparent 2px);
  background-repeat: no-repeat;
}

.ecalmonth td.multiple {
  background-image: linear-gradient(135deg, var(--active-color) 5px, transparent 5px 7px, var(--active-color) 8px 8px, transparent 9px);
  background-repeat: no-repeat;
}

.ecalwrap td.m1, .ecalwrap td.m2 {
  vertical-align: top;
}

.eventcal ul.days {
  padding: 0;
  list-style-type: none;
}

.eventcal ul.days > li:target {
  opacity: 1;
}

.eventcal ul.days > li:target h5, 
.eventcal ul.days > li:target ul {
  background-color: #ffa;
}
ul.days .eventdescription {
  display: block;
}

ul.days li.past {
  opacity: .7;
}

ul.days li.today h5 {
  color: red;
}

.wikieditevent #deleteevent {
  float: right;
  background-color: red;
  font-weight: bold;
  border-radius: 3em;
}

.wikieditevent .pastdate {
  display: none;
  color: #f40;
  font-style: italic;
}

.catname {
  display: inline-block;
  background-color: #ddd;
  padding: 2px 4px;
  line-height: 1;
  border-radius: 4px;
  font-size: 90%;
}

.eventtitle {
  color: black;
  font-size: 105%;
}

.usedcategories .catname {
  cursor: pointer;
  user-select: none;
}

.usedcategories .catname.hidden {
  background-color: transparent;
  color: #888;
}

.endrepeating {
  display: none;
}

li.dayheader h5 { font-size: 1rem; margin: 1rem 0 0 0; padding-bottom: .25rem; }
li.dayheader h5 a { font-weight: normal; font-size: 1rem; }

/* click on dates, scroll below header */
li.dayheader { position: relative; }
li.dayheader a.anchor { 
  position: absolute;
  top: calc(-10px - var(--header-height));
}

li.dayheader a.anchor:target + h5 {
  background-color: #ff9;
}

li.dayheader[data-categories="9999"] {
  display: none;
}

th.monthname span.prevnext {
  display: inline-block;
  width: 1.5em;
  text-align: center;
}
.wikieditevent #newcategory {
  display: none;
}

.eventcal .controls {
  text-align: center;
}

div.img.imgonly {
  text-align: center;
}

#ui-login[data-openaccess="1"] .loginfield {
  display: none;
}

.frame { 
  border:1px solid #cccccc; padding:4px; background-color:#f9f9f9; 
  padding: 5px 10px; 
  border-radius: 5px;
}
frame:empty {display: none; }




.attachment.attachment--content[data-trix-attachment*="wform"] {
  width: calc(100% - 1em);
  border: 2px dotted var(--theme-color);
  padding: 6px;
}

input[data-jets]:blank + a.ui-input-clear {
  display: none;
}




.worsecustomform .inputbox, .worsecustomform .inputbutton, .worsecustomform textarea, .worsecustomform select {
  line-height: 1.7em;
  padding: 6px 10px;
  font-family: inherit;
}

.worsecustomform p {
  min-height: 1em;
}



.worsecustomform span.status {
  display: block;
  cursor: pointer;
  font-weight: bold;
}
.worsecustomform.sending span.status:before {
  content: "Sending form, please wait...";
  color: orange;
}

.worsecustomform.sent span.status:before {
  content: "Form sent successfully. (Click to close.)";
  color: green;
}

.worsecustomform.error span.status:before {
  content: "Form could not be sent, please contact support. (Click to close.)";
  color: red;
}
.worsecustomform.invalid span.status:before {
  content: "(*) Empty or unchecked required field(s)";
  color: red;
}

.worsecustomform .req {
  color: red;
}
.worsecustomform p {
  transition: all 1s ease;
  margin-bottom: 3mm;
}
.worsecustomform .hlreq {
  background-color: #faa;
}


.worsecustomform label {
  cursor: pointer;
}

.worsecustomform input:disabled {
  opacity: .3;
}

.worsecustomform input[type="range"] {
  vertical-align: middle;
  margin-right: 1em;
}

.worsecustomform input[type="range"] + span {
  font-weight: bold;
  vertical-align: middle;
  display: inline-block;
}

html .ui-panel-page-container-b {
  background-color: #fff !important;
}


#yscroll {
  position: fixed;
  top: 0;
  left: 45%;
  z-index: 3000;
  color: white;
  text-shadow: none;
  background-color: rgba(0, 0, 0, .5);
  padding: 0 5px;
}

[data-role="page"]:before {
  position: absolute;
  top: 0em;
  width: 100%;
  line-height: 1;
  font-size: 1em;
  display: block;
  text-align: center;
  content:"\2193 \00A0 Pull down to refresh \00A0 \2193";
  white-space:pre;
  font-weight: bold;
  color: var(--theme-color);
  text-shadow: none;
}

.flipdetailswrap {
  text-align: right;
  padding-right: 2mm;
}

.flipdetails {
  user-select: none;
  display: inline-block;
  z-index: 2;
  position: relative;
  border: 1px solid var(--theme-color);
  padding: 0 0 0 4px;
  border-radius: 3px;
  background: white;
  margin: 19px 0 0 0;
  font-size: 90%;
}
.flipdetails::before {
  content: "Open: ";
}

.flipdetails span {
  color: var(--theme-color);
  display: inline-block;
  padding: 2px 4px;
  font-weight: bold;
  cursor: pointer;
}

.flipdetails span.open {
  color: #fff;
  background-color: var(--theme-color);
}

.flipdetails span::before {
  content: attr(data-for);
}

a.bold {
  font-weight: bold;
}



#showpass {
  float: right;
  cursor: pointer;
  color: var(--theme-color);
}
#showpass:after {
  content: "show";
}

#showpass.shown:after {
  content: "hide";
}


.frame .frame {
  background-color: white;
}

#ui-footer .shortcutlink.logoutlink {
  background-color: #fdd;
}

@media print {
  
  #ui-footer .shortcutlink.logoutlink {
    display: none;
  }

}




#modialog h5,
#modalert h5 {
  margin: 0;
  padding: .1rem .2rem;
  background-color: #eee;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 1rem;
}


.csum {
  color: #777;
  font-size: .9em;
  word-wrap: break-word;
}


.right {
  text-align: right;
}
.left {
  text-align: left;
}



select, textarea, input {
  font-size: 1.1rem; /*16px? disable zoom-in on some phones*/
}

.inputbox, textarea {
  background-color: var(--inputbox-bgcolor);
  color: var(--inputbox-color);
}
.inputbutton, select {
  background-color: var(--inputbutton-bgcolor);
  color: var(--text-color);
}
.inputbox::placeholder, textarea::placeholder {
  color: #888;
}

.inputbox, .inputbutton, textarea, select {
  border-width: 1px;
  border-radius: 3px;
  /* line-height: 1.7em; */
  padding: .4rem .667rem;
  max-width: 100%;
}
.inputbutton:hover {
/*   background-color: buttonface; */
}
.inputbox:focus, textarea:focus {
  border-color: var(--link-color);
}
summary, .inputbutton { cursor: pointer; }
details.commentform {
  margin-top: 1em;
}

var.notes {
  color: var(--ppp);
}

.pointer {
  cursor: pointer;
}

.link-color {
  color: var(--link-color);
}

ul.synclist li {
  border-bottom: 1px solid var(--ddd);
  padding: 1mm;
}

.uhpcontactform input.inputbutton {
  margin-left: .3em;
}


/* https://khanhicetea.com/til/2018-11-01-bug-input-lost-focus-after-typing-1-character-in-safari-browser/ */
input[type="search"], input[type="search"]:before, input[type="search"]:after {
	-webkit-user-select: text !important;
	-moz-user-select: text !important;
	-ms-user-select: text !important;
	user-select: text !important;
  line-height:24px;
  font-family: sans-serif;
/*   display:block; */
} 

form.filtercontrols {
  display: flex;
  justify-content: space-around;
}

form.filtercontrols .inputbutton {
  width: 4.5em;
}

form.filtercontrols .inputbox {
  width: calc( 100% - 10em );
}

.pmcontactbloc form.filtercontrols .inputbox {
  width: calc( 100% - 5em );
}


.llform .inputbox:not(:placeholder-shown) {
  background-color: var(--highlight);
}


a.llsitesearch {
  display: none;
}

.llform {
  scroll-margin-top: var(--header-height);
}


ul.synclist li.highlighted {
  background-color: var(--highlight);
}

article[data-id]:has(.autoupdated)  .revtext,
article[data-id$=".HomePage"] .revtext {
  display:none;
}


details:not([open]) summary h2::after, details:not([open]) summary h3::after {
  content: ' ...See more';
  font-size:.83rem;
  font-weight: bold;
}

.trix-content img {
  max-width: 100%;
  max-height: 60vh;
  height: auto;
  width: auto;
}

.noapp {
  display: none;
}