/*@font-face {
  font-family: 'Lato';
  src: 
      url(https://dbxsqivh2nmr7.cloudfront.net/flipbook/1.0/assets/fonts/lato-semibold2.woff2) format('woff2'),
      url(https://dbxsqivh2nmr7.cloudfront.net/flipbook/1.0/assets/fonts/lato-semibold.ttf) format('truetype'),
    url(https://dbxsqivh2nmr7.cloudfront.net/flipbook/1.0/assets/fonts/lato-semibold.eot) format('eot');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}*/

:root {
  --light-color: rgba(68, 68, 68, 0.95);
  --dark-color: rgba(255, 255, 255, 0.95);
  --light-hover-color: rgba(255, 255, 255, 0.9);
  --dark-hover-color: rgba(68, 68, 68, 1);
  --light-hover-bgcolor: rgba(68, 68, 68, 0.2);
  --dark-hover-bgcolor: rgba(255, 255, 255, 0.2);
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
button,
input,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}
html {
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: subpixel-antialiased;
  touch-action: manipulation;
  overflow: hidden;
  position: fixed;
}
body {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  padding: 0;
  margin: 0;
  font: normal 14px 'Lato', sans-serif !important;
  letter-spacing: 1px;
  overflow: hidden;
  position: relative;
}

body.is_mobile {
  /*-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
touch-action: none;*/
}

* {
  box-sizing: border-box;
  outline: none;
}
*[hidden] {
  /*display: none !important;*/
  visibility: hidden;
}
body *,
body *:before,
body *:after {
  box-sizing: inherit;
}
img,
picture,
source {
  max-width: 100%;
}
picture img {
  display: block;
}
img[data-src],
source[data-srcset],
.Loader:after {
  background: url('data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221037.989%22%20height%3D%22336.986%22%20viewBox%3D%2221.063%20466.356%201037.989%20336.986%22%3E%3Cg%20fill%3D%22%23FFF%22%3E%3Cpath%20d%3D%22M100.774%20557.242c-25.213%200-48.864%2011.691-63.561%2030.973v-25.924h-16.15v241.052h16.15V682.535c14.697%2019.282%2038.348%2030.974%2063.561%2030.974%2021.436%200%2041.566-8.367%2056.683-23.56%2014.682-14.755%2022.711-34.179%2022.608-54.679%200-43.024-35.569-78.028-79.291-78.028zm0%20140.747c-35.048%200-63.561-28.041-63.561-62.509%200-34.467%2028.513-62.509%2063.561-62.509%2034.815%200%2063.14%2028.042%2063.14%2062.509.001%2034.468-28.324%2062.509-63.14%2062.509z%22%3E%3Canimate%20attributeName%3D%22fill%22%20values%3D%22transparent%3B%23FFF%3B%23FFF%3B%23FFF%3B%23FFF%3B%23FFF%3B%23FFF%3Btransparent%22%20dur%3D%222s%22%20repeatCount%3D%22indefinite%22%2F%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M362.938%20635.271c0%2034.699-28.513%2062.93-63.561%2062.93-33.994%200-61.901-26.279-63.561-59.836v-75.652h-15.73v73.189c0%2043.025%2035.57%2078.028%2079.291%2078.028%2028.03%200%2053.506-14.11%2068.159-37.748.78-1.157%2011.131-16.83%2011.131-32.917v-80.553h-15.729v72.559z%22%3E%3Canimate%20attributeName%3D%22fill%22%20values%3D%22transparent%3Btransparent%3B%23FFF%3B%23FFF%3B%23FFF%3B%23FFF%3B%23FFF%3Btransparent%22%20dur%3D%222s%22%20repeatCount%3D%22indefinite%22%2F%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M502.398%20555.979c-25.168%200-48.385%2011.636-63.561%2031.498V466.356h-15.729v240.631h15.729v-26.046c15.058%2019.608%2038.269%2031.095%2063.561%2031.095%2043.722%200%2079.291-35.003%2079.291-78.028%200-43.025-35.569-78.029-79.291-78.029zm0%20140.749c-35.047%200-63.561-28.041-63.561-62.509%200-34.467%2028.513-62.509%2063.561-62.509s63.562%2028.042%2063.562%2062.509c0%2034.468-28.514%2062.509-63.562%2062.509z%22%3E%3Canimate%20attributeName%3D%22fill%22%20values%3D%22transparent%3Btransparent%3Btransparent%3B%23FFF%3B%23FFF%3B%23FFF%3B%23FFF%3Btransparent%22%20dur%3D%222s%22%20repeatCount%3D%22indefinite%22%2F%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M636.018%20468.039h15.729V708.67h-15.729z%22%3E%3Canimate%20attributeName%3D%22fill%22%20values%3D%22transparent%3Btransparent%3Btransparent%3Btransparent%3B%23FFF%3B%23FFF%3B%23FFF%3Btransparent%22%20dur%3D%222s%22%20repeatCount%3D%22indefinite%22%2F%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M844.088%20635.271c0%2034.699-28.513%2062.93-63.561%2062.93-34.111%200-62.111-26.279-63.771-59.836v-75.652h-15.519v73.189c0%2043.025%2035.569%2078.028%2079.29%2078.028%2028.03%200%2053.507-14.11%2068.159-37.748.779-1.157%2011.131-16.83%2011.131-32.917v-80.553h-15.729v72.559z%22%3E%3Canimate%20attributeName%3D%22fill%22%20values%3D%22transparent%3Btransparent%3Btransparent%3Btransparent%3Btransparent%3B%23FFF%3B%23FFF%3Btransparent%22%20dur%3D%222s%22%20repeatCount%3D%22indefinite%22%2F%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M1043.322%20562.712v72.559c0%2034.699-28.513%2062.93-63.561%2062.93-33.994%200-61.901-26.279-63.561-59.836v-75.652h-15.729v73.189c0%2043.025%2035.569%2078.028%2079.29%2078.028%2028.03%200%2053.507-14.11%2068.159-37.748.779-1.157%2011.131-16.83%2011.131-32.917v-80.553h-15.729z%22%3E%3Canimate%20attributeName%3D%22fill%22%20values%3D%22transparent%3Btransparent%3Btransparent%3Btransparent%3Btransparent%3Btransparent%3B%23FFF%3Btransparent%22%20dur%3D%222s%22%20repeatCount%3D%22indefinite%22%2F%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E')
    no-repeat center transparent;
  background-size: 4em;
}
button {
  background: transparent;
  cursor: pointer;
}
svg {
  pointer-events: none;
}
.clear {
  clear: both;
}
html,
body {
  height: 100vh;
  width: 100vw;
  overflow: hidden;
  position: fixed;
}
body.Loader:before {
  display: none;
}
.light {
  color: #444;
}
.dark {
  color: #ffffff;
}
#root {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  opacity: 1;
  transition: opacity 0.75s;
}

