.modal--active body,
.modal--active #header,
.modal--active .ex_ctrl--sticked .ex_ctrl--container,
.modal--active .table--fixed_header.table_header--on_top {
    width: calc(100vw - var(--Scroll-Width));
}


/* Form container
---------------------------------------- */
.form--container h3 {
	margin-bottom: 1.2em; 
    padding-right: 60px;
}
.form--block_row {
	margin-bottom: 18px;	
}
    .form--block_half_row {
        display: flex;
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 40px;
    }
    .form--block_half_row .form--input_group {
        width: 50%;
    }



/* Form input group 
---------------------------------------- */
.form--input_title {
	margin-bottom: 6px;
	font-size: 14px;
	font-weight: 600;
    color: var(--Neutrals-Black);
}

.form--input_group input, 
.form--input_group textarea {
	display: block;
	width: 100%;
	padding: 11px 16px;
	font-family: "open-sans", sans-serif;
	font-size: 16px;
	font-weight: 400;
    line-height: 1;
	color: var(--Neutrals-Black);
	background-color: var(--Neutrals-White);
	border: 1px solid var(--Neutrals-Sand);
	transition: all 0.2s ease;
	outline: none;
}
    .form--input_group input {
        height: 46px;
    }
    .form--input_group textarea {
        height: 185px;
        resize: vertical;
        line-height: 1.5;
    }
    .form--input_group input:focus, 
    .form--input_group textarea:focus {
        border-color: var(--Neutrals-Dark-Grey);
    }
    .form--input_group input::placeholder, 
    .form--input_group textarea::placeholder {
        opacity: 0.5;
        font-size: 14px;
    }
    .form--input_group input::-webkit-input-placeholder,
    .form--input_group textarea::-webkit-input-placeholder {
        opacity: 0.5;
        font-size: 14px;
    }




/* Input errors 
---------------------------------------- */
.form--input_error input,
.form--input_error textarea,
.form--input_error input:focus,
.form--input_error textarea:focus {
	border-color: var(--Secondary-Red);
    border-width: 1.5px;
}
    .form--error_status {
        display: none;
        margin-top: 3px;
        font-size: 12px;
        font-weight: 400;
        color: var(--Secondary-Red);
    }
    .form--error_status > * {
        display: none;
        font-size: 12px;
        font-weight: 400;
        color: var(--Secondary-Red);
        line-height: 1.3;
    }
    .form--input_error .form--error_status {
        display: block;
    }
        .form--error_no_data .error--no_data,
        .form--error_incorrect_email .error--incorrect_email,
        .form--error_incorrect_phone .error--incorrect_phone {
            display: inline-block;
        }


/* Checkbox 
---------------------------------------- */
.form--checkbox {
	position: relative;
}
    .form--checkbox input {
        opacity: 0 !important;
        width: 0px !important;
        height: 0px !important;
        border-radius: unset !important;
        border: none !important;
        }
    .form--checkbox_label {
        position: absolute;
        top: 0;
        left: 0;
        width: 24px;
        height: 24px;
        border: 1px solid var(--Neutrals-Sand);
        cursor: pointer;
    }
    .checkbox--active .form--checkbox_label {
        background-color: var(--Neutrals-White-Sand);
    }
    .form--checkbox_state {
        position: absolute;
        top: 1px;
        left: 1px;
        height: 22px;
        width: 22px;
    }
    .checkbox--active .form--checkbox_state {
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
        /* 
            <svg width="24px" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path style="fill:none;stroke:#535347;stroke-width:1.5;stroke-linecap:round;" d="M5.7,10.8l4.8,5.1l7.7-8.1"/>
            </svg> 
        */
        background-image: url("data:image/svg+xml,%3Csvg width='24px' height='24px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill:none;stroke:%23535347;stroke-width:1.5;stroke-linecap:round;' d='M5.7,10.8l4.8,5.1l7.7-8.1'/%3E%3C/svg%3E");    
    }
.form--checkbox_option {
    margin: 0 0 0 36px;
    font-size: 15px;
    line-height: 24px;
    display: block;
}
    .form--checkbox_option a {
        font-weight: 400;
        text-decoration: underline dotted 1px;
    }
    .form--input_error .form--checkbox_label {
        border-color: var(--Secondary-Red);
        border-width: 1.5px;
    }
    @media (hover: hover) {
        .form--checkbox_option a:hover {
            text-decoration: underline solid;
        }
    }

