/* fonts */
@font-face {
  font-family: IndieFlower;
  src: url('/fonts/IndieFlower-Regular.ttf');
}
@font-face {
  font-family: FredokaOne;
  src: url('/fonts/FredokaOne-Regular.ttf');
}
@font-face {
  font-family: Courgette;
  src: url('/fonts/Courgette-Regular.ttf');
}
@font-face {
  font-family: Capriola;
  src: url('/fonts/Capriola-Regular.ttf');
}
a, li.summary {
  color: inherit;
  cursor: pointer;
  text-decoration: none;
}
a:hover {
  color: inherit;
  text-decoration: none;
}
a.link {
  cursor: pointer;
  text-decoration: none;
}
a.link:hover, li.summary:hover {
  text-decoration: underline;
}
.button-disabled {
  display: inline-block;
}
.button, .button-inverted {
  cursor: pointer;
  display: inline-block;
}
.button:hover, .button-inverted:hover {
  text-decoration: underline; 
}
p {
  line-height: 1.5;
}
body {
  font-family: Capriola,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-y: scroll;
  color: #000000;
  background: transparent;
}
* {
  font-family: inherit;;
  font-size: inherit;
  margin: 0;
  padding: 0;
  cursor: inherit;
  color: inherit;
  text-decoration: inherit;
  font-weight: inherit;
  background: inherit;
  border: none;
  letter-spacing: inherit;
}
*:not(textarea):not(input):not(.sel) {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.footer {
  z-index: 30000;
}


.nooverflow {
  overflow: hidden !important;
}
/* effects */
.fill:not(:hover) {
  transition: background-color 0.4s ease-in-out 0s;
  -webkit-transition: background-color 0.4s ease-in-out 0s;
  -o-transition: background-color 0.4s ease-in-out 0s;
  -moz-transition: background-color 0.4s ease-in-out 0s;
}
.op-transition {
  transition: opacity 0.4s ease-in 0s;
  -webkit-transition: opacity 0.4s ease-in 0s;
  -o-transition: opacity 0.4s ease-in 0s;
  -moz-transition: opacity 0.4s ease-in 0s;
}
.glow4, .iglow4, .glow6, .iglow6 {
  transition: opacity 0.4s ease-in 0s;
  -webkit-transition: opacity 0.4s ease-in 0s;
  -o-transition: opacity 0.4s ease-in 0s;
  -moz-transition: opacity 0.4s ease-in 0s;
}
.glow4:hover, .iglow4 {
  filter: alpha(opacity=0.4);
  opacity: 0.4;
}
.glow6:hover, .iglow6 {
  filter: alpha(opacity=0.6);
  opacity: 0.6;
}
.iglow4:hover, .glow4, .iglow6:hover, .glow6 {
  filter: alpha(opacity=1);
  opacity: 1;
}
.bw:not(:hover) {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
.bw {
  background-color: transparent;
  transition: all 0.2s ease-in 0s;
  -webkit-transition: all 0.2s ease-in 0s;
  -o-transition: all 0.2s ease-in 0s;
  -moz-transition: all 0.2s ease-in 0s;
}
.op-4 {
  opacity: 0.4;
  filter: alpha(opacity=0.4);
}
.op-6 {
  opacity: 0.6;
  filter: alpha(opacity=0.6);
}
.spin2 {
  -webkit-animation:spin 2s linear infinite;
  -moz-animation:spin 2s linear infinite;
  -o-transition: spin 2s linear infinite;
  animation:spin 2s linear infinite;
}
.spin4 {
  -webkit-animation:spin 4s linear infinite;
  -moz-animation:spin 4s linear infinite;
  -o-transition: spin 4s linear infinite;
  animation:spin 4s linear infinite;
}

.blink {
  animation: blink normal 1.5s infinite ease-in-out;
  -webkit-animation: blink normal 1.5s infinite ease-in-out;
  -moz-animation: blink normal 1.5s infinite ease-in-out;
  -o-transition: blink normal 1.5s infinite ease-in-out;
}
.dragover {
  cursor: dragging;
}
@-moz-keyframes blink {0%{opacity:1;} 50%{opacity:0.5;} 100%{opacity:1;}}
@-webkit-keyframes blink {0%{opacity:1;} 50%{opacity:0.5;} 100%{opacity:1;}}
@-ms-keyframes blink {0%{opacity:1;} 50%{opacity:0.5;} 100%{opacity:1;}}
@keyframes blink {0%{opacity:1;} 50%{opacity:0.5;} 100%{opacity:1;}}
@-moz-keyframes spin {100%{-moz-transform:rotate(360deg);}}
@-webkit-keyframes spin {100%{-webkit-transform:rotate(360deg);}}
@keyframes spin {100%{-webkit-transform:rotate(360deg);transform:rotate(360deg);}}

.tip {
  font-size: 0.8em;
  font-style: oblique;
}
.text-capital::first-letter {
  text-transform: capitalize;
}

/* alignments */
.lh200 {
  line-height: 200%;
}
.text-ellipsis {
  text-overflow: ellipsis;
}
.icon {
  width: 1em;
  height: 1em;
}
.bigicon {
  width: 2em;
  height: 2em;
}
.nowrap {
  white-space: nowrap;
}
.caps {
  font-variant: small-caps;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
.text-left {
  text-align: left;
}
.text-justify {
  text-align: justify;
}
.text-uppercase {
  text-transform: uppercase;
}
.text-lowercase {
  text-transform: lowercase;
}
.text-italic {
  font-style: italic;
}
.text-ellipsis {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.text-small {
  font-size: 0.8em;
}
textarea.text-small {
  height: 5em;
}
textarea.text-large {
  height: 30em;
}
.text-underline {
  text-decoration: underline;
}
.weight-600 {
  font-weight: 600;
}
.weight-500 {
  font-weight: 500;
}

.align-top {
  vertical-align: top;
}
.align-middle {
  vertical-align: middle;
}
.align-bottom {
  vertical-align: bottom;
}
.align-middle-f {
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
.align-middle-f::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
.align-top-f {
  display: inline-block;
  vertical-align: top;
  height: 100%;
}
.align-top-f::before {
  content: "";
  display: inline-block;
  vertical-align: top;
  height: 100%;
}
.align-bottom-f {
  display: inline-block;
  vertical-align: bottom;
  height: 100%;
}
.align-bottom-f::before {
  content: "";
  display: inline-block;
  vertical-align: bottom;
  height: 100%;
}
.mhor-02em {
  margin: 0 0.2em;
}
.mhor-1em {
  margin: 0 1em;
}
.mhor-2px {
  margin: 0 2px;
}
.m-1em {
  margin: 1em;
}
.m-5px {
  margin: 5px;
}
.ml-5px {
  margin-left: 0px 5px;
}
.ml-05em {
  margin-left: 0.5em;
}
.ml-1em {
  margin-left: 1em;
}
.ml-2em {
  margin-left: 2em;
}
.ml-3em {
  margin-left: 3em;
}
.ml-4em {
  margin-left: 4em;
}
.mb-05px {
  margin-bottom: 0.5px;
}
.mb-05em {
  margin-bottom: 0.5em;
}
.mb-1em {
  margin-bottom: 1em;
}
.mb-2em {
  margin-bottom: 2em;
}
.mb-8em {
  margin-bottom: 8em;
}
.mb-50vh {
  margin-bottom: 50vh;
}
.mt-05em {
  margin-top: 0.5em;
}
.mt-1em {
  margin-top: 1em;
}
.mt-2em {
  margin-top: 2em;
}
.mb-5px {
  margin-bottom: 5px;
}
.mr-5px {
  margin-right: 5px;
}
.mr-05em {
  margin-right: 0.5em;
}
.mr-1em {
  margin-right: 1em;
}
.mr-m2em {
  margin-right: -2em;
}
.mt-m2em {
  margin-top: -2em;
}
.phor-2px {
  padding: 0 2px;
}
.phor-5px {
  padding: 0 5px;
}
.phor-1em {
  padding: 0 1em;
}
.phor-2em {
  padding: 0 2em;
}
.phor-3em {
  padding: 0 3em;
}
.phor-10px {
  padding: 0 10px;
}
.p-0 {
  padding: 0;
}
.p-1em {
  padding: 1em;
}
.p-5px {
  padding: 5px;
}
.p-10px {
  padding: 10px;
}
.p-5px-10px {
  padding: 5px 10px;
}
.pb-1em {
  padding-bottom: 1em;
}
.pb-2em {
  padding-bottom: 2em;
}
.pb-4em {
  padding-bottom: 4em;
}
.pb-5px {
  padding-bottom: 5px;
}
.pl-05rem {
  padding-left: 0.5rem;
}
.pl-05em {
  padding-left: 0.5em;
}
.pl-1em {
  padding-left: 1em;
}
.pl-2em {
  padding-left: 2em;
}
.pl-2px {
  padding-left: 2px;
}
.pl-5px {
  padding-left: 0px 5px;
}
.pt-5px {
  padding-top: 5px;
}
.pt-1em {
  padding-top: 1em;
}
.pt-2em {
  padding-top: 2em;
}
.pr-3px {
  padding-right: 3px;
}
.pr-5px {
  padding-right: 5px;
}
.pr-07em {
  padding-right: 0.7em;
}
.pr-1em {
  padding-right: 1em;
}
.r-05em {
  right: 0.5em;
}
.r-1em {
  right: 1em;
}
.r-05rem {
  right: 0.5rem;
}
.r-1rem {
  right: 1rem;
}
.t-0 {
  top: 0;
}
/* display */
.p-absolute {
  position: absolute;
}
.p-fixed {
  position: fixed;
}
.p-relative {
  position: relative;
}
.d-flex {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.d-inline-block {
  display: inline-block;
}
.d-block {
  display: block;
}
.d-none {
  display: none;
}
.d-t {
  display: table;
}
.d-tf {
  display: table;
  table-layout: fixed;
}
.d-tr {
  display: table-row;
}
.d-td {
  display: table-cell;
}
.h-100 {
  height: 100vh;
}
.w-100 {
  width: 100vw;
}
.w-100p {
  width: 100%;
}
div.layout-compact {
  margin-left: 5vw;
  width: 90vw;
}
div.layout-extended {
  margin-left: 20vw;
  width: 60vw;
}

/* */
h1 {
  font-size: 2em !important;
}
h2 {
  font-size: 1.5em !important;
}

/*SEARCH*/
fieldset.search {
  border-radius:0.25em;
  min-width: 10em;
}

fieldset.search  + fieldset.search{
  margin-left: 10px;
}

/* tags */
div.tag {
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
  min-height: 3em;
}
label.tag {
  border-radius:4em;
  padding: 0.5em 1em;
  min-width: 3em;
  text-align: center;
  border: thin solid #d5d5d5;
}
label.tag:hover > span:nth-child(1)::after {
  opacity: 0.7;
}
label.tag > span:nth-child(1)::after {
  transition: opacity 0.2s ease-in 0s;
  -webkit-transition: opacity 0.2s ease-in 0s;
  -o-transition: opacity 0.2s ease-in 0s;
  -moz-transition: opacity 0.2s ease-in 0s;
  content: '';
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  opacity: 0;
  background-color: #050505;
  border-radius:4em;
}
label.tag > div:nth-child(2) {
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  opacity: 0;
  text-align: center;
  z-index: 2000;
}
label.tag:hover > div:nth-child(2) {
  opacity: 1;
}
label.tag > div:nth-child(2) > div > i {
  transition: opacity 0.4s ease-in 0s;
  -webkit-transition: opacity 0.4s ease-in 0s;
  -o-transition: opacity 0.4s ease-in 0s;
  -moz-transition: opacity 0.4s ease-in 0s;
  border: thin solid #000000;
  padding: 0.3em 0.5em;
  border-radius: 50%;
  cursor: pointer;
  background-color: #ffffff;
}
label.tag > div:nth-child(2) > div > i:hover {
  opacity: 0.8;
}

/* box */
.box, .box::after, .box::before, .box *, .box *::after, .box *::before {
  box-sizing: border-box;
}
.br-025em {
  border-radius: 0.25em;
}
/* cursors */
.c-text {
  cursor: text;
}
.c-pointer {
  cursor: pointer;
}
.c-copy {
  cursor: copy;
}
#nav + div {
  margin-top: 3px;
}
*:focus {
  outline: none;
}