@charset "UTF-8";
@import url(/bower_components/normalize-css/normalize.css);
.black, h3 {
  color: #393836; }

.dark-blue {
  color: #354452; }

.light-blue, a:hover {
  color: #6895ab; }

.brown, a, .header__nav a, h4, h5, ol li .date {
  color: #7b6059; }

.light {
  color: #f2eeee; }

@font-face {
  font-family: 'Shire-Worcestershire';
  src: url("../fonts/shire/ShireTypesPro-Worcestershire.eot");
  src: local("ShireTypesPro-Worcestershire"), url("../fonts/shire/ShireTypesPro-Worcestershire.eot?#iefix") format("embedded-opentype"), url("../fonts/shire/ShireTypesPro-Worcestershire.woff") format("woff"), url("../fonts/shire/ShireTypesPro-Worcestershire.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'belomorie-script';
  src: url("../fonts/belomorie-script/belomorie-script.woff2") format("woff2"), url("../fonts/belomorie-script/belomorie-script.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

.serif {
  font-family: 'Alegreya', serif; }

.sans, body {
  font-family: 'Alegreya Sans', sans-serif;
  font-weight: 400; }

.bold, h3, h4, h5, ol li .title, ol li .date, strong, .header__nav ul {
  font-family: 'Alegreya Sans', sans-serif;
  font-weight: 800; }

.belomorie, h1, h2 {
  font-family: 'belomorie-script', helvetica neue, arial, sans-serif; }

p {
  font-size: 1.5rem;
  line-height: 1.5; }
  p.small, p.fullwidth-author {
    font-size: .8rem;
    opacity: .8; }

a, .header__nav a {
  text-decoration: none;
  border-bottom: 1px solid #c2b0ab; }
  a:hover {
    border-bottom: 1px solid inherit; }
  a[href^='#'] {
    border-bottom-style: dashed; }
  a img, .header__nav a img {
    vertical-align: middle;
    border: none; }

h1 {
  font-size: 3rem;
  padding: 0;
  margin: 0; }

h2 {
  font-size: 1.5rem;
  line-height: 1.35;
  font-weight: normal;
  padding: 0; }

h3 {
  font-size: 1.5rem;
  font-weight: normal;
  margin-top: .5em;
  padding: 0; }

h4 {
  font-size: 1.5rem;
  font-weight: normal;
  margin: 1.5rem 0 0 .2rem;
  padding: 0;
  display: inline-block; }

h5 {
  font-size: 1/rem;
  font-weight: normal;
  margin: 1.5rem 0 0 .2rem;
  padding: 0;
  display: inline-block; }

ul {
  text-align: left; }
  ul li {
    font-size: 2rem;
    line-height: 1.3;
    list-style-type: none;
    padding-bottom: 1.5rem; }
    ul li::before {
      content: '— ';
      margin-left: -1.2em; }
    ul li.no-before::before {
      content: '';
      margin-left: -.32em; }

ol {
  text-align: left;
  list-style-position: outside;
  margin-left: -1rem;
  width: 100%; }
  ol li {
    font-size: 1.5rem;
    line-height: 1.5;
    padding-bottom: 1.5rem; }
    ol li .title {
      display: block;
      margin-bottom: .3rem; }
    ol li .date {
      font-size: 1rem;
      display: block;
      margin: 0 0 .6rem; }

.quotes::before {
  content: '«'; }

.quotes::after {
  content: '»';
  display: inline; }

.emdash {
  display: block; }
  .emdash::before {
    content: '— ';
    margin-left: -1.3em; }

.asterisk {
  display: inline-block;
  -webkit-transform: translate(0, 0.4em);
          transform: translate(0, 0.4em); }

.rot5 {
  -webkit-transform: rotate(5deg);
          transform: rotate(5deg); }

.rot10 {
  -webkit-transform: rotate(10deg);
          transform: rotate(10deg); }

.rot15 {
  -webkit-transform: rotate(15deg);
          transform: rotate(15deg); }

.rot20 {
  -webkit-transform: rotate(20deg);
          transform: rotate(20deg); }

.rot25 {
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg); }

.rot30 {
  -webkit-transform: rotate(30deg);
          transform: rotate(30deg); }

.rot35 {
  -webkit-transform: rotate(35deg);
          transform: rotate(35deg); }

.rot40 {
  -webkit-transform: rotate(40deg);
          transform: rotate(40deg); }

.rot45 {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg); }

.rot50 {
  -webkit-transform: rotate(50deg);
          transform: rotate(50deg); }

.rot55 {
  -webkit-transform: rotate(55deg);
          transform: rotate(55deg); }

.rot60 {
  -webkit-transform: rotate(60deg);
          transform: rotate(60deg); }

.rot65 {
  -webkit-transform: rotate(65deg);
          transform: rotate(65deg); }

.rot70 {
  -webkit-transform: rotate(70deg);
          transform: rotate(70deg); }

.rot75 {
  -webkit-transform: rotate(75deg);
          transform: rotate(75deg); }

.rot80 {
  -webkit-transform: rotate(80deg);
          transform: rotate(80deg); }

.rot85 {
  -webkit-transform: rotate(85deg);
          transform: rotate(85deg); }

.rot90 {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg); }

.rot95 {
  -webkit-transform: rotate(95deg);
          transform: rotate(95deg); }

.rot100 {
  -webkit-transform: rotate(100deg);
          transform: rotate(100deg); }

.rot105 {
  -webkit-transform: rotate(105deg);
          transform: rotate(105deg); }

.rot110 {
  -webkit-transform: rotate(110deg);
          transform: rotate(110deg); }

.rot115 {
  -webkit-transform: rotate(115deg);
          transform: rotate(115deg); }

.rot120 {
  -webkit-transform: rotate(120deg);
          transform: rotate(120deg); }

.rot125 {
  -webkit-transform: rotate(125deg);
          transform: rotate(125deg); }

.rot130 {
  -webkit-transform: rotate(130deg);
          transform: rotate(130deg); }

.rot135 {
  -webkit-transform: rotate(135deg);
          transform: rotate(135deg); }

.rot140 {
  -webkit-transform: rotate(140deg);
          transform: rotate(140deg); }

.rot145 {
  -webkit-transform: rotate(145deg);
          transform: rotate(145deg); }

.rot150 {
  -webkit-transform: rotate(150deg);
          transform: rotate(150deg); }

.rot155 {
  -webkit-transform: rotate(155deg);
          transform: rotate(155deg); }

.rot160 {
  -webkit-transform: rotate(160deg);
          transform: rotate(160deg); }

.rot165 {
  -webkit-transform: rotate(165deg);
          transform: rotate(165deg); }

.rot170 {
  -webkit-transform: rotate(170deg);
          transform: rotate(170deg); }

.rot175 {
  -webkit-transform: rotate(175deg);
          transform: rotate(175deg); }

.rot180 {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg); }

.rot185 {
  -webkit-transform: rotate(185deg);
          transform: rotate(185deg); }

.rot190 {
  -webkit-transform: rotate(190deg);
          transform: rotate(190deg); }

.rot195 {
  -webkit-transform: rotate(195deg);
          transform: rotate(195deg); }

.rot200 {
  -webkit-transform: rotate(200deg);
          transform: rotate(200deg); }

.rot205 {
  -webkit-transform: rotate(205deg);
          transform: rotate(205deg); }

.rot210 {
  -webkit-transform: rotate(210deg);
          transform: rotate(210deg); }

.rot215 {
  -webkit-transform: rotate(215deg);
          transform: rotate(215deg); }

.rot220 {
  -webkit-transform: rotate(220deg);
          transform: rotate(220deg); }

.rot225 {
  -webkit-transform: rotate(225deg);
          transform: rotate(225deg); }

.rot230 {
  -webkit-transform: rotate(230deg);
          transform: rotate(230deg); }

.rot235 {
  -webkit-transform: rotate(235deg);
          transform: rotate(235deg); }

.rot240 {
  -webkit-transform: rotate(240deg);
          transform: rotate(240deg); }

.rot245 {
  -webkit-transform: rotate(245deg);
          transform: rotate(245deg); }

.rot250 {
  -webkit-transform: rotate(250deg);
          transform: rotate(250deg); }

.rot255 {
  -webkit-transform: rotate(255deg);
          transform: rotate(255deg); }

.rot260 {
  -webkit-transform: rotate(260deg);
          transform: rotate(260deg); }

.rot265 {
  -webkit-transform: rotate(265deg);
          transform: rotate(265deg); }

.rot270 {
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg); }

.rot275 {
  -webkit-transform: rotate(275deg);
          transform: rotate(275deg); }

.rot280 {
  -webkit-transform: rotate(280deg);
          transform: rotate(280deg); }

.rot285 {
  -webkit-transform: rotate(285deg);
          transform: rotate(285deg); }

.rot290 {
  -webkit-transform: rotate(290deg);
          transform: rotate(290deg); }

.rot295 {
  -webkit-transform: rotate(295deg);
          transform: rotate(295deg); }

.rot300 {
  -webkit-transform: rotate(300deg);
          transform: rotate(300deg); }

.rot305 {
  -webkit-transform: rotate(305deg);
          transform: rotate(305deg); }

.rot310 {
  -webkit-transform: rotate(310deg);
          transform: rotate(310deg); }

.rot315 {
  -webkit-transform: rotate(315deg);
          transform: rotate(315deg); }

.rot320 {
  -webkit-transform: rotate(320deg);
          transform: rotate(320deg); }

.rot325 {
  -webkit-transform: rotate(325deg);
          transform: rotate(325deg); }

.rot330 {
  -webkit-transform: rotate(330deg);
          transform: rotate(330deg); }

.rot335 {
  -webkit-transform: rotate(335deg);
          transform: rotate(335deg); }

.rot340 {
  -webkit-transform: rotate(340deg);
          transform: rotate(340deg); }

.rot345 {
  -webkit-transform: rotate(345deg);
          transform: rotate(345deg); }

.rot350 {
  -webkit-transform: rotate(350deg);
          transform: rotate(350deg); }

.rot355 {
  -webkit-transform: rotate(355deg);
          transform: rotate(355deg); }

.rot360 {
  -webkit-transform: rotate(360deg);
          transform: rotate(360deg); }

.rot-5 {
  -webkit-transform: rotate(-5deg);
          transform: rotate(-5deg); }

.rot-10 {
  -webkit-transform: rotate(-10deg);
          transform: rotate(-10deg); }

.rot-15 {
  -webkit-transform: rotate(-15deg);
          transform: rotate(-15deg); }

.rot-20 {
  -webkit-transform: rotate(-20deg);
          transform: rotate(-20deg); }

.rot-25 {
  -webkit-transform: rotate(-25deg);
          transform: rotate(-25deg); }

.rot-30 {
  -webkit-transform: rotate(-30deg);
          transform: rotate(-30deg); }

.rot-35 {
  -webkit-transform: rotate(-35deg);
          transform: rotate(-35deg); }

.rot-40 {
  -webkit-transform: rotate(-40deg);
          transform: rotate(-40deg); }

.rot-45 {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg); }

.rot-50 {
  -webkit-transform: rotate(-50deg);
          transform: rotate(-50deg); }

.rot-55 {
  -webkit-transform: rotate(-55deg);
          transform: rotate(-55deg); }

.rot-60 {
  -webkit-transform: rotate(-60deg);
          transform: rotate(-60deg); }

.rot-65 {
  -webkit-transform: rotate(-65deg);
          transform: rotate(-65deg); }

.rot-70 {
  -webkit-transform: rotate(-70deg);
          transform: rotate(-70deg); }

.rot-75 {
  -webkit-transform: rotate(-75deg);
          transform: rotate(-75deg); }

.rot-80 {
  -webkit-transform: rotate(-80deg);
          transform: rotate(-80deg); }

.rot-85 {
  -webkit-transform: rotate(-85deg);
          transform: rotate(-85deg); }

.rot-90 {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg); }

.rot-95 {
  -webkit-transform: rotate(-95deg);
          transform: rotate(-95deg); }

.rot-100 {
  -webkit-transform: rotate(-100deg);
          transform: rotate(-100deg); }

.rot-105 {
  -webkit-transform: rotate(-105deg);
          transform: rotate(-105deg); }

.rot-110 {
  -webkit-transform: rotate(-110deg);
          transform: rotate(-110deg); }

.rot-115 {
  -webkit-transform: rotate(-115deg);
          transform: rotate(-115deg); }

.rot-120 {
  -webkit-transform: rotate(-120deg);
          transform: rotate(-120deg); }

.rot-125 {
  -webkit-transform: rotate(-125deg);
          transform: rotate(-125deg); }

.rot-130 {
  -webkit-transform: rotate(-130deg);
          transform: rotate(-130deg); }

.rot-135 {
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg); }

.rot-140 {
  -webkit-transform: rotate(-140deg);
          transform: rotate(-140deg); }

.rot-145 {
  -webkit-transform: rotate(-145deg);
          transform: rotate(-145deg); }

.rot-150 {
  -webkit-transform: rotate(-150deg);
          transform: rotate(-150deg); }

.rot-155 {
  -webkit-transform: rotate(-155deg);
          transform: rotate(-155deg); }

.rot-160 {
  -webkit-transform: rotate(-160deg);
          transform: rotate(-160deg); }

.rot-165 {
  -webkit-transform: rotate(-165deg);
          transform: rotate(-165deg); }

.rot-170 {
  -webkit-transform: rotate(-170deg);
          transform: rotate(-170deg); }

.rot-175 {
  -webkit-transform: rotate(-175deg);
          transform: rotate(-175deg); }

.rot-180 {
  -webkit-transform: rotate(-180deg);
          transform: rotate(-180deg); }

.rot-185 {
  -webkit-transform: rotate(-185deg);
          transform: rotate(-185deg); }

.rot-190 {
  -webkit-transform: rotate(-190deg);
          transform: rotate(-190deg); }

.rot-195 {
  -webkit-transform: rotate(-195deg);
          transform: rotate(-195deg); }

.rot-200 {
  -webkit-transform: rotate(-200deg);
          transform: rotate(-200deg); }

.rot-205 {
  -webkit-transform: rotate(-205deg);
          transform: rotate(-205deg); }

.rot-210 {
  -webkit-transform: rotate(-210deg);
          transform: rotate(-210deg); }

.rot-215 {
  -webkit-transform: rotate(-215deg);
          transform: rotate(-215deg); }

.rot-220 {
  -webkit-transform: rotate(-220deg);
          transform: rotate(-220deg); }

.rot-225 {
  -webkit-transform: rotate(-225deg);
          transform: rotate(-225deg); }

.rot-230 {
  -webkit-transform: rotate(-230deg);
          transform: rotate(-230deg); }

.rot-235 {
  -webkit-transform: rotate(-235deg);
          transform: rotate(-235deg); }

.rot-240 {
  -webkit-transform: rotate(-240deg);
          transform: rotate(-240deg); }

.rot-245 {
  -webkit-transform: rotate(-245deg);
          transform: rotate(-245deg); }

.rot-250 {
  -webkit-transform: rotate(-250deg);
          transform: rotate(-250deg); }

.rot-255 {
  -webkit-transform: rotate(-255deg);
          transform: rotate(-255deg); }

.rot-260 {
  -webkit-transform: rotate(-260deg);
          transform: rotate(-260deg); }

.rot-265 {
  -webkit-transform: rotate(-265deg);
          transform: rotate(-265deg); }

.rot-270 {
  -webkit-transform: rotate(-270deg);
          transform: rotate(-270deg); }

.rot-275 {
  -webkit-transform: rotate(-275deg);
          transform: rotate(-275deg); }

.rot-280 {
  -webkit-transform: rotate(-280deg);
          transform: rotate(-280deg); }

.rot-285 {
  -webkit-transform: rotate(-285deg);
          transform: rotate(-285deg); }

.rot-290 {
  -webkit-transform: rotate(-290deg);
          transform: rotate(-290deg); }

.rot-295 {
  -webkit-transform: rotate(-295deg);
          transform: rotate(-295deg); }

.rot-300 {
  -webkit-transform: rotate(-300deg);
          transform: rotate(-300deg); }

.rot-305 {
  -webkit-transform: rotate(-305deg);
          transform: rotate(-305deg); }

.rot-310 {
  -webkit-transform: rotate(-310deg);
          transform: rotate(-310deg); }

.rot-315 {
  -webkit-transform: rotate(-315deg);
          transform: rotate(-315deg); }

.rot-320 {
  -webkit-transform: rotate(-320deg);
          transform: rotate(-320deg); }

.rot-325 {
  -webkit-transform: rotate(-325deg);
          transform: rotate(-325deg); }

.rot-330 {
  -webkit-transform: rotate(-330deg);
          transform: rotate(-330deg); }

.rot-335 {
  -webkit-transform: rotate(-335deg);
          transform: rotate(-335deg); }

.rot-340 {
  -webkit-transform: rotate(-340deg);
          transform: rotate(-340deg); }

.rot-345 {
  -webkit-transform: rotate(-345deg);
          transform: rotate(-345deg); }

.rot-350 {
  -webkit-transform: rotate(-350deg);
          transform: rotate(-350deg); }

.rot-355 {
  -webkit-transform: rotate(-355deg);
          transform: rotate(-355deg); }

.rot-360 {
  -webkit-transform: rotate(-360deg);
          transform: rotate(-360deg); }

.scale-09 {
  -webkit-transform: scale(0.9);
          transform: scale(0.9); }

.scale-08 {
  -webkit-transform: scale(0.8);
          transform: scale(0.8); }

.scale-07 {
  -webkit-transform: scale(0.7);
          transform: scale(0.7); }

.scale-06 {
  -webkit-transform: scale(0.6);
          transform: scale(0.6); }

.scale-05 {
  -webkit-transform: scale(0.5);
          transform: scale(0.5); }

.scale-04 {
  -webkit-transform: scale(0.4);
          transform: scale(0.4); }

.scale-03 {
  -webkit-transform: scale(0.3);
          transform: scale(0.3); }

.scale-02 {
  -webkit-transform: scale(0.2);
          transform: scale(0.2); }

.scale-01 {
  -webkit-transform: scale(0.1);
          transform: scale(0.1); }

.fullwidth {
  width: 100vw;
  margin: 5rem auto; }
  .fullwidth img {
    width: 100%; }
  .fullwidth-author {
    width: 1000px;
    margin: 0 auto; }

.width1000 {
  width: 1000px;
  position: relative;
  margin: 0 auto;
  text-align: center; }

.mir {
  -webkit-transform: scaleX(-1);
          transform: scaleX(-1);
  -webkit-filter: FlipH;
          filter: FlipH; }

.trans {
  -webkit-transition: all .4s;
  transition: all .4s; }

.transparent {
  pointer-events: none; }

.margin-auto {
  margin: 0 auto; }

.will-change {
  will-change: transform;
  -webkit-transform: translateZ(0);
          transform: translateZ(0); }

.clearfix {
  display: block;
  zoom: 1; }
  .clearfix:after {
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    clear: both;
    visibility: hidden; }

.absolute, .header-logo, .index-information__creators, .index-information__thanks {
  position: absolute; }

.relate, .header__nav .logo, .index-information {
  position: relative; }

.center, h3 {
  text-align: center; }

.fixed {
  position: fixed; }

.flex-centered {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-box-align: baseline;
  -webkit-align-items: baseline;
          align-items: baseline;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-flow: row;
          flex-flow: row; }

.hidden {
  display: none;
  visibility: hidden; }

@media screen and (max-width: 1000px) {
  .no-mobile {
    opacity: 0;
    display: none;
    visibility: hidden; } }

.no-border {
  border: 0px; }

.active {
  text-decoration: none;
  pointer-events: none;
  opacity: .5; }
  .active a {
    border-bottom: 0px solid #7891a8; }

.rotates {
  -webkit-animation: rotates 20s linear 0s infinite normal;
          animation: rotates 20s linear 0s infinite normal; }
  .rotates.normal {
    -webkit-animation-duration: 10s;
            animation-duration: 10s; }
  .rotates.slow {
    -webkit-animation-duration: 30s;
            animation-duration: 30s; }
  .rotates.redsquare {
    -webkit-animation-duration: 300s;
            animation-duration: 300s; }

@-webkit-keyframes rotates {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }
            
@-moz-keyframes rotates { 100% { -moz-transform: rotate(360deg); } }            

@keyframes rotates {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

.blurry {
  -webkit-animation: blurry 8s linear 0s infinite alternate;
          animation: blurry 8s linear 0s infinite alternate; }

@-webkit-keyframes blurry {
  0% {
    -webkit-filter: blur(0px);
            filter: blur(0px); }
  20% {
    -webkit-filter: blur(6px);
            filter: blur(6px); }
  40% {
    -webkit-filter: blur(3px);
            filter: blur(3px); }
  60% {
    -webkit-filter: blur(5px);
            filter: blur(5px); }
  80% {
    -webkit-filter: blur(1px);
            filter: blur(1px); }
  100% {
    -webkit-filter: blur(7px);
            filter: blur(7px); } }

@keyframes blurry {
  0% {
    -webkit-filter: blur(0px);
            filter: blur(0px); }
  20% {
    -webkit-filter: blur(6px);
            filter: blur(6px); }
  40% {
    -webkit-filter: blur(3px);
            filter: blur(3px); }
  60% {
    -webkit-filter: blur(5px);
            filter: blur(5px); }
  80% {
    -webkit-filter: blur(1px);
            filter: blur(1px); }
  100% {
    -webkit-filter: blur(7px);
            filter: blur(7px); } }

.hover {
  -webkit-animation: hover 4s ease-in-out 0s infinite alternate;
          animation: hover 4s ease-in-out 0s infinite alternate; }

@-webkit-keyframes hover {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  100% {
    -webkit-transform: translate(0, 1em);
            transform: translate(0, 1em); } }

@keyframes hover {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  100% {
    -webkit-transform: translate(0, 1em);
            transform: translate(0, 1em); } }

.glow {
  -webkit-animation: glow 4s ease-in-out 0s infinite alternate;
          animation: glow 4s ease-in-out 0s infinite alternate; }

@-webkit-keyframes glow {
  0% {
    opacity: .6; }
  100% {
    opacity: 1; } }

@keyframes glow {
  0% {
    opacity: .6; }
  100% {
    opacity: 1; } }

.wind {
  -webkit-animation: wind 5s ease-in-out 0s infinite alternate;
          animation: wind 5s ease-in-out 0s infinite alternate;
  -webkit-transform-origin: bottom center;
          transform-origin: bottom center; }

@-webkit-keyframes wind {
  0% {
    -webkit-transform: rotate(-7deg);
            transform: rotate(-7deg); }
  100% {
    -webkit-transform: rotate(7deg);
            transform: rotate(7deg); } }

@keyframes wind {
  0% {
    -webkit-transform: rotate(-7deg);
            transform: rotate(-7deg); }
  100% {
    -webkit-transform: rotate(7deg);
            transform: rotate(7deg); } }

.left-right {
  -webkit-animation: left-right 3s ease-in-out 0s infinite alternate;
          animation: left-right 3s ease-in-out 0s infinite alternate; }

@-webkit-keyframes left-right {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  100% {
    -webkit-transform: translate(-1em, 0);
            transform: translate(-1em, 0); } }

@keyframes left-right {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  100% {
    -webkit-transform: translate(-1em, 0);
            transform: translate(-1em, 0); } }

.map-dot-animation {
  -webkit-animation: map-dot-animation .5s ease-in-out 0s infinite alternate;
          animation: map-dot-animation .5s ease-in-out 0s infinite alternate; }

@-webkit-keyframes map-dot-animation {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    background-color: white;
    opacity: .8; }
  100% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    background-color: white;
    opacity: .5; } }

@keyframes map-dot-animation {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    background-color: white;
    opacity: .8; }
  100% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    background-color: white;
    opacity: .5; } }

