.main-div {
  background: transparent;
  background-image: linear-gradient(to bottom, #111010, #111010),
    linear-gradient(to bottom, #171717, #333232);
  background-clip: padding-box, border-box;
  background-origin: border-box;
  border: 2px solid transparent;
  border-radius: 6px;
}

.main-div-padding {
    padding: 0.5rem 1rem;
    background-image: linear-gradient(to bottom, #111010, #111010),
      linear-gradient(to bottom, #171717, #333232);
    background-clip: padding-box, border-box;
    background-origin: border-box;
    border: 2px solid transparent;
    border-radius: 6px;
}

.main-div-padding-1  {
    padding: 0.5rem 1rem;
    background-image: linear-gradient(to right, #FFDA44 -25%, #111010 15%),
                      linear-gradient(0deg, #fdd843, #333232);
    background-clip: padding-box, border-box, padding-box;
    background-origin: border-box;
    border: 2px solid transparent;
    border-radius: 6px;
    height: 56px !important;
}

.main-div-padding-2 {
    padding: 0.5rem 1rem;
    background-image: linear-gradient(to right, #4d4b4b -10%, #111010 15%),
                      linear-gradient(0deg, #737070, #333232);
    background-clip: padding-box, border-box, padding-box;
    background-origin: border-box;
    border: 2px solid transparent;
    border-radius: 6px;
    height: 56px !important;
}

.main-div-padding-3 {
    padding: 0.5rem 1rem;
    background-image: linear-gradient(to right, #8e6956 -15%, #111010 15%),
                      linear-gradient(0deg, #daa184, #333232);
    background-clip: padding-box, border-box, padding-box;
    background-origin: border-box;
    border: 2px solid transparent;
    border-radius: 6px;
    height: 56px !important;
  }
  

.custom-grey-border {
  border-image: url("https://cdn.warbandits.gg/web/assets/grey_gradient_border.svg") 8 / 8px stretch;
  background-repeat: no-repeat;
  border-radius: 8px;
}

.custom-grey-border-arrows {
    border-image: url("https://cdn.warbandits.gg/web/assets/grey_gradient_border_arrows.svg") 8 / 8px stretch;
    background-repeat: no-repeat;
    border-radius: 8px;
}
  
.red-circ-gradient {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at left bottom,
    #e03b33 0%,
    transparent 50%
  );
  opacity: 25%;
  border-radius: 4px;
}

.blue-circ-gradient {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at left bottom,
    #0052b4 0%,
    transparent 50%
  );
  opacity: 35%;
  border-radius: 10px;
}

.red-circ-gradient-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at right bottom,
    #e03b33 0%,
    transparent 50%
  );
  opacity: 25%;
  border-radius: 4px;
}

.button-active-red {
    border-image: url('https://cdn.warbandits.gg/web/assets/red_gradient_border.svg') 8 / 8px stretch; 
    background-repeat: no-repeat;
}

.red-grey-gradient-border {
    border-image: url('https://cdn.warbandits.gg/web/assets/red_gradient_border_arrows.svg') 8 / 8px stretch;
    background-repeat: no-repeat;
    border-radius: 8px;
}

.yellow-gradient-border {
    border-image: url('https://cdn.warbandits.gg/web/assets/yellow_gradient_border_arrows.svg') 8 / 8px stretch;
    background-repeat: no-repeat;
    border-radius: 8px;
}

.green-circ-gradient-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at right bottom,
    #60E033 0%,
    transparent 50%
  );
  opacity: 25%;
  border-radius: 10px;
}

.blue-circ-gradient {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(
      circle at left bottom,
      #0052b4 0%,
      transparent 50%
    );
    opacity: 35%;
    border-radius: 10px;
}

.yellow-circ-gradient {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at left bottom,
    #ffda44 0%,
    transparent 30%
  );
  opacity: 10%;
}

.yellow-circ-gradient-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at right bottom,
    #ffda44 0%,
    transparent 30%
  );
  opacity: 10%;
}

.yellow-button-gradient-fill {
  background: linear-gradient(0deg, #716125 0%, transparent 100%);
}

.red-button-gradient-fill {
  background: linear-gradient(0deg, #5a201e 0%, transparent 100%);
  border-radius: 6px
}

.red-button-gradient-fill-no-hover {
    background: linear-gradient(0deg, #5a201e 0%, transparent 100%);
    border-radius: 6px
}

.grey-circ-gradient-top-left {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle at left top, #4d4b4b 0%, transparent 50%);
  opacity: 10%;
}

.grey-circ-gradient-top-left-global-stats {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at left top, #4d4b4b 0%, transparent 50%);
    opacity: 20%;
  }

.grey-circ-gradient-top-left-global-stats {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at left top, #4d4b4b 0%, transparent 50%);
    opacity: 20%;
  }

.fit-content {
  @media screen and (min-width: 2000px) {
    margin-bottom: 10px;
  }

  @media screen and (max-width: 1999px) {
    margin-bottom: max(calc(100vh - 845px - 10px), 100px);
  }
}

.server-select-modal {
  background-color: rgba(19,19,19,0.7)
}

.scale-self-160 {
  --tw-scale-x: 1.6;
  --tw-scale-y: 1.6;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-self-120 {
  --tw-scale-x: 1.2;
  --tw-scale-y: 1.2;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-self-100 {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-self-80 {
  --tw-scale-x: 0.8;
  --tw-scale-y: 0.8;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-self-90-80 {
  --tw-scale-x: 0.9;
  --tw-scale-y: 0.8;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.filter-not-active {
  filter: grayscale(100%);
}

.filter-active {
  filter: none;
}

.servers {
  background-color: #111010;
  border-radius: 8px;
}

.red-button-gradient-fill:hover {
  background: linear-gradient(0deg, #c43b3a 0%, transparent 100%);
}

.yellow-button-gradient-fill:hover {
    background: linear-gradient(0deg, #ffda44 0%, transparent 100%);
}

.black-white {
  filter: grayscale(100%);
}

.server-select-modal {
  background-color: rgba(19,19,19,0.7)
}

.custom-grey-border {
  border-image: url("https://cdn.warbandits.gg/web/assets/grey_gradient_border.svg") 8 / 8px stretch;
  background-repeat: no-repeat;
  border-radius: 8px;
}

::-webkit-scrollbar {
  width: 6px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background: #e03b33;
}

.black-background-grey-border {
  background: transparent;
  background-image: linear-gradient(90deg, #111010, #111010),
    linear-gradient(45deg, #171717, #333232);
  background-clip: padding-box, border-box;
  background-origin: border-box;
  border: 2px solid transparent;
  border-radius: 6px;
}
.member-limit-select:hover option,
.test option {
  border-radius: 3px;
  padding: 3px;
  background-color: #201f1f;
  border-color: transparent;
}
.member-limit-select {
  border-radius: 3px;
  background-color: #201f1f;
  border-color: transparent;
}

.member-limit-select:focus {
  outline-width: 0;
}

.policy-border {
    border-left: 1px solid #BB2C2C;
}