@charset "UTF-8";
@font-face {
  font-family: 'colaryicon';
  src: url("../fonts/colaryicon.eot");
  src: url("../fonts/colaryicon.eot#iefix") format("embedded-opentype"), url("../fonts/colaryicon.ttf") format("truetype"), url("https://colary.ru/local/templates/new_colary/fonts/colaryicon.woff") format("woff"), url("../fonts/colaryicon.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'icomoon2';
  src: url("https://colary.ru/local/templates/new_colary/fonts/icomoon2.eot");
  src: url("https://colary.ru/local/templates/new_colary/fonts/icomoon2.eot#iefix") format("embedded-opentype"), url("https://colary.ru/local/templates/new_colary/fonts/icomoon2.ttf") format("truetype"), url("../fonts/icomoon2.woff") format("woff"), url("../fonts/icomoon2.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ProximaNovaRegular";
  src: url("../fonts/Proxima Nova Regular.otf");
  src: url("../fonts/proxima_nova_regular-webfont.eot");
  src: url('../fonts/proxima_nova_regular-webfont.ttf')  format('truetype'),
       url('../fonts/proxima_nova_regular-webfont.woff') format('woff');
  font-style: normal;
}

@font-face {
  font-family: "ProximaNovaSemibold";
  src: url("https://colary.ru/local/templates/new_colary/fonts/Proxima Nova Semibold.otf");
  src: url("../fonts/proxima_nova_semibold-webfont.eot");
  src: url('../fonts/proxima_nova_semibold-webfont.ttf')  format('truetype'),
       url('https://colary.ru/local/templates/new_colary/fonts/proxima_nova_semibold-webfont.woff') format('woff');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "ProximaNovaBold";
  src: url("../fonts/Proxima Nova Bold.otf");
  src: url("../fonts/proxima_nova_bold-webfont.eot");
  src: url('https://colary.ru/local/templates/new_colary/fonts/proxima_nova_bold-webfont.ttf')  format('truetype'),
       url('https://colary.ru/local/templates/new_colary/fonts/proxima_nova_bold-webfont.woff') format('woff');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "ProximaNovaExtrabold";
  src: url("../fonts/Proxima Nova Extrabold.otf");
  src: url("../fonts/proxima_nova_extrabold-webfont.eot");
  src: url('../fonts/proxima_nova_extrabold-webfont.ttf')  format('truetype'),
       url('../fonts/proxima_nova_extrabold-webfont.woff') format('woff');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "ProximaNovaLight";
  src: url("../fonts/Proxima Nova Light.otf");
  src: url("../fonts/proxima_nova_light-webfont.eot");
  src: url('../fonts/proxima_nova_light-webfont.woff')  format('woff2'),
       url('../fonts/proxima_nova_light-webfont.ttf')  format('truetype'),
       url('../fonts/proxima_nova_light-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ProximaNovaThin";
  src: url("../fonts/Proxima Nova Thin.otf");
  src: url("../fonts/proxima_nova_thin-webfont.eot");
  src: url('../fonts/proxima_nova_thin-webfont.ttf')  format('truetype'),
       url('../fonts/proxima_nova_thin-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ProximaNovaExtraCondensedLight";
  src: url("../fonts/Proxima Nova Extra Condensed Light.otf");
  src: url("../fonts/proxima_nova_extra_condensed_light-webfont.eot");
  src: url('../fonts/proxima_nova_extra_condensed_light-webfont.ttf')  format('truetype'),
       url('../fonts/proxima_nova_extra_condensed_light-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'proxima_nova_extra_condenLtIt';
  src: url("../fonts/Proxima Nova Extra Condensed Light.otf");
  src: url("../fonts/proxima_nova_extra_condensed_light_italic-webfont.eot");
  src: url('../fonts/proxima_nova_extra_condensed_light_italic-webfont.ttf')  format('truetype'),
       url('https://colary.ru/local/templates/new_colary/fonts/proxima_nova_extra_condensed_light_italic-webfont.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}

[class^="icon-"], [class*=" icon-"], .contacts_data_mail:before {
  font-family: 'colaryicon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-socfb:before {
  content: "\e900";
}

.icon-adres:before {
  content: "\e901";
}

.icon-socinst:before {
  content: "\e902";
}

.icon-mail:before {
  content: "\e903";
}

.icon-socvk:before {
  content: "\e904";
}

.icon-arrowdown:before {
  content: "\e906";
}

.icon-arrowleft:before {
  content: "\e907";
}

.icon-arrowright:before {
  content: "\e908";
}

.icon-form:before {
  content: "\e909";
}

.icon-socvkcircle:before {
  content: "\e905";
}

.icon-socinstcircle:before {
  content: "\e90a";
}

.icon-socfbcircle:before {
  content: "\e90b";
}

.icon-socvkcircle1 .path1:before {
  content: "\e90c";
  color: transparent;
}

.icon-socvkcircle1 .path2:before {
  content: "\e90d";
  margin-left: -1em;
  color: white;
}

.icon-socvkcircle1 .path3:before {
  content: "\e90e";
  margin-left: -1em;
  color: white;
}

.icon-socinstcircle1 .path1:before {
  content: "\e90f";
  color: transparent;
}

.icon-socinstcircle1 .path2:before {
  content: "\e910";
  margin-left: -1.0224609375em;
  color: white;
}

.icon-socinstcircle1 .path3:before {
  content: "\e911";
  margin-left: -1.0224609375em;
  color: white;
}

.icon-socfbcircle1 .path1:before {
  content: "\e912";
  color: transparent;
}

.icon-socfbcircle1 .path2:before {
  content: "\e913";
  margin-left: -1em;
  color: white;
}

.icon-socfbcircle1 .path3:before {
  content: "\e914";
  margin-left: -1em;
  color: white;
}

.icon-reload:before {
  content: "\e91c";
}

.icon-comment:before {
  content: "\e915";
}

.icon-eye:before {
  content: "\e916";
}

.icon-fb:before {
  content: "\e917";
}

.icon-gplus:before {
  content: "\e918";
}

.icon-heart:before {
  content: "\e919";
}

.icon-tw:before {
  content: "\e91a";
}

.icon-vk:before {
  content: "\e91b";
}

.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: '';
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir='rtl'] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  display: block;
  width: 20px;
  height: 20px;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  color: transparent;
  outline: none;
  background: transparent;
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: .25;
}

.slick-prev:before,
.slick-next:before {
  font-family: 'slick';
  font-size: 2rem;
  line-height: 1;
  opacity: .75;
  color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
  left: -25px;
}

[dir='rtl'] .slick-prev {
  right: -25px;
  left: auto;
}

.slick-prev:before {
  content: '';
}

[dir='rtl'] .slick-prev:before {
  content: '';
}

.slick-next {
  right: -25px;
}

[dir='rtl'] .slick-next {
  right: auto;
  left: -25px;
}

.slick-next:before {
  content: '';
}

[dir='rtl'] .slick-next:before {
  content: '';
}

.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -25px;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 20px;
  height: 20px;
  padding: 5px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  font-family: 'slick';
  font-size: 6px;
  line-height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  content: '•';
  text-align: center;
  opacity: .25;
  color: black;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before {
  opacity: .75;
  color: black;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.flipOutX, .animated.flipOutY, .animated.bounceIn, .animated.bounceOut {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}

@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }
  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

@keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }
  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {
  from, 50%, to {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }
  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }
  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }
  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }
  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }
  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }
  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }
  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }
  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  10%, 20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }
  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  10%, 20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }
  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

@-webkit-keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
    transform: none;
  }
  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }
  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }
  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }
  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }
  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }
  77.7% {
    -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
    transform: skewX(0.39063deg) skewY(0.39063deg);
  }
  88.8% {
    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
    transform: skewX(-0.19531deg) skewY(-0.19531deg);
  }
}

@keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
    transform: none;
  }
  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }
  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }
  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }
  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }
  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }
  77.7% {
    -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
    transform: skewX(0.39063deg) skewY(0.39063deg);
  }
  88.8% {
    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
    transform: skewX(-0.19531deg) skewY(-0.19531deg);
  }
}

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

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

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

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

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }
  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }
  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }
  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }
  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

@keyframes rollOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: scale(1) scaleZ(1) rotateX(-125deg);
    transform: scale(1) scaleZ(1) rotateX(-125deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }
  to {
    visibility: visible;
    -webkit-transform: scale(1) scaleZ(1) rotateX(0deg);
    transform: scale(1) scaleZ(1) rotateX(0deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }
}

