/* This is the wrapper for both the api render and CF7 */
.RealNex-Wrapper {
  position: relative;
}

.realnex-protector-form {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 200;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  background: rgba(0, 0, 0, 0.55);
  border-radius: 16px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  border: 1px solid rgba(0, 0, 0, 0.3);
}

.page .entry-content div.realnex-protector-form h2 {
  color: #fff!important;
  font-size: 30px;
  text-align: center;
}

.page .entry-content div.realnex-protector-form label {
  color: #fff;
}

.page .entry-content div.realnex-protector-form .wpcf7-list-item-label{
  color: #fff!important;
}
.page .entry-content div.realnex-protector-form .wpcf7-not-valid-tip {
  color: #dc3232!important;
  border-color: #dc3232!important;
  font-weight: 700;
  text-shadow: 1px 1px black;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  padding: 0 10px;
}
.wpcf7-form-control.wpcf7-radio {
  gap: 5px;
  display: flex;
  flex-direction: column;
}

.page .entry-content div.realnex-protector-form input[type="text"], .page .entry-content div.realnex-protector-form input[type="email"] {
  background: #fff!important;
  height: 40px;
}

.page .entry-content div.realnex-protector-form form{
  display: grid;
  grid-template-columns: 1fr 1fr;
}

#wpcf7-f8989-p7248-o1 > form > p:nth-child(7) {
  grid-column: 1 / span 2;
  text-align: center;
}
#contact-form-cfc57c0 > p:nth-child(8) {
	margin-bottom: 0;
}
#contact-form-cfc57c0 > p:nth-child(9) {
  grid-column: span 2 / span 1;
  text-align: center;
}

.page .entry-content div.realnex-protector-form .wpcf7-response-output {
  grid-column: 1 / span 2;
  text-align: center;
  color: #dc3232!important;
  border-color: #dc3232!important;
  font-weight: 700;
  text-shadow: 1px 1px black;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.page .entry-content div.realnex-protector-form input[type="submit"] {
  width: 33.33%!important;
}

.page .entry-content div.realnex-protector-form input[type="submit"]:disabled {
  cursor: not-allowed;
  opacity: 0.5;
  background: #161415;
  color: #713636
}

.wpcf7-form.submitting .wpcf7-submit {
    pointer-events: none;
}

.page .entry-content div.realnex-protector-form #realnexuuid {
  display: none;
}

.page .entry-content div.realnex-protector-form #originsilo {
  display: none;
}

.page .entry-content div.realnex-protector-form p:has(> input.wpcf7-form-control.wpcf7-submit.has-spinner) {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.page .entry-content div.realnex-protector-form input.wpcf7-form-control.wpcf7-submit.has-spinner {
	margin: 2px auto;
}

.page .entry-content div.realnex-protector-form .wpcf7-spinner {
	margin: 0 auto;
}

.page .entry-content div.realnex-protector-form .grecap {
	grid-column: span 2 / span 2; 
	display: flex; 
	justify-content: center
}

/*
.page .entry-content div.realnex-protector-form .your-phone {
  display: none;
}
*/

@media (max-width: 768px) {
  .page .entry-content div.realnex-protector-form form {
    grid-template-columns: 1fr;
	max-width: 100%;
  }
  #contact-form-cfc57c0 > p:nth-child(9) {
	grid-column: 1;
  }
  .page .entry-content div.realnex-protector-form form p {
	max-width: 90%;
	margin-left:10%
  }
  .page .entry-content div.realnex-protector-form form label {
	max-width: 90%;
  }
  .page .entry-content div.realnex-protector-form form input {
	max-width: 90%;
  }
 .page .entry-content div.realnex-protector-form .grecap {
	 grid-column: 1;
 }
}

@media (max-width: 300px) {
  .page .entry-content div.realnex-protector-form form p {
	max-width: 80%;
	margin-left:20%
  }
  .page .entry-content div.realnex-protector-form form label {
	max-width: 80%;
  }
  .page .entry-content div.realnex-protector-form form input {
	max-width: 80%;
  }

}

@media (max-width: 226px) {
  .page .entry-content div.realnex-protector-form form p {
	max-width: 70%;
	margin-left:30%
  }
  .page .entry-content div.realnex-protector-form form label {
	max-width: 70%;
  }
  .page .entry-content div.realnex-protector-form form input {
	max-width: 70%;
  }
}