/* general */

br
{ line-height: 12px;
}

*
{ margin: 0px;
  padding: 0px;
  font-family: 'Calibri';
  font-variant-ligatures: no-common-ligatures;
  box-sizing: border-box;
/* text-decoration-skip-ink: none; */
}

body
{ font-size: 17px;
  line-height: 22px;
  color: #222;
}

/* summernote */

.showpara p
{ border: 1px dotted red;
}

button.note-btn
{ height: 32px;
  min-width: 32px;
  padding: 5px;
}

i.list::before
{ /* content: url("icons/list.svg"); */
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="13px" height="13px" viewBox="-58.697 -58.697 130.394 130.394"><path d="M-49.78-56.104v34.048h3.525c1.422-9.277,4.824-16.421,10.205-21.431c3.834-3.586,9.987-5.381,18.461-5.381h9.092v97.042 c0,6.309-0.34,10.205-1.02,11.689c-0.928,2.104-2.196,3.588-3.805,4.453c-2.227,1.299-5.164,1.947-8.813,1.947h-4.176v3.434h65.87 v-3.434h-4.174c-3.588,0-6.418-0.603-8.49-1.809s-3.465-2.612-4.174-4.221c-0.713-1.607-1.066-5.628-1.066-12.061v-97.042h9.369 c5.875,0,9.988,0.557,12.34,1.67c4.205,2.041,7.514,4.778,9.926,8.21s4.607,9.077,6.588,16.931h3.34v-34.048H-49.78z"/></svg>');
  position: relative;
  top: 2.5px;
}

i.image::before
{ /* content: url("icons/image.svg"); */
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 1024 1024"><path d="M1068.340,975.691 L-26.281,975.691 C-61.627,975.691 -90.281,947.037 -90.281,911.691 L-90.281,113.254 C-90.281,77.908 -61.627,49.254 -26.281,49.254 L1068.340,49.254 C1103.686,49.254 1132.340,77.908 1132.340,113.254 L1132.340,911.691 C1132.340,947.037 1103.686,975.691 1068.340,975.691 ZM1060.475,192.281 C1060.475,113.556 996.043,121.007 916.561,121.007 L125.033,121.007 C45.551,121.007 -18.881,113.556 -18.881,192.281 L-18.881,762.448 C-18.881,841.172 45.551,904.991 125.033,904.991 L916.561,904.991 C996.043,904.991 1060.475,841.172 1060.475,762.448 L1060.475,192.281 ZM820.368,440.468 C767.439,440.468 724.487,400.954 724.487,352.025 C724.487,303.139 767.439,263.554 820.368,263.554 C873.322,263.554 916.222,303.139 916.222,352.025 C916.222,400.954 873.322,440.468 820.368,440.468 ZM873.397,780.358 C918.029,846.441 885.494,832.253 801.185,832.253 L225.930,832.253 C141.522,832.253 101.661,842.771 137.427,772.270 L276.114,497.962 C311.786,427.437 379.266,422.747 426.053,487.463 L562.711,676.687 L600.888,601.377 C636.612,530.876 702.365,527.233 747.024,593.289 L873.397,780.358 Z" class="cls-1"/></svg>');
  position: relative;
  top: 3px;
}

i.save::before
{ /* content: url("icons/save.svg"); */
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="20px" height="20px"><path d="M27.71,9.29l-5-5A1,1,0,0,0,22,4H6A2,2,0,0,0,4,6V26a2,2,0,0,0,2,2H26a2,2,0,0,0,2-2V10A1,1,0,0,0,27.71,9.29ZM12,6h8v4H12Zm8,20H12V18h8Zm2,0V18a2,2,0,0,0-2-2H12a2,2,0,0,0-2,2v8H6V6h4v4a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V6.41l4,4V26Z"/></svg>');
  position: relative;
}

i.heading::before
{ /* content: url("icons/heading.svg"); */
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="13px" height="13px" viewBox="0 0 122.88 120.26"><g><polygon points="0,14.54 0,0 49.81,0 49.81,14.54 36.93,17.03 36.93,51.7 85.98,51.7 85.98,17.03 73.1,14.54 73.1,0 85.98,0 110,0 122.88,0 122.88,14.54 110,17.03 110,103.31 122.88,105.79 122.88,120.26 73.1,120.26 73.1,105.79 85.98,103.31 85.98,70.3 36.93,70.3 36.93,103.31 49.81,105.79 49.81,120.26 0,120.26 0,105.79 12.8,103.31 12.8,17.03 0,14.54"/></g></svg>');
  position: relative;
}

i.fill::before
{ /* content: url("icons/fill.svg"); */
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20px" height="20px" viewBox="0 0 24 24"><path d="M20 14c-.092.064-2 2.083-2 3.5 0 1.494.949 2.448 2 2.5.906.044 2-.891 2-2.5 0-1.5-1.908-3.436-2-3.5zM9.586 20c.378.378.88.586 1.414.586s1.036-.208 1.414-.586l7-7-.707-.707L11 4.586 8.707 2.293 7.293 3.707 9.586 6 4 11.586c-.378.378-.586.88-.586 1.414s.208 1.036.586 1.414L9.586 20zM11 7.414 16.586 13H5.414L11 7.414z"/></svg>');*/
  position: relative;
}

