@font-face {
  font-family: IvyPresto;
  src: url(/files/fonts/Ivy-Presto-Headline-Light.otf);
}

@font-face {
  font-family: Eastman;
  src: url(/files/fonts/Eastman-Roman-Light.otf);
  font-weight: 300;
}

@font-face {
  font-family: Eastman;
  src: url(/files/fonts/Eastman-Roman-Thin.otf);
  font-weight: 200;
}

@font-face {
  font-family: Eastman;
  src: url(/files/fonts/Eastman-Roman-Regular.otf);
  font-weight: 400;
}

@font-face {
  font-family: Eastman;
  src: url(/files/fonts/Eastman-Roman-Bold.otf);
  font-weight: 700;
}

/* .n13{
  background: url(/files/images/n13.png) no-repeat center/cover;
  position: absolute;
  top: 49px;
  left: 33px ;
  width: 95px;
  height: 97px;
  z-index: 10;
  pointer-events: none;
} */

body {
  font-family: Eastman, "Arial", sans-serif;
  color: #ffffff;
  overflow: hidden;
}

#loading-id {
  width: 100%;
  height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.loading {
  width: 48px;
  height: 48px;
  border: 5px solid #fff;
  border-bottom-color: transparent;
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
  animation: rotation 1.8s linear infinite;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.modal-window {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: calc(env(safe-area-inset-bottom) + 0px);
  padding-bottom: env(safe-area-inset-bottom);
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.705);
  z-index: 1000;

  display: flex;
  align-items: center;
  justify-content: center;
}

.modal {
  position: relative;
  width: 576px;
  padding: 24px 50px 24px 28px;
  background-color: #55161e;
  border-radius: 8px;
}

.modal::before {
  content: "";
  background: url(/files/images/star_reg.png) no-repeat center/cover;
  position: absolute;
  top: 0;
  right: 10px;
  width: 138px;
  height: 72px;
  pointer-events: none;
}

.modal::after {
  content: "";
  background: url(/files/images/star_popup_bot.png) no-repeat center/cover;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 171px;
  height: 154px;
}

.star {
  background: url(/files/images/star_popup_bot.png) no-repeat center/cover;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 171px;
  height: 154px;
  pointer-events: none;
  border-bottom-right-radius: 8px;
}

.starm-l {
  display: none;
  background: url(/files/images/star_m_left.png) no-repeat center/cover;
  position: absolute;
  top: 0;
  left: 0;
  width: 66px;
  height: 143px;
  pointer-events: none;
  z-index: -1;
}

.starm-r {
  display: none;
  background: url(/files/images/star_m_right.png) no-repeat center/cover;
  position: absolute;
  top: -65px;
  right: 0;
  width: 102px;
  height: 199px;
  pointer-events: none;
  z-index: -1;
}

.modal-header {
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
}

.modal-text {
  font-size: 18px;
  font-weight: 300;
  line-height: 25px;
}

.modal-text ul li::marker {
  font-size: 14px;
}

.modal-text ul li {
  padding-left: 5px;
  line-height: 170%;
}

.modal-text ul {
  padding-left: 20px;
}

.ac-form {
  display: flex;
  flex-direction: column;
}

.form-input {
  width: 450px;
  height: 64px;
  color: #dfa3a4;
  background-color: #55161e;
  border: 1px solid #dfa3a4;
  border-radius: 4px;
  outline: none;
  font-size: 24px;
  padding: 18px 15px;
}

.form-input:focus {
  background-color: #55161e;
}

.form-checkbox {
  margin: 24px 0;
}

.form-submit {
  width: 320px;
  height: 60px;
  font-size: 24px;
  color: #55161e;
  background-color: #dfa3a4;
  border-radius: 4px;
  border: none;
  outline: none;
  cursor: pointer;
}

.form-submit:disabled {
  color: #420c13;
  background-color: #964f51;
  cursor: wait;
}

.date-term {
  font-weight: 300;
  font-size: 14px;
  color: #dfa3a4;
}

.bottle {
  position: absolute;
  width: 255px;
  height: 406px;
  top: 5px;
  left: -145px;
  z-index: 1;
  pointer-events: none;
}

.b12 {
  background: url(/files/images/bottles/12.png);
}

.b13 {
  background: url(/files/images/bottles/13.png);
}

.b14 {
  background: url(/files/images/bottles/14.png);
}

.b15 {
  background: url(/files/images/bottles/15.png);
}

.b16 {
  background: url(/files/images/bottles/16.png);
}

.b17 {
  background: url(/files/images/bottles/17.png);
}

.b18 {
  background: url(/files/images/bottles/18.png);
}

.b19 {
  background: url(/files/images/bottles/19.png);
}

.b20 {
  background: url(/files/images/bottles/20.png);
}

.b21 {
  background: url(/files/images/bottles/21.png);
}

.b22 {
  background: url(/files/images/bottles/22.png);
}

.b23 {
  background: url(/files/images/bottles/23.png);
}

.b24 {
  background: url(/files/images/bottles/24.png);
  width: 255px;
  height: 456px;
  top: -10px;
}

#code-step-id {
  padding: 22px 0;
  display: flex;
  gap: 24px;
  flex-direction: column;
}

#code-step-id .form-submit {
  margin-top: 24px;
}

#success-step-id {
  padding: 36px 0;
  display: flex;
  gap: 24px;
  flex-direction: column;
}

.early-modal {
  padding: 50px 0;
  display: flex;
  gap: 24px;
  flex-direction: column;
}

.modal-result {
  position: relative;
  width: 666px;
  height: 426px;
  background-color: #55161e;
  border-radius: 8px;
  padding-left: 129px;
  padding-top: 127px;
  display: flex;
  gap: 16px;
  flex-direction: column;
}