.map-dot-animation-main {
  -webkit-animation: map-dot-animation-main .5s ease-in-out 0s infinite alternate;
          animation: map-dot-animation-main .5s ease-in-out 0s infinite alternate; }

@-webkit-keyframes map-dot-animation-main {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    background-color: #354452;
    opacity: .8; }
  100% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    background-color: #354452;
    opacity: .5; } }

@keyframes map-dot-animation-main {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    background-color: #354452;
    opacity: .8; }
  100% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    background-color: #354452;
    opacity: .5; } }

.appear {
  opacity: 0;
  -webkit-animation-duration: .5s;
          animation-duration: .5s;
  -webkit-animation-delay: 1s;
          animation-delay: 1s; }

.appear-blur {
  opacity: 0;
  -webkit-filter: blur(5px);
          filter: blur(5px);
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-delay: 1s;
          animation-delay: 1s; }

.appeared-blur {
  opacity: 1;
  -webkit-filter: blur(0px);
          filter: blur(0px); }

.grow {
  -webkit-transition: all 0.5s cubic-bezier(0.5, 1.41, 0.95, 1.07) 1.5s;
  transition: all 0.5s cubic-bezier(0.5, 1.41, 0.95, 1.07) 1.5s;
  opacity: 0;
  -webkit-transform: scale(0.5);
          transform: scale(0.5); }