#root.roothidden {
  opacity: 0;
  transition: opacity 0.75s;
}

#header {
  display: flex;
  align-items: center;
  justify-content: center;
}
.header__logo {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  max-width: 200px;
  height: 30px;
  text-align: right;
}

.header__logo img {
  max-height: 100%;
}
/*.footer__center .header__logo{
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 200px;
  height: 30px;
}*/

.header__book-name {
  display: none;
  position: absolute;
  font-size: 15px;
  left: 5px;
  color: inherit;
  font-weight: 700;
  opacity: 0.8;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#footer,
#header {
  min-height: 45px;
  width: 100%;
  transition: margin 0.3s;
}

#header.hide {
  margin-top: -45px;
}

#footer.hide {
  margin-bottom: -45px;
}

#main {
  width: 100%;
  position: absolute;
  z-index: 2;
}

#sidebar,
#sidebarTOC,
#sidebarSearch,
#sidebarWishlist {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  transition: all ease 0.25s;
  z-index: 100;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  width: 100%;
  overflow-y: clip;
  top: 45px;
}

#sidebar:after,
#sidebarTOC:after,
#sidebarSearch::after,
#sidebarWishlist::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transition: top linear 0.5s 0s;
  z-index: 999;
}
#sidebarTOC.__active,
#sidebar.__active,
#sidebarSearch.__active,
#sidebarWishlist.__active {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  margin: 0;
}
#sidebar.__active:after,
#sidebarTOC.__active:after,
#sidebarSearch::after,
#sidebarWishlist::after {
  top: 100%;
}

.toc_item {
  width: 100%;
  display: flex;
  flex-direction: column;
  /* height: 40px; */
  overflow: hidden;
}

body.dark .toc_item__active, body.dark .toc_item__active:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

body.light .toc_item__active, body.light .toc_item__active:hover {
  background-color: rgba(0, 0, 0, 0.2);
}

.toc_item__active {
  font-weight: bold;
}

body.dark .toc_item__header:not(.toc_item__active):hover {
  background-color: rgba(255, 255, 255, 0.1);
}

body.light .toc_item__header:not(.toc_item__active):hover {
  background-color: rgba(0, 0, 0, 0.1);
}

.toc_item__wrapper .toc_item__header-content {
  padding-left: 11px;
}

.toc_item__header-content {
  display: flex;
  align-items: center;
  width: 100%;
  letter-spacing: 0;
  font-size: 13px;
  font-weight: bold;
  min-height: 40px;
  padding: 5px 0;
}

.toc_item__header {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 40px;
  padding: 0px 10px;
  cursor: pointer;
}

.toc_item__header p:first-of-type {
  width: 100%;
  /* overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; */
  min-height: 30px;
  display: flex;
  align-items: center;
  padding-right: 10px;
  height: 100%;
}

body.dark .toc_item__header p:first-of-type {
  color: rgba(255, 255, 255, 0.7)
}

body.light .toc_item__header p:first-of-type {
  color: rgba(0, 0, 0, 0.7)
}

body.dark .toc_item__header p:last-of-type  {
  color: rgba(255, 255, 255, 0.4)
}