/* Hidden fields 
---------------------------------------- */
.form--block_row.form--block_hidden {
	display: none;
}

/* Confidency field
---------------------------------------- */
.form--block_row.form--block_confidency {
    margin-top: 20px;
    margin-bottom: 0;
}
.form--block_row.form--block_confidency p {
    font-size: 14px;
    font-style: italic;
}

/* Select 
---------------------------------------- */
.form--select2 select {
	width: 100%;
}
.form--select2.form--input_error .select2-container--default .select2-selection--single {
	border-color: var(--Secondary-Red);
    border-width: 1.5px;
}




/* Form file uploads block 
---------------------------------------- */
.form--file_upload_box {
    padding-bottom: 5px;
}
.form--upload_box {
	display: block;
	min-height: 140px;
	width: 100%;
	color: var(--Neutrals-Black);
	background-color: var(--Neutrals-White-Sand);
	cursor: pointer;
	text-align: center;
	position: relative;
	}
	.form--upload_box input[type="file"] {
		visibility: hidden;
		opacity: 0;
		position: absolute;
		width: 0.1px;
		height: 0.1px;
		padding: 0;
		margin: 0;
	}
	.form--no_files .form--upload_before {
		display: block;
	}
	.form--files_selected .form--uploaded_files {
		display: block;
}

/* File upload area 
---------------------------------------- */
.form--upload_before {
	display: none;
	width: 100%;
	height: 100%;
	padding: 28px;
	}
	.form--upload_instructions {
        font-size: 15px;
        line-height: 1.5;
		padding-bottom: 1em;
        color: var(--Neutrals-Black);
	}
	.form--upload_instructions b {
		font-weight: 700;
	}
	.form--upload_instructions_plus {
		display: block;
	}
	.form--upload_restrictions {
		font-size: 13px;
		color: var(--Neutrals-Light-Grey);
}
@media (hover: hover) {
	.form--upload_before:hover .form--upload_instructions b {
      color: var(--Primary-Green);
		text-decoration: underline;
	}
}


/* File upload errors 
---------------------------------------- */
.form--input_error .form--upload_box {
    border: 1.5px solid var(--Secondary-Red);
}
	.form--error_too_many .error--too_many,
	.form--error_too_large .error--too_large,
	.form--error_invalid_type .error--invalid_type {
		display: block;
    }
    .form--file_upload_box .form--error_status {
        margin-top: 8px;
    }


/* Uploaded file list 
---------------------------------------- */
.form--uploaded_files {
	display: none;
	position: relative;
	width: 100%;
	height: 100%;
	padding: 24px 40px 24px 24px;
	}
	.form--files_container {
		display: flex;
		align-items: flex-start;
		flex-wrap: wrap;
      gap: 16px;
	}
	.form--uploaded_files .button--close {
		position: absolute;
		width: 40px;
		height: 40px;
		top: 0;
		right: 0;
        /*  
            <svg width="16px" height="16px" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path style="fill:none;stroke:#8A8A7E;stroke-width:1.3;stroke-linecap:round;" d="M15.4,0.6L0.7,15.3"/>
                <path style="fill:none;stroke:#8A8A7E;stroke-width:1.3;stroke-linecap:round;" d="M0.6,0.6l14.7,14.6"/>
            </svg>
        */
        background-image: url("data:image/svg+xml,%3Csvg width='16px' height='16px' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill:none;stroke:%238A8A7E;stroke-width:1.3;stroke-linecap:round;' d='M15.4,0.6L0.7,15.3'/%3E%3Cpath style='fill:none;stroke:%238A8A7E;stroke-width:1.3;stroke-linecap:round;' d='M0.6,0.6l14.7,14.6'/%3E%3C/svg%3E%0A");
        background-repeat: no-repeat;
        background-position: center;
		background-size: 14px 14px;
}

