/**/
.hide-on-biggest { display: none;}
.hide-on-small { display: block;}

/* <===== vnt-menu-fixed =====> */
#vnt-menu-fixed{
  position: fixed;
  right: 10px;
  bottom: 20%;
  /*top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);*/  
  z-index: 9999;
}
#vnt-menu-fixed>ul>li{
  position: relative;
  margin-bottom: 20px;
}
#vnt-menu-fixed>ul>li:last-child{
  border-bottom: none;
}
#vnt-menu-fixed>ul>li>.txt{
  position: absolute;
  white-space: nowrap;
  color:#ffffff;
  font-size: 14px;
  line-height: 20px;
  padding: 2px 0px;
  font-weight: 600;
  right:100%;
  margin-right: 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);

  background: #2469b9;
  overflow: hidden;
  border-radius: 5px;
  -webkit-transition: all 0.1s ease;
  -o-transition: all 0.1s ease;
  transition: all 0.1s ease;
  width: 0;
}
#vnt-menu-fixed>ul>li>.txt a{
  color:#fff;
}
#vnt-menu-fixed>ul>li:hover>.txt{
  width:auto;
  overflow: visible;
  padding: 5px 20px;
}
#vnt-menu-fixed>ul>li>.txt:before{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  left:100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  border-left: solid 5px #2469b9;
  border-top:solid 5px transparent;
  border-bottom:solid 5px transparent;
  display: none;
}

#vnt-menu-fixed>ul>li:hover>.txt:before{
    display: block;
}

 


#vnt-menu-fixed>ul>li>a{
  width: 54px;
  height: 54px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  justify-content: center;
  background-color: #ffffff;
  border-radius: 100%;
  color: #fff;
  font-size: 15px;
  margin-left: auto;
}

  
#vnt-menu-fixed>ul>li>a span.icon {
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15), 0 4px 15px rgba(0, 0, 0, 0.13);  
  border: 2px solid #fff;
  border-radius: 50%;
  text-align: center; 
}

#vnt-menu-fixed>ul>li>a span.icon img{
   max-width: 100%;
   max-height: 100%;
}


#vnt-menu-fixed>ul>li>a{
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  -o-animation-duration: 1.5s;
  -ms-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  /* animation-name: tada; */
}


#vnt-menu-fixed>ul>li.fxphone {
   
}

#vnt-menu-fixed>ul>li.fxmess {
   
}

#vnt-menu-fixed>ul>li.fxzalo {
   
}

#vnt-menu-fixed>ul>li.fxmap {
   
}



/*===============*/
#vnt-menu-fixed ul li.go_top a i{
  -webkit-animation: bouncezz 1.2s 500ms infinite;
  -o-animation: bouncezz 1.2s 500ms infinite;
  animation: bouncezz 1.2s 500ms infinite;
}


.phone-toa{
  position: relative;
}
.phone-toa::before{
  content: '';
  top: -15px;
  left: -15px;
  right: -15px;
  bottom: -15px;
  position: absolute;
  background-color: transparent;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  border: 20px solid #fff;
  opacity: 0.5;
  -webkit-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
  -moz-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
  -ms-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
  -o-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
  animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.phone-rung{
  display: inline-block;
  -webkit-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
  -moz-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
  -ms-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
  -o-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
  animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}


 
/* <===== vnt-menu-fixed =====> */

@keyframes tada {
  0% { transform: scale3d(1,1,1);}
  10%, 20% { transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);}
  30%, 50%, 70%, 90% { transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);}
  40%, 60%, 80% { transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);}
  100% { transform: scale3d(1,1,1);}
}
 
@keyframes bouncezz {
  0%, 20%, 50%, 80%, 100% {transform: translateY(0%);}
  40% {transform: translateY(-35%);}
  60% {transform: translateY(-25%);}
}
@-webkit-keyframes bouncezz {
  0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0%);}
  40% {-webkit-transform: translateY(-35%);}
  60% {-webkit-transform: translateY(-25%);}
}
@-moz-keyframes bouncezz {
  0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0%);}
  40% {-moz-transform: translateY(-35%);}
  60% {-moz-transform: translateY(-25%);}
}
@-o-keyframes bouncezz {
  0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0%);}
  40% {-o-transform: translateY(-35%);}
  60% {-o-transform: translateY(-25%);}
}


