/* Button Styling */
.top-btn {
    all: unset;
    font-size: 1.5rem; 
    position: fixed;
    right: 20px;
    bottom: 20px;
    cursor: pointer;
    transform: scale(1.8);
    opacity: 0;
    transition: opacity 0.3s, transform 0.3s; /* Transition specific properties */
  }
  
  .up_btn {
    color: #0371F1;
    transition: transform 0.3s;
  }
  
  .up_btn:hover {
    transform: scale(0.6);
  }
  /* top button start */

  button.back-to-top{
  margin: 0 !important;
  padding: 0 !important;
  background: #fff;
	height: 0px;
  width: 0px;
  overflow: hidden;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
  color: transparent;
	clear: both;
  visibility: hidden;
  position: fixed;
  cursor: pointer;
  display: block;
  border: none;
  right: 50px;
	bottom: 75px;
  font-size: 0px;
  outline: 0 !important;
  z-index: 99;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}
button.back-to-top:hover,
button.back-to-top:active,
button.back-to-top:focus{
  outline: 0 !important;
}
button.back-to-top::before,
button.back-to-top::after {
  content: "";
    display: block;
    vertical-align: middle;
    border-bottom: solid 10px #00ab6c;
    border-left: solid 10px transparent;
    line-height: 0;
    border-right: solid 10px transparent;
    height: 0;
    margin: 18px auto 0;
    width: 0;
  border-radius:20px;
  visibility: hidden;
}
button.back-to-top.show::after,
button.back-to-top.show::before{
  visibility: visible;
}
button.back-to-top::after {
  border-bottom-color:#fff;
      position: relative;
  top:-24px;
}
button.back-to-top.show {
  display: block;
  background: #fff;
  color: #00ab6c;
  font-size: 25px;
  right: 25px;
	bottom: 50px;
  height: 50px;
  width: 50px;
  visibility: visible;
	box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
}
button.back-to-top.show:active {
  box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.25);
}

  /* top button end */
  
  /* Animation Classes */
  .animate-on-left,
  .animate-on-right,
  .animate-on-down,
  .animate-on-up,
  .animate-Fadein,
  .animate-Fadeout {
    opacity: 0 !important;
    filter: blur(5px) !important;
    transition: transform 1.0s ease-out, opacity 0.6s ease-out, filter 0.6s ease-out !important;
    transition-delay: 0.2s !important;
  }
   .animate-Fadeout {
    opacity: 0;
    transform: translateY(30px) scale(0) !important;
  }
  
  /* Specific Transformations */
  .animate-on-left {
    transform: translateX(-50px) !important;
  }
  
  .animate-on-right {
    transform: translateX(50px) !important;
  }
  
  .animate-on-down {
    transform: translateY(50px) !important;
  }
  
  .animate-on-up {
    transform: translateY(-50px) !important;
  }
  
  .animate-Fadein {
    transform: scale(1.2) !important;
    filter: blur(8px) !important;
  }
  
  .animate-Fadeout {
    transform: scale(0) !important;
  }
  
  /* Delay Classes */
  .one {
    transition-delay: 0.20s !important;
  }
  
  .two {
    transition-delay: 0.40s !important;
  }
  
  .three {
    transition-delay: 0.60s !important;
  }
  
  .four {
    transition-delay: 0.80s !important;
  }
  
  .five {
    transition-delay: 1s !important;
  }
  
  .six {
    transition-delay: 1.20s !important;
  }
  .seven{
    transition-delay: 1.40s !important;
  }
  
  /* Animate Class */
  .animate {
    opacity: 1 !important;
    filter: blur(0) !important;
    transform: translate(0, 0) scale(1) !important;
  }
  
  /* Additional Styles */
  .auto_countingpage {
    background: #0d1321 !important;
  }


  /* Animation Classes */
@media (max-width: 575.98px) {
  .animate-on-left,
  .animate-on-right,
  .animate-on-down,
  .animate-on-up,
  .animate-Fadein,
  .animate-Fadeout {
    opacity: 0 !important;
    filter: blur(4px) !important;
    transition: transform 0.8s ease-out, opacity 0.5s ease-out, filter 0.5s ease-out !important;
    transition-delay: 0.1s !important;
  }
  
  /* Specific Transformations */
  .animate-on-left {
    transform: translateX(-5px) !important;
  }
  
  .animate-on-right {
    transform: translateX(5px) !important;
  }
  
  .animate-on-down {
    transform: translateY(5px) !important;
  }
  
  .animate-on-up {
    transform: translateY(-5px) !important;
  }
  
  .animate-Fadein {
    transform: scale(1.1) !important;
    filter: blur(6px) !important;
  }
  
  .animate-Fadeout {
    transform: scale(0.9) !important;
  }
  
  /* Delay Classes */
  .one {
    transition-delay: 0.1s !important;
  }
  
  .two {
    transition-delay: 0.15s !important;
  }
  
  .three {
    transition-delay: 0.2s !important;
  }
  
  .four {
    transition-delay: 0.25s !important;
  }
  
  .five {
    transition-delay: 1.2s !important;
  }
  
  .six {
    transition-delay: 1.5s !important;
  }
  
  /* Animate Class */
  .animate {
    opacity: 1 !important;
    filter: blur(0) !important;
    transform: translate(0, 0) scale(1) !important;
  }
  
  /* Additional Styles */
  .auto_countingpage {
    background: #0d1321 !important;
  }
}

  





