@charset "UTF-8";
/* === ĜENERALAJ VARIABLOJ === */
/* $koloro_helega:       #CBE1E1; // rgb(203, 225, 225),	hsl(286, 88%, 88%) */
/* $koloro_malhelega:    #333D42; // rgb(51, 61, 66),      hsl(200, 13%, 23%) */
/*
$koloro_baza_admin:     $koloro_speciala_malhela;
$koloro_emfaza_admin:   $koloro_speciala_hela;
$koloro_griza_admin:    $koloro_speciala_griza;

$koloro_baza_admin_tv:  adjust-color( $koloro_baza_admin,  $alpha: -0.25 );
$koloro_griza_admin_tv: adjust-color( $koloro_griza_admin, $alpha: -0.25 );
*/
/* hele */
/* malhele */
:root {
  --k-baza: #006464;
  --k-emfaza: #009696;
  --k-blankeca: #FFFAFA;
  --k-helega: #DEEAEA;
  --k-hela: #96C8C8;
  --k-helgriza: #87AFAF;
  --k-griza: #789696;
  --k-malhelgriza: #546F74;
  --k-malhela: #2F4751;
  --k-malhelega: #2B363B;
  --k-nigreca: #282525;
  --k-speciala-hela: #960000;
  --k-speciala-griza: #967878;
  --k-speciala-malhela: #640000;
  --k-hela-tv: rgba(150, 200, 200, 0.95);
  --k-baza-tv: rgba(0, 100, 100, 0.75);
  --k-malhela-tv: rgba(47, 71, 81, 0.85); }

/* === DIFINOJ POR FORMOJ, KOLOROJ KAJ EFEKTOJ === */
/* FORMOJ */
.butono.precipa, .butono, .butoneto, .kampo.eniga > input, .kampo.eniga > textarea, .menuo, .elektilo.menuo ul > li.elektajxo label, .elektajxo > label, .mesagxo, .aro, .kadro, .havas-atendigilon {
  box-sizing: border-box; }

.butono.bilda::before, .menuo .malvolvajxo, .menuo ul > li:not(.elektajxo), .breto {
  box-sizing: content-box; }

.aro.horizontale > .kampo,
.aro.horizontale > .elektilo,
.butonaro.horizontale > .butono {
  flex: 1 1 0px; }

.kampo.eniga > input, .kampo.eniga > textarea, .menuo, .elektilo, .mesagxo, .aro {
  margin: 0.75rem 0; }

.butono.precipa, .butono, .menuo .mesagxo, .aro:not(.horizontale):not(.kune) > * {
  margin: 0.75rem 1rem; }

.butono:not(.precipa):not(.bilda):not(.iksa), .butono.precipa, .kampo.eniga > input, .kampo.eniga > label, .menuo ul > li:not(.elektajxo), .elektajxo, .elektajxo > label, .aro-titolo {
  padding: 0 1rem; }

.kampo.eniga > textarea, .elektilo:not(.menuo), .kadro {
  padding: 1rem; }

.mesagxo {
  padding: 0.75rem 1rem; }

.butono:not(.precipa):not(.bilda):not(.iksa), .butono.precipa, .kampo.eniga > input, .kampo.indika, .menuo, .elektajxo, .sxaltilo, .butonaro.kune.horizontale {
  height: 48px; }

.butoneto, .kampo.eniga > label, .breto {
  height: 24px; }

.butono:not(.precipa):not(.bilda):not(.iksa), .butono.precipa, .kampo.eniga > input, .kampo.indika, .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo li.elektita:not(.elektajxo), .elektilo, .sxaltilo {
  line-height: 46px; }

.kampo.eniga > label, .mesagxo, .breto, .aro-titolo {
  line-height: 1.5; }

.kampoetikedo, .kampo.eniga > label, .elektajxo > label, .sxaltilo > label, .kampo.eniga > input, .kampo.eniga > textarea, .menuo, .elektilo, .elektajxo, .mesagxo, .aro-titolo {
  text-align: left; }

.butono.bilda, .breto {
  text-align: center; }

.butono:not(.precipa):not(.bilda):not(.iksa), .butono.precipa, .butono.bilda::before, .kampo.eniga > input, .kampo.eniga > textarea, .menuo, .elektilo, .elektajxo, .aro, .havas-atendigilon {
  border-radius: 24px; }

.butono.bilda, .butoneto, .mesagxo, .breto, .kadro {
  border-radius: 16px; }

/* EFEKTOJ */
.kampoetikedo, .kampo.eniga > label, .elektajxo > label, .sxaltilo > label, .butono.precipa, .butono, .butoneto, .menuo, .elektajxo {
  cursor: pointer; }

.butono.precipa, .butono, .butoneto, .menuo, .elektilo, .elektajxo {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo, .menuo::after, .atenda,
.aro.kune > .atenda.aro,
.atenda.aro > * {
  pointer-events: none; }

a {
  text-decoration: none; }

.menuo ul {
  list-style: none;
  margin: 0;
  padding: 0; }

.elektilo:not(.menuo) > .aro-titolo, .aro:not(.kune) > .aro-titolo {
  margin: 0.5rem 1rem 1rem;
  padding: 0 0 0.5rem;
  font-size: 1rem;
  border-bottom: 1px solid; }

.menuo .malvolvajxo .aro-filtrilo > input, .elektilo .aro-filtrilo > input {
  width: 100%;
  box-shadow: none !important;
  box-sizing: border-box; }

.kasxita {
  margin-top: -100% !important;
  position: absolute !important;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
  transition: margin-top 0.3s ease-in-out;
  max-width: 1vw !important; }

.malkasxita {
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.3s ease-in-out; }

.elektajxo > input, .sxaltilo > input {
  position: absolute;
  opacity: 0;
  z-index: -1; }

.menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo {
  background-color: rgba(0, 0, 0, 0) !important;
  color: rgba(0, 0, 0, 0);
  border-color: rgba(0, 0, 0, 0) !important; }

.menuo:hover .malvolvajxo, .menuo:focus .malvolvajxo, .menuo:active .malvolvajxo, .menuo:focus-within .malvolvajxo {
  background-color: inherit !important;
  border-color: inherit !important;
  pointer-events: auto;
  z-index: 3; }

.butono:not(.precipa):not(.bilda):not(.iksa), .butono.precipa, .butono.bilda::before, .butoneto, .elektilo {
  transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out, border-color 0.25s ease-in-out, opacity 0.25s ease-in-out; }

.elektajxo > label::before, .elektilo.menuo .elektajxo > label::before {
  transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out, transform 0.25s ease-in-out, border-width 0.25s ease-in-out, border-color 0.25s ease-in-out, width 0.25s ease-in-out, height 0.25s ease-in-out; }

.kampoetikedo, .kampo.eniga > label, .elektajxo > label, .sxaltilo > label, a, .butono.bilda, .butono.iksa, .menuo ul > li:not(.elektajxo) {
  transition: color 0.25s ease-in-out; }

.menuo {
  transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out, border-radius 0.25s ease-in-out; }

.menuo .malvolvajxo {
  transition: top 0.25s ease-in-out, padding-top 0.25s ease-in-out, color 0.25s ease-in-out, background-color 0.25s ease-in-out, border-color 0.25s ease-in-out; }

.kampo.eniga > input, .kampo.eniga > textarea {
  transition: background-color 0.25s ease-in-out, border-color 0.25s ease-in-out; }

.sxaltilo > label::after {
  transition: right 0.25s ease-in-out, background-color 0.25s ease-in-out; }

/* BORDOJ */
.butono:not(.precipa):not(.bilda):not(.iksa), .butono.precipa, .butono.bilda::before, .kampo.eniga > input, .kampo.eniga > textarea, .menuo, .elektilo:not(.menuo), .sxaltilo > label::before,
.sxaltilo > label::after, .aro.kune > .elektilo:not(.menuo), .aro.kune > .atenda.aro {
  border: 2px solid; }

.menuo .malvolvajxo {
  border: 2px solid;
  border-top: none !important; }

.aro:not(.kune), .kadro {
  border: 2px solid; }

/* OMBROJ */
.butono:not(.precipa):not(.bilda):not(.iksa), .butono.precipa, .butono.bilda::before, .menuo, .menuo:hover .malvolvajxo, .menuo:focus .malvolvajxo, .menuo:active .malvolvajxo, .menuo:focus-within .malvolvajxo, .aro.kune {
  box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.15); }