@-moz-keyframes quick-alo-circle-img-anim {
  0% {
      transform: rotate(0deg) scale(1) skew(1deg)
  }
  10% {
      -moz-transform: rotate(-25deg) scale(1) skew(1deg)
  }
  20% {
      -moz-transform: rotate(25deg) scale(1) skew(1deg)
  }
  30% {
      -moz-transform: rotate(-25deg) scale(1) skew(1deg)
  }
  40% {
      -moz-transform: rotate(25deg) scale(1) skew(1deg)
  }
  50% {
      -moz-transform: rotate(0deg) scale(1) skew(1deg)
  }
  100% {
      -moz-transform: rotate(0deg) scale(1) skew(1deg)
  }
}
@-webkit-keyframes quick-alo-circle-img-anim {
  0% {
      -webkit-transform: rotate(0deg) scale(1) skew(1deg)
  }
  10% {
      -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
  }
  20% {
      -webkit-transform: rotate(25deg) scale(1) skew(1deg)
  }
  30% {
      -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
  }
  40% {
      -webkit-transform: rotate(25deg) scale(1) skew(1deg)
  }
  50% {
      -webkit-transform: rotate(0deg) scale(1) skew(1deg)
  }
  100% {
      -webkit-transform: rotate(0deg) scale(1) skew(1deg)
  }
}
@-o-keyframes quick-alo-circle-img-anim {
  0% {
      -o-transform: rotate(0deg) scale(1) skew(1deg)
  }
  10% {
      -o-transform: rotate(-25deg) scale(1) skew(1deg)
  }
  20% {
      -o-transform: rotate(25deg) scale(1) skew(1deg)
  }
  30% {
      -o-transform: rotate(-25deg) scale(1) skew(1deg)
  }
  40% {
      -o-transform: rotate(25deg) scale(1) skew(1deg)
  }
  50% {
      -o-transform: rotate(0deg) scale(1) skew(1deg)
  }
  100% {
      -o-transform: rotate(0deg) scale(1) skew(1deg)
  }
}
@keyframes quick-alo-circle-img-anim {
  0% {
      transform: rotate(0deg) scale(1) skew(1deg)
  }
  10% {
      transform: rotate(-25deg) scale(1) skew(1deg)
  }
  20% {
      transform: rotate(25deg) scale(1) skew(1deg)
  }
  30% {
      transform: rotate(-25deg) scale(1) skew(1deg)
  }
  40% {
      transform: rotate(25deg) scale(1) skew(1deg)
  }
  50% {
      transform: rotate(0deg) scale(1) skew(1deg)
  }
  100% {
      transform: rotate(0deg) scale(1) skew(1deg)
  }
}
@-moz-keyframes quick-alo-circle-fill-anim {
  0% {
      transform: rotate(0deg) scale(.7) skew(1deg);
      opacity: .2
  }
  50% {
      transform: rotate(0deg) scale(1) skew(1deg);
      opacity: .2
  }
  100% {
      transform: rotate(0deg) scale(.7) skew(1deg);
      opacity: .2
  }
}
@-webkit-keyframes quick-alo-circle-fill-anim {
  0% {
      transform: rotate(0deg) scale(.7) skew(1deg);
      opacity: .2
  }
  50% {
      transform: rotate(0deg) scale(1) skew(1deg);
      opacity: .2
  }
  100% {
      transform: rotate(0deg) scale(.7) skew(1deg);
      opacity: .2
  }
} 
@-o-keyframes quick-alo-circle-fill-anim {
  0% {
      transform: rotate(0deg) scale(.7) skew(1deg);
      opacity: .2
  }
  50% {
      transform: rotate(0deg) scale(1) skew(1deg);
      opacity: .2
  }
  100% {
      transform: rotate(0deg) scale(.7) skew(1deg);
      opacity: .2
  }
}
@keyframes quick-alo-circle-fill-anim {
  0% {
      transform: rotate(0deg) scale(.7) skew(1deg);
      opacity: .2
  }
  50% {
      transform: rotate(0deg) scale(1) skew(1deg);
      opacity: .2
  }
  100% {
      transform: rotate(0deg) scale(.7) skew(1deg);
      opacity: .2
  }
}
/*  */
@-moz-keyframes quick-alo-circle-anim {
  0% {
  transform: rotate(0deg) scale(1) skew(1deg);
  opacity: .1
}
30% {
  transform: rotate(0deg) scale(1.1) skew(1deg);
  opacity: .3
}
100% {
  transform: rotate(0deg) scale(1.2) skew(1deg);
  opacity: .1
}
}
@-webkit-keyframes quick-alo-circle-anim {
  0% {
  transform: rotate(0deg) scale(1) skew(1deg);
  opacity: .1
}
30% {
  transform: rotate(0deg) scale(1.1) skew(1deg);
  opacity: .3
}
100% {
  transform: rotate(0deg) scale(1.2) skew(1deg);
  opacity: .1
}
}
@-o-keyframes quick-alo-circle-anim {
0% {
  transform: rotate(0deg) scale(1) skew(1deg);
  opacity: .1
}
30% {
  transform: rotate(0deg) scale(1.1) skew(1deg);
  opacity: .3
}
100% {
  transform: rotate(0deg) scale(1.2) skew(1deg);
  opacity: .1
}
}
@keyframes quick-alo-circle-anim {
0% {
  transform: rotate(0deg) scale(1) skew(1deg);
  opacity: .1
}
30% {
  transform: rotate(0deg) scale(1.1) skew(1deg);
  opacity: .3
}
100% {
  transform: rotate(0deg) scale(1.2) skew(1deg);
  opacity: .1
}
}



@media screen and (max-width: 991px) {
  .hide-on-biggest {  display: block; }
  .hide-on-small {display:none;} 

}