.grown {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1); }

.del0 {
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
  -webkit-animation-delay: 0s;
          animation-delay: 0s; }

.del05 {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s; }

.del1 {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
  -webkit-animation-delay: 1s;
          animation-delay: 1s; }

.del15 {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s; }

.del2 {
  -webkit-transition-delay: 2s;
          transition-delay: 2s;
  -webkit-animation-delay: 2s;
          animation-delay: 2s; }

.del25 {
  -webkit-transition-delay: 2.5s;
          transition-delay: 2.5s;
  -webkit-animation-delay: 2.5s;
          animation-delay: 2.5s; }

.del3 {
  -webkit-transition-delay: 3s;
          transition-delay: 3s;
  -webkit-animation-delay: 3s;
          animation-delay: 3s; }

.del35 {
  -webkit-transition-delay: 3.5s;
          transition-delay: 3.5s;
  -webkit-animation-delay: 3.5s;
          animation-delay: 3.5s; }

.del4 {
  -webkit-transition-delay: 4s;
          transition-delay: 4s;
  -webkit-animation-delay: 4s;
          animation-delay: 4s; }

.del5 {
  -webkit-transition-delay: 5s;
          transition-delay: 5s;
  -webkit-animation-delay: 5s;
          animation-delay: 5s; }

.del6 {
  -webkit-transition-delay: 6s;
          transition-delay: 6s;
  -webkit-animation-delay: 6s;
          animation-delay: 6s; }

