Template:Home/Login/styles.css

.ButtonGradient {
            padding: 10px 15px;
            transition: 0.5s;
            background-size: 200% auto;
            color: white;            
            box-shadow: 0 3px 6px rgba(0,0,0,0.04),0 3px 6px rgba(0,0,0,0.0575);
            border-radius: 8px;
            display: block;
            text-decoration: none;
}
.ButtonGradient-container {
            display: block;
            white-space: nowrap;
}
.ButtonGradient-container a:hover{
            text-decoration: none;
}
.ButtonGradient-container a:active{
            text-decoration: none;
}
.large {padding: 20px 15px;}

          .login {
            background-image: linear-gradient(to right, #1A2980 0%, #26D0CE  51%, #1A2980  100%);
            text-decoration: none;
          }

.skin-citizen-dark .login {
  background-image: linear-gradient(to right,#1B1658 0%,#24C6C5 51%,#1B1658 100%) !important;
}
          .login:hover {
            background-position: right center; /* change the direction of the change here */
            color: #fff;
            text-decoration: none;
            text-decoration: none;
          }
          .request {
            background-image: linear-gradient(to right, #FF8008 0%, #FFC837  51%, #FF8008  100%);
            text-decoration: none;
          }
.skin-citizen-dark .request {
  background-image: linear-gradient(to right,#BC2B09 0%,#EBBD46 51%,#BC2B09 100%) !important;
}
          .request:hover {
            background-position: right center; /* change the direction of the change here */
            text-decoration: none;
            color: #fff;
            text-decoration: none;
          }

          .blue {
            background-image: linear-gradient(to right,#3968c4 0%,#5390d7 51%,#3968c4 100%);
            text-decoration: none;
          }
          .lime {
            background-image: linear-gradient(to right,#a8e94a 0%,#d4ff5d 51%,#a8e94a 100%);
            text-decoration: none;
          }
          .black {
            background-image: linear-gradient(to right, #283048 0%, #859398  51%, #283048  100%);
            text-decoration: none;
          }
          .default {
            background-image: linear-gradient(to right,#3968c4 0%,#5390d7 51%,#3968c4 100%);
            text-decoration: none;
          }
.skin-citizen-dark .black,
.skin-citizen-dark .mw-parser-output .black {
  background-image: linear-gradient(to right, #757F9A 0%, #D7DDE8  51%, #757F9A  100%) !important;
}
          .black:hover,.default:hover,.blue:hover,.lime:hover {
            background-position: right center; /* change the direction of the change here */
            text-decoration: none;
            color: #fff;
            text-decoration: none;
          }

@media (max-width: 717px) {
  #home-nav {
  display: inline;
  }
  .ButtonGradient-container {
  margin-top: 0.5rem;
  }
}