.modal-result::before {
  content: "";
  position: absolute;
  background: url(/files/images/line1.png) no-repeat center/contain;
  width: 100%;
  height: 41px;
  top: 0;
  left: 0;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  pointer-events: none;
}

.modal-result::after {
  content: "";
  position: absolute;
  background: url(/files/images/line2.png) no-repeat center/contain;
  width: 100%;
  height: 54px;
  top: 55px;
  left: 0;
  pointer-events: none;
  z-index: 0;
}

.closeResult {
  position: absolute;
  top: 24px;
  right: 24px;
  width: 24px;
  height: 24px;
  background: url(/files/images/close.png) no-repeat center/cover;
  cursor: pointer;
}

.closeResult1 {
  position: absolute;
  top: 24px;
  right: 24px;
  width: 24px;
  height: 24px;
  background: url(/files/images/close.png) no-repeat center/cover;
  cursor: pointer;
}

.backBtn {
  position: absolute;
  top: 24px;
  right: 68px;
  width: 24px;
  height: 24px;
  background: url(/files/images/arrow-left.png) no-repeat center/cover;
  cursor: pointer;
}

.error-text {
  color: #ff4d50;
  font-weight: 300;
  font-size: 14px;
  margin-top: 10px;
}

.error-input {
  color: #ff4d50;
  border-color: #ff4d50 !important;
}

.star1-l {
  position: absolute;
  background: url(/files/images/star1_left.png) no-repeat center/cover;
  width: 180px;
  height: 320px;
  top: 15%;
  left: 0;
  pointer-events: none;
  z-index: -1;
}

.star2-l {
  position: absolute;
  background: url(/files/images/star2_left.png) no-repeat center/cover;
  width: 410px;
  height: 390px;
  bottom: 0;
  left: 0;
  pointer-events: none;
  z-index: -1;
}

.star1-r {
  position: absolute;
  background: url(/files/images/star1_right.png) no-repeat center/contain;
  width: 376px;
  height: 534px;
  top: 0;
  right: 0;
  pointer-events: none;
  z-index: -1;
}

.star2-r {
  position: absolute;
  background: url(/files/images/star2_right.png) no-repeat center/contain;
  width: 302px;
  height: 167px;
  bottom: 0;
  right: 0;
  pointer-events: none;
  z-index: -1;
}

.content-container {
  padding-top: 36px;
  padding-bottom: 5px;
  height: 100vh;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: space-between;
}