.elektajxo > label::before, .sxaltilo > label::before,
.sxaltilo > label::after, .elektilo.menuo:hover .elektajxo > label::before {
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.15); }

.butoneto, .mesagxo, .breto {
  box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.1); }

/* === KOLOROJ === */
/* BUTONOJ */
/* KAMPOJ */
/* ELEKTILOJ k ŜALTILOJ */
/* MENUOJ k LISTOJ */
/* MESAĜOJ */
/* BRETOJ */
/* TIOGRAFIO */
.kampoetikedo, .kampo.eniga > label, .elektajxo > label, .sxaltilo > label, .butono.precipa, .butono, .kampo.eniga > input, .kampo.eniga > textarea, .menuo, .elektajxo {
  font-size: 0.9rem !important; }

.butoneto, .mesagxo, .breto {
  font-size: 0.8rem;
  font-weight: normal;
  letter-spacing: 0.5px; }

/* === PIKTOGRAMOJ === */
/*!
 * Font Awesome Free 5.14.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 */
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-regular-400.eot");
  src: url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-regular-400.woff2") format("woff2"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-regular-400.woff") format("woff"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-regular-400.ttf") format("truetype"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-regular-400.svg#fontawesome") format("svg"); }
.far {
  font-family: 'Font Awesome 5 Free';
  font-weight: 400; }

/*!
 * Font Awesome Free 5.14.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 */
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-solid-900.eot");
  src: url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-solid-900.woff2") format("woff2"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-solid-900.woff") format("woff"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-solid-900.ttf") format("truetype"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-solid-900.svg#fontawesome") format("svg"); }
.fa,
.fas {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900; }

/*!
 * Font Awesome Free 5.14.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 */
