body {
  font-family: 'Rubik', sans-serif;
  font-weight: 500;
  font-size: 1em;
  color: #000;
  margin-top: 0;
  margin-bottom: 0;
  background: rgb(245, 248, 255);
  -webkit-font-smoothing: antialiased;
}

@font-face {
  font-family: 'Rubik';
  src: url('/api/ecs/get/rubik/Rubik-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Rubik';
  src: url('/api/ecs/get/rubik/Rubik-Regular.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Rubik';
  src: url('/api/ecs/get/rubik/Rubik-Medium.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Rubik';
  src: url('/api/ecs/get/rubik/Rubik-SemiBold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Rubik';
  src: url('/api/ecs/get/rubik/Rubik-Bold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
}

h1 {
  font-weight: 800;
  font-size: 2.4em;
  padding: 0;
  margin: 0;
  display: inline;
}
h2 {
  font-weight: 600;
  font-size: 2.2em;
  padding: 0;
  margin: 0;
  display: inline;
}
h3 {
  font-weight: 600;
  font-size: 1.6em;
  padding: 0;
  margin: 0;
  display: inline;
}
h4 {
  font-weight: 400;
  font-size: 1.2em;
  padding: 0;
  margin: 0;
  display: inline;
}
h5 {
  font-weight: 600;
  font-size: 1.2em;
  padding: 0;
  margin: 0;
  display: inline;
}

.nw {white-space: nowrap}
.line {box-shadow: 0 -1px rgba(0,0,0,0.1);}
.shadow {box-shadow: 0 .1em .1em 0 rgba(204,204,204,.3), 0 .2em .2em 0 rgba(204,204,204,.2), 0 .4em .4em 0 rgba(204,204,204,.1);}
.shadow-text {text-shadow: 0em .2em .2em rgba(130, 61, 27, 0.3); }
.mono {font-family: monospace;}

.line-top {box-shadow: 0 -1px rgba(0,0,0,1)}
.line-center {box-shadow: 0 -1px rgb(245, 248, 255), -1px 0 rgb(245, 248, 255), 1px 0 rgb(245, 248, 255)}


.round-5 {border-radius: .5em;}
.round-10 {border-radius: 1em;}
.round-15 {border-radius: 1.5em;}
.round-20 {border-radius: 2em;}

a:link, a:visited, a:focus, a:hover, a:active {
  font-size: 1em;
  word-break: normal;
  text-decoration: none;
  outline: none;
  color: #fff;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -moz-tap-highlight-color: rgba(0,0,0,0);
}
a.link-blue:link, a.link-blue:visited, a.link-blue:focus, a.link-blue:hover, a.link-blue:active {color: #0099FF;}
a.link-black:link, a.link-black:visited, a.link-black:focus, a.link-black:hover, a.link-black:active {color: #000;}

.btn-light {
  background-color: rgba(0,153,255,0.1);
  border-radius: 1.25em;
  padding: 1.5em;
}

.btn-white {
  background-color: #fff;
  border-radius: 1.25em;
  padding: 1.5em;
  box-shadow: 0 .1em .1em 0 rgba(204,204,204,.3), 0 .2em .2em 0 rgba(204,204,204,.2), 0 .4em .4em 0 rgba(204,204,204,.1);
}

.btn-orange {
  background-color: #FF5C00;
  border-radius: 1.25em;
  padding: 1.5em;
  box-shadow: 0 .1em .1em 0 rgba(255,51,0,.3), 0 .2em .2em 0 rgba(255,51,0,.2), 0 .4em .4em 0 rgba(255,51,0,.1);
}

.cell {
  background-image: radial-gradient( circle farthest-corner at 100% 0%,  rgba(255,209,67,1) 0%, rgba(255,145,83,1) 50% );
  border-radius: 2em;
  padding: 2em;
  box-shadow: 0 .2em .2em 0 rgba(204,102,51,0.2), 0 .4em .4em 0 rgba(204,102,51,.1), 0 .8em .8em 0 rgba(204,102,51,.1);
}

.cell-kids {
  background-image: radial-gradient( circle farthest-corner at 100% 0%, rgba(228,107,232,1) 0%, rgba(87,27,226,1) 80% );
  border-radius: 2em;
  padding: 2em;
  box-shadow: 0 .2em .2em 0 rgba(102,0,255,0.2), 0 .4em .4em 0 rgba(102,0,255,.1), 0 .8em .8em 0 rgba(102,0,255,.1);
}

.cell-code {
  background: #000;
  border-radius: 2em;
  padding: 1.5em;
}

.cell-light {
  background-color: rgba(0,153,255,0.1);
  border-radius: 2em;
  padding: 1.5em;
}

.cell-purple {
  background-color: #6633FF;
  border-radius: 2em;
  padding: 1.5em;
}

.cell-gradient {
  border-radius: 2em;
  padding: 1.5em;
  background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(253, 187, 45, .1) 100%);
}

.cell-warning {
  background-color: rgba(255,102,0,0.1);
  border-radius: 2em;
  padding: 1.5em;
}

.padding-0 {  padding: 0 !important;}
.padding-10 { padding: 1em !important;}
.padding-15 { padding: 1.5em !important;}
.padding-20 { padding: 2em !important;}

.disabled {cursor: default;}
.cell-disabled {opacity: 0.5;}

.hidden {opacity: 0;}
.hide {display: none;}

.fix-anchor-price {padding-right: 1em;}
.anchor-price {
  color: rgba(255,255,255,.7);
  position: relative;
  display: inline-block;
  font-size: 1.8em;
  font-weight: 600;
}
.anchor-price img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;         
  height: 100%;
  pointer-events: none;
}

.img-fix {transform: translateY(1.5em);}

.footer {
  border-radius: 2em 2em 0 0;
  background-color: #000;
}

.tag {
    background: #FF5C00;
    padding: .2em .4em;
    border-radius: .5em;
    color: #fff;
    white-space: nowrap;
    display: inline-block;
}

.tag-orange {
    background: #FF5C00;
    padding: .5em 1em;
    border-radius: 2em;
    color: #fff;
    white-space: nowrap;
    display: inline-block;
}

.tag-black {
    background: #000;
    padding: .5em 1em;
    border-radius: 2em;
    color: #fff;
    white-space: nowrap;
    display: inline-block;
}

.tag-footer {
    background: rgba(255,255,255,.2);
    padding: .5em 1em;
    border-radius: 2em;
    color: #fff;
    white-space: nowrap;
    display: inline-block;
    margin: .5em .25em;
}

.tag-light {
    background-color: rgba(0,153,255,0.1);
    padding: .5em 1em;
    border-radius: 2em;
    color: #0099FF;
    white-space: nowrap;
    display: inline-block;
}

.tag-purple {
    background-color: #6633FF;
    padding: .5em 1em;
    border-radius: 2em;
    color: #fff;
    white-space: nowrap;
    display: inline-block;
}

#city {
    display: inline-block;
    transition: opacity 1s ease;
}

.hit {
  -webkit-animation: slidein 1s; /* Safari, Chrome and Opera > 12.1 */
     -moz-animation: slidein 1s; /* Firefox < 16 */
      -ms-animation: slidein 1s; /* Arialnet Explorer */
       -o-animation: slidein 1s; /* Opera < 12.1 */
          animation: slidein 1s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  background-color: red;
  border-radius: .2em;
}

.hit-hide {
  -webkit-animation: slidein 1s; /* Safari, Chrome and Opera > 12.1 */
     -moz-animation: slidein 1s; /* Firefox < 16 */
      -ms-animation: slidein 1s; /* Arialnet Explorer */
       -o-animation: slidein 1s; /* Opera < 12.1 */
          animation: slidein 1s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  background-color: transparent;
  border-radius: .2em;
}

.purple { color: #6633FF;}
.orange { color: #FF5C00;}
.green {  color: #009933;}
.blue {   color: #0099FF;}
.black {  color: #000;}
.white {  color: #fff;}
.white-50 { color: rgba(255,255,255,.5);}

.black-bg {   background-color: #000;}
.purple-bg {  background-color: #6633FF;}

.purple-radial {
  background: radial-gradient(closest-side,#6633FF, rgb(245, 248, 255));
}

.full {width: 100%;}

.icon { height: 1.2em;}
.fav {  max-height: 3em;}
.logo { max-height: 5em;}
.img {  max-height: 10em;}
.img-social {
    height: 3em;
    padding: 1em;
}
.img-partner {
    height: 5em;
    padding: 1em;
    opacity: .5;
}

.top-5 {    padding-top: .5em;}
.bottom-5 { padding-bottom: .5em;}
.top-10 {   padding-top: 1em;}
.bottom-10 {padding-bottom: 1em;}
.top-20 {   padding-top: 2em;}
.bottom-20 {padding-bottom: 2em;}
.top-40 {   padding-top: 4em;}
.bottom-40 {padding-bottom: 4em;}

.btn-white-input {
  font-family: 'Rubik', sans-serif;
  font-weight: 600;
  font-size: 1.2em;
  margin: 0;
  display: inline;
  text-align: center;
  color: #000;

  cursor: pointer;
  width: 100%;
  background-color: #fff;
  border-radius: 1.25em;
  padding: 1.5em;
  box-shadow: 0 .1em .1em 0 rgba(204,204,204,.3), 0 .2em .2em 0 rgba(204,204,204,.2), 0 .4em .4em 0 rgba(204,204,204,.1);
  border: none;
  outline: none;
}


.input-light {
  font-family: 'Rubik', sans-serif;
  font-weight: 600;
  font-size: 1.2em;
  margin: 0;
  display: inline;
  text-align: center;
  color: #000;
 
  width: 100%;
  box-shadow: inset 0 .1em .1em 0 rgba(204,204,204,.5), inset 0 .2em .2em 0 rgba(204,204,204,.3), inset 0 .4em .4em 0 rgba(204,204,204,.2);
  border-radius: 1.25em;
  padding: 1.5em;
  border: none;
  outline: none;
}
.input-light::placeholder {color: rgba(0,0,0,0.25);}
.input-light:focus::placeholder {color: rgba(0,0,0,0.25);}

select {
  font-family: 'Rubik', sans-serif;
  font-weight: 500;
  font-size: 1em;
	border: none; 
  background-color: #fff;
	cursor: pointer; 
  padding: 1em;
  width: 100%;
  border-radius: 1em;
  outline: none;
  color: #000;
  box-shadow: inset 0 .1em .1em 0 rgba(204,204,204,.5), inset 0 .2em .2em 0 rgba(204,204,204,.3), inset 0 .4em .4em 0 rgba(204,204,204,.2);
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -moz-tap-highlight-color: rgba(0,0,0,0);
}

.map {
  border-radius: 1.5rem !important;
  width:100%;
  aspect-ratio: 4/2;
  box-shadow: 0 1em 1em rgba(0,102,255,0.10);
}

.map-yandex {
  border-radius: 1.5rem !important;
  overflow: hidden;
  box-shadow: 0 1em 1em rgba(0,102,255,0.10);
}

.color-line {       box-shadow: 0 .1em .1em 0 rgba(204,204,204,.3), 0 .2em .2em 0 rgba(204,204,204,.2), 0 .4em .4em 0 rgba(204,204,204,.1);}
.color-line-blue {  box-shadow: 0 .1em .1em 0 rgba(0,153,255,.3), 0 .2em .2em 0 rgba(0,153,255,.2), 0 .4em .4em 0 rgba(0,153,255,.1);}
.color-line-violet {box-shadow: 0 .1em .1em 0 rgba(153,0,255,.3), 0 .2em .2em 0 rgba(153,0,255,.2), 0 .4em .4em 0 rgba(153,0,255,.1);}
.color-line-cherry {box-shadow: 0 .1em .1em 0 rgba(204,51,102,.3), 0 .2em .2em 0 rgba(204,51,102,.2), 0 .4em .4em 0 rgba(204,51,102,.1);}
.color-line-tiger { box-shadow: 0 .1em .1em 0 rgba(255,153,0,.3), 0 .2em .2em 0 rgba(255,153,0,.2), 0 .4em .4em 0 rgba(255,153,0,.1);}
.color-line-orange {box-shadow: 0 .1em .1em 0 rgba(255,153,0,.3), 0 .2em .2em 0 rgba(255,153,0,.2), 0 .4em .4em 0 rgba(255,153,0,.1);}

.fade {
    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Arialnet Explorer */
         -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
}

@keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@-webkit-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes slidein {
  from { box-shadow: 0 0 0 .25em red; }
  to   { box-shadow: 0 0 0 .35em red; }
}
@-webkit-keyframes slidein {
  from { box-shadow: 0 0 0 .25em red; }
  to   { box-shadow: 0 0 0 .35em red; }
}

.checkbox-wrapper-5 .check {
  --size: 40px;

  position: relative;
  background: #00CC00;
  line-height: 0;
  perspective: 400px;
  font-size: var(--size);
}

.checkbox-wrapper-5 .check input[type="checkbox"],
.checkbox-wrapper-5 .check label,
.checkbox-wrapper-5 .check label::before,
.checkbox-wrapper-5 .check label::after,
.checkbox-wrapper-5 .check {
  appearance: none;
  display: inline-block;
  border-radius: var(--size);
  border: 0;
  transition: .35s ease-in-out;
  box-sizing: border-box;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -moz-tap-highlight-color: rgba(0,0,0,0);
}

.checkbox-wrapper-5 .check label {
  width: calc(1.8 * var(--size));
  height: var(--size);
  background: #CCCCCC;
  overflow: hidden;
}

.checkbox-wrapper-5 .check input[type="checkbox"] {
  position: absolute;
  z-index: 1;
  width: calc(.8 * var(--size));
  height: calc(.8 * var(--size));
  top: calc(.1 * var(--size));
  left: calc(.1 * var(--size));
  background: linear-gradient(45deg, #dedede, #ffffff);
  box-shadow: 0 6px 7px rgba(0,0,0,0.3);
  outline: none;
  margin: 0;
}

.checkbox-wrapper-5 .check input[type="checkbox"]:checked {
  left: calc(0.9 * var(--size));
}

.checkbox-wrapper-5 .check input[type="checkbox"]:checked + label {
  background: transparent;
}

.checkbox-wrapper-5 .check label::before,
.checkbox-wrapper-5 .check label::after {
  content: "· ·";
  position: absolute;
  overflow: hidden;
  left: calc(.15 * var(--size));
  top: calc(.5 * var(--size));
  height: var(--size);
  letter-spacing: calc(-0.04 * var(--size));
  color: #9b9b9b;
  font-family: "Times New Roman", serif;
  z-index: 2;
  font-size: calc(.6 * var(--size));
  border-radius: 0;
  transform-origin: 0 0 calc(-0.5 * var(--size));
  backface-visibility: hidden;
}

.checkbox-wrapper-5 .check label::after {
  content: "●";
  top: calc(.65 * var(--size));
  left: calc(.2 * var(--size));
  height: calc(.1 * var(--size));
  width: calc(.35 * var(--size));
  font-size: calc(.2 * var(--size));
  transform-origin: 0 0 calc(-0.4 * var(--size));
}

.checkbox-wrapper-5 .check input[type="checkbox"]:checked + label::before,
.checkbox-wrapper-5 .check input[type="checkbox"]:checked + label::after {
  left: calc(1.15 * var(--size));
  top: calc(.4 * var(--size));
  line-height: calc(.1 * var(--size));
  transform: rotateY(360deg);
}

.checkbox-wrapper-5 .check input[type="checkbox"]:checked + label::after {
  height: calc(.16 * var(--size));
  top: calc(.55 * var(--size));
  left: calc(1.2 * var(--size));
  font-size: calc(.6 * var(--size));
  line-height: 0;
}

.rules-box {
  transition: all 0.3s ease;
}
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-8px); }
  40%, 80% { transform: translateX(8px); }
}
.shake {
  animation: shake 0.5s;
}