.info-block {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.logo {
  background: url(/files/images/logo.png) no-repeat center/cover;
  width: 282px;
  height: 59px;
  margin-bottom: 29px;
}

.header {
  font-family: IvyPresto, "Arial", sans-serif;
  font-size: 46px;
  margin-bottom: 10px;
}

.text {
  font-family: Eastman, "Arial", sans-serif;
  font-size: 18px;
  font-weight: 300;
  text-align: center;
  line-height: 25px;
}

.info-block .text {
  width: 720px;
}

.bt {
  font-weight: 700;
}

.advent-container {
  min-width: fit-content;
}

.advent-container-mobile {
  display: none;
}

.row1 {
  display: flex;
  gap: 5px;
}

.key-hover:hover {
  cursor: url(/files/images/key.png), auto;
}

.day-container1 {
  position: relative;
  width: 200px;
  height: 184px;
}

.day-container2 {
  position: relative;
  width: 224px;
  height: 184px;
}

.day-container3 {
  position: relative;
  width: 320px;
  height: 244px;
}

.day-container4 {
  position: relative;
  width: 280px;
  height: 184px;
}

.day-container4_1 {
  position: relative;
  width: 280px;
  height: 184px;
  margin-left: -71px;
}

.day-container5 {
  position: relative;
  width: 360px;
  height: 184px;
  margin-left: -74px;
}

.day-container5_1 {
  position: relative;
  width: 360px;
  height: 184px;
  margin-right: -74px;
  margin-left: 1px;
}

.day12 {
  background: url(/files/images/12.png) no-repeat center/cover;
  width: 200px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day12_o {
  background: url(/files/images/12_o.png) no-repeat center/cover;
  width: 200px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.day13 {
  background: url(/files/images/13.png) no-repeat center/cover;
  width: 224px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day13_o {
  background: url(/files/images/13_o.png) no-repeat center/cover;
  width: 224px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.day14 {
  background: url(/files/images/14.png) no-repeat center/cover;
  width: 320px;
  height: 245px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day14_o {
  background: url(/files/images/14_o.png) no-repeat center/cover;
  width: 320px;
  height: 243px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.day15 {
  background: url(/files/images/15.png) no-repeat center/cover;
  width: 224px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day15_o {
  background: url(/files/images/15_o.png) no-repeat center/cover;
  width: 224px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.day16 {
  background: url(/files/images/16.png) no-repeat center/cover;
  width: 200px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day16_o {
  background: url(/files/images/16_o.png) no-repeat center/cover;
  width: 200px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.row2 {
  margin-top: -55px;
  display: flex;
}

.day17 {
  background: url(/files/images/17.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day17_o {
  background: url(/files/images/17_o.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.day18 {
  background: url(/files/images/18.png) no-repeat center/cover;
  width: 360px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day18_o {
  background: url(/files/images/18_o.png) no-repeat center/cover;
  width: 360px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.day19 {
  background: url(/files/images/19.png) no-repeat center/cover;
  width: 360px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day19_o {
  background: url(/files/images/19_o.png) no-repeat center/cover;
  width: 360px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.space {
  width: 55px;
}

.day20 {
  background: url(/files/images/20.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
  margin-right: -74px;
}

.day20_o {
  background: url(/files/images/20_o.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
  margin-right: -74px;
}

.row3 {
  display: flex;
  margin-top: -120px;
  align-items: end;
  gap: 5px;
}

.day21 {
  background: url(/files/images/21.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day21_o {
  background: url(/files/images/21_o.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.day22 {
  background: url(/files/images/22.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day22_o {
  background: url(/files/images/22_o.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.union {
  /* background: url(/files/images/un1.svg) no-repeat center/cover; */
  width: 187px;
  height: 310px;
  background-position: -4px -3px;
  margin-left: -70.5px;
  z-index: -1;
}
.union1 {
  background: url(/files/images/un1.png) no-repeat center/cover;
  width: 192px;
  height: 314px;
  position: absolute;
  bottom: 5px;
  left: calc(50% - 96px);
  z-index: -1;
}

.day23 {
  background: url(/files/images/23.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day23_o {
  background: url(/files/images/23_o.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.day24 {
  background: url(/files/images/24.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.day24_o {
  background: url(/files/images/24_o.png) no-repeat center/cover;
  width: 280px;
  height: 184px;
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
}

.ml1 {
  margin-left: 1px;
}

.mw {
  max-width: 490px;
  height: 75px;
}

.current-door {
  mask-mode: alpha;
  z-index: 10;
}

.current-door::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(
    -45deg,
    #7a333ae8,
    #64262de8,
    #826862e8,
    #613b32e8,
    #d3b5b6e8,
    #a77173e8
  );
  background-size: 250% 250%;
  animation: gradient 7s ease infinite;
  z-index: 3;
  pointer-events: none;
}

@keyframes gradient {
  0% {
    background-position: 0% 100%;
  }
  50% {
    background-position: 100% 100%;
  }
  100% {
    background-position: 0% 100%;
  }
}

.fade-slide-left160 {
  animation: slideLeftFade160 1s forwards;
}

@keyframes slideLeftFade160 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(-160px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(-160px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-left180 {
  animation: slideLeftFade180 1s forwards;
}

@keyframes slideLeftFade180 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(-180px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(-180px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-right184 {
  animation: slideRightFade184 1s forwards;
}

@keyframes slideRightFade184 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(184px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(184px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-right162 {
  animation: slideRightFade162 1s forwards;
}

@keyframes slideRightFade162 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(162px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(162px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-top176 {
  animation: slideTopFade176 1s forwards;
}

@keyframes slideTopFade176 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateY(-176px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateY(-176px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-right186 {
  animation: slideRightFade186 1s forwards;
}

@keyframes slideRightFade186 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(186px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(186px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-left186 {
  animation: slideLeftFade186 1s forwards;
}

@keyframes slideLeftFade186 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(-186px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(-186px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-right192 {
  animation: slideRightFade192 1s forwards;
}

@keyframes slideRightFade192 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(192px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(192px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-left192 {
  animation: slideLeftFade192 1s forwards;
}

@keyframes slideLeftFade192 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(-192px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(-192px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-right196 {
  animation: slideRightFade196 1s forwards;
}

@keyframes slideRightFade196 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(196px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(196px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-left196 {
  animation: slideLeftFade196 1s forwards;
}

@keyframes slideLeftFade196 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(-196px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(-196px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-right240 {
  animation: slideRightFade240 1s forwards;
}

@keyframes slideRightFade240 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(240px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(240px); /* distance of slide */
    opacity: 0;
  }
}

.fade-slide-left240 {
  animation: slideLeftFade240 1s forwards;
}

@keyframes slideLeftFade240 {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  70% {
    transform: translateX(-240px); /* distance of slide */
    opacity: 1;
  }
  100% {
    transform: translateX(-240px); /* distance of slide */
    opacity: 0;
  }
}

.mask12 {
  mask-image: url(/files/images/masks/12.svg);
}

.mask13 {
  mask-image: url(/files/images/masks/13.svg);
}

.mask14 {
  mask-image: url(/files/images/masks/14.svg);
  clip-path: url(#cp14);
}

.mask15 {
  mask-image: url(/files/images/masks/13.svg);
}

.mask16 {
  mask-image: url(/files/images/masks/12.svg);
}

.mask17 {
  mask-image: url(/files/images/masks/17.svg);
  clip-path: url(#cp17);
}

.mask18 {
  mask-image: url(/files/images/masks/18.svg);
  clip-path: url(#cp18);
}

.mask18_1 {
  /* mask-image: url(/files/images/masks/18.svg); */
  clip-path: url(#cp18_1);
}

.mask19 {
  mask-image: url(/files/images/masks/19.svg);
  clip-path: url(#cp19);
}

.mask20 {
  mask-image: url(/files/images/masks/20.svg);
  clip-path: url(#cp20);
}

.mask21 {
  mask-image: url(/files/images/masks/21.svg);
}

.mask22 {
  mask-image: url(/files/images/masks/22.svg);
  clip-path: url(#cp22);
}

.mask23 {
  mask-image: url(/files/images/masks/23.svg);
  clip-path: url(#cp23);
}

.mask24 {
  mask-image: url(/files/images/masks/21.svg);
}

.key-hole {
  position: absolute;
  background: url(/files/images/number/key-hole.png) no-repeat center/cover;
  width: 15px;
  height: 23px;
  z-index: 10;
  pointer-events: none;
}

.key-hole_m {
  position: absolute;
  background: url(/files/images/number_m/key-hole.png) no-repeat center/cover;
  width: 10px;
  height: 16px;
  z-index: 10;
  pointer-events: none;
}

.k-h12 {
  top: 81px;
  right: 32px;
}

.k-h13 {
  top: 81px;
  right: 32px;
}

.k-h14 {
  top: 33px;
  right: 154px;
}

.k-h15 {
  top: 81px;
  left: 32px;
}

.k-h16 {
  top: 81px;
  left: 32px;
}

.k-h17 {
  top: 81px;
  left: 32px;
}

.k-h18 {
  top: 81px;
  left: 119px;
}

.k-h19 {
  top: 81px;
  right: 119px;
}

.k-h20 {
  top: 81px;
  right: 32px;
}

.k-h21 {
  top: 81px;
  right: 32px;
}

.k-h22 {
  top: 81px;
  right: 36px;
}

.k-h23 {
  top: 81px;
  left: 32px;
}

.k-h24 {
  top: 81px;
  left: 34px;
}

.k-hm12 {
  top: 61px;
  right: 15px;
}

.k-hm13 {
  top: 61px;
  right: 52px;
}

.k-hm14 {
  top: 61px;
  left: 16px;
}

.k-hm15 {
  top: 44px;
  right: 15px;
}

.k-hm16 {
  top: 24px;
  left: 87px;
}

.k-hm17 {
  top: 47px;
  left: 16px;
}

.k-hm18 {
  top: 48px;
  left: 18px;
}

.k-hm19 {
  top: 50px;
  right: 27px;
}

.k-hm20 {
  top: 49px;
  right: 44px;
}

.k-hm21 {
  top: 48px;
  left: 38px;
}

.k-hm22 {
  top: 60px;
  right: 18px;
}

.k-hm23 {
  top: 18px;
  left: 62px;
}

.k-hm24 {
  top: 62px;
  left: 18px;
}

.number12 {
  position: absolute;
  background: url(/files/images/number/12.png) no-repeat center/cover;
  top: 48px;
  left: 34px;
  width: 100px;
  height: 95px;
  z-index: 10;
  pointer-events: none;
}

.number13 {
  position: absolute;
  background: url(/files/images/number/13.png) no-repeat center/cover;
  top: 48px;
  left: 34px;
  width: 95px;
  height: 97px;
  z-index: 10;
  pointer-events: none;
}

.number14 {
  position: absolute;
  background: url(/files/images/number/14.png) no-repeat center/cover;
  top: 111px;
  left: 111px;
  width: 102px;
  height: 95px;
  z-index: 10;
  pointer-events: none;
}

.number15 {
  position: absolute;
  background: url(/files/images/number/15.png) no-repeat center/cover;
  top: 47px;
  right: 34px;
  width: 94px;
  height: 98px;
  z-index: 10;
  pointer-events: none;
}

.number16 {
  position: absolute;
  background: url(/files/images/number/16.png) no-repeat center/cover;
  top: 48px;
  right: 33px;
  width: 97px;
  height: 97px;
  z-index: 10;
  pointer-events: none;
}

.number17 {
  position: absolute;
  background: url(/files/images/number/17.png) no-repeat center/cover;
  top: 48px;
  right: 77px;
  width: 93px;
  height: 95px;
  z-index: 10;
  pointer-events: none;
}

.number18 {
  position: absolute;
  background: url(/files/images/number/18.png) no-repeat center/cover;
  bottom: 0;
  right: 81px;
  width: 98px;
  height: 94px;
  z-index: 10;
  pointer-events: none;
}

.number19 {
  position: absolute;
  background: url(/files/images/number/19.png) no-repeat center/cover;
  bottom: 0;
  left: 80px;
  width: 95px;
  height: 95px;
  z-index: 10;
  pointer-events: none;
}

.number20 {
  position: absolute;
  background: url(/files/images/number/20.png) no-repeat center/cover;
  top: 48px;
  left: 70px;
  width: 133px;
  height: 97px;
  z-index: 10;
  pointer-events: none;
}

.number21 {
  position: absolute;
  background: url(/files/images/number/21.png) no-repeat center/cover;
  top: 48px;
  left: 33px;
  width: 101px;
  height: 95px;
  z-index: 10;
  pointer-events: none;
}

.number22 {
  position: absolute;
  background: url(/files/images/number/22.png) no-repeat center/cover;
  bottom: 0;
  left: 34px;
  width: 124px;
  height: 95px;
  z-index: 10;
  pointer-events: none;
}

.number23 {
  position: absolute;
  background: url(/files/images/number/23.png) no-repeat center/cover;
  bottom: -2px;
  right: 35px;
  width: 119px;
  height: 97px;
  z-index: 10;
  pointer-events: none;
}

.number24 {
  position: absolute;
  background: url(/files/images/number/24.png) no-repeat center/cover;
  top: 48px;
  right: 33px;
  width: 129px;
  height: 95px;
  z-index: 10;
  pointer-events: none;
}

.number_m12 {
  position: absolute;
  background: url(/files/images/number_m/12.png) no-repeat center/cover;
  top: 47px;
  left: 17px;
  width: 57px;
  height: 54px;
  z-index: 10;
  pointer-events: none;
}

.number_m13 {
  position: absolute;
  background: url(/files/images/number_m/13.png) no-repeat center/cover;
  top: 47px;
  left: 53px;
  width: 54px;
  height: 55px;
  z-index: 10;
  pointer-events: none;
}

.number_m14 {
  position: absolute;
  background: url(/files/images/number_m/14.png) no-repeat center/cover;
  top: 47px;
  left: 38px;
  width: 58px;
  height: 54px;
  z-index: 10;
  pointer-events: none;
}

.number_m15 {
  position: absolute;
  background: url(/files/images/number_m/15.png) no-repeat center/cover;
  top: 29px;
  right: 41px;
  width: 53px;
  height: 55px;
  z-index: 10;
  pointer-events: none;
}

.number_m16 {
  position: absolute;
  background: url(/files/images/number_m/16.png) no-repeat center/cover;
  top: 64px;
  right: 64px;
  width: 55px;
  height: 55px;
  z-index: 10;
  pointer-events: none;
}

.number_m17 {
  position: absolute;
  background: url(/files/images/number_m/17.png) no-repeat center/cover;
  top: 33px;
  right: 15px;
  width: 52px;
  height: 54px;
  z-index: 10;
  pointer-events: none;
}

.number_m18 {
  position: absolute;
  background: url(/files/images/number_m/18.png) no-repeat center/cover;
  bottom: 22px;
  right: 54px;
  width: 56px;
  height: 55px;
  z-index: 10;
  pointer-events: none;
}

.number_m19 {
  position: absolute;
  background: url(/files/images/number_m/19.png) no-repeat center/cover;
  bottom: 21px;
  left: 44px;
  width: 53px;
  height: 55px;
  z-index: 10;
  pointer-events: none;
}

.number_m20 {
  position: absolute;
  background: url(/files/images/number_m/20.png) no-repeat center/cover;
  top: 30px;
  left: 17px;
  width: 75px;
  height: 55px;
  z-index: 10;
  pointer-events: none;
}

.number_m21 {
  position: absolute;
  background: url(/files/images/number_m/21.png) no-repeat center/cover;
  top: 30px;
  right: 16px;
  width: 57px;
  height: 54px;
  z-index: 10;
  pointer-events: none;
}

.number_m22 {
  position: absolute;
  background: url(/files/images/number_m/22.png) no-repeat center/cover;
  bottom: 41px;
  left: 17px;
  width: 70px;
  height: 53px;
  z-index: 10;
  pointer-events: none;
}

.number_m23 {
  position: absolute;
  background: url(/files/images/number/23.png) no-repeat center/cover;
  bottom: 17px;
  right: 35px;
  width: 67px;
  height: 55px;
  z-index: 10;
  pointer-events: none;
}

.number_m24 {
  position: absolute;
  background: url(/files/images/number/24.png) no-repeat center/cover;
  top: 44px;
  right: 16px;
  width: 73px;
  height: 53px;
  z-index: 10;
  pointer-events: none;
}

.policy-text {
  font-weight: 300;
  font-size: 14px;
  line-height: 25px;
  padding-left: 8px;
  color: #dfa3a4;
}

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

.custom-checkbox {
  display: none;
}

.checkbox-container {
  position: relative;
  font-size: 18px;
  width: 24px;
  height: 24px;
  user-select: none;
}

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 24px;
  width: 24px;
  background-color: #55161e;
  border-radius: 4px;
  border: 1px solid #dfa3a4;
}

.checkmark:hover {
  cursor: pointer;
}

input[type="checkbox"] {
  display: none;
}

.checkbox-container input:checked + .checkmark {
  background-color: #45111a;
  border: none;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.checkbox-container input:checked + .checkmark:after {
  display: block;
}

.checkbox-container .checkmark:after {
  left: 8px;
  top: 3px;
  width: 6px;
  height: 12px;
  border: solid #dfa3a4;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

@media screen and (max-height: 850px) {
  .calendar-block {
    scale: 0.7;
    margin-top: -70px;
  }

  .content-container {
    padding-top: 15px;
  }

  .logo {
    background: url(/files/images/logo.png) no-repeat center/contain;
    width: 232px;
    height: 59px;
    margin-bottom: 9px;
  }

  .header {
    font-family: IvyPresto, "Arial", sans-serif;
    font-size: 38px;
    margin-bottom: 10px;
  }

  .text {
    font-family: Eastman, "Arial", sans-serif;
    font-size: 16px;
    font-weight: 300;
    text-align: center;
  }

  .union1 {
    bottom: -26px;
  }
}

@media screen and (max-height: 900px) {
  .calendar-block {
    scale: 0.9;
    height: 537px;
  }
  .advent-container {
    height: 537px;
  }

  .content-container {
    padding-top: 20px;
  }

  .logo {
    background: url(/files/images/logo.png) no-repeat center/contain;
    width: 232px;
    height: 50px;
    margin-bottom: 0px;
  }

  .header {
    font-family: IvyPresto, "Arial", sans-serif;
    font-size: 38px;
    margin-bottom: 10px;
  }

  .text {
    font-family: Eastman, "Arial", sans-serif;
    font-size: 18px;
    font-weight: 300;
    text-align: center;
  }

  .info-block .text {
    width: 720px;
  }

  .modal-result {
    scale: 0.85;
  }

  .star1-l {
    background-size: contain;
    width: 140px;
  }

  .star2-l {
    background-size: contain;
    width: 390px;
    height: 350px;
    bottom: -20px;
  }

  .star1-r {
    width: 280px;
    height: 400px;
  }

  .star2-r {
    width: 280px;
    height: 120px;
    bottom: -20px;
  }

  .union1 {
    bottom: -26px;
  }
}

@media screen and (max-height: 800px) {
  .calendar-block {
    scale: 0.75;
    height: 403px;
  }
  .advent-container {
    height: 403px;
    margin-top: -100px;
  }

  .content-container {
    padding-top: 15px;
  }

  .logo {
    background: url(/files/images/logo.png) no-repeat center/contain;
    width: 212px;
    height: 50px;
    margin-bottom: 0px;
  }

  .header {
    font-family: IvyPresto, "Arial", sans-serif;
    font-size: 36px;
    margin-bottom: 10px;
  }

  .text {
    font-family: Eastman, "Arial", sans-serif;
    font-size: 16px;
    font-weight: 300;
    text-align: center;
  }

  .info-block .text {
    width: 640px;
  }

  .modal-result,
  .modal-registration {
    scale: 0.85;
  }

  .modal-later {
    scale: 0.85;
  }

  .star1-l {
    background-size: contain;
    width: 120px;
    top: 8%;
  }

  .star2-l {
    background-size: contain;
    width: 360px;
    height: 320px;
  }

  .star1-r {
    width: 265px;
    height: 380px;
  }

  .star2-r {
    width: 270px;
    height: 110px;
  }

  .union1 {
    bottom: -60px;
  }
}

@media screen and (max-height: 700px) {
  .calendar-block {
    scale: 0.7;
    height: 394px;
  }
  .advent-container {
    height: 394px;
    margin-top: -85px;
  }

  .content-container {
    padding-top: 15px;
  }

  .logo {
    background: url(/files/images/logo.png) no-repeat center/contain;
    width: 212px;
    height: 50px;
    margin-bottom: 0px;
  }

  .header {
    font-family: IvyPresto, "Arial", sans-serif;
    font-size: 36px;
    margin-bottom: 10px;
  }

  .text {
    font-family: Eastman, "Arial", sans-serif;
    font-size: 15px;
    font-weight: 300;
    text-align: center;
    line-height: 23px;
  }

  .info-block .text {
    width: 600px;
  }

  .modal-result {
    scale: 0.85;
  }

  .union1 {
    bottom: -84px;
  }
}

@media screen and (max-height: 640px) {
  .calendar-block {
    scale: 0.6;
    height: 280px;
  }
  .advent-container {
    height: 280px;
    margin-top: -190px;
  }

  .content-container {
    padding-top: 15px;
  }

  .logo {
    background: url(/files/images/logo.png) no-repeat center/contain;
    width: 182px;
    height: 39px;
    margin-bottom: 0px;
  }

  .header {
    font-family: IvyPresto, "Arial", sans-serif;
    font-size: 33px;
    margin-bottom: 10px;
  }

  .text {
    font-family: Eastman, "Arial", sans-serif;
    font-size: 14px;
    font-weight: 300;
    text-align: center;
  }

  .info-block .text {
    width: 560px;
  }

  .modal-result,
  .modal-registration {
    scale: 0.75;
  }

  .modal-later {
    scale: 0.75;
  }

  .star1-l {
    background-size: contain;
    width: 100px;
    top: 5%;
  }

  .star2-l {
    background-size: contain;
    width: 320px;
    height: 290px;
  }

  .star1-r {
    width: 240px;
    height: 340px;
  }

  .star2-r {
    width: 250px;
    height: 90px;
  }

  .union1 {
    bottom: -94px;
  }
}

@media screen and (max-height: 570px) {
  .calendar-block {
    scale: 0.55;
    height: 265px;
  }
  .advent-container {
    height: 265px;
    margin-top: -190px;
  }

  .content-container {
    padding-top: 15px;
  }

  .logo {
    background: url(/files/images/logo.png) no-repeat center/contain;
    width: 182px;
    height: 29px;
    margin-bottom: 0px;
  }

  .header {
    font-family: IvyPresto, "Arial", sans-serif;
    font-size: 30px;
    margin-bottom: 10px;
  }

  .text {
    font-family: Eastman, "Arial", sans-serif;
    font-size: 13px;
    font-weight: 300;
    text-align: center;
    line-height: 20px;
  }

  .info-block .text {
    width: 520px;
  }

  .modal-result {
    scale: 0.7;
  }

  .modal-later {
    scale: 0.7;
  }

  .union1 {
    bottom: -108px;
  }
}

@media screen and (max-width: 769px) {
  .starm-l,
  .starm-r {
    display: block;
    z-index: -2;
  }

  .error-text {
    font-size: 12px;
    margin-top: 8px;
  }

  body {
    overflow: auto;
    overflow-x: hidden;
  }

  .star1-l,
  .star1-r,
  .star2-l,
  .star2-r {
    display: none;
  }

  .modal-window {
    align-items: end;
  }

  .star {
    display: none;
  }

  .modal-result,
  .modal-registration,
  .modal-later {
    scale: 1;
  }

  .modal {
    width: 100%;
    max-width: 500px;
    padding: 56px 30px 30px 30px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  .modal::before {
    display: none;
  }

  .modal::after {
    display: none;
  }

  .early-modal {
    padding: 0;
    gap: 18px;
  }

  #code-step-id {
    padding: 0;
    gap: 18px;
  }

  #success-step-id {
    padding: 0;
    gap: 18px;
  }

  .form-input {
    width: 100%;
    height: 48px;
    border-radius: 3px;
    outline: none;
    font-size: 18px;
    padding: 13px 25px;
  }

  .policy-text {
    font-size: 11px;
  }

  .form-checkbox {
    margin: 18px 0;
  }

  .checkbox-container {
    width: 18px;
    height: 18px;
  }

  .checkbox-container .checkmark::after {
    left: 6px;
    top: 3px;
    width: 4px;
    height: 9px;
    border: solid #dfa3a4;
    border-top-width: medium;
    border-right-width: medium;
    border-bottom-width: medium;
    border-left-width: medium;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 18px;
    width: 18px;
  }

  .modal-result {
    scale: 1;
    width: 100%;
    max-width: 500px;
    height: 434px;
    padding: 68px 16px 85px 30px;
    gap: 8px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  .modal-result::before {
    content: "";
    position: absolute;
    background: url(/files/images/line1_m.png) no-repeat center/contain;
    width: 100%;
    height: 57px;
    top: unset;
    bottom: 34px;
    left: 0;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    pointer-events: none;
    z-index: -1;
  }

  .modal-result::after {
    content: "";
    position: absolute;
    background-size: 118%;
    width: 100%;
    height: 40px;
    top: unset;
    bottom: 0;
    left: 0;
    pointer-events: none;
    z-index: -1;
  }

  .modal-header {
    font-size: 22px;
    font-weight: 700;
    line-height: 30px;
  }

  .modal-text {
    font-size: 16px;
    line-height: 30px;
  }

  .mw {
    line-height: 25px;
    height: unset;
    margin-bottom: 10px;
  }

  .form-submit {
    width: 256px;
    height: 48px;
    font-size: 18px;
    font-weight: 500px;
  }

  .date-term {
    margin-top: 5px;
    font-size: 12px;
  }

  .bottle {
    width: 224px;
    height: 248px;
    background-position: center;
    background-size: cover;
    left: calc(50% - 112px);
    top: -185px;
  }

  .b12 {
    background: url(/files/images/bottles_m/12.png);
  }

  .b13 {
    background: url(/files/images/bottles_m/13.png);
  }

  .b14 {
    background: url(/files/images/bottles_m/14.png);
  }

  .b15 {
    background: url(/files/images/bottles_m/15.png);
  }

  .b16 {
    background: url(/files/images/bottles_m/16.png);
  }

  .b17 {
    background: url(/files/images/bottles_m/17.png);
  }

  .b18 {
    background: url(/files/images/bottles_m/18.png);
  }

  .b19 {
    background: url(/files/images/bottles_m/19.png);
  }

  .b20 {
    background: url(/files/images/bottles_m/20.png);
  }

  .b21 {
    background: url(/files/images/bottles_m/21.png);
  }

  .b22 {
    background: url(/files/images/bottles_m/22.png);
  }

  .b23 {
    background: url(/files/images/bottles_m/23.png);
  }

  .b24 {
    background: url(/files/images/bottles_m/24.png);
  }

  .info-block {
    max-width: 414px;
    width: 414px;
  }

  .logo {
    background-image: url(/files/images/logo_m.png);
    width: 169px;
    height: 35px;
    margin-bottom: 30px;
  }

  .header {
    font-size: 32px;
    text-align: left;
    line-height: 31px;
    margin-bottom: 16px;
    font-weight: 300;
    z-index: 10;
  }

  .text {
    font-size: 14px;
    line-height: 21px;
    text-align: left;
  }

  .text div {
    display: inline;
  }

  .info-block .text {
    width: unset;
  }

  .content-container {
    padding-top: 20px;
    height: 100%;
  }

  .calendar-block {
    scale: 1;
    height: fit-content;
    margin-top: 0;
  }

  .advent-container {
    display: none;
  }

  .advent-container-mobile {
    display: block;
    padding-top: 10px;
  }

  .day-container1_m {
    position: relative;
    width: 111px;
    height: 136px;
  }

  .day-container2_m {
    position: relative;
    width: 184px;
    height: 136px;
  }

  .day-container3_m {
    position: relative;
    width: 111px;
    height: 112px;
  }

  .day-container4_m {
    position: relative;
    width: 184px;
    height: 152px;
  }

  .day-container5_m {
    position: relative;
    width: 188px;
    height: 112px;
  }

  .day-container5_1_m {
    position: relative;
    width: 188px;
    height: 112px;
    margin-left: -53.5px;
  }

  .day-container6_m {
    position: relative;
    width: 135px;
    height: 135px;
  }

  .day-container6_1_m {
    position: relative;
    width: 136px;
    height: 136px;
  }

  .row1_m {
    display: flex;
    gap: 3px;
  }

  .day_m12 {
    background: url(/files/images/12_m.png) no-repeat center/cover;
    width: 111px;
    height: 136px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m12_o {
    background: url(/files/images/12_om.png) no-repeat center/cover;
    width: 111px;
    height: 136px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .day_m13 {
    background: url(/files/images/13_m.png) no-repeat center/cover;
    width: 184px;
    height: 136px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m13_o {
    background: url(/files/images/13_om.png) no-repeat center/cover;
    width: 184px;
    height: 136px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .day_m14 {
    background: url(/files/images/14_m.png) no-repeat center/cover;
    width: 111px;
    height: 136px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m14_o {
    background: url(/files/images/14_om.png) no-repeat center/cover;
    width: 111px;
    height: 136px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .row2_m {
    display: flex;
    gap: 3px;
    margin-top: 3px;
  }

  .day_m15 {
    background: url(/files/images/15_m.png) no-repeat center/cover;
    width: 111px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m15_o {
    background: url(/files/images/15_om.png) no-repeat center/cover;
    width: 111px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .day_m16 {
    background: url(/files/images/16_m.png) no-repeat center/cover;
    width: 184px;
    height: 153px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m16_o {
    background: url(/files/images/16_om.png) no-repeat center/cover;
    width: 184px;
    height: 151px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .day_m17 {
    background: url(/files/images/17_m.png) no-repeat center/cover;
    width: 111px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m17_o {
    background: url(/files/images/17_om.png) no-repeat center/cover;
    width: 111px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .row3_m {
    position: relative;
    display: flex;
    gap: 3px;
    margin-top: -37px;
  }

  .day_m18 {
    background: url(/files/images/18_m.png) no-repeat center/cover;
    width: 188px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m18_o {
    background: url(/files/images/18_om.png) no-repeat center/cover;
    width: 188px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .space_m {
    width: 30px;
  }

  .day_m19 {
    background: url(/files/images/19_m.png) no-repeat center/cover;
    width: 188px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m19_o {
    background: url(/files/images/19_om.png) no-repeat center/cover;
    width: 188px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .row4_m {
    display: flex;
    gap: 3px;
    margin-top: 3px;
  }

  .day_m20 {
    background: url(/files/images/20_m.png) no-repeat center/cover;
    width: 188px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m20_o {
    background: url(/files/images/20_om.png) no-repeat center/cover;
    width: 188px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .union_m {
    background: url(/files/images/ut.png) no-repeat center/cover;
    width: 136px;
    height: 187px;
    margin-left: -52.5px;
    margin-top: -75.5px;
    z-index: -1;
  }

  .day_m21 {
    background: url(/files/images/21_m.png) no-repeat center/cover;
    width: 188px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m21_o {
    background: url(/files/images/21_om.png) no-repeat center/cover;
    width: 188px;
    height: 112px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .row5_m {
    display: flex;
    gap: 3px;
    margin-top: 3px;
  }

  .day_m22 {
    background: url(/files/images/22_m.png) no-repeat center/cover;
    width: 136px;
    height: 136px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m22_o {
    background: url(/files/images/22_om.png) no-repeat center/cover;
    width: 136px;
    height: 136px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .day_m23 {
    background: url(/files/images/23_m.png) no-repeat center/cover;
    width: 135px;
    height: 135px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m23_o {
    background: url(/files/images/23_om.png) no-repeat center/cover;
    width: 135px;
    height: 135px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .day_m24 {
    background: url(/files/images/24_m.png) no-repeat center/cover;
    width: 135px;
    height: 135px;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
  }

  .day_m24_o {
    background: url(/files/images/24_om.png) no-repeat center/cover;
    width: 135px;
    height: 135px;
    top: 0;
    left: 0;
    position: absolute;
    cursor: pointer;
  }

  .mask12_m {
    mask-image: url(/files/images/masks/12_m.svg);
  }

  .mask13_m {
    mask-image: url(/files/images/masks/13_m.svg);
  }

  .mask14_m {
    mask-image: url(/files/images/masks/12_m.svg);
  }

  .mask15_m {
    mask-image: url(/files/images/masks/15_m.svg);
  }

  .mask16_m {
    mask-image: url(/files/images/masks/16_m.svg);
    clip-path: url(#cp16_m);
  }

  .mask17_m {
    mask-image: url(/files/images/masks/15_m.svg);
  }

  .mask18_m {
    mask-image: url(/files/images/masks/18_m.svg);
    clip-path: url(#cp18_m);
  }

  .mask19_m {
    mask-image: url(/files/images/masks/19_m.svg);
    clip-path: url(#cp19_m);
  }

  .mask20_m {
    mask-image: url(/files/images/masks/20_m.svg);
    clip-path: url(#cp20_m);
  }

  .mask21_m {
    mask-image: url(/files/images/masks/21_m.svg);
    clip-path: url(#cp21_m);
  }

  .mask22_m {
    mask-image: url(/files/images/masks/22_m.svg);
  }

  .mask23_m {
    mask-image: url(/files/images/masks/22_m.svg);
  }

  .mask24_m {
    mask-image: url(/files/images/masks/22_m.svg);
  }

  .fade-slide-left96 {
    animation: slideLeftFade96 1s forwards;
  }

  @keyframes slideLeftFade96 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateX(-94px);
      opacity: 1;
    }

    100% {
      transform: translateX(-94px);
      opacity: 0;
    }
  }

  .fade-slide-right92 {
    animation: slideRightFade92 1s forwards;
  }

  @keyframes slideRightFade92 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateX(92px);
      opacity: 1;
    }

    100% {
      transform: translateX(92px);
      opacity: 0;
    }
  }

  .fade-slide-top120 {
    animation: slideTopFade120 1s forwards;
  }

  @keyframes slideTopFade120 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateY(-120px);
      opacity: 1;
    }

    100% {
      transform: translateY(-120px);
      opacity: 0;
    }
  }

  .fade-slide-top110 {
    animation: slideTopFade110 1s forwards;
  }

  @keyframes slideTopFade110 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateY(-110px);
      opacity: 1;
    }

    100% {
      transform: translateY(-110px);
      opacity: 0;
    }
  }

  .fade-slide-right112 {
    animation: slideRightFade112 1s forwards;
  }

  @keyframes slideRightFade112 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateX(112px);
      opacity: 1;
    }

    100% {
      transform: translateX(112px);
      opacity: 0;
    }
  }

  .fade-slide-left112 {
    animation: slideLeftFade112 1s forwards;
  }

  @keyframes slideLeftFade112 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateX(-112px);
      opacity: 1;
    }

    100% {
      transform: translateX(-112px);
      opacity: 0;
    }
  }

  .fade-slide-bottom120 {
    animation: slideBottomFade120 1s forwards;
  }

  @keyframes slideBottomFade120 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateY(120px);
      opacity: 1;
    }

    100% {
      transform: translateY(120px);
      opacity: 0;
    }
  }

  .fade-slide-right116 {
    animation: slideRightFade116 1s forwards;
  }

  @keyframes slideRightFade116 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateX(116px);
      opacity: 1;
    }

    100% {
      transform: translateX(116px);
      opacity: 0;
    }
  }

  .fade-slide-left116 {
    animation: slideLeftFade116 1s forwards;
  }

  @keyframes slideLeftFade116 {
    0% {
      transform: translateX(0);
      opacity: 1;
    }

    70% {
      transform: translateX(-116px);
      opacity: 1;
    }

    100% {
      transform: translateX(-116px);
      opacity: 0;
    }
  }
}

@media screen and (max-width: 425px) {
  .calendar-block {
    scale: 0.9;
  }

  .advent-container-mobile {
    height: 588px;
    margin-top: -20px;
  }

  .info-block {
    max-width: 373px;
    width: 373px;
  }
}

@media screen and (max-width: 390px) {
  .calendar-block {
    scale: 0.85;
  }

  .advent-container-mobile {
    height: 566px;
    margin-top: -40px;
  }

  .info-block {
    max-width: 352px;
    width: 352px;
  }
}

@media screen and (max-width: 370px) {
  .calendar-block {
    scale: 0.8;
  }

  .advent-container-mobile {
    height: 536px;
    margin-top: -50px;
  }

  .info-block {
    max-width: 331px;
    width: 331px;
  }
}

@media screen and (max-width: 340px) {
  .calendar-block {
    scale: 0.7;
  }
  .advent-container-mobile {
    height: 434px;
    margin-top: -60px;
  }

  .info-block {
    max-width: 290px;
    width: 290px;
  }

  .header {
    font-size: 30px;
  }

  .text {
    font-size: 13px;
  }
}

.b {
  font-weight: 700;
}