#validate-reference-btn {
margin: 15px 10px;
}
div#guest-fields-container {
color: #fff;
padding: 15px 0;
margin: 30px 0;
}
.guest-field {
width: 100%;
float: left;
margin-bottom: 15px;
border: 1px solid #98a7d3;
padding: 15px;
background: #182b86;
border-radius: 15px;
}
.g-recaptcha {
padding: 0 10px;
}
div#guest-fields-container::after {
content: " ";
display: table;
clear: both;
}
#gala-rsvp-form-container button:hover, #gala-rsvp-form-container .button:hover {
background-color: #cf2028!important;
color:#fff!important;
}
.loading-overlay {
position: fixed; top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7); display: flex;
justify-content: center;
align-items: center; z-index: 9999; }
.spinner {
border: 4px solid #f3f3f3; border-top: 4px solid #3498db; border-radius: 50%;
width: 80px; height: 80px;
animation: spin 2s linear infinite;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.field-group {
width: 50%;
float: left;
padding: 0 10px;
}
.guest-field:after {
content: " ";
display: table;
clear: both;
}
.field-group input, .field-group select {
width: 100%;
}
span.close {
float: right;
cursor: grab;
background: #fff;
color: blue!important;
}
span.close:hover {
background: #999;
color: #fff;
}
.company-registration-information:after {
display: table;
content: " ";
clear: both;
}
form#gala-rsvp-form {
padding: 15px;
}
.company-registration-information .field-group {
width: 33%;
}
@media (max-width: 480px){
.company-registration-information .field-group, .field-group {
width: 100%!important;
padding: unset;
}
#gala-rsvp-form, .g-recaptcha { padding: unset;}
.field-group label, .field-group input, .field-group select {
text-align: center;
font-size: 1.5em;
line-height: 1.75em;
}
form#gala-rsvp-form button {
display: block;
margin: 15px auto;
}
div#qr-scanner-form {
text-align: center;
}
form#grsvp-qr-form input {
width: 100%;
text-align: center;
}
}
div#qr-result {
display: none;
background: white;
margin: 50px 0;
padding: 25px;
border-radius: 5px;
}
.guest-info h3 {color: #172c86;}
.hide-public {
display: none!important;
}
.disabled {
cursor: not-allowed;
background: #dad6d6 !important;
color: #444!important;
}
#reservation-message {
width: 100%;
float: left;
display: block;
text-align: center;
color: #fff;
}
#reservation-message p {
color: #172980;
}
#reservation-message {
background: #ffffff;
padding: 15px;
border-radius: 15px;
font-size: 17px;!important;
color: #fff;
line-height: 20px;
font-weight: 500;
}
#qr-scanner-form {
min-height: 600px;
}