@import url("../plugins/pace/minimal.css");  
@import url("../fonts/tabler-icons.min.css");
@import url("./public-sans.css");  
@import url("./style.css");
@import url("./landing.css");
header::after {background: linear-gradient(329.36deg, rgb(2 50 88) 14.79%, rgb(0 59 106 / 56%) 64.86%);}
.btn-sm{
    padding: 2px 5px;
    font-size: 12px;
}

.glow-on-hover {
        cursor: pointer;
        position: relative;
        z-index: 0;
        border-radius: 5px;
        color:#f7fbff;
        background: #0f84f1;
    }

.glow-on-hover:before {
    content: '';
    background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    position: absolute;
    top: -2px;
    left:-2px;
    background-size: 400%;
    z-index: -1;
    filter: blur(5px);
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    animation: glowing 20s linear infinite;
    opacity: 1;
    transition: opacity .3s ease-in-out;
    border-radius: 5px;
}


.glow-on-hover:after {
    z-index: -1;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #0f84f1;
    left: 0;
    top: 0;
    border-radius: 5px;
}

.glow-on-hover:hover:after{
   background: #ffffffbf;
   color:#0f84f1;
}

@keyframes glowing {
    0% { background-position: 0 0; }
    50% { background-position: 400% 0; }
    100% { background-position: 0 0; }
}



.gif-text {
  position: absolute;
  justify-self: center;
  top: 64%;
  -webkit-animation: fadeslideUp 12s infinite; /* Chrome, Opera 15+, Safari 5+ */
  -moz-animation: fadeslideUp 12s infinite; /* Fx 5+ */
  -o-animation: fadeslideUp 12s infinite; /* Opera 12+ */
  animation: fadeslideUp 12s infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

.gif-text h2 {
    font-size: medium;
    color: aliceblue;
}

#g2 {
    animation-delay: -9s;
    -webkit-animation-delay: -9s;
}

#g3 {
    animation-delay: -6s;
    -webkit-animation-delay: -6s;
}

#g4 {
    animation-delay: -3s;
    -webkit-animation-delay: -3s;
}

@-webkit-keyframes fadeslideUp {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-40%);
    }
    10% {
      opacity: 1;
      -webkit-transform: translateY(-50%);
    }
    20% {
      opacity: 1;
      -webkit-transform: translateY(-50%);
    }
    25% {
      opacity: 0;
      -webkit-transform: translateY(-60%);
    }
    100% {
      opacity: 0;
      -webkit-transform: translateY(-60%);
    }
}

@-moz-keyframes fadeslideUp {
    0% {
      opacity: 0;
      transform: translateY(-40%);
    }
    10% {
      opacity: 1;
      transform: translateY(-50%);
    }
    20% {
      opacity: 1;
      transform: translateY(-50%);
    }
    25% {
      opacity: 0;
      transform: translateY(-60%);
    }
    100% {
      opacity: 0;
      transform: translateY(-60%);
    }
}

@-o-keyframes fadeslideUp {
    0% {
      opacity: 0;
      transform: translateY(-40%);
    }
    10% {
      opacity: 1;
      transform: translateY(-50%);
    }
    20% {
      opacity: 1;
      transform: translateY(-50%);
    }
    25% {
      opacity: 0;
      transform: translateY(-60%);
    }
    100% {
      opacity: 0;
      transform: translateY(-60%);
    }
}

@keyframes fadeslideUp {
    0% {
      opacity: 0;
      transform: translateY(-40%); 
      -ms-transform: translateY(-40%);
    }
    10% {
      opacity: 1;
      transform: translateY(-50%); 
      -ms-transform: translateY(-50%);
    }
    20% {
      opacity: 1;
      transform: translateY(-50%); 
      -ms-transform: translateY(-50%);
    }
    25% {
      opacity: 0;
      transform: translateY(-60%);
      -ms-transform: translateY(-60%); 
    }
    100% {
      opacity: 0;
      transform: translateY(-60%);
      -ms-transform: translateY(-60%); 
    }
}
.logo-eb{filter: drop-shadow(1px 1px 8px black);}

.icon-home{
    gap:6px;
}
.icon-home img {
    width: 40px;
}

.icon-home img.first{border-radius: 18px 0 0 18px;}
.icon-home img.last{border-radius: 0 18px 18px 0;}

@media (max-width: 768px) {
    .sub-title{
        width: 95%;
    }

    .gif-text {
        top: 68%;
    }
    .gif-text h2{
        font-size: 14px;
    }
    .container{padding: 20px;}
}