body.light .toc_item__header p:last-of-type  {
  color: rgba(0, 0, 0, 0.4);
  font-size: 12px;
}

.toc_item__arrow {
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 4px;
  margin-left: -5px;
  /* margin-top: -2px; */
}

.toc_item__arrow svg {
  width: 14px;
  height: 14px;
  stroke-width: 1px;
}

body.light .toc_item__arrow svg {
  fill: rgba(0, 0, 0, 0.4);
  stroke: rgba(0, 0, 0, 0.4);
}

body.dark .toc_item__arrow svg {
  fill: rgba(255, 255, 255, 0.4);
  stroke: rgba(255, 255, 255, 0.4);
}

/* .toc_item__header:hover p {
  font-weight: bold;
} */

.toc_item__wrapper {
  height: 0;
}

.toc_item__expanded > .toc_item__wrapper {
  height: auto;
}

.toc_item__expanded > .toc_item__header .toc_item__arrow {
  transform: rotate(90deg);
}

body.is_mobile .toc_item__header-content, body.is_embed .toc_item__header-content {
  font-size: 16px;
}

body.is_mobile .sidebar__label, body.is_embed .sidebar__label {
  display: none;
}

#sidebar .Book__sidebar:not(.Book__sidebar--xs-landscape) {
  padding: 25px;
}

body:not(.is_mobile):not(.is_embed) #sidebar .Book__sidebar {
  justify-content: center;
}

#sidebarTOC .Book__sidebar {
  margin: 0px;
  padding: 0px;
  width: 270px;
}

@media (min-width: 640px) {
  #sidebar,
  #sidebarTOC {
    width: auto;
  }
}

@media (max-width: 870px) {
  body:not(.is_embed) #sidebarTOC .Book__sidebar {
    width: 250px;
  }
}

@media (max-width: 640px) {
  body:not(.is_embed) #sidebarTOC .Book__sidebar {
    width: 100%;
  }
}

/* @media (max-width: 480px) {
  #sidebar .Book__sidebar {
    padding: 25px 45px !important;
  }
}

@media (max-width: 340px) {
  #sidebar .Book__sidebar {
    padding: 25px !important;
  }
} */

@media (orientation: landscape) and (max-width: 650px) {
  body.is_mobile #sidebar .Book__sidebar .thumbnail-item {
    max-width: 90%;
  }
}

.notes-container {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
}

.note__button {
  width: 30px;
  height: 30px;
  cursor: pointer;
  position: absolute;
  bottom: -6px;
  right: -40px;
  z-index: 1;
  border-radius: 3px;
  padding: 0 3px;
  transition: .05s background-color ease;
}

.note__button-hidden {
  opacity: 0;
  visibility: hidden;
}

.note__button div {
  width: 100%;
  height: 100%;
  color: inherit;
  background-color: rgba(0, 0, 0, 0.4);
  mask: url(../images/icon-note-bottom.svg) no-repeat center / 100% 70%;
  -webkit-mask: url(../images/icon-note-bottom.svg) no-repeat center / 100% 70%;
}

.note__button:hover {
  background-color: var(--light-hover-bgcolor);
}

.Note__wrapper {
  /* width: 230px; */
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  position: absolute;
  top: 100px;
  left: 100px;
  z-index: 53 !important;
  transition: .1s transform linear;
}

.Note__marker {
  /* margin-bottom: 5px; */
  cursor: all-scroll;
  width: 26px;
  height: 24px;
  transition: .0s background ease;
  padding: 3px;
  border-radius: 4px;
}

.Note__marker svg * {
  transition: .1s fill ease;
}

.Note__show > .Note--red, .Note--red:hover, .Note__wrapper.active > .Note--red {
  background: #fad7d7;
}
.Note__show > .Note--orange, .Note--orange:hover, .Note__wrapper.active > .Note--orange {
  background: #ffe1c7;
}
.Note__show > .Note--yellow, .Note--yellow:hover, .Note__wrapper.active > .Note--yellow {
  background: #fff3cd;
}
.Note__show > .Note--green, .Note--green:hover, .Note__wrapper.active > .Note--green {
  background: #ccf4dd;
}
.Note__show > .Note--blue, .Note--blue:hover, .Note__wrapper.active > .Note--blue {
  background: #ccefff;
}
.Note__show > .Note--purple, .Note--purple:hover, .Note__wrapper.active > .Note--purple {
  background: #ebd4ef;
}

@media (max-width: 970px) {
}

.Note__body {
  display: none;
  width: 100%;
  height: 130px;
  border-radius: 5px;
  -webkit-box-shadow: 0 2px 10px 0px rgb(27 47 73 / 30%);
  box-shadow: 0 2px 10px 0px rgb(27 47 73 / 30%);
  position: absolute;
  top: 26px;
  width: 230px;
  background-color: #fbfbd5;
}

.Note__show {
  z-index: 54 !important;
}

.Note__show > .Note__body {
  display: block;
}