.del7 {
  -webkit-transition-delay: 7s;
          transition-delay: 7s;
  -webkit-animation-delay: 7s;
          animation-delay: 7s; }

.del8 {
  -webkit-transition-delay: 8s;
          transition-delay: 8s;
  -webkit-animation-delay: 8s;
          animation-delay: 8s; }

.del9 {
  -webkit-transition-delay: 9s;
          transition-delay: 9s;
  -webkit-animation-delay: 9s;
          animation-delay: 9s; }

.del10 {
  -webkit-transition-delay: 10s;
          transition-delay: 10s;
  -webkit-animation-delay: 10s;
          animation-delay: 10s; }

.del11 {
  -webkit-transition-delay: 11s;
          transition-delay: 11s;
  -webkit-animation-delay: 11s;
          animation-delay: 11s; }

.del12 {
  -webkit-transition-delay: 12s;
          transition-delay: 12s;
  -webkit-animation-delay: 12s;
          animation-delay: 12s; }

.dur01 {
  -webkit-transition-duration: 0.1s;
          transition-duration: 0.1s;
  -webkit-animation-duration: 0.1s;
          animation-duration: 0.1s; }

.dur02 {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
  -webkit-animation-duration: 0.2s;
          animation-duration: 0.2s; }

.dur03 {
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-animation-duration: 0.3s;
          animation-duration: 0.3s; }

