/**
 * Start animacji opóźniony
 */
.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

/**
 * Zablokowanie animacji na stronach mobilnych
 */
@media (max-width: 767px) {
    .animation-vertical,
    .animation-horizontal,
    .animation-horizontal .my-button-triangle,
    .animation-horizontal .my-button-triangle2 {
          -webkit-transition: none !important;
          -moz-transition: none !important;
          -ms-transition: none !important;
          -o-transition: none !important;
          transition: none !important;
    }
    .animation-vertical::before {
          -webkit-transition: none !important;
          -moz-transition: none !important;
          -ms-transition: none !important;
          -o-transition: none !important;
          transition: none !important;
    }    
}

/**
 * Animacja: w pionie
 */
.animation-vertical { position: relative; transition: all 0.3s ease-in-out 0s; }
.animation-vertical:hover { background-color: #e2001a !important; }

.animation-vertical::before { position: absolute; content: ""; height: 0; left: 0; right: 0; bottom: 0; background-color: #e2001a; transition: all 0.3s ease-in-out 0s; }
.animation-vertical:hover::before { height: 100%; }
.animation-vertical i { position: relative; z-index: 3 }

/**
 * Animacja: w poziomie
 */
.animation-horizontal { transition: all 0.5s ease-in-out 0s; }
.animation-horizontal:hover { background-color: #e2001a !important; }

.animation-horizontal::before { position: absolute; content: ""; width: 0; height: 100%; left: 0; right: 0; bottom: 0; background-color: #e2001a; transition: all 0.3s ease-in-out 0s; }
.animation-horizontal:hover::before { width: 100%; }
.animation-horizontal span { position: relative; z-index: 3 }