:root {
    --gutter-x: 12px;
    --form-text-size:17px;
    --content-text-size:22px;
    --content-margin-bottom:20px;
}
html, body {
    height: 100%;
}
body {
    font-family: "Lato", sans-serif;
    font-optical-sizing: auto;
    font-weight: normal;
    font-style: normal;
    background-color: #fff;
    color: #000000;
}
ol, ul {
    padding-left: 1rem;
}
ol, ul, p,
.form-group {
    margin-bottom: 12px;
}
.content-mb {
    margin-bottom: var(--content-margin-bottom);
}

img {
    -webkit-user-select : none;
    -khtml-user-select  : none;
    -moz-user-select    : none;
    -o-user-select      : none;
    user-select         : none;
    pointer-events      : none;
}

.form-select,
.form-control {
    border-radius: 0;
    border-color: #e0e0e0;
    font-size: var(--form-text-size);
}
.form-check-input {
    border-color: #e0e0e0;
}
.form-check a {
    color: inherit;
    text-decoration: underline;
}

.form-select::placeholder,
.form-control::placeholder,
.placeholder {
    color: #000000;
}

.control-label {
    font-weight: normal;
    font-size: var(--form-text-size);
}
#civility-outer input{
    opacity: 0;
    position: absolute;
    left: 50%;
    bottom: 0;
}
#civility-outer .btn-civility {
    display: block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    padding: 6px 12px;
    font-size: var(--form-text-size);
    user-select: none;

    border-radius: 0;
    background: #fff;
    border: 1px solid #959595;
    color: #000000;
    width: 100%;
}
#civility-outer .selected .btn-civility {
    background-color: #000000;
    border-color: #000000;
    color: #ffffff;
}


.form-horizontal .control-label {
    padding-top: 7px;
    margin-bottom: 0;
}

.help-block {
    font-size: 11px;
}

.has-error input,
.has-error select:not(.placeholder),
.has-error .help-block {
    color: #842029;
}

.font-weight-semibold {
    font-weight: 500;
}

.text-size-small {
    font-size: 13px;
}

.btn-submit,
.btn-call {
    font-weight: 900;
    border-radius: 0;
    padding-top: 12px;
    padding-bottom: 15px;
    width: 100%;
    font-size: var(--content-text-size);
    text-transform: uppercase;
    border-color: #000000;
}
.btn-submit {
    background-color: #000000;
    color: #ffffff;
}
.btn-submit:hover {
    color: rgba(255, 255, 255, 0.8);
}
.btn-call {
    background-color: #ffffff;
    color: #000000;

}
.btn-call:hover {
    color: rgba(0, 0, 0, 0.6);
}

header {
    text-align: center;
    line-height: 1.2;
    color: #000000;
}

footer,
.sub-header {
    padding: var(--content-margin-bottom) 0;
    line-height: 1.2;
}
.sub-header-logo {
    margin-bottom: var(--content-margin-bottom);
    line-height: 1;
}

.footer-title,
.sub-header-title {
    font-weight: bolder;
}
.separator {
    height: 1px;
    background-color: #c9c9c9;
    margin-bottom: 25px;
}
.confirmation,
.sub-header,
.instruction {
    font-size: var(--content-text-size);
    text-align: center;
}
.confirmation,
.instruction {
    margin-bottom: var(--content-margin-bottom);
}

footer {
    background-color: #000000;
    color: #ffffff;
    text-align: center;
    font-size: var(--content-text-size);
}

footer a {
    color: #ffffff !important;
    text-decoration: none;
}
.mandatory-fields {
    font-size: 12px;
}

.sub-footer {
    text-align: center;
    font-size: 20px;
    padding: 15px 0;
}
.sub-footer a {
    color: #000000 !important;
    text-decoration: none;
}

.list-pic {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 3px;
    margin-bottom: var(--content-margin-bottom);
}

.legal {
    font-size: 16px;
    margin-bottom: var(--content-margin-bottom);
}

@media (min-width: 480px) {
    :root {
        --form-text-size:22px;
        --content-text-size:26px;
        --content-margin-bottom:30px;
    }

    .container {
        max-width: 800px !important;
    }

    .legal {
        font-size: 20px;
    }
}

@media (min-width: 768px) {
}

@media (min-width: 992px) {
    header .gain {
        padding-top: 30px;
    }
}

@media (min-width: 1200px) {
}

@media (min-width: 1920px) {

}