@charset "UTF-8";
/* CSS Document */

/* contact form */
.form-head {padding-bottom: 1rem;}
.cf-wrap {padding-top: 2rem;}
.form-wrap {position: relative; margin-bottom: 2rem;}
.contact-form {width: 100%; position: relative;}
.form-wrap input:not([type='submit'], [type='checkbox'], [type='radio'], [type='file']), .form-wrap textarea {width: 100%; display: block; border: 0.0625rem solid var(--color-1); text-align: left; padding: 0.375rem 0.25rem;}
input[type='submit'] {border: none;}

.field {position: relative;}
.form-row + .form-row, .form-row .field + .field {margin-top: 1rem;}

.footnotes {padding: 1.5rem 0 0 0;}
.form-head + .form-wrap {padding: 1rem 0 0 0;}

.disabled {pointer-events: none; opacity: .5;}
.honey {position: absolute; visibility: hidden;}

.message {padding: 1rem;}
.alert {padding: 0.25rem 1rem;}
.success {width: 100%; height: 100%; position: absolute; left: 0; top: 0; border: 0.125rem solid var(--color-1); padding: 2rem 1rem; display: none; background: rgba(255,255,255,0.9); backdrop-filter: blur(0.125rem);}
.errors, .alert {width: 100%; margin-top: 0.75rem; border: 0.125rem solid rgba(185,0,0,1);}
.js-hint, .no-js .form-wrap, .hidden-form {display: none;}
.no-js .js-hint {display: block; padding: 1rem 0;}
.side-panel .hidden-form {display: block;}

label, .label {display: block; line-height: 1.5; position: relative; text-align: left; padding-bottom: 0.25em;}
.cb, .radio {width: 1px; height: 1px; position: absolute; background: transparent; border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; /*visibility: hidden;*/}

.cb + label:before,
.radio + label:before
{content:''; display: inline-block; width: 1.375em; height: 1.375em; position: absolute; vertical-align: middle; top: 0; border: 0.0625rem solid var(--color-1); background: rgba(255,255,255,1);}

.cb:focus-visible + label:before, .radio:focus-visible + label:before {outline-style: auto;}

.cb:not(:checked):hover + label:before,
.radio:not(:checked):hover + label:before
{background: var(--color-2); box-shadow: inset 0 0 0 0.25rem var(--white);}

.cb:checked + label:after, .check:after {content:''; width: 1.125em; height:0.75em; position: absolute; vertical-align: middle; top:0.25em; border-left: 0.25em solid var(--color-2); border-bottom: 0.25rem solid var(--color-2); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}

.radio:checked + label:before
{background: var(--color-2); box-shadow: inset 0 0 0 0.125em var(--white);}

.cb, .cb + label:before, .radio, .radio + label:before {left: 0; top: 0.125rem;}

.cb:checked + label:after {left: 0.125rem;}
.cb + label, .radio + label {padding-left: 1.875em; margin-bottom: 0;}
.cb + label:hover, .radio + label:hover {cursor: pointer;}


/* file upload */
.dd-box {background: var(--color-3); padding: 4rem 2rem; position: relative;}
.dd-error, .dd-success {display: none;}

.has-advanced-upload .dd-box {outline: 0.125rem dashed var(--color-2); outline-offset: -0.5rem; -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear; transition: outline-offset .15s ease-in-out, background-color .15s linear;}

.dd-box.is-dragover {outline-offset: -1rem; background-color: var(--color-4);}
.is-uploading .dd-box {pointer-events: none;}


.file-input {width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1;}
.no-js .file-input {width: auto; height: auto; opacity: 1; position: relative; z-index: 0;}

.file-label {padding: 0 0 0.5rem 0; /*text-overflow: ellipsis; white-space: nowrap;*/ cursor: pointer; overflow: hidden;
flex-flow: row nowrap; -ms-flex-wrap: nowrap; align-items: center;}
.file-label .col {width: auto;}
.file-label strong {transition: color .3s;}
.file-label:hover strong,
.file-input:focus + label strong,
.file-input.has-focus + .file-label strong {color: var(--black);}
.file-input:focus + label,
.file-input.has-focus + label {outline: 1px dotted #000; outline: -webkit-focus-ring-color auto 5px;}

.file-label svg {width: 1.5em; /*position: absolute; left: 0; top: 0;*/ transition: fill .3s;}
.file-label:hover svg,
.file-input:focus + label svg,
.file-input.has-focus + .file-label svg {fill: var(--black);}
.has-files:hover svg {fill: rgba(0,0,0,1);}

.file-delete {border: 0.125rem solid var(--color-2); padding: 0.25rem 0.5rem;}
.file-delete:hover {color: rgba(185,0,0,1); border-color: rgba(185,0,0,1);}
.file-delete .cross {width: 1.25em; height: 1.25em; margin-left: 0.5rem; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.file-delete:hover .cross:before, .file-delete:hover .cross:after {background: rgba(185,0,0,1);}

.label-text {padding: 0 0.5rem;}
.file-name-label {pointer-events: none;}

.error-prompt {width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(185,0,0,1); outline: 0.125rem dashed rgba(120,0,0,1); outline-offset: -0.5rem; z-index: 1; padding: 2rem; text-align: center; justify-content: center; opacity: 1; transition: opacity .3s;}
/*.error-prompt span {width: 100%; position: absolute; top: 40%; left: 0;}*/

.is-uploading .dd-box:before, .is-uploading .dd-box:after {display: block; position: absolute; z-index: 1; content: '';}
.is-uploading .dd-box:before {width: 100%; height: 100%; top: 0; left: 0; background: rgba(255,255,255,0.66);}
.is-uploading .dd-box:after {width: 4rem; height: 4rem; top: 50%; left: 50%; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); transition: all .3s; background: url(../images/layout/loading-icon.svg) center center/ 100% 100% no-repeat; -ms-animation: rotate 2s infinite linear; -webkit-animation: rotate 2s infinite linear; animation: rotate 2s infinite linear;}

.fade-out {opacity: 0;}

.document-file .cols {flex-wrap: nowrap; align-items: center;}
.document-file span + span {margin-left: 0.25em;}
.upload-help {padding-top: 0.5em;}

.f-gap-s {gap: 0.5rem;} /* short for flex-gap-small */

/* medium */
@media screen and (min-width:48em) {
/* contact form */
.field-group {gap: 0 1em; flex-wrap: nowrap;}
.field-group .col {width: auto; max-width: 50%; flex-grow: 1;}
.form-row .field + .field {margin-top: 0;}
.form-row + .form-row {margin-top: 1.5rem;}

.form-wrap input:not([type='submit'], [type='checkbox'], [type='radio']), .form-wrap textarea {padding: 0.5rem 0.375rem;}
}

/* large */
@media screen and (min-width:64em) {
/* contact form */
.field-group {gap: 0 2em;}

.footnotes {padding-top: 2rem;}

/* file upload */
.dd-box {padding: 5rem 3rem;}
.has-advanced-upload .dd-box {outline-offset: -1rem;}
.dd-box.is-dragover {outline-offset: -1.5rem;}

}
