/*!
 * animate.css 3.5.2 — http://daneden.me/animate (лицензия MIT)
 * Набор анимаций, на которые рассчитана разметка блоков Bitrix24:
 * элемент с классом js-animation получает имя анимации (fadeIn, zoomIn и т. д.),
 * а класс .animated включает её проигрывание.
 *
 * На сайте эти стили внедрял рантайм Bitrix24 с портала crm.glmhg.ru.
 * Мы от него отвязались, поэтому храним их у себя.
 * Варианты *Modified — надстройка Bitrix для повторного показа анимации.
 */

.animated { animation-duration: 1s; animation-fill-mode: both; }
.animated.infinite { animation-iteration-count: infinite; }
.animated.delay-1s { animation-delay: 1s; }
.animated.fast { animation-duration: .8s; }
.animated.slow { animation-duration: 2s; }
.animated.bounceIn { animation-duration: .75s; }

/* элементы без анимации остаются как есть */
.animation-none { animation: none !important; }

/* Пока анимация не запущена, элемент виден: имя анимации само по себе ничего
   не скрывает, скрывает только её первый кадр вместе с классом .animated.
   Так контент не может застрять прозрачным, если анимация не проиграется. */

@media (prefers-reduced-motion: reduce) {
  .animated { animation: none !important; }
}

/* ---------------------------------------------------------------- fade */
@keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } }
.fadeIn { animation-name: fadeIn; }

@keyframes fadeInDown { from { opacity: 0; transform: translate3d(0,-100%,0) } to { opacity: 1; transform: none } }
.fadeInDown:not(.modified) { animation-name: fadeInDown; }
@keyframes fadeInDownModified { from { opacity: 1; transform: none } 50% { opacity: 0; transform: translate3d(0,-100%,0) } to { opacity: 1; transform: none } }
.fadeInDown.modified { animation-name: fadeInDownModified; }

@keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%,0,0) } to { opacity: 1; transform: none } }
.fadeInLeft:not(.modified) { animation-name: fadeInLeft; }
@keyframes fadeInLeftModified { from { opacity: 1; transform: none } 50% { opacity: 0; transform: translate3d(-100%,0,0) } to { opacity: 1; transform: none } }
.fadeInLeft.modified { animation-name: fadeInLeftModified; }

@keyframes fadeInRight { from { opacity: 0; transform: translate3d(100%,0,0) } to { opacity: 1; transform: none } }
.fadeInRight:not(.modified) { animation-name: fadeInRight; }
@keyframes fadeInRightModified { from { opacity: 1; transform: none } 50% { opacity: 0; transform: translate3d(100%,0,0) } to { opacity: 1; transform: none } }
.fadeInRight.modified { animation-name: fadeInRightModified; }

@keyframes fadeInUp { from { opacity: 0; transform: translate3d(0,100%,0) } to { opacity: 1; transform: none } }
.fadeInUp:not(.modified) { animation-name: fadeInUp; }
@keyframes fadeInUpModified { from { opacity: 1; transform: none } 50% { opacity: 0; transform: translate3d(0,100%,0) } to { opacity: 1; transform: none } }
.fadeInUp.modified { animation-name: fadeInUpModified; }

/* ---------------------------------------------------------------- zoom */
@keyframes zoomIn { from { opacity: 0; transform: scale3d(.3,.3,.3) } 50% { opacity: 1 } }
.zoomIn:not(.modified) { animation-name: zoomIn; }
@keyframes zoomInModified { 50% { transform: scale3d(.3,.3,.3) } }
.zoomIn.modified { animation-name: zoomInModified; }

@keyframes zoomToIn { from { opacity: 0; transform: scale3d(1.7,1.7,1.7); animation-timing-function: ease-out } 30% { opacity: 0 } 100% { opacity: 1 } }
.zoomToIn:not(.modified) { animation-name: zoomToIn; }
@keyframes zoomToInModified { 50% { transform: scale3d(1.7,1.7,1.7); animation-timing-function: ease-out } }
.zoomToIn.modified { animation-name: zoomToInModified; }

/* --------------------------------------------------------------- slide */
@keyframes slideInUp { from { transform: translate3d(0,100%,0) } to { transform: translate3d(0,0,0) } }
.slideInUp:not(.modified) { animation-name: slideInUp; }
@keyframes slideInUpModified { from { transform: translate3d(0,0,0) } 50% { transform: translate3d(0,100%,0) } to { transform: translate3d(0,0,0) } }
.slideInUp.modified { animation-name: slideInUpModified; }

@keyframes slideInDown { from { transform: translate3d(0,-100%,0) } to { transform: translate3d(0,0,0) } }
.slideInDown:not(.modified) { animation-name: slideInDown; }
@keyframes slideInDownModified { from { transform: translate3d(0,0,0) } 50% { transform: translate3d(0,-100%,0) } to { transform: translate3d(0,0,0) } }
.slideInDown.modified { animation-name: slideInDownModified; }

@keyframes slideInLeft { from { transform: translate3d(-100%,0,0) } to { transform: translate3d(0,0,0) } }
.slideInLeft:not(.modified) { animation-name: slideInLeft; }
@keyframes slideInLeftModified { from { transform: translate3d(0,0,0) } 50% { transform: translate3d(-100%,0,0) } to { transform: translate3d(0,0,0) } }
.slideInLeft.modified { animation-name: slideInLeftModified; }

@keyframes slideInRight { from { transform: translate3d(100%,0,0) } to { transform: translate3d(0,0,0) } }
.slideInRight:not(.modified) { animation-name: slideInRight; }
@keyframes slideInRightModified { from { transform: translate3d(0,0,0) } 50% { transform: translate3d(100%,0,0) } to { transform: translate3d(0,0,0) } }
.slideInRight.modified { animation-name: slideInRightModified; }

/* -------------------------------------------------------------- bounce */
@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to { animation-timing-function: cubic-bezier(.215,.61,.355,1) }
  0% { opacity: 0; transform: scale3d(.3,.3,.3) }
  20% { transform: scale3d(1.1,1.1,1.1) }
  40% { transform: scale3d(.9,.9,.9) }
  60% { opacity: 1; transform: scale3d(1.03,1.03,1.03) }
  80% { transform: scale3d(.97,.97,.97) }
  to { opacity: 1; transform: scale3d(1,1,1) }
}
.bounceIn { animation-name: bounceIn; }

/* ---------------------------------------------------------- прочие ---- */
@keyframes pulse { from { transform: scale3d(1,1,1) } 50% { transform: scale3d(1.05,1.05,1.05) } to { transform: scale3d(1,1,1) } }
.pulse { animation-name: pulse; }

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

@keyframes rotateIn { from { transform-origin: center; transform: rotate3d(0,0,1,-200deg); opacity: 0 } to { transform-origin: center; transform: none; opacity: 1 } }
.rotateIn:not(.modified) { animation-name: rotateIn; }
@keyframes rotateInModified { from { transform-origin: center; transform: none } 50% { transform-origin: center; transform: rotate3d(0,0,1,-200deg) } to { transform-origin: center; transform: none } }
.rotateIn.modified { animation-name: rotateInModified; }

@keyframes lightSpeedIn { from { transform: translate3d(100%,0,0) skewX(-30deg); opacity: 0 } 60% { transform: skewX(20deg); opacity: 1 } 80% { transform: skewX(-5deg); opacity: 1 } to { transform: none; opacity: 1 } }
.lightSpeedIn { animation-name: lightSpeedIn; animation-timing-function: ease-out; }

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