.dur05 {
  -webkit-transition-duration: 0.5s;
          transition-duration: 0.5s;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s; }

.dur1 {
  -webkit-transition-duration: 1s;
          transition-duration: 1s;
  -webkit-animation-duration: 1s;
          animation-duration: 1s; }

.dur15 {
  -webkit-transition-duration: 1.5s;
          transition-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s; }

.dur2 {
  -webkit-transition-duration: 2s;
          transition-duration: 2s;
  -webkit-animation-duration: 2s;
          animation-duration: 2s; }

.dur25 {
  -webkit-transition-duration: 2.5s;
          transition-duration: 2.5s;
  -webkit-animation-duration: 2.5s;
          animation-duration: 2.5s; }

.dur3 {
  -webkit-transition-duration: 3s;
          transition-duration: 3s;
  -webkit-animation-duration: 3s;
          animation-duration: 3s; }

.dur4 {
  -webkit-transition-duration: 4s;
          transition-duration: 4s;
  -webkit-animation-duration: 4s;
          animation-duration: 4s; }

.dur5 {
  -webkit-transition-duration: 5s;
          transition-duration: 5s;
  -webkit-animation-duration: 5s;
          animation-duration: 5s; }

.dur10 {
  -webkit-transition-duration: 10s;
          transition-duration: 10s;
  -webkit-animation-duration: 10s;
          animation-duration: 10s; }

