body.letsee-active {
  /*margin-top: 40px;*/
}
#topbar {
  border-bottom: 1px solid #ffffff !important;
}
dl#letsee-panel {
  margin-top: 0px;
  margin-bottom: 0px;
}
#letsee-panel > div > div:nth-child(2) > dt > label {
  display: inline-block;
  margin-bottom: 0;
}

#letsee-panel {
  /*position: fixed;*/
  display: none;
  /*top: 0;*/
  width: 100%;
  /*margin: 0;
    /*background: #e0e0e0;*/
  text-align: center;
  /*text-shadow: 0 1px 1px #fff;*/
  z-index: 99;
  font-family: "e-Ukraine";
  /*padding-bottom: 3px;*/
  /*color: black;*/
}

body.letsee-active #letsee-panel {
  display: block;
}

/* коли letsee активний */
body.letsee-active #holovna::before {
  opacity: 0.5;
}

body.letsee-active #facts,
body.letsee-active #footer,
body.letsee-active #hero,
body.letsee-active #values,
body.letsee-active #news,
body.letsee-active #holovna {
  filter: grayscale(100%);
  transition: filter 0.3s ease;
}

body.letsee-active .systems__item,
body.letsee-active .portals__item {
  background-color: inherit;
  transition: filter 0.3s ease;
}

body.letsee-active .portals__list::after {
  background-color: #000;
  transition: filter 0.3s ease;
}

body.letsee-active .portals__list::after,
body.letsee-active .functions__container::after,
body.letsee-active .timeline-item-title::before,
body.letsee-active .timeline:before,
body.letsee-active .system-portal-link,
body.letsee-active .item-link,
body.letsee-active .news__text::before,
body.letsee-active .news__text::after
{
  background-color: #fff;
  transition: filter 0.3s ease;
}

body.letsee-active #systems .system-portal-container h4,
body.letsee-active #footer a,
body.letsee-active #systems .system-portal-container span,
body.letsee-active #news .item-link {
  color: #000!important;
  transition: filter 0.3s ease;
}

body.letsee-active #footer a, 
body.letsee-active #footer span {
    color: #fff !important;
}

/* body.letsee-active .item-link,
body.letsee-active #mainMenu a {
  color: #000 !important;
  transition: filter 0.3s ease;
} */

body.letsee-active .lines,
body.letsee-active .lines:before,
body.letsee-active .lines:after {
  background-color: #fff;
}

body.letsee-active #location {
    filter: grayscale(1);
}



/* -----бургер меню----- */
body.mainMenu-open .lines,
body.mainMenu-open .lines::before,
body.mainMenu-open .lines::after{
   background-color: #000 !important;
}

body.mainMenu-open a,
body.mainMenu-open #logo h3 {
  color: #000 !important;
  transition: filter 0.3s ease;
}

body.letsee-active .breakpoint-md .b--responsive .mainMenu-open #logo h3 {
  color: #000 !important;
  transition: filter 0.3s ease;
}
/* -----end бургер меню----- */



body.letsee-active #scrollTop:after,
body.letsee-active #scrollTop:before {
   background-color: #4a4a4a;
}

body.letsee-active .post-meta-date-icon{
  fill: #4a4a4a!important;
  stroke: #4a4a4a!important;
}

#letsee-panel * {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;

  vertical-align: middle;
}

#letsee-panel dl,
#letsee-panel dt,
#letsee-panel dd {
  display: inline-block;
}

#letsee-panel dl {
  margin: 0;
}

#letsee-panel dt {
  margin: 0 0px 0 0px;

  font-size: 14px;
}

.col-3.letsee-guard {
  /*border-right: 3px;
    border-color: white;
    border-style: solid;*/
}

#letsee-panel dd {
  margin: 0 5px;
}

#letsee-panel input[type="checkbox"] {
  width: auto;
  height: auto;
  margin-left: 3px;
}

.letsee-change-fontsize {
  padding: 0 0.25em;
  margin: 0 2px;
  border: 1px solid transparent;
  text-decoration: none !important;
}

.letsee-fontsize-small {
  font-size: 14px !important;
}

.letsee-fontsize-medium {
  font-size: 18px !important;
}

.letsee-fontsize-large {
  font-size: 24px !important;
}

.letsee-fontsize-active {
  border-bottom: 2px solid #777;
}

.letsee-colors span {
  padding: 0 5px;
  margin: 0 2px;
  font-size: 100%;
  border-radius: 4px;
}

.letsee-colors-bonw span {
  color: #000 !important;
  background: #fff;
}

.letsee-colors-wonb span {
  color: #fff !important;
  background: #000;
}

.letsee-colors {
  border: 1px solid transparent;
  padding: 3px 0;
  text-decoration: none !important;
}

.letsee-colors-active {
  border-bottom: 2px solid #777;
}

.letsee-turn-off {
  margin-left: 0px;
}

@media (max-width: 789px) {
  .col-3.letsee-guard {
    border-right: 3px;
    border-color: white;
    border-style: solid;
    flex: 0 0 50%;
    max-width: 50%;
  }
}

@media (max-width: 689px) {
  #hider {
    display: none !important;
  }

  #letsee-panel dt {
    margin: 0 0px 0 5px;
    color: #444;
    border-left: none;
    border-style: none;
    padding-left: 5px;
    font-size: 12px;
  }

  .col-3.letsee-guard {
    border-right: 3px;
    border-color: white;
    border-style: solid;
    flex: 0 0 50%;
    max-width: 50%;
  }
}

html:lang(ua) body dl div.row div.col-3 dt.text-size::after {
  content: "Розмір тексту";
}

html:lang(ua) body dl div.row div.col-3 dt.colors-see::after {
  content: "Кольорова версія";
}

html:lang(ua) body dl div.row div.col-3 dt a.letsee-turn-off::after {
  content: "Вимкнути";
}

html:lang(ua) body dl div.row div.col-3 dt label::after {
  content: "Без зображень";
}
html:lang(en) body dl div.row div.col-3 dt.text-size::after {
  content: "Text size ";
}

html:lang(en) body dl div.row div.col-3 dt.colors-see::after {
  content: "Colors ";
}

html:lang(en) body dl div.row div.col-3 dt a.letsee-turn-off::after {
  content: "Turn off ";
}

html:lang(en) body dl div.row div.col-3 dt label::after {
  content: "No images ";
}