.Note__textarea {
  border-color: transparent;
  background-color: transparent;
  width: 100%;
  height: 92px;
  font-size: 14px;
  padding: 10px 15px 5px 15px;
  color: #596168;
  resize: none;
  font-family: 'Lato', serif;
}

.Note__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 0px 10px;
  height: 35px;
}

.Note__footer__date {
  font-size: 12px;
  line-height: 11px;
  color: #a6aaad;
}

.Note__colors {
  display: flex;
  align-items: center;
}

.Note__color-toggle {
  width: 18px;
  height: 18px;
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.Note__color-toggle.selected {
  transform: scale(1.4);
}

.Note__color-toggle:not(.selected) {
  margin-top: 2px;
}

.Note__color-toggle div {
  width: 11px;
  height: 11px;
  border-radius: 50%;
}

.Note__color-toggle:first-of-type {
  margin-left: 0;
}

.Note__color-toggle:last-of-type {
  margin-right: 0;
}

.Note__remove, .Note__done {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  transition: .1s background ease;
}

.Note__done:hover, .Note__remove:hover {
  background: #ddddbf;
}

/* .Note__remove:hover svg {
  fill: #168de7;
}

.Note__done:hover svg path {
  stroke: #248b26;
} */

.Note__remove span, .Note__done span {
  font-size: 12px;
  font-weight: bold;
  margin-left: 3px;
}

.Note__remove svg, .Note__done svg {
  width: 18px;
  height: 18px;
  transition: .05s fill ease, .05s stroke ease;
}

.sidebar-header {
  color: inherit;
  height: 45px;
  font-size: 20px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sidebar-close {
  color: inherit;
  border: solid currentColor;
  border-width: 0 2px 2px 0;
  padding: 5px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  position: absolute;
  right: 15px;
  opacity: 0.8;
}
#sidebar .Book__sidebar {
  --thumbs-in-row: 4;
}

#sidebar .Book__sidebar .thumbnail-item {
  display: flex;
  margin: 20px 10px;
  justify-content: center;
}

.thumbnail-item.single > .thumb .thumbX {
  box-shadow: 2px 0 4px #44444433;
}

#sidebar .Book__sidebar .thumbnail-item .left-thumbnail,
#sidebar .Book__sidebar .thumbnail-item .right-thumbnail {
  transition: .07s outline linear;
}

body.light #sidebar .Book__sidebar .thumbnail-item:not(.single).active .thumbnail-item__wrapper {
  outline: 3px solid var(--light-color);
}

body.dark #sidebar .Book__sidebar .thumbnail-item:not(.single).active .thumbnail-item__wrapper {
  outline: 3px solid var(--dark-color);
}

body.dark #sidebar .Book__sidebar .thumbnail-item:not(.single).active-full .thumbnail-item__wrapper {
  outline: 3px solid var(--dark-color);
}

body.light #sidebar .Book__sidebar .thumbnail-item:not(.single).active-full .thumbnail-item__wrapper {
  outline: 3px solid var(--light-color);
}

body.light #sidebar .Book__sidebar .thumbnail-item.single.active .thumb-img-div {
  outline: 3px solid var(--light-color);
}

body.dark #sidebar .Book__sidebar .thumbnail-item.single.active .thumb-img-div {
  outline: 3px solid var(--dark-color);
}

body.dark #sidebar .Book__sidebar .thumbnail-item.single.active-full .thumb-img-div {
  outline: 3px solid var(--dark-color);
}

body.light #sidebar .Book__sidebar .thumbnail-item.single.active-full .thumb-img-div {
  outline: 3px solid var(--light-color);
}

body.is_mobile.is_vertical #sidebar .Book__sidebar .thumbnail-item.active-full .thumbnail-item__wrapper {
  outline: none;
}

body.dark.is_mobile.is_vertical #sidebar .Book__sidebar .thumbnail-item.active-full .thumbnail-item__wrapper .thumb-img-div {
  outline: 3px solid var(--dark-color);
}

body.light.is_mobile.is_vertical #sidebar .Book__sidebar .thumbnail-item.active-full .thumbnail-item__wrapper .thumb-img-div {
  outline: 3px solid var(--light-color);
}

body.is_mobile #sidebar .Book__sidebar:not(.Book__sidebar--xs-landscape) .thumbnail-item .thumb-img-div, 
body.is_mobile #sidebar .Book__sidebar:not(.Book__sidebar--xs-landscape) .thumbnail-item .thumb-img-div *,
body.is_embed #sidebar .Book__sidebar:not(.Book__sidebar--xs-landscape) .thumbnail-item .thumb-img-div, 
body.is_embed #sidebar .Book__sidebar:not(.Book__sidebar--xs-landscape) .thumbnail-item .thumb-img-div * {
  /* width: calc(var(--thumb-width) * 1.2) !important;
  height: calc(var(--thumb-height) * 1.2) !important; */
  max-width: 100% !important;
}

body.is_mobile #sidebar .Book__sidebar.mobile .thumbnail-item,
body.is_embed #sidebar .Book__sidebar.mobile .thumbnail-item {
  max-width: calc((100% - var(--thumbs-in-row) * 20px) / var(--thumbs-in-row)) !important;
  width: 100%;
}