.dur15 {
  -webkit-transition-duration: 15s;
          transition-duration: 15s;
  -webkit-animation-duration: 15s;
          animation-duration: 15s; }

.dur20 {
  -webkit-transition-duration: 20s;
          transition-duration: 20s;
  -webkit-animation-duration: 20s;
          animation-duration: 20s; }

.dur25 {
  -webkit-transition-duration: 25s;
          transition-duration: 25s;
  -webkit-animation-duration: 25s;
          animation-duration: 25s; }

.dur30 {
  -webkit-transition-duration: 30s;
          transition-duration: 30s;
  -webkit-animation-duration: 30s;
          animation-duration: 30s; }

.dur35 {
  -webkit-transition-duration: 35s;
          transition-duration: 35s;
  -webkit-animation-duration: 35s;
          animation-duration: 35s; }

.dur40 {
  -webkit-transition-duration: 40s;
          transition-duration: 40s;
  -webkit-animation-duration: 40s;
          animation-duration: 40s; }

.dur45 {
  -webkit-transition-duration: 45s;
          transition-duration: 45s;
  -webkit-animation-duration: 45s;
          animation-duration: 45s; }

.dur50 {
  -webkit-transition-duration: 50s;
          transition-duration: 50s;
  -webkit-animation-duration: 50s;
          animation-duration: 50s; }

.dur55 {
  -webkit-transition-duration: 55s;
          transition-duration: 55s;
  -webkit-animation-duration: 55s;
          animation-duration: 55s; }

.dur60 {
  -webkit-transition-duration: 60s;
          transition-duration: 60s;
  -webkit-animation-duration: 60s;
          animation-duration: 60s; }

.dur70 {
  -webkit-transition-duration: 70s;
          transition-duration: 70s;
  -webkit-animation-duration: 70s;
          animation-duration: 70s; }

.dur80 {
  -webkit-transition-duration: 80s;
          transition-duration: 80s;
  -webkit-animation-duration: 80s;
          animation-duration: 80s; }

.dur90 {
  -webkit-transition-duration: 90s;
          transition-duration: 90s;
  -webkit-animation-duration: 90s;
          animation-duration: 90s; }

.dur100 {
  -webkit-transition-duration: 100s;
          transition-duration: 100s;
  -webkit-animation-duration: 100s;
          animation-duration: 100s; }

.dur120 {
  -webkit-transition-duration: 120s;
          transition-duration: 120s;
  -webkit-animation-duration: 120s;
          animation-duration: 120s; }

.dur140 {
  -webkit-transition-duration: 140s;
          transition-duration: 140s;
  -webkit-animation-duration: 140s;
          animation-duration: 140s; }

.rev {
  animation-direction: reverse; }

.altrev {
  animation-direction: alternate-reverse; }

.slow {
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s; }

.slowest {
  -webkit-animation-duration: 30s;
          animation-duration: 30s; }

.touch, .drag img, .spin img {
  -webkit-transition-duration: .25s;
          transition-duration: .25s; }
  .touch:hover, .drag img:hover, .spin img:hover {
    -webkit-transform: rotate(3deg);
            transform: rotate(3deg);
    -webkit-filter: brightness(102%);
            filter: brightness(102%); }

.heavy {
  -webkit-transition-duration: .25s;
          transition-duration: .25s; }
  .heavy:hover {
    -webkit-transform: rotate(-1deg);
            transform: rotate(-1deg); }

.drag {
  width: auto;
  height: auto;
  position: absolute;
  cursor: -webkit-grab;
  cursor: grab;
  -webkit-transform: translate(0px, 0px);
          transform: translate(0px, 0px); }

.spin {
  position: absolute;
  cursor: -webkit-grab;
  cursor: grab; }

.opaque {
  -webkit-transition-duration: .5s;
          transition-duration: .5s;
  opacity: 1; }
  .opaque:hover {
    opacity: .8; }

.scrollhor::-webkit-scrollbar,
.scrollvert::-webkit-scrollbar,
.scroll::-webkit-scrollbar {
  display: none; }