.button--file {
   position: relative;
	height: 46px;
	padding: 12px 44px 12px 16px;
	background-color: transparent;
	border: 1px solid var(--Neutrals-Sand);
	cursor: pointer;
	outline: none; 
	}
	.button--file p {
		display: block;
		font-family: "open-sans", sans-serif;
      font-size: 15px;
		line-height: 1;
		white-space: nowrap;
		color: var(--Neutrals-Light-Grey);
		padding: 0;	
	}
	.button--file::after {
      content: "";
		position: absolute;
		width: 44px;
		height: 44px;
		top: 0;
		right: 0;
        /*  
            <svg width="16px" height="16px" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path style="fill:none;stroke:#8A8A7E;stroke-width:2;stroke-linecap:round;" d="M15.4,0.6L0.7,15.3"/>
                <path style="fill:none;stroke:#8A8A7E;stroke-width:2;stroke-linecap:round;" d="M0.6,0.6l14.7,14.6"/>
            </svg>
        */
        background-image: url("data:image/svg+xml,%3Csvg width='16px' height='16px' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill:none;stroke:%238A8A7E;stroke-width:2;stroke-linecap:round;' d='M15.4,0.6L0.7,15.3'/%3E%3Cpath style='fill:none;stroke:%238A8A7E;stroke-width:2;stroke-linecap:round;' d='M0.6,0.6l14.7,14.6'/%3E%3C/svg%3E%0A");
        background-repeat: no-repeat;
        background-position: center;
		background-size: 10px 10px;
}

@media (hover: hover) {
   .button--file:hover {
      /* background-color: var(--Neutrals-Light-Sand); */
      border-color: var(--Neutrals-Dark-Grey);
   }
   .button--file:hover p {
      color: var(--Neutrals-Dark-Grey);
   }
   .form--uploaded_files .button--close:hover {
      /*  
         <svg width="16px" height="16px" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
               <path style="fill:none;stroke:#282819;stroke-width:1.3;stroke-linecap:round;" d="M15.4,0.6L0.7,15.3"/>
               <path style="fill:none;stroke:#282819;stroke-width:1.3;stroke-linecap:round;" d="M0.6,0.6l14.7,14.6"/>
         </svg>
      */
      background-image: url("data:image/svg+xml,%3Csvg width='16px' height='16px' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill:none;stroke:%23282819;stroke-width:1.3;stroke-linecap:round;' d='M15.4,0.6L0.7,15.3'/%3E%3Cpath style='fill:none;stroke:%23282819;stroke-width:1.3;stroke-linecap:round;' d='M0.6,0.6l14.7,14.6'/%3E%3C/svg%3E");
	}
}



/* Submit button 
---------------------------------------- */

.form--block_row.form--block_submit {
    display: block;
    margin-bottom: 0;
}
.form--block_submit_controls {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    column-gap: 40px;
    row-gap: 5px;
    margin-bottom: 0;
}
    .form--block_submit .form--gdpr {
        flex-grow: 1;
    }
    .form--block_submit .form--submit {
        flex-grow: 0;
    }
        .form--submit .button--submit {
            padding-right: 52px;
            width: 100%;
        }


.form--submit_error .form--submit_errors {
    display: block;
    margin-top: 10px;
}
    .form--error_form_invalid .error--has_errors {
        display: block;
    }



/* AJAX messages 
---------------------------------------- */
.form--process_active .form--process {
	display: block;
}
.form--process_active .form--contact {
	display: none;
}

.form--process {
	display: none;
   padding: 10px 20px 10px;
}
.form--process_msg {
	display: none;
	text-align: center;
}
.form--process_msg.form--msg_active { 
   display: block; 
}
.form--process_msg img {
	width: 96px;
	height: auto;
	margin-bottom: 32px;
}
.form--process_msg h3 {
	margin-bottom: 24px;
}
.form--process_msg p {
	padding: 0;
}
.form--process_msg p.form--spinner_msg {
    margin-top: 50px;
}
.form--process_msg a {
    font-weight: 700;
}
.form--process_msg .button--message_close {
    margin-top: 42px;
    min-width: 150px;
}

.form--success h3,
.form--failed h3 {
    padding-right: 0;
}



/* Recaptcha
---------------------------------------- */
.form--recaptcha {
   padding-bottom: 12px;
}
.form--recaptcha .form--block_row,
.form--recaptcha .form--title {
   display: none;
}
.captcha--mask {
	/* padding-bottom: 42px; */
	background-color: rgba(255,255,255,0.9);
	display: flex;
	align-items: center;
	justify-content: center;
   flex-direction: column;
   z-index: 10;
   min-height: 220px;
}

