body, html {
  margin: 0;
  padding: 0;
  min-height: 100%;
}

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 20px;
  line-height: 145%;
  color: #fff;
  background: url("//static.tonkosti.ru/img/new_year_cards/2017-2018/frost_tile.jpg") #0e0408;
}

h1 {
  font-family: 'Neucha', cursive;
  font-size: 48px;
  line-height: 50px;
}

.cntr {text-align: center;}


@-webkit-keyframes color-change {
  0% {color: #FF0000;}
  14% {color: #f26522;}
  28% {color: #fff200;}
  42% {color: #00a651;}
  56% {color: #28abe2;}
  70% {color: #2e3192;}
  84% {color: #6868ff;}
  100% {color: #FF0000;}
}
@-moz-keyframes color-change {
  0% {color: #FF0000;}
  14% {color: #f26522;}
  28% {color: #fff200;}
  42% {color: #00a651;}
  56% {color: #28abe2;}
  70% {color: #2e3192;}
  84% {color: #6868ff;}
  100% {color: #FF0000;}
}
@-ms-keyframes color-change {
  0% {color: #FF0000;}
  14% {color: #f26522;}
  28% {color: #fff200;}
  42% {color: #00a651;}
  56% {color: #28abe2;}
  70% {color: #2e3192;}
  84% {color: #6868ff;}
  100% {color: #FF0000;}
}
@-o-keyframes color-change {
  0% {color: #FF0000;}
  14% {color: #f26522;}
  28% {color: #fff200;}
  42% {color: #00a651;}
  56% {color: #28abe2;}
  70% {color: #2e3192;}
  84% {color: #6868ff;}
  100% {color: #FF0000;}
}
@keyframes color-change {
  0% {color: #FF0000;}
  14% {color: #f26522;}
  28% {color: #fff200;}
  42% {color: #00a651;}
  56% {color: #28abe2;}
  70% {color: #2e3192;}
  84% {color: #6868ff;}
  100% {color: #FF0000;}
}

a,
a:link,
a:focus,
a:visited  {
  text-decoration: none;
  color: #ff9c00;
}

a:hover,
a:active {
  color: #28abe2;
}

a:hover {
  -webkit-animation: color-change 1s infinite;
  -moz-animation: color-change 1s infinite;
  -o-animation: color-change 1s infinite;
  -ms-animation: color-change 1s infinite;
  animation: color-change 1s infinite;
}

tw-storydata {display:none;}

body, tw-story {font-family: 'Exo 2', sans-serif;}

#passage {
  transition: opacity 600ms ease-in;
  width: 100vw;
  max-width: 1000px;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 10px 10% 40px;
}

@media (min-width: 500px) {#passage {padding: 20px 10% 40px;}}
@media (min-width: 800px) {#passage {padding: 30px 10% 40px;}}
@media (min-width: 1000px) {#passage {padding: 10% 10% 40px;}}

#passage.passage-in {
  opacity: 0;
  transition: opacity 0ms;
}

#passage p:empty {display: none;}

#passage li {
  margin-bottom: 15px;
}

#passage li:last-child {margin-bottom: 0;}

.liveinternet {
  display: block;
}

.liveinternet img {
  display: block;
  opacity: .7;
  margin: 0 auto;
}

.start-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100vw;
  min-height: 100vh;
  box-sizing: border-box;
  padding: 10%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.title-1 {
  font-size: 20px;
  line-height: 20px;
  text-align: center;
}

@media (min-width: 500px) {
  .title-1 {
    font-size: 30px;
    line-height: 30px;
  }
}
@media (min-width: 1000px) {
  .title-1 {
    font-size: 40px;
    line-height: 40px;
  }
}

@-webkit-keyframes wow-shadow {
  0% {text-shadow: 0 0 25px #FF0000;}
  14% {text-shadow: 0 0 25px #f26522;}
  28% {text-shadow: 0 0 25px #fff200;}
  42% {text-shadow: 0 0 25px #00a651;}
  56% {text-shadow: 0 0 25px #28abe2;}
  70% {text-shadow: 0 0 25px #2e3192;}
  84% {text-shadow: 0 0 25px #6868ff;}
  100% {text-shadow: 0 0 25px #FF0000;}
}
@keyframes wow-shadow {
  0% {text-shadow: 0 0 25px #FF0000;}
  14% {text-shadow: 0 0 25px #f26522;}
  28% {text-shadow: 0 0 25px #fff200;}
  42% {text-shadow: 0 0 25px #00a651;}
  56% {text-shadow: 0 0 25px #28abe2;}
  70% {text-shadow: 0 0 25px #2e3192;}
  84% {text-shadow: 0 0 25px #6868ff;}
  100% {text-shadow: 0 0 25px #FF0000;}
}

.title-2 {
  margin: 10px 0 30px;
  font-size: 30px;
  line-height: 30px;
  text-align: center;
  text-shadow: 0 0 15px rgba(255, 255, 255, .7);
  -webkit-animation: wow-shadow 4s infinite;
  animation: wow-shadow 4s infinite;
}

@media (min-width: 500px) {
  .title-2 {
    font-size: 40px;
    line-height: 40px;
  }
}
@media (min-width: 1000px) {
  .title-2 {
    font-size: 50px;
    line-height: 50px;
  }
}

.logo {
  width: 165px;
  height: 59px;
  margin: 0 auto 10px;
}

.with-proud {
  opacity: .8;
  font-size: 16px;
}

.talisman {
  display: block;
  max-width: 600px;
  width: 100%;
  margin: 0 auto;
  border-radius: 3%/5%;
}

.portal {
  margin: 0 auto;
  max-width: 100%;
  border-radius: 50%;
  display: block;
}

@media (min-width: 500px) {
  .portal {margin-top: -10px;}
}
@media (min-width: 800px) {
  .portal {margin-top: -20px;}
}
@media (min-width: 1000px) {
  .portal {margin-top: -8vw;}
}

.giphy-link {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
  font-size: 11px !important;
  color: #686868 !important;

}

.giphy-link:hover {
  -webkit-animation: none;
  animation: none;
}


.social-share {margin: 40px 0 20px; text-align: center;}

.social-share .ya-share2 {display: inline-block; margin: 0 auto;}

.social-share h6 {
  font-size: 16px;
  color: #fff;
  opacity: .5;
  font-weight: normal;
  margin: 0;
  text-align: center;
}

.social-share p:empty {display: none;}



.social-share .ya-share2__container_size_m .ya-share2__icon {
  height: 48px !important;
  width: 48px !important;
}

.social-share .ya-share2__list_direction_horizontal > .ya-share2__item {
  margin-bottom: 8px !important;
  margin-right: 8px !important;
}