table.form-table
{
	width:100%;
	background-color:white;
	border-collapse:collapse;
	font-size:100%;
	font-weight:normal;
	line-height:160%;
}

table.form-table th, table.form-table td
{
	border:1px solid #ADC3D5;
	padding: 5px 5px;
	vertical-align:top;
}

table.form-table th
{
	background-image:url(images/table_head.gif);
	background-repeat:repeat-x;
	text-align: left;
	color:#25639A;
}


table.form-table td
{
	padding: 15px 5px;
}

.form-required 
{
	color: red;
}

.error-fld {
	display: block;
	float: left;
	height: 13px;
	width: 15px;
	background-repeat: no-repeat;
	background-image: url(images/icon_warn.gif);
}

label[for="agreement"] a {
    display: contents;
}



/* --- */

:root {
    --spacing-20: 20px;
    --spacing-40: 40px;
    --spacing-12: 12px;
    --color-white: #fff;
}

.modal {
    z-index: 1000;
    padding: var(--spacing-20);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    opacity: 0;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    background: #00000080;
    outline: none;
    width: 100%;
    height: 100%;
    transition: opacity .3s;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    overflow: auto;
}

.modal__container {
    padding: var(--spacing-40);
    background: var(--color-sugar-milk);
    width: 100%;
    max-width: 70rem;
    margin: auto;
    transition: all .25s;
    position: relative;
    transform: translateY(-3rem);
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}

.modal__close {
    color: #343434;
    cursor: pointer;
    background: none;
    border: 0;
    width: 4rem;
    height: 4rem;
    padding: 0;
    font-size: 2rem;
    font-weight: 700;
    line-height: 4rem;
    text-decoration: none;
    transition: opacity .25s;
    position: absolute;
    top: 0;
    right: 0;
}

.modal__close:hover {
    opacity: .5;
}

.modal_opened {
    display: flex;
}

.modal_visible {
    opacity: 1;
}

.modal_visible .modal__container {
    transform: translateY(0);
}

.form-group {
    /*margin-bottom: var(--spacing-20);*/
}

.btn {
    display: inline-block;
    font-weight: 400;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    background-color: #007bff;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn-primary {
    background-color: #007bff;
    border-color: #007bff;
}

.btn-primary:hover {
    background-color: #0056b3;
    border-color: #004085;
}

.btn-secondary {
    background-color: #6c757d;
    border-color: #6c757d;
}

.btn-secondary:hover {
    background-color: #5a6268;
    border-color: #545b62;
}

.alert {
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
}

.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.text-danger {
    color: #dc3545 !important;
}

.text-muted {
    color: #6c757d !important;
}


/* fields */



.form_field {
    position: relative;
}

.form_field_span {
    position: absolute;
    opacity: 0.75;
    color: var(--color-amethyst-grey);

    padding-left: var(--spacing-4);
    
    transition: all .1s ease-in;
}

.form_field_input {
    border: none;

    border-radius: 0;

    border-bottom: 1px solid var(--color-amethyst-grey);
    
    border-top: 1.333em solid transparent;

    padding: var(--spacing-4);

    outline: none;
    width: 100%;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.28571;

    z-index: 1;
    position: relative;
    background: transparent;

    color: var(--color-amethyst-grey);
}

.form_field_textarea {
    border: none;

    border-radius: 0;

    border-bottom: 1px solid var(--color-amethyst-grey);
    
    border-top: 1.333em solid transparent;

    padding: var(--spacing-4);

    outline: none;
    width: 100%;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.28571;

    z-index: 1;
    position: relative;
    background: transparent;

    color: var(--color-amethyst-grey);
}

.form_field:not(:has(.form_field_input:focus)) .form_field_span {
    top: 33%;
}

.form_field:has(.form_field_input:focus) .form_field_span,
.form_field:not(:has(.form_field_input:placeholder-shown)) .form_field_span
{
    top: 5%;
}

.field_textarea:not(:has(.form_field_textarea:focus)) .form_field_span {
    top: 15%;
}

.field_textarea:has(.form_field_textarea:focus) .form_field_span,
.field_textarea:not(:has(.form_field_textarea:placeholder-shown)) .form_field_span
{
    top: 0;
}

.form_field + .form_field {
    margin-top: 1em;
}

.field_remember_me > input,
.field_remember_me > label {
    display: inline-block;
}

.field_submit {
    display: flex;
    justify-content: center;
	margin-top: 3em !important;
}

.contacts__info_form_btn {
    border: none;
}

/* extra error styles */

.errortext {
    font-weight: 400;
    font-size: var(--content-text-font-size);
}

.field_hint {
    opacity: 0.75;
    transition: .2s all ease-out;
    font-size: var(--content-text-font-size);
    display: flex;
    gap: 1rem;
}

.field_hint:hover {
    opacity: 1;
}

.field_hint a {
    display: inline-block;
    color: var(--color-babys-booties);
}

#agreement
{
    accent-color: var(--color-amethyst-grey);
}