body.is_mobile #sidebar .Book__sidebar.mobile .thumbnail-item .thumb-img-div,
body.is_mobile #sidebar .Book__sidebar.mobile .thumbnail-item .thumb-img-div *,
body.is_embed #sidebar .Book__sidebar.mobile .thumbnail-item .thumb-img-div,
body.is_embed #sidebar .Book__sidebar.mobile .thumbnail-item .thumb-img-div * {
  width: 100% !important; 
  height: 100% !important; 
  /* max-height: calc(var(--thumb-height) * 1.5);  */
} 

body.is_desktop #sidebar .Book__sidebar .thumbnail-item .thumb-img-div {
  min-width: var(--thumb-width-or);
  min-height: var(--thumb-height-or);
}

body.is_mobile #sidebar, body.is_mobile #sidebarTOC,
body.is_embed #sidebar, body.is_embed #sidebarTOC {
  overflow-y: auto;
}

body.is_mobile #sidebar .sidebar__wrapper, body.is_mobile #sidebarTOC .sidebar__wrapper,
body.is_embed #sidebar .sidebar__wrapper, body.is_embed #sidebarTOC .sidebar__wrapper {
  height: auto;
  box-shadow: none;
}
/* @media screen and (orientation: landscape) and (max-width: 850px) {
  #sidebar .Book__sidebar .thumbnail-item {
    --thumbs-in-row: 3;
  }
} */

.thumbnail-item__wrapper {
  display: flex;
  justify-content: center;
}

.thumb {
  display: flex;
  flex-direction: column;
  align-items: center;
  /* justify-content: center; */
}
.thumb-img-ph {
  background-color: #fff;
}

.thumb-img-div {
  position: relative;
}
.thumbnail-number {
  margin-top: 5px;
  color: inherit;
  font-size: 110%;
  font-weight: 400;
  opacity: 0.8;
}
.thumb-img {
  background-size: contain;
  background-position: center;
  background: white;
  cursor: pointer;
}
.thumbnail-shadow {
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
}
.left-thumbnail {
  box-shadow: inset -17px 0 6px -11px rgba(0, 0, 0, 0.15), 0 0 4px #44444433;
}

.thumbX {
  position: absolute;
  margin-top: 0px;
  top: 0px;
  cursor: pointer;
}
.thumbnail-focus.left-thumbnail {
  border-top: 3px solid;
  border-bottom: 3px solid;
  border-left: 3px solid;
  padding: 5px;
}
.thumbnail-focus.right-thumbnail {
  border-top: 3px solid;
  border-bottom: 3px solid;
  border-right: 3px solid;
  padding: 5px;
}
.thumbnail-focus-borderleft {
  border-left: 3px solid;
}

/*.thumbX:before {
    content: ' ';
    background: red;
    float: right;
    width: 20%;
    height: 100%;
    z-index: 9999;
    overflow: hidden;  
    opacity: 0.3;
}*/

.embedded-player {
  width: 100%;
  height: 100%;
}

.embedded-player iframe {
  width: 100%;
  height: 100%;
}

.right-thumbnail {
  box-shadow: inset 20px 0 5px -15px rgba(0, 0, 0, 0.15), 2px 0 4px #44444433;
}

.note__button svg {
  fill: rgba(68, 68, 68, 0.35);
}

body.dark .footer__icons > button > div,
body.dark .header__icons > button > div {
  background-color: var(--dark-color);
}
body.light .footer__icons > button > div,
body.light .header__icons > button > div {
  background-color: var(--light-color);
}

body.dark .note__button svg {
  fill: rgba(255, 255, 255, 0.5);
}

/* body.light .note__button svg path:not(:first-child) {
  fill: var(--light-color);
} */

body.light .note__button svg {
  fill: rgba(68, 68, 68, 0.35);
}

/* body.dark .note__button svg path:not(:first-child) {
  fill: var(--dark-color);
} */

body.dark .footer__icons > button:hover > div,
body.dark .header__icons > button:hover > div {
  /*background-color: var(--dark-hover-color);*/
}
body.light .footer__icons > button:hover > div,
body.light .header__icons > button:hover > div {
  /*background-color: var(--light-hover-color);*/
}

body.dark .footer__icons > button:hover,
body.dark .header__icons > button:hover {
  background-color: var(--dark-hover-bgcolor);
}

body.light .footer__icons > button:hover,
body.light .header__icons > button:hover {
  background-color: var(--light-hover-bgcolor);
}