.captcha--mask.captcha--challenge {
	padding-bottom: 0;
	background-color: var(--White);
	border: 1px solid var(--Silver);
	border-radius: 8px;
	text-align: center;
	padding: 20px 20px 32px 20px;
}
.captcha--mask .modal--spinner {
	margin-bottom: 30px;
}
.captcha--container .captcha--title {
	margin-bottom: 24px;
   padding-right: 0;
}
.captcha--container .captcha--image {
	display: flex;
	justify-content: center;
}
.captcha--container .captcha--reload {
	width: 50px;
	height: 50px;
	margin-left: 8px;
	cursor: pointer
}
.captcha--container .captcha--reload svg {
   width: 100%;
   height: 100%;
}
.captcha--reload.challenge--loading svg {
  animation: rotate 1s linear infinite;
  animation-delay: 0.5s;
  transform-origin: center;
}

@keyframes rotate {
   0% {
      transform: rotate(0deg);
   }
   100% {
      transform: rotate(360deg);
   }
}

.captcha--container .captcha--query {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}
.captcha--container .captcha--input {
	text-transform: uppercase;
   padding-left: 10px
}
.captcha--container .captcha--input:focus,
.captcha--container .captcha--input:focus-visible {
   outline: none;
}
.captcha--container .captcha--submit {
	min-width: 150px;
	margin-left: 12px;
}




/* Modal form
---------------------------------------- */
.modal--window {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  height: 100vh;
  width: 100vw;
  background-color: transparent;
  overflow-y: scroll;
  z-index: 3000;
}
   .modal--window .modal--container {
      position: relative;
      width: 100%;
      min-height: 100vh;
      padding: 60px;
   }
   .modal--window .modal--mask {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      background-color: var(--Neutrals-Black);
      opacity: 0.6; 
   }

   .modal--window .modal--frame {
      position: relative;
      margin: 0 auto;
      padding: 64px 56px 56px 56px;
      background-color: #FFF;
      max-width: 850px;
   }

   .modal--window .modal--window_close {
      display: block;
      position: absolute;
      width: 48px;
      height: 48px;
      top: 0;
      right: 0;
      /*  
      <svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
         <style type="text/css">.lines{fill:none;stroke:#282819;stroke-width:1.3;stroke-linecap:round;}</style>
         <path class="lines" d="M21.6797 4L4.00202 21.6777"/>
         <path class="lines" d="M4 4L21.6777 21.6777"/>
      </svg>        
      */
      background-image: url("data:image/svg+xml,%3Csvg width='26' height='26' viewBox='0 0 26 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle type='text/css'%3E .lines%7Bfill:none;stroke:%23282819;stroke-width:1.3;stroke-linecap:round;%7D %3C/style%3E%3Cpath class='lines' d='M21.6797 4L4.00202 21.6777'/%3E%3Cpath class='lines' d='M4 4L21.6777 21.6777'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: left bottom;
      background-size: 26px 26px;
   }


.modal--spinner_container .modal--spinner_block {
    padding: 80px 0;
}
   .modal--spinner {
      width: 50px;
      height: 50px;
      margin: 0 auto;
   }
   .modal--spinner svg {
      width: 100%;
      height: auto;
   }
   .modal--spinner .spinner--long {
      fill: var(--Primary-Light-Green);
   }
   .modal--spinner .spinner--short {
      fill: var(--Primary-Green);
   }


.modal--error_message {
    padding: 20px 60px 30px;
    text-align: center;
}
   .modal--error_message .icon--network_error {
      margin-bottom: 24px;
   }
   .modal--error_message h3 {
      margin-bottom: 24px;
   }
   .modal--error_message a {
      font-weight: 700;
   }
   .modal--error_message .button--item {
      margin-top: 32px;
      min-width: 150px;
   }


.modal--active {
  overflow-y: hidden;
}
   .modal--active .modal--window {
      display: block;
   }


@media (max-width: 850px) {
   .form--block_half_row {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-start;
      gap: 24px;
   }
   .form--block_half_row .form--input_group {
      width: 100%;
   }
}
@media (max-width: 768px) {
   .modal--window .modal--container {
      padding: 40px;
   }
   .modal--window .modal--frame {
      padding: 56px 42px 48px 42px;
   }
   .form--container h3 {
      font-size: 30px;
      padding-right: 30px;
   }
   .form--block_submit_controls {
      display: block;
   }
   .form--block_submit .form--submit {
      margin-top: 24px;
   }
}
@media (max-width: 550px) {
   .modal--window .modal--container {
      padding: 20px;
   }
}
@media (max-width: 450px) {
   .modal--window .modal--container {
      padding: 0;
   }
   .modal--window .modal--frame {
      padding: 56px 24px 48px 24px;
   }
   .form--checkbox_option {
      font-size: 14px;
   }    
}

