
/* - - - - - - - - - - - - - - - - - - - -

          GSAP Animations 

- - - - - - - - - - - - - - - - - - - - */

/* 

.line { width: 100%; max-width: 800px; height: 2px; margin: 0 0 10px 0; position: relative; display: inline-block !important; background-color: var(--color_border); }

 */




 #main_nav .nav-link {transition: all .4s ease-in-out; }







/* - - - - - - - - - - - - - - - - - - - -

           Animations 

- - - - - - - - - - - - - - - - - - - - */

/*.swiper-slide-active .swiper-slide-active aside,
.pres_slider .product-banner {
-webkit-animation: fadeIn .5s ease-out 0.1s 1 both;
animation: fadeIn .5s ease-out 0.1s 1 both;
}*/



/* 
.
height: 150px;
width: 300px;
background: linear-gradient(-45deg, #eee 40%, #fafafa 50%, #eee 60%);
background-size: 300%;
background-position-x: 100%
animation: shimmer 1s infinite linear; */





.navbar-brand,
#notification_header ul {
  -webkit-animation: fadeInDown20 .5s ease-out 1.2s 1 both;
  animation: fadeInDown20 .5s ease-out 1.2s 1 both;
}

#notification_header .notification_slider {
  -webkit-animation: fadeInUp20 .5s ease-out 1.5s 1 both;
  animation: fadeInUp20 .5s ease-out 1.5s 1 both;
}

#nav_left,
#footer_nav .left {
  -webkit-animation: fadeInRight .5s ease-out 1.2s 1 both;
  animation: fadeInRight .5s ease-out 1.2s 1 both;
}

#nav_right,
#footer_nav .right {
  -webkit-animation: fadeInLeft .5s ease-out 1.2s 1 both;
  animation: fadeInLeft .5s ease-out 1.2s 1 both;
}

/*
.hero_banner .img {
  -webkit-animation: fadeIn .5s ease-out 0s 1 both;
  animation: fadeIn .5s ease-out 0s 1 both;
}
*/





.hero_banner .content:before,
#main_nav:before {
  -webkit-animation: fadeIn 1s ease-in-out .5s 1 both;
  animation: fadeIn 1s ease-in-out .5s 1 both;
}

.hero_banner:after {
  -webkit-animation: fadeIn65 1.4s ease-in-out 0s 1 both;
  animation: fadeIn65 1.4s ease-in-out .5s 1 both;
}


p.pre_title,
.header.hasborder {
  -webkit-animation: fadeInDown .3s ease-in-out 1.2s 1 both;
  animation: fadeInDown .3s ease-in-out 1.2s 1 both;
}

p.post_title {
  -webkit-animation: fadeInUp .3s ease-in-out 1.5s 1 both;
  animation: fadeInUp .3s ease-in-out 1.5s 1 both;
}




.animate_title/*h1, h2, h3, h4*/ {
  -webkit-animation: fadeInUp 1s ease-in-out .5s 1 both;
  animation: fadeInUp 1s ease-in-out .5s 1 both;
}
.text-start .animate_title/*h1, h2, h3, h4*/ {
  -webkit-animation: fadeInRight 1s ease-in-out .5s 1 both;
  animation: fadeInRight 1s ease-in-out .5s 1 both;
}
.text-end .animate_title/*h1, h2, h3, h4*/ {
  -webkit-animation: fadeInLeft 1s ease-in-out .5s 1 both;
  animation: fadeInLeft 1s ease-in-out .5s 1 both;
}


.banner_description,
.card-text.animated,
.animate_description,
.flexible_badges,
.hero_banner .arrow_down,
.caption,
.swiper-pagination,
.card .header_extra.inimage {
  -webkit-animation: fadeIn .5s ease-in-out .6s 1 both;
  animation: fadeIn .5s ease-in-out .6s 1 both;
} 


.desc ul {
  -webkit-animation: fadeIn .5s ease-in-out .5s 1 both;
  animation: fadeIn .5s ease-in-out .5s 1 both;
}

.animated_buttons,
.card_arrow,
.columns_inline,
.fc_columns,
.fc .links,
.fc .prices {
  -webkit-animation: fadeInUp .5s ease-in-out .5s 1 both;
  animation: fadeInUp .5s ease-in-out .5s 1 both;
}


.about .row {
  -webkit-animation: fadeInUp .5s ease-in-out 3s 1 both;
  animation: fadeInUp .5s ease-in-out 3s 1 both;
}




.modal .animate_title { -webkit-animation: fadeInUp .5s ease-in-out .1s 1 both; animation: fadeInUp .5s ease-in-out .1s 1 both; }
.modal .banner_description, 
.modal .card-text.animated, 
.modal .animate_description { -webkit-animation: fadeIn .5s ease-in-out .2s 1 both; animation: fadeIn .5s ease-in-out .2s 1 both; }
.modal p.pre_title { -webkit-animation: fadeInDown .6s ease-in-out .2s 1 both; animation: fadeInDown .6s ease-in-out .2s 1 both; }
.modal p.post_title { -webkit-animation: fadeInUp .8s ease-in-out .2s 1 both; animation: fadeInUp .6s ease-in-out .2s 1 both; }



