/* Spinner, loader, ajax_load, ajax_loader */
.spinner-container{position:absolute; width:100%; height:100%; z-index:999; background:#fff;}
.loader, .loader:before, .loader:after{border-radius:50% !important;}
.loader:before, .loader:after{position:absolute; content: '';}
.loader:before{width:5.2em; height:10.2em; background: #ffffff; border-radius:10.2em 0 0 10.2em !important; top:-0.1em; left:-0.1em; -webkit-transform-origin:5.2em 5.1em; transform-origin:5.2em 5.1em; -webkit-animation:load2 2s infinite ease 1.5s; animation:load2 2s infinite ease 1.5s;}
.loader{font-size:11px; text-indent:-99999em; margin:55px auto; position:relative; width:10em; height:10em; box-shadow:inset 0 0 0 1em #A5027C; -webkit-transform:translateZ(0); -ms-transform:translateZ(0); transform:translateZ(0);}
.loader:after{width:5.2em; height:10.2em; background:#fff; border-radius:0 10.2em 10.2em 0 !important; top:-0.1em; left:5.1em; -webkit-transform-origin:0px 5.1em; transform-origin:0px 5.1em; -webkit-animation:load2 2s infinite ease; animation:load2 2s infinite ease;}
@-webkit-keyframes load2{0%{ -webkit-transform:rotate(0deg); transform:rotate(0deg);} 100%{ -webkit-transform:rotate(360deg); transform:rotate(360deg);}}
@keyframes load2 {0%{ -webkit-transform:rotate(0deg); transform:rotate(0deg);} 100% { -webkit-transform:rotate(360deg); transform:rotate(360deg);}}
/* Fine Spinner, loader, ajax_load, ajax_loader */

.badge{border:1px solid #ccc; box-shadow: 0 1px 1px #ccc; margin-bottom:1.5em; position: relative; min-height:200px;}
.badge > div:first-child{padding:10px; position: relative; background:#fff; min-height:180px;}
.badge > div:first-child div{font-size:15px; padding:5px 0;}
.badge > div:first-child div > span{font-weight:bold;}
.badge h3{position: absolute; bottom:0; right:0; padding:0px 30px; font-size:70px; color:#333; margin:.4em 0}
.badge h3 strong{font-size:30px; color:#999; padding: 0 10px;}

@media ( min-width : 768px ) {
    .badge.span_8:first-child {width: calc(49.0% - 6px);}
    .badge {margin-bottom:0em;}
}

.capitalize{text-transform:capitalize}

.header{border-bottom:1px solid #ccc;}


/* FRONTEND */
.domain_search_box{border:0px solid #d6d6d6; box-shadow: 0px 1px 0px #ccc; background: #f1f1f1;}
.domain_search_box input[name="domain_search"]{width: calc(100% - 240px); border: 0px; background-color: #f1f1f1; padding: 20px 10px; color: #ccc; font-size: 30px; font-style:  italic;}
.domain_search_box select{width:100px; padding: 10px; margin-right: 10px; border: 0px; background: none;}
.domain_search_box button{position: absolute; height: 86px; width: 130px; border: none; background: dodgerblue;}

.domain_search_results{}
.domain_search_results div{padding:10px; font-size:20px; background:#f3f3f3; border-top:1px outset #dcdcdc;}
.domain_search_results div i{margin-top:5px;}
.domain_search_results div i.fa-times{color:#9c0f15;}
.domain_search_results div i.fa-check{color:#007838;}

/* stripe */
/* Variables */
* {
  box-sizing: border-box;
}

.container.signup > .custom-logo-link{position:absolute; width:100px; height:auto; top:-60px; left:55px;}

form#payment-form, .final-message {
  /* width: 30vw;
  min-width: 500px; */
  align-self: center;
  box-shadow: 0px 0px 0px 0.5px rgba(50, 50, 93, 0.1),
    0px 2px 5px 0px rgba(50, 50, 93, 0.1), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.07);
  border-radius: 7px;
  padding: 40px;
  background:#fff;
}

form#payment-form input, form#payment-form button{font-family:sans-serif; font-size:14px;}
form#payment-form input[type="datetime-local"]{font-size:12px;}
form#payment-form input::placeholder, .select2-selection__placeholder{font-size:12px;}
form#payment-form legend{padding:15px; border: 1px solid #ccc;}
form#payment-form label.radio-label{padding:2px 15px; color:#999; font-size:12px;}
form#payment-form label.radio-label input{vertical-align:middle;}
form#payment-form .input-group-text{padding: -0rem .75rem;}
select:invalid{font-size:12px !important; color:#6c757d; padding-left:0.75rem !important;}
select[value="null"]{font-size:12px !important; color:#6c757d; padding-left:0.5rem !important;}
button#submit-button, button#submit-proceed{border-radius:0 0 4px 4px;}

.select2-container--default .select2-selection--single {height:auto !important;}
.select2-container--default .select2-selection--single .select2-selection__rendered {color: #444; line-height: 20px !important; width:100%; height:calc(1.5em + 0.5rem + 3px); padding:0.375rem 0.75rem;}
.select2-container--default .select2-selection--single .select2-selection__arrow{height:35px !important;}

a#redirect-button{
	border-radius:4px;
	background: #5469d4;
	color: #ffffff;
	font-family: Arial, sans-serif;
	border: 0;
	padding: 12px 16px;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	display: block;
	transition: all 0.2s ease;
	box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07);
	width: 100%;
	text-align:center;
}

.result-message {
  line-height: 22px;
  font-size: 16px;
}

.result-message a {
  color: rgb(89, 111, 214);
  font-weight: 600;
  text-decoration: none;
}

.hidden {
  display: none;
}

#card-error {
  color: rgb(105, 115, 134);
  text-align: left;
  font-size: 13px;
  line-height: 17px;
  margin-top: 12px;
}

#card-element {
  border-radius: 4px 4px 0 0 ;
  padding: 12px;
  border: 1px solid rgba(50, 50, 93, 0.1);
  height: 44px;
  width: 100%;
  background: white;
}

#payment-request-button {
  margin-bottom: 32px;
}

/* Buttons and links */
button#submit-button.hidden{display:none!important}
button#submit-button, button#submit-proceed {
  background: #5469d4;
  color: #ffffff;
  font-family: Arial, sans-serif;
  border-radius: 0 0 4px 4px;
  border: 0;
  padding: 12px 16px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  display: block;
  transition: all 0.2s ease;
  box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07);
  width: 100%;
}
button#submit-button:hover {
  filter: contrast(115%);
}
button#submit-button:disabled, button#submit-proceed:disabled {
  opacity: 0.5;
  cursor: default;
}

#payment-element ~ #submit-button, #payment-element > button#submit-proceed{border-radius:4px; margin-top: 8px;}

/* spinner/processing state, errors */
.spinner,
.spinner:before,
.spinner:after {
  border-radius: 50%;
}
.spinner {
  color: #ffffff;
  font-size: 22px;
  text-indent: -99999px;
  margin: 0px auto;
  position: relative;
  width: 20px;
  height: 20px;
  box-shadow: inset 0 0 0 2px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.spinner:before,
.spinner:after {
  position: absolute;
  content: "";
}
.spinner:before {
  width: 10.4px;
  height: 20.4px;
  background: #5469d4;
  border-radius: 20.4px 0 0 20.4px;
  top: -0.2px;
  left: -0.2px;
  -webkit-transform-origin: 10.4px 10.2px;
  transform-origin: 10.4px 10.2px;
  -webkit-animation: loading 2s infinite ease 1.5s;
  animation: loading 2s infinite ease 1.5s;
}
.spinner:after {
  width: 10.4px;
  height: 10.2px;
  background: #5469d4;
  border-radius: 0 10.2px 10.2px 0;
  top: -0.1px;
  left: 10.2px;
  -webkit-transform-origin: 0px 10.2px;
  transform-origin: 0px 10.2px;
  -webkit-animation: loading 2s infinite ease;
  animation: loading 2s infinite ease;
}

@-webkit-keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@media only screen and (max-width: 600px) {
  form {
    /* width: 80vw; */
  }
}

/* fine stripe */
