/*-- Style - Pack
  author: @mate.tosapon
--*/
/*-- Style - Right Bar
  author: @mate.tosapon
--*/
/*-- Style - Global
  author: @mate.tosapon
--*/
/*-- Style - Button
  author: @mate.tosapon
--*/
/*-- Style - Login
  author: @mate.tosapon
--*/
/*-- Style - Header
  author: @mate.tosapon
--*/
body.admin-bar .site-header {
  margin-top: 32px;
}
/*-- Style - Content
  author: @mate.tosapon
--*/
h1.title {
  margin-top: 40px;
}
.button-section {
  margin: 80px auto 60px;
}
.button-section .btn {
  color: white;
  border-radius: 5px;
  transition: 0.5s all;
}
.button-section .btn:hover {
  transform: scale(1.05);
}
.button-section .btn:active {
  transform: scale(1);
}
.button-section .animated-btn {
  background: linear-gradient(140deg, rgba(220, 57, 110, 0.1), #7d213e);
  color: #1b1b1b !important;
  display: inline-block;
  transform: translate(0%, 0%);
  overflow: hidden;
  text-align: center;
  border: 0;
  text-transform: uppercase;
  text-decoration: none;
  -webkit-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 6px red;
  border-radius: 5px;
  padding: 5px 10px;
}
.button-section .animated-btn span {
  position: absolute;
}
.button-section .animated-btn span:nth-child(1) {
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: -webkit-gradient(linear, right top, left top, from(rgba(26, 43, 8, 0)), to(#ffffff));
  background: linear-gradient(to left, rgba(26, 43, 8, 0), #ffffff);
  -webkit-animation: 2s animateTop linear infinite;
  animation: 2s animateTop linear infinite;
}
.button-section .animated-btn span:nth-child(2) {
  top: 0;
  right: 0;
  height: 100%;
  width: 2px;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(26, 43, 8, 0)), to(#ffffff));
  background: linear-gradient(to top, rgba(26, 43, 8, 0), #ffffff);
  -webkit-animation: 2s animateRight linear -1s infinite;
  animation: 2s animateRight linear -1s infinite;
}
.button-section .animated-btn span:nth-child(3) {
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: -webkit-gradient(linear, left top, right top, from(rgba(26, 43, 8, 0)), to(#ffffff));
  background: linear-gradient(to right, rgba(26, 43, 8, 0), #ffffff);
  -webkit-animation: 2s animateBottom linear infinite;
  animation: 2s animateBottom linear infinite;
}
.button-section .animated-btn span:nth-child(4) {
  top: 0;
  left: 0;
  height: 100%;
  width: 2px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(26, 43, 8, 0)), to(#ffffff));
  background: linear-gradient(to bottom, rgba(26, 43, 8, 0), #ffffff);
  -webkit-animation: 2s animateLeft linear -1s infinite;
  animation: 2s animateLeft linear -1s infinite;
}
.button-section .btn-pink {
  background: #ff1772;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border: 1px solid #ffffff;
  border-radius: 8px;
  margin-right: 0.5rem;
  animation: neon-play 1.5s ease infinite;
  will-change: transform;
  transition: 0.4s all;
  display: flex;
  justify-content: center;
  gap: 5px;
  align-items: center;
  padding: 15px;
}
.button-section .btn-pink:active {
  background: linear-gradient(175.73deg, rgba(235, 49, 148, 0.8) 3.24%, rgba(244, 115, 151, 0.8) 96.33%);
}
.button-section .btn-sign-line {
  background: linear-gradient(#37cb63 0%, #1ea546 59.61%, #0c8932 100%);
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border: 1px solid #24e25d;
  border-radius: 8px;
  box-shadow: 0px 0px 15px 2px #1dc750;
  transition: 0.4s all;
}
.button-section .btn-sign-line:active {
  background: linear-gradient(181.12deg, rgba(15, 160, 76, 0.8) 11.36%, rgba(45, 215, 161, 0.8) 122.21%);
}
@keyframes neon-play {
  0% {
    box-shadow: 0 0 3px #fff, 0 0 6px #fff, 0 0 8px #fff, 0 0 10px #fff, 0 0 20px #ff00a7, 0 0 30px #ff00a7, 0 0 40px #ff00a7, 0 0 50px #ff00a7;
  }
  50% {
    box-shadow: 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 5px #ff00a7, 0 0 10px #ff00a7, 0 0 20px #ff00a7, 0 0 30px #ff00a7;
  }
  to {
    box-shadow: 0 0 3px #fff, 0 0 6px #fff, 0 0 8px #fff, 0 0 10px #fff, 0 0 20px #ff00a7, 0 0 30px #ff00a7, 0 0 40px #ff00a7, 0 0 50px #ff00a7;
  }
}
@keyframes animateTop {
  0% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}
@keyframes animateRight {
  0% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
}
@keyframes animateBottom {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
}
@keyframes animateLeft {
  0% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
}
/*-- Style - Right Bar
  author: @mate.tosapon
--*/
/*-- Style - Footer
  author: @mate.tosapon
--*/
/*-- Style - Responsive
  author: @mate.tosapon
--*/