a.link_hover .content.inimage h3 { /* transition: all 1.6s ease-in-out;  */ transition: none; transform-origin:top left; transform-origin:center;}
.shake .event_info.past_event{ transition: all .15s ease-in-out; }
@media (hover: hover) and (pointer: fine) {
    /* a.link_hover:hover .content.inimage h3 {scale: 1.05; transition-delay: 0s; } */
  .shake:focus, .shake:active{ animation: shake .15s cubic-bezier(.36,.07,.19,.97) both; transform: translate3d(0, 0, 0); backface-visibility: hidden; perspective: 1000px; opacity: .95; }
   .shake:focus .event_info.past_event, .shake:active .event_info.past_event{ transform-origin: center right; transform: scale(1.04); }
}


@keyframes shake {
  10%, 90% {
    /* transform: translate3d(-1px, 0, 0); */
  }
  
  20%, 80% {
    /* transform: translate3d(1px, 0, 0); */
  }

  30%, 50%, 70% {
    /* transform: translate3d(-2px, -2px, 0); */
    transform: rotate(-1deg);
  }

  40%, 60% {
    /* transform: translate3d(2px, 2px, 0); */
    transform: rotate(0deg);
  }
}


@-webkit-keyframes fadeInDown { 0% {
  opacity: 0;
  -webkit-transform: translateY(-20px);
  transform: translateY(-20px);
  } 100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
}}
@keyframes fadeInDown { 0% {
  opacity: 0;
  -webkit-transform: translateY(-20px);
  transform: translateY(-20px);
  }
  100% {
    -webkit-transfo
    opacity: 1;rm: none;
    transform: none;
}}


/*
@-webkit-keyframes fadeInUp { 0% {
  opacity: 0;
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
  } 100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}
@keyframes fadeInUp { 0% {
  opacity: 0;
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}
*/

@-webkit-keyframes fadeInUp { 0% {
  opacity: 0;
 
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
} 100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}
@keyframes fadeInUp { 0% {
  opacity: 0;
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
} 100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}



@-webkit-keyframes fadeInLeft { 0% {
  opacity: 0;
  -webkit-transform: translateX(40px);
  transform: translateX(40px);
  } 100% {
  opacity: 1;
  -webkit-transform: translateX(0px);
  transform: translateX(0px);
}}
@keyframes fadeInLeft { 0% {
  opacity: 0;
  -webkit-transform: translateX(40px);
  transform: translateX(40px);
  }
  100% {
  opacity: 1;
  -webkit-transform: translateX(0px);
  transform: translateX(0px);
}}

@-webkit-keyframes fadeInRight { 0% {
  opacity: 0;
  -webkit-transform: translateX(-40px);
  transform: translateX(-40px);
  } 100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}
@keyframes fadeInRight { 0% {
  opacity: 0;
  -webkit-transform: translateX(-40px);
  transform: translateX(-40px);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}




@-webkit-keyframes flip180 { 0% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  } 100% {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}}
@keyframes flip180 { 0% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }
  100% {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}}








@-webkit-keyframes fadeInUpSD { 0% {
  opacity: 0;
  -webkit-transform: translateX(70px);
  transform: translateX(70px);
  } 100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}
@keyframes fadeInUpSD { 0% {
  opacity: 0;
  -webkit-transform: translateX(70px);
  transform: translateX(70px);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}

@-webkit-keyframes fadeInUp20 { 0% {
  opacity: 0;
  -webkit-transform: translateY(20px);
  transform: translateY(20px);
  } 100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}
@keyframes fadeInUp20 { 0% {
  opacity: 0;
  -webkit-transform: translateY(20px);
  transform: translateY(20px);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}

@-webkit-keyframes fadeInDown20 { 0% {
  opacity: 0;
  -webkit-transform: translateY(-20px);
  transform: translateY(-20px);
  } 100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}
@keyframes fadeInDown20 { 0% {
  opacity: 0;
  -webkit-transform: translateY(-20px);
  transform: translateY(-20px);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}


@-webkit-keyframes fadeInRight20 { 0% {
  opacity: 0;
  -webkit-transform: translateX(-10px);
  transform: translateX(-10px);
  } 100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}
@keyframes fadeInRight20 { 0% {
  opacity: 0;
  -webkit-transform: translateX(-10px);
  transform: translateX(-10px);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}}

@-webkit-keyframes fadeIn {0% {
  opacity: 0
  } 100% {
  opacity: 1 
}}
@keyframes fadeIn { 0% {
  opacity: 0
  } 100% {
  opacity: 1
}}


@-webkit-keyframes fadeIn65 {0% {
  opacity: 0
  } 100% {
  opacity: .35 
}}
@keyframes fadeIn65 { 0% {
  opacity: 0
  } 100% {
  opacity: .35
}}




@-webkit-keyframes fadeInZoom {0% {
  transform: scale(1);
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
  } 100% {
  transform: scale(1.1);
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
}}
@keyframes fadeInZoom { 0% {
  transform: scale(1);
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
  } 100% {
    transform: scale(1.1);
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
}}



@-webkit-keyframes shimmer {
  to {
      background-position-x: 0%
  }
}
@keyframes shimmer {
  to {
     background-position-x: 0%
  }
}