.scale {
  -webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s;
  transition: transform .5s;
  transition: transform .5s, -webkit-transform .5s;
  -webkit-transform-origin: center !important;
          transform-origin: center !important;
  cursor: pointer; }
  .scale:hover {
    -webkit-transform: scale(1.1);
            transform: scale(1.1); }
  .scale__bottom {
    -webkit-transform-origin: bottom center;
            transform-origin: bottom center;
    -webkit-transition: -webkit-transform .5s;
    transition: -webkit-transform .5s;
    transition: transform .5s;
    transition: transform .5s, -webkit-transform .5s; }
    .scale__bottom:hover {
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }

.header {
  position: absolute;
  z-index: 2000; }
  .header-logo {
    -webkit-transition: opacity 1s, -webkit-transform .5s;
    transition: opacity 1s, -webkit-transform .5s;
    transition: transform .5s, opacity 1s;
    transition: transform .5s, opacity 1s, -webkit-transform .5s;
    left: 2rem;
    top: 2rem;
    z-index: 1;
    width: 13rem;
    opacity: .9; }
    .header-logo:hover {
      -webkit-transform: scale(1.025);
              transform: scale(1.025);
      opacity: 1; }
    .header-logo img {
      width: auto; }
  .header__opener {
    height: 2.1em;
    width: 2.1em;
    background-color: #354452;
    position: fixed;
    right: 2em;
    top: 2.2em;
    z-index: 9999;
    cursor: pointer;
    opacity: .5;
    -webkit-transition: opacity .4s;
    transition: opacity .4s;
    padding: 1rem;
    border-radius: 50%; }
    @media screen and (max-width: 1000px) {
      .header__opener {
        -webkit-transform: scale(1.5);
                transform: scale(1.5); } }
    .header__opener.x-mark {
      background-color: transparent; }
    .header__opener .line, .header__opener .header__opener_line_1, .header__opener .header__opener_line_2, .header__opener .header__opener_line_3 {
      position: absolute;
      width: 2.2rem;
      height: .3rem;
      background-color: white;
      -webkit-transition: all .4s;
      transition: all .4s; }
    .header__opener_line_1 {
      top: 1rem; }
      .header__opener_line_1.x-mark {
        -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
        top: 1.9rem; }
    .header__opener_line_2 {
      top: 1.9rem; }
      .header__opener_line_2.x-mark {
        opacity: 0; }
    .header__opener_line_3 {
      top: 2.8rem; }
      .header__opener_line_3.x-mark {
        -webkit-transform: rotate(-45deg);
                transform: rotate(-45deg);
        top: 1.9rem; }
    .header__opener:hover {
      opacity: 1; }
  .header__nav {
    position: fixed;
    right: 0;
    top: 0;
    -webkit-transition: opacity .2s, -webkit-transform .2s;
    transition: opacity .2s, -webkit-transform .2s;
    transition: transform .2s, opacity .2s;
    transition: transform .2s, opacity .2s, -webkit-transform .2s;
    -webkit-transform: translate(25em, 0);
            transform: translate(25em, 0);
    height: 100vh;
    background-color: #354452;
    width: 25em;
    opacity: 0;
    z-index: 999;
    min-height: 600px;
    overflow-x: scroll; }
    @media screen and (max-width: 1000px) {
      .header__nav {
        -webkit-transform: translate(-100vw, 0);
                transform: translate(-100vw, 0);
        width: 100vw;
        overflow-x: scroll; } }
    .header__nav .logo {
      width: 70%;
      height: 6rem;
      margin: 1.5rem 0 1.5rem 2rem;
      padding: 0;
      border-bottom: dotted 1px rgba(255, 255, 255, 0.21); }
      .header__nav .logo a {
        width: 9rem;
        margin: 1.5rem auto; }
        .header__nav .logo a img {
          height: 5rem;
          opacity: .75;
          -webkit-transition: opacity .3s;
          transition: opacity .3s; }
          @media screen and (max-width: 1000px) {
            .header__nav .logo a img {
              -webkit-transform: scale(1);
                      transform: scale(1); } }
          .header__nav .logo a img:hover {
            opacity: 1; }
    .header__nav .search-container {
      margin: 0 auto;
      text-align: center; }
    .header__nav ul {
      color: white;
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -webkit-flex-direction: column;
              flex-direction: column;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
              justify-content: flex-start;
      padding: 0 2rem;
      height: 78rem; }
      .header__nav ul li {
        display: inline-block;
        text-align: center;
        font-size: 1.5rem;
        line-height: .5;
        margin: 0;
        padding: .5rem;
        line-height: 1;
        -webkit-transition: -webkit-transform .3s;
        transition: -webkit-transform .3s;
        transition: transform .3s;
        transition: transform .3s, -webkit-transform .3s;
        z-index: 1001;
        -webkit-flex-basis: 1;
                flex-basis: 1; }
        @media screen and (max-width: 1000px) {
          .header__nav ul li {
            font-size: 3rem;
            padding: 1rem; } }
        .header__nav ul li:hover {
          background-color: rgba(255, 255, 255, 0.21);
          -webkit-transform: scale(1.07);
                  transform: scale(1.07); }
        .header__nav ul li:before {
          content: '';
          margin-left: 0em; }
        .header__nav ul li.active {
          pointer-events: none;
          opacity: .3; }
          .header__nav ul li.active a {
            border-bottom: none; }
    .header__nav a {
      color: #f2eeee;
      border-bottom: none; }
  .header-opened {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
    opacity: .95; }

.index_menu ul li {
  font-size: 1.3rem;
  float: left;
  margin-right: 2rem;
  padding-right: 2rem;
  white-space: nowrap; }
  .index_menu ul li:before {
    content: ''; }

.index-map {
  width: 100vw;
  height: 50rem; }