i.show::before
{ /* content: url("icons/show.svg"); */
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18px" height="18px" viewBox="0 0 24 24" fill="none"><path d="M1 12C1 12 5 4 12 4C19 4 23 12 23 12" stroke="black" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><path d="M1 12C1 12 5 20 12 20C19 20 23 12 23 12" stroke="black" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><circle cx="12" cy="12" r="3" stroke="black" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  position: relative;
}

table.thumb
{ margin: 5px 0px;
  white-space: nowrap;
}

.thumb td
{ margin: 5px;
}

img.thumb1
{ max-width: 100px;
  max-height: 100px;
}

img.thumb2
{ max-width: 50px;
  max-height: 50px;
}

/* specials */

.top td
{ vertical-align: top;
}

.two td
{ width: 50%;
}

.wrap
{ overflow-wrap: anywhere;
}

/* tables */

table
{ background-color: inherit;
}

td
{ padding: 1px 5px;
}

td:first-child
{ padding-left: 0px;
}

td:last-child
{ padding-right: 0px;
}

table.rand
{ border-collapse: collapse;
}

.rand td
{ border: 1px solid #222 !important;
}

.rand td:first-child
{ padding-left: 5px;
}

.rand td:last-child
{ padding-right: 5px;
}

/* images */

img
{ border-radius: 4px;
  width: auto;
  max-width: 100%;
}

.note-float-right
{ float: right;
}

.note-float-left
{ float: left;
}

/* forms */

input, textarea
{ background-color: #f0eee5;
  border-radius: 6px;
  font-size: 17px;
  padding: 0px 10px;
  border: 1px solid #999;
}

input
{ height: 35px;
}

.form input, .form textarea
{ width: 100%;
}

button
{ background-color: #eee;
  padding: 5px 15px;
  border-radius: 10px;
  white-space: nowrap;
  font-size: 17px;
  line-height: 22px;
}

.error
{ color: red;
  font-weight: bold;
}

.ok
{ color: #009353;
  font-weight: bold;
}

/* layout */

body
{ margin: 0 auto;
  background: url("background.gif");
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  max-width: 800px;
}

.header
{ background-color: #009353;
  border-radius: 8px 8px 0px 0px;
  padding: 8px;
}

.content
{ flex: 1;
  padding: 20px 30px;
  background-color: white;
}

.footer
{ background-color: #009353;
  padding: 20px 30px;
  border-radius: 0px 0px 8px 8px;
  line-height: 18px;
  color: #fff;
}

/* elements */

div.kleur
{ background-color: #f0eee5;
  border-radius: 4px;
  margin: 0px -10px;
  padding: 10px;
}

h1
{ font-size: 22px;
  font-weight: bold;
  margin: 0px 0px 20px 0px;
  text-decoration: underline;
}

strong, b
{ font-weight: bold;
}

em, i
{ font-style: italic;
}

/* lists */

ol
{ padding: 0px 0px 0px 28px;
}

ol li
{ padding: 0px 0px 0px 5px;
}

ul
{ padding: 0px 0px 0px 18px;
}

ul li
{ padding: 0px 0px 0px 2px;
}

a
{ color: blue;
  text-decoration: underline;
}

/* menu */

@font-face
{ font-family: menu;
  src: url("red-hat-display-medium.woff2");
}

.menu
{ width: fit-content;
  margin: 0px auto;
  padding: 10px 8px;
  background-color: #f0eee5;
  border-radius: 20px;
}

.menu img
{ float:left;
  margin: 23px 10px 18px 10px;
}

.menu button
{ background-color: #009353;
  font-family: menu;
  border: none;
}

.menu button a
{ color: white;
}

.menu a, .menu li
{ font-family: menu;
}

.menu ul
{ display: inline;
  list-style: none;
  margin: 0px;
  padding: 0px;
}

.menu ul li
{ position: relative;
  margin: 10px 17px;
  padding: 0px;
  display: inline-block;
  white-space: nowrap;
}

.menu ul li ul
{ position: absolute;
  z-index: 999;
  background-color: #e0e0e0;
  border-radius: 15px;
  display: none;
/* margin-top 0 */
}

.menu ul li ul li
{ display: block;
  padding: 1px 5px;
}

.menu ul li:hover ul,
.menu ul li ul:hover
{ display: block;
}

.menu a
{ white-space: nowrap
  border-bottom: none;
  text-decoration: none;
  color: #222;
}

.menu a:hover, .menu .active a
{ border-bottom: solid 2px #009353;
}

.subpage-nav:after
{ /* content: url('icons/angle-down.svg'); */
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" width="14" height="14"><path d="M201.4 374.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 306.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"/></svg>');
  margin-left: 4px;
  position: relative;
  top: 2px;
}