#gender {
			background: #fff;
			padding:5px;
			margin: 5px 5px 5px 0;
			border:0;
			box-shadow:0 0 15px 4px rgba(0,0,0,0.06);
			border-radius:2px;
			text-align: center;
		}
		.radio-container label {
			background: transparent;
			border: 1px solid transparent;
			border-radius: 2px;
			display: inline-block;
			height: 26px;
			line-height: 26px;
			margin: 0;
			padding: 0;
			text-align: center;
			transition: .2s all ease-in-out;
			width: 110px;
		}
		.radio-container input[type="radio"] {
			display: none;
		}
		.radio-container input[type="radio"]:checked + label {
			background: #35cd3a;
			border: 1px solid #35cd3a;
			color: #ffffff;
		}
.btn_pay {
	background: #8f8f8f;
	padding: 10px 10px;
	color: #fff;
}
.btn_pay:hover {
	background: #ffa534;
}
.btn_pay:active {
	background: #35cd3a;
}
#payment_button {
	cursor: pointer;
}
.swal-wide{
    width:850px !important;
}
.warning {
	border: 1px solid red !important;
}
.loader {
  width: 48px;
  height: 48px;
  border: 3px solid #efefee;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}
.loader::after {
  content: '';  
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 3px solid;
  border-color: #5481dc transparent;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.pin-field-container {
  display: grid;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  justify-content: center;
  margin: 4rem 0;
}

.pin-field {
  background-color: rgb(248, 249, 250);
  border: 1px solid rgb(204, 204, 204);
  border-radius: 0.3rem;
  font-size: 2rem;
  margin: 0.25rem;
  height: 3.5rem;
  outline: none;
  text-align: center;
  transition-duration: 250ms;
  transition-property: background, color, border, box-shadow, transform;
  width: 3rem;
}

.pin-field:focus {
  border-color: rgb(0, 123, 255);
  outline: none;
  transform: scale(1.05);
}

.pin-field:invalid {
  animation: shake 3 linear 75ms;
  border-color: rgb(220, 53, 69);
  box-shadow: 0 0 0.25rem rgba(220, 53, 69, 0.5);
}

swd-pin-field[completed] .pin-field {
  border-color: rgb(40, 167, 69);
  background-color: rgba(40, 167, 69, 0.1);
}

.pin-field:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

@keyframes shake {
  from {
    transform: scale(1.05) translateY(-5%);
  }
  to {
    transform: scale(1.05) translateY(5%);
  }
}