@keyframes slideOutDown {
  from {
    -webkit-transform: scale(1) scaleZ(1) rotateX(-125deg);
    transform: scale(1) scaleZ(1) rotateX(-125deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }
  to {
    visibility: visible;
    -webkit-transform: scale(1) scaleZ(1) rotateX(0deg);
    transform: scale(1) scaleZ(1) rotateX(0deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

html {
  font-family: sans-serif;
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

article,
aside,
footer,
header,
nav,
section {
  display: block;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

.xh1 {
  font-size: 2em;
  margin: 0.67em 0;
}

figcaption,
figure,
main {
  display: block;
}

figure {
  margin: 1em 4rem;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}

a:active,
a:hover {
  outline-width: 0;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}

b,
strong {
  font-weight: inherit;
}

b,
strong {
  font-weight: bolder;
}

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

dfn {
  font-style: italic;
}

mark {
  background-color: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

audio,
video {
  display: inline-block;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

img {
  border-style: none;
}

svg:not(:root) {
  overflow: hidden;
}

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

progress {
  display: inline-block;
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details,
menu {
  display: block;
}

summary {
  display: list-item;
}

canvas {
  display: inline-block;
}

template {
  display: none;
}

[hidden] {
  display: none;
}

a.anibutton {
  z-index: 990;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
}

a.anibutton:link:after, a.anibutton:visited:after {
  content: "";
  position: absolute;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 150%;
  z-index: -1;
  -webkit-transition: all 0.75s ease 0s;
  transition: all 0.75s ease 0s;
}

a.anibutton:link:hover, a.anibutton:visited:hover {
  color: #FFF;
  text-shadow: none;
}

a.anibutton:link:hover:after, a.anibutton:visited:hover:after {
  height: 450%;
}

a.anibutton:link, a.anibutton:visited {
  position: relative;
  display: block;
  margin: 0 auto 0;
  padding: 1.1rem 1.5rem;
  color: #fff;
  font-size: 2rem;
  border-radius: 0;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  overflow: hidden;
  -webkit-transition: all 1s ease;
  transition: all 1s ease;
}

a.anibutton .icon {
  font-size: 2.9rem;
  line-height: 1rem;
  position: relative;
  bottom: -0.5rem;
  margin-left: 1.1rem;
}

a.anibutton .iconleft {
  font-size: 2.9rem;
  line-height: 1rem;
  position: relative;
  bottom: -0.5rem;
  margin-right: 1.1rem;
}

a.anibutton.white {
  color: #fff;
  cursor: pointer;
  display: block;
  position: relative;
  border: 2px solid #fff;
  -webkit-transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}

a.anibutton.white:hover {
  color: #fc5054 !important;
  background-color: transparent;
}

a.anibutton.white:hover:before {
  left: 0%;
  right: auto;
  width: 100%;
}

a.anibutton.white:before {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  height: 100%;
  width: 0px;
  z-index: -1;
  content: '';
  color: #fc5054 !important;
  background: #fff;
  -webkit-transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}

a.anibutton.red {
  color: #fc5054;
  cursor: pointer;
  display: block;
  position: relative;
  border: 2px solid #fc5054;
  -webkit-transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}

a.anibutton.red:hover {
  color: #fff !important;
  background-color: transparent;
  text-shadow: nthree;
}

a.anibutton.red:hover:before {
  left: 0%;
  right: auto;
  width: 100%;
}

a.anibutton.red:before {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  height: 100%;
  width: 0px;
  z-index: -1;
  content: '';
  color: #fff !important;
  background: #fc5054;
  -webkit-transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}

a.anibutton.dark {
  color: #000;
  cursor: pointer;
  display: block;
  position: relative;
  border: 2px solid #000;
  -webkit-transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}

a.anibutton.dark:hover {
  color: #fff !important;
  background-color: transparent;
  text-shadow: nthree;
}

a.anibutton.dark:hover:before {
  left: 0%;
  right: auto;
  width: 100%;
}

a.anibutton.dark:before {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  height: 100%;
  width: 0px;
  z-index: -1;
  content: '';
  color: #fff !important;
  background: #000;
  -webkit-transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}

a.anibutton.big:link:after, a.anibutton:visited:after {
  content: "";
  position: absolute;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 150%;
  z-index: -1;
  -webkit-transition: all 0.75s ease 0s;
  transition: all 0.75s ease 0s;
}

a.anibutton.big:link:hover, a.anibutton.big:visited:hover {
  color: #fc5054;
  text-shadow: none;
}

a.anibutton.big:link:hover:after, a.anibutton.big:visited:hover:after {
  height: 450%;
}

a.anibutton.big:link, a.anibutton.big:visited {
  position: relative;
  display: block;
  margin: 5rem auto 0;
  padding: 1.1rem 1.5rem;
  padding-right: 0.3rem;
  color: #fc5054;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 2.7rem;
  border-radius: 0;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  overflow: hidden;
  float: right;
  margin: 0;
  -webkit-transition: all 1s ease;
  transition: all 1s ease;
}

.anibutton.arrowbutton.big .arrow_b {
  fill: #fc5054;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: -webkit-transform .3s ease-out;
  transition: -webkit-transform .3s ease-out;
  transition: transform .3s ease-out;
  transition: transform .3s ease-out, -webkit-transform .3s ease-out;
}

.anibutton.arrowbutton.big .path {
  fill: none;
  stroke: #fc5054;
  stroke-width: 27;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  -webkit-animation: dash 2s linear forwards;
  animation: dash 2s linear forwards;
  -webkit-transition: stroke-dashoffset .3s ease-out;
  transition: stroke-dashoffset .3s ease-out;
}

.anibutton.arrowbutton.big:hover .path {
  stroke-dashoffset: 0;
}

.anibutton.arrowbutton.big:hover .arrow_b {
  -webkit-transform: translateX(3rem);
  transform: translateX(3rem);
}

.arrowbutton .arrowanimate {
  position: relative;
  top: 2rem;
}

.soc_button {
  width: 4.4rem !important;
  height: 4.4rem !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  width: inherit;
  height: inherit;
}

.soc_button .icon {
  font-size: 4.2rem !important;
  bottom: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
}

.soc_button:before {
  height: 0 !important;
}

.soc_button:hover .icon .path1:before {
  color: #fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.soc_button:hover .icon .path3:before {
  color: #fc5054;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.red.soc_button .icon .path2:before {
  color: #fc5054;
}

.red.soc_button .icon .path3:before {
  color: #fc5054;
}

.red.soc_button:hover .icon .path1:before {
  color: #fc5054;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.red.soc_button:hover .icon .path3:before {
  color: #fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.button_header {
  position: absolute !important;
  top: 0;
  right: 12rem;
  margin-top: 43px !important;
  margin-bottom: 43px !important;
  width: auto !important;
}

.button_footer {
  position: absolute !important;
  margin-top: 7.3rem !important;
  margin-bottom: 7.3rem !important;
  width: auto !important;
}

.button_group {
  position: absolute;
  bottom: 0;
  right: 0rem;
  margin-bottom: 7rem;
  padding-right: 0.3rem;
  padding-left: 0;
}

.button_group li {
  display: inline-block;
  width: 4rem;
  height: 4rem;
  margin-left: 1rem;
  margin: 0 .5rem;
}

a.anibtn .icon, button.anibtn .icon {
  font-size: 2.9rem;
  line-height: 1rem;
  position: relative;
  bottom: -0.5rem;
  margin-left: 1.1rem;
  width:inherit;
}

a.anibtn .iconleft, button.anibtn .iconleft {
  font-size: 2.9rem;
  line-height: 1rem;
  position: relative;
  bottom: -0.5rem;
  margin-right: 1.1rem;
}

.anibtn.white {
  height: 5rem;
  width: 100%;
  border: 2px solid #fff;
  line-height: 4.75rem;
  background-color: transparent;
  padding: 0 0;
  color: #fff;
  font-size: 1.9rem;
  text-decoration: none;
  position: relative;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  text-transform: uppercase;
  overflow: hidden;
  display: block;
  text-align: center;
  cursor: pointer;
}

.anibtn.white:hover {
  color: #fc5054;
}

.inner2 {
  padding: 0 2rem;
}

.inner2 span {
  display: inline-block !important;
}

.anibtn.white span {
  position: relative;
  z-index: 1;
  display: block;
  height: 100%;
}

.anibtn.white span.inner1:after, .anibtn.white span.inner1:before {
  content: "";
  position: absolute;
  z-index: -2;
  right: 0;
}

.anibtn.white span.inner1:before {
  top: 0;
  bottom: 0;
  width: 0;
  margin-right: -60px;
  border-width: 2px;
  border-style: solid;
  border-color: #fff;
  background-color: #fff;
  -webkit-transition: width ease-out .5s;
  transition: width ease-out .5s;
}

.anibtn.white span.inner1:after {
  top: 0;
  margin-right: -61px;
  bottom: 0;
  border-width: 29px;
  border-color: #fff #fff transparent transparent;
  border-style: solid;
  -webkit-transition: right ease-out .5s;
  transition: right ease-out .5s;
}

.anibtn.white span.inner2:after, .anibtn.white span.inner2:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  border-style: solid;
  content: "";
  bottom: 0;
}

.anibtn.white span.inner2:before {
  width: 0;
  border-width: 0;
  border-color: #fff;
  background-color: #fff;
}

.anibtn.white span.inner2:after {
  margin-left: -61px;
  border-width: 29px;
  border-color: #fff transparent transparent #fff;
}

.anibtn.white:hover span.inner1:before {
  width: 100%;
  -webkit-transition: width ease-out .5s .5s;
  transition: width ease-out .5s .5s;
}

.anibtn.white:hover span.inner1:after {
  right: 100%;
  -webkit-transition: right ease-out .5s .5s;
  transition: right ease-out .5s .5s;
}

.anibtn.white:hover span.inner2:before {
  width: 100%;
  border-width: 2px;
  -webkit-transition: width ease-out .5s;
  transition: width ease-out .5s;
}

.anibtn.white:hover span.inner2:after {
  left: 100.5%;
  margin-left: -2px;
  -webkit-transition: left ease-out .5s;
  transition: left ease-out .5s;
}

.anibtn.red {
  height: 5rem;
  width: 100%;
  border: 2px solid #fc5054;
  line-height: 4.75rem;
  background-color: transparent;
  padding: 0 0;
  color: #fc5054;
  font-size: 1.9rem;
  text-decoration: none;
  position: relative;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  text-transform: uppercase;
  overflow: hidden;
  display: block;
  text-align: center;
  cursor: pointer;
}

.anibtn.red:hover {
  color: #fff;
}

.anibtn.red span {
  position: relative;
  z-index: 1;
  display: block;
  height: 100%;
}

.anibtn.red span.inner1:after, .anibtn.red span.inner1:before {
  content: "";
  position: absolute;
  z-index: -2;
  right: 0;
}

.anibtn.red span.inner1:before {
  top: 0;
  bottom: 0;
  width: 0;
  margin-right: -60px;
  border-width: 2px;
  border-style: solid;
  border-color: #fc5054;
  background-color: #fc5054;
  -webkit-transition: width ease-out .5s;
  transition: width ease-out .5s;
}

.anibtn.red span.inner1:after {
  top: 0;
  margin-right: -61px;
  bottom: 0;
  border-width: 29px;
  border-color: #fc5054 #fc5054 transparent transparent;
  border-style: solid;
  -webkit-transition: right ease-out .5s;
  transition: right ease-out .5s;
}

.anibtn.red span.inner2:after, .anibtn.red span.inner2:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  border-style: solid;
  content: "";
  bottom: 0;
}

.anibtn.red span.inner2:before {
  width: 0;
  border-width: 0;
  border-color: #fc5054;
  background-color: #fc5054;
}

.anibtn.red span.inner2:after {
  margin-left: -61px;
  border-width: 29px;
  border-color: #fc5054 transparent transparent #fc5054;
}

.anibtn.red:hover span.inner1:before {
  width: 100%;
  -webkit-transition: width ease-out .5s .5s;
  transition: width ease-out .5s .5s;
}

.anibtn.red:hover span.inner1:after {
  right: 100%;
  -webkit-transition: right ease-out .5s .5s;
  transition: right ease-out .5s .5s;
}

.anibtn.red:hover span.inner2:before {
  width: 100%;
  border-width: 2px;
  -webkit-transition: width ease-out .5s;
  transition: width ease-out .5s;
}

.anibtn.red:hover span.inner2:after {
  left: 100.5%;
  margin-left: -2px;
  -webkit-transition: left ease-out .5s;
  transition: left ease-out .5s;
}

.anibtn.red span span span.icon:before {
  color: #fc5054;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.anibtn.red:hover span span span.icon:before {
  color: #fff;
}

.anibtn.white span span span.icon:before {
  color: #fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.anibtn.white:hover span span span.icon:before {
  color: #fc5054;
}


.anibtn.dark {
  height: 5rem;
  width: 100%;
  border: 2px solid #000;
  line-height: 4.75rem;
  background-color: transparent;
  padding: 0 0;
  color: #000;
  font-size: 1.9rem;
  text-decoration: none;
  position: relative;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  text-transform: uppercase;
  overflow: hidden;
  display: block;
  text-align: center;
  cursor: pointer;
}

.anibtn.dark:hover {
  color: #fff;
}

.anibtn.dark span {
  position: relative;
  z-index: 1;
  display: block;
  height: 100%;
}

.anibtn.dark span.inner1:after, .anibtn.dark span.inner1:before {
  content: "";
  position: absolute;
  z-index: -2;
  right: 0;
}

.anibtn.dark span.inner1:before {
  top: 0;
  bottom: 0;
  width: 0;
  margin-right: -60px;
  border-width: 2px;
  border-style: solid;
  border-color: #000;
  background-color: #000;
  -webkit-transition: width ease-out .5s;
  transition: width ease-out .5s;
}

.anibtn.dark span.inner1:after {
  top: 0;
  margin-right: -61px;
  bottom: 0;
  border-width: 29px;
  border-color: #000 #000 transparent transparent;
  border-style: solid;
  -webkit-transition: right ease-out .5s;
  transition: right ease-out .5s;
}

.anibtn.dark span.inner2:after, .anibtn.dark span.inner2:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  border-style: solid;
  content: "";
  bottom: 0;
}

.anibtn.dark span.inner2:before {
  width: 0;
  border-width: 0;
  border-color: #000;
  background-color: #000;
}

.anibtn.dark span.inner2:after {
  margin-left: -61px;
  border-width: 29px;
  border-color: #000 transparent transparent #000;
}

.anibtn.dark:hover span.inner1:before {
  width: 100%;
  -webkit-transition: width ease-out .5s .5s;
  transition: width ease-out .5s .5s;
}

.anibtn.dark:hover span.inner1:after {
  right: 100%;
  -webkit-transition: right ease-out .5s .5s;
  transition: right ease-out .5s .5s;
}

.anibtn.dark:hover span.inner2:before {
  width: 100%;
  border-width: 2px;
  -webkit-transition: width ease-out .5s;
  transition: width ease-out .5s;
}

.anibtn.dark:hover span.inner2:after {
  left: 100.5%;
  margin-left: -2px;
  -webkit-transition: left ease-out .5s;
  transition: left ease-out .5s;
}

.anibtn.dark span span span.icon:before {
  color: #000;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.anibtn.dark:hover span span span.icon:before {
  color: #fff;
}

html, body {
  height: 100%;
  font-family: 'ProximaNovaRegular', Arial, sans-serif;
  -webkit-font-smoothing: antialiased !important;
  -webkit-text-stroke: 1px transparent;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  background: #fff;
}

html {
  font-size: 10px;
}

*, *:after, *:before {
  box-sizing: border-box;
}

a {
  -webkit-transition: color 0.5s;
  transition: color 0.5s;
}

a, .aniarrow {
  cursor: pointer;
}

.allcontent {
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.allcontent.block {
  overflow: hidden;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

h1, .xh1 {
  font-family: 'ProximaNovaExtrabold', Arial, sans-serif;
  font-size: 6.3rem;
  line-height: 1;
  color: #fff;
  text-transform: uppercase;
}

#map {
  height: 100%;
  width: 100%;
}

.wrapper {
  margin: auto;
  max-width: 1720px;
  overflow: hidden;
  height: 100%;
  position: relative;
}

@media only screen and (min-width: 1920px) {
  .wrapper {
    margin-left: 10rem;
    margin-right: 10rem;
    max-width: 100%;
  }
  .wrapper.request_inner {
    margin-left: auto;
    margin-right: auto;
  }
}

.wrapp {
  margin: auto;
  max-width: 1720px;
  overflow: hidden;
  position: relative;
}

.wrapper_blog {
  max-width: 1734px;
}

@media only screen and (min-width: 1920px) {
  .wrapper_blog {
    max-width: 100%;
  }
}

.wrapper_button {
  height: auto;
}

.fixedratio {
  padding-top: 45%;
}

.rd {
  -webkit-transform: translate(100% 0%);
  transform: translate(100% 0%);
  z-index: -1
}
.rd2 {
  -webkit-transform: translate(100% 0%);
  transform: translate(100% 0%);
  z-index: 0
}

.title_frame {
  color: #fc5054;
  margin: 6rem 21rem;
  margin-top: 0;
  white-space: normal;
}

.href_overlay_on {
  width: 100%;
  height: 100%;
  position: fixed;
  right: 0;
  background: #202429;
  z-index: 99999;
}

.href_overlay_off {
  width: 0;
  height: 100%;
  position: fixed;
  left: 0;
  background: #202429;
  z-index: 99999;
}

@-webkit-keyframes uil-rolling-anim {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes uil-rolling-anim {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes uil-rolling-anim {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes uil-rolling-anim {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.uil-rolling-css {
  background: none;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100px;
  height: 100px;
}

.uil-rolling-css > div {
  width: 100px;
  height: 100px;
  position: relative;
  -webkit-animation: uil-rolling-anim 1s linear infinite;
  animation: uil-rolling-anim 1s linear infinite;
}

.uil-rolling-css > div div {
  position: absolute;
  width: 100px;
  height: 50px;
  border-radius: 1000px 1000px 0 0;
  border-color: #fc5054;
  border-style: solid;
  border-width: 15px;
  border-bottom-width: 0;
}

.uil-rolling-css > div div:nth-of-type(2) {
  -webkit-transform: translate(0, 25px) rotate(90deg) translate(0, -25px);
  transform: translate(0, 25px) rotate(90deg) translate(0, -25px);
}

.hamburger {
  padding: 15px 15px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
}

.hamburger:hover {
  opacity: 1;
}

.hamburger-box {
  width: 50px;
  height: 34px;
  display: inline-block;
  position: relative;
}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px;
}

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
  width: 50px;
  height: 4px;
  background-color: #fff;
  border-radius: 0;
  position: absolute;
  transition-property: transform;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}

.hamburger-inner::before, .hamburger-inner::after {
  content: "";
  display: block;
}

.hamburger-inner::before {
  top: -15px;
}

.hamburger-inner::after {
  bottom: -15px;
}

/*
   * Spin
   */
.hamburger--spin .hamburger-inner {
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin .hamburger-inner::before {
  transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in;
}

.hamburger--spin .hamburger-inner::after {
  transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin.is-active .hamburger-inner {
  transform: rotate(225deg);
  transition-delay: 0.14s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--spin.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
  transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out;
}

.hamburger--spin.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
  transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.ScrollSceneIndicators {
  z-index: 9999999 !important;
}

.clients_content .wrapper {
  margin: auto 10rem !important;
}

.header_about {
  padding: 600px 0 600px 0;
  overflow: hidden;
  background-color: #1f212a;
}

.animation_trigger {
  height: 600px;
}

.animation_wrapper {
  position: relative;
  width: 100%;
  text-align: center;
}

.animation_wrapper:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.animation_adaptive {
  position: fixed;
  display: inline-block;
  vertical-align: middle;
  width: 97%;
  left: 1.5%;
  top: 50%;
  margin-top: -25%;
}

.animation_adaptive:before {
  content: "";
  display: block;
  padding-top: 54%;
}

.animation_scene {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.animation_frame1 {
  width: 100%;
  height: 100%;
  background: url(https://colary.ru/local/templates/new_colary/img/about_animation/frame_1.png);
  background-size: cover;
  position: absolute;
  opacity: 1;
}

.animation_frame2 {
  width: 100%;
  height: 100%;
  background: url(../img/about_animation/frame_2.png);
  background-size: cover;
  position: absolute;
  opacity: 0;
}

.animation_frame3 {
  width: 100%;
  height: 100%;
  background: url(https://colary.ru/local/templates/new_colary/img/about_animation/frame_3.png);
  background-size: cover;
  position: absolute;
  opacity: 0;
}

.animation_frame3_cloud1 {
  width: 45.3rem;
  height: 28rem;
  background: url(../img/about_animation/frame_3_cloud_1.png);
  background-size: cover;
  position: absolute;
  top: 25%;
  left: 10%;
  opacity: 0;
}

.animation_frame3_cloud2 {
  width: 18.2rem;
  height: 13.6rem;
  background: url(../img/about_animation/frame_3_cloud_2.png);
  background-size: cover;
  position: absolute;
  top: 46%;
  right: 50%;
  opacity: 0;
}

.animation_frame4_hand1 {
  width: 62.5rem;
  height: 32.2rem;
  background: url(../img/about_animation/frame_4_hand_1.png);
  background-size: cover;
  position: absolute;
  top: 25%;
  left: 10%;
  opacity: 0;
  -webkit-transform: translate(-28%, -21%) matrix(1, 0, 0, 1, 0, 0);
  transform: translate(-28%, -21%) matrix(1, 0, 0, 1, 0, 0);
}

.animation_frame4_hand2 {
  width: 55.8rem;
  height: 33.7rem;
  background: url(../img/about_animation/frame_4_hand_2.png);
  background-size: cover;
  position: absolute;
  top: 46%;
  right: 50%;
  opacity: 0;
  -webkit-transform: translate(164%, 8%) matrix(1, 0, 0, 1, 0, 0);
  transform: translate(164%, 8%) matrix(1, 0, 0, 1, 0, 0);
}

.animation_frame5 {
  width: 100%;
  height: 100%;
  background: url(https://colary.ru/local/templates/new_colary/img/about_animation/frame_5_logo.png);
  background-size: cover;
  position: absolute;
  opacity: 0;
}

.animation_frame6_comet {
  width: 10.8rem;
  height: 13.1rem;
  background: url(../img/about_animation/frame_6_comet_new.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  top: -7%;
  right: 28%;
  opacity: 0;
}

.animation_frame7 {
  width: 100%;
  height: 100%;
  background: url(../img/about_animation/frame_7_logo_dot.png);
  background-size: cover;
  position: absolute;
  opacity: 0;
}

.animation_frame_last {
  text-align: left;
  height: 100%;
  width: 100%;
  margin: auto;
  max-width: 130rem;
}

.animation_frame_f {
  text-align: left;
  height: 100%;
  width: 100%;
  margin: auto;
  max-width: 130rem;
}
.animation_frame_f:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.animation_frame_last:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.animation_frame_last_center {
  display: inline-block;
  vertical-align: middle;
}

.animation_frame_last h1, .animation_frame_last .xh1 {
  font-size: 15.5rem;
  color: #fc5054;
  text-transform: uppercase;
  margin: 0;
  opacity: 0;
  cursor: default;
}

.animation_frame_last p {
  font-family: 'ProximaNovaExtrabold', Arial, sans-serif;
  font-size: 5rem;
  color: #fff;
  margin: 0;
  max-width: 100rem;
  opacity: 0;
  cursor: default;
}

.header_about .arrow_down {
  position: fixed;
  height: 60px;
  left: 50%;
  margin-left: -30px;
  bottom: 50px;
  opacity: 0;
}

.header_about .arrow_down .aniarrow_down .arrow_b {
  fill: #fc5054;
}

.scrollmouse {
  position: fixed;
  left: 50%;
  margin-left: -24px;
  bottom: 68px;
}

.header_contacts {
  height: 100%;
  background: #fff;
  position: relative;
}

.contacts_wrapper {
  margin: auto;
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: absolute;
  display: table;
}

.contacts_map {
  width: 53.5%;
  height: 105%;
  height: 105vh;
  background-color: #06121b;
  float: left;
}

.map_overlay {
  position: absolute;
  top: 21rem;
  max-width: 80rem;
  padding-left: 10rem;
}

.contacts_map h1, .contacts_map .animation_frame_last {
  text-transform: none;
}

.contacts_map p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 3rem;
  color: #fff;
}

#zayavki {
  position: absolute;
  bottom: 15rem;
}

.contacts_data {
  width: 46.5%;
  height: 100%;
  background-color: #fff;
  float: left;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 3rem;
  color: #1f212a;
  padding-top: 27rem;
  padding-left: 16.7rem;
}

.contacts_data_phone {
  margin-bottom: 10rem;
}

.contacts_data_phone:before {
    font-family: 'icomoon2' !important;
    content: "\e942";
    font-size: 3rem;
    bottom: 0.2rem;
    position: relative;
}

.contacts_data_mail {
  margin-bottom: 10rem;
}

.contacts_data_mail:before {
  font-family: 'colaryicon' !important;
  content: "\e903";
  font-size: 2rem;
  bottom: 0.2rem;
  position: relative;
}

.contacts_data_adres:before {
  font-family: 'colaryicon' !important;
  content: "\e901";
  font-size: 3rem;
  bottom: -0.5rem;
  position: relative;
}

.contacts_data_mail span, .contacts_data_adres span, .contacts_data_phone span {
  position: absolute;
  max-width: 42rem;
  margin-left: 2rem;
}

.contacts_data_mail span a, .contacts_data_adres span a, .contacts_data_phone span a {
color: inherit; text-decoration: none;
}

.contacts_social {
  margin-left: 4rem;
}

.contacts_data_adres {
  margin-bottom: 12rem;
}

.contacts_data .button_group {
  position: absolute;
  bottom: auto;
  right: auto;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

.header_contacts .arrow_down {
  position: absolute;
  left: 50%;
  width: 60px;
  margin-left: -30px;
  bottom: 50px;
}

.aniarrow_down.red .arrow_b {
  fill: #fc5054;
}

.zayavki_case {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.zayavki_case .title_frame {
  margin-top: 4rem !important;
}
.zayavki_case .form_wrapper {
  margin-bottom: 0 !important;
}

.zayavki_contacts {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.zayavki_contacts .form_wrapper {
  margin-bottom: 0 !important;
}

.footer_contacts {
  margin-top: 0 !important;
}

.case-block_new {
  height: 97.1rem;
  background: #f5f5f5;
}

.case-block_new.case_rostex {
  position: relative;
  background-image: url(../img/cases/rostex/rostex_bl2.jpg);
  background-size: cover;
}

.case-block_new.case_rostex .img_laptop {
  width: 115.1rem;
  height: 70.6rem;
  background-image: url(../img/cases/rostex/Laptop.png);
  background-size: cover;
  position: absolute;
  right: 5rem;
  top: -60rem;
  z-index: 10;
}

.case-block_new.case_rostex .cloud_helicopter {
  position: absolute;
  top: -15rem;
  z-index: 11;
}

.case-block_new.case_rostex .wrapper {
  z-index: 12;
  overflow: visible !important;
}

.case-block_new.case_rostex .case-block_new_text {
  z-index: 12;
  max-width: 64rem;
  padding-left: 21rem;
  padding-top: 14rem;
  box-sizing: content-box;
}

.case-block_new.case_rostex .case-block_new_text h3,
.case-block_long.case_rostex .case-block_new_text h3,
.case-block.old_case_block .case-block_new_text h3,
.case-title span,
.case-text h3 {
  font-size: 3rem;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
}

.case-block_new.case_rostex .case-block_new_text p,
.case-block.old_case_block .case-block_new_text p,
.case-block.old_case_block .case-lead p,
.case-img-caption,
.case-text p {
  font-size: 2.5rem;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  line-height: 1.4;
}

.case-block_new.case_rostex .case-block_new_text h3,
.case-block_long.case_rostex .case-block_new_text h3 {
  margin-bottom: 4.5rem;
  margin-top: 8rem;
}

.case-block.old_case_block .case-block_new_text h3,
.case-block.old_case_block .case-block_new_text p,
.case-block.old_case_block .case-lead p,
.case-title span,
.case-img-caption,
.case-text h3,
.case-text p {
  color: #000;
}

.case-img-caption.wrapper,
.case-title-block,
.case-text {
  padding-left: 20.5rem;
  padding-right: 20.5rem;
}

.case-block_new.case_rostex .case-block_new_webpage_wrapper {
  position: relative;
  width: 180rem;
  height: 200rem;
  top: -78rem;
  overflow: hidden;
}

.case-block_new.case_rostex .case-block_new_webpage {
  width: 97.2rem;
  height: 58.6rem;
  position: absolute;
}

.cbnw1 {
  left: 81rem;
  top: 35rem;
}

.cbnw2 {
  left: 68rem;
  top: 13rem;
}

.case-block_long.case_rostex {
  background: #1e2649;
  height: 256rem;
  overflow: hidden;
  position: relative;
}

.cbl_lines {
  width: 100%;
  height: auto;
  position: absolute;
  top: -66rem;
}

.cbl_prototip {
  width: 313.2rem;
  height: 165.5rem;
  position: absolute;
  left: 50%;
  margin-left: -128.6rem;
}

.case_rostex .prototype_bubble_1 {
  width: 44rem;
  position: absolute;
  right: 63rem;
  top: 30.5rem;
}

.case_rostex .prototype_bubble_1 p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2rem;
  font-style: italic;
  color: #fff;
}

.case_rostex .prototype_bubble_1 .pbline {
  width: 43.9rem;
  height: 8.4rem;
  background: url(../img/cases/rostex/prototip_line1.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  left: -0.8rem;
  top: -1.4rem;
}

.case_rostex .prototype_bubble_1 .pb1_numbers {
  width: 40.6rem;
  height: 8.9rem;
  background: url(../img/cases/rostex/pb1_numbers.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  top: 3rem;
  left: 49rem;
}

.case_rostex .prototype_bubble_2 {
  width: 57rem;
  position: absolute;
  right: 11.6rem;
  top: 46.6rem;
}

.case_rostex .prototype_bubble_2 p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2rem;
  font-style: italic;
  color: #fff;
}

.case_rostex .prototype_bubble_2 .pbline {
  width: 57.9rem;
  height: 7.8rem;
  background: url(../img/cases/rostex/prototip_line2.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  left: -0.8rem;
  top: -1.4rem;
}

.case_rostex .prototype_bubble_3 {
  width: 57rem;
  position: absolute;
  right: 97.1rem;
  top: 145.6rem;
}

.case_rostex .prototype_bubble_3 p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2rem;
  font-style: italic;
  color: #fff;
}

.case_rostex .prototype_bubble_3 .pbline {
  width: 67rem;
  height: 10rem;
  background: url(../img/cases/rostex/prototip_line3.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  top: -10rem;
}

.case_rostex .prototype_bubble_3 .pbbl_img {
  width: 25.2rem;
  height: 45.8rem;
  position: relative;
  top: -8rem;
}

.case_rostex .prototype_bubble_4 {
  width: 55rem;
  position: absolute;
  right: 43.4rem;
  top: 167.9rem;
}

.case_rostex .prototype_bubble_4 p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2rem;
  font-style: italic;
  color: #fff;
}

.case_rostex .prototype_bubble_4 .pbline {
  width: 67rem;
  height: 13.9rem;
  background: url(https://colary.ru/local/templates/new_colary/img/cases/rostex/prototip_line4.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  top: -13.5rem;
}

.case_rostex .prototype_bubble_4 .pb4_static {
  width: 64.3rem;
  height: 18.3rem;
  position: absolute;
  bottom: -8rem;
  left: -1rem;
}

.case_rostex .prototype_bubble_4 .pb4_static .pb4_static_item {
  width: 33.333%;
  height: 100%;
  float: left;
  text-align: center;
}

.case_rostex .prototype_bubble_4 .pb4_static .pb4_static_item p {
  font-size: 1.6rem;
  color: #8b8c8f;
  position: relative;
  top: 13rem;
}

.case-block_long.case_rostex .case-block_new_text {
  padding-left: 21rem;
  box-sizing: content-box;
}

.case-block_long.case_rostex .case-block_new_text h3 {
  color: #fff;
}

.case-block_new_text_page {
  min-width: 22rem;
  max-width: 28rem;
  display: inline-block;
  margin-bottom: 5rem;
  position: relative;
  z-index: 20;
}

.case-block_new_text_page p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2rem;
  position: absolute;
  top: 0;
  left: 5rem;
  color: #fff;
  margin: 0;
  min-width: 20rem;
}

.case-block_new_text_page a {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 1.4rem;
  font-style: italic;
  position: absolute;
  top: 2.5rem;
  left: 5rem;
  color: #fff;
  text-decoration: underline;
  margin: 0;
  min-width: 20rem;
}

.icon-block_new_text_page {
  width: 4rem;
  height: 4rem;
  background-size: 3.8rem;
  background-repeat: no-repeat;
}

.ibntp1 {
  background-image: url(../img/cases/rostex/icon_home.png);
}

.ibntp2 {
  background-image: url(../img/cases/rostex/icon_diagram.png);
}

.ibntp3 {
  background-image: url(../img/cases/rostex/icon_news.png);
}

.ibntp4 {
  background-image: url(../img/cases/rostex/icon_menu.png);
}

.case-block_white.case_rostex {
  height: 236.3rem;
  position: relative;
  overflow-y: visible;
}

.cbw_news1 {
  width: 137rem;
  height: auto;
  position: absolute;
  top: -41rem;
  left: -20rem;
}

.cbw_news2 {
  width: 192rem;
  height: auto;
  position: absolute;
  right: -58rem;
  top: 39rem;
}

.case-block_categorize {
  width: 56rem;
  position: absolute;
  bottom: 6rem;
  right: 11.5rem;
  color: #fff;
}

.case-block_categorize h3 {
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  font-size: 3rem;
}

.case-block_categorize p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2.5rem;
  line-height: 3.7rem;
}

.case-block_bottom.case_rostex {
  height: 300rem;
  background-color: #fff;
  background-image: url(../img/cases/rostex/bottom_bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  overflow-y: visible;
  position: relative;
}

.cbbtm_browser {
  position: absolute;
  top: -9.5rem;
  width: 143.2rem;
  height: auto;
}

.case_rostex_news_cat {
  width: 41.7rem;
  height: 10.6rem;
  float: right;
  margin-right: 17rem;
  margin-top: 9rem;
  background-image: url(../img/cases/rostex/cat_news.png);
  background-size: cover;
}

.case-block_white .line_w_dot {
  background: #1e2649;
  height: 1px;
  width: 90rem;
  float: right;
  margin-right: 9.5rem;
  margin-top: 6.5rem;
  clear: right;
  position: relative;
}

.case-block_white .line_w_dot div {
  background: #1e2649;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  position: absolute;
  right: 0;
  top: -0.25rem;
}

.case-block_white .paragraph_top_right {
  clear: right;
  float: right;
  display: block;
  width: 50rem;
  margin-right: 9rem;
  margin-top: 5rem;
}

.case-block_white p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2.5rem;
  line-height: 3.75rem;
}

.case-block_white .holdings {
  margin-top: 135rem;
  margin-left: 21rem;
  position: relative;
}

.case-block_white .holdings p {
  width: 52.7rem;
}

.case-block_white .holdings h3 {
  font-size: 3rem;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
}

.case-block_white .holdings img {
  position: absolute;
  right: 12rem;
  top: 5rem;
  width: 86.2rem;
  height: 41.5rem;
}

.case-block_white .holdings .kalashlines {
  position: absolute;
  right: 21rem;
  top: 43.5rem;
  width: 82.9rem;
  height: 5.3rem;
  background-image: url(../img/cases/rostex/kalashlines.png);
  background-size: cover;
}

.case-block_white .static_page {
  padding: 0 21rem;
  text-align: center;
  margin-top: 9rem;
}

.case-block_white .static_page h3 {
  font-size: 3rem;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
}

.case-block_bottom .rostex_browser_sign {
  float: right;
  display: block;
  width: 48rem;
  margin-top: 21rem;
  margin-right: 8rem;
}

.case-block_bottom .rostex_browser_sign p {
  font-size: 2rem;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-style: italic;
  color: #fff;
}

.case-block_bottom .rostex_browser_bottom {
  position: absolute;
  top: 86rem;
  width: 98.5rem;
  right: 61rem;
  line-height: 3.75rem;
}

.case-block_bottom .rostex_browser_bottom p {
  font-size: 2.5rem;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  color: #fff;
}

.case-block_bottom .cloud1 {
  position: absolute;
  width: 68.3rem;
  height: auto;
  top: 113rem;
  left: -3rem;
}

.case-block_bottom .sky2 {
  position: absolute;
  width: 57rem;
  height: auto;
  top: 253rem;
  left: 0;
}

.case-block_bottom .proto3 {
  position: absolute;
  width: 197.4rem;
  height: 105.6rem;
  top: 104.9rem;
  right: -96.7rem;
}

.case-block_bottom .proto2 {
  position: absolute;
  width: 225rem;
  height: 122.4rem;
  top: 141.8rem;
  right: -52.6rem;
}

.case-block_bottom .proto1 {
  position: absolute;
  width: 262.3rem;
  height: 143.1rem;
  top: 175.4rem;
  right: -10.8rem;
}

.case-block_bottom .proto_lines {
  position: absolute;
  width: 254.7rem;
  height: auto;
  top: 64.4rem;
  right: -54.8rem;
}

.rostex_browser_result {
  width: 100%;
  height: 75rem;
  background-image: url(../img/cases/rostex/ne_samiy_umniy.png);
  background-position: bottom;
  text-align: center;
}

.rostex_browser_result .wrapper {
  padding: 0 21rem;
}

.rostex_browser_result h3 {
  font-size: 3rem;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  position: relative;
  top: 23.5rem;
}

.rostex_browser_result p {
  font-size: 2.5rem;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  position: relative;
  line-height: 3.75rem;
  top: 23.5rem;
}

.rostex_browser_result .nsu_logo {
  width: 37.6rem;
  height: auto;
  margin-top: 27rem;
}

.case-bottom-nav {
  padding: 3rem;
  text-align: center;
}

.case-bottom-nav .wrapper {
  height: 5rem;
}

.case-bottom-nav .wrapper {
  margin: 0 6.3rem;
}

.go-cases {
  display: inline-block;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 2rem;
  line-height: 58px;
  position: relative;
  text-decoration: none;
  font-weight: 300;
  padding-left: 33px;
  text-transform: uppercase;
  color: #fc5054;
}

.go-cases:before {
  font-family: 'colaryicon';
  content: "\e91c";
  position: absolute;
  top: 48%;
  left: 0.7rem;
  width: 1.9rem;
  height: 2.2rem;
  margin-top: -2.8rem;
}

.link-underline {
  -moz-transition: border-color 0.15s linear;
  -ms-transition: border-color 0.15s linear;
  -o-transition: border-color 0.15s linear;
  -webkit-transition: border-color 0.15s linear;
  transition: border-color 0.15s linear;
  border-bottom: 1px solid #fc5054;
}

a:hover .link-underline {
  border-bottom-color: transparent;
}

.rostex_logo {
  width: 9.9rem;
  height: 12.2rem;
  position: absolute;
  top: 37rem;
  left: 0;
}

.ProgressBar {
  margin-left: 4rem;
}

.ProgressBar,
.ProgressBar-contentCircle {
  display: table;
  height: 13.3rem;
  position: absolute;
  width: 13.3rem;
}

.ProgressBar-circle,
.ProgressBar-background {
  fill: none;
  stroke: #ef3340;
  stroke-width: 5;
  stroke-linecap: round;
  stroke-dasharray: 0;
  stroke-dashoffset: 0;
  position: relative;
  z-index: 10;
}

.ProgressBar-background {
  stroke: white;
  stroke-width: 4;
  z-index: 0;
}

.ProgressBar-percentage {
  font-family: 'proxima_nova_extra_condenLtIt', Arial, sans-serif;
  color: #ef3340;
  font-size: 5.3rem;
  text-align: center;
  width: 100%;
  display: table-cell;
  vertical-align: middle;
}

.ProgressBar.pba1 .ProgressBar-circle {
  stroke: #ef3340;
}

.ProgressBar.pba1 .ProgressBar-percentage {
  color: #ef3340;
}

.ProgressBar.pba2 .ProgressBar-circle {
  stroke: #23527e;
}

.ProgressBar.pba2 .ProgressBar-percentage {
  color: #23527e;
}

.ProgressBar.pba3 .ProgressBar-circle {
  stroke: #ab8435;
}

.ProgressBar.pba3 .ProgressBar-percentage {
  color: #ab8435;
}

.fork_case.bl1 {
  background-color: #fff;
  position: relative;
  overflow-y: visible;
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.fork_case.bl1 .case-text {
  margin-bottom: 50px;
}

.fork_case.bl2 {
  background-color: #eeecec;
  overflow-y: visible;
  padding-top: 5rem;
  position: relative;
}

.fork_case.bl2 .resh_b1, .fork_case.bl2 .resh_b2, .fork_case.bl2 .resh_b3 {
  position: absolute;
  right: 0;
}

.fork_case.bl2 .resh_b1 {
  width: 73.9rem;
  height: auto;
  top: 12rem;
}

.fork_case.bl2 .resh_b2 {
  width: 120.7rem;
  height: auto;
  top: 59rem;
}

.fork_case.bl2 .resh_b3 {
  width: 68.9rem;
  height: auto;
  top: 35rem;
  right: 15rem;
}

.fork_case.bl2 .ciiv2 {
  display: none;
}

.fork_case.bl2 .flwdth_maket {
  width: 250.9rem;
  position: relative;
  left: 50%;
  margin-left: -125.45rem;
  margin-top: -43rem;
}

.fork_case.bl2 .iphonleft {
  position: absolute;
  right: 0;
  bottom: 15rem;
  width: 72.7rem;
  height: auto;
}

.fork_case.bl3 {
  background-color: #fff;
  overflow-y: visible;
}

.fork_case.bl4 {
  background-color: #292a2b;
  overflow-y: visible;
  position: relative;
}

.fork_case.bl4 .landos {
  width: 95.8rem;
  height: auto;
  right: 6rem;
  top: 0;
  position: absolute;
}

.fork_case.bl5 {
  height: 201rem;
  background-color: #fff;
  position: relative;
  overflow-y: visible;
}

.fork_case.bl5 .maket_img {
  position: absolute;
  width: 382.3rem;
  height: auto;
  top: -38rem;
  left: 50%;
  margin-left: -191.15rem;
}

.fork_case.bl6 {
  padding-top: 7.7rem;
  padding-bottom: 7rem;
  background-color: #eeecec;
}

.fork_case.bl6 p.bl_title {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2.5rem;
  color: #73787e;
  text-align: center;
  margin-bottom: 5rem;
  margin-top: 1.6rem;
  margin-left: 3rem;
  margin-right: 3rem;
}

.fork_case.bl6 .bl_item_wrap {
  width: 100%;
  margin: 1%;
}

.fork_case.bl6 .bl_item_wrap .bl_item {
  float: left;
  width: 26.4%;
  margin: -1%;
}

.fork_case.bl6 .bl_item_wrap .bl_item img {
  width: 100%;
  height: auto;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}

.ss4k .slick-list {
  overflow-y: visible;
}

.ss4k .portfolio-item_slider {
  margin-bottom: 15rem;
}

.top_transport {
  width: auto;
  height: 88rem;
  position: absolute;
  right: 0;
  bottom: 0;
}

.fork_case.bl7 {
  background-color: #fff;
  padding-top: 4rem;
}

.cbnt_4k {
  float: right !important;
  width: 40% !important;
}

.cc_white h1, .cc_white h2, .cc_white h3, .cc_white p,
.cc_white .xh1, .cc_white .xh2, .cc_white .xh3, {
  color: #fff;
}

.cc_marg_top {
  margin-top: 16rem !important;
}

.case4k-img-slider {
  position: absolute !important;
  top: 325rem;
  right: 0;
  width: 99rem;
}

.case4k-img-slider .case4k-img-slider-item {
  margin-top: 5rem;
}

.case4k-img-slider .case4k-img-item img {
  width: 45.3rem;
  height: auto;
}

.case4k-img-slider .slick-arrow {
  width: 4rem;
  height: 4rem;
  background: transparent;
  border: 1px solid #fff;
  top: 0;
  opacity: 1 !important;
}

.case4k-img-slider .slick-arrow:hover {
  background: #fff;
}

.case4k-img-slider .slick-arrow svg {
  display: none;
}

.case4k-img-slider .slick-next {
  left: 5rem !important;
}

.case4k-img-slider .slick-next:before {
  width: 4rem;
  height: 4rem;
  background: url(../img/cases/case_4k/arr_right_white.png);
  background-size: 1.1rem 2.1rem;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: -1px;
  left: -1px;
}

.case4k-img-slider .slick-prev:before {
  width: 4rem;
  height: 4rem;
  background: url(../img/cases/case_4k/arr_left_white.png);
  background-size: 1.1rem 2.1rem;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: -1px;
  left: -1px;
}

.case4k-img-slider .slick-next:hover:before {
  background: url(../img/cases/case_4k/arr_right_black.png);
  background-size: 1.1rem 2.1rem;
  background-position: center;
  background-repeat: no-repeat;
}

.case4k-img-slider .slick-prev:hover:before {
  background: url(https://colary.ru/local/templates/new_colary/img/cases/case_4k/arr_left_black.png);
  background-size: 1.1rem 2.1rem;
  background-position: center;
  background-repeat: no-repeat;
}

.case4k-img-slider .slick-track {
  margin-left: 4.5rem;
}

@media only screen and (max-width: 1640px) {
  .case-block_new.case_rostex .wrapper {
    margin: 0 !important;
    overflow: hidden !important;
  }
}

@media only screen and (max-width: 1450px) {
  .case-block_new.case_rostex .case-block_new_text {
    z-index: 12;
    max-width: 64rem;
    padding-left: 27rem;
    padding-top: 14rem;
    box-sizing: content-box;
  }
  .cbnw1 {
    left: 86rem;
    top: 35rem;
  }
  .cbnw2 {
    left: 73rem;
    top: 13rem;
  }
  .case-block_new.case_rostex .wrapper {
    margin: 0 !important;
    overflow: hidden !important;
  }
  .go-cases {
    font-size: 16px;
    line-height: 40px;
  }
  .cc_marg_top {
    margin-top: 27rem !important;
  }
}

@media only screen and (max-width: 1300px) {
  .fork_case.bl4 .landos {
    width: 89rem;
  }
  .case4k-img-slider {
    width: 93rem;
    top: 303rem;
  }
  .cc_marg_top {
    margin-top: 13rem !important;
  }
  .case4k-img-slider .slick-track {
    margin-left: -5rem;
  }
}

@media only screen and (max-width: 1100px) {
  .case-block_new.case_rostex .img_laptop {
    width: 70rem;
    height: 43rem;
    right: 5rem;
    top: -39rem;
  }
  .cbnt_4k {
    float: left !important;
    width: 100% !important;
  }
  .fork_case.bl1 .case-img-block .case-img-item img {
    margin-left: -7rem;
  }
  .cc_marg_top {
    margin-top: 20rem !important;
  }
  .cc_hg {
    width: 56rem !important;
  }
  .case4k-img-slider .case-text {
    margin-top: -45rem !important;
  }
}

@media only screen and (max-width: 800px) {
  .case-block_new.case_rostex .case-block_new_text {
    padding-left: 3rem;
  }
  .cbnw1 {
    left: 66rem;
    top: 35rem;
  }
  .cbnw2 {
    left: 53rem;
    top: 13rem;
  }
  .fork_case.bl6 .bl_item_wrap .bl_item {
    width: 51.4%;
  }
  .fork_case.bl5 .maket_img {
    left: 75%;
  }
  .top_transport {
    right: -32rem;
  }
  .fork_case.bl1 .case-img-block .case-img-item img {
    margin-left: 0;
  }
  .fork_case.bl1 .case-img-block {
    position: relative !important;
  }
  .fork_case.bl1 .case-img-block .case-img-item img {
    width: 100% !important;
  }
  .case_col-empty {
    display: none;
  }
  .fork_case.bl2 .resh_b1,
  .fork_case.bl2 .resh_b2,
  .fork_case.bl2 .resh_b3 {
    display: none;
  }
  .fork_case.bl2 .case-block_new_text {
    width: auto !important;
  }
  .fork_case.bl2 .ciiv1 {
    display: none;
  }
  .fork_case.bl2 .ciiv2 {
    display: block;
  }
  .fork_case.bl2 .flwdth_maket {
    width: 120%;
    position: relative;
    left: 50%;
    margin-left: -60%;
    margin-top: 0;
  }
  .iphonleft {
    display: none;
  }
  .iphonright {
    width: 100% !important;
    left: auto !important;
  }
  .ccvv_i {
    padding-top: 0 !important;
  }
  .ccvv_g img {
    display: none;
  }
  .ccv_h {
    width: 100% !important;
  }
  .fork_case.bl4 .landos {
    position: relative;
    width: 100%;
    right: 0;
  }
  .ccv_h h1, .ccv_h h2, .ccv_h h3, .ccv_h p,
  .ccv_h .xh1, .ccv_h .xh2, .ccv_h .xh3, {
    color: #fff;
  }
  .cc_marg_top, .cc_hg {
    margin-top: 0rem !important;
    width: 100% !important;
  }
  .case4k-img-slider {
    display: none !important;
  }
  .cc_vhd {
    width: 100% !important;
  }
}

@media only screen and (max-width: 800px) {
  .cloud_helicopter {
    display: none;
  }
  .img_laptop {
    right: 0;
  }
}

@media (max-width: 767px) {
  .go-cases {
    display: none;
  }
}

@media (max-width: 479px) {
  .case-bottom-nav {
    padding: 20px;
  }
}

@media (max-width: 479px) {
  .fork_case.bl5 .maket_img {
    left: 87%;
  }
}

@media (max-width: 420px) {
  .top_transport {
    height: 65rem;
    right: -19rem;
  }
  .fork_case.bl5 .maket_img {
    position: absolute;
    width: 200%;
    height: auto;
    top: 20rem;
    left: 50% !important;
    margin-left: -100%;
  }
  .fork_case.bl5 {
    height: 115rem;
  }
}

@media (max-width: 380px) {
  .fork_case.bl5 {
    height: 105rem;
  }
}

@media (max-width: 330px) {
  .fork_case.bl5 .maket_img {
    left: 102%;
  }
  .fork_case.bl5 {
    height: 92rem;
  }
}

.header {
  width: 100%;
  height: 100%;
  background-color: #2d2e35;
  position: relative;
}

.topmenu {
  height: 135px;
  width: 100%;
  z-index: 998;
  position: fixed;
  background: transparent;
  -webkit-transition: all 0.75s ease 0s;
  transition: all 0.75s ease 0s;
}

.topmenu .wrapper {
  position: relative;
  margin: 0 10rem;
  max-width: 100%;
  overflow: visible;
}
.topmenu .wrapper>.logotype {
  position:relative;
  width:20rem;
  height:94%;
  display:inline-block;
}
.topmenu .wrapper .hb_mini {
  position: absolute;
  bottom: 0;
  width: 100%;
}
.topmenu .wrapper .hb_mini .hb_link {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 14px;
  line-height: 1;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
.topmenu .wrapper .hb_mini .hb_link>div,
.topmenu .wrapper .hb_mini .hb_link>img{
  max-width: 50%;
}
.topmenu .wrapper .hb_mini .hb_link>div{
  margin-bottom: -1px;
  margin-right: 5px;
  white-space: nowrap;
}
.topmenu .wrapper .hb_mini .hb_link.black {
  display: none;
}
.topmenu_white .wrapper .hb_mini .hb_link {
  display: none;
}
.topmenu_white .wrapper .hb_mini .hb_link.black {
  display: flex;
  color: #000;
}
@media screen and (max-width: 1450px) {
  .topmenu .wrapper .hb_mini .hb_link{
    font-size: 11px;
  }
}
@media screen and (max-width: 1100px) {
  .topmenu .wrapper .hb_mini .hb_link{
    font-size: 10px;
  }
}
@media screen and (max-width: 600px) {
  .topmenu .wrapper .hb_mini{
    margin-left: 2rem;
  }
}
@media only screen and (max-width: 1910px) {
  .topmenu .wrapper {
    margin: 0 9rem;
    max-width: 1720px;
  }
  .portfolio-item-text {
    margin-left: 9rem !important;
  }

  .clients_content .wrapper {
    margin: auto 9rem !important;
  }
}

.topmenu_white {
  background: #fff;
}

.topmenu .logo {
  position: relative;
  width: 20rem !important;
  height: 94% !important;
  display: inline-block !important;
  margin-left: 0.2rem;
}

.simplelogo {
  background: url(../img/logo_colary.png);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 0 center;
}

.bodymovin path {
  fill: #fc5054;
}

.topmenu .phone {
  display: inline-block;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 2.7rem;
  color: #fff;
  text-decoration: none;
  position: absolute;
  right: 40rem;
  margin-top: 51.5px;
  margin-bottom: 51.5px;
  -webkit-transition: all 1s ease;
  transition: all 1s ease;
}

.menu-switcher {
  position: absolute;
  right: 10px;
  margin: 0;
  padding: 0;
  width: 43px;
  height: 34px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-shadow: none;
  border-radius: none;
  border: none;
  outline: none;
  background: transparent;
  cursor: pointer;
  float: right;
  margin-top: 5.05rem;
  margin-bottom: 5.05rem;
  z-index: 9999;
}

.black .hamburger-inner, .black .hamburger-inner::before, .black .hamburger-inner::after {
  background: #000;
}

.logo.active {
  z-index: 1000;
  position: relative;
}

.menu-switch.active {
  z-index: 1000;
}

.menu-switch.active span {
  background: none;
}

.menu-switch.active span::before {
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.menu-switch.active span::after {
  bottom: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.side_menu {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #202429;
  visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: -webkit-transform 0.5s, visibility 0s 0.5s;
  -webkit-transition: visibility 0s 0.5s, -webkit-transform 0.5s;
  transition: visibility 0s 0.5s, -webkit-transform 0.5s;
  transition: transform 0.5s, visibility 0s 0.5s;
  transition: transform 0.5s, visibility 0s 0.5s, -webkit-transform 0.5s;
  z-index: 997;
}

.side_menu.show {
  visibility: visible;
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.wrapper_wrapper_menu {
  position: absolute;
  width: 100%;
  height: 100%;
  display: table;
}

.wrapper_menu {
  display: table-cell;
  vertical-align: middle;
}

.side_menu .main_menu {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  color: #fff;
  width: 60%;
  left: 0;
  padding-left: 1.2rem;
  margin-left: 22.5rem;
}

.main_menu li {
  list-style-type: none;
  font-size: 6.3rem;
  line-height: 1;
  margin: 40px 0;
  position: relative;
  left: 200px !important;
  opacity: 1 !important;
  -webkit-transition: all .7s ease;
  transition: all .7s ease;
}

.main_menu li:nth-child(2) {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

.main_menu li:nth-child(3) {
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
}

.main_menu li:nth-child(4) {
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
}

.main_menu li:nth-child(5) {
  -webkit-transition-delay: 0.8s;
  transition-delay: 0.8s;
}

.main_menu li:nth-child(6) {
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
}

.main_menu .reset {
  left: 0px !important;
  opacity: 1 !important;
}

.main_menu a:before {
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
  background: #fff;
  content: '';
  position: relative;
  top: -1.65rem;
  right: 10px;
}

.main_menu a {
  padding: 8px 0;
  position: relative;
}

.main_menu a:after {
  position: absolute;
  top: 100%;
  left: 10px;
  width: 100%;
  height: 2px;
  background: #fc5054;
  content: '';
  opacity: 0;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
}

.main_menu a:hover:after,
.main_menu a:focus:after,
.main_menu a.active:after {
  opacity: 1;
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}

.main_menu li a {
  text-decoration: none;
  color: #fff;
}

.main_menu li:hover a, .main_menu li .active {
  color: #fc5054;
}

.main_menu li:hover a:before, .main_menu li .active:before {
  background: #fc5054;
}

.side_menu .language {
  position: absolute;
  bottom: 0;
  margin-bottom: 8.3rem;
  margin-top: 8.3rem;
}

.side_menu .phone_block {
  position: absolute;
  bottom: 0;
  margin-bottom: 7.8rem;
  margin-top: 7.8rem;
}

.side_menu .phone_block .phone {
  display: block !important;
}

.side_menu .phone_block .phone {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  color: #fff;
  font-size: 2.7rem;
  text-align: center;
  margin-top: 8.2rem;
  display: block;
}

.side_menu .phone_block .phone {
  text-decoration: none;
  color: #fc5054;
}

.side_menu .phone_block .phone:hover {
  color: #fff;
}

.header_slider .slick-dotted.slick-slider {
  margin-bottom: 0;
}

.header_slider .slider {
  width: 100% !important;
}

.header_slider .slick-slide {
  height: 100vh !important;
}

.slick-slide {
  outline: none;
}

.slick-dots li .pie_progress {
  opacity: 0;
}

.header .slick-dots li button {
  -webkit-transition: all .1s, -webkit-transform .1s;
  transition: all .1s, -webkit-transform .1s;
  transition: all .1s, transform .1s;
  transition: all .1s, transform .1s, -webkit-transform .1s;
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
}

.pie_progress {
  position: relative;
  text-align: center;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.pie_progress {
  width: 130%;
  position: absolute;
  top: 17px;
  left: -3px;
}

.pie_progress svg {
  margin: 0 auto;
}

.pie_progress__content, .pie_progress__number, .pie_progress__label, .pie_progress__icon {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.pie_progress__number {
  font-size: 0;
  color: transparent;
}

.pie_progress__label {
  margin-top: 32px;
  font-size: 12px;
}

.pie_progress__svg {
  position: absolute;
  display: inline-block;
  width: 100%;
  padding-bottom: 100%;
  overflow: hidden;
  vertical-align: middle;
  left: 0;
  top: 0;
}

.pie_progress__svg svg {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
}

.slider_wrapper {
  margin: auto;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
}



.slider_wrapper:before {
  height: 100%;
  display: inline-block;
  vertical-align: middle;
  content: '';
  position: absolute;
}

.slider {
  width: 100%;
  height: 100%;
  display: inline-block;
  white-space: normal;
  vertical-align: middle;
  z-index: 3;
}

.slider_slide {
  padding: 0;
  position: relative;
}

.slide_content {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  padding-left: 30rem;
  padding-right: 30rem;
}

.slick-initialized .slick-slide {
  display: table;
}

.slick-slide {
  margin: 0;
  height: 100vh;
}

.slick-prev,
.slick-next {
  width: auto;
  height: auto;
  z-index: 900;
}

.slick-prev:before,
.slick-next:before {
  color: white;
}

.slick-prev div,
.slick-next div {
  width: 65px;
  height: 48px;
}

.slick-prev {
  position: absolute;
  left: 139px;
}

.slick-next {
  position: absolute;
  right: 139px;
}

.slick-next .arrow_b,
.slick-prev .arrow_b {
  fill: #fff;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.slick-next .path,
.slick-prev .path {
  fill: none;
  stroke: #fff;
  stroke-width: 27;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  -webkit-animation: dash 2s linear forwards;
  animation: dash 2s linear forwards;
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.slick-next:hover .path,
.slick-prev:hover .path {
  stroke-dashoffset: 0;
  stroke: #fc5054;
}

.slick-next:hover .arrow_b,
.slick-prev:hover .arrow_b {
  -webkit-transform: translateX(30px);
  transform: translateX(30px);
  fill: #fc5054;
}

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

.aniarrow_down .arrow_b,
.aniarrow_down .arrow_b {
  fill: #fff;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.aniarrow_down .path,
.aniarrow_down .path {
  fill: none;
  stroke: #fff;
  stroke-width: 27;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  -webkit-animation: dash 2s linear forwards;
  animation: dash 2s linear forwards;
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.aniarrow_down:hover .path,
.aniarrow_down:hover .path {
  stroke-dashoffset: 0;
  stroke: #fc5054;
}

.aniarrow_down:hover .arrow_b,
.aniarrow_down:hover .arrow_b {
  -webkit-transform: translateX(30px);
  transform: translateX(30px);
  fill: #fc5054;
}

.pagenumber {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 2.7rem;
  color: #fff;
  display: none;
}

.header .pagenumber {
  display: block;
}

.slick-prev .pagenumber {
  position: absolute;
  left: -38px;
  top: 30px;
}

.slick-next .pagenumber {
  position: absolute;
  right: -38px;
  top: 30px;
}

.slick-dots {
  position: absolute;
  bottom: 50px;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
  right: 10px;
  z-index: 1;
}

.slider-progress {
  width: 100%;
  height: 3px;
  background: transparent;
  position: absolute;
  bottom: 20px;
}

.slider-progress .progress {
  width: 0%;
  height: 3px;
  background: #fc5054;
}

.slide_content h1, .slide_content .xh1 {
  font-family: 'ProximaNovaExtrabold', Arial, sans-serif;
  font-size: 6.3rem;
  line-height: 1;
  color: #fff;
  text-transform: uppercase;
  display: inline-block;
  outline: none;
}

.slide_content h1 a, .slide_content .xh1 a {
  text-decoration: none;
  color: #fff;
  transition: all .3s ease;
outline: none;
}
.slide_content h1 a:hover, .slide_content .xh1 a:hover {
  text-decoration: none;
  color: #fc5054;
}

.slide_content h1 a:after, .slide_content .xh1 a:after {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 2px;
  background: #fc5054;
  content: '';
  opacity: 0;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
}

.slide_content h1 a:hover:after, .slide_content .xh1 a:hover:after {
  opacity: 1;
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}

@media only screen and (max-width: 1200px) {
  .slide_content h1 a:hover, .slide_content .xh1 a:hover {
    text-decoration: underline;
  }
  .slide_content h1 a:after, .slide_content .xh1 a:after {
    display:none;
  }
}

.slide_content h2, .slide_content .xh2 {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  font-size: 3rem;
  color: #fff;
  margin-top: 2rem;
  margin-bottom: 8rem;
}

.slide_content ul {
  padding: 0;
  max-width: 100%;
}

.slide_content ul li {
  display: inline-block;
  list-style-type: none;
  width: 20%;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 1.8rem;
  color: #fff;
  position: relative;
  line-height: 3rem;
}

.slide_content ul li .image_ring {
  border: 2px solid #fc5054;
  width: 37px;
  height: 37px;
  border-radius: 50%;
  position: relative;
  top: 15px;
  margin-bottom: 30px;
}

.slide_content ul li .image_ring_one img {
  position: absolute;
  top: -10px;
  left: 10px;
}

.slide_content ul li .image_ring_two img {
  position: absolute;
  top: -5px;
  left: 10px;
}

.slide_content ul li .image_ring_three img {
  position: absolute;
  top: -10px;
  left: 12px;
}

.slide_content ul li .image_ring_four img {
  position: absolute;
  top: -4px;
  left: 13px;
}

.slide_content ul li .image_ring_five img {
  position: absolute;
  top: -14px;
  left: -3px;
}

.slide_content ul li .image_ring_six img {
  position: absolute;
  top: -14px;
  left: -3px;
}

.slide_content ul li .image_ring_seven img {
  position: absolute;
  top: -9px;
  left: 9px;
}

.slide_content ul li .image_ring_eight img {
  position: absolute;
  top: -10px;
  left: 7px;
}

.slick-dots li button {
  font-size: 14px;
  color: transparent;
  padding: 2px;
}

.slick-dots .slick-active button {
  font-size: 14px;
  color: white;
}

.slick-dots li.slick-active button:before {
  opacity: 1;
  color: #fff;
}

.slick-dots li button::before {
  font-family: slick;
  font-size: 40px;
  line-height: 20px;
  position: absolute;
  top: 20px;
  left: 0px;
  width: 20px;
  height: 20px;
  content: "•";
  text-align: center;
  opacity: 1;
  color: #fff;
  -webkit-font-smoothing: antialiased;
}

.fillvideo {
  width: 100%;
  height: 100%;
}

.bgvideo {
  position: absolute;
  left: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 1;
}

.bgvideo_t, .bgvid {
  position: absolute;
  left: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -1;
  display: block;
}

.video_filter {
  position: absolute;
  left: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  background-image: url(../img/video_filter.png);
  opacity: .50;
  z-index: 2;
}

.slide_image {
  position: absolute;
  left: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  background-image: url(https://colary.ru/local/templates/new_colary/img/video.png);
  background-size: cover;
  background-position: center;
  z-index: 2;
}

.bg_instedof {
  display: block !important;
  z-index: -1;
}

@media (min-aspect-ratio: 16 / 9) {
  #bgvideo, .bgvideo_t, .bgvid {
    height: 300%;
    top: -100%;
  }
}

@media (max-aspect-ratio: 16 / 9) {
  #bgvideo, .bgvideo_t, .bgvid {
    width: 300%;
    left: -100%;
  }
}

@supports (-o-object-fit: cover) or (object-fit: cover) {
  #bgvideo, .bgvideo_t, .bgvid {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
}

.competention {
  margin-top: 60px;
}

.competention_content {
  margin: 0 auto;
  padding: 2.8rem 8rem 0px 19.5rem;
  max-width: 100%;
  background-color: #fff;
}

.row {
  margin: 0 -10px;
  margin-bottom: 20px;
}

.row:last-child {
  margin-bottom: 0;
}

.competention_card {
  box-sizing: border-box;
  float: left;
  width: 25%;
  padding: 24.5px;
  padding-bottom: 0;
}

.competention_card:nth-child(4n+1) {
  clear: both;
}

.competention_card {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2.8rem;
  line-height: 2.8rem;
  position: relative;
}

.competention_card_icon {
  width: 180px;
  height: 150px;
  top: -3rem;
  position: absolute;
}

.site .competention_card_icon {
  background-image: url(../img/competention_icon/comp.png);
  background-position: 0 -15px;
  margin-left: -1.5rem;
  margin-top: 0.1rem;
}

.site .competention_card_icon:hover,
.site .competention_card_icon.plaing {
  -webkit-animation: play 7s steps(132) infinite;
  animation: play 7s steps(132) infinite;
}

@-webkit-keyframes play {
  100% {
    background-position-x: -22440px;
  }
}

@keyframes play {
  100% {
    background-position-x: -22440px;
  }
}

.mobile .competention_card_icon {
  background-image: url(../img/competention_icon/mobile.png);
  background-position: 0 -15px;
  margin-left: -4rem;
}

.mobile .competention_card_icon:hover,
.mobile .competention_card_icon.plaing {
  -webkit-animation: play2 3s steps(64) infinite;
  animation: play2 3s steps(64) infinite;
}

@-webkit-keyframes play2 {
  100% {
    background-position-x: -10880px;
  }
}

@keyframes play2 {
  100% {
    background-position-x: -10880px;
  }
}

.seo .competention_card_icon {
  background-image: url(https://colary.ru/local/templates/new_colary/img/competention_icon/rocket.png);
  background-position: 0 -15px;
  margin-left: -4.2rem;
  margin-top: 1.2rem;
}

.seo .competention_card_icon:hover,
.seo .competention_card_icon.plaing {
  -webkit-animation: play3 7s steps(100) infinite;
  animation: play3 7s steps(100) infinite;
}

@-webkit-keyframes play3 {
  0% {
    background-position: 0 -15px;
  }
  33.3333% {
    background-position: -17000px -15px;
  }
  33.3334% {
    background-position: 0 -185px;
  }
  66.6666% {
    background-position: -17000px -185px;
  }
  66.6667% {
    background-position: 0 -355px;
  }
  99.9999% {
    background-position: -17000px -355px;
  }
  100% {
    background-position: 0 -15px;
  }
}

@keyframes play3 {
  0% {
    background-position: 0 -15px;
  }
  33.3333% {
    background-position: -17000px -15px;
  }
  33.3334% {
    background-position: 0 -185px;
  }
  66.6666% {
    background-position: -17000px -185px;
  }
  66.6667% {
    background-position: 0 -355px;
  }
  99.9999% {
    background-position: -17000px -355px;
  }
  100% {
    background-position: 0 -15px;
  }
}

.marketing .competention_card_icon {
  background-image: url(../img/competention_icon/almaz.png);
  background-position: 0 -15px;
  margin-left: -4.3rem;
  margin-top: -0.6rem;
}

.marketing .competention_card_icon:hover,
.marketing .competention_card_icon.plaing {
  -webkit-animation: play4 3s steps(89) infinite;
  animation: play4 3s steps(89) infinite;
}

@-webkit-keyframes play4 {
  100% {
    background-position-x: -15130px;
  }
}

@keyframes play4 {
  100% {
    background-position-x: -15130px;
  }
}

.strategy .competention_card_icon {
  background-image: url(../img/competention_icon/lamp.png);
  background-position: 0 -15px;
  margin-left: -5.5rem;
  margin-top: -0.5rem;
}

.strategy .competention_card_icon:hover,
.strategy .competention_card_icon.plaing {
  -webkit-animation: play5 4s steps(83) infinite;
  animation: play5 4s steps(83) infinite;
}

@-webkit-keyframes play5 {
  100% {
    background-position-x: -14110px;
  }
}

@keyframes play5 {
  100% {
    background-position-x: -14110px;
  }
}

.support .competention_card_icon {
  background-image: url(../img/competention_icon/headphones.png);
  background-position: 0 -15px;
  margin-left: -3.4rem;
}

.support .competention_card_icon:hover,
.support .competention_card_icon.plaing {
  -webkit-animation: play6 4s steps(82) infinite;
  animation: play6 4s steps(82) infinite;
}

@-webkit-keyframes play6 {
  100% {
    background-position-x: -13940px;
  }
}

@keyframes play6 {
  100% {
    background-position-x: -13940px;
  }
}

.brand .competention_card_icon {
  background-image: url(https://colary.ru/local/templates/new_colary/img/competention_icon/globe.png);
  background-position: 0 -15px;
  margin-left: -4.6rem;
  margin-top: -1.4rem;
}

.brand .competention_card_icon:hover,
.brand .competention_card_icon.plaing {
  -webkit-animation: play7 7s steps(123) infinite;
  animation: play7 7s steps(123) infinite;
}

@-webkit-keyframes play7 {
  100% {
    background-position-x: -20910px;
  }
}

@keyframes play7 {
  100% {
    background-position-x: -20910px;
  }
}

.advert .competention_card_icon {
  background-image: url(../img/competention_icon/aim.png);
  background-position: 0 -15px;
  margin-left: -3rem;
}

.advert .competention_card_icon:hover,
.advert .competention_card_icon.plaing {
  -webkit-animation: play8 7s steps(170) infinite;
  animation: play8 7s steps(170) infinite;
}

@-webkit-keyframes play8 {
  100% {
    background-position-x: -28900px;
  }
}

@keyframes play8 {
  100% {
    background-position-x: -28900px;
  }
}

.competention_card p {
  margin-top: 110px;
  margin-bottom: 90px;
}

.competention_slider .slick-slide {
  height: auto;
}

.competention_slider .slick-arrow {
  display: none !important;
}

.competention_slider .slick-dots {
  bottom: 20px;
}

.competention_slider .slick-dots .slick-active button {
  color: #1f212a;
}

.competention_slider .slick-dots li button::before {
  color: #1f212a;
}

.competention_slider .slick-track {
  margin-bottom: 30px;
}

.competention_slider .slick-dots {
  right: 0px;
}

.projects_content {
  margin: 0 auto;
  max-width: 100%;
  background-color: #fff;
  box-sizing: border-box;
  margin: auto;
  overflow: hidden;
  height: 100%;
  position: relative;
}

.projects_content .portfolio-item:first-child .portfolio-item-text {
    margin-left: 10rem;
}

.portfolio-list {
  position: relative;
}

.portfolio-item {
  float: left;
  width: 50%;
  box-sizing: border-box;
  position: relative;
  height: 520px;
}

.portfolio-item-content {
  height: 100%;
  width: 100%;
  overflow: hidden;
  position: absolute;
}

.portfolio-item-content:hover .anibutton:before {
  left: 0%;
  right: auto;
  width: 100%;
}

.portfolio-item-content:hover .anibutton.red {
  color: #fff !important;
  background-color: transparent;
  text-shadow: nthree;
}

.portfolio-item-content .anibtn.red span span span.icon.icon-arrowright:before {
  color: #fc5054;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.portfolio-item-content:hover .anibtn.red span span span.icon.icon-arrowright:before {
  color: #fff;
}

.portfolio-item-content:hover .anibutton.white {
  color: #fc5054 !important;
  background-color: transparent;
  text-shadow: nthree;
}

.portfolio-item-content .anibtn.white span span span.icon.icon-arrowright:before {
  color: #fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.portfolio-item-content:hover .anibtn.white span span span.icon.icon-arrowright:before {
  color: #fc5054;
}

.portfolio-item-content:hover .anibtn.white {
  color: #fc5054;
}

.portfolio-item-content:hover .anibtn.red {
  color: #fff;
}

.portfolio-item-content:hover .anibtn span.inner1:before {
  width: 100%;
  -webkit-transition: width ease-out .5s .5s;
  transition: width ease-out .5s .5s;
}

.portfolio-item-content:hover .anibtn span.inner1:after {
  right: 100%;
  -webkit-transition: right ease-out .5s .5s;
  transition: right ease-out .5s .5s;
}

.portfolio-item-content:hover .anibtn span.inner2:before {
  width: 100%;
  border-width: 2px;
  -webkit-transition: width ease-out .5s;
  transition: width ease-out .5s;
}

.portfolio-item-content:hover .anibtn span.inner2:after {
  left: 100.5%;
  margin-left: -2px;
  -webkit-transition: left ease-out .5s;
  transition: left ease-out .5s;
}

.portfolio-item:first-child .portfolio-item-content {
  padding-left: 0;
}

.portfolio-item:first-child .portfolio-item-text {
  margin-left: 21rem;
}

@media only screen and (min-width: 1920px) {
.portfolio-item:first-child .portfolio-item-content {
    padding-left: 0;
  }
}

.portfolio-item .portfolio-item-img {
  background-repeat: no-repeat;
  background-position: bottom right;
  background-size: 55%;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  -webkit-transition: all .4s;
  transition: all .4s;
}

.portfolio-item:first-child .portfolio-item-img {
  background-size: 50%;
  background-position: right;
  -webkit-transition: all .4s;
  transition: all .4s;
}

.portfolio-item:first-child:hover .portfolio-item-img {
  background-size: 47%;
}

.portfolio-item:hover .portfolio-item-img {
  background-size: 75%;
}

.portfolio-item-background {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background-size: 90%;
  background-position: bottom right;
  background-repeat: no-repeat;
  -webkit-transition: all .4s;
  transition: all .4s;
}

.pib-mobile {
  display: none !important;
}

@media only screen and (max-width: 1100px) {
  .portfolio-item-background {
    display: none;
  }
  .pib-mobile {
    display: block !important;
  }
}

.portfolio-item:hover .portfolio-item-background {
  background-size: 87%;
}
.portfolio-item:first-child .portfolio-item-background {
  background-size: 103%;
}
.portfolio-item:first-child:hover .portfolio-item-background {
  background-size: 100%;
}

.portfolio-item-text {
  position: absolute;
  color: #fff;
  margin-left: 10rem;
  margin-top: 10rem;
}

.portfolio-item-name {
  font-family: 'ProximaNovaExtrabold', Arial, sans-serif;
  font-size: 6.3rem;
  text-transform: uppercase;
  text-shadow: 0rem 0.3rem 0.7rem rgba(55, 62, 71, 0.35);
  display: inline-block;
}

.portfolio-item-description {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  font-size: 2.9rem;
  display: block;
  text-shadow: 0rem 0.3rem 0.7rem rgba(55, 62, 71, 0.35);
  margin: 30px 0;
}

.portfolio-item-hr {
  height: 2px;
  width: 400px;
  display: block;
  background-color: #fc5054;
  margin-top: 50px;
}

.portfolio-item-more {
  margin-top: 30px;
  position: absolute;
}

.portfolio-item:first-child {
  width: 100%;
}

.portfolio-item:first-child .portfolio-item-hr {
  width: 650px;
}

.portfolio-item:first-child .portfolio-item-img {
  margin-right: 210px;
}

.project_gold {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  font-size: 25px;
  display: inline-block;
  background-image: url(../img/projects/gold.png);
  background-repeat: no-repeat;
  width: 60px;
  height: 70px;
  padding-left: 60px;
  padding-top: 24px;
  position: absolute;
  right: -150px;
}

.clients {
  margin-top: 10px;
}

.clients_content {
  margin: 0 auto;
  padding: 0;
  padding-top: 7rem;
  padding-bottom: 7rem;
  max-width: 100%;
  background-color: #ebeef3;
}

.clients_content .row {
  margin: 0 -10px;
  margin-bottom: 20px;
}

.clients_content .row:last-child {
  margin-bottom: 0;
}

.clients_card {
  box-sizing: border-box;
  float: left;
  width: 25%;
  padding: 8%;
  outline: 1px solid #fff;
}

.clients_card:hover {
  background: #fff;
}

.clients_card:nth-child(4n+1) {
  clear: both;
}

.clients_card img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 35%;
  padding-bottom: 35%;
}

.blog {
  margin-top: 60px;
  margin-bottom: 4rem;
}

.blog-list {
  max-width: 1734px;
  list-style: none;
  margin: 3rem auto;
  margin-bottom: 1rem;
  padding: 0;
}

.blog-list li {
  display: block;
  float: left;
  padding: 7px;
  width: 33.33%;
  opacity: 1;
}

.blog-list li.shown,
.no-js .blog-list li,
.no-cssanimations .grid li {
  opacity: 1;
}

.adapt_block {
  margin-left: auto;
  margin-right: auto;
  padding-top: 39%;
  padding-bottom: 30%;
}

.blog-item_content .button_group {
  position: absolute;
  top: 48%;
  right: 45%;
}

.blog-item {
  min-height: 380px;
  -webkit-perspective: 270;
  perspective: 270;
}

.blog-item_content {
  padding: 0;
}

.blog-item_content > .bicontent {
  padding: 50px;
}

.blog-item.default-item .blog-item_content {
  height: 650px;
  background-color: #ebeef3;
}

.blog-item.dark-item .blog-item_content {
  background-color: #2d2e35;
}

.blog-item.top-item {
  width: 65.99%;
}

.blog-item.top-item .blog-item_content {
  background-color: #fff;
}

.blog-item_content:hover .anibutton:before {
  left: 0%;
  right: auto;
  width: 100%;
}

.blog-item_content:hover .anibutton.red {
  color: #fff !important;
  background-color: transparent;
  text-shadow: nthree;
}

.blog-item_content:hover .anibutton.white {
  color: #fc5054 !important;
  background-color: transparent;
  text-shadow: nthree;
}

.blog-item_content:hover .anibtn.white {
  color: #fc5054;
}

.blog-item_content:hover .anibtn.red {
  color: #fff;
}

.blog-item_content .anibtn.red span span span.icon.icon-arrowright:before {
  color: #fc5054;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.blog-item_content:hover .anibtn.red span span span.icon.icon-arrowright:before {
  color: #fff;
}
.blog-item_content .anibtn.white span span span.icon.icon-arrowright:before {
  color: #fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.blog-item_content:hover .anibtn.white span span span.icon.icon-arrowright:before {
  color: #fc5054;
}

.blog-item_content:hover .anibtn span.inner1:before {
  width: 100%;
  -webkit-transition: width ease-out .5s .5s;
  transition: width ease-out .5s .5s;
}

.blog-item_content:hover .anibtn span.inner1:after {
  right: 100%;
  -webkit-transition: right ease-out .5s .5s;
  transition: right ease-out .5s .5s;
}

.blog-item_content:hover .anibtn span.inner2:before {
  width: 100%;
  border-width: 2px;
  -webkit-transition: width ease-out .5s;
  transition: width ease-out .5s;
}

.blog-item_content:hover .anibtn span.inner2:after {
  left: 100.5%;
  margin-left: -2px;
  -webkit-transition: left ease-out .5s;
  transition: left ease-out .5s;
}

.image-item .blog-item_content > a {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.image-item .blog-item_content:before {
  content:'';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #000;
  opacity: 0.5;
}

.image-item .blog-item_content > a:hover + .anibutton .icon .path3:before {
  color: #fc5054;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.image-item .blog-item_content > a:hover + .anibutton .icon .path1:before {
  color: #fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

.blog-item-date {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 2rem;
  margin: 0;
  position: relative;
  color: #2d2e35;
  display: block;
}

.blog-item-title {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 2.5rem;
  margin: 5rem 0;
  position: relative;
  color: #2d2e35;
  text-transform: uppercase;
  display: block;
}

.blog-item-title a {
  color: #2d2e35;
  text-decoration: none;
  display: inline-block;
width: 100%;
white-space: normal;
}

.blog-item-title a:hover {
  color: #fc5054;
}

.blog-item-text {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2.5rem;
  margin: 4rem 0;
  position: relative;
  color: #2d2e35;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
}

.blog-item-text * {
  white-space: normal;
}

.blog-item-text img {
  max-height: 21rem;
  -moz-height: 21rem;
  -webkit-height: 21rem;
  -o-height: 21rem;
}

.blog-item-text p {
  margin-top: 0;
  margin-bottom: 2.45rem;
}

.blog-item-hr {
  height: 2px;
  width: 100%;
  display: block;
  background-color: #fc5054;
  margin-bottom: 60px;
}

.blog-item-hr-top {
  height: 0;
  width: 270px;
  display: block;
  background-color: #fc5054;
  margin-bottom: 0;
}

.blog-item-more {
  margin-top: -20px;
  position: inherit;
  bottom: 50px;
}

.blog-item-more .anibtn {
  width: 22rem;
}

.blog_header_content .blog-item-more {
  position: relative;
  float: left;
  top: 60px;
}

@media only screen and (max-width: 800px) {
  .blog_header_content .blog-item-more {
    top: 35px;
  }
  .blog_header.parallax-container {
    position:relative;
  }
  .blog_header.parallax-container:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.5;
  }
}

.blog-item.top-item .blog-item_content .blog-item-date {
  display: none;
}

.blog-item.top-item .blog-item_content .blog-item-title {
  font-family: 'ProximaNovaExtrabold', Arial, sans-serif;
  font-size: 5rem;
  margin: -6rem 0 4rem 0;
  position: relative;
  color: #2d2e35;
}

.blog-item.top-item .blog-item_content .blog-item-text {
  max-height: 37rem;
  -moz-height: 37rem;
  -webkit-height: 37rem;
  -o-height: 37rem;
}

.blog-item.top-item .blog-item_content .blog-item-hr-top {
  height: 2px;
}

.blog-item.top-item .blog-item_content .blog-item-hr {
  height: 0;
  margin-bottom: 0;
}

.blog-item.image-item .blog-item_content {
  height: 365px;
  background-size: cover;
  background-position: center;
}

.blog-item.image-item .anibutton {
  position: absolute;
  top: 50%;
  margin-top: -2.2rem !important;
  left: 50%;
  margin-left: -2.2rem !important;
}

.blog-item.dark-item .blog-item_content {
  background: #2d2e35 !important;
  padding-top: 0 !important;
}

.blog-item.dark-item .blog-item-date {
  color: #fff;
}

.blog-item.dark-item .blog-item-title {
  color: #fff;
}

.blog-item.dark-item .blog-item-title a {
  color: #fff;
  text-decoration: none;
}

.blog-item.dark-item .blog-item-title a:hover {
  color: #fc5054;
}

.blog-item.dark-item .blog-item-text {
  color: #fff;
}

.blog-item.dark-item .blog-item-text p {
  color: #fff !important;
}

.footer {
  height: 19.3rem;
  background-color: #2d2e35;
  margin-top: 0rem;
  clear: both;
}

.footer_contacts {
  margin-top: 0;
}

.language {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  color: #fff;
  font-size: 2rem;
  text-align: center;
  margin-top: 9rem;
}

.language a {
  text-decoration: none;
  color: #fff;
}

.language a:hover {
  color: #fc5054;
}

.language a.active {
  color: #fc5054;
}

.footer .phone {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  color: #fff;
  font-size: 2.7rem;
  text-align: center;
  margin-top: 8.2rem;
  display: block;
}

.footer .phone a {
  text-decoration: none;
  color: #fff;
}

.footer .phone a:hover {
  color: #fc5054;
}

.animation_timeline {
  position: fixed;
  display: inline-block;
  vertical-align: middle;
  width: 100%;
  left: 0;
  top: 50%;
  margin-top: -18%;
  z-index: 9999;
}

.timeline_about {
  padding: 600px 0 0 0;
  overflow: hidden;
  background-color: #fff;
  margin-bottom: -100px;
}

.animation_triger {
  height: 600px;
  position: relative;
}

#triger-0 {
  height: 1px;
}

#triger-1 {
  height: 1200px;
}

#triger-8 {
  height: 100px;
}

#triger-1_anchor {
  position: absolute;
  top: 140px;
}

#triger-2_anchor {
  position: absolute;
  top: -500px;
}

#triger-3_anchor {
  position: absolute;
  top: -500px;
}

#triger-4_anchor {
  position: absolute;
  top: -500px;
}

#triger-5_anchor {
  position: absolute;
  top: -500px;
}

#triger-6_anchor {
  position: absolute;
  top: -500px;
}

#triger-7_anchor {
  position: absolute;
  top: -500px;
}

#triger-8_anchor {
  position: absolute;
  top: -500px;
}

.animation_timeline:before {
  content: "";
  display: block;
  padding-top: 43%;
}

.timeline_about .animation_scene {
  background: #ebeef3;
  opacity: 0;
}

.animation_timeline {
  display: none;
}

.scene_timeline_bottom {
  width: 100%;
  height: 40%;
  background: #2d2e35;
  bottom: 0;
  position: absolute;
  -webkit-transform: translateX(78rem);
  transform: translateX(78rem);
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.scene_timeline_bottom2 {
  -webkit-transform: translateX(50rem);
  transform: translateX(50rem);
}

.scene_timeline_bottom3 {
  -webkit-transform: translateX(22rem);
  transform: translateX(22rem);
}

.scene_timeline_bottom4 {
  -webkit-transform: translateX(0rem);
  transform: translateX(0rem);
}

.scene_timeline_start {
  height: 100%;
  width: 100%;
  position: absolute;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.scene_timeline_start2 {
  -webkit-transform: translateX(-28rem);
  transform: translateX(-28rem);
}

.scene_timeline_start3 {
  -webkit-transform: translateX(-56rem);
  transform: translateX(-56rem);
}

.scene_timeline_start4 {
  -webkit-transform: translateX(-84rem);
  transform: translateX(-84rem);
}

.scene_timeline_start5 {
  -webkit-transform: translateX(-112rem);
  transform: translateX(-112rem);
}

.scene_timeline_start6 {
  -webkit-transform: translateX(-140rem);
  transform: translateX(-140rem);
}
.scene_timeline_start7 {
  -webkit-transform: translateX(-168rem);
  transform: translateX(-168rem);
}
.scene_timeline_start8 {
  -webkit-transform: translateX(-196rem);
  transform: translateX(-196rem);
}

.scene_timeline_start_stars {
  background: url(../img/timeline/Stars_start.png);
  background-size: 30%;
  background-repeat: no-repeat;
  height: 100%;
  opacity: 0;
}

.scene_timeline_start_cosmo {
  background: url(../img/timeline/Cosmo.png);
  background-size: 100%;
  background-repeat: no-repeat;
  top: 3rem;
  left: 4rem;
  height: 27.4rem;
  width: 14.7rem;
  position: absolute;
  opacity: 0;
}

.scene_timeline_start_evolution {
  background: url(../img/timeline/evolution1.png);
  background-size: 100%;
  background-repeat: no-repeat;
  top: 0;
  left: 35rem;
  height: 16.3rem;
  width: 54rem;
  position: absolute;
  opacity: 0;
}

.scene_timeline_start_evolution2 {
  background: url(../img/timeline/evolution2.png);
  background-size: 100%;
  background-repeat: no-repeat;
  bottom: 20rem;
  left: 4rem;
  height: 4.1rem;
  width: 14.6rem;
  position: absolute;
  opacity: 0;
}

.scene_timeline_start_evolution3 {
  background: url(../img/timeline/evolution3.png);
  background-size: 100%;
  background-repeat: no-repeat;
  bottom: 33rem;
  left: 40rem;
  height: 5.1rem;
  width: 17.5rem;
  position: absolute;
  opacity: 0;
}

.scene_timeline_start_evolution4 {
  background: url(../img/timeline/evolution4.png);
  background-size: 100%;
  background-repeat: no-repeat;
  bottom: 32.8rem;
  left: 60rem;
  height: 10.6rem;
  width: 10.1rem;
  position: absolute;
  opacity: 0;
}

.scene_timeline_start_evolution5 {
  background: url(https://colary.ru/local/templates/new_colary/img/timeline/evolution5.png);
  background-size: 100%;
  background-repeat: no-repeat;
  bottom: 32.8rem;
  left: 75rem;
  height: 16.6rem;
  width: 8.4rem;
  position: absolute;
  opacity: 0;
}

.scene_timeline_start_evolution6 {
  background: url(../img/timeline/evolution6.png);
  background-size: 100%;
  background-repeat: no-repeat;
  bottom: 32.8rem;
  left: 87rem;
  height: 21.9rem;
  width: 12.9rem;
  position: absolute;
  opacity: 0;
}

.scene_timeline_start_evolution7 {
  background: url(../img/timeline/evolution7.png);
  background-size: 100%;
  background-repeat: no-repeat;
  bottom: 32.8rem;
  left: 104rem;
  height: 12.3rem;
  width: 14rem;
  position: absolute;
  opacity: 0;
}

.timeline_ground_water {
  width: 72%;
  height: 124.2%;
  background: url(../img/timeline/ground_water.png);
  background-size: cover;
  position: absolute;
  left: -50%;
  bottom: 0%;
}

.timeline_progress_bar {
  background-color: #fff;
  box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.21);
  position: absolute;
  width: 100%;
  height: 5%;
  bottom: 35.3%;
  border-top: 1px solid #2d2e35;
}

.fill_progress {
  width: 66.66%;
  height: 100%;
  background: #fc5054;
}

.timeline_horisontal_line {
  height: 100%;
  width: 66.8%;
  left: 0;
  position: absolute;
  border-right: 2px solid #fc5054;
  position: absolute;
}

.timeline_hotisontal_line_date {
  height: 0.9rem;
  width: 0.9rem;
  border-radius: 50%;
  background: #fc5054;
  position: absolute;
  top: -4.55rem;
  color: #2d2e35;
}

.thl_dates {
  left: 66.53%;
  position: relative;
  z-index: 1;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.thl_dates2 {
  -webkit-transform: translateX(-28rem);
  transform: translateX(-28rem);
}

.thl_dates3 {
  -webkit-transform: translateX(-56rem);
  transform: translateX(-56rem);
}

.thl_dates4 {
  -webkit-transform: translateX(-84rem);
  transform: translateX(-84rem);
}

.thl_dates5 {
  -webkit-transform: translateX(-112rem);
  transform: translateX(-112rem);
}

.thl_dates6 {
  -webkit-transform: translateX(-140rem);
  transform: translateX(-140rem);
}
.thl_dates7 {
  -webkit-transform: translateX(-168rem);
  transform: translateX(-168rem);
}
.thl_dates8 {
  -webkit-transform: translateX(-196rem);
  transform: translateX(-196rem);
}

.thl_dates {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2.8rem;
  color: #2d2e35;
}

.timeline_hotisontal_line_date {
  display: block;
}

.timeline_hotisontal_line_date:before {
  left: -2.2rem;
  top: 1rem;
  position: absolute;
}

#thl_date1 {
  left: 0rem;
}

#thl_date1:before {
  content: '2012';
}

#thl_date2 {
  left: 28rem;
}

#thl_date2:before {
  content: '2013';
}

#thl_date3 {
  left: 56rem;
}

#thl_date3:before {
  content: '2014';
}

#thl_date4 {
  left: 84rem;
}

#thl_date4:before {
  content: '2015';
}

#thl_date5 {
  left: 112rem;
}

#thl_date5:before {
  content: '2016';
}

#thl_date6 {
  left: 140rem;
}

#thl_date6:before {
  content: '2017';
}

#thl_date7 {
  left: 168rem;
}

#thl_date7:before {
  content: '2019';
}

/*#thl_date8 {
  left: 196rem;
}

#thl_date8:before {
  content: '2019';
}*/

.timeline_items {
  height: 100%;
  position: absolute;
  left: 66.66%;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.timeline_items2 {
  -webkit-transform: translateX(-28rem);
  transform: translateX(-28rem);
}

.timeline_items3 {
  -webkit-transform: translateX(-56rem);
  transform: translateX(-56rem);
}

.timeline_items4 {
  -webkit-transform: translateX(-84rem);
  transform: translateX(-84rem);
}

.timeline_items5 {
  -webkit-transform: translateX(-112rem);
  transform: translateX(-112rem);
}

.timeline_items6 {
  -webkit-transform: translateX(-140rem);
  transform: translateX(-140rem);
}

.timeline_items7 {
  -webkit-transform: translateX(-168rem);
  transform: translateX(-168rem);
}

.timeline_items8 {
  -webkit-transform: translateX(-196rem);
  transform: translateX(-196rem);
}

.timeline_item {
  height: 100%;
  width: 28rem;
  left: 66.66%;
  position: absolute;
  border-left: 2px solid #d1d2d5;
}

.timeline_item1 {
  left: 0rem;
}

.timeline_item2 {
  left: 28rem;
}

.timeline_item3 {
  left: 56rem;
}

.timeline_item4 {
  left: 84rem;
}

.timeline_item5 {
  left: 112rem;
}

.timeline_item6 {
  left: 140rem;
}

.timeline_item7 {
  left: 168rem;
}

.timeline_item8 {
  left: 196rem;
}

.timeline_item_event {
  top: 65%;
  position: absolute;
  text-align: left;
  padding: 2.5rem;
  padding-top: 1rem;
  opacity: 0;
}

.timeline_item_event_header {
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  font-size: 1.7rem;
  color: #fc5054;
}

.timeline_item_event_text {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 1.7rem;
  color: #fff;
}

/*.timeline_item1 .timeline_item_img {
  background: url(../img/timeline/Yelltsin.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position-x: 50%;
  position: absolute;
  top: -22rem;
  left: 0;
  width: 100%;
  height: 19rem;
}*/

.timeline_item1 .timeline_item_img {
  background: url(../img/timeline/BuranGrandMa.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position-x: 50%;
  position: absolute;
  top: -20rem;
  left: 0;
  width: 100%;
  height: 14rem;
  opacity: 1;
}

.timeline_item2 .timeline_item_img {
  background: url(../img/timeline/Cigara.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position-x: 80%;
  position: absolute;
  top: -20.2rem;
  left: 0;
  width: 100%;
  height: 16rem;
}

.timeline_item3 .timeline_item_img {
  background: url(../img/timeline/KrymNash.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position-x: 50%;
  position: absolute;
  top: -19rem;
  left: 0;
  width: 100%;
  height: 13rem;
}

.timeline_item4 .timeline_item_img {
  background: url(../img/timeline/BTTF.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position-x: 50%;
  position: absolute;
  top: -10.2rem;
  left: 0;
  width: 100%;
  height: 6rem;
}

.timeline_item_stars {
  background: url(../img/timeline/Stars.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top;
  position: absolute;
  top: -41.2rem;
  left: -9rem;
  width: 250%;
  height: 50rem;
}

.timeline_item5 .timeline_item_img {
  background: url(../img/timeline/einstein.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position-x: 50%;
  position: absolute;
  top: -20rem;
  left: -30px;
  width: 100%;
  height: 14rem;
}

.timeline_item6 .timeline_item_img {
  background: url(../img/timeline/Expo.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position-x: 50%;
  position: absolute;
  top: -20rem;
  left: -30px;
  width: 100%;
  height: 14rem;
}

.horisontal_line_events {
  position: absolute;
  left: 66.66%;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.horisontal_line_events2 {
  -webkit-transform: translateX(-28rem);
  transform: translateX(-28rem);
}

.horisontal_line_events3 {
  -webkit-transform: translateX(-56rem);
  transform: translateX(-56rem);
}

.horisontal_line_events4 {
  -webkit-transform: translateX(-84rem);
  transform: translateX(-84rem);
}

.horisontal_line_events5 {
  -webkit-transform: translateX(-112rem);
  transform: translateX(-112rem);
}

.horisontal_line_events6 {
  -webkit-transform: translateX(-140rem);
  transform: translateX(-140rem);
}

.horisontal_line_events7 {
  -webkit-transform: translateX(-168rem);
  transform: translateX(-168rem);
}

.horisontal_line_events8 {
  -webkit-transform: translateX(-196rem);
  transform: translateX(-196rem);
}

.horisontal_line_event {
  position: absolute;
  -webkit-transform: translateX(-14.5rem);
  transform: translateX(-14.5rem);
  margin-top: 2rem;
  opacity: 0;
}

.horisontal_line_event_img {
  width: 15rem;
  height: 15rem;
  background-color: #fff;
  border-radius: 50%;
  border: 2px solid #fc5054;
  position: relative;
  left: 25%;
}

.horisontal_line_event_text {
  background: #fff;
  box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.21);
  width: 29.5rem;
  padding: 3rem;
  margin-top: 3rem;
  position: relative;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 1.7rem;
  text-align: left;
}

.horisontal_line_event_text a {
  color: #fc5054;
  text-decoration: none;
  border-bottom: 1px solid #fc5054;
  display: inline-block;
  margin-top: 1rem;
}

.horisontal_line_event1 {
  left: 0rem;
}

.horisontal_line_event2 {
  left: 28rem;
}

.horisontal_line_event3 {
  left: 56rem;
}

.horisontal_line_event4 {
  left: 84rem;
}

.horisontal_line_event5 {
  left: 112rem;
}

.horisontal_line_event6 {
  left: 140rem;
}

.horisontal_line_event7 {
  left: 168rem;
}

.horisontal_line_event8 {
  left: 196rem;
}

/*.horisontal_line_event1 .horisontal_line_event_img {
  background: url(../img/timeline/Birthday.jpg);
  background-size: 280%;
  background-position: 55% 12%;
}*/

.horisontal_line_event1 .horisontal_line_event_img {
  background-color: #fff;
  background-image: url(../img/timeline/tagline_logo.png);
  background-size: 100%;
  background-position: 0 49%;
  background-repeat: no-repeat;
}

.horisontal_line_event2 .horisontal_line_event_img {
  background-image: url(https://colary.ru/local/templates/new_colary/img/timeline/clickpos.jpg);
  background-size: cover;
}

.horisontal_line_event3 .horisontal_line_event_img {
  background-image: url(https://colary.ru/local/templates/new_colary/img/timeline/clickpos.jpg);
  background-size: cover;
}

.horisontal_line_event4 .horisontal_line_event_img {
  background-image: url(https://colary.ru/local/templates/new_colary/img/timeline/ruward.jpg);
  background-size: cover;
}

.horisontal_line_event5 .horisontal_line_event_img {
  background-image: url(https://colary.ru/local/templates/new_colary/img/timeline/design.jpg);
  background-size: cover;
}

.horisontal_line_event6 .horisontal_line_event_img {
  background-image: url(../img/timeline/house.jpg);
  background-size: cover;
}

.horisontal_line_event7 .horisontal_line_event_img {
  background-image: url(../img/timeline/colary-hb_2019.png);
  background-size: cover;
}

.reviews {
  margin-top: 60px;
  position: relative;
}

.review {
  margin: 50px 0;
  padding: 0 21rem;
  position: relative;
}

p.review_message {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 3rem;
  max-width: 65rem;
  position: relative;
}

p.review_message:before {
  content: '';
  background-image: url(https://colary.ru/local/templates/new_colary/img/quotes.png);
  background-size: cover;
  background-repeat: no-repeat;
  width: 40px;
  height: 33px;
  position: absolute;
  left: -70px;
}

.review-hr {
  height: 2px;
  width: 100%;
  display: block;
  background-color: transparent;
  margin: 45px 0;
}

.reviews_hr {
  height: 2px;
  width: 100%;
  display: block;
  background-color: #fc5054;
  position: absolute;
  width: 76%;
  top: 32.6rem;
  margin: 45px 12%;
  z-index: -1;
}

.review_author {
  position: initial;
  height: 100%;
}

.review_author_image {
  width: 11.5rem;
  float: left;
}

.review_author_name {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 2rem;
  padding-left: 16rem;
  text-transform: uppercase;
  margin-bottom: 2rem;
}

.review_author_who, .review_author_site {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  padding-left: 16rem;
  font-size: 1.8rem;
}

.review_author_site {
  bottom: 0;
  position: absolute;
}

.review_author_site a {
  color: #fc5054;
  text-decoration: none;
  border-bottom: 1px solid #fc5054;
  display: inline-block;
}

.review_doc {
  height: 100rem;
  width: 100rem;
  background-image: url(../img/review_doc.png);
  background-repeat: no-repeat;
  position: absolute;
  right: 0;
}

.reviews .slick-slide {
  height: auto;
}

.reviews .slick-arrow {
  display: none !important;
}

.reviews .slick-dots {
  bottom: 0;
}

.reviews .slick-dots .slick-active button {
  color: #1f212a;
}

.reviews .slick-dots li button::before {
  color: #1f212a;
}

.reviews .slick-track {
  margin-bottom: 30px;
}

.zayavki {
  margin-bottom: 6rem;
  margin-top: 6rem;
}

.zayavki .form_wrapper {
  width: 100%;
  margin: auto;
  position: relative;
  padding: 60px;
  margin-bottom: 60px;
  background: #ebeef3;
}

.form_wrapper form {
  width: 840px;
  margin: 0 auto;
  margin-bottom: 5rem;
  text-align: center;
}

.form_wrapper form .input_sign {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 3rem;
  float: left;
  width: 50%;
  height: 6rem;
  margin-bottom: 3rem;
  padding-top: 1.5rem;
  text-align: left;
}

.form_wrapper form .input_sign span {
  color: #fc5054;
}

.form_wrapper form .input_text {
  font-size: 2.5rem;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  border: none;
  outline: none;
  -moz-appearance: none;
  overflow: auto;
  display: block;
  width: 50%;
  height: 6rem;
  margin-bottom: 3rem;
  float: right;
  padding: 1rem;
}

.form_wrapper form .input_text:focus, .form_wrapper form textarea:focus {
  outline: 1px solid #1f212a;
}

.form_wrapper form .input_text:invalid, .form_wrapper form textarea:invalid {
  outline: 1px solid #fc5054;
}

.button_inputfile {
  position: relative;
  float: left;
  cursor: pointer;
}

.button_inputfile input {
  width: 100%;
  height: 100%;
  opacity: 0;
  position: absolute;
  left: 0px;
  z-index: 9999;
  cursor: pointer;
}

.form_wrapper form textarea {
  font-size: 2.5rem;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  border: none;
  outline: none;
  -moz-appearance: none;
  resize: none;
  overflow: auto;
  display: block;
  width: 100%;
  height: 19rem;
  margin-bottom: 3rem;
  padding: 1rem;
}

.form_wrapper .anibutton.red, .form_wrapper .anibtn.red {
  width: 20rem;
  float: right;
}

.form_wrapper .anibutton.dark, .form_wrapper .anibtn.dark {
  width: 29rem;
  float: left;
}

.form_wrapper .flag {
  width: 9rem;
  height: 9rem;
  top: 60px;
  position: relative;
}

.zayavki p {
  margin: 0 21rem;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  font-size: 3rem;
  color: #2d2e35;
}

.zayavki p a {
  color: #fc5054;
  text-decoration: none;
  border-bottom: 1px solid #fc5054;
  display: inline-block;
}

.question {
  margin-bottom: 60px;
}

.question p {
  margin: 0 21rem;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  font-size: 3rem;
  color: #2d2e35;
}

.question p a {
  color: #fc5054;
  text-decoration: none;
  border-bottom: 1px solid #fc5054;
  display: inline-block;
}

.header_seo {
  height: 100%;
  background: #1d8fea;
  position: relative;
  overflow: hidden;
}

.header_seo > img {
  position: absolute;
  width: 100%;
  height: auto;
}

.header_seo .seoimg1 {
  bottom: 0;
}

.header_seo .seoimg2 {
  bottom: 0;
}

.seo_wrapper {
  margin: auto;
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: absolute;
  display: table;
}

.seo_sign {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  padding-left: 16%;
  padding-right: 16%;
}

.header_seo .title_frame {
  color: #fff;
}

.seo_sign h1.title_frame, .seo_sign .xh1.title_frame {
  font-size: 5rem;
  margin-left: 0;
  margin-right: 0;
  line-height: 1.2;
}

.seo_sign h2.title_frame, .seo_sign .xh2.title_frame {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  font-size: 3rem;
  margin-left: 0;
  margin-right: 0;
  color: #fff;
  max-width: 50rem;
  line-height: 1.5;
}

.seo_content {
  background-image: url(https://colary.ru/local/templates/new_colary/img/seo/seoimg-dots.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 0 5rem;
}

.seo_content .wrapper {
  padding: 0 26rem;
}

.seo_content .seoc_item {
  clear: both;
  margin: 9rem 0;
}

.seo_content .seoc_item .sc_item {
  position: relative;
}

.seo_content .seoc_item .sc_item p {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 3rem;
  color: #5baaf5;
}

.seo_content .seoc_item .sc_item img {
  position: absolute;
  left: 0;
  top: 0;
}

.seo_content .seoc_item .sc_item1 img {
  width: 14.4rem;
}

.seo_content .seoc_item .sc_item1 p {
  padding-left: 16.4rem;
  width: 72rem;
}

.seo_content .seoc_item .sc_item2 {
  float: right;
}

.seo_content .seoc_item .sc_item2 img {
  width: 15.4rem;
}

.seo_content .seoc_item .sc_item2 p {
  padding-left: 17.4rem;
  padding-bottom: 5rem;
  width: 60rem;
}

.seo_content .seoc_item .sc_item3 img {
  width: 15.6rem;
}

.seo_content .seoc_item .sc_item3 p {
  padding-left: 17.6rem;
  width: 125rem;
}

.seo_clients .clients_card {
  width: 33.333%;
}

.seo_clients .clients_content {
  padding: 7rem 26rem;
}

.seo_content2 {
  background: #673ab7;
  padding-bottom: 8rem;
}

.seo_content2 .wrapper {
  padding: 0 26rem;
}

.seo_content2 .sc2_item {
  width: 50%;
  float: left;
  padding-right: 4rem;
  margin-top: 9rem;
}

.seo_content2 .sc2_item h1, .seo_content2 .sc2_item .xh1 {
  font-size: 5rem;
}

.seo_content2 .sc2_item p {
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  font-size: 3rem;
  color: #fff;
}

.seo_content3 {
  padding-top: 5rem;
  margin-bottom: 5rem;
}

.seo_content3 .seoc3 {
  padding: 0 31rem;
  text-align: center;
}

.seo_content3 p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 3rem;
  text-align: left;
}

.zayavkip {
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  margin-bottom: 5rem !important;
  padding-left: 11rem !important;
  text-align: left;
}

@media only screen and (max-width: 1100px) {
  .seo_sign {
    padding-left: 9rem;
    padding-right: 9rem;
  }
  .seo_content .wrapper,
  .seo_content2 .wrapper {
    padding: 0 7rem;
  }
  .seo_content .seoc_item .sc_item1 p,
  .seo_content .seoc_item .sc_item2 p,
  .seo_content .seoc_item .sc_item3 p {
    width: 100%;
    margin: 10rem 0;
  }
  .seo_clients .clients_content {
    padding: 7rem;
  }
}

@media only screen and (max-width: 800px) {
  .seo_sign {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    padding-left: 3.2rem;
    padding-right: 3.2rem;
  }
  .seo_content .wrapper,
  .seo_content2 .wrapper {
    padding: 0;
  }
  .seo_clients .clients_content {
    padding: 7rem;
  }
  .clients.seo_clients .title_frame {
    margin: 3rem 0;
  }
  .seo_content2 .sc2_item {
    width: 100%;
  }
}

@media only screen and (max-width: 420px) {

  .blog-item_content > .bicontent {
    padding: 50px 20px;
  }

  .seo_clients .clients_content {
    padding: 7rem 20%;
  }
  .seo_clients .clients_card {
    width: 100%;
    margin: 0;
  }
  .seo_content3 .seoc3 {
    padding: 0;
  }
  .zayavkip {
    margin-bottom: 5rem !important;
    padding-left: 0 !important;
    padding-bottom: 5rem !important;
  }
}

.header_brs {
  height: 100%;
  background-color: #6a9f51;
  background-image: url(../img/brandsocial/img01.png);
  background-position: right;
  background-size: auto 100%;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
}

.brs_wrapper {
  margin: auto;
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: absolute;
  display: table;
}

.brs_sign {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  padding-left: 16%;
  padding-right: 16%;
}

.header_brs .title_frame {
  color: #fff;
}

.brs_sign h1.title_frame, .brs_sign .xh1.title_frame {
  font-size: 5rem;
  margin-left: 0;
  margin-right: 0;
  line-height: 1.2;
}

.brs_sign h2.title_frame, .brs_sign .xh2.title_frame {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  font-size: 3rem;
  margin-left: 0;
  margin-right: 0;
  color: #fff;
  max-width: 57rem;
  line-height: 1.5;
}

.brs_arrow {
  position: absolute;
  right: 0;
  bottom: 50%;
  margin-bottom: -22.7rem;
  width: 69.7rem;
  height: 37.4rem;
  background-image: url(../img/brandsocial/img01-01.png);
  background-size: cover;
}

.brs_arrow .brsico1 {
  width: 10%;
  height: 10%;
  position: absolute;
  top: 34%;
  left: 31%;
}

.brs_arrow .brsico2 {
  width: 11%;
  height: 11%;
  position: absolute;
  top: 20%;
  left: 43%;
}

.brs_arrow .brsico3 {
  width: 9%;
  height: 9%;
  position: absolute;
  top: 11%;
  left: 58%;
}

.brs_arrow .brsico4 {
  width: 11%;
  height: 11%;
  position: absolute;
  top: 27%;
  left: 55%;
}

.brs_arrow .brsico5 {
  width: 15%;
  height: 15%;
  position: absolute;
  top: 8%;
  left: 68%;
}

.brs_arrow .brsico6 {
  width: 8%;
  height: 8%;
  position: absolute;
  top: 27%;
  left: 68%;
}

.brs_arrow .brsico7 {
  width: 14%;
  height: 14%;
  position: absolute;
  top: 31%;
  left: 77%;
}

.brs_arrow .brsico8 {
  width: 7%;
  height: 7%;
  position: absolute;
  top: 7%;
  left: 86%;
}

.brs_arrow .brsico9 {
  width: 13%;
  height: 13%;
  position: absolute;
  top: 23%;
  left: 89%;
}

.sales_growth {
  height: 70rem;
  margin-top: 6rem;
  margin-bottom: 9rem;
}

.sales_growth .sgi_left {
  width: 100%;
  position: relative;
}

.sales_growth .sgi_right {
  position: absolute;
  float: right;
  width: 50%;
  height: 100%;
  top: 0;
  right: 0;
  text-align: center;
  vertical-align: middle;
}

.sal_gro-item {
  display: table;
  margin: 5rem 0;
}

.sal_gro-item .sal_gro-ico {
  vertical-align: middle;
  display: inline-block;
  width: 19.5rem;
  text-align: center;
  margin-right: 3rem;
}

.sal_gro-item .sal_gro-text {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 3rem;
  color: #446e30;
  vertical-align: middle;
  display: table-cell;
}

.brs_how-display h1.title_frame, .brs_how-display .xh1.title_frame {
  color: #52585f;
  font-size: 5rem;
}

.brs_how {
  position: relative;
  margin-bottom: 10rem;
}

.brs_how .brshi {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.brs_how .brshi svg {
  float: left;
}

.brs_how .brshi > .brshi_content > h3 {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 3rem;
  color: #446e30;
}

.brs_how .brs_how-item1 {
  position: relative;
  z-index: 10;
  height: 74.9rem;
}

.brs_how .brs_how-item1 > .brshi_content {
  position: absolute;
  left: 30rem;
  top: 30.5rem;
}

.brs_how .brs_how-item1 > .brshi_content > img {
  width: 15.3rem;
  height: auto;
}

.brs_how .brs_how-item2 {
  margin-top: -49.5rem;
  position: relative;
  z-index: 9;
  height: 78.7rem;
}

.brs_how .brs_how-item2 > .brshi_content {
  position: absolute;
  left: 103.5rem;
  top: 28.5rem;
}

.brs_how .brs_how-item2 > .brshi_content > img {
  width: 21.5rem;
  height: auto;
}

.brs_how .brs_how-item3 {
  margin-top: -40rem;
  position: relative;
  z-index: 8;
  height: 64.8rem;
}

.brs_how .brs_how-item3 > .brshi_content {
  position: absolute;
  left: 30rem;
  top: 16.5rem;
}

.brs_how .brs_how-item3 > .brshi_content > img {
  width: 20.7rem;
  height: auto;
}

.brs_how .brs_how-item4 {
  height: 70rem;
  margin-top: -40rem;
  position: relative;
  z-index: 1;
  background: #fff;
  -webkit-transition: background .5s ease-out;
  transition: background .5s ease-out;
}

.brs_how .brs_how-item4 > .brshi_content {
  position: absolute;
  left: 103.5rem;
  top: 25.5rem;
}

.brs_how .brs_how-item4 > .brshi_content > img {
  width: 18.7rem;
  height: auto;
}

.brs_how .brs_how-item5 {
  margin-top: -39rem;
  position: relative;
  z-index: 7;
  height: 60.4rem;
}

.brs_how .brs_how-item5 > .brshi_content {
  position: absolute;
  left: 28rem;
  top: 16.5rem;
}

.brs_how .brs_how-item5 > .brshi_content > img {
  width: 19.5rem;
  height: auto;
}

.brs_how .brs_how-item6 {
  margin-top: -41.5rem;
  position: relative;
  z-index: 6;
  height: 65.8rem;
}

.brs_how .brs_how-item6 > .brshi_content {
  position: absolute;
  left: 103.5rem;
  top: 22.5rem;
}

.brs_how .brs_how-item6 > .brshi_content > img {
  width: 24.1rem;
  height: auto;
}

.bsz_title {
  color: #6a9f51;
  font-size: 5rem;
}

@media only screen and (max-width: 1450px) {
  .brs_how .brs_how-item1 {
    height: 80.9rem;
  }
  .brs_how .brs_how-item2 {
    margin-top: -54.5rem;
    height: 83.7rem;
  }
  .brs_how .brs_how-item3 {
    margin-top: -41rem;
    height: 70.8rem;
  }
  .brs_how .brs_how-item4 {
    margin-top: -47rem;
    height: 76rem;
  }
  .brs_how .brs_how-item5 {
    height: 62.4rem;
  }
  .brs_how .brs_how-item6 {
    margin-top: -45.5rem;
    height: 69.8rem;
  }
  .bs_zayavkip {
    padding-left: 3rem !important;
  }
}

@media only screen and (max-width: 1100px) {
  .brs_sign {
    padding-left: 9rem;
    padding-right: 9rem;
  }
  .bs_zayavkip {
    padding-left: 0 !important;
  }
}

@media only screen and (max-width: 800px) {
  .brs_sign {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    padding-left: 3rem;
    padding-right: 3rem;
  }
  .brs_arrow {
    bottom: 25%;
  }
  .brs_how-mobile {
    display: block !important;
  }
  .brs_how-display {
    display: none !important;
  }
  .brs_how .brs_how-item1 > .brshi_content,
  .brs_how .brs_how-item2 > .brshi_content,
  .brs_how .brs_how-item3 > .brshi_content,
  .brs_how .brs_how-item4 > .brshi_content,
  .brs_how .brs_how-item5 > .brshi_content,
  .brs_how .brs_how-item6 > .brshi_content {
    position: relative;
    top: 0;
    left: 0;
    padding: 5rem;
    box-sizing: border-box;
    text-align: center;
  }
  .brs_how .brs_how-item1,
  .brs_how .brs_how-item2,
  .brs_how .brs_how-item3,
  .brs_how .brs_how-item4,
  .brs_how .brs_how-item5,
  .brs_how .brs_how-item6 {
    height: auto;
    margin: 0;
  }
  .sales_growth {
    height: auto;
    margin-top: 6rem;
    margin-bottom: 9rem;
  }
  .sales_growth .sgi_left {
    width: 100%;
    font-size: 0;
    position: relative;
  }
  .sales_growth .sgi_right {
    position: relative;
    float: right;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    text-align: center;
    vertical-align: middle;
  }
  .sal_gro-item {
    display: inline-block;
    margin: 3rem 0;
    width: 100%;
    text-align: center;
  }
  .sal_gro-item .sal_gro-ico {
    vertical-align: middle;
    display: inline-block;
    width: 19.5rem;
    text-align: center;
    margin-right: 0;
    margin-bottom: 3rem;
    height: auto;
  }
  .sal_gro-item .sal_gro-text {
    font-family: 'ProximaNovaBold', Arial, sans-serif;
    font-size: 3rem;
    color: #446e30;
    vertical-align: middle;
    display: block;
  }
  .bracket_display {
    display: none !important;
  }
  .bracket_mobile {
    display: block !important;
  }
  .circle_mob {
    margin-top: 5rem;
  }
  .zayavkip.bs_zayavkip {
    margin: 0 8rem !important;
  }
}

@media only screen and (max-width: 420px) {
  .header_brs {
    background-position: 90%;
  }
  .brs_sign {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    padding-left: 0;
    padding-right: 0;
  }
  .brs_arrow {
    display: none;
  }
}

@media only screen and (max-width: 330px) {
  .brs_arrow {
    display: none;
  }
  .brs_sign h1.title_frame, .brs_sign .xh1.title_frame {
    font-size: 4rem;
  }
  .circle_mob {
    width: 100%;
    height: auto !important;
  }
}

.header_mobapps {
  height: 100%;
  background-color: #232323;
  background-image: url(../img/mobileapps/main_bg.jpg);
  background-size: cover;
  position: relative;
  margin-bottom: 6rem;
}

.header_mobapps .mobappsimg1 {
  position: absolute;
  width: 83.8rem;
  height: auto;
  top: 0;
  left: 0;
}

.header_mobapps .mobappsimg2 {
  position: absolute;
  width: 100%;
  height: auto;
  bottom: -6rem;
}

.par_3, .mbipar2, .mbipar1 {
  -webkit-transition: .01s ease;
  -moz-transition: .01s ease;
  -o-transition: .01s ease;
  transition: .01s ease;
}

.mobapps_wrapper {
  margin: auto;
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: absolute;
  display: table;
}

.mobapps_sign {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  padding-left: 16%;
  padding-right: 16%;
}

.header_mobapps .title_frame {
  color: #fff;
}

.mobapps_sign h1.title_frame, .mobapps_sign .xh1.title_frame {
  font-size: 5rem;
  margin-left: 0;
  margin-right: 0;
  line-height: 1.2;
}

.mobapps_sign h2.title_frame, .mobapps_sign .xh2.title_frame {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  font-size: 3rem;
  margin-left: 0;
  margin-right: 0;
  color: #fff;
  max-width: 75rem;
  line-height: 1.5;
}

.mobapps_block {
  position: relative;
}

.mobapps_block:after {
  content: '';
  z-index: 1;
  background: url(../img/mobileapps/diagsvg.svg);
  background-size: cover;
  width: 100%;
  height: 17rem;
  position: absolute;
  bottom: -16.5rem;
}

.mobapps_block h1, .mobapps_block .xh1 {
  font-size: 5rem;
  color: #2d2e35;
}

.mobapps_block .title_frame {
  margin-top: 6rem;
}

.mobapps_block .moap_item {
  overflow: hidden;
  position: relative;
  margin-top: 10rem;
}

.mobapps_block .moap_item .moap_item_img {
  width: 66.66%;
}

.mobapps_block .moap_item .moap_item_img img {
  width: 100%;
  height: auto;
}

.mobapps_block .moap_item .moap_item_content {
  width: 33.33%;
  padding: 5rem;
}

.mobapps_block .moap_item .moap_item_content .ico_platform1 {
  width: 11.5rem;
  margin-right: 4rem;
}

.mobapps_block .moap_item .moap_item_content .ico_platform2 {
  width: 7.9rem;
  margin-right: 4rem;
  margin-bottom: 1rem;
}

.mobapps_block .moap_item .moap_item_content ul {
  margin: 0;
  padding: 0;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 3rem;
  color: #3b3a3a;
  margin-top: 2rem;
}

.mobapps_block .moap_item .moap_item_content ul li {
  list-style-type: none;
}

.mobapps_block .moap_item .moap_item_content ul li:before {
  content: "\2022\0020";
  font-size: 6rem;
  color: #fc575b;
  position: relative;
  bottom: -0.5rem;
}

.mobapps_block .moap_item .moap_item_content ul li p {
  font-family: 'ProximaNovaRegular', Arial, sans-serif;
  font-size: 2.5rem;
  margin: 0;
  margin-left: 3.9rem;
}

.mobapps_block .moap_item .moap_item_content ul li:last-child {
  list-style-type: none;
  width: 27.33%;
  background: url(../img/mobileapps/dots.png);
  background-repeat: repeat-x;
  background-position: 0 1.5rem;
}

.mobapps_block .moap_item .moap_item_content ul li:last-child > div {
  float: right;
  background: #fff;
  padding-left: 1rem;
}

.mobapps_block .moap_item .moap_item_content ul li:last-child > div > p {
  margin-left: 0;
}

.mobapps_block .moap_item .moap_item_content ul li:last-child:before {
  content: "\2022\0020";
  font-size: 6rem;
  color: #fc575b;
  position: relative;
  bottom: 2.3rem;
  background: #fff;
}

.mobapps_block .moap_item .micdd {
  padding-left: 9rem;
  padding-top: 11rem;
}

.mobapps_block .moap_item1 > div {
  float: left;
}

.mobapps_block .moap_item2 .moap_item_content li {
  list-style-type: none;
  width: 27.33%;
  background: url(../img/mobileapps/dots.png);
  background-repeat: repeat-x;
  background-position: 0 1.5rem;
}

.mobapps_block .moap_item2 .moap_item_content li:before {
  content: "\2022\0020";
  background: #fff;
  font-size: 6rem;
  color: #fc575b;
  position: absolute !important;
  right: 0;
  top: -2.3rem;
  bottom: initial;
}

.mobapps_block .moap_item2 .moap_item_content li p {
  font-family: 'ProximaNovaRegular', Arial, sans-serif;
  font-size: 2.5rem;
  margin: 0;
  margin-left: 0 !important;
}

.mobapps_block .moap_item2 .moap_item_content li span {
  padding-right: 1rem;
}

.mobapps_block .moap_item2 > div {
  float: right;
}

.mobapps_block2 {
  background-image: -moz-linear-gradient(45deg, #272727 0%, #3b202f 100%);
  background-image: -webkit-linear-gradient(45deg, #272727 0%, #3b202f 100%);
  background-image: -ms-linear-gradient(45deg, #272727 0%, #3b202f 100%);
  padding-bottom: 45rem;
  position: relative;
  overflow: hidden;
}

.mobapps_block2 h1.title_frame, .mobapps_block2 .xh1.title_frame {
  margin-top: 0;
  padding-top: 25rem;
  font-size: 5rem;
  color: #fff;
}

.mobapps_block2 .moapps_block2_item {
  clear: both;
}

.mobapps_block2 .moapps_block2_item p {
  width: 45rem;
}

.mobapps_block2 .moapps_block2_item .mbi_left {
  float: left;
  width: 45%;
  margin-bottom: 15rem;
}

.mobapps_block2 .moapps_block2_item .mbi_right {
  float: right;
  width: 45%;
  margin-bottom: 15rem;
  padding-left: 15rem;
  box-sizing: border-box;
}

.mobapps_block2 .moapps_block2_item .mbi_result > div {
  position: relative;
}

.mobapps_block2 .moapps_block2_item .mbi_result > div p {
  opacity: 0.5;
  position: absolute;
  top: 50%;
  margin-top: -1.5rem;
  margin-left: 12rem;
}

.mobapps_block2 .moapps_block2_item .mbi_numb {
  float: right;
  width: 10%;
}

.mobapps_block2 .moapps_block2_item h2,
.mobapps_block2 .moapps_block2_item .xh2 {
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  font-size: 3rem;
  color: #fff;
}

.mobapps_block2 .moapps_block2_item p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2.5rem;
  color: #fff;
}

@media only screen and (max-width: 1400px) {
  .mobapps_block .moap_item .moap_item_content ul li:last-child:before {
    bottom: 2rem;
  }
  .mobapps_block .moap_item2 .moap_item_content li:before {
    top: -2rem;
  }
}

@media only screen and (max-width: 1100px) {
  .mobapps_sign {
    padding-left: 9rem;
    padding-right: 9rem;
  }
}

@media only screen and (max-width: 800px) {
  .mobapps_block .moap_item {
    margin-top: 5rem;
  }
  .mobapps_sign {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    padding-left: 3rem;
    padding-right: 3rem;
  }
  .header_mobapps .mobappsimg2 {
    bottom: -3.5rem;
  }
  .mobapps_block .moap_item .moap_item_img,
  .mobapps_block .moap_item .moap_item_content {
    width: 100%;
  }
  .mobapps_block .moap_item .moap_item_img li,
  .mobapps_block .moap_item .moap_item_content li {
    position: relative !important;
    bottom: inherit !important;
  }
  .mobapps_block .moap_item2 .moap_item_content li {
    width: 100% !important;
    background: none;
  }
  .mobapps_block .moap_item2 .moap_item_content li:before {
    content: "\2022\0020";
    font-size: 6rem;
    color: #fc575b;
    position: relative !important;
    bottom: -0.5rem !important;
    top: inherit;
  }
  .mobapps_block2 .moapps_block2_item .mbi_numb, .tfp {
    display: none;
  }
  .dt_display {
    display: none !important;
  }
  .dt_mobile {
    display: block !important;
  }
  .mobapps_block2 .moapps_block2_item .mbi_left,
  .mobapps_block2 .moapps_block2_item .mbi_right {
    width: 100%;
    padding-left: 0;
  }
  .mobapps_block2 .moapps_block2_item p {
    width: 100%;
  }
  .mobapps_block .moap_item .moap_item_content ul li:last-child {
    width: 100% !important;
    background: none;
  }
  .mobapps_block .moap_item .moap_item_content ul li:last-child:before {
    bottom: -0.5rem !important;
  }
  .mobapps_block .moap_item .moap_item_content ul li p {
    margin-left: 0 !important;
  }
  .mobapps_block:after {
    height: 10rem;
    bottom: -9.5rem;
  }
  .mobapps_block2 {
    padding-bottom: 53rem;
  }
}

@media only screen and (max-width: 520px) {
  .mobappsimg1 {
    width: 100% !important;
  }
  .dt_mobile,
  .mobapps_block2 > h1, .mobapps_block2 > .xh1 {
    margin-left: 5rem !important;
    margin-right: 5rem !important;
  }
  .mobapps_block2 .moapps_block2_item p {
    width: 80%;
  }
  .imgmobapps {
    display: none;
  }
  .mobapps_block2 {
    padding-bottom: 0;
  }
  .title_frame {
    margin: 3rem 1.7rem !important;
  }
  .mobapps_block:after {
    height: 7rem;
    bottom: -6.5rem;
  }
  .mobapps_block2 h1.title_frame {
    padding-top: 10rem;
  }
  .header_mobapps .mobappsimg2 {
    bottom: -1.5rem;
  }
  .moap_item_content.dt_mobile {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .mobapps_block .moap_item .moap_item_content.dt_mobile ul li p {
    margin-left: 0 !important;
  }
  .mobapps_sign {
    padding-left: 0;
    padding-right: 0;
  }
  .mobapps_block .wrapper,
  .mobapps_block2 .wrapper {
    margin: 0;
  }
}

.header_develop {
  height: 100%;
  background-color: #1d8fea;
  background-image: -moz-linear-gradient(0deg, #3a55a2 0%, #8e44ad 100%);
  background-image: -webkit-linear-gradient(0deg, #3a55a2 0%, #8e44ad 100%);
  background-image: -ms-linear-gradient(0deg, #3a55a2 0%, #8e44ad 100%);
  position: relative;
  overflow: hidden;
}

.header_develop .headerimg1 {
  width: 57.3rem;
  height: 51.5rem;
  position: absolute;
  top: 50%;
  margin-top: -22.65rem;
  right: 0;
  margin-right: 11rem;
}

.develop_wrapper {
  margin: auto;
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: absolute;
  display: table;
}

.develop_sign {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  padding-left: 16%;
  padding-right: 16%;
}

.header_develop .title_frame {
  color: #fff;
}

.develop_sign h1.title_frame, .develop_sign .xh1.title_frame {
  font-size: 5rem;
  margin-left: 0;
  margin-right: 0;
  line-height: 1.2;
}

.develop_sign h2.title_frame, .develop_sign .xh2.title_frame {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  font-size: 3rem;
  margin-left: 0;
  margin-right: 0;
  color: #fff;
  line-height: 1.5;
}

.develop_block1 {
  margin-bottom: 10rem;
  padding-top: 2rem;
  clear: both;
}

.develop_block1 h1.title_frame, .develop_block1 .xh1.title_frame {
  color: #373e47;
  font-size: 5rem;
}

.develop_block1 p {
  color: #373e47;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 3rem;
}

.develop_block1 .rewards_item {
  width: 50%;
  float: left;
  margin-bottom: 5rem;
}

.develop_block1 .rewards_item > img {
  width: 27.3rem;
  height: 20.2rem;
}

.develop_block2 h1.title_frame, .develop_block2 .xh1.title_frame {
  color: #373e47;
  font-size: 5rem;
}

.develop_block2 p {
  color: #373e47;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 3rem;
}

.develop_block2 .slickslider {
  background: #3a55a2;
  padding-top: 25rem;
  padding-bottom: 8rem;
}

.develop_block2 .slickslider .slick-dots {
  top: 9rem;
  bottom: inherit;
}

.develop_block2 .slickslider .slick-dots li {
  width: 10rem;
  height: 10rem;
  border: 1px solid #fff;
  border-radius: 50%;
  margin-right: 15rem;
}

.develop_block2 .slickslider .slick-dots li button {
  width: 100%;
  height: 100%;
}

.develop_block2 .slickslider .slick-dots li button:before {
  font-family: 'ProximaNovaExtrabold', Arial, sans-serif;
  top: 0;
  font-size: 5rem;
  width: 100%;
  height: 100%;
  line-height: 200%;
}

.develop_block2 .slickslider .slick-dots li button:after {
  content: '';
  position: absolute;
  top: 0;
  left: 10rem;
  width: 15rem;
  height: 100%;
  background-image: url(../img/development/slider_arrow.png);
  background-size: 10.2rem 1.1rem;
  background-repeat: no-repeat;
  background-position: center;
}

.develop_block2 .slickslider .slick-dots li:first-child button:before {
  content: '1';
}

.develop_block2 .slickslider .slick-dots li:nth-child(2) button:before {
  content: '2';
}

.develop_block2 .slickslider .slick-dots li:nth-child(3) button:before {
  content: '3';
}

.develop_block2 .slickslider .slick-dots li:nth-child(4) button:before {
  content: '4';
}

.develop_block2 .slickslider .slick-dots li:nth-child(5) button:before {
  content: '5';
}

.develop_block2 .slickslider .slick-dots li:nth-child(5) button:after {
  display: none;
}

.develop_block2 .slickslider .slick-dots .slick-active {
  background: #fff;
}

.develop_block2 .slickslider .slick-dots .slick-active button {
  color: transparent;
}

.develop_block2 .slickslider .slick-dots .slick-active button:before {
  color: #3a55a2;
}

.develop_block2 .slickslider .slickslider_slide .title_frame {
  margin-top: 0;
}

.develop_block2 .slickslider .slickslider_slide .ssdev_text {
  width: 65%;
  float: left;
}

.develop_block2 .slickslider .slickslider_slide .ssdev_text h1,
.develop_block2 .slickslider .slickslider_slide .ssdev_text .xh1 {
  font-size: 5rem;
}

.develop_block2 .slickslider .slickslider_slide .ssdev_text h2,
.develop_block2 .slickslider .slickslider_slide .ssdev_text .xh2 {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 3.6rem;
  text-transform: uppercase;
  color: #fff;
}

.develop_block2 .slickslider .slickslider_slide .ssdev_text p {
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  color: #fff;
}

.develop_block2 .slickslider .slickslider_slide .ssdev_img {
  width: 35%;
  float: left;
}

.develop_block2 .slickslider .slickslider_slide .ssdev_img img {
  float: right;
}

.develop_block2 .slickslider .slick-slide {
  height: auto !important;
}

.develop_blockwork h1.title_frame, .develop_blockwork .xh1.title_frame {
  color: #373e47;
  font-size: 5rem;
}

.develop_blockwork .dbwork_sheet {
  height: 80rem;
  background: url(../img/development/back_img.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  overflow-x: hidden;
}

.zayavki_develop {
  margin-bottom: 5rem !important;
}

.zayavki_develop h1.title_frame,
.zayavki_develop .xh1.title_frame {
  color: #3a55a2;
  font-size: 5rem;
}

.zayavki_develop p.title_frame {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
}

.icon {
  position: absolute;
  width: 100%;
  height: 100%;
}

.icon-00 {
  background: url(../img/development/workw28.jpg);
  background-size: cover;
  background-position: center;
}

.icon-01 {
  background: url(../img/development/workw27.jpg);
  background-size: cover;
  background-position: center;
}

.icon-02 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw26.jpg);
  background-size: cover;
  background-position: center;
}

.icon-03 {
  background: url(../img/development/workw25.jpg);
  background-size: cover;
  background-position: center;
}

.icon-04 {
  background: url(../img/development/workw24.jpg);
  background-size: cover;
  background-position: center;
}

.icon-05 {
  background: url(../img/development/workw23.jpg);
  background-size: cover;
  background-position: center;
}

.icon-06 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw22.jpg);
  background-size: cover;
  background-position: center;
}

.icon-07 {
  background: url(../img/development/workw21.jpg);
  background-size: cover;
  background-position: center;
}

.icon-08 {
  background: url(../img/development/workw20.jpg);
  background-size: cover;
  background-position: center;
}

.icon-09 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw19.jpg);
  background-size: cover;
  background-position: center;
}

.icon-10 {
  background: url(../img/development/workw18.jpg);
  background-size: cover;
  background-position: center;
}

.icon-11 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw17.jpg);
  background-size: cover;
  background-position: center;
}

.icon-12 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw16.jpg);
  background-size: cover;
  background-position: center;
}

.icon-13 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw15.jpg);
  background-size: cover;
  background-position: center;
}

.icon-14 {
  background: url(../img/development/workw14.png);
  background-size: cover;
  background-position: center;
}

.icon-15 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw13.jpg);
  background-size: cover;
  background-position: center;
}

.icon-16 {
  background: url(../img/development/workw12.jpg);
  background-size: cover;
  background-position: center;
}

.icon-17 {
  background: url(../img/development/workw11.jpg);
  background-size: cover;
  background-position: center;
}

.icon-18 {
  background: url(../img/development/workw10.jpg);
  background-size: cover;
  background-position: center;
}

.icon-19 {
  background: url(../img/development/workw9.jpg);
  background-size: cover;
  background-position: center;
}

.icon-20 {
  background: url(../img/development/workw8.jpg);
  background-size: cover;
  background-position: center;
}

.icon-21 {
  background: url(../img/development/workw7.jpg);
  background-size: cover;
  background-position: center;
}

.icon-22 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw6.jpg);
  background-size: cover;
  background-position: center;
}

.icon-23 {
  background: url(../img/development/workw5.jpg);
  background-size: cover;
  background-position: center;
}

.icon-24 {
  background: url(../img/development/workw4.jpg);
  background-size: cover;
  background-position: center;
}

.icon-25 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw3.jpg);
  background-size: cover;
  background-position: center;
}

.icon-26 {
  background: url(https://colary.ru/local/templates/new_colary/img/development/workw2.jpg);
  background-size: cover;
  background-position: center;
}

.icon-27 {
  background: url(../img/development/workw1.jpg);
  background-size: cover;
  background-position: center;
}

.card,
.flipper,
#card-container {
  transition: 0.4s;
}

#card-container,
.flipper,
.front, .back {
  width: 100%;
  height: 100%;
}

#card-container {
  transform: translate3d(100%, 0, 0);
}

#card-container.on-screen {
  transform: translate3d(0, 0, 0);
}

.card {
  position: relative;
  float: left;
  -webkit-perspective: 1000;
  width: 14.285%;
  height: 25%;
}

.card:hover .flipper {
  transform: rotateY(40deg);
}

.card.flipped {
  z-index: 98;
}

.card.flipped .flipper, .card.flipped .back {
  transform: rotateY(180deg);
}

.card.found {
  transform: scale(0);
}

.flipper {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}

.front, .back {
  backface-visibility: hidden;
  outline: 1px solid #fff;
  position: absolute;
  top: 0;
  left: 0;
}

.front {
  z-index: 2;
  transform: rotateY(0deg);
}

.back {
  display: table;
  transform: rotateY(180deg);
  background-color: transparent;
}

@media only screen and (max-width: 1400px) {
  .develop_block2 .slickslider {
    padding-top: 23rem;
  }
}

@media only screen and (max-width: 1300px) {
  .header_develop .headerimg1 {
    bottom: 10rem;
    top: inherit;
  }
}

@media only screen and (max-width: 1100px) {
  .header_develop .headerimg1 {
    display: none;
  }
  .develop_sign {
    padding-left: 9rem;
    padding-right: 9rem;
  }
  .develop_blockwork .dbwork_sheet {
    height: 70rem;
  }
}

@media only screen and (max-width: 970px) {
  .header_develop .headerimg1 {
    display: none;
  }
}

@media only screen and (max-width: 800px) {
  .develop_block2 .slickslider .slick-dots li {
    margin-right: 5px;
  }
  .develop_block2 .slickslider .slick-dots li button:after {
    display: none;
  }
  .ssdev_img img {
    width: 100% !important;
  }
  .develop_sign {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    padding-left: 4rem;
    padding-right: 4rem;
  }
  .develop_block1 .rewards_item {
    width: 100%;
  }
  .develop_blockwork .wrapper,
  .develop_block1 .wrapper,
  .develop_block2 .wrapper,
  .zayavki_develop .wrapper {
    margin: 0 20px;
  }
  .develop_blockwork .dbwork_sheet {
    height: 120rem;
  }
  .card {
    width: 25%;
    height: 14.285%;
  }
  .card:hover .flipper {
    transform: rotateY(0deg);
  }
  .card.flipped {
    z-index: 98;
  }
  .card.flipped .flipper, .card.flipped .back {
    transform: rotateY(180deg);
  }
  .card.found {
    transform: scale(0);
  }
}

@media only screen and (max-width: 420px) {
  .develop_sign {
    padding-left: 0;
    padding-right: 0;
  }
  .ssdev_text {
    width: 100% !important;
  }
  .ssdev_img {
    display: none;
  }
  .develop_blockwork .dbwork_sheet {
    height: 80rem;
  }
  .cdt_display {
    display: none !important;
  }
  .card {
    width: 25%;
    height: 20%;
  }
}

@media only screen and (max-width: 420px) {
  .ssdev_text {
    width: 100% !important;
  }
  .ssdev_img {
    display: none;
  }
  .develop_block2 .slickslider .slick-dots li {
    width: 7rem;
    height: 7rem;
  }
  .develop_block2 .slickslider .slick-dots li button:before {
    font-size: 3.6rem;
  }
  .develop_block2 .slickslider {
    padding-top: 18rem;
  }
  .slickslider .wrapp {
    margin: 0;
  }
}

@media only screen and (max-width: 420px) and (max-width: 380px) {
  .develop_blockwork .dbwork_sheet {
    height: 60rem;
  }
}

.header_devstrat {
  height: 100%;
  background-color: #002b3b;
  background-image: -webkit-linear-gradient(45deg, rgba(0, 43, 59, 0.55) 0%, rgba(128, 206, 218, 0.55) 100%);
  background-image: -ms-linear-gradient(45deg, rgba(0, 43, 59, 0.55) 0%, rgba(128, 206, 218, 0.55) 100%);
  background-size: cover;
  position: relative;
  margin-bottom: 6rem;
  position: relative;
}

.header_ds_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../img/developstrategy/header_bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: bottom;
}

.par_3, .mbipar2, .mbipar1 {
  -webkit-transition: .01s ease;
  transition: .01s ease;
}

.devstrat_wrapper {
  margin: auto;
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: absolute;
  display: table;
}

.devstrat_sign {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  padding-left: 16%;
  padding-right: 16%;
}

.header_devstrat .title_frame {
  color: #fff;
}

.devstrat_sign h1.title_frame,
.devstrat_sign .xh1.title_frame {
  font-size: 5rem;
  margin-left: 0;
  margin-right: 0;
  line-height: 1.2;
}

.devstrat_sign h2.title_frame,
.devstrat_sign .xh2.title_frame {
  font-family: 'ProximaNovaThin', Arial, sans-serif;
  font-size: 3rem;
  margin-left: 0;
  margin-right: 0;
  color: #fff;
  max-width: 75rem;
  line-height: 1.5;
}

.devstrat_block {
  position: relative;
}

.devstrat_block:after {
  content: '';
  z-index: 1;
  background: url(../img/mobileapps/diagsvg.svg);
  background-size: cover;
  width: 100%;
  height: 17rem;
  position: absolute;
  bottom: -15.5rem;
}

.devstrat_block h1, .devstrat_block .xh1 {
  font-size: 5rem;
  color: #2d2e35;
}

.devstrat_block p {
  font-size: 3rem;
  color: #000;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  max-width: 76%;
}

.devstrat_block .title_frame {
  margin-top: 6rem;
}

.devstrat_block ul {
  margin: 0;
  padding: 0;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 3rem;
  color: #3b3a3a;
  margin-top: 7rem;
}

.devstrat_block ul li {
  list-style-type: none;
  list-style-type: none;
  width: 76%;
  background: url(../img/mobileapps/dots.png);
  background-repeat: repeat-x;
  background-position: 0 1.5rem;
}

@media only screen and (max-width: 500px) {
  .devstrat_block ul li {
    background: none;
  }
}

.devstrat_block ul li .dsb_logo {
  float: left;
  background-color: #fff;
  background-image: url(../img/developstrategy/rolf-rus2.png);
  background-size: cover;
  width: 26.4rem;
  height: 4.6rem;
  margin-top: -0.9rem;
}

@media only screen and (max-width: 500px) {
  .devstrat_block ul li .dsb_logo {
    display: none;
  }
}

.devstrat_block ul li .dsb_logo_desc {
  float: right;
  background: #fff;
  padding-left: 1rem;
}

.devstrat_block ul li .dsb_logo_desc > p {
  margin-left: 0;
  max-width: none !important;
}

.devstrat_block ul li:before {
  content: "\2022\0020";
  font-size: 6rem;
  color: #fc575b;
  position: relative;
  bottom: 2.3rem;
  background: #fff;
}

@media only screen and (max-width: 500px) {
  .devstrat_block ul li:before {
    display: none;
  }
}

.devstrat_block ul li p {
  font-family: 'ProximaNovaRegular', Arial, sans-serif;
  font-size: 2.5rem;
  margin: 0;
  margin-left: 3.9rem;
}

.devstrat_block .shac_king {
  position: absolute;
  width: 13.9rem;
  height: 13.4rem;
  right: 0;
  bottom: -5.5rem;
  z-index: 5;
}

.ds_block_ct {
  position: absolute;
  right: 9rem;
  top: 20rem;
  width: 28rem;
  height: 17.5rem;
  background-size: cover;
}

@media only screen and (max-width: 800px) {
  .ds_block_ct {
    display: none;
  }
}

.ds_block_ct .dsb1 {
  width: 100%;
  height: auto;
  position: absolute;
  display: block;
}

.ds_block_ct .dsb2 {
  width: 100%;
  height: auto;
  position: absolute;
  display: none;
}

.ds_block_ct .dsb_before {
  height: 5rem;
  width: 50%;
  left: 0;
  cursor: pointer;
  position: absolute;
}

.ds_block_ct .dsb_after {
  height: 5rem;
  width: 50%;
  right: 0;
  cursor: pointer;
  position: absolute;
}

.devstrat_block2 {
  background-color: #002b3b;
  background-image: -webkit-linear-gradient(45deg, rgba(0, 43, 59, 0.55) 0%, rgba(128, 206, 218, 0.55) 100%);
  background-image: -ms-linear-gradient(45deg, rgba(0, 43, 59, 0.55) 0%, rgba(128, 206, 218, 0.55) 100%);
  padding-bottom: 45rem;
  height: 98rem;
  position: relative;
  overflow: hidden;
}

.devstrat_block2 .svgnubm-arrow {
  width: 30.7rem;
  height: auto;
  position: absolute;
  right: 30.5rem;
  top: 37.5%;
  cursor: pointer;
}

.devstrat_block2 .svgnubm-arrow:after {
  content: '';
  width: 2.2rem;
  height: 3.7rem;
  position: absolute;
  background: url(../img/developstrategy/arrow-next.png);
  background-size: cover;
  top: 50%;
  margin-top: -2.2rem;
  right: 0;
}

.devstrat_block3 {
  position: relative;
}

.devstrat_block3 h1, .devstrat_block3 .xh1 {
  font-size: 5rem;
  color: #2d2e35;
}

.devstrat_block3 p {
  font-size: 3rem;
  color: #000;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
  max-width: 76%;
}

.devstrat_block3 .title_frame {
  margin-top: 6rem;
}

.strategy_block {
  position: relative;
}

.strategy_block h1, .strategy_block .xh1 {
  font-size: 5rem;
  color: #2d2e35;
}

.strategy_block p {
  font-size: 3rem;
  color: #000;
  font-family: 'ProximaNovaSemibold', Arial, sans-serif;
}

.strategy_block .title_frame {
  margin-top: 6rem;
}

.strategy_block ul {
  margin: 0;
  padding: 0;
  font-family: 'ProximaNovaBold', Arial, sans-serif;
  font-size: 3rem;
  color: #3b3a3a;
  margin-top: 7rem;
  position: relative;
  max-width: 40%;
}

@media only screen and (max-width: 800px) {
  .strategy_block ul {
    max-width: 50%;
  }
}

@media only screen and (max-width: 500px) {
  .strategy_block ul {
    max-width: 100%;
  }
}

.strategy_block ul img {
  content: '';
  position: absolute;
  width: auto;
  height: 100%;
  top: 0;
  left: 100%;
}

@media only screen and (max-width: 800px) {
  .strategy_block ul img {
    width: 100%;
    height: auto;
  }
}

.strategy_block ul li {
  list-style-type: none;
  list-style-type: none;
  width: 76%;
}

.strategy_block ul li:before {
  content: "\2022\0020";
  font-size: 6rem;
  color: #fc575b;
  position: relative;
  background: #fff;
}

.strategy_block ul li p {
  font-family: 'ProximaNovaRegular', Arial, sans-serif;
  font-size: 2.5rem;
  margin: 0;
  margin-left: 4rem;
  margin-top: -4.5rem;
}

.ds_b_slide {
  height: 98rem;
  display: table;
}

@media only screen and (max-width: 1100px) {
  .ds_b_slide .lft_img {
    left: 8rem !important;
  }
}

@media only screen and (max-width: 800px) {
  .ds_b_slide .lft_img {
    display: none;
  }
}

@media only screen and (max-width: 1100px) {
  .devstrat_block2 .svgnubm-arrow {
    right: 15.5rem !important;
  }
}

@media only screen and (max-width: 500px) {
  .devstrat_block2 .svgnubm-arrow {
    top: auto;
    bottom: 0;
    right: 2rem !important;
  }
}

.dsbs1 .lft_img {
  width: 41.6rem;
  height: 59.1rem;
  position: absolute;
  bottom: 12.5rem;
  left: 17rem;
  background: url(../img/developstrategy/ambassador.png);
  background-size: cover;
}

@media only screen and (max-width: 1400px) {
  .dsbs1 .lft_img {
    bottom: 15rem;
  }
}

.dsbs1 .rght_img {
  width: 30.1rem;
  height: 29.6rem;
  position: absolute;
  top: 50%;
  right: 0;
  background: url(../img/developstrategy/acar.png);
  background-size: cover;
}

@media only screen and (max-width: 1400px) {
  .dsbs1 .rght_img {
    top: 45%;
  }
}

@media only screen and (max-width: 500px) {
  .dsbs1 .rght_img {
    display: none;
  }
}

.dsbs2 .lft_img {
  width: 35.2rem;
  height: 39.9rem;
  position: absolute;
  bottom: 27.5rem;
  left: 17rem;
  background: url(../img/developstrategy/slider2.png);
  background-size: cover;
}

.dsbs3 .lft_img {
  width: 27.5rem;
  height: 24.4rem;
  position: absolute;
  bottom: 35.5rem;
  left: 17rem;
  background: url(../img/developstrategy/slider3.png);
  background-size: cover;
}

.dsbs4 .lft_img {
  width: 23.8rem;
  height: 56.4rem;
  position: absolute;
  bottom: 15rem;
  left: 17rem;
  background: url(../img/developstrategy/slider4.png);
  background-size: cover;
}

.ds_b_slide .txtblck {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

@media only screen and (max-width: 800px) {
  .ds_b_slide .txtblck {
    text-align: left;
    padding-left: 10rem;
  }
}

@media only screen and (max-width: 500px) {
  .ds_b_slide .txtblck {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}

.ds_b_slide .txtblck span {
  display: inline-block;
  text-align: left;
  color: #fff;
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 2.5rem;
  width: 32%;
}

@media only screen and (max-width: 800px) {
  .ds_b_slide .txtblck span {
    width: 55%;
  }
}

@media only screen and (max-width: 500px) {
  .ds_b_slide .txtblck span {
    width: 100%;
  }
}

@media only screen and (max-width: 500px) {
  .scheme {
    display: none;
  }
}

.devstrat_block2 .svgwave {
  position: absolute;
  bottom: 5rem;
  width: 100%;
  margin-left: 8rem;
}

@media only screen and (max-width: 500px) {
  .devstrat_block2 .svgwave {
    display: none;
  }
}

.zayavki_developstr {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  position: relative;
}

.zayavki_developstr h1.title_frame, .zayavki_developstr .xh1.title_frame {
  color: #3a55a2;
  font-size: 5rem;
}

.zayavki_developstr p.title_frame {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
}

.zayavki_developstr .wrapper:before {
  content: '';
  width: 8.4rem;
  height: 13.4rem;
  background: url(../img/developstrategy/peshka.png);
  background-size: cover;
  position: absolute;
  right: 20rem;
  top: 10rem;
  z-index: 2;
}

@media only screen and (max-width: 1100px) {
  .zayavki_developstr .wrapper:before {
    display: none;
  }
}

.zayavki_developstr .wrapper:after {
  content: '';
  width: 45.5rem;
  height: 11.7rem;
  background: url(../img/developstrategy/kon.png);
  background-size: cover;
  position: absolute;
  left: 15rem;
  bottom: 0;
  z-index: 2;
}

@media only screen and (max-width: 800px) {
  .zayavki_developstr .wrapper:after {
    display: none;
  }
}

.reddot {
  cursor: pointer;
  opacity: 0.3;
}

.reddot:hover {
  opacity: 1;
}

.rd0 {
  opacity: 1;
}

@media only screen and (max-width: 1400px) {
  .devstrat_block .moap_item .moap_item_content ul li:last-child:before {
    bottom: 2rem;
  }
  .devstrat_block .moap_item2 .moap_item_content li:before {
    top: -2rem;
  }
}

@media only screen and (max-width: 1100px) {
  .devstrat_sign {
    padding-left: 9rem;
    padding-right: 9rem;
  }
}

@media only screen and (max-width: 800px) {
  .devstrat_block .moap_item {
    margin-top: 5rem;
  }
  .devstrat_sign {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    padding-left: 3rem;
    padding-right: 3rem;
  }
  .header_devstrat .devstratimg2 {
    bottom: -3.5rem;
  }
  .devstrat_block .moap_item .moap_item_img,
  .devstrat_block .moap_item .moap_item_content {
    width: 100%;
  }
  .devstrat_block .moap_item .moap_item_img li,
  .devstrat_block .moap_item .moap_item_content li {
    position: relative !important;
    bottom: inherit !important;
  }
  .devstrat_block .moap_item2 .moap_item_content li {
    width: 100% !important;
    background: none;
  }
  .devstrat_block .moap_item2 .moap_item_content li:before {
    content: "\2022\0020";
    font-size: 6rem;
    color: #fc575b;
    position: relative !important;
    bottom: -0.5rem !important;
    top: inherit;
  }
  .devstrat_block2 .moapps_block2_item .mbi_numb, .tfp {
    display: none;
  }
  .dt_display {
    display: none !important;
  }
  .dt_mobile {
    display: block !important;
  }
  .devstrat_block2 .moapps_block2_item .mbi_left,
  .devstrat_block2 .moapps_block2_item .mbi_right {
    width: 100%;
    padding-left: 0;
  }
  .devstrat_block2 .moapps_block2_item p {
    width: 100%;
  }
  .devstrat_block .moap_item .moap_item_content ul li:last-child {
    width: 100% !important;
    background: none;
  }
  .devstrat_block .moap_item .moap_item_content ul li:last-child:before {
    bottom: -0.5rem !important;
  }
  .devstrat_block .moap_item .moap_item_content ul li p {
    margin-left: 0 !important;
  }
  .devstrat_block:after {
    height: 10rem;
    bottom: -9.5rem;
  }
  .devstrat_block2 {
    padding-bottom: 53rem;
  }
}

@media only screen and (max-width: 520px) {
  .devstratimg1 {
    width: 100% !important;
  }
  .dt_mobile,
  .devstrat_block2 > h1, .devstrat_block2 > .xh1 {
    margin-left: 5rem !important;
    margin-right: 5rem !important;
  }
  .devstrat_block2 .moapps_block2_item p {
    width: 80%;
  }
  .imgdevstrat {
    display: none;
  }
  .devstrat_block2 {
    padding-bottom: 0;
  }
  .title_frame {
    margin: 3rem 1.7rem !important;
  }
  .devstrat_block:after {
    height: 7rem;
    bottom: -6.5rem;
  }
  .devstrat_block2 h1.title_frame, .devstrat_block2 .xh1.title_frame {
    padding-top: 10rem;
  }
  .header_devstrat .devstratimg2 {
    bottom: -1.5rem;
  }
  .moap_item_content.dt_mobile {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .devstrat_block .moap_item .moap_item_content.dt_mobile ul li p {
    margin-left: 0 !important;
  }
  .devstrat_sign {
    padding-left: 0;
    padding-right: 0;
  }
  .devstrat_block .wrapper,
  .devstrat_block2 .wrapper {
    margin: 0;
  }
}

.header_errpage {
  height: 100%;
  background-color: #000;
  background-image: url(https://colary.ru/local/templates/new_colary/img/404/background_404.jpg);
  background-size: cover;
  background-position: center;
  position: relative;
}

.errpage_wrapper {
  width: 100%;
  height: 100%;
  margin: auto;
  overflow: hidden;
  position: absolute;
  text-align: center;
}

.errpage_wrapper :before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.errpage_content {
  display: inline-block;
  vertical-align: middle;
  height: 30%;
}

.errpage_content p {
  font-family: 'ProximaNovaLight', Arial, sans-serif;
  font-size: 3rem;
  color: #fff;
  text-align: left;
}

.errpage_content p a {
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid #fff;
}

.footer_errpage {
  top: -19.3rem;
  position: relative;
  margin-top: 0;
}

.errpage_moon {
  width: 100%;
  height: 100%;
  position: absolute;
  background-image: url(../img/404/moon.png);
  background-repeat: no-repeat;
  background-position: center 127%;
  background-size: contain;
}

.slider_portfolio_wrapper .slick-prev {
  left: 102px;
}

.slider_portfolio_wrapper .slick-next {
  right: 102px;
}

@media only screen and (max-width: 1700px) {
  html {
    font-size: 9px;
  }
  .wrapper, .wrapp {
    margin: 0 20px;
  }
  .slide_content {
    padding-left: 23rem;
    padding-right: 23rem;
  }
  .slick-prev {
    left: 117px;
  }
  .slick-next {
    right: 123px;
  }
  .slider_portfolio_wrapper .slick-prev {
    left: 83px;
  }
  .slider_portfolio_wrapper .slick-next {
    right: 83px;
  }
  .portfolio-item:first-child .portfolio-item-text {
    margin-left: 0;
  }
  .wrapper_blog, .footer .wrapper, .wrapper_button, .side_menu .wrapper {
    margin: 0 9rem;
  }
  .wrapper_blog {
    margin: 0 9rem 0 8.6rem;
  }
  .blog-item.default-item .blog-item_content {
    height: 610px;
  }
  .contacts_data {
    padding-left: 14rem;
  }
  .reviews_hr {
    top: 33.6rem;
  }
  .animation_frame6_comet {
    top: -9%;
    right: 26.5%;
  }
  .cbbtm_browser {
    top: -8.6rem;
    width: 131.2rem;
  }
}

@media only screen and (max-width: 1700px) and (min-width: 1400px) {
  .menu-switcher {
    margin-top: 5.3rem;
    margin-bottom: 5.3rem;
  }
}

@media only screen and (max-width: 1450px) {
  html {
    font-size: 7px;
  }
  .topmenu {
    height: 90px;
  }
  .topmenu .phone {
    margin-top: 35.5px;
    margin-bottom: 35.5px;
    right: 43rem;
  }
  .button_header {
    margin-top: 29px !important;
    margin-bottom: 29px !important;
  }
  a.anibutton.white {
    border: 1px solid #fff;
  }
  .topmenu a.anibutton {
    right: 14rem;
  }
  a.anibutton.red {
    border: 1px solid #fc5054;
  }
  a.anibutton.dark {
    border: 1px solid #000;
  }
  .arrowbutton .arrowanimate {
    top: 8px;
  }
  .anibutton.arrowbutton.big {
    right: 0;
  }
  a.anibutton.circle .icon:before {
    margin-left: -20%;
  }
  a.anibutton.big:link, a.anibutton.big:visited {
    padding-right: 0;
  }
  .wrapper_blog {
    margin: 0 7.6rem 0 8rem;
  }
  .hamburger-box {
    height: 36px;
  }
  .title_frame {
    margin: 6rem 26rem;
  }
  .zayavki p {
    margin: 0 26rem;
  }
  .question p {
    margin: 0 26rem;
  }
  .competention_content {
    padding: 6rem 8rem 0px 24rem;
  }
  .portfolio-item:first-child .portfolio-item-text {
    margin-left: 5rem;
  }
  .menu-switcher {
    width: 20px;
    height: 24px;
    margin-top: 28px;
    margin-bottom: 20px;
  }
  .hamburger-inner::before {
    top: -10px;
  }
  .hamburger-inner::after {
    bottom: -10px;
  }
  .hamburger-inner,
  .hamburger-inner::before,
  .hamburger-inner::after {
    width: 30px;
    height: 2.5px;
  }
  .slide_content {
    padding-left: 29rem;
    padding-right: 29rem;
  }
  .slick-prev {
    left: 92px;
  }
  .slick-next {
    right: 95px;
  }
  .slick-next .pagenumber, .slick-prev .pagenumber {
    top: 15px;
  }
  .slick-next .pagenumber {
    right: -30px;
  }
  .slick-prev .pagenumber {
    left: -30px;
  }
  .slider_portfolio_wrapper .slick-prev {
    left: 64px;
  }
  .slider_portfolio_wrapper .slick-next {
    right: 64px;
  }
  .portfolio-item {
    height: 430px;
  }
  .blog-item.default-item .blog-item_content {
    height: 540px;
  }
  .blog-item.image-item .blog-item_content {
    height: 325px;
  }
  .blog-item.dark-item .blog-item_content {
    padding-top: 385px;
  }
  .blog-item {
    min-height: 325px;
  }
  .contacts_data {
    padding-left: 15rem;
  }
  .reviews_hr {
    top: 41.6rem;
  }
  .site .competention_card_icon {
    margin-left: -2.2rem;
    margin-top: 0.2rem;
  }
  .mobile .competention_card_icon {
    margin-left: -5.5rem;
  }
  .seo .competention_card_icon {
    margin-left: -6rem;
    margin-top: 1.7rem;
  }
  .marketing .competention_card_icon {
    margin-left: -6rem;
    margin-top: -0.3rem;
  }
  .strategy .competention_card_icon {
    margin-left: -8rem;
    margin-top: -0.7rem;
  }
  .support .competention_card_icon {
    margin-left: -5rem;
  }
  .brand .competention_card_icon {
    margin-left: -6.6rem;
    margin-top: -2rem;
  }
  .brand .competention_card_icon {
    margin-left: -6.6rem;
  }
  .arrow_down {
    margin-left: -20px !important;
  }
  .case-header {
    margin-top: 90px !important;
  }
  .cbbtm_browser {
    top: -9.6rem;
    width: 145.2rem;
  }
  .case-block_long.case_rostex .case-block_new_text {
    padding-left: 28rem;
  }
  .case-block_new.case_rostex .case-block_new_webpage_wrapper,
  .case-block_new.case_rostex .case-block_new_webpage_wrapp {
    width: 245rem;
  }
  .case-img-caption.wrapper, .case-img-caption.wrapp, .case-title-block, .case-text {
    padding-left: 27rem;
    padding-right: 27rem;
  }
  .portfolio-item:first-child .wrapper {
    margin: 0;
  }
}

@media only screen and (max-width: 1300px) {
  .portfolio-item {
    height: 450px;
  }
  .project_gold {
    right: -80px;
  }
  .review_doc {
    width: 85rem;
  }
  .animation_frame6_comet {
    top: 13%;
    right: 14%;
  }
  .contacts_data {
    padding-left: 9rem;
  }
  .cbw_news1 {
    left: -53rem;
  }
  .cbbtm_browser {
    top: -8.5rem;
    width: 128.2rem;
  }
}

@media only screen and (max-width: 1275px) {
  .kalashlines {
    display: none;
  }
  .case-block_white .holdings {
    margin-left: 0;
    text-align: center;
  }
  .case-block_white .holdings p {
    width: auto;
  }
  .case-block_white .holdings img {
    position: relative;
    right: auto;
  }
  .case-block_white.case_rostex {
    height: 242.3rem;
  }
  .case-block_bottom .rostex_browser_bottom {
    top: 80rem;
    right: auto;
    left: 9rem;
  }
  .rostex_browser_result .wrapper,
  .rostex_browser_result .wrapp {
    padding: 0 9rem;
  }
  .cbbtm_browser {
    left: -27rem;
  }
}

@media only screen and (max-width: 1100px) {
  html {
    font-size: 6.5px;
  }
  .main_menu li {
    font-size: 40px;
  }
  .slide_content ul li {
    width: 24%;
  }
  .slide_content {
    padding-left: 20%;
    padding-right: 20%;
  }
  .title_frame {
    margin: 3rem 6rem;
  }
  .slick-prev {
    left: 87px;
  }
  .slick-next {
    right: 90px;
  }
  .question p, .zayavki p {
    margin: 0 9rem;
  }
  .review {
    margin: 50px 11rem;
  }
  .review_doc {
    width: 75rem;
  }
  .competention_content {
    padding: 0 4rem 0px 4rem;
  }
  .competention_card {
    width: 33.33%;
  }
  .competention_card p {
    margin-bottom: 9rem;
  }
  .competention_card:nth-child(4n+1) {
    clear: none;
  }
  .competention_card:nth-child(3n+1) {
    clear: both;
  }
  .portfolio-item:first-child {
    padding-left: 0;
  }
  .portfolio-item {
    width: 100%;
    height: 470px;
  }
  .portfolio-item:first-child .portfolio-item-img {
    margin-right: 0px;
    background-size: 60%;
  }
  .project_gold {
    right: -60px;
  }
  .portfolio-item:first-child .portfolio-item-text {
    margin-left: 0;
  }
  .clients_content {
    padding: 50px;
  }
  .clients_card:nth-child(3n+1) {
    clear: both;
  }
  .clients_card:nth-child(4n+1) {
    clear: none;
  }
  .clients_card {
    width: 33.33%;
  }
  .blog-list li, .blog-item.top-item {
    width: 50%;
  }
  .blog-item.default-item .blog-item_content {
    height: 445px;
  }
  .blog-item.top-item .blog-item_content {
    height: 445px;
  }
  .blog-item.top-item .blog-item_content .blog-item-title {
    font-size: 4rem;
  }
  .animation_frame4_hand1 {
    left: 5%;
  }
  .animation_frame4_hand2 {
    right: 57%;
  }
  .animation_frame6_comet {
    top: 6.6%;
    right: 10.7%;
  }
  .animation_frame3_cloud1,
  .animation_frame3_cloud2,
  .animation_frame4_hand1,
  .animation_frame4_hand2,
  .animation_frame6_comet {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
  }
  .animation_frame3_cloud2 {
    right: 80%;
  }
  .animation_frame4_hand1 {
    top: 9%;
    left: -17%;
  }
  .animation_frame4_hand2 {
    right: -12%;
  }
  .animation_frame6_comet {
    top: -9%;
    right: 3%;
  }
  .animation_frame_last h1, .animation_frame_last .xh1 {
    font-size: 12.5rem;
  }
  .animation_frame_last p {
    font-size: 4rem;
  }
  .animation_frame_last_center {
    text-align: left;
    margin-top: 5rem;
    margin-top: 14%;
  }
  .header_about {
    padding: 0;
  }
  .header_about .arrow_down {
    position: relative;
    bottom: 80px;
  }
  .animation_trigger,
  .animation_frame1,
  .animation_frame2,
  .animation_frame3,
  .animation_frame3_cloud1,
  .animation_frame3_cloud2,
  .animation_frame4_hand1,
  .animation_frame4_hand2,
  .animation_frame5,
  .animation_frame6_comet,
  .animation_frame7,
  .animation_wrapper_multi {
    display: none;
  }
  .animation_wrapper_single {
    display: block !important;
    height: 100vh;
  }
  .animation_wrapper_single:before {
    height: 0;
  }
  .animation_frame_last_center {
    position: absolute;
  }
  .animation_frame_last h1, .animation_frame_last .xh1 {
    opacity: 1 !important;
  }
  .animation_frame_last p {
    opacity: 1 !important;
  }
  .arrow_down {
    opacity: 1 !important;
  }
  .scrollmouse {
    opacity: 0 !important;
  }
  .animation_adaptive {
    position: relative;
    left: 0;
  }
  .achivments_timeline {
    display: none;
  }
  .about_image_umbrella {
    background-position-x: 135%;
  }
  .whyouneed_header_text {
    margin: 0 9rem;
  }
  .whyouneed_items {
    margin: 0 9rem;
  }
  .contacts_map {
    width: 50%;
  }
  .contacts_data {
    width: 50%;
  }
  .map_overlay {
    max-width: 65rem;
  }
  .reviews_hr {
    top: 38.6rem;
  }
  .case-wrapp, .case-wrapper {
    margin: 0 !important;
  }
  .case-header {
    margin-top: 0 !important;
  }
  .cbw_news1 {
    left: -53rem;
  }
  .case-block_long.case_rostex .case-block_new_text {
    padding-left: 6rem;
  }
  .case_rostex .prototype_bubble_1 {
    right: 55rem;
  }
  .case_rostex .prototype_bubble_2 {
    right: 3.6rem;
    top: 46.6rem;
  }
  .case_rostex .prototype_bubble_3 {
    right: 78.1rem;
  }
  .case_rostex .prototype_bubble_4 {
    right: 29.4rem;
  }
  .case-img-caption.wrapper, .case-img-caption.wrapp, .case-title-block, .case-text {
    padding-left: 6rem;
    padding-right: 6rem;
  }
}

@media only screen and (max-width: 1100px) and (min-width: 800px) {
  .animation_frame_last_center {
    margin-top: 14%;
    margin-left: 17rem;
  }
}

@media only screen and (max-width: 800px) {
  html {
    font-size: 7px;
  }
  .topmenu .wrapper {
    margin: 0 3rem;
  }
  .topmenu .phone {
    display: none !important;
  }
  .menu-switcher {
    width: 30px;
  }
  .main_menu li {
    font-size: 40px;
  }
  .slide_content ul li {
    width: 49%;
  }
  .slide_content h1, .slide_content .xh1 {
    font-size: 40px;
  }
  .slide_content h2, .slide_content .xh2 {
    font-size: 20px;
  }
  .slide_content {
    padding-left: 15%;
    padding-right: 15%;
  }
  .slick-prev, .slick-next {
    visibility: hidden;
  }
  .slide_image {
    display: block !important;
  }
  video.bgvideo {
    display: none !important;
  }
  .wrapper_blog,
  .footer .wrapper,
  .wrapper_button,
  .side_menu .wrapper {
    margin: 0 5rem;
  }
  .wrapper_blog {
    margin: 0 4rem;
  }
  .question p, .zayavki p {
    margin: 0 8rem;
  }
  .zayavki .form_wrapper form {
    width: 100%;
  }
  .review_doc {
    display: none;
  }
  .review_author_name {
    font-size: 3rem;
  }
  .review_author_who, .review_author_site {
    font-size: 2.5rem;
  }
  .competention {
    margin-top: 30px;
  }
  .competention_card {
    width: 50%;
  }
  .competention_card:nth-child(3n+1) {
    clear: none;
  }
  .portfolio-item:first-child .portfolio-item-content {
    padding-left: 0;
  }
  .portfolio-item-text {
    margin-left: 5rem !important;
    margin-top: 50px;
    margin-right: 30px;
  }
  .portfolio-item-name {
    font-size: 50px;
  }
  .portfolio-item .portfolio-item-hr {
    width: 100%;
  }
  .portfolio-item:first-child .portfolio-item-hr {
    width: 100%;
  }
  .portfolio-item {
    height: 400px;
    width: 100%;
  }
  .portfolio-item-hr {
    margin-top: 30px;
  }
  .portfolio-item-img {
    background-size: 50%;
    bottom: -20px;
    right: -60px;
  }
  .portfolio-item:first-child .portfolio-item-img {
    margin-right: 0px;
    background-size: 75%;
  }
  .project_gold {
    right: -90px;
    color: transparent;
    font-size: 0;
  }
  .button_more {
    font-size: 20px;
  }
  .button_more:after {
    background-size: 35px 35px;
  }
  .portfolio_slider-item-text {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  .clients {
    clear: both;
  }
  .clients_content {
    padding: 40px 30px;
  }
  .clients_content .wrapper {
    margin: 0 !important;
  }
  .blog-list li, .blog-item.top-item {
    width: 100%;
  }
  .blog-item.default-item .blog-item_content {
    height: 485px;
  }
  .blog-item.top-item .blog-item_content {
    height: 515px;
  }
  .blog-item.image-item .blog-item_content {
    height: 460px;
  }
  .animation_frame3_cloud1,
  .animation_frame3_cloud2,
  .animation_frame4_hand1,
  .animation_frame4_hand2,
  .animation_frame6_comet {
    -webkit-transform: scale(0.4);
    transform: scale(0.4);
  }
  .animation_frame3_cloud1 {
    top: 27%;
    left: 15%;
  }
  .animation_frame3_cloud2 {
    right: 125%;
    top: 0%;
  }
  .animation_frame4_hand1 {
    top: -5%;
    left: -34%;
  }
  .animation_frame4_hand2 {
    right: -28%;
    top: 24%;
  }
  .animation_frame6_comet {
    top: -43%;
    right: -13.5%;
  }
  .animation_frame_last h1, .animation_frame_last .xh1 {
    font-size: 7.5rem;
  }
  .animation_frame_last p {
    font-size: 3rem;
  }
  .animation_frame_last_center {
    top: 0;
    position: absolute;
  }
  .animation_frame_last_center {
    text-align: center;
  }
  .support_sign {
    text-align: center;
  }
  h2.title_frame, .xh2.title_frame {
    max-width: 100%;
  }
  .about_image_umbrella {
    top: -6%;
    z-index: 1;
    width: 80%;
    right: 0;
    background: url(../img/support/umbrella_no_monitor.png);
  }
  .about_image_monitor {
    display: block;
  }
  .whyouneed_item {
    width: 100%;
    margin-top: 6rem;
  }
  .whyouneed_item_img1, .whyouneed_item_img2, .whyouneed_item_img3 {
    width: 16.7rem;
    float: left;
  }
  .whyouneed_item_header {
    margin-top: 0;
  }
  .contacts_data_adres {
    max-width: 32rem;
  }
  .errpage_content {
    padding: 0 20rem;
  }
  .errpage_content p {
    text-align: center;
  }
  .errpage_content {
    padding: 0 5rem;
  }
  .contacts_data {
    width: 100%;
    height: 50%;
  }
  .contacts_map {
    width: 100%;
    height: 50vh;
    overflow: hidden;
  }
  #map {
    height: 110%;
  }
  .contacts_data {
    padding-top: 9rem;
  }
  .map_overlay {
    padding-left: 5.5rem;
  }
  .contacts_data {
    padding-left: 6rem;
  }
  .reviews_hr {
    display: none;
  }
  .review-hr {
    background-color: #fc5054;
  }
  .reviews {
    margin-top: 0;
  }
  .zayavki {
    margin-top: 0;
    margin-bottom: 0;
  }
  .zayavki .form_wrapper {
    margin-bottom: 20px;
  }
  .zayavki p {
    margin: 0 5rem !important;
  }
  .question p {
    margin: 0 1rem !important;
  }
  .errpage_moon {
    background-position: center 110%;
    background-size: 175% auto;
  }
  .bgvideo_t, .bgvid {
    display: none;
  }
  .portfolio-item-background {
    background-size: cover;
  }
  .portfolio-item:hover .portfolio-item-background {
    background-size: cover;
  }
  .case-bottom-nav .wrapper,
  .case-bottom-nav .wrapp {
    margin: 0 2rem !important;
  }
  .case-block_categorize {
    width: auto;
    right: auto;
    margin: 0 4rem;
    text-align: center;
  }
  .case-block_long.case_rostex .case-block_new_text {
    padding-left: 0;
  }
  .cbw_news1, .line_w_dot {
    display: none;
  }
  .case-block_white.case_rostex .wrapper,
  .case-block_white.case_rostex .wrapp {
    text-align: center;
  }
  .case-block_white .paragraph_top_right {
    width: auto;
    margin-right: 0;
  }
  .case_rostex_news_cat {
    float: none;
    margin-right: 0;
    margin-left: 50%;
    left: -21.2rem;
    position: relative;
  }
  .cbw_news2 {
    width: 100%;
    height: auto;
    position: absolute;
    right: auto;
    top: 35rem;
  }
  .case-block_white .holdings {
    margin-top: 74rem;
  }
  .case-block_white .static_page {
    padding: 0;
  }
  .cbbtm_browser {
    width: 100%;
    left: auto;
    top: -36rem;
  }
  .case-block_bottom .rostex_browser_sign {
    display: none;
  }
  .case-block_bottom .rostex_browser_bottom {
    top: 36rem;
    right: auto;
    left: auto;
    margin: 0 8rem;
  }
  .rostex_browser_result .wrapper,
  .rostex_browser_result .wrapp {
    padding: 0;
  }
  .case-block_bottom .proto3 {
    top: 84.9rem;
  }
  .case-block_bottom .proto2 {
    top: 121.8rem;
  }
  .case-block_bottom .proto1 {
    top: 155.4rem;
  }
  .case-block_bottom .proto_lines {
    top: 44.4rem;
  }
  .rostex_browser_result h3 {
    top: 3.5rem;
  }
  .rostex_browser_result p {
    top: 3.5rem;
    max-width: 85%;
    margin: 0 auto;
  }
  .rostex_browser_result .nsu_logo {
    margin-top: 7rem;
  }
  .go-cases {
    display: none;
  }
  .pbline {
    visibility: hidden;
  }
  .cbl_prototip, .pbbl_img, .pb4_static {
    display: none;
  }
  .cb_cat_mobile {
    display: block !important;
  }
  .cb_cat_mobile img {
    width: 100%;
    height: auto;
    padding: 0 3rem;
    box-sizing: border-box;
  }
  .cb_cat_mobile img:nth-child(1) {
    margin-bottom: 18rem;
  }
  .cb_cat_mobile img:nth-child(2) {
    margin-bottom: 13rem;
  }
  .cb_cat_mobile img:nth-child(3) {
    margin-bottom: 11rem;
  }
  .case-block_long.case_rostex {
    height: 351rem;
  }
  .case_rostex .prototype_bubble_1 {
    right: auto;
    left: 3rem;
    top: 94rem;
  }
  .case_rostex .prototype_bubble_2 {
    right: auto;
    top: 178.6rem;
    left: 0;
    width: 100%;
    padding: 0 3rem;
  }
  .case_rostex .prototype_bubble_3 {
    right: auto;
    left: 0;
    width: 100%;
    padding: 0 3rem;
    top: 229rem;
  }
  .case_rostex .prototype_bubble_4 {
    right: auto;
    top: 308rem;
    left: 0;
    width: 100%;
    padding: 0 3rem;
  }
  .case-column {
    padding-right: 0 !important;
  }
}

@media only screen and (max-width: 600px) {
  html {
    font-size: 6px;
  }
  a.anibutton {
    font-family: 'ProximaNovaSemibold', Arial, sans-serif;
    font-weight: bold;
  }
  .topmenu .anibutton, .topmenu .phone {
    display: none !important;
  }
.topmenu .anibtn .inner1 {
  display: none !important;
}
.topmenu .anibtn {
border: 0;
text-decoration: none;
}
.topmenu .request_button:after {
    content: "\e900";
    font-family: 'icomoon2' !important;
font-size: 28px;
}
  .topmenu {
    height: 80px;
  }
  .topmenu .logo {
    margin-left: 2rem;
  }
  .zayavki .form_wrapper {
    padding: 60px 31px;
  }
  .menu-switcher {
    right: 10px;
    width: 33px;
    height: 24px;
    margin-top: 25px;
    margin-bottom: 20px;
    margin-right: 10px;
  }
  .hamburger-inner::before {
    top: -12px;
  }
  .hamburger-inner::after {
    bottom: -12px;
  }
  .hamburger-inner,
  .hamburger-inner::before,
  .hamburger-inner::after {
    width: 40px;
  }
  .main_menu li {
    font-size: 42px;
    margin: 20px 0;
  }
  .side_menu .language, .side_menu .phone_block {
    margin-bottom: 20px;
    text-align: center;
    width: 100%;
    display: none;
  }
  .side_menu .button_header {
    display: block !important;
    top: inherit !important;
    right: inherit !important;
    bottom: 25px !important;
    width: 100% !important;
    text-align: center !important;
  }
.side_menu .anibtn {
display: none !important;
}
  .side_menu .button_group {
    width: 100%;
    text-align: center;
    display: none !important;
  }
  .side_menu .main_menu {
    left: 0;
    width: 100%;
  }
  .side_menu .main_menu a:before {
    top: -7px;
display: none;
  }
  .side_menu .main_menu {
    margin-left: 0;
    margin-bottom: 6rem;
    padding: 0;
  }
  .competention_content {
    padding: 0 20px 0px 20px;
  }
  .question p, .zayavki p {
    margin: 0 6rem;
  }
  .zayavki .form_wrapper form .input_sign {
    font-size: 2.5rem;
    width: 100%;
    margin-bottom: 0;
  }
  .zayavki .form_wrapper form .input_text {
    width: 100%;
  }
  .zayavki .anibutton.dark {
    width: 100%;
  }
  .zayavki .anibutton.red {
    width: 100%;
    margin-top: 2rem;
  }
  p.review_message:before {
    display: none;
  }
  .review {
    margin: 0rem 0rem;
    padding: 0 5rem;
  }
  .review_author_name {
    font-size: 2rem;
  }
  .review_author_who, .review_author_site {
    font-size: 1.8rem;
  }
  .button_inputfile {
    width: auto;
  }
  .slider_slide {
    padding: 0;
  }
  .slider_slide h1, .slider_slide .xh1 {
    font-size: 30px;
    text-align: center;
  }
  .slider_slide h2, .slider_slide .xh2 {
    font-size: 20px;
    text-align: center;
  }
  .slide_content ul li {
    width: 50%;
    float: left;
    height: 120px;
    text-align: center;
  }
  .slide_content ul li .image_ring {
    margin-left: 37%;
  }
  .slide_content {
    padding-left: 3rem;
    padding-right: 3rem;
  }
  h1, .xh1 {
    font-size: 30px;
  }
  .title_frame {
    margin: 30px 8px;
  }
  .competention_card {
    width: 100%;
    margin-bottom: 30px;
  }
  .competention_card p {
    text-align: center;
    margin-bottom: 0;
    margin-top: 130px;
  }
  .competention_card_icon {
    width: 28rem !important;
    height: 25rem !important;
    top: 0;
    position: absolute;
    left: 50%;
    margin-left: -84px !important;
  }
  .brand .competention_card_icon {
    margin-top: 0 !important;
  }
  .portfolio-item:first-child {
    padding-left: 0;
  }
  .portfolio-item-name {
    font-size: 25px;
  }
  .portfolio-item-description {
    font-size: 18px;
  }
  .portfolio-item .portfolio-item-hr {
    width: 100%;
  }
  .portfolio-item:first-child .portfolio-item-hr {
    width: 100%;
  }
  .portfolio-item {
    height: 330px;
    width: 100%;
  }
  .portfolio-item-hr {
    margin-top: 30px;
  }
  .portfolio-item-img {
    background-size: 75%;
    bottom: -20px;
    right: -60px;
  }
  .portfolio-item-img:hover {
    background-size: 90%;
  }
  .portfolio-item:first-child .portfolio-item-img {
    margin-right: 0px;
    background-size: 75%;
  }
  .portfolio-item:first-child:hover .portfolio-item-img {
    background-size: 90%;
  }
  .anibutton.arrowbutton.big {
    font-size: 20px !important;
  }
  .anibutton.arrowbutton.big span:nth-child(2) {
    top: 5px !important;
  }
  .project_gold {
    padding-left: 100px;
    background-size: 40px;
  }
  .wrapper_button .anibutton {
    margin-top: 2rem !important;
  }
  .wrapper_blog, .footer .wrapper, .wrapper_button {
    margin: 0 20px;
  }
  .clients {
    clear: both;
  }
  .clients_content {
    padding: 40px 20px;
  }
  .clients_card:nth-child(3n+1) {
    clear: none;
  }
  .clients_card:nth-child(2n+1) {
    clear: both;
  }
  .clients_card {
    width: 50%;
  }
  .blog {
    margin-top: 10px;
  }
  .blog-item.default-item .blog-item_content {
    height: 420px;
  }
  .blog-item.top-item .blog-item_content {
    height: 420px;
  }
  .blog-item.top-item .blog-item_content .blog-item-text {
    max-height: 27rem;
    -moz-height: 27rem;
    -webkit-height: 27rem;
    -o-height: 27rem;
  }
  .blog-item.image-item .blog-item_content {
    height: 300px;
  }
  .blog-item-hr {
    display: none;
  }
  .blog-item-hr-top {
    width: 100%;
  }
  .blog-item.dark-item .blog-item_content {
    padding-top: 50px;
  }
  .footer {
    padding: 0;
  }
  .button_footer {
    margin-top: 20px !important;
    margin-bottom: 0 !important;
    position: relative !important;
    display: none !important;
  }
  .footer .button_group {
    margin-bottom: 20px;
    width: 100%;
    text-align: center;
    padding: 0;
  }
  .footer .language, .footer .phone {
        margin-top: 4rem;
  }
  .footer .wrapper {
    margin: 0px 5.2rem !important;
  }
  .animation_frame4_hand1 {
    top: -10%;
    left: -39%;
  }
  .animation_frame4_hand2 {
    right: -33%;
    top: 19%;
  }
  .animation_frame6_comet {
    top: -53%;
    right: -18.5%;
  }
  .about_image_rocket {
    display: none;
  }
  .about_image_umbrella {
    top: -13%;
    width: 95%;
    background-size: cover;
  }
  .about_image_monitor {
    bottom: 0rem;
    right: 18rem;
    width: 30rem;
    height: 24rem;
  }
  .whyouneed_header_text {
    margin: 0 5rem;
  }
  .whyouneed_items {
    margin: 0 5rem;
  }
  .whyouneed_item_header {
    margin-top: 6rem;
    padding-right: 2rem;
  }
  .whyouneed_item_text {
    margin-top: 6rem;
    padding-right: 0;
    width: 100%;
  }
  #map {
    height: 110%;
    width: 100%;
  }
  .contacts_data {
    padding-top: 11rem;
  }
  .contacts_data_mail {
    margin-bottom: 5rem;
  }
  .contacts_data_adres {
    margin-bottom: 8rem;
  }
  .header_contacts .arrow_down {
    bottom: 2rem;
  }
  .anibutton.arrowbutton.big {
    right: -0.6rem !important;
  }
  .wrapper_button {
    margin: 0 3rem !important;
  }
  a.anibutton.big:link, a.anibutton.big:visited {
    padding-right: 1.2rem !important;
  }
  .zayavki_wrapper {
    margin: 0;
  }
  .review_author_site {
    bottom: 0px;
  }
  .fillvideo video {
    display: none;
  }
  .case-bottom-nav .anibtn {
    position: relative !important;
    width: 100% !important;
    margin: 10px 0;
  }
  .case-bottom-nav .wrapper,
  .case-bottom-nav .wrapp {
    height: 15rem !important;
  }
  .case-block_white .holdings {
    margin-top: 53rem;
    margin-left: 5rem;
    margin-right: 5rem;
  }
  .case-block_white .holdings img {
    width: 100%;
    height: auto;
  }
  .case-block_white .static_page {
    margin-left: 5rem;
    margin-right: 5rem;
  }
  .cbbtm_browser {
    top: -39rem;
  }
  .case-block_bottom .rostex_browser_bottom {
    top: 29rem;
    right: auto;
    left: auto;
    margin: 0;
    padding: 0 6rem;
    width: 100%;
  }
  .case_rostex .prototype_bubble_1 {
    top: 90rem;
  }
  .case_rostex .prototype_bubble_2 {
    top: 166.6rem;
  }
  .case_rostex .prototype_bubble_3 {
    top: 214rem;
  }
  .case_rostex .prototype_bubble_4 {
    top: 286rem;
  }
  .case-block_long.case_rostex {
    height: 337rem;
  }
  .disp-mob {
    display: block !important;
  }
}

@media only screen and (max-width: 550px) {
  .case-block_long.case_rostex .case-block_new_text {
    padding-left: 5rem;
  }
  .case_rostex .prototype_bubble_1 {
    top: 72rem;
    width: 100%;
    left: 0;
    padding: 0 5rem;
  }
  .case_rostex .prototype_bubble_2,
  .case_rostex .prototype_bubble_3,
  .case_rostex .prototype_bubble_4,
  .case-block_white .paragraph_top_right {
    padding: 0 5rem;
  }
  .pb1_numbers {
    display: none;
  }
  .cb_cat_mobile img:nth-child(1) {
    margin-bottom: 14rem;
  }
  .cb_cat_mobile img:nth-child(2) {
    margin-bottom: 15rem;
  }
  .case_rostex .prototype_bubble_2 {
    top: 124.6rem;
  }
  .case_rostex .prototype_bubble_3 {
    top: 163rem;
  }
  .case_rostex .prototype_bubble_4 {
    top: 216rem;
  }
  .case-block_long.case_rostex {
    height: 273rem;
  }
  .case-block_new.case_rostex .img_laptop {
    width: 100%;
    left: 0;
    right: 0;
    background-position: center;
  }
  .rostex_logo {
    display: none !important;
  }
  .block_new.case_rostex .case-block_new_text {
    padding-left: 5rem;
    padding-right: 5rem;
  }
  .case-block_bottom .rostex_browser_bottom {
    top: 6rem;
  }
}

@media only screen and (max-width: 425px) {
  .contacts_social {
     display: none !important;
}
  .form_wrapper .anibtn.dark {
    width: 8rem;
  }
  .slider_slide h1, .slider_slide .xh1 {
    font-size: 24px;
  }
  .slider_slide h2, .slider_slide .xh2 {
    font-size: 14px;
  }
  .slide_content ul {
    display: none;
  }
  .competention {
    margin-top: 0;
  }
  .anibutton.arrowbutton.big {
    font-size: 15px !important;
  }
  .blog-item.dark-item .blog-item_content {
    padding-top: 50px;
  }
  .blog-list {
    margin: 0 auto;
  }
  .blog-item-text img {
    max-height: 20rem;
    -moz-height: 20rem;
    -webkit-height: 20rem;
    -o-height: 20rem;
  }
  .wrapper_button .anibutton {
    margin-top: 0 !important;
  }
  .zayavki .form_wrapper form .input_sign {
    margin-bottom: 2rem;
  }
  .zayavki .form_wrapper {
    padding: 20px 31px;
    padding-bottom: 6rem;
  }
  .zayavki .flag {
    top: 40px;
  }
  .header_about {
    padding: 0;
  }
  .header_about .arrow_down {
    position: relative;
    bottom: 80px;
  }
  .animation_trigger,
  .animation_frame1,
  .animation_frame2,
  .animation_frame3,
  .animation_frame3_cloud1,
  .animation_frame3_cloud2,
  .animation_frame4_hand1,
  .animation_frame4_hand2,
  .animation_frame5,
  .animation_frame6_comet,
  .animation_frame7,
  .animation_wrapper_multi {
    display: none;
  }
  .animation_wrapper_single {
    display: block !important;
    height: 100vh;
  }
  .animation_wrapper_single:before {
    height: 0;
  }
  .animation_frame_last_center {
    top: -40px;
    position: absolute;
    text-align: left;
    margin-left: 4rem;
  }
  .animation_frame_last h1, .animation_frame_last .xh1 {
    font-size: 5rem !important;
    opacity: 1 !important;
  }
  .animation_frame_last p {
    font-size: 2.5rem;
    margin-top: 3rem;
    opacity: 1 !important;
  }
  .arrow_down {
    opacity: 1 !important;
  }
  .scrollmouse {
    opacity: 0 !important;
  }
  .animation_adaptive {
    position: relative;
    left: 0;
  }
  #competention {
    bottom: 80px !important;
  }
  .about_image_rocket {
    display: none;
  }
  .about_image_umbrella {
    display: none;
  }
  .about_image_monitor {
    display: none;
  }
  .whyouneed_item_img1, .whyouneed_item_img2, .whyouneed_item_img3 {
    width: 12rem;
    height: 12rem;
  }
  .whyouneed_item_header {
    margin-top: 1.5rem;
    padding-right: 0rem;
    float: left;
    width: 60%;
  }
  .whyouneed_item_text {
    margin-top: 15rem;
  }
  .map_overlay {
    padding-left: 4.3rem;
    padding-right: 4.3rem;
  }
  .contacts_data {
    padding-top: 6rem;
    padding-left: 3.8rem;
  }
  .errpage_content {
    height: 23%;
  }
  .cbbtm_browser {
    top: -28rem;
  }
  .case-block_bottom .rostex_browser_bottom {
    top: 13rem;
  }
  .case_rostex .prototype_bubble_1 {
    top: 67rem;
    width: 100%;
    left: 0;
    padding: 0 3rem;
  }
  .cb_cat_mobile img:nth-child(1) {
    margin-bottom: 12rem;
  }
  .case_rostex .prototype_bubble_2 {
    top: 114.6rem;
  }
  .case_rostex .prototype_bubble_3 {
    top: 150rem;
  }
  .case_rostex .prototype_bubble_4 {
    top: 199rem;
  }
  .case-block_long.case_rostex {
    height: 258rem;
  }
}

@media only screen and (max-width: 370px) {
  .main_menu li {
    font-size: 42px;
  }
  .case-block_long.case_rostex .case-block_new_text {
    padding-left: 3rem;
  }
  .case_rostex .prototype_bubble_1 {
    top: 65rem;
  }
  .case_rostex .prototype_bubble_2 {
    top: 113.6rem;
  }
  .case_rostex .prototype_bubble_3 {
    top: 152rem;
  }
  .case_rostex .prototype_bubble_4 {
    top: 201rem;
  }
  .cb_cat_mobile img:nth-child(2) {
    margin-bottom: 20rem;
  }
  .cb_cat_mobile img:nth-child(3) {
    margin-bottom: 13rem;
  }
  .case-block_long.case_rostex {
    height: 260rem;
  }
}

@media only screen and (max-width: 330px) {
  .main_menu li {
    font-size: 38px;
  }
  .wrapper_blog, .footer .wrapper, .wrapper_button, .side_menu .wrapper {
    margin: 0px 4rem;
  }
  .map_overlay {
    top: 12rem;
  }
  .cbbtm_browser {
    top: -17rem;
  }
  .case-block_bottom .rostex_browser_bottom {
    top: 17rem;
  }
  .cb_cat_mobile img:nth-child(1) {
    margin-bottom: 14rem;
  }
  .case_rostex .prototype_bubble_2 {
    top: 110.6rem;
  }
  .cb_cat_mobile img:nth-child(2) {
    margin-bottom: 25rem;
  }
  .case_rostex .prototype_bubble_3 {
    top: 153rem;
  }
  .cb_cat_mobile img:nth-child(3) {
    margin-bottom: 19rem;
  }
  .case_rostex .prototype_bubble_4 {
    top: 204rem;
  }
  .case-block_long.case_rostex {
    height: 276rem;
  }
  .cbw_news2 {
    top: 41rem;
  }
}

@media only screen and (max-width: 800px) and (min-width: 426px) {
  .slide_content h1, .slide_content .xh1 {
    font-size: 30px;
  }
  .slide_content ul {
    display: none;
  }
  .slider_slide h2, .slider_slide .xh2 {
    font-size: 14px;
    margin-top: 2rem;
    display: none;
  }
}

.success_block {
  background: #ebeef3;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
  text-align: center;
}

.success_block:before {
  content: '\200B';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.success_block > div {
  display: inline-block;
  vertical-align: middle;
  padding: 10px 15px;
}

.success_block > div > img {
  width: 17.5rem;
  height: auto;
  margin-bottom: 6rem;
  -webkit-box-shadow: 0px 0px 8px 0px rgba(45,46,53,0.49);
-moz-box-shadow: 0px 0px 8px 0px rgba(45,46,53,0.49);
box-shadow: 0px 0px 8px 0px rgba(45,46,53,0.49);
}

.success_block > div > .sbtx {
  text-align: center;
  color: #fff;
  font-size: 5rem;
  font-family: 'ProximaNovaExtrabold', Arial, sans-serif;
  color: #2d2e35;
}

.blog-item_content > img {
  width: 100%;
  height: auto;
}

.blog-item.long-item .blog-item_content {
  background-color: #ebeef3;
}

.pihr_case_new {
  height: 1px;
  background-color: rgba(245, 245, 245, 0.15);
}

.hidden {
  display: none !important;
}

.visible {
  display: block !important;
}

.hidden-block {
  opacity: 0;
}

.visible-block {
  opacity: 1;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .anibutton.arrowbutton.big .arrowanimate {
    -webkit-transition: -webkit-transform .3s ease-out;
    transition: -webkit-transform .3s ease-out;
    transition: transform .3s ease-out;
    transition: transform .3s ease-out, -webkit-transform .3s ease-out;
  }
  .anibutton.arrowbutton.big:hover .arrowanimate {
    -webkit-transform: translateX(1.5rem);
    transform: translateX(1.5rem);
  }
  .aniarrow .path {
    display: none;
  }
}

.soc_button .path1, .soc_button .path2, .soc_button .path3 {
float: left;
}

.slick-slider {
  -webkit-user-select: text;
  -khtml-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}