.index_list {
  width: 1000px;
  height: 8rem; }
  .index_list nav {
    float: left;
    margin-right: 1.5rem; }
    .index_list nav ul {
      margin: 0 auto;
      padding-left: 0;
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
              justify-content: flex-start;
      -webkit-flex-wrap: nowrap;
              flex-wrap: nowrap; }
      .index_list nav ul li {
        font-size: 1rem;
        line-height: 1.3rem;
        margin: 0 1.5rem 0;
        padding-left: 1rem;
        -webkit-transition: all .3s;
        transition: all .3s;
        opacity: .9; }
        .index_list nav ul li:before {
          content: '';
          margin-left: 0; }
        .index_list nav ul li:hover {
          -webkit-transform: scale(1.025);
                  transform: scale(1.025);
          opacity: 1; }
        .index_list nav ul li a.activated {
          color: #393836;
          border-bottom: none;
          pointer-events: none; }
  .index_list .list-container {
    float: left; }
    .index_list .list-container .list_card {
      -webkit-transition: all .5s;
      transition: all .5s;
      opacity: 1;
      height: 2.5rem; }
      .index_list .list-container .list_card.hide {
        opacity: .1; }
      .index_list .list-container .list_card p {
        margin-top: 0;
        margin-bottom: 2rem; }

.index-information {
  overflow: hidden;
  margin: 1.5rem 1.5rem 2.5rem; }
  .index-information__logo {
    position: absolute;
    left: 1.5rem;
    top: 1.5rem;
    width: 25rem;
    z-index: 10; }
    .index-information__logo img {
      width: 100%; }
  .index-information__first, .index-information__second {
    margin-left: 32rem;
    width: 35%; }
  .index-information__showmore {
    margin-left: 32rem; }
    .index-information__showmore .more {
      content: 'Прочитать целиком'; }
    .index-information__showmore .less {
      content: 'Кратко'; }
  .index-information__creators {
    left: 1.2rem;
    top: 17rem; }
    .index-information__creators h4 {
      display: block;
      color: #393836;
      font-size: 1.5rem;
      margin-bottom: 1.5rem; }
    .index-information__creators h5 {
      font-size: 1.25rem;
      margin: 0 0 0 .2rem; }
    .index-information__creators p {
      font-size: .8rem;
      opacity: .75;
      margin: 0 0 2rem .2rem;
      display: block; }
      .index-information__creators p:first-letter {
        text-transform: uppercase; }
  .index-information__thanks {
    left: 21rem;
    top: 17.7rem;
    width: 8rem; }
    .index-information__thanks p {
      font-size: .8rem;
      opacity: .75;
      display: block; }

.f {
  width: 100vw; }
  .f .expert-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
            justify-content: space-around; }
    .f .expert-container .expert {
      width: 33%;
      padding-right: 1rem; }
      .f .expert-container .expert p {
        font-size: .75rem; }
        .f .expert-container .expert p.review {
          font-size: 1rem; }
          .f .expert-container .expert p.review:before {
            content: '«'; }
          .f .expert-container .expert p.review:after {
            content: '»'; }
      .f .expert-container .expert .expert-face img {
        border-radius: 50%;
        width: 100px; }
  .f-social {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
            justify-content: space-around; }
    .f-social__element {
      text-align: center;
      width: 20%; }
  .f-practices {
    margin: 0 auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
            justify-content: flex-start;
    -webkit-flex-wrap: wrap;
            flex-wrap: wrap; }
    .f-practices .f-practices-link {
      border-bottom: none; }
    .f-practices .card {
      width: 15rem;
      padding: 0 1.5rem;
      line-height: 1;
      height: 15rem;
      -webkit-transition: all .5s;
      transition: all .5s;
      border-bottom: none; }
      .f-practices .card.hide {
        pointer-events: none;
        opacity: .3;
        display: none; }
      .f-practices .card p {
        line-height: 1; }
      .f-practices .card:hover .card-town {
        color: #f2eeee; }
      .f-practices .card:hover .card-title {
        color: #f2eeee; }
      .f-practices .card-town {
        display: block; }
      .f-practices .card-title {
        font-size: 1rem;
        line-height: 1rem; }
  .f-town {
    max-width: 1350px; }
    .f-town.active {
      pointer-events: none;
      display: none; }
  .f-contactinfo {
    height: 10rem;
    background-color: #393836; }
    .f-contactinfo__container {
      width: 70%;
      margin: 0 auto;
      padding-top: 1.5rem;
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
              justify-content: flex-start; }
      .f-contactinfo__container .logo {
        width: 7rem;
        -webkit-transition: -webkit-transform .3s;
        transition: -webkit-transform .3s;
        transition: transform .3s;
        transition: transform .3s, -webkit-transform .3s; }
        .f-contactinfo__container .logo:hover {
          -webkit-transform: scale(1.05);
                  transform: scale(1.05); }
        .f-contactinfo__container .logo img {
          width: 100%; }
      .f-contactinfo__container .thanks_1 {
        width: 50%;
        color: #f2eeee;
        padding: 0 3rem; }
        .f-contactinfo__container .thanks_1 p {
          font-size: .85rem;
          margin-top: 0; }
        .f-contactinfo__container .thanks_1__year {
          display: block;
          margin-top: 1rem; }
      .f-contactinfo__container .thanks_2 {
        width: 15%;
        color: #f2eeee; }
        .f-contactinfo__container .thanks_2 p {
          font-size: .85rem;
          margin-top: 0; }

html {
  background-color: white; }

body {
  min-height: 100%;
  font-size: 1em;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  color: #354452;
  -webkit-font-smoothing: antialiased; }

article {
  overflow: hidden;
  position: relative;
  height: 100vh;
  width: 100vw; }

section, .f {
  margin: 0 auto;
  position: relative; }

#myElement {
  background: silver;
  height: 300px;
  text-align: center;
  font: 30px/300px Helvetica, Arial, sans-serif;
}