.Loader {
  position: relative;
}
.Loader:before,
.Loader:after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.Loader:after {
  z-index: 999;
}
@font-face {
  font-family: 'icomoon';
  src: url('../icons/fonts/icomoon.eot?crft5y');
  src: url('../icons/fonts/icomoon.eot?crft5y#iefix') format('embedded-opentype'),
    url('../icons/fonts/icomoon.ttf?crft5y') format('truetype'),
    url('../icons/fonts/icomoon.woff?crft5y') format('woff'),
    url('../icons/fonts/icomoon.svg?crft5y#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
.ic {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.dots-horizontal-triple:before {
  content: '\e900';
}
.zoom-in:before {
  content: '\e987';
}
.zoom-out:before {
  content: '\e988';
}
.enlarge:before {
  content: '\e989';
}
.shrink:before {
  content: '\e98a';
}
.circle-right:before {
  content: '\ea42';
}
.circle-left:before {
  content: '\ea44';
}

.stf__wrapper .stf__block .shadows {
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: absolute;
  box-sizing: border-box;
}

.stf__wrapper .stf__block .extraLeftFliped {
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: absolute;
  box-sizing: border-box;
  right: 100%;
  display: none;
  background-color: transparent;
}

.stf__wrapper .stf__block .extraLeftFlipedBg {
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: absolute;
  box-sizing: border-box;
  background-color: transparent;
  background-size: cover;
  transform: scaleX(-1);
  opacity: 0.25;
}

/* .Page[extraLayer='yes'] div:not(.odblask):not(#underShadow) { */
/* .Page[extraLayer='yes'] div:not(.odblask):not(#underShadow):not(.hotspots-container):not(.hotspot-area):not(.hotspot-circle):not(.hotspot-shadow):not(.hotspot-icon):not(.hotspot-*), */
.Page[extraLayer='yes'] div.blured1 {
  background-size: contain;
  opacity: 1;
  transform: scaleX(-1);
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;

  position: fixed;
  width: calc(100% + 48px);
  height: calc(100% + 48px);
  left: -14px;
  top: -14px;
  -webkit-filter: blur(24px);
  -moz-filter: blur(24px);
  -o-filter: blur(24px);
  -ms-filter: blur(24px);
  filter: blur(24px);
}

.book {
  --color: currentColor;
  --duration: 5s;
  width: 32px;
  height: 12px;
  position: relative;
  margin: 32px 0 0 0;
  transform: scale(0.6);
  -moz-transform: scale(0.6);
}

@media only screen and (max-width: 1024px) {
  .book {
    transform: scale(0.4);
    -moz-transform: scale(0.4);
  }
}

.book .inner {
  width: 32px;
  height: 12px;
  position: relative;
  transform-origin: 2px 2px;
  transform: rotateZ(0deg);
  /*animation: book var(--duration) ease infinite;*/
}
.book .inner .left,
.book .inner .right {
  width: 60px;
  height: 4px;
  top: 0;
  border-radius: 2px;
  background: var(--color);
  position: absolute;
}
/*.book .inner .left:before, .book .inner .right:before {
  content: '';
  width: 48px;
  height: 4px;
  border-radius: 2px;
  background: inherit;
  position: absolute;
  top: -10px;
  left: 6px;
}*/
.book .inner .left {
  right: 28px;
  transform-origin: 58px 2px;
  transform: rotateZ(0deg);
  animation: left var(--duration) ease 1;
}
.book .inner .right {
  left: 28px;
  transform-origin: 2px 2px;
  transform: rotateZ(0deg);
  animation: right var(--duration) ease 1;
}
.book .inner .middle {
  width: 32px;
  height: 12px;
  border: 4px solid var(--color);
  border-top: 0;
  border-radius: 0 0 9px 9px;
  transform: translateY(2px);
}
.book ul {
  margin: 0;
  padding: 0;
  list-style: none;
  position: absolute;
  left: 50%;
  top: 0;
}
.book ul li {
  height: 3px;
  border-radius: 0px;
  transform-origin: 100% 2px;
  width: 48px;
  right: 0;
  top: -10px;
  position: absolute;
  background: var(--color);
  transform: rotate(0deg) translateX(-18px);
  animation-duration: var(--duration);
  animation-timing-function: ease;
  animation-iteration-count: infinite;
  opacity: 1;
}
.book ul li:nth-child(0) {
  animation-name: page-0;
}
.book ul li:nth-child(1) {
  animation-name: page-1;
}
.book ul li:nth-child(2) {
  animation-name: page-2;
}
.book ul li:nth-child(3) {
  animation-name: page-3;
}
.book ul li:nth-child(4) {
  animation-name: page-4;
}
.book ul li:nth-child(5) {
  animation-name: page-5;
}
.book ul li:nth-child(6) {
  animation-name: page-6;
}
.book ul li:nth-child(7) {
  animation-name: page-7;
}
.book ul li:nth-child(8) {
  animation-name: page-8;
}
.book ul li:nth-child(9) {
  animation-name: page-9;
}
.book ul li:nth-child(10) {
  animation-name: page-10;
}
.book ul li:nth-child(11) {
  animation-name: page-11;
}
.book ul li:nth-child(12) {
  animation-name: page-12;
}
.book ul li:nth-child(13) {
  animation-name: page-13;
}
.book ul li:nth-child(14) {
  animation-name: page-14;
}
.book ul li:nth-child(15) {
  animation-name: page-15;
}
.book ul li:nth-child(16) {
  animation-name: page-16;
}
.book ul li:nth-child(17) {
  animation-name: page-17;
}
.book ul li:nth-child(18) {
  animation-name: page-18;
}

@keyframes page-0 {
  0%,
  3.99% {
    opacity: 0;
  }
  4% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  15%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}

@keyframes page-1 {
  0%,
  6.99% {
    opacity: 0;
  }
  7% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  18%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}

@keyframes page-2 {
  0%,
  9.99% {
    opacity: 0;
  }
  10% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  21%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-3 {
  0%,
  12.99% {
    opacity: 0;
  }
  13% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  24%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-4 {
  0%,
  15.99% {
    opacity: 0;
  }
  16% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  27%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-5 {
  0%,
  18.99% {
    opacity: 0;
  }
  19% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  30%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-6 {
  0%,
  21.99% {
    opacity: 0;
  }
  22% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  33%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-7 {
  0%,
  24.99% {
    opacity: 0;
  }
  25% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  36%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-8 {
  0%,
  27.99% {
    opacity: 0;
  }
  28% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  39%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-9 {
  0%,
  30.99% {
    opacity: 0;
  }
  31% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  42%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-10 {
  0%,
  33.99% {
    opacity: 0;
  }
  34% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  45%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-11 {
  0%,
  36.99% {
    opacity: 0;
  }
  37% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  48%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-12 {
  0%,
  39.99% {
    opacity: 0;
  }
  40% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  51%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-13 {
  0%,
  42.99% {
    opacity: 0;
  }
  43% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  54%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-14 {
  0%,
  45.99% {
    opacity: 0;
  }
  46% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  57%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-15 {
  0%,
  48.99% {
    opacity: 0;
  }
  49% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  60%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-16 {
  0%,
  52.99% {
    opacity: 0;
  }
  52% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  63%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-17 {
  0%,
  54.99% {
    opacity: 0;
  }
  55% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  66%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}
@keyframes page-18 {
  0%,
  57.99% {
    opacity: 0;
  }
  58% {
    opacity: 1;
    transform: rotate(0deg) translateX(-18px);
    -webkit-transform: rotate(0deg) translateX(-18px);
    -ms-transform: rotate(0deg) translateX(-18px);
    -o-transform: rotate(0deg) translateX(-18px);
  }
  69%,
  100% {
    transform: rotate(180deg) translateX(-18px);
    -webkit-transform: rotate(180deg) translateX(-18px);
    -ms-transform: rotate(180deg) translateX(-18px);
    -o-transform: rotate(180deg) translateX(-18px);
  }
}

/*@keyframes page-18 {
    0% {
        background-color: red;
        opacity: 0.0;
    }
    37.47% {
        background-color: yellow;
        opacity: 0.0;
        opacity: 0.0;
    }
    37.48% { 
        background-color: yellow;
        opacity: 1.0;
        transform: rotateZ(0deg) translateX(-18px);
    }
    44.32%{
        background-color: yellow;
        transform: rotateZ(180deg) translateX(-18px);
        opacity: 1.0;
    } 
    44.33%{
        background-color: blue;opacity: 0.0;
    }
   
   
   87.4%{
        opacity: 0.0;
    }
    
  87.48% {
    background-color: yellow;
    transform: rotateZ(180deg) translateX(-18px);
     opacity: 1.0;
  }
  94.32% {
    opacity: 0.0;
    background-color: green;
    transform: rotateZ(0deg) translateX(-18px);
  }
  94.34%{
        opacity: 0.0;
    }
    
  
}*/
@keyframes left {
  0% {
    transform: rotateZ(90deg);
  }
  10%,
  40% {
    transform: rotateZ(0deg);
  }
  /*  46%, 54% {
    transform: rotateZ(90deg);
  }
  60%, 90% {
    transform: rotateZ(0deg);
  }
  96% {
    transform: rotateZ(90deg);
  }*/
}
@keyframes right {
  0% {
    transform: rotateZ(-90deg);
  }
  10%,
  40% {
    transform: rotateZ(0deg);
  }

  /*  46%, 54% {
    transform: rotateZ(-90deg);
  }
  60%, 90% {
    transform: rotateZ(0deg);
  }
  96% {
    transform: rotateZ(-90deg);
  }*/
}
@keyframes book {
  4% {
    transform: rotateZ(-90deg);
  }
  10%,
  40% {
    transform: rotateZ(0deg);
    transform-origin: 2px 2px;
  }
  40.01%,
  59.99% {
    transform-origin: 30px 2px;
  }
  46%,
  54% {
    transform: rotateZ(90deg);
  }
  60%,
  90% {
    transform: rotateZ(0deg);
    transform-origin: 2px 2px;
  }
  96% {
    transform: rotateZ(-90deg);
  }
}

main.access-denied {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.not-found__content {
  margin-bottom: 0 !important;
  max-width: 535px;
}

.not-found__body {
  display: flex;
  align-items: center;
  text-align: left;
  gap: 75px;
}

.not-found__image {
  min-width: 300px;
  max-width: 380px;
  width: 100%;
}

.not-found__title {
  color: #273E5D;
  font-size: 62px;
  margin-bottom: 10px;
  font-weight: bold;
}

.not-found__subtitle {
  color: #273e5d;
  font-weight: bold;
  font-size: 30px !important;
  line-height: 40px;
  min-height: 40px;
  margin-bottom: 20px;
}

.not-found__text {
  color: #273e5d;
  font-size: 19px;
  line-height: 28px;
  font-weight: 400;
  letter-spacing: .5px;
  margin-bottom: 1rem;
}

.not-found__text b {
  font-weight: bold;
}

@media (max-width: 991px) {  
  .not-found__title {
    text-align: center;
  }

  .not-found__body {
    flex-direction: column;
    gap: 0;
    padding: 0 15px;
  }

  .not-found__wrapper {
    min-height: 60vh;
  }

  .not-found__content {
    max-width: 100%;
  }
}

@media (max-width: 767px) {  
  .not-found__subtitle {
    font-size: 28px !important;
    line-height: 40px;
    min-height: 40px;
  }
}

@media (max-width: 480px) {
  .not-found__title {
    font-size: 48px;
  }

  .not-found__subtitle {
    margin-top: 5px;
    font-size: 26px !important;
    line-height: 32px;
    min-height: 32px;
  }
}

@media (orientation: landscape) and (max-height: 600px) {
  .not-found__body {
    padding: 15px;
    flex-direction: row;
    gap: 20px;
  }

  .not-found__title {
    font-size: 42px;
  }

  .not-found__subtitle {
    font-size: 22px !important;
    line-height: 28px;
    min-height: 28px;
  }

  .not-found__text {
    font-size: 18px;
    line-height: 24px;
  }
}


@media (orientation: landscape) and (max-height: 300px) {
  .not-found__subtitle {
    font-size: 23px !important;
    min-height: 30px;
    line-height: 30px;
  }

  .not-found__text {
    font-size: 16px;
    line-height: 22px;
  }

  .not-found__title {
    font-size: 40px;
  }
}

/*Chrome*/
/*@media screen and (-webkit-min-device-pixel-ratio:0) {
    input[type='range'] {
      overflow: hidden;
      -webkit-appearance: none;
      background-color: #9a905d;
    }
    
    input[type='range']::-webkit-slider-runnable-track {
      height: 10px;
      -webkit-appearance: none;
      color: #13bba4;
      margin-top: -1px;
    }
    
    input[type='range']::-webkit-slider-thumb {
      width: 10px;
      -webkit-appearance: none;
      height: 10px;
      z-index: 3;
      box-shadow: -500px 0 0 500px #43e5f7;
    }

}*/

/*

.range-slider {
  --primary-color: #ff66D6;
  --fill-color: var(--primary-color);
  --progress-background: #EEE;

  --thumb-size: 12px;
  
  --step: 1;
  
  --value-a: Clamp(var(--min), var(--value, 0), var(--max)); 
  --value-b: var(--value, 0); // default value
  --text-value-a: var(--text-value, "");
  
  --completed-a: calc((var(--value-a) - var(--min) ) / (var(--max) - var(--min)) * 100);
  --completed-b: calc((var(--value-b) - var(--min) ) / (var(--max) - var(--min)) * 100);
  --ca: Min(var(--completed-a), var(--completed-b));
  --cb: Max(var(--completed-a), var(--completed-b));
  
  display: inline-block;
  height: 4px;
  position: relative;
  z-index: 1;
  
  &__progress {
    --start-end: calc(var(--thumb-size)/2);
    --clip-end: calc(100% - (var(--cb) ) * 1%);
    --clip-start: calc(var(--ca) * 1%);
    --clip: inset(-20px var(--clip-end) -20px var(--clip-start));
    position: absolute;
    left: var(--start-end);
    right: var(--start-end);
    top: 0px;
    height: 4px;
    background: var(--progress-background, #EEE);
    pointer-events: none;
    z-index: -1;
    border-radius: 2px;
    
    // fill area
    &::before{
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      clip-path: var(--clip);
      top: 0;
      bottom: 0;
      background: var(--fill-color, black);
      box-shadow: var(--progress-flll-shadow); 
      z-index: 1;
      border-radius: inherit;
    }
    
  }
  
  & > input {
    -webkit-appearance: none;
    width: 100%;
    height: 4px;
    margin: 0;
    position: absolute;
    left: 0;
    top: 0;
    cursor: -webkit-grab;
    cursor: grab;
    outline: none;
    background: none;
    
    &:not(:only-of-type){
      pointer-events: none;
    }
    
    &:active {
      --thumb-shadow: var(--thumb-shadow-active);
      cursor: grabbing;
      z-index: 2; 
    }
    
    // non-multiple range should not clip start of progress bar
    &:only-of-type{
      ~ .range-slider__progress{
        --clip-start: 0;
      }
    }

  }
}*/