@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-brands-400.eot");
  src: url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-brands-400.woff2") format("woff2"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-brands-400.woff") format("woff"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-brands-400.ttf") format("truetype"), url("../../kodo/piktogramoj/fontawesome-free/webfonts/fa-brands-400.svg#fontawesome") format("svg"); }
.fab {
  font-family: 'Font Awesome 5 Brands';
  font-weight: 400; }

.butono.vocxdoni > .butonobildo, .sxaltilo::before, .sxaltilo::after, .butono.bilda::before, .mesagxo.informa::before, .mesagxo.demanda::before, .mesagxo.averta::before {
  font-family: 'Font Awesome 5 Free';
  font-style: normal; }

.butono.bilda::before,
.mesagxo.informa::before,
.mesagxo.demanda::before,
.mesagxo.averta::before {
  content: "\f0c8"; }

.mesagxo.informa,
.mesagxo.demanda,
.mesagxo.averta {
  padding-left: 1.5rem; }
  .mesagxo.informa::before,
  .mesagxo.demanda::before,
  .mesagxo.averta::before {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    padding: 10px 6px 0;
    border-radius: 4px; }

.mesagxo.informa::before {
  content: "\f129";
  font-weight: 900; }

.mesagxo.demanda::before {
  content: "\f128";
  font-weight: 900; }

.mesagxo.averta::before {
  content: "\f12a";
  font-weight: 900; }

.sxaltilo::before, .sxaltilo::after {
  position: absolute;
  top: 10px;
  display: block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  font-size: 0.8rem;
  text-align: center;
  pointer-events: none; }
.sxaltilo::before {
  right: 23px;
  z-index: 1; }
.sxaltilo::after {
  right: 1px; }

.etoso-sxaltilo::before {
  content: "\f185"; }
.etoso-sxaltilo::after {
  content: "\f186"; }

/* === ELEMENTOJ === */
body {
  background-color: #FFFAFA;
  color: #282525; }

body.malhele {
  background-color: #282525;
  color: #FFFAFA; }

a {
  /* $k_teksto_vizitita: $koloro_baza_tv; */
  color: #006464; }
  a:hover, a:focus, a:active {
    outline: 0; }
  a:visited {
    color: #006464; }
  a:hover, a:focus, a:active {
    color: #009696; }

body.malhele a {
  /* $k_teksto_vizitita: $koloro_baza_tv; */
  /* $k_teksto_vizitita: $koloro_hela_tv; */
  color: #96C8C8; }
  body.malhele a:visited {
    color: #96C8C8; }
  body.malhele a:hover, body.malhele a:focus, body.malhele a:active {
    color: #009696; }

/* BUTONOJ */
.butono.precipa, .butono {
  display: inline-block;
  vertical-align: top; }

.butono.bilda::before {
  display: block;
  width: 36px;
  height: 36px;
  line-height: 36px;
  margin: 0 auto 0.5rem; }

.butoneto {
  display: inline-block;
  vertical-align: middle;
  margin: 0 0.5rem;
  padding: 0 0.5rem;
  line-height: 24px; }

.butono:not(.precipa):not(.bilda):not(.iksa) {
  background-color: #DEEAEA;
  color: #2F4751;
  border-color: #006464; }
  .butono:not(.precipa):not(.bilda):not(.iksa):hover, .butono:not(.precipa):not(.bilda):not(.iksa):active, .butono:not(.precipa):not(.bilda):not(.iksa).elektita {
    background-color: #009696;
    color: #FFFAFA;
    border-color: #006464; }
  .butono:not(.precipa):not(.bilda):not(.iksa).malaktiva, .butono:not(.precipa):not(.bilda):not(.iksa):disabled {
    background-color: #87AFAF;
    color: #546F74;
    border-color: #546F74; }

body.malhele .butono:not(.precipa):not(.bilda):not(.iksa) {
  background-color: #2F4751;
  color: #DEEAEA;
  border-color: #546F74; }
  body.malhele .butono:not(.precipa):not(.bilda):not(.iksa):hover, body.malhele .butono:not(.precipa):not(.bilda):not(.iksa):active, body.malhele .butono:not(.precipa):not(.bilda):not(.iksa).elektita {
    background-color: #87AFAF;
    color: #2B363B;
    border-color: #87AFAF; }
  body.malhele .butono:not(.precipa):not(.bilda):not(.iksa).malaktiva, body.malhele .butono:not(.precipa):not(.bilda):not(.iksa):disabled {
    background-color: #546F74;
    color: #87AFAF;
    border-color: #789696; }

.butono.precipa {
  background-color: #006464;
  color: #FFFAFA;
  border-color: #006464; }
  .butono.precipa:hover, .butono.precipa:active {
    background-color: #009696;
    color: #FFFAFA;
    border-color: #009696; }
  .butono.precipa.malaktiva, .butono.precipa:disabled {
    background-color: #87AFAF;
    color: #546F74;
    border-color: #546F74; }

body.malhele .butono.precipa {
  background-color: #87AFAF;
  color: #282525;
  border-color: #87AFAF; }
  body.malhele .butono.precipa:hover, body.malhele .butono.precipa:active {
    background-color: #009696;
    color: #FFFAFA;
    border-color: #009696; }
  body.malhele .butono.precipa.malaktiva, body.malhele .butono.precipa:disabled {
    background-color: #546F74;
    color: #87AFAF;
    border-color: #789696; }

.butono.bilda {
  color: #2F4751; }
  .butono.bilda::before {
    background-color: #DEEAEA;
    color: #2F4751;
    border-color: #006464; }
  .butono.bilda:hover, .butono.bilda:active {
    color: #009696; }
    .butono.bilda:hover::before, .butono.bilda:active::before {
      background-color: #009696;
      color: #FFFAFA;
      border-color: #006464; }

body.malhele .butono.bilda {
  color: #DEEAEA; }
  body.malhele .butono.bilda::before {
    background-color: #2F4751;
    color: #DEEAEA;
    border-color: #546F74; }
  body.malhele .butono.bilda:hover, body.malhele .butono.bilda:active {
    color: #87AFAF; }
    body.malhele .butono.bilda:hover::before, body.malhele .butono.bilda:active::before {
      background-color: #87AFAF;
      color: #2B363B;
      border-color: #87AFAF; }

.butoneto {
  background-color: #96C8C8; }
  .butoneto:hover, .butoneto:active, .butoneto.elektita {
    background-color: #009696;
    color: #FFFAFA !important; }

body.malhele .butoneto {
  background-color: #2F4751; }
  body.malhele .butoneto:hover, body.malhele .butoneto:active, body.malhele .butoneto.elektita {
    background-color: #87AFAF;
    color: #2B363B !important; }

.mesagxo .butoneto {
  box-shadow: none; }

.butono.iksa {
  width: 48px;
  line-height: 48px;
  padding: 0;
  border: none;
  background: none;
  font-size: 3rem !important;
  color: #546F74; }
  .butono.iksa:hover, .butono.iksa:active {
    color: #546F74; }

.sxprucofenestro .butono.iksa,
.aro .butono.iksa,
.elektilo .butono.iksa {
  position: absolute;
  top: 0;
  right: 0;
  box-sizing: inherit;
  margin: 0;
  z-index: 5; }

body.malhele .butono.bilda {
  color: #789696; }
  body.malhele .butono.bilda:hover, body.malhele .butono.bilda:active {
    color: #87AFAF; }

/* KAMPOJ */
.kampo.eniga > input, .kampo.eniga > textarea {
  display: inline-block;
  vertical-align: top; }

.kampo.eniga {
  display: flex;
  flex-direction: column; }

.kampo.eniga > input,
.kampo.eniga > textarea {
  background-color: #FFFAFA;
  color: #2F4751;
  border-color: #006464; }
  .kampo.eniga > input:hover, .kampo.eniga > input:focus, .kampo.eniga > input:active,
  .kampo.eniga > textarea:hover,
  .kampo.eniga > textarea:focus,
  .kampo.eniga > textarea:active {
    background-color: #FFFAFA;
    color: #006464;
    border-color: #009696; }
  .kampo.eniga > input:disabled, .kampo.eniga > input.malaktiva,
  .kampo.eniga > textarea:disabled,
  .kampo.eniga > textarea.malaktiva {
    background-color: #4040bf !important;
    color: #4040bf !important;
    border-color: #4040bf !important; }

body.malhele .kampo.eniga > input,
body.malhele .kampo.eniga > textarea {
  background-color: #282525;
  color: #96C8C8;
  border-color: #546F74; }
  body.malhele .kampo.eniga > input:hover, body.malhele .kampo.eniga > input:focus, body.malhele .kampo.eniga > input:active,
  body.malhele .kampo.eniga > textarea:hover,
  body.malhele .kampo.eniga > textarea:focus,
  body.malhele .kampo.eniga > textarea:active {
    background-color: #2F4751;
    color: #96C8C8;
    border-color: #009696; }
  body.malhele .kampo.eniga > input:disabled, body.malhele .kampo.eniga > input.malaktiva,
  body.malhele .kampo.eniga > textarea:disabled,
  body.malhele .kampo.eniga > textarea.malaktiva {
    background-color: #4040bf !important;
    color: #4040bf !important;
    border-color: #4040bf !important; }

.kampo.indika {
  padding: 0 1rem;
  background-color: #DEEAEA;
  color: #2F4751;
  border-color: #006464; }

body.malhele .kampo.indika {
  background-color: #87AFAF;
  color: #2B363B;
  border-color: #546F74; }

/* MENUOJ k LISTOJ */
.menuo {
  position: relative;
  display: inline-block;
  vertical-align: top; }

.menuo .malvolvajxo {
  width: 100%;
  margin: 0;
  padding: 0.75rem 0;
  border-radius: 0 0 24px 24px; }

.menuo::after {
  content: "";
  position: absolute;
  top: 6.75px;
  right: 0.5rem;
  height: 12px;
  width: 12px;
  margin: 0.5rem;
  background: none !important;
  border-width: 0 4px 4px 0;
  border-style: solid;
  box-sizing: inherit;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg); }

.menuo ul > li:not(.elektajxo) {
  position: relative;
  height: 36px;
  line-height: 36px; }

.menuo ul > li:not(.elektajxo)::after {
  content: "";
  position: absolute;
  display: inline-block;
  right: 0;
  top: 0;
  width: 16px;
  height: 16px;
  margin: 0.5rem;
  border-radius: 100px;
  transition: opacity 0.25s ease-in-out; }

.menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .butonaro > .butono.elektita,
.menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .aro > .butoneto.elektita,
.menuo:not(:hover):not(:focus):not(:active):not(:focus-within) ul > li.elektita,
.menuo:not(:hover):not(:focus):not(:active):not(:focus-within) ul > li.elektajxo input[type="radio"]:checked + label {
  position: absolute;
  top: -22px;
  right: 0;
  margin: 0;
  padding-right: 2.5rem;
  text-align: right;
  border: none; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .butonaro > .butono.elektita::before,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .aro > .butoneto.elektita::before,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) ul > li.elektita::before,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) ul > li.elektajxo input[type="radio"]:checked + label::before {
    display: none; }

.menuo {
  background-color: #DEEAEA;
  color: #2F4751;
  border-color: #006464; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .butonaro > .butono.elektita,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .aro > .butoneto.elektita,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) ul > li.elektita,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) ul > li.elektajxo input[type="radio"]:checked + label {
    color: #546F74; }
  .menuo::after {
    border-color: #546F74; }
  .menuo:hover, .menuo:focus, .menuo:active, .menuo:focus-within {
    background-color: #FFFAFA;
    border-color: #009696; }
    .menuo:hover::after, .menuo:focus::after, .menuo:active::after, .menuo:focus-within::after {
      border-color: #546F74; }
    .menuo:hover > .aro-titolo, .menuo:focus > .aro-titolo, .menuo:active > .aro-titolo, .menuo:focus-within > .aro-titolo {
      color: #009696; }
  .menuo ul > li:not(.elektajxo) > a {
    color: #2F4751; }
  .menuo ul > li:not(.elektajxo)::after {
    background-color: #009696; }
  .menuo ul > li:not(.elektajxo):hover > a, .menuo ul > li:not(.elektajxo):focus > a, .menuo ul > li:not(.elektajxo):focus-within > a, .menuo ul > li:not(.elektajxo).elektita > a {
    color: #009696; }

body.malhele .menuo {
  background-color: #2F4751;
  color: #DEEAEA;
  border-color: #546F74; }
  body.malhele .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .butonaro > .butono.elektita,
  body.malhele .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .aro > .butoneto.elektita,
  body.malhele .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) ul > li.elektita,
  body.malhele .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) ul > li.elektajxo input[type="radio"]:checked + label {
    color: #789696; }
  body.malhele .menuo::after {
    border-color: #789696; }
  body.malhele .menuo:hover, body.malhele .menuo:focus, body.malhele .menuo:active, body.malhele .menuo:focus-within {
    background-color: #2B363B;
    border-color: #006464; }
    body.malhele .menuo:hover::after, body.malhele .menuo:focus::after, body.malhele .menuo:active::after, body.malhele .menuo:focus-within::after {
      border-color: #87AFAF; }
    body.malhele .menuo:hover > .aro-titolo, body.malhele .menuo:focus > .aro-titolo, body.malhele .menuo:active > .aro-titolo, body.malhele .menuo:focus-within > .aro-titolo {
      color: #96C8C8; }
  body.malhele .menuo ul > li:not(.elektajxo) > a {
    color: #DEEAEA; }
  body.malhele .menuo ul > li:not(.elektajxo)::after {
    background-color: #96C8C8; }
  body.malhele .menuo ul > li:not(.elektajxo):hover > a, body.malhele .menuo ul > li:not(.elektajxo):focus > a, body.malhele .menuo ul > li:not(.elektajxo):focus-within > a, body.malhele .menuo ul > li:not(.elektajxo).elektita > a {
    color: #96C8C8; }

.menuo > .aro-titolo {
  margin-right: 2.5rem;
  height: 44px;
  line-height: 44px; }

.menuo:not(.plur-elekta) {
  padding-right: 2.5rem; }

.menuo .malvolvajxo {
  position: absolute;
  left: -2px;
  max-height: 240px; }
  .menuo .malvolvajxo .aro-filtrilo > input {
    width: auto;
    margin: 0 1rem; }
  .menuo .malvolvajxo .mesagxo {
    display: block; }

.elektilo.menuo ul > li.elektajxo {
  display: block;
  margin: 0; }
  .elektilo.menuo ul > li.elektajxo label {
    display: block;
    position: relative;
    padding-left: 2.5rem; }

.menuo ul > li:not(.elektajxo) > a {
  display: block;
  width: 100%; }
.menuo ul > li:not(.elektajxo)::before {
  display: block;
  float: left;
  width: 24px; }
.menuo ul > li:not(.elektajxo)::after {
  opacity: 0; }
.menuo ul > li:not(.elektajxo):hover::after, .menuo ul > li:not(.elektajxo):focus::after, .menuo ul > li:not(.elektajxo):active::after, .menuo ul > li:not(.elektajxo):focus-within::after, .menuo ul > li:not(.elektajxo).elektita::after {
  opacity: 1; }

.menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo {
  top: 50%;
  padding-top: 2rem; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo ul.elstare::after {
    border-color: inherit; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo li,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .kampo {
    color: inherit; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .kampo > input {
    color: inherit;
    border-color: inherit;
    z-index: -1; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo li a,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo li label,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .butono,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .butoneto,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .mesagxo,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .mesagxo::before {
    color: inherit;
    background-color: inherit;
    pointer-events: inherit; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo li label::before,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .mesagxo,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .butono,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .butoneto {
    box-shadow: none; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .butono,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .butoneto,
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo .mesagxo {
    border-color: inherit; }
  .menuo:not(:hover):not(:focus):not(:active):not(:focus-within) .malvolvajxo li:not(.elektajxo).elektita::after {
    opacity: 0 !important; }

.menuo:hover, .menuo:focus, .menuo:active, .menuo:focus-within {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0; }
  .menuo:hover .malvolvajxo, .menuo:focus .malvolvajxo, .menuo:active .malvolvajxo, .menuo:focus-within .malvolvajxo {
    top: 100%;
    overflow-y: auto; }

/* ELEKTILOJ k ŜALTILOJ */
.elektilo:not(.menuo) {
  display: block; }

.elektajxo {
  margin: 0; }

.elektajxo > label::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 10px;
  width: 24px;
  height: 24px;
  box-sizing: inherit;
  border: 2px solid; }

.elektilo.plur-elekta .elektajxo > input:checked + label::before {
  background: none !important;
  border-width: 0 4px 4px 0 !important;
  border-style: solid;
  -webkit-transform: translateX(0.5rem) rotate(45deg);
  -ms-transform: translateX(0.5rem) rotate(45deg);
  transform: translateX(0.5rem) rotate(45deg);
  height: 21px !important;
  width: 14px !important; }

.sxaltilo {
  display: block;
  position: relative; }

.elektilo .aro-filtrilo {
  width: 100%; }

.elektilo.sol-elekta:not(.menuo) {
  background-color: #FFFAFA;
  border-color: #006464;
  /*
  &:hover,
  &:focus,
  &:active
  {
  	background-color: $k_hele__fono__kampoj__submuse__aktive;
  	color: $k_hele__teksto__kampoj__submuse__aktive;
  	border-color: $k_hele__bordo__kampoj__submuse__aktive;
  }
  */
  /*
  &:disabled,
  &.malaktiva
  {
  	background-color: $k_hele__fono__kampoj__malaktive !important;
  	color: $k_hele__teksto__kampoj__malaktive !important;
  	border-color: $k_hele__bordo__kampoj__malaktive !important;
  }
  */ }
  .elektilo.sol-elekta:not(.menuo) > .aro-titolo {
    border-bottom-color: #546F74 !important; }
.elektilo.sol-elekta .elektajxo {
  color: #2F4751; }
  .elektilo.sol-elekta .elektajxo:hover, .elektilo.sol-elekta .elektajxo:focus, .elektilo.sol-elekta .elektajxo:active {
    border-color: #006464; }
  .elektilo.sol-elekta .elektajxo.malaktiva, .elektilo.sol-elekta .elektajxo:disabled {
    background-color: #87AFAF !important;
    color: #546F74 !important;
    border-color: #546F74 !important; }
.elektilo.sol-elekta:not(.menuo) .elektajxo:hover label::before,
.elektilo.sol-elekta:not(.menuo) .elektajxo > input:checked + label::before, .elektilo.sol-elekta.menuo:hover ul > li:hover label::before,
.elektilo.sol-elekta.menuo:hover ul > li > input:checked + label::before, .elektilo.sol-elekta.menuo:focus ul > li:hover label::before,
.elektilo.sol-elekta.menuo:focus ul > li > input:checked + label::before, .elektilo.sol-elekta.menuo:focus-within ul > li:hover label::before,
.elektilo.sol-elekta.menuo:focus-within ul > li > input:checked + label::before {
  background-color: #009696;
  border-color: #006464; }
.elektilo.sol-elekta:not(.menuo) .elektajxo > input.malaktiva + label,
.elektilo.sol-elekta:not(.menuo) .elektajxo > input:disabled + label, .elektilo.sol-elekta.menuo:hover ul > li > input.malaktiva + label,
.elektilo.sol-elekta.menuo:hover ul > li > input:disabled + label, .elektilo.sol-elekta.menuo:focus ul > li > input.malaktiva + label,
.elektilo.sol-elekta.menuo:focus ul > li > input:disabled + label, .elektilo.sol-elekta.menuo:focus-within ul > li > input.malaktiva + label,
.elektilo.sol-elekta.menuo:focus-within ul > li > input:disabled + label {
  color: #546F74 !important;
  border-color: #546F74 !important; }
  .elektilo.sol-elekta:not(.menuo) .elektajxo > input.malaktiva + label::before,
  .elektilo.sol-elekta:not(.menuo) .elektajxo > input:disabled + label::before, .elektilo.sol-elekta.menuo:hover ul > li > input.malaktiva + label::before,
  .elektilo.sol-elekta.menuo:hover ul > li > input:disabled + label::before, .elektilo.sol-elekta.menuo:focus ul > li > input.malaktiva + label::before,
  .elektilo.sol-elekta.menuo:focus ul > li > input:disabled + label::before, .elektilo.sol-elekta.menuo:focus-within ul > li > input.malaktiva + label::before,
  .elektilo.sol-elekta.menuo:focus-within ul > li > input:disabled + label::before {
    background-color: #87AFAF;
    border-color: #546F74; }

body.malhele .elektilo.sol-elekta:not(.menuo) {
  background-color: #282525;
  border-color: #546F74;
  /*
  &:hover,
  &:focus,
  &:active
  {
  	background-color: $k_hele__fono__kampoj__submuse__aktive;
  	color: $k_hele__teksto__kampoj__submuse__aktive;
  	border-color: $k_hele__bordo__kampoj__submuse__aktive;
  }
  */
  /*
  &:disabled,
  &.malaktiva
  {
  	background-color: $k_hele__fono__kampoj__malaktive !important;
  	color: $k_hele__teksto__kampoj__malaktive !important;
  	border-color: $k_hele__bordo__kampoj__malaktive !important;
  }
  */ }
  body.malhele .elektilo.sol-elekta:not(.menuo) > .aro-titolo {
    border-bottom-color: #789696 !important; }
body.malhele .elektilo.sol-elekta .elektajxo {
  color: #DEEAEA; }
  body.malhele .elektilo.sol-elekta .elektajxo:hover, body.malhele .elektilo.sol-elekta .elektajxo:focus, body.malhele .elektilo.sol-elekta .elektajxo:active {
    border-color: #87AFAF; }
  body.malhele .elektilo.sol-elekta .elektajxo.malaktiva, body.malhele .elektilo.sol-elekta .elektajxo:disabled {
    background-color: #546F74 !important;
    color: #87AFAF !important;
    border-color: #789696 !important; }
body.malhele .elektilo.sol-elekta:not(.menuo) .elektajxo:hover label::before,
body.malhele .elektilo.sol-elekta:not(.menuo) .elektajxo > input:checked + label::before, body.malhele .elektilo.sol-elekta.menuo:hover ul > li:hover label::before,
body.malhele .elektilo.sol-elekta.menuo:hover ul > li > input:checked + label::before, body.malhele .elektilo.sol-elekta.menuo:focus ul > li:hover label::before,
body.malhele .elektilo.sol-elekta.menuo:focus ul > li > input:checked + label::before, body.malhele .elektilo.sol-elekta.menuo:focus-within ul > li:hover label::before,
body.malhele .elektilo.sol-elekta.menuo:focus-within ul > li > input:checked + label::before {
  background-color: #87AFAF;
  border-color: #87AFAF; }
body.malhele .elektilo.sol-elekta:not(.menuo) .elektajxo > input.malaktiva + label,
body.malhele .elektilo.sol-elekta:not(.menuo) .elektajxo > input:disabled + label, body.malhele .elektilo.sol-elekta.menuo:hover ul > li > input.malaktiva + label,
body.malhele .elektilo.sol-elekta.menuo:hover ul > li > input:disabled + label, body.malhele .elektilo.sol-elekta.menuo:focus ul > li > input.malaktiva + label,
body.malhele .elektilo.sol-elekta.menuo:focus ul > li > input:disabled + label, body.malhele .elektilo.sol-elekta.menuo:focus-within ul > li > input.malaktiva + label,
body.malhele .elektilo.sol-elekta.menuo:focus-within ul > li > input:disabled + label {
  color: #87AFAF !important;
  border-color: #789696 !important; }
  body.malhele .elektilo.sol-elekta:not(.menuo) .elektajxo > input.malaktiva + label::before,
  body.malhele .elektilo.sol-elekta:not(.menuo) .elektajxo > input:disabled + label::before, body.malhele .elektilo.sol-elekta.menuo:hover ul > li > input.malaktiva + label::before,
  body.malhele .elektilo.sol-elekta.menuo:hover ul > li > input:disabled + label::before, body.malhele .elektilo.sol-elekta.menuo:focus ul > li > input.malaktiva + label::before,
  body.malhele .elektilo.sol-elekta.menuo:focus ul > li > input:disabled + label::before, body.malhele .elektilo.sol-elekta.menuo:focus-within ul > li > input.malaktiva + label::before,
  body.malhele .elektilo.sol-elekta.menuo:focus-within ul > li > input:disabled + label::before {
    background-color: #546F74;
    border-color: #789696; }

.elektilo.plur-elekta:not(.menuo) {
  background-color: #FFFAFA;
  border-color: #006464;
  /*
  &:hover,
  &:focus,
  &:active
  {
  	background-color: $k_hele__fono__kampoj__submuse__aktive;
  	color: $k_hele__teksto__kampoj__submuse__aktive;
  	border-color: $k_hele__bordo__kampoj__submuse__aktive;
  }
  */
  /*
  &:disabled,
  &.malaktiva
  {
  	background-color: $k_hele__fono__kampoj__malaktive !important;
  	color: $k_hele__teksto__kampoj__malaktive !important;
  	border-color: $k_hele__bordo__kampoj__malaktive !important;
  }
  */ }
  .elektilo.plur-elekta:not(.menuo) > .aro-titolo {
    border-bottom-color: #546F74 !important; }
.elektilo.plur-elekta .elektajxo {
  color: #2F4751; }
  .elektilo.plur-elekta .elektajxo:hover, .elektilo.plur-elekta .elektajxo:focus, .elektilo.plur-elekta .elektajxo:active {
    border-color: #006464; }
  .elektilo.plur-elekta .elektajxo.malaktiva, .elektilo.plur-elekta .elektajxo:disabled {
    background-color: #87AFAF !important;
    color: #546F74 !important;
    border-color: #546F74 !important; }
.elektilo.plur-elekta:not(.menuo) .elektajxo:hover label::before,
.elektilo.plur-elekta:not(.menuo) .elektajxo > input:checked + label::before, .elektilo.plur-elekta.menuo:hover ul > li:hover label::before,
.elektilo.plur-elekta.menuo:hover ul > li > input:checked + label::before, .elektilo.plur-elekta.menuo:focus ul > li:hover label::before,
.elektilo.plur-elekta.menuo:focus ul > li > input:checked + label::before, .elektilo.plur-elekta.menuo:focus-within ul > li:hover label::before,
.elektilo.plur-elekta.menuo:focus-within ul > li > input:checked + label::before {
  border-color: #009696; }
.elektilo.plur-elekta:not(.menuo) .elektajxo > input.malaktiva + label,
.elektilo.plur-elekta:not(.menuo) .elektajxo > input:disabled + label, .elektilo.plur-elekta.menuo:hover ul > li > input.malaktiva + label,
.elektilo.plur-elekta.menuo:hover ul > li > input:disabled + label, .elektilo.plur-elekta.menuo:focus ul > li > input.malaktiva + label,
.elektilo.plur-elekta.menuo:focus ul > li > input:disabled + label, .elektilo.plur-elekta.menuo:focus-within ul > li > input.malaktiva + label,
.elektilo.plur-elekta.menuo:focus-within ul > li > input:disabled + label {
  color: #546F74 !important;
  border-color: #546F74 !important; }
  .elektilo.plur-elekta:not(.menuo) .elektajxo > input.malaktiva + label::before,
  .elektilo.plur-elekta:not(.menuo) .elektajxo > input:disabled + label::before, .elektilo.plur-elekta.menuo:hover ul > li > input.malaktiva + label::before,
  .elektilo.plur-elekta.menuo:hover ul > li > input:disabled + label::before, .elektilo.plur-elekta.menuo:focus ul > li > input.malaktiva + label::before,
  .elektilo.plur-elekta.menuo:focus ul > li > input:disabled + label::before, .elektilo.plur-elekta.menuo:focus-within ul > li > input.malaktiva + label::before,
  .elektilo.plur-elekta.menuo:focus-within ul > li > input:disabled + label::before {
    background-color: #87AFAF;
    border-color: #546F74; }

body.malhele .elektilo.plur-elekta:not(.menuo) {
  background-color: #282525;
  border-color: #546F74;
  /*
  &:hover,
  &:focus,
  &:active
  {
  	background-color: $k_hele__fono__kampoj__submuse__aktive;
  	color: $k_hele__teksto__kampoj__submuse__aktive;
  	border-color: $k_hele__bordo__kampoj__submuse__aktive;
  }
  */
  /*
  &:disabled,
  &.malaktiva
  {
  	background-color: $k_hele__fono__kampoj__malaktive !important;
  	color: $k_hele__teksto__kampoj__malaktive !important;
  	border-color: $k_hele__bordo__kampoj__malaktive !important;
  }
  */ }
  body.malhele .elektilo.plur-elekta:not(.menuo) > .aro-titolo {
    border-bottom-color: #789696 !important; }
body.malhele .elektilo.plur-elekta .elektajxo {
  color: #DEEAEA; }
  body.malhele .elektilo.plur-elekta .elektajxo:hover, body.malhele .elektilo.plur-elekta .elektajxo:focus, body.malhele .elektilo.plur-elekta .elektajxo:active {
    border-color: #87AFAF; }
  body.malhele .elektilo.plur-elekta .elektajxo.malaktiva, body.malhele .elektilo.plur-elekta .elektajxo:disabled {
    background-color: #546F74 !important;
    color: #87AFAF !important;
    border-color: #789696 !important; }
body.malhele .elektilo.plur-elekta:not(.menuo) .elektajxo:hover label::before,
body.malhele .elektilo.plur-elekta:not(.menuo) .elektajxo > input:checked + label::before, body.malhele .elektilo.plur-elekta.menuo:hover ul > li:hover label::before,
body.malhele .elektilo.plur-elekta.menuo:hover ul > li > input:checked + label::before, body.malhele .elektilo.plur-elekta.menuo:focus ul > li:hover label::before,
body.malhele .elektilo.plur-elekta.menuo:focus ul > li > input:checked + label::before, body.malhele .elektilo.plur-elekta.menuo:focus-within ul > li:hover label::before,
body.malhele .elektilo.plur-elekta.menuo:focus-within ul > li > input:checked + label::before {
  border-color: #87AFAF; }
body.malhele .elektilo.plur-elekta:not(.menuo) .elektajxo > input.malaktiva + label,
body.malhele .elektilo.plur-elekta:not(.menuo) .elektajxo > input:disabled + label, body.malhele .elektilo.plur-elekta.menuo:hover ul > li > input.malaktiva + label,
body.malhele .elektilo.plur-elekta.menuo:hover ul > li > input:disabled + label, body.malhele .elektilo.plur-elekta.menuo:focus ul > li > input.malaktiva + label,
body.malhele .elektilo.plur-elekta.menuo:focus ul > li > input:disabled + label, body.malhele .elektilo.plur-elekta.menuo:focus-within ul > li > input.malaktiva + label,
body.malhele .elektilo.plur-elekta.menuo:focus-within ul > li > input:disabled + label {
  color: #87AFAF !important;
  border-color: #789696 !important; }
  body.malhele .elektilo.plur-elekta:not(.menuo) .elektajxo > input.malaktiva + label::before,
  body.malhele .elektilo.plur-elekta:not(.menuo) .elektajxo > input:disabled + label::before, body.malhele .elektilo.plur-elekta.menuo:hover ul > li > input.malaktiva + label::before,
  body.malhele .elektilo.plur-elekta.menuo:hover ul > li > input:disabled + label::before, body.malhele .elektilo.plur-elekta.menuo:focus ul > li > input.malaktiva + label::before,
  body.malhele .elektilo.plur-elekta.menuo:focus ul > li > input:disabled + label::before, body.malhele .elektilo.plur-elekta.menuo:focus-within ul > li > input.malaktiva + label::before,
  body.malhele .elektilo.plur-elekta.menuo:focus-within ul > li > input:disabled + label::before {
    background-color: #546F74;
    border-color: #789696; }

.elektajxo > label {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  padding-left: 2rem; }

.elektilo.sol-elekta .elektajxo > label::before {
  border-radius: 100px; }

.elektilo.plur-elekta .elektajxo > label::before {
  border-radius: 4px; }

.sxaltilo > input:checked + label::after {
  right: -2px; }
.sxaltilo > label {
  display: block; }
  .sxaltilo > label::before {
    content: "";
    display: block;
    width: 48px;
    height: 24px;
    box-sizing: border-box;
    position: absolute;
    top: 10px;
    right: 0;
    border-radius: 100px; }
  .sxaltilo > label::after {
    content: "";
    display: block;
    height: 24px;
    width: 24px;
    box-sizing: content-box;
    position: absolute;
    top: 8px;
    right: 22px;
    text-align: center;
    line-height: 24px;
    border-radius: 100px;
    z-index: 3; }

.sxaltilo {
  color: #2F4751; }
  .sxaltilo > label::before {
    background-color: #FFFAFA; }
  .sxaltilo > label::after {
    background-color: #546F74; }
  .sxaltilo > input:checked + label::after {
    background-color: #009696; }

body.malhele .sxaltilo {
  color: #DEEAEA; }
  body.malhele .sxaltilo > label::before {
    background-color: #282525; }
  body.malhele .sxaltilo > label::after {
    background-color: #789696; }
  body.malhele .sxaltilo > input:checked + label::after {
    background-color: #87AFAF; }

/* MESAĜOJ */
.mesagxo {
  position: relative;
  display: inline-block;
  vertical-align: top;
  overflow: hidden; }

.mesagxo {
  background-color: #DEEAEA;
  color: #2F4751; }
  .mesagxo.informa::before, .mesagxo.demanda::before, .mesagxo.averta::before {
    display: inline-block;
    margin-right: 0.5rem; }
  .mesagxo::before {
    background-color: #96C8C8; }
  .mesagxo a {
    color: #006464; }
    .mesagxo a:hover, .mesagxo a:focus, .mesagxo a:active {
      color: #009696; }

body.malhele .mesagxo {
  background-color: #87AFAF;
  color: #2B363B; }
  body.malhele .mesagxo::before {
    background-color: #96C8C8; }
  body.malhele .mesagxo a {
    color: #2F4751; }
    body.malhele .mesagxo a:hover, body.malhele .mesagxo a:focus, body.malhele .mesagxo a:active {
      color: #009696; }

.kadro .mesagxo,
.aro .mesagxo,
.menuo .mesagxo {
  border: 2px solid;
  box-shadow: none;
  background: none !important;
  color: #2F4751;
  border-color: #DEEAEA; }
  .kadro .mesagxo::before,
  .aro .mesagxo::before,
  .menuo .mesagxo::before {
    background-color: #DEEAEA; }
  .kadro .mesagxo a,
  .aro .mesagxo a,
  .menuo .mesagxo a {
    color: #006464; }
    .kadro .mesagxo a:hover, .kadro .mesagxo a:focus, .kadro .mesagxo a:active,
    .aro .mesagxo a:hover,
    .aro .mesagxo a:focus,
    .aro .mesagxo a:active,
    .menuo .mesagxo a:hover,
    .menuo .mesagxo a:focus,
    .menuo .mesagxo a:active {
      color: #009696; }

body.malhele .kadro .mesagxo,
body.malhele .aro .mesagxo,
body.malhele .menuo .mesagxo {
  background: none !important;
  color: #87AFAF;
  border-color: #87AFAF; }
  body.malhele .kadro .mesagxo::before,
  body.malhele .aro .mesagxo::before,
  body.malhele .menuo .mesagxo::before {
    background-color: #2F4751; }
  body.malhele .kadro .mesagxo a,
  body.malhele .aro .mesagxo a,
  body.malhele .menuo .mesagxo a {
    color: #DEEAEA; }
    body.malhele .kadro .mesagxo a:hover, body.malhele .kadro .mesagxo a:focus, body.malhele .kadro .mesagxo a:active,
    body.malhele .aro .mesagxo a:hover,
    body.malhele .aro .mesagxo a:focus,
    body.malhele .aro .mesagxo a:active,
    body.malhele .menuo .mesagxo a:hover,
    body.malhele .menuo .mesagxo a:focus,
    body.malhele .menuo .mesagxo a:active {
      color: #009696; }

/* BRETOJ */
.breto {
  display: flex;
  margin: 0;
  padding: 0.5rem; }

.breto {
  background-color: rgba(150, 200, 200, 0.95); }

body.malhele .breto {
  background-color: rgba(47, 71, 81, 0.85); }

/* AROJ */
.aro {
  position: relative; }

.aro.kune.horizontale > .unue,
.aro.kune.horizontale > .unue.kampo > input {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right-width: 1px; }
.aro.kune.horizontale > .meze,
.aro.kune.horizontale > .meze.kampo > input {
  border-radius: 0;
  border-left-width: 1px;
  border-right-width: 1px; }
.aro.kune.horizontale > .laste,
.aro.kune.horizontale > .laste.kampo > input {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left-width: 1px; }

.aro.kune.vertikale > .unue,
.aro.kune.vertikale > .unue.kampo > input {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-width: 1px; }
.aro.kune.vertikale > .meze,
.aro.kune.vertikale > .meze.kampo > input {
  border-radius: 0;
  border-top-width: 1px;
  border-bottom-width: 1px; }
.aro.kune.vertikale > .laste,
.aro.kune.vertikale > .laste.kampo > input {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-top-width: 1px; }

.aro:not(.kune) {
  display: block; }

.aro-titolo {
  margin: 0; }

.aro:not(.kune) {
  background-color: #FFFAFA;
  border-color: #96C8C8; }
  .aro:not(.kune) > .aro-titolo {
    border-bottom-color: #546F74 !important; }
.aro.kune > .elektilo:not(.menuo) {
  border-color: #006464; }

body.malhele .aro:not(.kune) {
  background-color: #282525;
  border-color: #2F4751; }
  body.malhele .aro:not(.kune) > .aro-titolo {
    border-bottom-color: #789696 !important; }
body.malhele .aro.kune > .elektilo:not(.menuo) {
  border-color: #546F74; }

.aro.kune.horizontale > .aro.kune.vertikale.unue > .unue {
  border-top-right-radius: 0; }
.aro.kune.horizontale > .aro.kune.vertikale.unue > .laste {
  border-bottom-right-radius: 0; }
.aro.kune.horizontale > .aro.kune.vertikale.unue > .sole {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }
.aro.kune.horizontale > .aro.kune.vertikale.laste > .unue {
  border-top-left-radius: 0; }
.aro.kune.horizontale > .aro.kune.vertikale.laste > .laste {
  border-bottom-left-radius: 0; }
.aro.kune.horizontale > .aro.kune.vertikale.laste > .sole {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0; }

.aro.kune.vertikale > .aro.kune.horizontale.unue > .unue {
  border-bottom-left-radius: 0; }
.aro.kune.vertikale > .aro.kune.horizontale.unue > .laste {
  border-bottom-right-radius: 0; }
.aro.kune.vertikale > .aro.kune.horizontale.unue > .sole {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0; }
.aro.kune.vertikale > .aro.kune.horizontale.laste > .unue {
  border-top-left-radius: 0; }
.aro.kune.vertikale > .aro.kune.horizontale.laste > .laste {
  border-top-right-radius: 0; }
.aro.kune.vertikale > .aro.kune.horizontale.laste > .sole {
  border-top-left-radius: 0;
  border-top-right-radius: 0; }

.aro.horizontale, .aro.vertikale,
.elektilo.horizontale,
.elektilo.vertikale {
  display: flex; }

.aro.horizontale,
.elektilo.horizontale {
  flex-direction: row;
  flex-wrap: wrap; }
  .aro.horizontale.kune,
  .elektilo.horizontale.kune {
    flex-wrap: nowrap; }
  .aro.horizontale > .aro-titolo,
  .elektilo.horizontale > .aro-titolo {
    flex-basis: 100%; }

.aro.horizontale {
  justify-content: space-evenly; }

.aro.vertikale,
.elektilo.vertikale {
  flex-direction: column; }

.aro.kune > *,
.aro.kune > .kampo > input {
  margin: 0;
  box-shadow: none !important; }

/* KADROJ */
.kadro {
  background-color: #FFFAFA;
  border-color: #96C8C8; }

body.malhele .kadro {
  background-color: #282525;
  border-color: #2F4751; }

/* ŜPRUCOFENESTROJ */
.sxprucofenestro {
  display: block;
  position: fixed;
  z-index: 5;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  text-align: left;
  background-color: rgba(40, 37, 37, 0.75); }
  .sxprucofenestro > .kadro {
    position: relative;
    width: 320px;
    margin: auto;
    padding-top: 3rem; }
  .sxprucofenestro .kadro {
    max-width: 100%; }
  .sxprucofenestro .enhavo > .aro {
    margin: 0; }

/* ATENDIGILOJ */
.havas-atendigilon {
  position: relative;
  display: inline-block;
  vertical-align: top;
  z-index: 0; }

.atenda,
.aro.kune > .atenda.aro,
.atenda.aro > * {
  color: transparent !important;
  background: transparent !important; }
  .atenda > input,
  .aro.kune > .atenda.aro > input,
  .atenda.aro > * > input {
    color: transparent !important;
    background: transparent !important; }

.havas-atendigilon:not(.aro):not(.elektilo) > .kampo,
.havas-atendigilon:not(.aro):not(.elektilo) > .butono,
.havas-atendigilon:not(.aro):not(.elektilo) > .elektajxo {
  width: 100%; }

.havas-atendigilon:not(.atendigi)::after,
.havas-atendigilon.atendigi.atenda::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 0;
  height: 0;
  text-align: center;
  margin: auto;
  font-size: 0;
  z-index: -1;
  background-color: #006464;
  border: 1px solid #006464;
  box-sizing: border-box;
  border-radius: 100px;
  box-shadow: 0px 0px 0 1px #006464;
  -webkit-animation: atendu 1s infinite ease-in-out;
  animation: atendu 1s infinite ease-in-out; }

@keyframes atendu {
  0%, 100% {
    box-shadow: 0px 0px 0 0px #006464;
    width: 0;
    height: 0;
    opacity: 0; }
  37.5% {
    width: 0;
    height: 0;
    opacity: 1; }
  50% {
    box-shadow: 0px 0px 0 12px rgba(0, 100, 100, 0.8); }
  62.5% {
    box-shadow: 0px 0px 0 0px rgba(0, 100, 100, 0); }
  87.5% {
    width: 24px;
    height: 24px;
    opacity: 0; } }
.atenda,
.aro.kune > .atenda.aro,
.atenda.aro > * {
  border-color: #006464 !important; }
  .atenda.kampo.eniga > input,
  .aro.kune > .atenda.aro.kampo.eniga > input,
  .atenda.aro > *.kampo.eniga > input {
    border-color: #006464 !important; }

body.malhele .atenda,
body.malhele .aro.kune > .atenda.aro,
body.malhele .atenda.aro > * {
  border-color: #546F74 !important; }
  body.malhele .atenda.kampo.eniga > input,
  body.malhele .aro.kune > .atenda.aro.kampo.eniga > input,
  body.malhele .atenda.aro > *.kampo.eniga > input {
    border-color: #546F74 !important; }

.atenda.aro > *,
.atenda.elektilo.menuo::after {
  border-color: transparent !important; }

.atenda.kampo.eniga > input::-webkit-input-placeholder, .atenda.kampo.eniga > input::-moz-placeholder, .atenda.kampo.eniga > input::placeholder {
  color: transparent; }

.atenda.elektilo .elektajxo label {
  color: transparent !important; }
  .atenda.elektilo .elektajxo label::before {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important; }

.aro.horizontale > .atenda.unue, .aro.horizontale > .atenda.unue.kampo > input {
  border-right-color: transparent !important; }
.aro.horizontale > .atenda.meze, .aro.horizontale > .atenda.meze.kampo > input {
  border-right-color: transparent !important;
  border-left-color: transparent !important; }
.aro.horizontale > .atenda.laste, .aro.horizontale > .atenda.laste.kampo > input {
  border-left-color: transparent !important; }

.aro.vertikale > .atenda.unue, .aro.vertikale > .atenda.unue.kampo > input {
  border-bottom-color: transparent !important; }
.aro.vertikale > .atenda.meze, .aro.vertikale > .atenda.meze.kampo > input {
  border-bottom-color: transparent !important;
  border-top-color: transparent !important; }
.aro.vertikale > .atenda.laste, .aro.vertikale > .atenda.laste.kampo > input {
  border-top-color: transparent !important; }

/* ANTIKVAJ ELEMENTOJ */
.elektilo.menuo > select {
  -moz-appearance: none;
  -webkit-appearance: none;
  width: 100%;
  height: 100%;
  padding: 0 1rem;
  font-size: 0.9rem !important;
  cursor: pointer; }
.elektilo.menuo > option {
  margin-right: 2.5rem; }

.sxprucofenestro.kasxita {
  transition: opacity 0.3s ease-in-out; }

a:focus,
.butono:focus,
.butoneto:focus,
.kampo.eniga > input:focus,
.kampo.eniga > textarea:focus {
  outline: none; }
a:focus-visible,
.butono:focus-visible,
.butoneto:focus-visible,
.kampo.eniga > input:focus-visible,
.kampo.eniga > textarea:focus-visible {
  outline-width: 1px !important;
  outline-style: dashed !important;
  outline-offset: 3px !important;
  z-index: 1; }

.menuo:focus-within,
.elektilo.sol-elekta:focus-within,
.elektilo.plur-elekta .elektajxo:focus-within,
.sxaltilo:focus-within {
  outline-width: 1px !important;
  outline-style: dashed !important;
  outline-offset: 3px !important;
  position: relative;
  z-index: 2; }

a:focus-visible,
.butono:focus-visible,
.butoneto:focus-visible,
.kampo.eniga > input:focus-visible,
.kampo.eniga > textarea:focus-visible {
  outline-color: #640000 !important; }

.menuo:focus-within,
.elektilo.menuo:focus-within,
.elektilo.sol-elekta:focus-within,
.elektilo.plur-elekta .elektajxo:focus-within,
.sxaltilo:focus-within {
  outline-color: #640000 !important; }

body.malhele .butono:focus-visible,
body.malhele .butoneto:focus-visible,
body.malhele .kampo.eniga > input:focus-visible,
body.malhele .kampo.eniga > textarea:focus-visible {
  outline-color: #960000 !important; }
body.malhele a:focus-within,
body.malhele .menuo:focus-within,
body.malhele .elektilo.menuo:focus-within,
body.malhele .elektilo.sol-elekta:focus-within,
body.malhele .elektilo.plur-elekta .elektajxo:focus-within,
body.malhele .sxaltilo:focus-within {
  outline-color: #960000 !important; }

/*# sourceMappingURL=brile.css.map */