:root {
    /* Belt and suspenders alongside the <meta name="color-scheme"> tag: this page is styled for
       light mode only, so a browser that darkens pages on its own should not do it here. */
    color-scheme: light;
    --light: #43b0f1;
    --dark: #021a4d;
    --tertiary: #fff;
    --light-back: #F1F5F8;
    --grey: #021a4d;
    --text: #021a4d;
    --text-on-light: #fff;
    --text-on-dark: #8cd3fc;
    --text-on-grey: #43b0f1;
    --link: #43b0f1;
    --link-on-light: #43b0f1;
    --link-on-dark: #43b0f1;
    --link-on-grey: #43b0f1;
}

.base-page .base-layout.width-contained {
    box-sizing:border-box;
    margin-left:auto;
    margin-right:auto;
    position:relative;
    width:100%
}
@media(min-width:1275px) {
    .base-page .base-layout.width-contained {
        padding-left:90px;
        padding-right:90px
    }
}
@media(max-width:1274px)and (min-width:769px) {
    .base-page .base-layout.width-contained {
        padding-left:60px;
        padding-right:60px
    }
}
@media(max-width:768px) {
    .base-page .base-layout.width-contained {
        padding-left:40px;
        padding-right:40px
    }
}
@media(max-width:400px) {
    .base-page .base-layout.width-contained {
        padding-left:20px;
        padding-right:20px
    }
}
.base-page .base-layout.width-contained-lg {
    max-width:1440px
}
.base-page .base-layout.width-contained-md {
    max-width:1180px
}
.base-page .base-layout.width-contained-sm {
    max-width:980px
}
.base-page .base-layout:not(.width-contained) .base-component.width-contained {
    box-sizing:border-box;
    margin-left:auto;
    margin-right:auto;
    width:100%
}
@media(min-width:1275px) {
    .base-page .base-layout:not(.width-contained) .base-component.width-contained {
        padding-left:90px;
        padding-right:90px
    }
}
@media(max-width:1274px)and (min-width:769px) {
    .base-page .base-layout:not(.width-contained) .base-component.width-contained {
        padding-left:60px;
        padding-right:60px
    }
}
@media(max-width:768px) {
    .base-page .base-layout:not(.width-contained) .base-component.width-contained {
        padding-left:40px;
        padding-right:40px
    }
}
@media(max-width:400px) {
    .base-page .base-layout:not(.width-contained) .base-component.width-contained {
        padding-left:20px;
        padding-right:20px
    }
}
.base-page .base-layout:not(.width-contained) .base-component.width-contained-lg {
    max-width:1440px
}
.base-page .base-layout:not(.width-contained) .base-component.width-contained-md {
    max-width:1180px
}
.base-page .base-layout:not(.width-contained) .base-component.width-contained-sm {
    max-width:980px
}
html {
    background-color:#f4f4f4
}
.base-page {
    background-color:#fff;
    box-shadow:0 0 40px rgba(0,40,104,.07);
    margin:auto;
    max-width:2550px;
    padding:0
}
@media(max-width:998px) {
    .base-page {
        padding-top:86px
    }
}
.base-section {
    position:relative
}
.border-seperator {
    border-top:2px solid #f4f4f4;
    margin-top:60px;
    padding-top:60px
}
.cols .base-container {
    box-sizing:border-box;
    display:grid;
    width:100%
}
.cols-2 .base-container {
    grid-column-gap:20px;
    grid-template-columns:1fr 1fr
}
.grey-back,
.light-back {
    background-color:var(--grey);
    color:var(--text-on-grey);
    padding:1px 0
}
.dark-back,
.scheme-dark {
    background-color:var(--dark);
    color:var(--text-on-dark);
    padding:1px 0
}
.dark-back .btn-secondary,
.scheme-dark .btn-secondary {
    border:1px solid #fff;
    color:#fff
}
.dark-back .btn-secondary:hover,
.dark-back .btn-tertiary,
.dark-back .btn-tertiary-sm,
.scheme-dark .btn-secondary:hover,
.scheme-dark .btn-tertiary,
.scheme-dark .btn-tertiary-sm {
    color:#fff
}
.dark-back-lighter {
    background-color:var(--dark);
    color:var(--text-on-dark);
    padding:1px 0;
    position:relative
}
.dark-back-lighter:before {
    background-color:var(--dark);
    content:"";
    -webkit-filter:brightness(122%);
    filter:brightness(122%);
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%
}

div,
html {
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    font-size:10px
}
body {
    color:var(--text);
    margin:0
}
.h2,
.h3,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    margin-bottom:.5rem;
    margin-top:0
}
.h2,
.h3,
.h4,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight:400
}
ol,
p,
ul {
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    font-size:1.6rem;
    line-height:2.6rem
}
p {
    margin-bottom:1.5rem;
    margin-top:0
}
a {
    color:var(--link);
    transition:.35s ease
}
a,
a:hover {
    text-decoration:none
}
a:hover {
    color:hsl(var(--link),50%);
    cursor:pointer
}
.rich-text ul,
.rt-standard ul {
    list-style:none!important;
    padding-left:0
}
.rich-text ul li,
.rt-standard ul li {
    margin-bottom:15px;
    margin-top:15px;
    padding-left:17px;
    position:relative
}
.rich-text ul li:before,
.rt-standard ul li:before {
    background-color:var(--dark);
    content:"";
    height:7px;
    left:0;
    opacity:.35;
    position:absolute;
    top:7px;
    width:7px
}
.rich-text ol,
.rt-standard ol {
    padding-left:15px
}
.rich-text ol li,
.rt-standard ol li {
    margin-bottom:15px;
    margin-top:15px
}
.rich-text ol ol,
.rt-standard ol ol {
    padding-left:22px
}
.rich-text h2,
.rich-text h3,
.rich-text h4,
.rich-text h5,
.rich-text h6,
.rt-standard h2,
.rt-standard h3,
.rt-standard h4,
.rt-standard h5,
.rt-standard h6 {
    margin-bottom:20px
}
ul {
    list-style:none;
    padding-left:0
}
ul.no-dots li {
    margin-bottom:0
}
ul.no-dots li:before {
    content:none;
    position:absolute
}
.body-lg p {
    font-size:2.1rem;
    line-height:3.8rem
}
.body-md p {
    font-size:1.8rem;
    line-height:2.4rem
}
.h1,
h1 {
    font-size:6rem;
    line-height:6rem
}
.h2,
h2 {
    font-size:5rem;
    line-height:5rem
}
.h3,
h3 {
    font-size:4rem;
    line-height:4rem
}
.h4,
h4 {
    font-size:2.4rem;
    line-height:2.4rem
}
h5 {
    font-size:2rem;
    line-height:2rem
}
h6,
small,
small a {
    font-size:1.4rem;
    line-height:1.4rem
}
.font-bolded,
.font-light {
    font-weight:600
}
.font-light {
    color:var(--light)
}
.font-tertiary {
    color:var(--tertiary)
}
.font-book {
    font-weight:500
}
.font-50 {
    color:var(--text);
    opacity:.5
}
@media(max-width:768px) {
    h1 {
        font-size:4rem;
        line-height:4rem
    }
    .h2,
    h2 {
        font-size:3rem;
        line-height:3rem
    }
    .h3,
    h3 {
        font-size:2.4rem;
        line-height:2.4rem
    }
    .h4,
    h4 {
        font-size:2rem;
        line-height:2rem
    }
    h5 {
        font-size:1.6rem;
        line-height:1.6rem
    }
}
@font-face {
    font-display:block;
    font-family:custom-icons;
    font-style:normal;
    font-weight:400;
    src:url(/assets/fonts/custom-icons.eot?l3evsr);
    src:url(/assets/fonts/custom-icons.eot?l3evsr#iefix) format("embedded-opentype"),
    url(/assets/fonts/custom-icons.ttf?l3evsr) format("truetype"),
    url(/assets/fonts/custom-icons.woff?l3evsr) format("woff"),
    url(/assets/fonts/custom-icons.svg?l3evsr#icomoon) format("svg")
}
[class*=" icon-"],
[class^=icon-] {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-family:custom-icons!important;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    text-transform:none
}
.icon-arrow:before {
    content:""
}
.icon-plus:before {
    content:""
}
.icon-minus:before {
    content:""
}
.icon-tick:before {
    content:""
}
.icon-cross:before {
    content:""
}
.icon-facebook:before {
    content:""
}
.icon-linkedin:before {
    content:""
}
.icon-youtube:before {
    content:""
}
.icon-twitter:before {
    content:""
}
.icon-google:before {
    content:""
}
.icon-instagram:before {
    content:""
}
.icon-email:before {
    content:""
}
.icon-link:before {
    content:""
}
.icon-phone:before {
    content:""
}
.icon-search:before {
    content:""
}
.icon-arrow-plain:before {
    content:""
}
.icon-dropdown:before {
    content:""
}
.icon-information:before {
    content:""
}
.icon-uniE912:before {
    content:""
}
.icon-uniE913:before {
    content:""
}
.icon-uniE914:before {
    content:""
}
.icon-uniE915:before {
    content:""
}
.icon-star-full:before {
    content:""
}
.icon-star-half:before {
    content:""
}
.icon-location2:before {
    content:""
}
.icon-map2:before {
    content:""
}
.custom-icon {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-family:custom-icons!important;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    text-transform:none
}
.btn {
    background-color:transparent;
    border:none;
    border-radius:4px;
    box-sizing:content-box;
    box-sizing:border-box;
    display:inline-block;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    font-size:2rem;
    font-weight:500;
    line-height:2rem;
    padding:23px 30px;
    position:relative;
    text-align:center;
    text-decoration:none;
    text-shadow:none;
    top:0;
    transition:.4s ease
}
@media(max-width:768px) {
    .btn {
        font-size:1.8rem;
        line-height:1.8rem;
        padding:22px 20px
    }
}
@media(max-width:550px) {
    .btn {
        font-size:1.6rem;
        line-height:1.6rem;
        padding:16px 20px
    }
}
.btn:hover {
    cursor:pointer;
    text-decoration:none
}
.btn:hover .btn-arrow {
    left:5px
}
.btn:disabled {
    background-color:var(--grey);
    color:var(--text-on-grey);
    cursor:default;
    opacity:.5
}
.btn-arrow {
    font-size:26px;
    left:0;
    margin-left:20px;
    position:relative;
    transition:.35s ease-out
}
.btn-arrow:after {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    content:"\e900";
    font-family:custom-icons!important;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    text-transform:none
}
.btn-email {
    background-color:transparent;
    border:none;
    border-radius:5px;
    box-sizing:content-box;
    box-sizing:border-box;
    display:inline-block;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    font-size:18px;
    font-weight:500;
    line-height:2rem;
    padding:12px 16px;
    position:relative;
    text-align:center;
    text-decoration:none;
    text-shadow:none;
    top:0;
    transition:.4s ease
}
.btn-primary {
    background-color:var(--light);
    color:var(--text-on-light)
}
.btn-primary .btn-container {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center
}
.btn-primary .btn-arrow {
    -webkit-flex:0 0 20px;
    flex:0 0 20px
}
.btn-primary .btn-text {
    text-align:left
}
.btn-primary:hover {
    color:var(--text-on-light)
}
.btn-secondary {
    border:1px solid var(--text);
    color:var(--text)
}
.btn-secondary .btn-container {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center
}
.btn-secondary .btn-arrow {
    -webkit-flex:0 0 20px;
    flex:0 0 20px
}
.btn-secondary .btn-text {
    text-align:left
}
.btn-secondary:hover {
    color:var(--text)
}
.light-back .btn-secondary {
    border:1px solid var(--text-on-grey);
    color:var(--text-on-grey)
}
.btn-tertiary,
.btn-tertiary-sm {
    color:var(--text);
    padding:0
}
.btn-tertiary-sm .btn-container,
.btn-tertiary .btn-container {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:space-between;
    justify-content:space-between
}
.btn-tertiary-sm .btn-arrow,
.btn-tertiary .btn-arrow {
    left:0;
    position:relative;
    transition:left .35s ease-out
}
@media(hover:hover) {
    .btn-tertiary-sm:hover .btn-arrow,
    .btn-tertiary:hover .btn-arrow {
        left:3px
    }
}
@media(max-width:768px) {
    .btn-tertiary {
        font-size:1.6rem
    }
}
.btn-tertiary .btn-arrow {
    margin-left:10px
}
@media(max-width:768px) {
    .btn-tertiary .btn-arrow {
        font-size:20px
    }
}
.btn-tertiary-sm {
    font-size:1.6rem
}
.btn-tertiary-sm .btn-arrow {
    font-size:20px;
    margin-left:6px;
    top:2px
}
.form {
    margin:auto;
    max-width:720px
}
.form .form-row {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    margin-left:-15px;
    margin-right:-15px
}
.form .form-col {
    box-sizing:border-box;
    padding-left:15px;
    padding-right:15px;
    width:100%
}
@media(min-width:769px) {
    .form .form-half-col {
        max-width:50%
    }
}
.form .form-navigation {
    text-align:center
}
.form .required {
    color:red
}
.form .field-wrapper {
    margin-bottom:30px
}
.form .field-wrapper .input,
.form .field-wrapper input,
.form .field-wrapper select,
.form .field-wrapper textarea {
    background-color:#fff;
    border:0;
    box-sizing:border-box;
    color:var(--text);
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    font-size:18px;
    line-height:29px;
    padding:24px 20px 20px;
    width:100%
}
.form .field-wrapper .input::-webkit-input-placeholder,
.form .field-wrapper input::-webkit-input-placeholder,
.form .field-wrapper select::-webkit-input-placeholder,
.form .field-wrapper textarea::-webkit-input-placeholder {
    color:#838486;
    font-size:16px;
    line-height:25px;
    opacity:1
}
.form .field-wrapper .input::placeholder,
.form .field-wrapper input::placeholder,
.form .field-wrapper select::placeholder,
.form .field-wrapper textarea::placeholder {
    color:#838486;
    font-size:16px;
    line-height:25px;
    opacity:1
}
.form .field-wrapper .input:focus,
.form .field-wrapper input:focus,
.form .field-wrapper select:focus,
.form .field-wrapper textarea:focus {
    outline:0
}
.form .field-wrapper textarea {
    max-width:100%;
    min-height:244px
}
.form .field-wrapper select {
    -webkit-appearance:none;
    appearance:none;
    background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAJCAYAAAA7KqwyAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABpSURBVHgBjZLRDcAgCESPTuKna7CNI3WbrtG/Oko1tB8EES7RGI57SiKhtgcixn12ZFRbGfs1j8dXkoIY2XD5ATxWT0F0eGaYPMOM4/RQ1BB5FN4icl+nAWsIsBnNAiwEXtgHaAiw+SMvk8U3+aVEUI8AAAAASUVORK5CYII=");
    background-position:98.5%;
    background-repeat:no-repeat;
    background-size:15px;
    padding-right:40px
}
@media(max-width:768px) {
    .form .field-wrapper select {
        background-position:98%
    }
}
@media(max-width:550px) {
    .form .field-wrapper select {
        background-position:97.5%
    }
}
@media(max-width:400px) {
    .form .field-wrapper select {
        background-position:96%
    }
}
.form .field-wrapper select option:first-child {
    color:rgba(0,0,0,.5);
    font-size:16px;
    line-height:25px
}
.form .field-wrapper input:disabled,
.form .field-wrapper select:disabled,
.form .field-wrapper textarea:disabled {
    background-color:#dddee0!important;
    color:#f4f4f4!important
}
.form .field-wrapper input:disabled:hover,
.form .field-wrapper select:disabled:hover,
.form .field-wrapper textarea:disabled:hover {
    background-color:#dddee0!important;
    cursor:not-allowed
}
.form .field-wrapper.input-error .input,
.form .field-wrapper.input-error input,
.form .field-wrapper.input-error select,
.form .field-wrapper.input-error textarea {
    background-color:#ffebeb;
    border-color:red;
    color:red
}
.form .field-wrapper.input-error .input::-webkit-input-placeholder,
.form .field-wrapper.input-error input::-webkit-input-placeholder,
.form .field-wrapper.input-error select::-webkit-input-placeholder,
.form .field-wrapper.input-error textarea::-webkit-input-placeholder {
    color:red
}
.form .field-wrapper.input-error .input::placeholder,
.form .field-wrapper.input-error input::placeholder,
.form .field-wrapper.input-error select::placeholder,
.form .field-wrapper.input-error textarea::placeholder {
    color:red
}
.form .field-wrapper.input-error .field-validation {
    background-color:#fff;
    color:red;
    display:inline-block;
    font-size:14px;
    margin-top:10px;
    padding:5px 15px
}
.form .alert-danger {
    background-color:#f8d7da;
    border-color:#f5c6cb;
    color:#ef4444
}
.form .alert-success {
    background-color:#d4edda;
    border-color:#c3e6cb;
    color:#155724
}
.form .alert-danger,
.form .alert-success {
    padding:.75rem;
    text-align:center;
    width:70%
}
@media(max-width:998px) {
    .header {
        overflow:hidden;
        position:absolute;
        top:0;
        width:100%
    }
}
.header-minimal {
    height:1px
}
.header-container {
    background-color:#fff;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    position:relative;
    z-index:200
}
.header-logo img {
    margin-bottom:-3px;
    max-height:120px
}
@media(max-width:1600px) {
    .header-logo img {
        max-height:86px
    }
}
.header-broker {
    -webkit-align-self:center;
    align-self:center;
    font-size:1.6rem;
    line-height:2.2rem;
    padding-left:20px;
    padding-right:20px
}
@media(max-width:1274px)and (min-width:999px) {
    .header-broker {
        padding-left:10px
    }
    .header-broker p {
        font-size:1.3rem
    }
}
.header-broker-text {
    margin-bottom:0
}
@media(max-width:998px) {
    .header-broker-number {
        display:none
    }
}
.header-nav {
    background-color:#fff;
    box-sizing:border-box;
    -webkit-flex:1;
    flex:1;
    padding-left:20px
}
@media(max-width:1274px)and (min-width:999px) {
    .header-nav {
        padding-left:15px
    }
}
@media(max-width:998px) {
    .header-nav {
        background-color:#fff;
        -webkit-flex:0 0 100%;
        flex:0 0 100%;
        height:100vh;
        left:0;
        margin-bottom:0;
        overflow-y:scroll;
        padding:30px 90px 165px;
        position:absolute;
        top:85px;
        -webkit-transform:translateX(100%);
        transform:translateX(100%);
        transition:1s ease;
        width:100%
    }
}
@media(max-width:550px) {
    .header-nav {
        padding:30px 15px 165px
    }
}
@media(max-width:400px) {
    .header-nav {
        padding:30px 0 165px
    }
}
.header-nav-menu {
    display:-webkit-flex;
    display:flex;
    height:100%;
    -webkit-justify-content:flex-end;
    justify-content:flex-end;
    margin:-1px 0 0
}
@media(max-width:998px) {
    .header-nav-menu {
        display:block;
        margin:0;
        overflow-y:auto
    }
}
.header-nav-item {
    -webkit-align-items:center;
    align-items:center;
    background-color:#fff;
    display:-webkit-flex;
    display:flex;
    padding-left:30px;
    padding-right:30px
}
@media(max-width:1500px) {
    .header-nav-item {
        padding-left:20px;
        padding-right:20px
    }
}
@media(max-width:1399px) {
    .header-nav-item {
        padding-left:15px;
        padding-right:15px
    }
}
@media(max-width:1274px)and (min-width:999px) {
    .header-nav-item {
        padding-left:10px;
        padding-right:10px
    }
}
@media(max-width:998px) {
    .header-nav-item {
        display:block;
        margin-bottom:30px!important
    }
}
@media(hover:hover) {
    .header-nav-item:hover .header-nav-link {
        color:var(--light)
    }
    .header-nav-item:hover .header-nav-dropdown-menu {
        box-shadow:0 0 50px rgba(34,32,89,.1);
        -webkit-transform:translateY(119px);
        transform:translateY(119px);
        transition:.5s ease,box-shadow .4s ease .5s
    }
}
@media(hover:hover)and (max-width:1600px) {
    .header-nav-item:hover .header-nav-dropdown-menu {
        -webkit-transform:translateY(85px);
        transform:translateY(85px)
    }
}
@media(hover:hover)and (max-width:998px) {
    .header-nav-item:hover .header-nav-dropdown-menu {
        max-height:-webkit-fit-content;
        max-height:-moz-fit-content;
        max-height:fit-content;
        -webkit-transform:none;
        transform:none
    }
}
.header-nav-item.open .header-nav-dropdown-button:after {
    -webkit-transform:rotate(-180deg) translateY(50%);
    transform:rotate(-180deg) translateY(50%)
}
.header-nav-item.open .header-nav-dropdown-menu {
    -webkit-transform:translateY(119px);
    transform:translateY(119px)
}
@media(max-width:1600px) {
    .header-nav-item.open .header-nav-dropdown-menu {
        -webkit-transform:translateY(85px);
        transform:translateY(85px)
    }
}
@media(max-width:998px) {
    .header-nav-item.open .header-nav-dropdown-menu {
        max-height:-webkit-fit-content;
        max-height:-moz-fit-content;
        max-height:fit-content;
        -webkit-transform:none;
        transform:none
    }
}
.header-nav-link {
    color:var(--text);
    font-size:2rem;
    font-weight:500;
    position:relative
}
@media(max-width:1600px) {
    .header-nav-link {
        font-size:1.8rem
    }
}
@media(max-width:1399px) {
    .header-nav-link {
        font-size:1.6rem
    }
}
@media(max-width:1274px)and (min-width:999px) {
    .header-nav-link {
        font-size:1.4rem
    }
}
.header-nav-link.active {
    color:var(--light)
}
.header-nav-dropdown {
    background-color:#fff
}
@media(max-width:550px) {
    .header-nav-dropdown {
        display:-webkit-flex;
        display:flex;
        -webkit-justify-content:space-between;
        justify-content:space-between
    }
}
.header-nav-dropdown-button {
    padding-right:20px
}
@media(max-width:1274px)and (min-width:999px) {
    .header-nav-dropdown-button {
        padding-right:14px
    }
}
.header-nav-dropdown-button:after {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    content:"\e910";
    font-family:custom-icons!important;
    font-size:10px;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    position:absolute;
    right:0;
    text-transform:none;
    top:50%;
    -webkit-transform:rotate(0deg) translateY(-50%);
    transform:rotate(0deg) translateY(-50%);
    transition:.35s ease
}
@media(max-width:550px) {
    .header-nav-dropdown-button:after {
        font-size:1.4rem
    }
}
.header-nav-button {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    margin-left:25px
}
@media(min-width:999px) {
    .header-nav-button {
        background-color:var(--dark)
    }
}
@media(max-width:1274px)and (min-width:999px) {
    .header-nav-button {
        margin-left:10px
    }
}
@media(max-width:998px) {
    .header-nav-button {
        margin-left:0;
        margin-top:15px
    }
}
@media(max-width:550px) {
    .header-nav-button {
        margin-top:20px
    }
}
@media(min-width:999px) {
    .header-nav-button .btn {
        background-color:var(--dark);
        color:var(--text-on-dark)
    }
}
@media(max-width:1600px) {
    .header-nav-button .btn {
        font-size:1.8rem
    }
}
@media(max-width:1500px) {
    .header-nav-button .btn {
        font-size:1.6rem
    }
    .header-nav-button .btn-arrow {
        margin-left:10px
    }
}
@media(max-width:1274px)and (min-width:999px) {
    .header-nav-button .btn {
        font-size:1.4rem;
        padding:23px 15px
    }
}
@media(max-width:550px) {
    .header-nav-button .btn {
        margin-left:auto;
        margin-right:auto
    }
}
.header-nav-dropdown-menu {
    background-color:rgba(255,255,255,.9);
    border-radius:0 0 4px 4px;
    box-shadow:0 0 0 rgba(34,32,89,0);
    margin:0 0 0 -50px;
    padding:15px 0;
    position:absolute;
    top:0;
    -webkit-transform:translateY(-100%);
    transform:translateY(-100%);
    transition:.5s ease,box-shadow .1s ease;
    z-index:-1
}
@media(max-width:998px) {
    .header-nav-dropdown-menu {
        display:none;
        margin:0;
        max-height:0;
        overflow:hidden;
        padding:0;
        position:static;
        -webkit-transform:none;
        transform:none;
        z-index:0
    }
}
.header-nav-dropdown-menu.open {
    box-shadow:0 0 50px rgba(34,32,89,.1);
    transition:.5s ease,box-shadow .4s ease .5s
}
@media(max-width:998px) {
    .header-nav-dropdown-menu.open {
        box-shadow:0 0 0 rgba(34,32,89,0);
        display:block
    }
}
.header-nav-child-link {
    color:var(--text);
    display:block;
    font-size:1.8rem;
    padding:10px 50px;
    position:relative;
    text-transform:capitalize;
    transition:all .5s
}
@media(max-width:998px) {
    .header-nav-child-link {
        padding:10px 20px
    }
}
.header-nav-child-link:hover {
    color:var(--light);
    padding-left:60px;
    padding-right:40px
}
.header-nav-child-link.active {
    color:var(--light)
}
.header-call-button {
    margin-top:60px
}
@media(min-width:999px) {
    .header-call-button {
        display:none
    }
}
.header-mobile-buttons {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    -webkit-flex:1;
    flex:1;
    -webkit-justify-content:flex-end;
    justify-content:flex-end;
    padding-right:20px
}
@media(min-width:999px) {
    .header-mobile-buttons {
        display:none
    }
}
@media(max-width:400px) {
    .header-mobile-buttons {
        padding-right:15px
    }
}
.header-broker-mobile-number {
    color:var(--dark);
    font-size:20px;
    padding:4px 2px 0
}
.header-hamburger {
    background-color:transparent;
    border:0;
    cursor:pointer;
    height:25px;
    margin-left:15px;
    padding:5px;
    width:37px
}
@media(max-width:400px) {
    .header-hamburger {
        padding:5px 0;
        width:30px
    }
}
.header-hamburger-bars {
    background-color:var(--dark);
    border-radius:5px;
    height:2px;
    position:relative;
    transition:background-color 10ms ease .3s;
    width:28px
}
.header-hamburger-bars:after,
.header-hamburger-bars:before {
    background-color:var(--dark);
    border-radius:5px;
    content:"";
    height:2px;
    left:0;
    position:absolute;
    transition:top .3s ease .35s,-webkit-transform .3s ease 50ms;
    transition:top .3s ease .35s,transform .3s ease 50ms;
    transition:top .3s ease .35s,transform .3s ease 50ms,-webkit-transform .3s ease 50ms;
    width:28px
}
.header-hamburger-bars:before {
    top:-8px
}
.header-hamburger-bars:after {
    top:8px
}
.header-hamburger.open .header-hamburger-bars {
    background-color:transparent
}
.header-hamburger.open .header-hamburger-bars:after,
.header-hamburger.open .header-hamburger-bars:before {
    top:0;
    transition:top .3s ease 50ms,-webkit-transform .3s ease .35s;
    transition:top .3s ease 50ms,transform .3s ease .35s;
    transition:top .3s ease 50ms,transform .3s ease .35s,-webkit-transform .3s ease .35s
}
.header-hamburger.open .header-hamburger-bars:before {
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg)
}
.header-hamburger.open .header-hamburger-bars:after {
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg)
}
@media(max-width:998px) {
    .header.tall {
        height:100vh
    }
    .header.open .header-nav {
        -webkit-transform:translateX(0);
        transform:translateX(0)
    }
}
.header.not-clicked .focus-black:focus {
    outline:1px auto #000
}
.header .focus-black:focus {
    outline:0
}
.footer {
    padding-bottom:60px;
    padding-top:60px
}
@media(max-width:550px) {
    .footer {
        padding-bottom:40px;
        padding-top:40px
    }
}
.footer-navigation {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    margin-bottom:40px;
    margin-left:-20px;
    margin-right:-20px
}
@media(max-width:550px) {
    .footer-navigation {
        display:none
    }
}
.footer-navigation-col {
    box-sizing:border-box;
    -webkit-flex:0 0 25%;
    flex:0 0 25%;
    padding:0 20px
}
@media(max-width:998px) {
    .footer-navigation-col {
        -webkit-flex:0 0 50%;
        flex:0 0 50%
    }
}
.footer-navigation-head {
    font-size:2.4rem;
    font-weight:600;
    line-height:2.4rem;
    margin-bottom:20px!important
}
.footer-navigation-head a {
    color:var(--text);
    font-size:2.4rem;
    line-height:2.4rem
}
.footer-navigation-head a:hover {
    color:var(--light)
}
.footer-navigation-item,
.footer-navigation-item a {
    font-size:1.8rem;
    line-height:2.8rem
}
.footer-navigation-item a {
    color:var(--text)
}
.footer-navigation-item a:hover {
    color:var(--light)
}
.footer-bottom {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    margin-top:60px
}
@media(max-width:998px) {
    .footer-bottom {
        -webkit-flex-wrap:wrap;
        flex-wrap:wrap;
        margin-top:30px
    }
}
@media(max-width:550px) {
    .footer-bottom {
        margin-top:0
    }
}
.footer-bottom-copy {
    box-sizing:border-box;
    -webkit-flex:0 0 50%;
    flex:0 0 50%;
    padding-right:20px
}
@media(max-width:998px) {
    .footer-bottom-copy {
        -webkit-flex:0 0 100%;
        flex:0 0 100%;
        -webkit-order:2;
        order:2;
        padding-right:0
    }
}
@media(max-width:550px) {
    .footer-bottom-copy {
        text-align:center
    }
}
.footer-bottom-copy-span {
    display:inline-block;
    opacity:.5
}
@media(max-width:550px) {
    .footer-bottom-copy-span {
        display:block;
        margin-bottom:15px
    }
}
.footer-bottom-copy-span:after {
    content:" | "
}
@media(max-width:550px) {
    .footer-bottom-copy-span:after {
        content:none
    }
}
.footer-bottom-copy-span:last-child:after {
    content:none
}
.footer-bottom-copy a {
    color:var(--text);
    font-size:1.4rem;
    line-height:1.4rem
}
.footer-bottom-copy a:hover {
    opacity:1
}
.footer-bottom-copy p {
    margin-bottom:0
}
.footer-bottom-contacts {
    box-sizing:border-box;
    -webkit-flex:0 0 50%;
    flex:0 0 50%;
    padding-left:20px
}
@media(max-width:998px) {
    .footer-bottom-contacts {
        -webkit-flex:0 0 100%;
        flex:0 0 100%;
        margin-bottom:20px;
        -webkit-order:1;
        order:1;
        padding-left:0
    }
}
.footer-bottom-socials {
    margin-bottom:10px
}
@media(max-width:550px) {
    .footer-bottom-socials {
        text-align:center
    }
}
.footer-bottom-social-link {
    color:var(--text);
    font-size:3rem;
    margin-right:15px
}
@media(max-width:550px) {
    .footer-bottom-social-link {
        margin-left:8px;
        margin-right:8px
    }
}
.footer-bottom-social-link:hover {
    color:var(--light)
}
.footer-bottom-link {
    display:-webkit-flex;
    display:flex
}
@media(max-width:550px) {
    .footer-bottom-link {
        display:block;
        text-align:center
    }
}
.footer-bottom-link-seperator {
    font-size:2.4rem;
    line-height:2.4rem;
    margin-left:20px;
    margin-right:20px
}
@media(max-width:1274px) {
    .footer-bottom-link-seperator {
        font-size:1.8rem;
        line-height:2.2rem;
        margin-left:10px;
        margin-right:10px
    }
}
@media(max-width:550px) {
    .footer-bottom-link-seperator {
        display:none
    }
}
.footer-bottom-link-contact-us a {
    color:var(--text)
}
@media(max-width:1274px) {
    .footer-bottom-link h4 {
        font-size:1.8rem;
        line-height:2.2rem
    }
}
.footer-addresses-container {
    grid-gap:30px;
    display:grid;
    gap:30px;
    grid-template-columns:repeat(3,1fr);
    margin-top:60px
}
@media(max-width:998px) {
    .footer-addresses-container {
        grid-gap:20px;
        gap:20px;
        grid-template-columns:repeat(2,1fr);
        margin-top:40px
    }
}
@media(max-width:550px) {
    .footer-addresses-container {
        grid-gap:20px;
        gap:20px;
        grid-template-columns:1fr
    }
}
.footer .business-address-directions a {
    text-decoration:underline!important
}
.footer .business-address-card {
    box-sizing:border-box
}
.footer .business-address-name {
    font-size:2.4rem;
    font-weight:600;
    line-height:2.4rem;
    margin-bottom:20px!important
}
.footer .business-address-directions,
.footer .business-address-email,
.footer .business-address-line,
.footer .business-address-phone {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    font-size:1.8rem;
    line-height:2.8rem;
    margin-bottom:10px
}
.footer .business-address-directions .custom-icon,
.footer .business-address-email .custom-icon,
.footer .business-address-line .custom-icon,
.footer .business-address-phone .custom-icon {
    color:var(--light);
    margin-right:8px
}
.footer a:hover {
    color:#000
}
.footer .text-center {
    padding-top:10px;
    text-align:center
}
.modal {
    -webkit-overflow-scrolling:touch;
    -webkit-align-items:center;
    align-items:center;
    background:rgba(0,0,0,.9);
    bottom:0;
    box-sizing:border-box;
    cursor:pointer;
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column;
    left:0;
    opacity:0;
    overflow-y:scroll;
    padding-top:8vh;
    position:fixed;
    right:0;
    top:0;
    -webkit-user-select:none;
    user-select:none;
    visibility:hidden;
    z-index:1000
}
@media(max-width:540px) {
    .modal {
        display:block;
        padding-top:60px;
        top:0;
        width:100%
    }
}
@supports((-webkit-backdrop-filter:blur(12px)) or (backdrop-filter:blur(12px))) {
    .modal .modal:before {
        -webkit-backdrop-filter:blur(18px);
        backdrop-filter:blur(18px);
        bottom:0;
        content:"";
        left:0;
        pointer-events:none;
        position:fixed;
        right:0;
        top:0
    }
}
.modal.visible {
    opacity:1;
    visibility:visible
}
.modal.visible .modal-box {
    -webkit-animation:scale .2s cubic-bezier(.68,-.55,.265,1.55) forwards;
    animation:scale .2s cubic-bezier(.68,-.55,.265,1.55) forwards
}
.modal-close {
    background-color:transparent;
    border:none;
    color:#fff;
    cursor:pointer;
    padding:0;
    position:fixed;
    right:120px;
    top:120px;
    z-index:1000
}
@media(max-width:1399px) {
    .modal-close {
        right:90px;
        top:90px
    }
}
@media(max-width:1274px) {
    .modal-close {
        right:60px;
        top:60px
    }
}
@media(max-width:768px) {
    .modal-close {
        right:20px;
        top:20px
    }
}
.modal-close:before {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    content:"\e904";
    font-family:custom-icons!important;
    font-size:32px;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    text-transform:none
}
.modal-close:hover {
    color:#fff
}
.modal-box {
    background:#fff;
    cursor:auto;
    -webkit-flex-shrink:0;
    flex-shrink:0;
    opacity:1;
    position:relative;
    width:60%;
    will-change:transform,opacity
}
@media(max-width:550px) {
    .modal-box {
        border-radius:0;
        width:auto
    }
}
.modal-box-content {
    padding:30px
}
@media(max-width:768px) {
    .modal-box-content {
        padding:60px 0
    }
}
@-webkit-keyframes scale {
    0% {
        opacity:0;
        -webkit-transform:scale(.9);
        transform:scale(.9)
    }
    to {
        opacity:1;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
@keyframes scale {
    0% {
        opacity:0;
        -webkit-transform:scale(.9);
        transform:scale(.9)
    }
    to {
        opacity:1;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
.pagination-container {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center;
    margin-bottom:60px;
    margin-top:90px
}
@media(max-width:768px) {
    .pagination-container {
        -webkit-flex-wrap:wrap;
        flex-wrap:wrap;
        -webkit-justify-content:center;
        justify-content:center;
        margin-top:60px
    }
}
@media(max-width:400px) {
    .pagination-container {
        border-bottom-right-radius:8px;
        border-top-right-radius:8px;
        overflow:hidden
    }
}
.pagination-link {
    background-color:var(--light-back);
    box-sizing:border-box;
    color:var(--text);
    display:block;
    height:100%;
    min-width:72px;
    padding:22px 25px;
    text-align:center
}
@media(max-width:998px) {
    .pagination-link {
        font-size:1.8rem;
        line-height:2.8rem;
        min-width:60px;
        padding:10px 15px
    }
}
@media(max-width:550px) {
    .pagination-link {
        font-size:1.6rem;
        min-width:50px;
        padding:10px
    }
}
@media(max-width:400px) {
    .pagination-link {
        min-width:40px;
        padding:7px
    }
}
@media(hover:hover) {
    .pagination-link:hover {
        background-color:var(--light);
        color:var(--text-on-light)
    }
}
.pagination-link-current,
.pagination-link-current:hover {
    background-color:var(--dark);
    color:var(--text-on-dark)
}
.pagination-seperator-ellipse {
    background-color:var(--grey);
    box-sizing:border-box;
    color:var(--text-on-grey);
    display:block;
    height:100%;
    padding:22px 25px
}
@media(max-width:998px) {
    .pagination-seperator-ellipse {
        padding:10px 15px
    }
}
@media(max-width:550px) {
    .pagination-seperator-ellipse {
        padding:10px
    }
}
@media(max-width:400px) {
    .pagination-seperator-ellipse {
        padding:7px
    }
    .pagination-button {
        display:none
    }
}
.pagination-next,
.pagination-prev {
    font-size:2.6rem;
    line-height:2.4rem;
    transition:.35s ease;
    vertical-align:middle
}
@media(max-width:998px) {
    .pagination-next,
    .pagination-prev {
        font-size:2.4rem;
        line-height:2.1rem
    }
}
@media(max-width:550px) {
    .pagination-next,
    .pagination-prev {
        font-size:2.1rem
    }
}
.pagination-next:hover,
.pagination-prev:hover {
    text-decoration:none
}
.pagination-next:after,
.pagination-prev:after {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    content:"";
    content:"\e900";
    font-family:custom-icons!important;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    line-height:29px;
    text-transform:none
}
.pagination-prev:hover {
    text-decoration:none
}
.pagination-prev:after {
    display:block;
    -webkit-transform:rotate(-180deg);
    transform:rotate(-180deg)
}
.pagination-next:hover {
    text-decoration:none
}
.pagination-next:after {
    display:block
}
.pagination ul {
    display:-webkit-flex;
    display:flex;
    list-style:none;
    margin:0;
    padding-left:0
}
.pagination li:first-child .pagination-link {
    border-bottom-left-radius:8px;
    border-top-left-radius:8px
}
.pagination li:last-child .pagination-link {
    border-bottom-right-radius:8px;
    border-top-right-radius:8px
}
.VueCarousel .VueCarousel-dot {
    background-color:var(--dark)!important;
    opacity:.15
}
.VueCarousel .VueCarousel-dot--active {
    opacity:1
}
@-webkit-keyframes loader {
    0% {
        width:0
    }
    20% {
        width:10%
    }
    25% {
        width:24%
    }
    43% {
        width:41%
    }
    56% {
        width:50%
    }
    66% {
        width:52%
    }
    71% {
        width:60%
    }
    75% {
        width:76%
    }
    94% {
        width:86%
    }
    to {
        width:100%
    }
}
@keyframes loader {
    0% {
        width:0
    }
    20% {
        width:10%
    }
    25% {
        width:24%
    }
    43% {
        width:41%
    }
    56% {
        width:50%
    }
    66% {
        width:52%
    }
    71% {
        width:60%
    }
    75% {
        width:76%
    }
    94% {
        width:86%
    }
    to {
        width:100%
    }
}
.progress-bar {
    border-radius:60px;
    overflow:hidden;
    width:100%
}
.progress-bar span {
    display:block
}
.bar {
    background:rgba(0,0,0,.075)
}
.progress {
    -webkit-animation:loader 8s ease infinite;
    animation:loader 8s ease infinite;
    background:var(--light);
    color:#fff;
    padding:5px;
    width:0
}
.progress-bar {
    margin-top:30px
}
.progress-bar-hidden {
    display:none
}
#alertBanner {
    bottom:0;
    display:none;
    position:fixed;
    width:100%;
    z-index:3000
}
#alertBanner .content {
    background-color:var(--light);
    color:var(--text-on-light);
    font-size:1.6rem;
    padding:1rem;
    position:relative;
    text-align:center;
    width:100%;
    z-index:1000
}
#alertBanner .content button {
    background-color:var(--dark);
    border:0;
    border-radius:3px;
    color:var(--text-on-dark);
    margin-left:2rem;
    padding:.5rem 1rem
}
#alertBanner .content button:hover {
    cursor:pointer
}
.rich-text {
    margin:auto;
    max-width:980px!important
}
.responsive-table-wrapper,
.responsive-table-wrapper div {
    font-size:1.6rem
}
@media(max-width:998px) {
    .responsive-table-wrapper td {
        min-width:200px
    }
}
.base-layout .rich-text a {
    color:var(--link)
}
@media(min-width:769px) {
    .blog-article-layout .rich-text {
        margin-left:auto;
        margin-right:auto;
        padding-left:30px;
        padding-right:30px;
        width:75%
    }
}
.base-image {
    overflow:hidden;
    position:relative
}
.base-image.ratio img {
    height:100%;
    margin-bottom:-4px;
    -o-object-fit:cover;
    object-fit:cover;
    -o-object-position:center;
    object-position:center;
    width:100%
}
@media (-ms-high-contrast:active),(-ms-high-contrast:none) {
    .base-image.ratio img {
        height:auto;
        left:50%;
        max-width:300%;
        min-height:100%;
        min-width:100%;
        position:absolute;
        top:50%;
        -webkit-transform:translate(-50%,-50%);
        transform:translate(-50%,-50%);
        width:auto
    }
}
.base-image.auto-height img {
    height:auto;
    margin-bottom:-4px;
    width:100%
}
.base-back-image {
    background-position:50%;
    background-repeat:no-repeat;
    background-size:cover
}
.map {
    -webkit-align-items:center;
    align-items:center;
    box-sizing:border-box;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:flex-end;
    justify-content:flex-end;
    min-height:530px;
    padding-bottom:60px;
    padding-top:60px
}
@media(max-width:768px) {
    .map {
        margin-bottom:40px;
        padding-bottom:0;
        padding-top:250px
    }
}
.map-overlay {
    background-color:var(--dark);
    height:100%;
    left:0;
    opacity:.25;
    position:absolute;
    top:0;
    width:100%;
    z-index:2
}
@media(max-width:768px) {
    .map-overlay {
        height:350px
    }
}
.map-pin {
    background-image:url(/assets/images/map-pin.png);
    background-position:50%;
    background-repeat:no-repeat;
    background-size:contain;
    height:60px;
    left:50%;
    position:absolute;
    top:50%;
    -webkit-transform:translate(-50%,-78%);
    transform:translate(-50%,-78%);
    width:55px;
    z-index:1
}
@media(max-width:768px) {
    .map-pin {
        top:175px;
        width:45px
    }
}
.map-image {
    background-position:50%;
    background-size:cover;
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%
}
@media(max-width:768px) {
    .map-image {
        height:350px
    }
}
.map-carousel-init .VueCarousel-slide:first-child {
    opacity:1!important
}
.map-items {
    background-color:#fff;
    box-shadow:0 0 50px rgba(34,32,89,.1);
    box-sizing:border-box;
    margin-left:auto;
    max-width:280px;
    padding:40px;
    position:relative;
    text-align:center;
    width:100%;
    z-index:3
}
@media(max-width:768px) {
    .map-items {
        margin-right:auto
    }
}
.map-item-photo {
    margin-bottom:20px
}
.map-item-photo img {
    border-radius:50%;
    height:120px;
    margin-left:auto;
    margin-right:auto;
    width:120px
}
.map-item-name {
    font-weight:500
}
.map-address {
    line-height:2.2rem;
    margin-bottom:20px
}
.map-phone {
    color:var(--text);
    display:block;
    font-size:1.6rem;
    font-weight:500;
    left:0;
    line-height:1.6rem;
    margin-bottom:30px;
    margin-top:20px;
    opacity:1;
    position:relative;
    transition:.35s ease
}
.map-phone-transition {
    left:-15px;
    opacity:0;
    transition:.2s ease
}
.map .VueCarousel {
    margin-bottom:20px
}
.map .VueCarousel-slide {
    transition:.3s ease
}
.map .VueCarousel-slide[aria-hidden=true] {
    opacity:0
}
.map .VueCarousel-slide.VueCarousel-slide-active {
    opacity:1
}
.map .VueCarousel-navigation-button {
    top:60px!important
}
.map .VueCarousel-navigation-button .custom-icon {
    font-size:20px
}
.map .VueCarousel-navigation-prev {
    left:-22px!important;
    -webkit-transform:translateY(-50%)!important;
    transform:translateY(-50%)!important
}
.map .VueCarousel-navigation-prev .custom-icon:before {
    display:block;
    -webkit-transform:rotate(180deg);
    transform:rotate(180deg)
}
.map .VueCarousel-navigation-next {
    right:-22px!important;
    -webkit-transform:translateY(-50%)!important;
    transform:translateY(-50%)!important
}
.calculator {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .calculator {
        margin-bottom:40px;
        margin-top:40px
    }
}
@media(max-width:998px) {
    .calculator-container {
        display:block!important
    }
}
.calculator-content {
    margin-top:60px
}
@media(max-width:998px) {
    .calculator-content {
        margin-bottom:40px;
        margin-top:0
    }
}
.calculator-title {
    margin-bottom:20px;
    max-width:311px
}
@media(max-width:768px) {
    .calculator-title {
        max-width:490px
    }
    .calculator-title h3 {
        font-size:3rem;
        line-height:3rem
    }
}
.calculator-text {
    max-width:490px
}
.calculator-button {
    margin-top:30px
}
@media(max-width:768px) {
    .calculator-button {
        margin-top:20px
    }
}
@media(max-width:360px) {
    .calculator-iframe {
        margin-left:-20px;
        margin-right:-20px
    }
}
.content-title {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .content-title {
        margin-bottom:40px;
        margin-top:40px
    }
}
.content-title-content {
    margin-left:auto;
    margin-right:auto;
    max-width:600px;
    text-align:center
}
.content-title-title {
    margin-bottom:20px
}
@media(max-width:768px) {
    .content-title-title {
        margin-bottom:10px
    }
}
.content-title-button {
    margin-top:30px
}
@media(max-width:768px) {
    .content-title-button {
        margin-top:20px
    }
}
.header-image-content {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .header-image-content {
        margin-bottom:40px;
        margin-top:40px
    }
}
@media(max-width:550px) {
    .header-image-content {
        height:160px;
        overflow:hidden;
        position:relative
    }
}
.header-image-image {
    width:100%
}
@media(max-width:550px) {
    .header-image-image {
        left:50%;
        position:absolute;
        -webkit-transform:translateX(-50%);
        transform:translateX(-50%);
        width:600px
    }
}
.cta-callout-content {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .cta-callout-content {
        margin-bottom:80px;
        margin-top:80px
    }
}
.cta-callout-head {
    -webkit-align-items:flex-end;
    align-items:flex-end;
    display:-webkit-flex;
    display:flex
}
.cta-callout-title {
    -webkit-flex:0 0 350px;
    flex:0 0 350px
}
@media(max-width:768px) {
    .cta-callout-title {
        -webkit-flex:1;
        flex:1;
        max-width:322px
    }
    .cta-callout-title h2 {
        font-size:4rem;
        line-height:4rem
    }
}
.cta-callout-image-section {
    box-sizing:border-box;
    -webkit-flex:1;
    flex:1;
    padding-left:40px
}
@media(max-width:768px) {
    .cta-callout-image-section {
        display:none
    }
}
.cta-callout-image {
    width:100%
}
.cta-callout-buttons {
    margin-left:-10px;
    margin-right:-10px;
    margin-top:20px
}
.cta-callout-buttons .btn {
    margin:10px
}
.cta-callout.max-width .cta-callout-content {
    margin-left:auto;
    margin-right:auto;
    max-width:603px
}
@media(max-width:1274px) {
    .cta-callout.full-width .cta-callout-content {
        margin-left:auto;
        margin-right:auto;
        max-width:603px
    }
    .cta-callout.full-width .cta-callout-image {
        display:none
    }
}
.ebook-container {
    display:grid;
    grid-template-areas:"title image" "text image" "button image";
    grid-template-columns:auto 350px;
    grid-template-rows:auto auto 1fr;
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .ebook-container {
        grid-template-areas:"title image" "text text" "button button";
        grid-template-columns:auto 225px
    }
}
@media(max-width:550px) {
    .ebook-container {
        grid-template-columns:auto 180px
    }
}
@media(max-width:450px) {
    .ebook-container {
        grid-template-areas:"image" "title" "text" "button";
        grid-template-columns:auto
    }
}
.ebook-title {
    grid-area:title;
    margin-bottom:20px;
    max-width:350px
}
@media(max-width:768px) {
    .ebook-title {
        -webkit-align-self:end;
        align-self:end;
        max-width:354px
    }
    .ebook-title h2 {
        font-size:4rem;
        line-height:4rem
    }
}
.ebook-text {
    grid-area:text;
    max-width:502px
}
@media(max-width:768px) {
    .ebook-text {
        max-width:unset
    }
}
.ebook-image-section {
    grid-area:image;
    padding-left:40px
}
@media(max-width:450px) {
    .ebook-image-section {
        max-width:180px;
        padding-left:0
    }
}
.ebook-image {
    width:100%
}
.ebook-button {
    align-self:start;
    grid-area:button;
    margin-top:20px
}
.ebook-modal-head {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    margin-bottom:30px
}
@media(max-width:998px) {
    .ebook-modal-head {
        display:block
    }
}
.ebook-modal-text {
    -webkit-flex:1;
    flex:1;
    width:100%
}
.ebook-modal-image {
    box-sizing:border-box;
    -webkit-flex:0 0 175px;
    flex:0 0 175px;
    padding-left:15px
}
.ebook-modal-image img {
    max-width:100%
}
.ebook-modal-success {
    color:#fff;
    text-align:center
}
.ebook-modal-success-icon {
    display:block;
    font-size:45px;
    margin-bottom:20px
}
.ebook-modal-success-title {
    margin-bottom:15px
}
.ebook-modal-success a,
.ebook-modal-success button {
    background-color:transparent;
    border:0;
    color:#fff;
    font-weight:600;
    padding:0;
    text-decoration:underline
}
@media(hover:hover) {
    .ebook-modal-success a,
    .ebook-modal-success button {
        opacity:.75
    }
}
.ebook .modal-ebook-container {
    padding:0;
    scroll-behavior:smooth
}
.ebook .modal-ebook-container .modal-box {
    background-color:transparent;
    display:-webkit-flex;
    display:flex;
    min-height:100vh;
    width:100%
}
.ebook .modal-ebook-container .modal-box-content {
    margin:auto;
    padding:60px 30px;
    width:60%
}
@media(max-width:768px) {
    .ebook .modal-ebook-container .modal-box-content {
        width:75%
    }
}
@media(max-width:550px) {
    .ebook .modal-ebook-container .modal-box-content {
        width:100%
    }
}
.ebook .modal-ebook-container .modal-wrapper {
    margin:auto;
    max-width:767px
}
.ebook .modal-ebook-container .modal-content-wrapper {
    background-color:var(--grey);
    box-sizing:border-box;
    color:var(--text-on-grey);
    padding:45px 60px 30px;
    transition:.35s ease
}
.ebook .modal-ebook-container .modal-content-wrapper .btn-secondary {
    border-color:var(--text-on-grey);
    color:var(--text-on-grey)
}
.ebook .modal-ebook-container .modal-content-wrapper.success {
    background-color:var(--light);
    color:var(--text-on-light);
    padding:60px
}
.ebook .modal-ebook-container .field-validation-error {
    color:#ef4444;
    display:inline-block;
    font-size:1.6rem;
    line-height:2.6rem;
    padding-top:5px
}
.ebook .modal-ebook-container .ebook-form-message {
    font-size:1.6rem;
    line-height:2.6rem;
    margin:auto
}
.checklist {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-justify-content:center;
    justify-content:center;
    margin-bottom:40px;
    margin-top:40px
}
@media(max-width:768px) {
    .checklist {
        display:block;
        margin-bottom:14px;
        margin-top:14px
    }
}
.checklist-item {
    display:-webkit-flex;
    display:flex;
    margin:20px
}
@media(max-width:768px) {
    .checklist-item {
        -webkit-align-items:center;
        align-items:center;
        margin:26px 0
    }
}
.checklist-tick {
    color:var(--light);
    font-size:24px;
    margin-right:10px
}
.checklist-text {
    font-weight:500;
    margin-bottom:0
}
.top-tip-content {
    border:1.4px dashed var(--light);
    box-sizing:border-box;
    margin:100px auto;
    max-width:600px;
    padding:60px 60px 45px
}
@media(max-width:550px) {
    .top-tip-content {
        margin:40px auto;
        padding:30px 30px 15px
    }
}
.top-tip-title {
    margin-bottom:30px
}
.top-tip-title .fill-light {
    fill:var(--light)
}
.top-tip-title .fill-text {
    fill:var(--text)
}
.top-tip-description {
    margin-bottom:30px
}
.top-tip-description p {
    font-size:1.8rem;
    font-weight:500;
    line-height:2.8rem
}
.banner {
    margin-bottom:100px;
    margin-top:100px;
    text-align:center
}
@media(max-width:768px) {
    .banner {
        margin-bottom:60px;
        margin-top:60px
    }
}
.banner-title {
    margin-bottom:20px
}
@media(max-width:768px) {
    .banner-title h2 {
        font-size:4rem;
        line-height:4rem
    }
}
@media(max-width:550px) {
    .banner-title h2 {
        font-size:7vw;
        line-height:1.25
    }
}
@media(max-width:768px) {
    .banner-text h5 {
        font-size:2rem;
        line-height:3rem
    }
}
.banner a {
    color:var(--light);
    opacity:1
}
.banner a:hover {
    opacity:.5
}
.office-bio-container {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .office-bio-container {
        display:block;
        margin-bottom:80px;
        margin-top:80px
    }
}
.office-bio-content {
    margin-right:auto;
    max-width:603px;
    -webkit-order:1;
    order:1
}
.office-bio-title {
    margin-bottom:20px
}
.office-bio-image-section {
    box-sizing:border-box;
    -webkit-flex:1;
    flex:1;
    max-width:250px;
    -webkit-order:2;
    order:2;
    padding-left:40px
}
@media(max-width:998px) {
    .office-bio-image-section {
        -webkit-flex:0 0 235px;
        flex:0 0 235px
    }
}
@media(max-width:768px) {
    .office-bio-image-section {
        background-color:#f5f5f5;
        border-radius:50%;
        float:right;
        height:150px;
        margin-bottom:20px;
        margin-left:20px;
        padding-left:0;
        width:150px
    }
}
@media(max-width:550px) {
    .office-bio-image-section {
        height:100px;
        margin-bottom:12px;
        margin-left:12px;
        width:100px
    }
}
.office-bio-image {
    width:100%
}
@media(max-width:768px) {
    .office-bio-image-desktop {
        display:none
    }
}
@media(min-width:769px) {
    .office-bio-image-mobile {
        display:none
    }
}
.office-bio-button {
    margin-top:30px
}
.office-bio.no-image .office-bio-content {
    margin-left:auto
}
.broker-bio-container {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .broker-bio-container {
        display:block;
        margin-bottom:80px;
        margin-top:80px
    }
}
.broker-bio-content {
    margin-right:auto;
    max-width:603px;
    -webkit-order:1;
    order:1
}
.broker-bio-title {
    margin-bottom:20px
}
@media(max-width:768px) {
    .broker-bio-head {
        display:-webkit-flex;
        display:flex
    }
}
.broker-bio-head-image-section {
    display:none
}
@media(max-width:768px) {
    .broker-bio-head-image-section {
        background-color:var(--grey);
        border-radius:50%;
        display:block;
        height:150px;
        margin-right:20px;
        overflow:hidden;
        width:150px
    }
}
@media(max-width:550px) {
    .broker-bio-head-image-section {
        height:100px;
        width:100px
    }
}
@media(max-width:400px) {
    .broker-bio-head-image-section {
        height:80px;
        width:80px
    }
}
.broker-bio-head-image {
    width:100%
}
.broker-bio-head-links,
.broker-bio-head-titles {
    margin-bottom:20px
}
.broker-bio-head-socials {
    margin-bottom:30px;
    margin-left:-5px;
    margin-right:-5px
}
.broker-bio-head-socials a:hover {
    opacity:.75
}
.broker-bio-head-socials .custom-icon {
    font-size:2rem;
    margin:0 5px
}
.broker-bio-role {
    margin-top:5px
}
.broker-bio-mobile,
.broker-bio-number {
    color:var(--text);
    font-weight:500;
    margin-bottom:10px
}
.broker-bio-email,
.broker-bio-mobile,
.broker-bio-number {
    display:block;
    font-size:1.4rem;
    line-height:1.4rem
}
.broker-bio-image-section {
    box-sizing:border-box;
    -webkit-flex:1;
    flex:1;
    max-width:400px;
    -webkit-order:2;
    order:2;
    padding-left:40px
}
@media(max-width:998px) {
    .broker-bio-image-section {
        -webkit-flex:0 0 235px;
        flex:0 0 235px
    }
}
.broker-bio-image {
    width:100%
}
@media(max-width:768px) {
    .broker-bio-image {
        display:none
    }
}
.broker-bio-button {
    margin-top:30px
}
.broker-bio.no-image .office-bio-content {
    margin-left:auto
}
.broker-cta-container {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .broker-cta-container {
        margin-bottom:40px;
        margin-top:40px
    }
}
@media(max-width:550px) {
    .broker-cta-container {
        display:block
    }
}
.broker-cta-content {
    margin-right:auto;
    max-width:603px;
    -webkit-order:1;
    order:1
}
@media(max-width:768px) {
    .broker-cta-content {
        max-width:unset
    }
}
.broker-cta-title {
    margin-bottom:20px
}
.broker-cta-image-section {
    box-sizing:border-box;
    -webkit-flex:1;
    flex:1;
    max-width:250px;
    -webkit-order:2;
    order:2;
    padding-left:40px
}
@media(max-width:998px) {
    .broker-cta-image-section {
        -webkit-flex:0 0 235px;
        flex:0 0 235px
    }
}
@media(max-width:768px) {
    .broker-cta-image-section {
        -webkit-flex:0 0 180px;
        flex:0 0 180px;
        padding-left:20px
    }
}
@media(max-width:550px) {
    .broker-cta-image-section {
        display:block;
        margin:0 auto 40px;
        max-width:200px;
        padding-left:0
    }
}
.broker-cta-image {
    width:100%
}
.broker-cta-button {
    margin-top:30px
}
.broker-cta.no-image .broker-cta-content {
    margin-left:auto
}
.button-list-container {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-justify-content:center;
    justify-content:center;
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .button-list-container {
        margin-bottom:40px;
        margin-top:40px
    }
}
.button-list-item {
    background-color:#fff;
    border:1px solid #c3ced6;
    border-radius:4px;
    color:var(--light);
    font-size:1.6rem;
    font-weight:500;
    line-height:1.6rem;
    margin:5px;
    padding:16px 30px;
    transition:.35s ease-out
}
@media(max-width:550px) {
    .button-list-item {
        font-size:1.4rem;
        line-height:1.4rem
    }
}
.button-list-item.active {
    background-color:var(--light);
    color:var(--text-on-light)
}
@media(hover:hover) {
    .button-list-item:hover {
        background-color:var(--light);
        color:var(--text-on-light)
    }
}
.featured-blog-article {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .featured-blog-article {
        margin-bottom:40px;
        margin-top:40px
    }
}
.fba-title {
    margin-bottom:40px;
    text-align:center
}
@media(max-width:768px) {
    .fba-title {
        font-size:3rem;
        line-height:3rem;
        margin-bottom:20px
    }
}
.fba-items {
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center;
    margin-left:-30px;
    margin-right:-30px
}
@media(max-width:998px) {
    .fba-items {
        -webkit-justify-content:flex-start;
        justify-content:flex-start;
        margin-left:-60px;
        margin-right:-60px;
        overflow-x:scroll;
        overflow-y:hidden
    }
}
@media(max-width:768px) {
    .fba-items {
        margin-left:-40px;
        margin-right:-40px
    }
}
@media(max-width:400px) {
    .fba-items {
        margin-left:-20px;
        margin-right:-20px
    }
}
.fba-item {
    box-sizing:border-box;
    display:block;
    -webkit-flex:0 0 33.333%;
    flex:0 0 33.333%;
    padding:0 30px
}
@media(max-width:1274px) {
    .fba-item {
        padding:0 20px
    }
}
@media(max-width:998px) {
    .fba-item {
        box-sizing:content-box;
        -webkit-flex:0 0 50vw;
        flex:0 0 50vw
    }
}
@media(max-width:768px) {
    .fba-item {
        -webkit-flex:0 0 57vw;
        flex:0 0 57vw
    }
}
@media(max-width:550px) {
    .fba-item {
        -webkit-flex:0 0 75vw;
        flex:0 0 75vw;
        padding:0 10px
    }
}
.fba-item-image-section {
    margin-bottom:20px
}
.fba-item-image {
    width:100%
}
.fba-item-title {
    color:var(--text);
    display:block;
    font-size:2.4rem;
    font-weight:500;
    line-height:2.4rem;
    margin-bottom:20px
}
@media(max-width:998px) {
    .fba-item:first-child {
        padding-left:50px
    }
}
@media(max-width:768px) {
    .fba-item:first-child {
        padding-left:30px
    }
}
@media(max-width:550px) {
    .fba-item:first-child {
        padding-left:40px
    }
}
@media(max-width:400px) {
    .fba-item:first-child {
        padding-left:20px
    }
}
@media(max-width:998px) {
    .fba-item:last-child {
        padding-right:50px
    }
}
@media(max-width:768px) {
    .fba-item:last-child {
        padding-right:30px
    }
}
@media(max-width:550px) {
    .fba-item:last-child {
        padding-right:40px
    }
}
@media(max-width:400px) {
    .fba-item:last-child {
        padding-right:20px
    }
}
.hero-container {
    overflow:hidden;
    position:relative
}
.hero-image-section {
    height:100%;
    left:0;
    overflow:hidden;
    position:absolute;
    top:0;
    width:100%
}
.hero-image {
    width:100%
}
.hero-content-container {
    -webkit-align-items:center;
    align-items:center;
    box-sizing:border-box;
    display:-webkit-flex;
    display:flex;
    margin-left:auto;
    margin-right:auto;
    max-width:1440px;
    min-height:500px;
    padding-bottom:40px;
    padding-top:40px;
    position:relative;
    width:100%;
}
@media(min-width:1275px) {
    .hero-content-container {
        padding-left:90px;
        padding-right:90px
    }
}
@media(max-width:1274px)and (min-width:769px) {
    .hero-content-container {
        padding-left:60px;
        padding-right:60px
    }
}
@media(max-width:768px) {
    .hero-content-container {
        padding-left:40px;
        padding-right:40px
    }
}
@media(max-width:400px) {
    .hero-content-container {
        padding-left:20px;
        padding-right:20px
    }
}
@media(max-width:768px) {
    .hero-content-container {
        min-height:425px
    }
}
@media(max-width:550px) {
    .hero-content-container {
        -webkit-align-items:flex-end;
        align-items:flex-end;
        min-height:380px
    }
}
.hero-content {
    background-color: red;
}

.hero-text {
    max-width:318px;
    position:relative;
    z-index:2;
    text-align: center;
    color: white;
}
.hero-subtext {
    color: var(--text-on-dark);
}
.hero-button-section {
    margin-top:20px;
    position:relative;
    z-index:3
}
.hero-button-section .btn {
    width: 100%;
}
.hero-button-section .admin-login-button {
    background: rgba(255, 255, 255, .86);
    border-color: var(--light);
    margin-top: 12px;
}
.hero-button-section .admin-login-button:hover {
    background: #fff;
}
.btn-hero {
    background-color: white;
    color: black;
}

.hero.text-background .hero-text:after {
    background:#fff;
    content:"";
    -webkit-filter:blur(45px);
    filter:blur(45px);
    height:150%;
    left:50%;
    opacity:.9;
    position:absolute;
    top:50%;
    -webkit-transform:translate(-57%,-46%);
    transform:translate(-57%,-46%);
    width:150%;
    z-index:-1;
}
.hero.layout-centre .hero-image,
.hero.layout-left .hero-image,
.hero.layout-right .hero-image {
    background-position:50%;
    background-size:cover;
    height:100%
}
@media(max-width:768px) {
    .hero.layout-centre .hero-image,
    .hero.layout-left .hero-image,
    .hero.layout-right .hero-image {
        display:none
    }
}
.hero.layout-centre .hero-image-mobile,
.hero.layout-left .hero-image-mobile,
.hero.layout-right .hero-image-mobile {
    display:none
}
@media(max-width:768px) {
    .hero.layout-centre .hero-image-mobile,
    .hero.layout-left .hero-image-mobile,
    .hero.layout-right .hero-image-mobile {
        background-position:50%;
        background-size:cover;
        display:block;
        height:100%;
        width:100%
    }
}
.hero.layout-right .hero-content-container {
    -webkit-justify-content:flex-end;
    justify-content:flex-end
}
@media(max-width:550px) {
    .hero.layout-right .hero-content-container {
        -webkit-justify-content:flex-start;
        justify-content:flex-start
    }
}
.hero.layout-centre .hero-content-container {
    -webkit-justify-content:center;
    justify-content:center
}
.hero.layout-centre .hero-text {
    max-width:unset;
    text-align:center
}
.hero.layout-centre .hero-text:after {
    -webkit-filter:blur(45px);
    filter:blur(45px);
    height:175%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%)
}
.hero.layout-centre .hero-button-section {
    -webkit-justify-content:center;
    justify-content:center
}
.hero.layout-person .hero-container {
    background-color:#fff;
    box-shadow:inset 0 0 50px rgba(34,33,89,.1)
}
.hero.layout-person .hero-content-container {
    max-width:1180px
}
.hero.layout-person .hero-image-section {
    box-sizing:border-box;
    left:50%;
    margin-left:auto;
    margin-right:auto;
    max-width:1180px;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    width:100%
}
@media(min-width:1275px) {
    .hero.layout-person .hero-image-section {
        padding-left:90px;
        padding-right:90px
    }
}
@media(max-width:1274px)and (min-width:769px) {
    .hero.layout-person .hero-image-section {
        padding-left:60px;
        padding-right:60px
    }
}
@media(max-width:768px) {
    .hero.layout-person .hero-image-section {
        padding-left:40px;
        padding-right:40px
    }
}
@media(max-width:400px) {
    .hero.layout-person .hero-image-section {
        -webkit-align-items:flex-end;
        align-items:flex-end;
        display:-webkit-flex;
        display:flex;
        padding-left:20px;
        padding-right:20px
    }
}
.hero.layout-person .hero-image {
    display:block;
    margin-left:auto;
    margin-right:40px;
    margin-top:40px;
    max-width:325px
}
@media(max-width:768px) {
    .hero.layout-person .hero-image {
        margin-right:0;
        max-width:270px
    }
}
@media(max-width:550px) {
    .hero.layout-person .hero-image {
        margin-right:-85px;
        margin-top:25px;
        max-width:220px
    }
}
@media(max-width:400px) {
    .hero.layout-person .hero-image {
        margin-right:-72px;
        max-width:200px
    }
    .hero.layout-person .hero-text {
        max-width:179px
    }
}
.hero.layout-team .hero-content-container {
    -webkit-align-items:flex-start;
    align-items:flex-start;
    -webkit-justify-content:center;
    justify-content:center;
    min-height:unset;
    padding-top:60px
}
.hero.layout-team .hero-text {
    max-width:unset;
    text-align:center
}
.hero.layout-team .hero-text:after {
    -webkit-filter:blur(45px);
    filter:blur(45px);
    height:175%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%)
}
.hero.layout-team .hero-button-section {
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center
}
.hero.layout-team .hero-container {
    background-color:#fff;
    box-shadow:inset 0 0 50px rgba(34,33,89,.1)
}
.hero.layout-team .hero-image-section {
    left:50%;
    max-width:1440px;
    position:relative;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%)
}
.hero .hero-buttons-wrapper {
    grid-gap:1rem;
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    gap:1rem
}
.hero .hero-buttons-wrapper.buttons-left {
    -webkit-justify-content:flex-start;
    justify-content:flex-start
}
.hero .hero-buttons-wrapper.buttons-right {
    -webkit-justify-content:flex-end;
    justify-content:flex-end
}
.hero .hero-buttons-wrapper.buttons-centre {
    -webkit-justify-content:center;
    justify-content:center
}
.comparison {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .comparison {
        margin-bottom:40px;
        margin-top:40px
    }
}
.comparison-title {
    margin-bottom:-45px;
    margin-right:420px
}
@media(max-width:998px) {
    .comparison-title {
        margin-right:320px
    }
}
@media(max-width:768px) {
    .comparison-title {
        margin-right:110px
    }
}
@media(max-width:550px) {
    .comparison-title {
        margin-bottom:20px;
        margin-right:60px
    }
}
.comparison-content {
    position:relative
}
.comparison-content:after {
    border-radius:4px;
    content:"";
    height:100%;
    position:absolute;
    right:200px;
    top:0;
    width:200px;
    z-index:1
}
@media(max-width:998px) {
    .comparison-content:after {
        right:150px;
        width:150px
    }
}
@media(max-width:768px) {
    .comparison-content:after {
        right:90px;
        width:90px
    }
}
@media(max-width:400px) {
    .comparison-content:after {
        right:75px;
        width:75px
    }
}
.comparison-content table {
    border-spacing:0;
    position:relative;
    width:100%;
    z-index:2
}
.comparison-content p {
    font-size:1.8rem;
    line-height:2.2rem
}
@media(max-width:768px) {
    .comparison-content p {
        font-size:1.6rem
    }
}
@media(max-width:400px) {
    .comparison-content p {
        font-size:1.4rem
    }
}
.comparison-content a {
    font-size:1.2rem;
    line-height:1.2rem;
    opacity:.5;
    text-decoration:underline
}
.comparison-content a:hover {
    opacity:.75;
    text-decoration:none
}
.comparison-header {
    box-sizing:border-box;
    font-size:2rem;
    font-weight:500;
    line-height:2rem;
    padding:40px 20px;
    text-align:center;
    width:200px
}
@media(max-width:998px) {
    .comparison-header {
        font-size:1.8rem;
        padding:25px 15px;
        width:150px
    }
}
@media(max-width:768px) {
    .comparison-header {
        font-size:1.6rem;
        padding:16px 10px;
        width:90px
    }
}
@media(max-width:400px) {
    .comparison-header {
        font-size:1.4rem;
        padding:16px 8px;
        width:75px
    }
}
.comparison-main-header {
    background-color:var(--light);
    border-top-left-radius:4px;
    border-top-right-radius:4px;
    color:var(--text-on-light)
}
.comparison-col-text {
    padding-bottom:20px;
    padding-right:20px;
    padding-top:20px
}
.comparison-col-text p {
    margin-bottom:0
}
.comparison-col-icon {
    text-align:center
}
.comparison-col-icon .custom-icon {
    font-size:28px
}
.comparison-col-icon .i-tick {
    color:var(--light)
}
.comparison-learn {
    margin-top:20px
}
.comparison-btn {
    margin-top:40px;
    text-align:center
}
.scheme-dark .comparison-title {
    max-width:285px
}
.scheme-dark .comparison-content:after {
    box-shadow:0 4px 50px rgba(0,0,0,.35)
}
@media(max-width:768px) {
    .scheme-dark .comparison-content:after {
        box-shadow:0 4px 40px rgba(0,0,0,.35)
    }
}
.scheme-dark .comparison-content a {
    color:var(--link-on-dark)
}
.scheme-dark .comparison-content tbody tr td:nth-child(2) {
    background-color:var(--dark);
    -webkit-filter:brightness(122%);
    filter:brightness(122%)
}
.scheme-dark .comparison-content tbody tr:last-child td:nth-child(2) {
    border-bottom-left-radius:4px;
    border-bottom-right-radius:4px
}
.scheme-dark .comparison-content tr td {
    border-top:1px solid rgba(0,0,0,.2)
}
.scheme-dark .comparison-col-icon .i-cross {
    color:var(--text-on-dark);
    opacity:.35
}
@media(min-width:769px) {
    .scheme-light .comparison-title h2 {
        font-size:4rem;
        line-height:4rem
    }
}
.scheme-light .comparison-content:after {
    box-shadow:0 0 50px rgba(34,33,89,.2)
}
@media(max-width:768px) {
    .scheme-light .comparison-content:after {
        box-shadow:0 0 40px rgba(34,33,89,.2)
    }
}
.scheme-light .comparison-content a {
    color:var(--text)
}
.scheme-light .comparison-content tr td {
    box-shadow:inset 0 1px 0 rgba(34,33,89,.1)
}
.scheme-light .comparison-col-icon .i-cross {
    color:var(--text);
    opacity:.25
}
.newsletter {
    margin-bottom:100px;
    margin-top:100px;
    text-align:center
}
@media(max-width:768px) {
    .newsletter {
        margin-bottom:40px;
        margin-top:40px
    }
}
.newsletter-title {
    margin-bottom:20px
}
.newsletter-form {
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center
}
.newsletter-back {
    -webkit-align-items:center;
    align-items:center;
    background-color:rgba(0,0,0,.15);
    border-radius:4px;
    display:-webkit-flex;
    display:flex;
    max-width:590px;
    padding:6px;
    width:100%
}
.newsletter-input {
    background-color:transparent;
    border:0;
    box-sizing:border-box;
    color:#fff;
    -webkit-flex:1;
    flex:1;
    font-size:1.6rem;
    font-weight:500;
    height:60px;
    padding:20px
}
@media(max-width:400px) {
    .newsletter-input {
        padding:20px 10px
    }
}
.newsletter-input:focus {
    outline:0
}
.newsletter-input::-webkit-input-placeholder {
    color:#fff;
    opacity:.75
}
.newsletter-input::placeholder {
    color:#fff;
    opacity:.75
}
.newsletter-button {
    background-color:var(--light);
    border:0;
    border-radius:4px;
    box-sizing:border-box;
    color:#fff;
    font-size:1.6rem;
    font-weight:500;
    padding:18px 20px
}
@media(max-width:400px) {
    .newsletter-button {
        padding:16px
    }
}
.newsletter-button-text {
    display:inline-block;
    margin-right:10px
}
@media(max-width:550px) {
    .newsletter-button-text {
        display:none
    }
}
.newsletter-button:focus {
    outline:0
}
.newsletter-button:focus .custom-icon {
    left:3px
}
@media(hover:hover) {
    .newsletter-button:hover {
        cursor:pointer
    }
    .newsletter-button:hover .custom-icon {
        left:3px
    }
}
.newsletter-button .custom-icon {
    font-size:26px;
    left:0;
    position:relative;
    transition:.35s ease;
    vertical-align:middle
}
.partner-cards {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .partner-cards {
        margin-bottom:40px;
        margin-top:40px
    }
}
.partner-cards-container {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    margin-left:-20px;
    margin-right:-20px
}
.partner-cards-item {
    box-sizing:border-box;
    -webkit-flex:0 0 50%;
    flex:0 0 50%;
    padding:20px
}
@media(max-width:998px) {
    .partner-cards-item {
        -webkit-flex:100%;
        flex:100%
    }
}
@media(max-width:400px) {
    .partner-cards-item {
        box-shadow:inset 0 -1px 0 rgba(34,33,89,.1)
    }
}
.partner-cards-content {
    background-color:#fff;
    box-shadow:0 0 50px rgba(34,32,89,.1);
    box-sizing:border-box;
    height:100%;
    padding:50px
}
@media(max-width:550px) {
    .partner-cards-content {
        padding:40px
    }
}
@media(max-width:400px) {
    .partner-cards-content {
        box-shadow:none;
        padding:20px 0
    }
}
.partner-cards-head {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    margin-bottom:30px
}
@media(max-width:768px) {
    .partner-cards-head {
        -webkit-align-items:flex-start;
        align-items:flex-start;
        -webkit-flex-direction:column;
        flex-direction:column
    }
}
.partner-cards-image {
    height:150px;
    margin-right:30px;
    -o-object-fit:contain;
    object-fit:contain;
    -o-object-position:left;
    object-position:left;
    width:150px
}
@media(max-width:1274px) {
    .partner-cards-image {
        margin-bottom:20px;
        margin-right:20px
    }
}
.partner-cards-title h4 {
    margin-bottom:0
}
.proof-points {
    margin-bottom:100px;
    margin-top:100px;
    text-align:center
}
@media(max-width:768px) {
    .proof-points {
        margin-bottom:40px;
        margin-top:40px
    }
}
.proof-points-title {
    text-align:center;
    white-space:pre-line
}
.proof-points-title h2,
.proof-points-title h3 {
    margin-bottom:20px
}
@media(max-width:768px) {
    .proof-points-title h2,
    .proof-points-title h3 {
        margin-bottom:10px
    }
}
.proof-points-text {
    margin-bottom:20px
}
@media(max-width:768px) {
    .proof-points-text {
        margin-bottom:30px
    }
}
.proof-points-item {
    box-sizing:border-box
}
@media(min-width:769px) {
    .proof-points-item {
        padding-left:15px;
        padding-right:15px
    }
}
.proof-points-item-icon {
    background-position:50%;
    background-repeat:no-repeat;
    background-size:contain;
    height:60px;
    margin-bottom:30px;
    margin-left:auto;
    margin-right:auto;
    width:60px
}
.proof-points-item-title {
    font-weight:500;
    margin-bottom:15px
}
.proof-points-button-section {
    margin-top:60px
}
@media(max-width:768px) {
    .proof-points-button-section {
        margin-top:30px
    }
}
.quicklinks {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .quicklinks {
        margin-bottom:40px;
        margin-top:40px
    }
}
.quicklinks-text,
.quicklinks-title {
    text-align:center
}
.quicklinks-items {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-justify-content:center;
    justify-content:center;
    margin-top:40px
}
@media(max-width:768px) {
    .quicklinks-items {
        margin-top:20px
    }
}
.quicklinks-item {
    box-sizing:border-box;
    -webkit-flex:0 0 33.33%;
    flex:0 0 33.33%;
    padding:15px
}
@media(max-width:998px) {
    .quicklinks-item {
        -webkit-flex:0 0 50%;
        flex:0 0 50%
    }
}
@media(max-width:768px) {
    .quicklinks-item {
        -webkit-flex:0 0 100%;
        flex:0 0 100%;
        padding:15px 0
    }
}
.quicklinks-item-link {
    box-sizing:border-box;
    color:var(--text);
    display:block;
    height:100%;
    padding:50px 90px 50px 50px;
    position:relative;
    transition:.35 ease
}
@media(max-width:1274px) {
    .quicklinks-item-link {
        padding:40px 80px 40px 40px
    }
}
@media(max-width:768px) {
    .quicklinks-item-link {
        padding:30px 70px 30px 30px
    }
}
@media(hover:hover) {
    .quicklinks-item-link:hover {
        color:var(--light);
        z-index:1
    }
    .quicklinks-item-link:hover:after {
        color:var(--light);
        opacity:1
    }
}
.quicklinks-item-link:after {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    bottom:50px;
    color:var(--dark);
    content:"\e900";
    font-family:custom-icons!important;
    font-size:26px;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    opacity:.25;
    position:absolute;
    right:50px;
    text-transform:none;
    transition:.35s ease
}
@media(max-width:1274px) {
    .quicklinks-item-link:after {
        bottom:40px;
        right:40px
    }
}
@media(max-width:768px) {
    .quicklinks-item-link:after {
        bottom:30px;
        right:30px
    }
}
.quicklinks-item-dash {
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%
}
.quicklinks-item-dash svg rect {
    stroke:var(--light)
}
.quicklinks-item-icon {
    margin-bottom:15px;
    width:32px
}
.quicklinks-item-icon svg {
    height:auto;
    width:100%
}
.quicklinks-item-icon svg path {
    fill:var(--light)!important
}
.quicklinks-item-title {
    font-weight:500;
    margin-bottom:0
}
.quicklinks-button-section {
    margin-top:40px;
    text-align:center
}
.get-in-touch {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .get-in-touch {
        margin-bottom:40px;
        margin-top:40px
    }
}
.get-in-touch-items {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-justify-content:center;
    justify-content:center;
    margin-top:40px
}
@media(max-width:768px) {
    .get-in-touch-items {
        margin-top:20px
    }
}
.get-in-touch-item {
    box-sizing:border-box;
    -webkit-flex:0 0 25%;
    flex:0 0 25%;
    padding:15px
}
@media(max-width:998px) {
    .get-in-touch-item {
        -webkit-flex:0 0 50%;
        flex:0 0 50%
    }
}
@media(max-width:550px) {
    .get-in-touch-item {
        -webkit-flex:0 0 100%;
        flex:0 0 100%;
        padding:15px 0
    }
}
.get-in-touch-item-link {
    background-color:#fff;
    box-shadow:0 0 0 rgba(34,32,89,0);
    box-sizing:border-box;
    color:var(--text);
    display:block;
    height:100%;
    padding:40px 40px 48px;
    position:relative;
    transition:.35 ease;
    z-index:1
}
@media(max-width:1274px) {
    .get-in-touch-item-link {
        padding:20px 20px 38px
    }
}
@media(max-width:998px) {
    .get-in-touch-item-link {
        padding:40px 40px 48px
    }
}
@media(max-width:768px) {
    .get-in-touch-item-link {
        padding:30px 30px 48px
    }
}
@media(hover:hover) {
    .get-in-touch-item-link:hover {
        box-shadow:0 0 50px rgba(34,32,89,.1)
    }
    .get-in-touch-item-link:hover:after {
        color:var(--light);
        opacity:1
    }
    .get-in-touch-item-link:hover:before {
        opacity:0
    }
}
.get-in-touch-item-link:before {
    border:1px solid var(--dark);
    content:"";
    height:100%;
    left:0;
    opacity:.1;
    position:absolute;
    top:0;
    transition:.35s ease;
    width:100%;
    z-index:-1
}
.get-in-touch-item-link:after {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    bottom:30px;
    color:var(--dark);
    content:"\e900";
    font-family:custom-icons!important;
    font-size:26px;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    margin-top:15px;
    opacity:.25;
    position:absolute;
    right:30px;
    text-align:right;
    text-transform:none;
    transition:.35s ease
}
@media(max-width:1274px) {
    .get-in-touch-item-link:after {
        bottom:20px;
        right:20px
    }
}
@media(max-width:998px) {
    .get-in-touch-item-link:after {
        bottom:30px;
        right:30px
    }
}
.get-in-touch-item-icon {
    margin-bottom:30px;
    width:32px
}
@media(max-width:550px) {
    .get-in-touch-item-icon {
        margin-bottom:20px
    }
}
.get-in-touch-item-icon svg {
    height:auto;
    width:100%
}
.get-in-touch-item-icon svg path {
    fill:var(--light)!important
}
.get-in-touch-item-title {
    font-weight:500;
    margin-bottom:10px
}
.video {
    margin-bottom:100px;
    margin-top:100px;
    text-align:center
}
@media(max-width:768px) {
    .video {
        margin-bottom:40px;
        margin-top:40px
    }
}
.video-head {
    margin-bottom:40px
}
.video-poster {
    background-color:transparent;
    border:0;
    padding:0;
    position:relative
}
@media(max-width:768px) {
    .video-poster {
        width:100%
    }
}
@media(hover:hover) {
    .video-poster:hover {
        cursor:pointer
    }
    .video-poster:hover:before {
        opacity:.4
    }
    .video-poster:hover .video-play-button .path4:before {
        font-size:83px
    }
}
.video-poster-image {
    background-position:50%;
    background-size:cover;
    height:364px;
    width:580px
}
@media(max-width:768px) {
    .video-poster-image {
        height:55vw;
        width:100%
    }
}
.video-poster:before {
    background-color:var(--dark);
    content:"";
    height:100%;
    left:0;
    opacity:.6;
    position:absolute;
    top:0;
    transition:.35s ease;
    width:100%
}
.video-play-button {
    bottom:0;
    font-size:60px;
    position:absolute;
    right:0
}
@media(max-width:768px) {
    .video-play-button {
        font-size:50px
    }
}
.video-play-button .path4:before {
    left:50%;
    margin-left:0;
    position:absolute;
    top:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    transition:.35s ease
}
.modal-video-container {
    padding:0
}
.modal-video-container .modal-box {
    background-color:transparent;
    display:-webkit-flex;
    display:flex;
    min-height:100vh;
    width:100%
}
.modal-video-container .modal-box-content {
    margin:auto;
    width:60%
}
@media(max-width:768px) {
    .modal-video-container .modal-box-content {
        width:75%
    }
}
@media(max-width:550px) {
    .modal-video-container .modal-box-content {
        width:100%
    }
}
.modal-video-container .modal-video {
    display:block;
    height:505px;
    margin:auto;
    max-width:891px;
    width:100%
}
@media(max-width:1274px) {
    .modal-video-container .modal-video {
        height:405px
    }
}
@media(max-width:998px) {
    .modal-video-container .modal-video {
        height:350px
    }
}
@media(max-width:768px) {
    .modal-video-container .modal-video {
        height:45vw
    }
}
@media(max-width:550px) {
    .modal-video-container .modal-video {
        height:58vw
    }
}
.awards {
    margin-bottom:100px;
    margin-top:100px;
    text-align:center
}
@media(max-width:768px) {
    .awards {
        margin-bottom:40px;
        margin-top:40px
    }
}
.awards-title h3 {
    margin-bottom:40px
}
@media(max-width:768px) {
    .awards-title h3 {
        margin-bottom:20px
    }
    .awards-items .VueCarousel-dot {
        margin-top:0!important
    }
}
.awards-item {
    box-sizing:border-box;
    padding:0 8px
}
.awards-item-wrapper {
    padding:7px 0
}
.awards-item-image {
    width:100%
}
.five-promises {
    overflow:hidden
}
.five-promises-container {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .five-promises-container {
        margin-bottom:40px;
        margin-top:40px
    }
}
.five-promises-title {
    text-align:center;
    white-space:pre-line
}
.five-promises-title h2 {
    margin-bottom:20px
}
@media(max-width:768px) {
    .five-promises-title h2 {
        margin-bottom:10px
    }
}
.five-promises-text {
    margin-bottom:20px;
    text-align:center
}
@media(max-width:768px) {
    .five-promises-text {
        margin-bottom:30px
    }
}
.five-promises-items-four,
.five-promises-items-three,
.five-promises-items-two {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-justify-content:center;
    justify-content:center;
    margin-left:-15px;
    margin-right:-15px;
    text-align:center
}
.five-promises-items-four .five-promises-item,
.five-promises-items-three .five-promises-item,
.five-promises-items-two .five-promises-item {
    padding-bottom:15px;
    padding-top:15px;
    width:100%
}
@media(max-width:768px) {
    .five-promises-items-four .five-promises-item,
    .five-promises-items-three .five-promises-item,
    .five-promises-items-two .five-promises-item {
        -webkit-flex:0 0 100%!important;
        flex:0 0 100%!important
    }
}
.five-promises-items-four .five-promises-item-icon-image,
.five-promises-items-four .five-promises-item-icon-svg,
.five-promises-items-three .five-promises-item-icon-image,
.five-promises-items-three .five-promises-item-icon-svg,
.five-promises-items-two .five-promises-item-icon-image,
.five-promises-items-two .five-promises-item-icon-svg {
    margin-left:auto;
    margin-right:auto
}
@media(hover:hover) {
    .five-promises-items-four a.five-promises-item-container:hover .five-promises-item-title,
    .five-promises-items-three a.five-promises-item-container:hover .five-promises-item-title,
    .five-promises-items-two a.five-promises-item-container:hover .five-promises-item-title {
        color:var(--light)
    }
}
.five-promises-items-two {
    margin:auto;
    max-width:630px
}
.five-promises-items-two .five-promises-item {
    -webkit-flex:0 0 50%;
    flex:0 0 50%
}
.five-promises-items-three {
    margin:auto;
    max-width:945px
}
.five-promises-items-three .five-promises-item {
    -webkit-flex:0 0 33%;
    flex:0 0 33%
}
@media(max-width:998px) {
    .five-promises-items-three .five-promises-item {
        -webkit-flex:0 0 50%;
        flex:0 0 50%
    }
}
.five-promises-items-four .five-promises-item {
    -webkit-flex:0 0 25%;
    flex:0 0 25%
}
@media(max-width:1274px) {
    .five-promises-items-four .five-promises-item {
        -webkit-flex:0 0 33.33%;
        flex:0 0 33.33%
    }
}
@media(max-width:998px) {
    .five-promises-items-four .five-promises-item {
        -webkit-flex:0 0 50%;
        flex:0 0 50%
    }
}
.five-promises-items-carousel {
    margin-top:-48px
}
@media(max-width:768px) {
    .five-promises-items-carousel {
        margin-top:0
    }
}
.five-promises-items-carousel .five-promises-item-container {
    background-color:#fff;
    box-shadow:0 0 50px rgba(34,32,89,.1);
    padding:40px 40px 60px
}
@media(max-width:400px),(max-width:768px)and (min-width:650px) {
    .five-promises-items-carousel .five-promises-item-container {
        padding:30px 30px 40px
    }
}
@media(hover:hover) {
    .five-promises-items-carousel a.five-promises-item-container:hover {
        box-shadow:0 0 70px rgba(34,32,89,.2)
    }
}
.five-promises-item {
    box-sizing:border-box;
    height:100%;
    padding-left:15px;
    padding-right:15px
}
@media(max-width:768px)and (min-width:650px) {
    .five-promises-item {
        padding-left:12px;
        padding-right:12px
    }
}
@media(max-width:400px) {
    .five-promises-item {
        padding-left:10px;
        padding-right:10px
    }
}
.five-promises-item-container {
    box-sizing:border-box;
    color:var(--text);
    display:block;
    height:100%
}
.five-promises-item-icon-svg {
    margin-bottom:20px;
    width:32px
}
.five-promises-item-icon-svg svg {
    height:auto;
    width:100%
}
.five-promises-item-icon-svg svg path {
    fill:var(--light)!important
}
.five-promises-item-icon-image {
    margin-bottom:20px;
    width:150px
}
.five-promises-item-icon img {
    max-height:125px;
    max-width:100%
}
.five-promises-item-title {
    font-weight:500;
    margin-bottom:15px;
    transition:.35s ease
}
.five-promises-button-section {
    margin-top:40px;
    text-align:center
}
@media(max-width:768px) {
    .five-promises-button-section {
        margin-top:30px
    }
}
.five-promises .VueCarousel-wrapper {
    margin-left:-15px;
    margin-right:-15px;
    -webkit-order:2;
    order:2;
    overflow:visible
}
@media(max-width:768px) {
    .five-promises .VueCarousel-wrapper {
        -webkit-order:1;
        order:1
    }
}
@media(max-width:768px)and (min-width:650px) {
    .five-promises .VueCarousel-wrapper {
        margin-left:-12px;
        margin-right:-12px
    }
}
@media(max-width:400px) {
    .five-promises .VueCarousel-wrapper {
        margin-left:-10px;
        margin-right:-10px
    }
}
.five-promises .VueCarousel-inner {
    padding-top:55px
}
@media(max-width:768px) {
    .five-promises .VueCarousel-inner {
        padding-top:0
    }
}
.five-promises .VueCarousel-navigation {
    position:absolute;
    right:0;
    text-align:right;
    top:-15px
}
@media(max-width:768px) {
    .five-promises .VueCarousel-navigation {
        display:none
    }
}
.five-promises .VueCarousel-navigation .VueCarousel-navigation-button {
    font-size:36px;
    margin:5px!important;
    padding:0!important;
    position:relative;
    -webkit-transform:none;
    transform:none
}
.five-promises .VueCarousel-navigation .VueCarousel-navigation-prev .custom-icon {
    display:block;
    -webkit-transform:rotate(-180deg);
    transform:rotate(-180deg)
}
.five-promises .VueCarousel-pagination {
    -webkit-order:2;
    order:2
}
@media(min-width:769px) {
    .five-promises .VueCarousel-pagination {
        display:none
    }
}
.five-promises .VueCarousel-pagination .VueCarousel-dot-container {
    margin-top:0!important
}
.loan-types {
    overflow:hidden
}
.loan-types-container {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .loan-types-container {
        margin-bottom:40px;
        margin-top:40px
    }
}
.loan-types-head {
    margin-bottom:-48px;
    padding-right:115px
}
@media(max-width:768px) {
    .loan-types-head {
        margin-bottom:0;
        padding-right:0
    }
}
.loan-types-title {
    margin-bottom:20px;
    white-space:pre-line
}
@media(max-width:768px) {
    .loan-types-title {
        margin-bottom:10px
    }
}
.loan-types-text {
    margin-bottom:20px
}
@media(max-width:768px) {
    .loan-types-text {
        margin-bottom:30px
    }
}
.loan-types-item {
    box-sizing:border-box;
    height:100%;
    padding-left:15px;
    padding-right:15px
}
@media(max-width:768px)and (min-width:675px) {
    .loan-types-item {
        padding-left:12px;
        padding-right:12px
    }
}
@media(max-width:400px) {
    .loan-types-item {
        padding-left:10px;
        padding-right:10px
    }
}
.loan-types-item-container {
    background-color:#fff;
    box-sizing:border-box;
    height:100%;
    padding:40px 40px 70px;
    position:relative
}
@media(max-width:400px),(max-width:768px)and (min-width:675px) {
    .loan-types-item-container {
        padding:30px 30px 60px
    }
}
.loan-types-item-container:before {
    border:1px solid var(--dark);
    content:"";
    height:100%;
    left:0;
    opacity:.1;
    position:absolute;
    top:0;
    transition:.35s ease;
    width:100%
}
.loan-types-item-link {
    color:var(--text);
    display:block
}
.loan-types-item-link:after {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    bottom:30px;
    content:"\e900";
    font-family:custom-icons!important;
    font-size:36px;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    opacity:.25;
    position:absolute;
    right:30px;
    text-transform:none;
    transition:.35s ease
}
@media(hover:hover) {
    .loan-types-item-link:hover {
        box-shadow:0 0 50px rgba(34,32,89,.1)
    }
    .loan-types-item-link:hover:before {
        opacity:0
    }
    .loan-types-item-link:hover:after {
        color:var(--light);
        opacity:1
    }
}
.loan-types-item-icon {
    color:var(--light);
    margin-bottom:20px;
    width:32px
}
.loan-types-item-icon svg {
    height:auto;
    width:100%
}
.loan-types-item-icon svg path {
    fill:var(--light)!important
}
.loan-types-item-title {
    font-weight:500;
    margin-bottom:15px
}
.loan-types-button-section {
    text-align:center
}
@media(max-width:768px) {
    .loan-types-button-section {
        margin-top:30px
    }
}
.loan-types .VueCarousel-wrapper {
    margin-bottom:40px;
    margin-left:-15px;
    margin-right:-15px;
    overflow:visible
}
@media(max-width:768px)and (min-width:675px) {
    .loan-types .VueCarousel-wrapper {
        margin-left:-12px;
        margin-right:-12px
    }
}
@media(max-width:768px) {
    .loan-types .VueCarousel-wrapper {
        margin-bottom:10px
    }
}
@media(max-width:400px) {
    .loan-types .VueCarousel-wrapper {
        margin-left:-10px;
        margin-right:-10px
    }
}
.loan-types .VueCarousel-navigation {
    margin-top:-30px;
    text-align:right
}
@media(max-width:768px) {
    .loan-types .VueCarousel-navigation {
        display:none
    }
}
.loan-types .VueCarousel-navigation .VueCarousel-navigation-button {
    font-size:36px;
    margin:5px!important;
    padding:0!important;
    position:relative;
    -webkit-transform:none;
    transform:none
}
.loan-types .VueCarousel-navigation .VueCarousel-navigation-prev .custom-icon {
    display:block;
    -webkit-transform:rotate(-180deg);
    transform:rotate(-180deg)
}
@media(min-width:769px) {
    .loan-types .VueCarousel-pagination {
        display:none
    }
}
.loan-types .VueCarousel-pagination .VueCarousel-dot-container {
    margin-top:0!important
}
.descriptive-text {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .descriptive-text {
        margin-bottom:40px;
        margin-top:40px
    }
}
.descriptive-text-item-link {
    -webkit-align-content:center;
    align-content:center;
    background-color:#fff;
    box-shadow:0 0 0 rgba(34,32,89,0);
    box-sizing:border-box;
    color:var(--text);
    display:-webkit-flex;
    display:flex;
    padding:40px 40px 25px;
    position:relative;
    transition:.35 ease
}
@media(max-width:768px) {
    .descriptive-text-item-link {
        padding:30px 30px 15px
    }
}
@media(max-width:550px) {
    .descriptive-text-item-link {
        padding:15px 15px 1px
    }
}
@media(max-width:400px) {
    .descriptive-text-item-link {
        display:block;
        padding:20px 20px 30px
    }
}
@media(hover:hover) {
    .descriptive-text-item-link:hover {
        box-shadow:0 0 50px rgba(34,32,89,.1);
        z-index:2
    }
    .descriptive-text-item-link:hover:before {
        opacity:0
    }
}
.descriptive-text-item-link:before {
    border:1px solid var(--dark);
    content:"";
    height:100%;
    left:0;
    opacity:.1;
    position:absolute;
    top:0;
    transition:.35s ease;
    width:100%
}
.descriptive-text-item-link:after {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:var(--dark);
    content:"\e900";
    display:block;
    font-family:custom-icons!important;
    font-size:36px;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    opacity:.25;
    position:absolute;
    right:40px;
    text-transform:none;
    top:50%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    transition:.35s ease
}
@media(max-width:768px) {
    .descriptive-text-item-link:after {
        font-size:26px;
        right:30px
    }
}
@media(max-width:550px) {
    .descriptive-text-item-link:after {
        right:15px
    }
}
@media(max-width:400px) {
    .descriptive-text-item-link:after {
        bottom:0;
        top:auto
    }
}
.descriptive-text-item-icon {
    width:32px
}
@media(max-width:400px) {
    .descriptive-text-item-icon {
        margin-bottom:15px
    }
}
.descriptive-text-item-icon svg {
    height:auto;
    width:100%
}
.descriptive-text-item-icon svg path {
    fill:var(--light)!important
}
.descriptive-text-item-content {
    -webkit-flex:1;
    flex:1;
    padding-left:40px;
    padding-right:60px
}
@media(max-width:768px) {
    .descriptive-text-item-content {
        padding-left:20px;
        padding-right:50px
    }
}
@media(max-width:550px) {
    .descriptive-text-item-content {
        padding-left:15px
    }
}
@media(max-width:400px) {
    .descriptive-text-item-content {
        padding-left:0;
        padding-right:0
    }
}
.descriptive-text-item-title {
    font-weight:500;
    margin-bottom:15px
}
.descriptive-text-item:first-child .descriptive-text-item-link:before {
    border-top-left-radius:4px;
    border-top-right-radius:4px
}
.faqs {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .faqs {
        margin-bottom:60px;
        margin-top:60px
    }
}
.faqs-title h3 {
    margin-bottom:20px
}
.faqs-items {
    margin-top:15px
}
.faqs-group-title {
    font-weight:500
}
.faqs-item {
    box-sizing:border-box;
    -webkit-flex:0 0 50%;
    flex:0 0 50%
}
.faqs-item.open .faqs-item-head:after {
    content:"\e902";
    -webkit-transform:rotate(-180deg);
    transform:rotate(-180deg)
}
.faqs-item.open .faqs-item-description {
    max-height:2000px;
    opacity:1;
    padding-top:20px;
    transition:1s ease
}
.faqs-item-back {
    box-sizing:border-box;
    transition:box-shadow .35s ease
}
.faqs-item-head {
    padding-right:45px;
    position:relative
}
@media(max-width:550px) {
    .faqs-item-head {
        padding-right:38px
    }
}
.faqs-item-head:after {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    content:"\e901";
    font-family:custom-icons!important;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    position:absolute;
    right:0;
    text-transform:none;
    top:2px;
    -webkit-transform:rotate(0deg);
    transform:rotate(0deg);
    transition:.35s ease,content .25s ease .1s
}
.faqs-item-head:hover {
    cursor:pointer
}
.faqs-item-head:focus {
    outline:0
}
.faqs-item-question {
    font-weight:500;
    margin-bottom:0;
    transition:.5s ease
}
.faqs-item-description {
    max-height:0;
    opacity:0;
    overflow:hidden;
    transition:.5s ease,padding .25s ease .35s
}
@media(max-width:768px) {
    .faqs-btn {
        margin-top:21px
    }
}
.faqs.half {
    display:-webkit-flex;
    display:flex
}
@media(max-width:768px) {
    .faqs.half {
        display:block
    }
}
.faqs.half .faqs-title h3 {
    font-size:5rem;
    line-height:5rem
}
@media(max-width:998px) {
    .faqs.half .faqs-title h3 {
        font-size:4rem;
        line-height:4rem
    }
}
@media(max-width:768px) {
    .faqs.half .faqs-title h3 {
        font-size:3rem;
        line-height:3rem
    }
}
.faqs.half .faqs-head {
    box-sizing:border-box;
    -webkit-flex:0 0 40%;
    flex:0 0 40%;
    padding-right:80px
}
@media(max-width:998px) {
    .faqs.half .faqs-head {
        -webkit-flex:0 0 45%;
        flex:0 0 45%;
        padding-right:60px
    }
}
@media(max-width:768px) {
    .faqs.half .faqs-head {
        margin-bottom:60px;
        padding-right:0
    }
}
.faqs.half .faqs-content {
    -webkit-flex:0 0 60%;
    flex:0 0 60%
}
@media(max-width:998px) {
    .faqs.half .faqs-content {
        -webkit-flex:0 0 55%;
        flex:0 0 55%
    }
}
.faqs.half .faqs-item.open .faqs-item-description {
    padding-top:15px
}
.faqs.half .faqs-item-question {
    font-size:1.6rem;
    line-height:2.2rem
}
.faqs.half .faqs-item-head:after {
    font-size:20px
}
.faqs.half .faqs-item-back {
    box-shadow:inset 0 -1px 0 rgba(34,33,89,.1);
    padding:20px
}
@media(max-width:550px) {
    .faqs.half .faqs-item-back {
        padding:20px 10px
    }
}
.faqs.half .faqs-group {
    margin-bottom:40px
}
.faqs.half .faqs-button-section {
    text-align:right
}
.faqs.full .faqs-head {
    margin-bottom:40px;
    text-align:center
}
@media(max-width:768px) {
    .faqs.full .faqs-title h3 {
        font-size:3rem;
        line-height:3rem
    }
}
.faqs.full .faqs-item {
    padding:15px 0
}
.faqs.full .faqs-item.open .faqs-item-description {
    padding-top:20px
}
.faqs.full .faqs-item-head:after {
    font-size:27px
}
.faqs.full .faqs-item-question {
    line-height:2.8rem
}
.faqs.full .faqs-item-back {
    background-color:var(--light-back);
    border-radius:4px;
    padding:30px
}
@media(max-width:550px) {
    .faqs.full .faqs-item-back {
        padding:20px
    }
}
.faqs.full .faqs-group {
    margin-bottom:80px
}
@media(max-width:768px) {
    .faqs.full .faqs-group {
        margin-bottom:60px
    }
}
@media(max-width:550px) {
    .faqs.full .faqs-group {
        margin-bottom:40px
    }
}
.faqs.full .faqs-group:last-child {
    margin-bottom:40px
}
.faqs.full .faqs-button-section {
    text-align:center
}
.process-block {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .process-block {
        margin-bottom:60px;
        margin-top:60px
    }
}
.process-block-text h3 {
    margin-bottom:15px
}
.process-block-text p {
    font-size:1.8rem;
    line-height:2.8rem
}
.process-block-text .btn {
    margin-top:20px
}
@media(max-width:768px) {
    .process-block-text .btn {
        margin-top:10px
    }
}
.process-block-points>ul {
    margin-bottom:0;
    margin-top:0
}
.process-block-points>ul>.process-block-point {
    margin-bottom:30px;
    padding-bottom:15px
}
.process-block-points>ul>.process-block-point:last-child {
    margin-bottom:0;
    padding-bottom:0
}
.process-block-point-title {
    font-weight:500;
    margin-bottom:10px
}
.process-block.layout-half {
    display:-webkit-flex;
    display:flex
}
@media(max-width:768px) {
    .process-block.layout-half {
        display:block
    }
}
.process-block.layout-half .process-block-text {
    box-sizing:border-box;
    -webkit-flex:0 0 40%;
    flex:0 0 40%;
    padding-right:10px
}
@media(max-width:768px) {
    .process-block.layout-half .process-block-text {
        margin-bottom:40px;
        padding-right:0
    }
}
.process-block.layout-half .process-block-text-content {
    max-width:320px;
    padding-right:25px
}
@media(max-width:768px) {
    .process-block.layout-half .process-block-text-content {
        padding-right:0
    }
}
.process-block.layout-half .process-block-points {
    box-sizing:border-box;
    -webkit-flex:0 0 60%;
    flex:0 0 60%;
    padding-left:10px
}
.process-block.layout-full .process-block-text {
    margin-bottom:60px
}
@media(max-width:768px) {
    .process-block.layout-full .process-block-text {
        margin-bottom:40px
    }
}
.process-block.layout-full .process-block-points {
    max-width:60%
}
@media(max-width:998px) {
    .process-block.layout-full .process-block-points {
        max-width:none
    }
}
.process-block.bullets-none-lined ol,
.process-block.bullets-none ol {
    list-style:none;
    padding-left:0
}
.process-block.bullets-none-lined ol>li,
.process-block.bullets-none ol>li {
    counter-increment:number;
    line-height:26px;
    margin-top:20px;
    padding-left:50px;
    position:relative
}
@media(max-width:400px) {
    .process-block.bullets-none-lined ol>li,
    .process-block.bullets-none ol>li {
        padding-left:38px
    }
}
.process-block.bullets-none-lined ol>li:before,
.process-block.bullets-none ol>li:before {
    background-color:var(--dark);
    box-sizing:border-box;
    color:#fff;
    color:var(--text-on-dark);
    content:counter(number);
    display:block;
    font-size:16px;
    height:30px;
    left:0;
    line-height:18px;
    padding:5px;
    position:absolute;
    text-align:center;
    width:30px
}
@media(max-width:400px) {
    .process-block.bullets-none-lined ol>li:before,
    .process-block.bullets-none ol>li:before {
        height:25px;
        line-height:15px;
        width:25px
    }
}
.process-block.bullets-none-lined ol>li ol>li,
.process-block.bullets-none ol>li ol>li {
    counter-increment:alpha;
    line-height:26px;
    margin-top:20px;
    padding-left:50px;
    position:relative
}
@media(max-width:400px) {
    .process-block.bullets-none-lined ol>li ol>li,
    .process-block.bullets-none ol>li ol>li {
        padding-left:38px
    }
}
.process-block.bullets-none-lined ol>li ol>li:before,
.process-block.bullets-none ol>li ol>li:before {
    background-color:#fff;
    border:1px solid var(--dark);
    box-sizing:border-box;
    color:var(--text);
    content:counter(alpha,lower-alpha);
    display:block;
    font-size:16px;
    height:30px;
    left:0;
    line-height:18px;
    padding:5px;
    position:absolute;
    text-align:center;
    width:30px
}
@media(max-width:400px) {
    .process-block.bullets-none-lined ol>li ol>li:before,
    .process-block.bullets-none ol>li ol>li:before {
        height:25px;
        line-height:15px;
        width:25px
    }
}
.process-block.bullets-none-lined .process-block-points>ul>li {
    position:relative
}
.process-block.bullets-none-lined .process-block-points>ul>li:after {
    background-color:var(--dark);
    bottom:0;
    color:var(--text-on-dark);
    content:"";
    height:1px;
    left:0;
    opacity:.1;
    position:absolute;
    width:100%
}
.process-block.bullets-none-lined .process-block-points>ul>li:last-child:after {
    content:none
}
.process-block.bullets-num .process-block-points>ul>li,
.process-block.bullets-ticks .process-block-points>ul>li {
    padding-left:62px;
    position:relative
}
@media(max-width:550px) {
    .process-block.bullets-num .process-block-points>ul>li,
    .process-block.bullets-ticks .process-block-points>ul>li {
        padding-left:52px
    }
}
.process-block.bullets-num .process-block-points>ul>li:before,
.process-block.bullets-ticks .process-block-points>ul>li:before {
    background-color:var(--light);
    box-sizing:border-box;
    color:var(--text-on-light);
    display:block;
    font-size:24px;
    height:42px;
    left:0;
    line-height:24px;
    padding:9px 5px 5px;
    position:absolute;
    text-align:center;
    width:42px
}
@media(max-width:550px) {
    .process-block.bullets-num .process-block-points>ul>li:before,
    .process-block.bullets-ticks .process-block-points>ul>li:before {
        font-size:20px;
        height:32px;
        line-height:22px;
        padding:7px 5px 5px;
        width:32px
    }
}
.process-block.bullets-num .process-block-points>ul>li {
    counter-increment:number
}
.process-block.bullets-num .process-block-points>ul>li:before {
    content:counter(number);
    font-weight:500
}
.process-block.bullets-num .process-block-points>ul>li:after {
    background-color:var(--light);
    content:"";
    height:100%;
    left:21px;
    position:absolute;
    top:31px;
    width:2px
}
@media(max-width:550px) {
    .process-block.bullets-num .process-block-points>ul>li:after {
        left:16px
    }
}
.process-block.bullets-num .process-block-points>ul>li:last-child:after {
    content:none
}
.process-block.bullets-ticks .process-block-points>ul>li:before {
    speak:never;
    font-feature-settings:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    content:"\e903";
    font-family:custom-icons!important;
    font-style:normal;
    font-variant:normal;
    font-weight:400;
    line-height:1;
    text-transform:none
}
.process-block.text-background .process-block-points {
    background-color:var(--grey);
    color:var(--text-on-grey);
    padding:60px
}
@media(max-width:998px) {
    .process-block.text-background .process-block-points {
        padding:40px
    }
}
@media(max-width:768px) {
    .process-block.text-background .process-block-points {
        padding:60px
    }
}
@media(max-width:550px) {
    .process-block.text-background .process-block-points {
        padding:30px
    }
}
@media(max-width:400px) {
    .process-block.text-background .process-block-points {
        padding:30px 20px 20px
    }
}
.process-block.text-background.bullets-none-lined ol>li ol>li:before,
.process-block.text-background.bullets-none ol>li ol>li:before {
    border:0
}
.refinance-block {
    grid-gap:60px;
    display:grid;
    grid-template-areas:"title button" "items items";
    grid-template-columns:auto 304px;
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:998px) {
    .refinance-block {
        display:block
    }
}
@media(max-width:768px) {
    .refinance-block {
        margin-bottom:60px;
        margin-top:60px
    }
}
.refinance-block-text {
    grid-area:title
}
.refinance-block-text h3 {
    margin-bottom:20px
}
.refinance-block-text p {
    font-size:1.8rem;
    line-height:2.8rem
}
.refinance-block-item-back {
    background-color:var(--grey);
    color:var(--text-on-grey);
    grid-area:items;
    padding:60px
}
@media(max-width:998px) {
    .refinance-block-item-back {
        margin-top:40px
    }
}
@media(max-width:550px) {
    .refinance-block-item-back {
        padding:40px 30px 30px
    }
}
@media(max-width:400px) {
    .refinance-block-item-back {
        padding:30px 20px 20px
    }
}
.refinance-block-items {
    display:-webkit-flex;
    display:flex;
    margin-left:-30px;
    margin-right:-30px
}
@media(max-width:998px) {
    .refinance-block-items {
        display:block;
        margin-left:0;
        margin-right:0
    }
}
.refinance-block-item {
    box-sizing:border-box;
    -webkit-flex:0 0 33%;
    flex:0 0 33%;
    padding-left:30px;
    padding-right:30px
}
@media(max-width:998px) {
    .refinance-block-item {
        -webkit-align-items:flex-start;
        align-items:flex-start;
        display:-webkit-flex;
        display:flex;
        margin-bottom:60px;
        padding-left:0;
        padding-right:0
    }
    .refinance-block-item:last-child {
        margin-bottom:0
    }
}
@media(max-width:550px) {
    .refinance-block-item {
        margin-bottom:30px
    }
}
.refinance-block-item-icon {
    margin-bottom:20px;
    width:42px
}
@media(max-width:998px) {
    .refinance-block-item-icon {
        -webkit-flex:0 0 42px;
        flex:0 0 42px;
        margin-right:20px
    }
}
@media(max-width:550px) {
    .refinance-block-item-icon {
        -webkit-flex:0 0 30px;
        flex:0 0 30px
    }
}
.refinance-block-item-icon svg {
    height:auto;
    width:100%
}
.refinance-block-item-icon svg path {
    fill:var(--light)!important
}
.refinance-block-item-title {
    font-weight:500;
    margin-bottom:10px
}
.refinance-block-btn {
    align-self:end;
    grid-area:button;
    justify-self:end
}
@media(max-width:998px) {
    .refinance-block-btn {
        margin-top:40px;
        text-align:center
    }
}
.lenders-panel {
    margin-bottom:100px;
    margin-top:100px;
    text-align:center
}
@media(max-width:768px) {
    .lenders-panel {
        margin-bottom:40px;
        margin-top:40px
    }
}
.lenders-panel-image {
    width:100%
}
.graph {
    grid-gap:10px 0;
    display:grid;
    grid-template-areas:"text image key" "buttons image key";
    grid-template-columns:350px auto 260px;
    grid-template-rows:-webkit-max-content;
    grid-template-rows:max-content;
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:1399px) {
    .graph {
        grid-template-columns:320px auto 220px
    }
}
@media(max-width:998px) {
    .graph {
        grid-gap:30px 0;
        grid-template-areas:"text text" "image key" "buttons buttons";
        grid-template-columns:auto 320px
    }
}
@media(max-width:768px) {
    .graph {
        display:block;
        margin-bottom:60px;
        margin-top:60px
    }
}
.graph-text {
    grid-area:text;
    max-width:700px
}
.graph-title {
    margin-bottom:20px
}
.graph-image-section {
    box-sizing:border-box;
    grid-area:image;
    padding-left:60px;
    padding-right:60px;
    text-align:center
}
@media(max-width:1274px) {
    .graph-image-section {
        padding-left:40px;
        padding-right:40px
    }
}
@media(max-width:998px) {
    .graph-image-section {
        padding-left:0;
        padding-right:60px
    }
}
@media(max-width:768px) {
    .graph-image-section {
        margin-bottom:30px;
        margin-top:30px;
        padding-right:0
    }
}
.graph-image-section img {
    max-width:100%
}
@media(max-width:768px) {
    .graph-image-section img {
        max-width:375px;
        width:100%
    }
}
.graph-key-section {
    grid-area:key
}
@media(max-width:768px) {
    .graph-key-section {
        margin-bottom:40px;
        text-align:center
    }
}
.graph-key-section img {
    max-width:100%
}
@media(max-width:998px) {
    .graph-key-desktop {
        display:none
    }
}
@media(min-width:999px) {
    .graph-key-mobile {
        display:none
    }
}
.graph-buttons {
    grid-area:buttons
}
@media(max-width:768px) {
    .graph-buttons {
        text-align:center
    }
}
.graph-buttons-first {
    margin-bottom:40px
}
.team-overview {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .team-overview {
        margin-bottom:60px;
        margin-top:60px
    }
}
.team-overview-head {
    display:-webkit-flex;
    display:flex;
    margin-bottom:30px
}
@media(max-width:998px) {
    .team-overview-head {
        display:block
    }
}
.team-overview-head h2 {
    margin-bottom:20px
}
.team-overview-heading {
    -webkit-align-items:flex-start;
    align-items:flex-start;
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column;
    -webkit-justify-content:flex-end;
    justify-content:flex-end
}
.team-overview-image {
    -webkit-align-self:flex-end;
    align-self:flex-end;
    background-position:calc(100% + 1px) 100%;
    background-repeat:no-repeat;
    background-size:contain;
    height:235px;
    margin-left:30px;
    width:100%
}
@media(max-width:1399px) {
    .team-overview-image {
        height:200px
    }
}
@media(max-width:1274px) {
    .team-overview-image {
        height:150px
    }
}
@media(max-width:998px) {
    .team-overview-image {
        background-position:0 100%;
        height:22vw;
        margin-left:0;
        margin-top:40px
    }
}
.team-overview-list {
    grid-gap:20px;
    display:grid;
    grid-template-columns:1fr 1fr 1fr 1fr
}
@media(max-width:1274px) {
    .team-overview-list {
        grid-template-columns:1fr 1fr 1fr
    }
}
@media(max-width:998px) {
    .team-overview-list {
        grid-template-columns:1fr 1fr
    }
}
@media(max-width:768px) {
    .team-overview-list {
        grid-template-columns:1fr
    }
}
.team-overview-video {
    grid-gap:20px;
    display:grid;
    height:378px;
    width:620px
}
@media(max-width:1274px) {
    .team-overview-video {
        height:358px;
        width:751px
    }
}
@media(max-width:998px) {
    .team-overview-video {
        height:539px;
        padding-bottom:150px;
        width:839px
    }
}
@media(max-width:850px) {
    .team-overview-video {
        max-height:492px;
        max-width:710px;
        min-height:321px;
        min-width:450px;
        padding-bottom:200px
    }
}
@media(max-width:768px) {
    .team-overview-video {
        max-height:442px;
        max-width:665px;
        min-height:272px;
        min-width:412px;
        padding-bottom:200px
    }
}
@media(max-width:680px) {
    .team-overview-video {
        max-height:272px;
        max-width:412px;
        min-height:248px;
        min-width:368px
    }
}
@media(max-width:620px) {
    .team-overview-video {
        height:248px;
        width:500px
    }
}
@media(max-width:440px) {
    .team-overview-video {
        height:219px;
        width:336px
    }
}
.team-overview-btn-section {
    margin-top:40px;
    text-align:center
}
.team-overview-card {
    box-shadow:0 0 50px rgba(34,32,89,.1);
    -webkit-justify-content:center;
    justify-content:center;
    padding:40px
}
@media(max-width:768px) {
    .team-overview-card {
        padding:30px
    }
}
.team-overview-card-container {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column;
    height:100%;
    text-align:center;
    width:100%
}
@media(max-width:1274px) {
    .team-overview-card-container {
        margin:0 3rem 0 0
    }
}
@media(max-width:768px) {
    .team-overview-card-container {
        margin:0
    }
}
.team-overview-card-container .btn {
    margin-top:35px;
    opacity:.5
}
.team-overview-card-container .btn-email {
    margin-top:10px;
    opacity:1
}
.team-overview-card-container .btn-email:hover {
    opacity:.75
}
.team-overview-card-image {
    border-radius:50%;
    height:120px;
    margin-bottom:20px;
    margin-left:auto;
    margin-right:auto;
    width:120px
}
.team-overview-card-title {
    font-weight:500
}
.team-overview-card-role {
    margin-bottom:20px;
    opacity:.5
}
.team-overview-card-phone {
    color:var(--text)
}
.team-overview-card-mobile,
.team-overview-card-phone {
    display:block;
    font-size:1.6rem;
    font-weight:500;
    line-height:2.6rem
}
.team-overview-card-email {
    display:block;
    font-size:1.5rem;
    line-height:1.1;
    line-height:2.6rem;
    word-break:break-all
}
.team-overview-card-btn-section {
    margin-top:auto
}
.team-overview-card-map {
    padding:0 0 40px
}
.team-overview-card-map .team-overview-card-image {
    border-radius:0;
    height:160px;
    margin-bottom:30px;
    -o-object-fit:cover;
    object-fit:cover;
    width:100%
}
@media(max-width:768px) {
    .team-overview-card-map .team-overview-card-image {
        height:40vw
    }
}
@media(max-width:550px) {
    .team-overview-card-map .team-overview-card-image {
        height:55vw
    }
}
.team-overview-card-map .team-overview-card-content {
    padding-left:40px;
    padding-right:40px
}
@media(max-width:768px) {
    .team-overview-card-map .team-overview-card-content {
        padding-left:30px;
        padding-right:30px
    }
}
.team-overview-card-video {
    grid-column:1/3;
    grid-row:1;
    height:378px;
    padding:0
}
@media(max-width:1274px) {
    .team-overview-card-video {
        height:358px
    }
}
@media(max-width:998px) {
    .team-overview-card-video {
        height:539px
    }
}
@media(max-width:850px) {
    .team-overview-card-video {
        max-height:492px;
        min-height:321px
    }
}
@media(max-width:680px) {
    .team-overview-card-video {
        max-height:272px;
        min-height:248px
    }
}
@media(max-width:620px) {
    .team-overview-card-video {
        height:248px
    }
}
@media(max-width:440px) {
    .team-overview-card-video {
        height:219px
    }
}
@media(max-width:768px) {
    .team-overview-card-video {
        grid-column:1;
        grid-row:1;
        max-height:442px;
        min-height:272px
    }
}
.team-overview-card-video .video {
    height:100%;
    margin-bottom:0;
    margin-top:0;
    padding-left:0!important;
    padding-right:0!important;
    width:100%
}
.team-overview-card-video .video-container {
    height:100%
}
.team-overview-card-video .video-poster {
    height:100%;
    max-width:unset;
    width:100%
}
.team-overview-card-video .video-poster-image {
    height:100%;
    width:100%
}
@media(max-width:490px) {
    .team-overview-card-video .video-poster-image {
        height:55vw
    }
}
.team-overview.layout-single {
    grid-column-gap:30px;
    display:grid;
    grid-template-areas:"head list" "button button";
    grid-template-columns:275px auto;
    max-width:1180px!important
}
@media(max-width:998px) {
    .team-overview.layout-single {
        display:block
    }
}
.team-overview.layout-single .team-overview-head {
    grid-area:head
}
.team-overview.layout-single .team-overview-image {
    display:none
}
.team-overview.layout-single .team-overview-list {
    grid-area:list
}
@media(min-width:999px) {
    .team-overview.layout-single .team-overview-list {
        grid-template-columns:1fr 1fr
    }
}
.team-overview.layout-single .team-overview-btn-section {
    grid-area:button
}
@media(min-width:999px) {
    .team-overview.layout-single .team-overview-card-video .video-poster-image {
        height:425px
    }
}
.team-contact {
    margin-bottom:100px;
    margin-top:100px
}
@media(max-width:768px) {
    .team-contact {
        margin-bottom:60px;
        margin-top:60px
    }
}
.team-contact-list {
    grid-gap:20px;
    display:grid;
    grid-template-columns:1fr 1fr
}
@media(max-width:998px) {
    .team-contact-list {
        grid-template-columns:1fr
    }
}
@media(max-width:550px) {
    .team-contact-list {
        display:block
    }
}
.team-contact-btn-section {
    margin-top:40px;
    text-align:center
}
.team-contact-card {
    box-shadow:0 0 50px rgba(34,32,89,.1);
    -webkit-justify-content:center;
    justify-content:center;
    padding:50px
}
@media(max-width:1274px)and (min-width:999px) {
    .team-contact-card {
        padding:40px
    }
}
@media(max-width:550px) {
    .team-contact-card {
        box-shadow:inset 0 -1px 0 rgba(34,33,89,.1);
        margin-bottom:30px;
        padding:0 0 30px
    }
    .team-contact-card:last-child {
        box-shadow:none
    }
}
.team-contact-card-container {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column;
    height:100%;
    width:100%
}
@media(max-width:1274px) {
    .team-contact-card-container {
        margin:0 3rem 0 0
    }
}
@media(max-width:768px) {
    .team-contact-card-container {
        margin:0
    }
}
.team-contact-card-head {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:flex-start;
    justify-content:flex-start;
    margin-bottom:20px
}
@media(max-width:400px) {
    .team-contact-card-head {
        display:block
    }
}
.team-contact-card-image {
    border-radius:50%;
    height:150px;
    margin-right:20px;
    -o-object-fit:cover;
    object-fit:cover;
    width:150px
}
@media(max-width:1274px)and (min-width:999px) {
    .team-contact-card-image {
        height:130px;
        width:130px
    }
}
@media(max-width:550px) {
    .team-contact-card-image {
        height:100px;
        width:100px
    }
}
@media(max-width:400px) {
    .team-contact-card-image {
        margin-bottom:20px;
        margin-right:0
    }
}
.team-contact-card-title {
    font-weight:500
}
.team-contact-card-role {
    margin-bottom:10px;
    opacity:.5
}
.team-contact-card-phone {
    color:var(--text)
}
.team-contact-card-mobile,
.team-contact-card-phone {
    display:block;
    font-size:1.6rem;
    font-weight:500;
    line-height:2.6rem
}
.team-contact-card-email {
    display:block;
    font-size:1.4rem;
    line-height:2.2rem
}
.team-contact-card-btn-section {
    margin-top:auto
}
.team-contact-card-btn-section .btn {
    margin-top:10px
}
.team-contact-card-btn-section .btn-primary {
    font-size:1.6rem;
    padding:14px 20px
}
.team-contact-card-btn-section .btn-primary .btn-arrow {
    font-size:20px;
    margin-left:10px
}
.team-contact-card-btn-section .btn-email {
    font-size:1.6rem;
    padding:14px 20px
}
.team-contact-card-socials {
    margin-left:-5px;
    margin-right:-5px;
    margin-top:10px
}
.team-contact-card-socials a:hover {
    opacity:.75
}
.team-contact-card-socials .custom-icon {
    font-size:2rem;
    margin:0 5px
}
.team-contact-card-map {
    padding:0 0 50px
}
@media(max-width:1274px)and (min-width:999px) {
    .team-contact-card-map {
        padding:0 0 40px
    }
}
@media(max-width:550px) {
    .team-contact-card-map {
        padding:0
    }
}
.team-contact-card-map .team-contact-card-image {
    border-radius:0;
    height:218px;
    margin-bottom:30px;
    margin-right:0;
    -o-object-fit:cover;
    object-fit:cover;
    width:100%
}
@media(max-width:768px) {
    .team-contact-card-map .team-contact-card-image {
        height:40vw
    }
}
@media(max-width:550px) {
    .team-contact-card-map .team-contact-card-image {
        height:55vw
    }
}
.team-contact-card-map .team-contact-card-content {
    padding-left:50px;
    padding-right:50px
}
@media(max-width:1274px)and (min-width:999px) {
    .team-contact-card-map .team-contact-card-content {
        padding-left:40px;
        padding-right:40px
    }
}
@media(max-width:550px) {
    .team-contact-card-map .team-contact-card-content {
        padding-left:0;
        padding-right:0
    }
}
.team-contact-card-map .team-contact-card-btn-section {
    padding-left:50px;
    padding-right:50px
}
@media(max-width:1274px)and (min-width:999px) {
    .team-contact-card-map .team-contact-card-btn-section {
        padding-left:40px;
        padding-right:40px
    }
}
@media(max-width:550px) {
    .team-contact-card-map .team-contact-card-btn-section {
        padding-left:0;
        padding-right:0
    }
}
.team-contact-card-video {
    grid-column:1/2;
    grid-row:1;
    padding:0
}
@media(max-width:768px) {
    .team-contact-card-video {
        grid-column:1;
        grid-row:1
    }
}
@media(max-width:550px) {
    .team-contact-card-video {
        margin-bottom:30px
    }
}
.team-contact-card-video .video {
    height:100%;
    margin-bottom:0;
    margin-top:0;
    padding-left:0!important;
    padding-right:0!important;
    width:100%
}
.team-contact-card-video .video-container {
    height:100%
}
.team-contact-card-video .video-poster {
    height:100%;
    max-width:unset;
    width:100%
}
.team-contact-card-video .video-poster-image {
    height:100%;
    width:100%
}
@media(max-width:998px) {
    .team-contact-card-video .video-poster-image {
        height:55vw
    }
}
.rates {
    background-image:url(/assets/images/rates-shape.png);
    background-position:0 66%;
    background-repeat:no-repeat;
    background-size:auto 126%;
    padding-bottom:100px;
    padding-top:100px
}
@media(max-width:1550px) {
    .rates {
        background-position:0 0;
        background-size:auto 110%
    }
}
@media(max-width:768px) {
    .rates {
        padding-bottom:40px;
        padding-top:40px
    }
}
.rates-container {
    display:grid;
    grid-template-areas:"title content";
    grid-template-columns:225px auto 225px
}
@media(max-width:1274px) {
    .rates-container {
        grid-template-areas:"title" "content";
        grid-template-columns:100%
    }
}
.rates-head {
    grid-area:title;
    margin-top:85px
}
@media(max-width:1274px) {
    .rates-head {
        justify-self:center;
        margin-bottom:40px;
        margin-top:0;
        max-width:720px;
        width:100%
    }
}
.rates-link-section {
    margin-top:20px
}
.rates-content {
    grid-area:content;
    justify-self:center;
    max-width:720px;
    width:100%
}
.rates-toggles {
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center;
    margin-bottom:40px
}
.rates-toggle {
    box-sizing:border-box;
    opacity:.25;
    position:relative;
    transition:.35s ease;
    z-index:20
}
@media(max-width:550px) {
    .rates-toggle {
        -webkit-flex:0 0 50%;
        flex:0 0 50%
    }
}
@media(hover:hover) {
    .rates-toggle:hover {
        cursor:pointer;
        opacity:1
    }
}
.rates-toggle-button {
    background-color:transparent;
    border:0;
    border-bottom:2px solid rgba(255,255,255,.65);
    box-sizing:border-box;
    color:#fff;
    font-size:2rem;
    font-weight:500;
    line-height:2rem;
    padding:10px;
    text-align:center;
    width:200px
}
@media(max-width:550px) {
    .rates-toggle-button {
        font-size:1.6rem;
        width:100%
    }
}
@media(max-width:400px) {
    .rates-toggle-button {
        padding:10px 10px 10px 0
    }
}
.rates-toggle-button:focus {
    border-bottom:2px solid #fff;
    outline:none
}
.rates-toggle.active {
    opacity:1
}
.rates-toggle.active .rates-tooltip {
    display:inline-block
}
.rates-toggle-fixed {
    padding-right:10px
}
@media(max-width:550px) {
    .rates-toggle-fixed {
        padding-right:5px
    }
}
.rates-toggle-fixed .rates-tooltip {
    left:-46px
}
@media(max-width:550px) {
    .rates-toggle-fixed .rates-tooltip {
        left:-49px
    }
}
@media(max-width:450px) {
    .rates-toggle-fixed .rates-tooltip {
        left:-34px
    }
}
@media(max-width:400px) {
    .rates-toggle-fixed .rates-tooltip {
        left:-29px
    }
}
.rates-toggle-variable {
    padding-left:10px
}
@media(max-width:550px) {
    .rates-toggle-variable {
        padding-left:5px
    }
}
.rates-toggle-variable .rates-tooltip {
    left:-35px
}
@media(max-width:550px) {
    .rates-toggle-variable .rates-tooltip {
        left:-39px
    }
}
@media(max-width:450px) {
    .rates-toggle-variable .rates-tooltip {
        left:-26px
    }
}
@media(max-width:400px) {
    .rates-toggle-variable .rates-tooltip {
        left:-21px
    }
}
.rates-toggle .rates-tooltip {
    display:none;
    margin-right:-12px
}
@media(max-width:550px) {
    .rates-toggle .rates-tooltip {
        margin-right:-20px
    }
}
.rates-values-container {
    box-shadow:0 4px 50px rgba(0,0,0,.35);
    padding:0 30px;
    text-align:center
}
@media(max-width:768px) {
    .rates-values-container {
        padding:0
    }
}
@media(max-width:400px) {
    .rates-values-container {
        margin-left:-10px;
        margin-right:-10px
    }
}
.rates-values {
    display:-webkit-flex;
    display:flex;
    opacity:0;
    position:relative;
    transition:.2s ease
}
.rates-values[hidden=hidden] {
    display:none
}
.rates-values.active {
    opacity:1;
    transition:.35s ease
}
.rates-values.active .rates-value-text {
    left:0;
    transition:.5s ease
}
.rates-value {
    box-sizing:border-box;
    display:-webkit-flex;
    display:flex;
    -webkit-flex:0 0 50%;
    flex:0 0 50%;
    -webkit-justify-content:center;
    justify-content:center;
    padding:50px 20px
}
@media(max-width:1274px) {
    .rates-value {
        padding:40px 15px
    }
}
@media(max-width:400px) {
    .rates-value {
        padding:20px 10px
    }
}
.rates-value-primary {
    border-right:2px solid rgba(0,0,0,.2)
}
.rates-value-primary .rates-value-text {
    color:var(--light)
}
.rates-value-secondary .rates-value-text {
    color:var(--tertiary)
}
.rates-value-text {
    font-size:10rem;
    font-weight:600;
    left:-15px;
    line-height:10rem;
    position:relative;
    transition:.2s ease
}
@media(max-width:1274px) {
    .rates-value-text {
        font-size:9rem;
        line-height:9rem
    }
}
@media(max-width:550px) {
    .rates-value-text {
        font-size:5.5rem;
        font-size:4.5rem;
        line-height:5.5rem;
        line-height:4.5rem;
        margin-bottom:10px;
        text-align:left
    }
}
.rates-value-pa {
    display:inline-block;
    font-size:1.4rem;
    line-height:1.4rem;
    margin-left:3px;
    margin-top:12px;
    vertical-align:top;
    width:19px
}
.rates-value-descriptor {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex
}
.rates-value-descriptor p {
    margin-bottom:0
}
@media(max-width:550px) {
    .rates-value-descriptor p {
        font-size:1.4rem
    }
}
.rates-value-descriptor .rates-tooltip {
    margin-left:5px
}
@media(max-width:550px) {
    .rates-value-descriptor .rates-tooltip {
        margin-left:7px
    }
}
.rates-button-section {
    margin-top:40px;
    text-align:center
}
.rates-tooltip {
    display:inline-block;
    position:relative;
    top:0;
    z-index:0
}
.rates-tooltip .tooltip-title {
    display:none
}
.rates-tooltip .tooltip-text {
    background-color:#fff;
    box-shadow:0 0 50px rgba(34,32,89,.1);
    box-sizing:border-box;
    color:var(--text);
    font-size:14px;
    left:-7px;
    line-height:20px;
    opacity:0;
    padding:14px 14px 14px 30px;
    position:absolute;
    text-align:left;
    top:-6px;
    transition:opacity .35s ease;
    visibility:hidden;
    width:400px;
    z-index:198
}
@media(max-width:1274px) {
    .rates-tooltip .tooltip-text {
        width:300px
    }
}
.rates-tooltip .tooltip-icon {
    background-color:transparent;
    border:1.5px solid #fff;
    border-radius:50%;
    color:#fff;
    display:block;
    font-size:12px;
    height:12px;
    line-height:11px;
    padding:0;
    position:relative;
    text-align:center;
    width:12px;
    z-index:200
}
.rates-tooltip .tooltip-icon:hover {
    cursor:pointer
}
.rates-tooltip .tooltip-description {
    font-size:1.4rem;
    line-height:1.8rem
}
.rates-tooltip .tooltip-close {
    background-color:transparent;
    border:0;
    color:var(--text);
    display:none;
    font-size:3.2rem;
    margin-bottom:42px;
    margin-left:auto;
    padding-right:0
}
.rates-tooltip.active {
    z-index:220
}
.rates-tooltip.active .tooltip-text {
    opacity:1;
    visibility:visible
}
.rates-tooltip.active .tooltip-icon {
    border:1.5px solid var(--text);
    color:var(--text)
}
@media(max-width:550px),(orientation:landscape)and (max-width:1366px)and (max-height:1024px),(orientation:portrait)and (max-width:1024px)and (max-height:1366px) {
    .rates-tooltip .tooltip-title {
        display:block
    }
    .rates-tooltip .tooltip-text {
        background-color:#fff;
        border-radius:0!important;
        box-shadow:0;
        font-size:18px;
        height:100%;
        left:0;
        line-height:18px;
        overflow-y:scroll;
        padding:45px 35px;
        position:fixed;
        top:0;
        width:100%;
        z-index:205
    }
    .rates-tooltip .tooltip-close {
        display:block
    }
    .rates-tooltip .tooltip-description {
        font-size:1.6rem;
        line-height:2.1rem;
        margin-top:15px
    }
    .rates-tooltip .tooltip-icon {
        height:20px;
        line-height:19px;
        width:20px
    }
}
.lead-gen-form {
    min-height:50vh;
    padding-bottom:60px;
    padding-top:60px
}
@media(max-width:768px) {
    .lead-gen-form {
        padding-bottom:40px;
        padding-top:40px
    }
}
.lead-gen-form-footer,
.lead-gen-form-head {
    text-align:center
}
.lead-gen-form-head {
    margin-bottom:30px
}
.lead-gen-form-icon {
    margin:0 auto 5px;
    width:50px
}
.lead-gen-form-icon svg {
    height:auto;
    width:100%
}
.lead-gen-form-icon svg path {
    fill:var(--light)!important
}
.lead-gen-form .field-validation-error {
    color:#ef4444;
    display:inline-block;
    font-size:1.6rem;
    line-height:2.6rem;
    padding-top:5px
}
.lead-gen-form-message {
    font-size:1.6rem;
    line-height:2.6rem;
    margin:auto
}
.lead-gen-form-message-success-title {
    font-size:46px
}
.lead-gen-form-message-success-paragraph {
    font-size:24px;
    margin-top:10px
}
.lead-gen-form-success {
    -webkit-align-items:center;
    align-items:center;
    background-color:var(--light);
    color:#fff;
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column;
    -webkit-justify-content:center;
    justify-content:center;
    padding:60px;
    text-align:center
}
.lead-gen-form-success-icon {
    display:block;
    font-size:100px;
    margin-bottom:20px
}
.lead-gen-form-success-title {
    margin-bottom:15px
}
.review-carousel {
    background-color:#f5f5f5;
    overflow:hidden
}
.review-carousel-container {
    margin-bottom:60px;
    margin-top:60px
}
@media(max-width:768px) {
    .review-carousel-container {
        margin-bottom:40px;
        margin-top:40px
    }
}
.review-carousel-head {
    margin-bottom:-48px;
    padding-right:115px
}
@media(max-width:768px) {
    .review-carousel-head {
        margin-bottom:0;
        padding-right:0
    }
}
.review-carousel-item {
    box-sizing:border-box;
    height:100%;
    padding-left:15px;
    padding-right:15px
}
@media(max-width:768px)and (min-width:650px) {
    .review-carousel-item {
        padding-left:12px;
        padding-right:12px
    }
}
@media(max-width:400px) {
    .review-carousel-item {
        padding-left:10px;
        padding-right:10px
    }
}
.review-carousel-item-container {
    background-color:#fff;
    box-shadow:0 0 50px rgba(34,32,89,.1);
    box-sizing:border-box;
    color:var(--text);
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column;
    height:100%;
    padding:60px
}
@media(max-width:998px)and (min-width:769px) {
    .review-carousel-item-container {
        padding:30px
    }
}
@media(max-width:550px) {
    .review-carousel-item-container {
        padding:40px
    }
}
@media(max-width:400px) {
    .review-carousel-item-container {
        padding:30px
    }
}
@media(hover:hover) {
    .review-carousel-item a.review-carousel-item-container:hover {
        box-shadow:0 0 70px rgba(34,32,89,.2)
    }
}
.review-carousel-item-rating {
    color:#ffcb05;
    font-size:1.4rem
}
.review-carousel-item-rating .custom-icon {
    margin-right:2px
}
.review-carousel-item-text {
    margin-bottom:30px;
    margin-top:20px
}
.review-carousel-item-text p {
    font-size:1.8rem;
    line-height:28px;
    margin-bottom:0
}
.review-carousel-item-footer {
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    margin-top:auto
}
.review-carousel-item-name {
    font-weight:600;
    padding-right:15px
}
.review-carousel-item-name p {
    margin-bottom:0
}
.review-carousel-item-platform img {
    width:24px
}
.review-carousel-button-section {
    margin-top:40px;
    text-align:center
}
@media(max-width:768px) {
    .review-carousel-button-section {
        margin-top:30px
    }
}
.review-carousel .VueCarousel-wrapper {
    margin-left:-15px;
    margin-right:-15px;
    -webkit-order:2;
    order:2;
    overflow:visible
}
@media(max-width:768px) {
    .review-carousel .VueCarousel-wrapper {
        margin-left:0;
        -webkit-order:1;
        order:1
    }
}
@media(max-width:768px)and (min-width:650px) {
    .review-carousel .VueCarousel-wrapper {
        margin-right:-12px
    }
}
@media(max-width:400px) {
    .review-carousel .VueCarousel-wrapper {
        margin-right:-10px
    }
}
.review-carousel .VueCarousel-inner {
    padding-top:55px
}
@media(max-width:768px) {
    .review-carousel .VueCarousel-inner {
        padding-top:0
    }
}
.review-carousel .VueCarousel-navigation {
    position:absolute;
    right:0;
    text-align:right;
    top:-15px
}
@media(max-width:768px) {
    .review-carousel .VueCarousel-navigation {
        display:none
    }
}
.review-carousel .VueCarousel-navigation .VueCarousel-navigation-button {
    font-size:36px;
    margin:5px!important;
    padding:0!important;
    position:relative;
    -webkit-transform:none;
    transform:none
}
.review-carousel .VueCarousel-navigation .VueCarousel-navigation-prev .custom-icon {
    display:block;
    -webkit-transform:rotate(-180deg);
    transform:rotate(-180deg)
}
.review-carousel .VueCarousel-pagination {
    -webkit-order:2;
    order:2
}
@media(min-width:769px) {
    .review-carousel .VueCarousel-pagination {
        display:none
    }
}
.review-carousel .VueCarousel-pagination .VueCarousel-dot-container {
    margin-top:0!important
}
.error-404-content {
    margin:auto;
    max-width:700px;
    padding-bottom:90px;
    padding-top:60px
}
@media(max-width:768px) {
    .error-404-content {
        padding-top:45px
    }
}
.error-404-content h1 {
    font-size:9rem;
    line-height:10.8rem
}
@media(max-width:768px) {
    .error-404-content h1 {
        font-size:8rem;
        line-height:9.8rem
    }
}
.error-404-content h2 {
    margin-bottom:30px;
    margin-top:15px
}
.error-404-buttons {
    margin-top:30px
}
.error-404 .base-layout {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    min-height:90vh
}
.blog-listing {
    margin-left:auto;
    margin-right:auto;
    max-width:1440px
}
.blog-listing-items {
    grid-gap:60px;
    -webkit-align-items:stretch;
    align-items:stretch;
    display:grid;
    grid-template-columns:1fr 1fr 1fr
}
@media(max-width:1274px) {
    .blog-listing-items {
        grid-gap:40px
    }
}
@media(max-width:998px) {
    .blog-listing-items {
        grid-template-columns:1fr 1fr
    }
}
@media(max-width:768px) {
    .blog-listing-items {
        grid-template-columns:1fr
    }
}
.blog-listing-item {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column
}
.blog-listing-item-image img {
    margin-bottom:20px;
    width:100%
}
.blog-listing-item-title {
    color:var(--text);
    font-weight:500;
    line-height:3.4rem;
    margin-bottom:20px
}
@media(max-width:768px) {
    .blog-listing-item-title {
        margin-bottom:10px
    }
}
.blog-listing-item-button {
    margin-top:auto
}
.blog-article-hero-stack .header-image-content {
    margin-top:0
}
@media(max-width:768px) {
    .blog-article-hero-stack .header-image-content .header-image-image {
        display:none
    }
}
.blog-article-hero-stack .header-image-content .header-image-image-mobile {
    display:none
}
@media(max-width:768px) {
    .blog-article-hero-stack .header-image-content .header-image-image-mobile {
        background-position:50%;
        background-size:cover;
        display:block;
        width:100%
    }
}
.blog-article-outer {
    max-width:1440px;
    position:relative
}
.blog-article-inner,
.blog-article-outer {
    box-sizing:border-box;
    margin-left:auto;
    margin-right:auto;
    width:100%
}
.blog-article-inner {
    max-width:780px
}
@media(min-width:1275px) {
    .blog-article-inner {
        padding-left:90px;
        padding-right:90px
    }
}
@media(max-width:1274px)and (min-width:769px) {
    .blog-article-inner {
        padding-left:60px;
        padding-right:60px
    }
}
@media(max-width:768px) {
    .blog-article-inner {
        padding-left:40px;
        padding-right:40px
    }
}
@media(max-width:400px) {
    .blog-article-inner {
        padding-left:20px;
        padding-right:20px
    }
}
.blog-article-title {
    margin-bottom:60px;
    margin-top:100px
}
@media(max-width:768px) {
    .blog-article-title {
        margin-bottom:40px;
        margin-top:40px
    }
}
@media(min-width:999px) {
    .blog-article-share {
        box-sizing:border-box;
        height:100%;
        position:absolute;
        right:0;
        top:0
    }
}
@media(max-width:1450px) {
    .blog-article-share {
        right:40px
    }
}
@media(max-width:998px) {
    .blog-article-share {
        margin-bottom:60px;
        margin-top:60px
    }
}
.blog-article-share-inner {
    -webkit-align-items:center;
    align-items:center;
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column
}
@media(min-width:999px) {
    .blog-article-share-inner {
        position:-webkit-sticky;
        position:sticky;
        top:40px
    }
}
.blog-article-share-inner h5 {
    font-weight:600
}
.blog-article-share-inner ul {
    display:-webkit-flex;
    display:flex
}
@media(min-width:999px) {
    .blog-article-share-inner ul {
        -webkit-flex-direction:column;
        flex-direction:column
    }
}
.blog-article-share-inner ul li {
    padding:.5rem
}
.blog-article-share-inner ul li .custom-icon {
    font-size:3rem
}
.blog-article-share-inner ul li button {
    background-color:transparent;
    border:none;
    margin:0;
    padding:0
}
.blog-article-share-inner ul li button:focus {
    outline:0
}
.blog-article-share-inner ul li button:hover {
    cursor:pointer
}
.blog-article-share-link {
    color:var(--dark);
    opacity:.25;
    transition:all .3s
}
@media(hover:hover) {
    .blog-article-share-link:hover {
        opacity:.65
    }
}
.blog-article-share-copy {
    position:relative
}
.blog-article-share-notification {
    background-color:var(--dark);
    border-radius:4px;
    box-sizing:border-box;
    color:var(--text-on-dark);
    left:50%;
    opacity:0;
    padding:2px 4px;
    position:absolute;
    text-align:center;
    top:43px;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    transition:.35s ease;
    width:96px
}
.blog-article-share-notification.active {
    opacity:.75
}
.blog-article .rich-text h4,
.blog-article .rich-text h5 {
    font-weight:600
}
.blog-article .rich-text a {
    color:var(--link)!important;
    text-decoration:underline!important
}

:root {
    --iti-hover-color: rgba(0, 0, 0, 0.05);
    --iti-text-gray: #999;
    --iti-border-gray: #ccc;
    --iti-spacer-horizontal: 8px;
    --iti-flag-height: 15px;
    --iti-flag-width: 20px;
    --iti-border-width: 1px;
    --iti-arrow-height: 4px;
    --iti-arrow-width: 6px;
    --iti-triangle-border: calc(var(--iti-arrow-width) / 2);
    --iti-arrow-padding: 6px;
    --iti-arrow-color: #555;
    --iti-input-padding: 6px;
    --iti-right-hand-selected-country-padding: calc(var(--iti-spacer-horizontal) + var(--iti-spacer-horizontal) + var(--iti-flag-width));
    --iti-selected-country-arrow-padding: calc(var(--iti-arrow-padding) + var(--iti-arrow-padding) + var(--iti-flag-width) + var(--iti-spacer-horizontal) + var(--iti-arrow-width) + var(--iti-input-padding));
    --iti-path-flags-1x: url("../img/flags.png?1");
    --iti-path-flags-2x: url("../img/flags@2x.png?1");
    --iti-path-globe-1x: url("../img/globe.png");
    --iti-path-globe-2x: url("../img/globe@2x.png");
    --iti-flag-sprite-width: 5762px;
    --iti-flag-sprite-height: 15px;
    --iti-mobile-popup-margin: 30px;
}

.iti {
    position: relative;
    display: inline-block;
}
.iti * {
    box-sizing: border-box;
}
.iti__hide {
    display: none;
}
.iti__v-hide {
    visibility: hidden;
}
.iti__a11y-text {
    width: 1px;
    height: 1px;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
    position: absolute;
}
.iti input.iti__tel-input,
.iti input.iti__tel-input[type=text],
.iti input.iti__tel-input[type=tel] {
    position: relative;
    z-index: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-right: var(--iti-right-hand-selected-country-padding);
    margin-right: 0;
}
.iti__country-container {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    padding: var(--iti-border-width);
}
.iti__selected-country {
    z-index: 1;
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    background: none;
    border: 0;
    margin: 0;
    padding: 0;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    border-radius: 0;
    font-weight: inherit;
    line-height: inherit;
    text-decoration: none;
}
.iti__selected-country-primary {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 var(--iti-arrow-padding) 0 var(--iti-spacer-horizontal);
}
.iti__arrow {
    margin-left: var(--iti-arrow-padding);
    width: 0;
    height: 0;
    border-left: var(--iti-triangle-border) solid transparent;
    border-right: var(--iti-triangle-border) solid transparent;
    border-top: var(--iti-arrow-height) solid var(--iti-arrow-color);
}
[dir=rtl] .iti__arrow {
    margin-right: var(--iti-arrow-padding);
    margin-left: 0;
}
.iti__arrow--up {
    border-top: none;
    border-bottom: var(--iti-arrow-height) solid var(--iti-arrow-color);
}
.iti__dropdown-content {
    border-radius: 3px;
    background-color: white;
}
.iti--inline-dropdown .iti__dropdown-content {
    position: absolute;
    z-index: 2;
    margin-top: 3px;
    margin-left: calc(var(--iti-border-width) * -1);
    border: var(--iti-border-width) solid var(--iti-border-gray);
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
}
.iti__search-input {
    width: 100%;
    border-width: 0;
    border-radius: 3px;
    padding: 9px 12px;
}
.iti__search-input + .iti__country-list {
    border-top: 1px solid var(--iti-border-gray);
}
.iti__country-list {
    list-style: none;
    padding: 0;
    margin: 0;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}
.iti--inline-dropdown .iti__country-list {
    max-height: 185px;
}
.iti--flexible-dropdown-width .iti__country-list {
    white-space: nowrap;
}
@media (max-width: 500px) {
    .iti--flexible-dropdown-width .iti__country-list {
        white-space: normal;
    }
}
.iti__flag-box {
    display: inline-block;
    width: var(--iti-flag-width);
}
.iti__country {
    display: flex;
    align-items: center;
    padding: 8px var(--iti-spacer-horizontal);
    outline: none;
}
.iti__dial-code {
    color: var(--iti-text-gray);
}
.iti__country.iti__highlight {
    background-color: var(--iti-hover-color);
}
.iti__flag-box, .iti__country-name {
    margin-right: var(--iti-spacer-horizontal);
}
[dir=rtl] .iti__flag-box, [dir=rtl] .iti__country-name {
    margin-right: 0;
    margin-left: var(--iti-spacer-horizontal);
}
.iti--allow-dropdown input.iti__tel-input,
.iti--allow-dropdown input.iti__tel-input[type=text],
.iti--allow-dropdown input.iti__tel-input[type=tel] {
    padding-right: var(--iti-input-padding);
    padding-left: var(--iti-selected-country-arrow-padding);
    margin-left: 0;
}
[dir=rtl] .iti--allow-dropdown input.iti__tel-input,
[dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=text],
[dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=tel] {
    padding-right: var(--iti-selected-country-arrow-padding);
    padding-left: var(--iti-input-padding);
    margin-right: 0;
}
.iti--allow-dropdown .iti__country-container {
    right: auto;
    left: 0;
}
[dir=rtl] .iti--allow-dropdown .iti__country-container {
    right: 0;
    left: auto;
}
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])):hover, .iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])):hover button {
    cursor: pointer;
}
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country-primary:hover,
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country:has(+ .iti__dropdown-content:hover) .iti__selected-country-primary {
    background-color: var(--iti-hover-color);
}
.iti .iti__selected-dial-code {
    margin-left: 4px;
}
[dir=rtl] .iti .iti__selected-dial-code {
    margin-left: 0;
    margin-right: 4px;
}
.iti--container {
    position: fixed;
    top: -1000px;
    left: -1000px;
    z-index: 1060;
    padding: var(--iti-border-width);
}
.iti--container:hover {
    cursor: pointer;
}

.iti--fullscreen-popup.iti--container {
    background-color: rgba(0, 0, 0, 0.5);
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: fixed;
    padding: var(--iti-mobile-popup-margin);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
.iti--fullscreen-popup .iti__dropdown-content {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    position: relative;
}
.iti--fullscreen-popup .iti__country {
    padding: 10px 10px;
    line-height: 1.5em;
}

.iti__flag {
    --iti-flag-offset: 0px;
    --iti-flag-width: 20px;
    --iti-flag-height: 14px;
    height: var(--iti-flag-height);
    width: var(--iti-flag-width);
    box-shadow: 0px 0px 1px 0px #888;
    background-image: var(--iti-path-flags-1x);
    background-repeat: no-repeat;
    background-position: var(--iti-flag-offset) 0;
    background-size: var(--iti-flag-sprite-width) var(--iti-flag-sprite-height);
}

.iti__np {
    --iti-flag-width: 13px;
}

.iti__va, .iti__ch {
    --iti-flag-width: 15px;
}

.iti__ne, .iti__be {
    --iti-flag-width: 18px;
}

.iti__mc {
    --iti-flag-width: 19px;
}

.iti__zw, .iti__ws, .iti__vg, .iti__uz, .iti__uk, .iti__tv, .iti__to, .iti__tl, .iti__tk, .iti__tj, .iti__tc, .iti__ta, .iti__su, .iti__st, .iti__ss, .iti__si, .iti__sh, .iti__sd, .iti__sc, .iti__sb, .iti__ps, .iti__pn, .iti__ph, .iti__om, .iti__nz, .iti__nu, .iti__nr, .iti__ng, .iti__nf, .iti__nc, .iti__my, .iti__ms, .iti__mp, .iti__mn, .iti__mk, .iti__me, .iti__md, .iti__ly, .iti__lv, .iti__lk, .iti__lc, .iti__kz, .iti__ky, .iti__kw, .iti__kp, .iti__ki, .iti__jo, .iti__jm, .iti__io, .iti__im, .iti__ie, .iti__hu, .iti__hr, .iti__hn, .iti__hm, .iti__gw, .iti__gs, .iti__gi, .iti__gb, .iti__fk, .iti__fj, .iti__et, .iti__er, .iti__eh, .iti__dm, .iti__dg, .iti__cx, .iti__cu, .iti__ck, .iti__cc, .iti__ca, .iti__by, .iti__bs, .iti__bn, .iti__bm, .iti__ba, .iti__az, .iti__au, .iti__as, .iti__am, .iti__ai, .iti__ae, .iti__ac {
    --iti-flag-height: 10px;
}

.iti__us, .iti__um, .iti__py, .iti__mh, .iti__lr, .iti__gu, .iti__fm {
    --iti-flag-height: 11px;
}

.iti__vu, .iti__tt, .iti__sv, .iti__ni, .iti__mx, .iti__lu, .iti__lt, .iti__li, .iti__km, .iti__kg, .iti__je, .iti__ir, .iti__ht, .iti__gy, .iti__gd, .iti__fi, .iti__de, .iti__cv, .iti__cr, .iti__cq, .iti__bz, .iti__bi, .iti__bh, .iti__bg, .iti__bd {
    --iti-flag-height: 12px;
}

.iti__tg, .iti__se, .iti__pw, .iti__pl, .iti__kh, .iti__gt, .iti__ee, .iti__ax, .iti__ar {
    --iti-flag-height: 13px;
}

.iti__xk, .iti__va, .iti__sm, .iti__sj, .iti__pg, .iti__np, .iti__no, .iti__ne, .iti__mc, .iti__is, .iti__il, .iti__ga, .iti__fo, .iti__dk, .iti__ch, .iti__cd, .iti__bv, .iti__be, .iti__al {
    --iti-flag-height: 15px;
}

.iti__qa {
    --iti-flag-height: 8px;
}

.iti__ac {
    --iti-flag-offset: 0px;
}

.iti__ad {
    --iti-flag-offset: -22px;
}

.iti__ae {
    --iti-flag-offset: -44px;
}

.iti__af {
    --iti-flag-offset: -66px;
}

.iti__ag {
    --iti-flag-offset: -88px;
}

.iti__ai {
    --iti-flag-offset: -110px;
}

.iti__al {
    --iti-flag-offset: -132px;
}

.iti__am {
    --iti-flag-offset: -154px;
}

.iti__ao {
    --iti-flag-offset: -176px;
}

.iti__aq {
    --iti-flag-offset: -198px;
}

.iti__ar {
    --iti-flag-offset: -220px;
}

.iti__as {
    --iti-flag-offset: -242px;
}

.iti__at {
    --iti-flag-offset: -264px;
}

.iti__au {
    --iti-flag-offset: -286px;
}

.iti__aw {
    --iti-flag-offset: -308px;
}

.iti__ax {
    --iti-flag-offset: -330px;
}

.iti__az {
    --iti-flag-offset: -352px;
}

.iti__ba {
    --iti-flag-offset: -374px;
}

.iti__bb {
    --iti-flag-offset: -396px;
}

.iti__bd {
    --iti-flag-offset: -418px;
}

.iti__be {
    --iti-flag-offset: -440px;
}

.iti__bf {
    --iti-flag-offset: -460px;
}

.iti__bg {
    --iti-flag-offset: -482px;
}

.iti__bh {
    --iti-flag-offset: -504px;
}

.iti__bi {
    --iti-flag-offset: -526px;
}

.iti__bj {
    --iti-flag-offset: -548px;
}

.iti__bl {
    --iti-flag-offset: -570px;
}

.iti__bm {
    --iti-flag-offset: -592px;
}

.iti__bn {
    --iti-flag-offset: -614px;
}

.iti__bo {
    --iti-flag-offset: -636px;
}

.iti__bq {
    --iti-flag-offset: -658px;
}

.iti__br {
    --iti-flag-offset: -680px;
}

.iti__bs {
    --iti-flag-offset: -702px;
}

.iti__bt {
    --iti-flag-offset: -724px;
}

.iti__bv {
    --iti-flag-offset: -746px;
}

.iti__bw {
    --iti-flag-offset: -768px;
}

.iti__by {
    --iti-flag-offset: -790px;
}

.iti__bz {
    --iti-flag-offset: -812px;
}

.iti__ca {
    --iti-flag-offset: -834px;
}

.iti__cc {
    --iti-flag-offset: -856px;
}

.iti__cd {
    --iti-flag-offset: -878px;
}

.iti__cf {
    --iti-flag-offset: -900px;
}

.iti__cg {
    --iti-flag-offset: -922px;
}

.iti__ch {
    --iti-flag-offset: -944px;
}

.iti__ci {
    --iti-flag-offset: -961px;
}

.iti__ck {
    --iti-flag-offset: -983px;
}

.iti__cl {
    --iti-flag-offset: -1005px;
}

.iti__cm {
    --iti-flag-offset: -1027px;
}

.iti__cn {
    --iti-flag-offset: -1049px;
}

.iti__co {
    --iti-flag-offset: -1071px;
}

.iti__cp {
    --iti-flag-offset: -1093px;
}

.iti__cq {
    --iti-flag-offset: -1115px;
}

.iti__cr {
    --iti-flag-offset: -1137px;
}

.iti__cu {
    --iti-flag-offset: -1159px;
}

.iti__cv {
    --iti-flag-offset: -1181px;
}

.iti__cw {
    --iti-flag-offset: -1203px;
}

.iti__cx {
    --iti-flag-offset: -1225px;
}

.iti__cy {
    --iti-flag-offset: -1247px;
}

.iti__cz {
    --iti-flag-offset: -1269px;
}

.iti__de {
    --iti-flag-offset: -1291px;
}

.iti__dg {
    --iti-flag-offset: -1313px;
}

.iti__dj {
    --iti-flag-offset: -1335px;
}

.iti__dk {
    --iti-flag-offset: -1357px;
}

.iti__dm {
    --iti-flag-offset: -1379px;
}

.iti__do {
    --iti-flag-offset: -1401px;
}

.iti__dz {
    --iti-flag-offset: -1423px;
}

.iti__ea {
    --iti-flag-offset: -1445px;
}

.iti__ec {
    --iti-flag-offset: -1467px;
}

.iti__ee {
    --iti-flag-offset: -1489px;
}

.iti__eg {
    --iti-flag-offset: -1511px;
}

.iti__eh {
    --iti-flag-offset: -1533px;
}

.iti__er {
    --iti-flag-offset: -1555px;
}

.iti__es {
    --iti-flag-offset: -1577px;
}

.iti__et {
    --iti-flag-offset: -1599px;
}

.iti__eu {
    --iti-flag-offset: -1621px;
}

.iti__ez {
    --iti-flag-offset: -1643px;
}

.iti__fi {
    --iti-flag-offset: -1665px;
}

.iti__fj {
    --iti-flag-offset: -1687px;
}

.iti__fk {
    --iti-flag-offset: -1709px;
}

.iti__fm {
    --iti-flag-offset: -1731px;
}

.iti__fo {
    --iti-flag-offset: -1753px;
}

.iti__fr {
    --iti-flag-offset: -1775px;
}

.iti__fx {
    --iti-flag-offset: -1797px;
}

.iti__ga {
    --iti-flag-offset: -1819px;
}

.iti__gb {
    --iti-flag-offset: -1841px;
}

.iti__gd {
    --iti-flag-offset: -1863px;
}

.iti__ge {
    --iti-flag-offset: -1885px;
}

.iti__gf {
    --iti-flag-offset: -1907px;
}

.iti__gg {
    --iti-flag-offset: -1929px;
}

.iti__gh {
    --iti-flag-offset: -1951px;
}

.iti__gi {
    --iti-flag-offset: -1973px;
}

.iti__gl {
    --iti-flag-offset: -1995px;
}

.iti__gm {
    --iti-flag-offset: -2017px;
}

.iti__gn {
    --iti-flag-offset: -2039px;
}

.iti__gp {
    --iti-flag-offset: -2061px;
}

.iti__gq {
    --iti-flag-offset: -2083px;
}

.iti__gr {
    --iti-flag-offset: -2105px;
}

.iti__gs {
    --iti-flag-offset: -2127px;
}

.iti__gt {
    --iti-flag-offset: -2149px;
}

.iti__gu {
    --iti-flag-offset: -2171px;
}

.iti__gw {
    --iti-flag-offset: -2193px;
}

.iti__gy {
    --iti-flag-offset: -2215px;
}

.iti__hk {
    --iti-flag-offset: -2237px;
}

.iti__hm {
    --iti-flag-offset: -2259px;
}

.iti__hn {
    --iti-flag-offset: -2281px;
}

.iti__hr {
    --iti-flag-offset: -2303px;
}

.iti__ht {
    --iti-flag-offset: -2325px;
}

.iti__hu {
    --iti-flag-offset: -2347px;
}

.iti__ic {
    --iti-flag-offset: -2369px;
}

.iti__id {
    --iti-flag-offset: -2391px;
}

.iti__ie {
    --iti-flag-offset: -2413px;
}

.iti__il {
    --iti-flag-offset: -2435px;
}

.iti__im {
    --iti-flag-offset: -2457px;
}

.iti__in {
    --iti-flag-offset: -2479px;
}

.iti__io {
    --iti-flag-offset: -2501px;
}

.iti__iq {
    --iti-flag-offset: -2523px;
}

.iti__ir {
    --iti-flag-offset: -2545px;
}

.iti__is {
    --iti-flag-offset: -2567px;
}

.iti__it {
    --iti-flag-offset: -2589px;
}

.iti__je {
    --iti-flag-offset: -2611px;
}

.iti__jm {
    --iti-flag-offset: -2633px;
}

.iti__jo {
    --iti-flag-offset: -2655px;
}

.iti__jp {
    --iti-flag-offset: -2677px;
}

.iti__ke {
    --iti-flag-offset: -2699px;
}

.iti__kg {
    --iti-flag-offset: -2721px;
}

.iti__kh {
    --iti-flag-offset: -2743px;
}

.iti__ki {
    --iti-flag-offset: -2765px;
}

.iti__km {
    --iti-flag-offset: -2787px;
}

.iti__kn {
    --iti-flag-offset: -2809px;
}

.iti__kp {
    --iti-flag-offset: -2831px;
}

.iti__kr {
    --iti-flag-offset: -2853px;
}

.iti__kw {
    --iti-flag-offset: -2875px;
}

.iti__ky {
    --iti-flag-offset: -2897px;
}

.iti__kz {
    --iti-flag-offset: -2919px;
}

.iti__la {
    --iti-flag-offset: -2941px;
}

.iti__lb {
    --iti-flag-offset: -2963px;
}

.iti__lc {
    --iti-flag-offset: -2985px;
}

.iti__li {
    --iti-flag-offset: -3007px;
}

.iti__lk {
    --iti-flag-offset: -3029px;
}

.iti__lr {
    --iti-flag-offset: -3051px;
}

.iti__ls {
    --iti-flag-offset: -3073px;
}

.iti__lt {
    --iti-flag-offset: -3095px;
}

.iti__lu {
    --iti-flag-offset: -3117px;
}

.iti__lv {
    --iti-flag-offset: -3139px;
}

.iti__ly {
    --iti-flag-offset: -3161px;
}

.iti__ma {
    --iti-flag-offset: -3183px;
}

.iti__mc {
    --iti-flag-offset: -3205px;
}

.iti__md {
    --iti-flag-offset: -3226px;
}

.iti__me {
    --iti-flag-offset: -3248px;
}

.iti__mf {
    --iti-flag-offset: -3270px;
}

.iti__mg {
    --iti-flag-offset: -3292px;
}

.iti__mh {
    --iti-flag-offset: -3314px;
}

.iti__mk {
    --iti-flag-offset: -3336px;
}

.iti__ml {
    --iti-flag-offset: -3358px;
}

.iti__mm {
    --iti-flag-offset: -3380px;
}

.iti__mn {
    --iti-flag-offset: -3402px;
}

.iti__mo {
    --iti-flag-offset: -3424px;
}

.iti__mp {
    --iti-flag-offset: -3446px;
}

.iti__mq {
    --iti-flag-offset: -3468px;
}

.iti__mr {
    --iti-flag-offset: -3490px;
}

.iti__ms {
    --iti-flag-offset: -3512px;
}

.iti__mt {
    --iti-flag-offset: -3534px;
}

.iti__mu {
    --iti-flag-offset: -3556px;
}

.iti__mv {
    --iti-flag-offset: -3578px;
}

.iti__mw {
    --iti-flag-offset: -3600px;
}

.iti__mx {
    --iti-flag-offset: -3622px;
}

.iti__my {
    --iti-flag-offset: -3644px;
}

.iti__mz {
    --iti-flag-offset: -3666px;
}

.iti__na {
    --iti-flag-offset: -3688px;
}

.iti__nc {
    --iti-flag-offset: -3710px;
}

.iti__ne {
    --iti-flag-offset: -3732px;
}

.iti__nf {
    --iti-flag-offset: -3752px;
}

.iti__ng {
    --iti-flag-offset: -3774px;
}

.iti__ni {
    --iti-flag-offset: -3796px;
}

.iti__nl {
    --iti-flag-offset: -3818px;
}

.iti__no {
    --iti-flag-offset: -3840px;
}

.iti__np {
    --iti-flag-offset: -3862px;
}

.iti__nr {
    --iti-flag-offset: -3877px;
}

.iti__nu {
    --iti-flag-offset: -3899px;
}

.iti__nz {
    --iti-flag-offset: -3921px;
}

.iti__om {
    --iti-flag-offset: -3943px;
}

.iti__pa {
    --iti-flag-offset: -3965px;
}

.iti__pe {
    --iti-flag-offset: -3987px;
}

.iti__pf {
    --iti-flag-offset: -4009px;
}

.iti__pg {
    --iti-flag-offset: -4031px;
}

.iti__ph {
    --iti-flag-offset: -4053px;
}

.iti__pk {
    --iti-flag-offset: -4075px;
}

.iti__pl {
    --iti-flag-offset: -4097px;
}

.iti__pm {
    --iti-flag-offset: -4119px;
}

.iti__pn {
    --iti-flag-offset: -4141px;
}

.iti__pr {
    --iti-flag-offset: -4163px;
}

.iti__ps {
    --iti-flag-offset: -4185px;
}

.iti__pt {
    --iti-flag-offset: -4207px;
}

.iti__pw {
    --iti-flag-offset: -4229px;
}

.iti__py {
    --iti-flag-offset: -4251px;
}

.iti__qa {
    --iti-flag-offset: -4273px;
}

.iti__re {
    --iti-flag-offset: -4295px;
}

.iti__ro {
    --iti-flag-offset: -4317px;
}

.iti__rs {
    --iti-flag-offset: -4339px;
}

.iti__ru {
    --iti-flag-offset: -4361px;
}

.iti__rw {
    --iti-flag-offset: -4383px;
}

.iti__sa {
    --iti-flag-offset: -4405px;
}

.iti__sb {
    --iti-flag-offset: -4427px;
}

.iti__sc {
    --iti-flag-offset: -4449px;
}

.iti__sd {
    --iti-flag-offset: -4471px;
}

.iti__se {
    --iti-flag-offset: -4493px;
}

.iti__sg {
    --iti-flag-offset: -4515px;
}

.iti__sh {
    --iti-flag-offset: -4537px;
}

.iti__si {
    --iti-flag-offset: -4559px;
}

.iti__sj {
    --iti-flag-offset: -4581px;
}

.iti__sk {
    --iti-flag-offset: -4603px;
}

.iti__sl {
    --iti-flag-offset: -4625px;
}

.iti__sm {
    --iti-flag-offset: -4647px;
}

.iti__sn {
    --iti-flag-offset: -4669px;
}

.iti__so {
    --iti-flag-offset: -4691px;
}

.iti__sr {
    --iti-flag-offset: -4713px;
}

.iti__ss {
    --iti-flag-offset: -4735px;
}

.iti__st {
    --iti-flag-offset: -4757px;
}

.iti__su {
    --iti-flag-offset: -4779px;
}

.iti__sv {
    --iti-flag-offset: -4801px;
}

.iti__sx {
    --iti-flag-offset: -4823px;
}

.iti__sy {
    --iti-flag-offset: -4845px;
}

.iti__sz {
    --iti-flag-offset: -4867px;
}

.iti__ta {
    --iti-flag-offset: -4889px;
}

.iti__tc {
    --iti-flag-offset: -4911px;
}

.iti__td {
    --iti-flag-offset: -4933px;
}

.iti__tf {
    --iti-flag-offset: -4955px;
}

.iti__tg {
    --iti-flag-offset: -4977px;
}

.iti__th {
    --iti-flag-offset: -4999px;
}

.iti__tj {
    --iti-flag-offset: -5021px;
}

.iti__tk {
    --iti-flag-offset: -5043px;
}

.iti__tl {
    --iti-flag-offset: -5065px;
}

.iti__tm {
    --iti-flag-offset: -5087px;
}

.iti__tn {
    --iti-flag-offset: -5109px;
}

.iti__to {
    --iti-flag-offset: -5131px;
}

.iti__tr {
    --iti-flag-offset: -5153px;
}

.iti__tt {
    --iti-flag-offset: -5175px;
}

.iti__tv {
    --iti-flag-offset: -5197px;
}

.iti__tw {
    --iti-flag-offset: -5219px;
}

.iti__tz {
    --iti-flag-offset: -5241px;
}

.iti__ua {
    --iti-flag-offset: -5263px;
}

.iti__ug {
    --iti-flag-offset: -5285px;
}

.iti__uk {
    --iti-flag-offset: -5307px;
}

.iti__um {
    --iti-flag-offset: -5329px;
}

.iti__un {
    --iti-flag-offset: -5351px;
}

.iti__us {
    --iti-flag-offset: -5373px;
}

.iti__uy {
    --iti-flag-offset: -5395px;
}

.iti__uz {
    --iti-flag-offset: -5417px;
}

.iti__va {
    --iti-flag-offset: -5439px;
}

.iti__vc {
    --iti-flag-offset: -5456px;
}

.iti__ve {
    --iti-flag-offset: -5478px;
}

.iti__vg {
    --iti-flag-offset: -5500px;
}

.iti__vi {
    --iti-flag-offset: -5522px;
}

.iti__vn {
    --iti-flag-offset: -5544px;
}

.iti__vu {
    --iti-flag-offset: -5566px;
}

.iti__wf {
    --iti-flag-offset: -5588px;
}

.iti__ws {
    --iti-flag-offset: -5610px;
}

.iti__xk {
    --iti-flag-offset: -5632px;
}

.iti__ye {
    --iti-flag-offset: -5654px;
}

.iti__yt {
    --iti-flag-offset: -5676px;
}

.iti__za {
    --iti-flag-offset: -5698px;
}

.iti__zm {
    --iti-flag-offset: -5720px;
}

.iti__zw {
    --iti-flag-offset: -5742px;
}

.iti__globe {
    background-image: var(--iti-path-globe-1x);
    background-size: contain;
    background-position: right;
    box-shadow: none;
    height: 19px;
}

@media (min-resolution: 2x) {
    .iti__flag {
        background-image: var(--iti-path-flags-2x);
    }
    .iti__globe {
        background-image: var(--iti-path-globe-2x);
    }
}

.sidebar {
    left: 0;
    top: 0;
    width: 220px;
    height: 100vh;
    box-sizing: border-box;
    grid-column: 1;
}

.sidebar a {
    display: block;
    color: var(--text);
    text-decoration: none;
    padding: 12px 0;
    font-size: 1.6rem;
}

.sidebar a:hover {
    color: var(--light);
}

.dashboard-container {
    display: flex;
    min-height: calc(100vh - 60px);
}

.dashboard {
    padding: 30px;
    grid-column: 2;
    width: 100%;
}

.dashboard h2 {
    color: var(--light);
    font-weight: bold;
}

.dashboard h4 {
    color: var(--dark);
    font-weight: bold;
}

.required-documents-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #ddd;
    border-radius: 12px;
    overflow: hidden;
}

.required-documents-table td {
    text-align: center;
}

.client-document-dashboard .dashboard {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.client-dashboard-header,
.upload-result-heading,
.client-document-card,
.client-document-actions,
.client-upload-form {
    align-items: center;
    display: flex;
    gap: 16px;
}

.client-dashboard-header {
    justify-content: space-between;
}

.dashboard-eyebrow {
    color: #168273;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.client-dashboard-subtitle {
    color: #667085;
    margin: 0;
}

.client-report-download,
.client-upload-form button,
.view-document-link {
    border-radius: 8px;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    padding: 13px 18px;
    white-space: nowrap;
}

.client-report-download,
.client-upload-form button {
    background: #0f4d8f;
    border: 1px solid #0f4d8f;
    color: #fff;
}

.client-report-download:hover,
.client-upload-form button:hover {
    background: #0b3d72;
    color: #fff;
}

.client-report-download.secondary,
.view-document-link {
    background: #fff;
    border: 1px solid #0f4d8f;
    color: #10213d;
}

.upload-result-panel,
.client-document-category {
    background: #fff;
    border: 1px solid #d8e2ef;
    border-radius: 8px;
    padding: 22px;
}

.upload-result-heading {
    justify-content: space-between;
    margin-bottom: 18px;
}

.upload-result-heading h3,
.client-document-category h3 {
    color: #0f4d8f;
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
}

.upload-result-heading p {
    color: #667085;
    margin: 4px 0 0;
}

.upload-result-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.upload-result-grid article {
    background: #f7faff;
    border: 1px solid #d8e2ef;
    border-radius: 8px;
    padding: 16px;
}

.upload-result-grid h4,
.client-document-main h4 {
    color: #10213d;
    font-size: 1.7rem;
    font-weight: 700;
}

.upload-result-grid ul {
    margin: 0;
    padding-left: 18px;
}

.upload-result-grid li {
    font-size: 1.5rem;
    margin-bottom: 8px;
}

.upload-result-grid span {
    display: block;
}

.client-required-documents {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.client-document-category {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.client-document-card {
    background: #f7faff;
    border: 1px solid #d8e2ef;
    border-radius: 8px;
    justify-content: space-between;
    padding: 16px 18px;
}

.client-document-main {
    flex: 1 1 auto;
    min-width: 220px;
}

.client-document-main p {
    color: #667085;
    margin: 4px 0 0;
}

.client-document-status {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 120px;
}

.client-document-status small {
    color: #667085;
    font-size: 1.3rem;
}

.client-status-pill {
    background: #fff3cd;
    border-radius: 999px;
    color: #7a4c00;
    font-size: 1.4rem;
    font-weight: 700;
    padding: 8px 12px;
}

.client-status-pill.verified {
    background: #d1fae5;
    color: #065f46;
}

/* Nothing here is outstanding, so it is neither a warning nor an achievement: it reads as the
   quiet grey of something the client only acts on if it applies to them. */
.client-status-pill.optional {
    background: #eef2f7;
    color: #44536b;
}

.client-status-pill.mismatch,
.client-status-pill.wrong_document,
.client-status-pill.expired,
.client-status-pill.needs_review,
.client-status-pill.unreadable,
.client-status-pill.unavailable {
    background: #fee2e2;
    color: #991b1b;
}

.client-upload-form {
    margin: 0;
}

.client-upload-form .input {
    margin: 0;
}

.client-upload-form input[type="file"] {
    max-width: 250px;
}

.document-analysis-list {
    background: #f7faff;
    border: 1px solid #d8e2ef;
    border-radius: 8px;
    margin: 10px 0 0;
    padding: 10px 14px 10px 28px;
}

.document-analysis-list li {
    color: #10213d;
    font-size: 1.35rem;
    line-height: 1.9rem;
    margin: 0 0 4px;
}

@media (max-width: 900px) {
    .client-dashboard-header,
    .client-document-card,
    .client-document-actions,
    .client-upload-form,
    .upload-result-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .upload-result-grid {
        grid-template-columns: 1fr;
    }

    .client-document-status {
        align-items: flex-start;
    }
}

/* Standalone client portal */
body.client-portal-body {
    background: #f7f9fb;
    color: #10213d;
    font-family: 'Montserrat', Arial, sans-serif;
    letter-spacing: 0;
    margin: 0;
    min-width: 0;
    overflow-x: hidden;
    width: 100%;
}

body.client-portal-body button,
body.client-portal-body input,
body.client-portal-body select,
body.client-portal-body textarea {
    font-family: inherit;
    letter-spacing: 0;
}

.client-portal-main,
.client-portal-layout-container {
    margin: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    width: 100%;
}

.client-portal-shell {
    background: #fff;
    display: grid;
    grid-template-columns: 176px minmax(0, 1fr);
    grid-template-rows: 122px minmax(calc(100vh - 122px), auto);
    min-height: 100vh;
    min-height: 100dvh;
}

.client-portal-sidebar {
    background: #cbe8f7;
    display: flex;
    flex-direction: column;
    grid-row: 1 / 3;
    min-width: 0;
}

/* The navy sampled from the logo file itself, so the picture does not read as a square of a
   slightly different blue sitting inside the tile. The admin sidebar's tile does the same. */
.client-portal-logo {
    align-items: center;
    background: #0a2870;
    display: flex;
    height: 122px;
    justify-content: center;
    overflow: hidden;
    line-height: 0;
    width: 100%;
}

/* The logo is square and the tile is not, so covering the tile crops the top and bottom off
   it — which took the words under the shield with them. Fitted inside instead, and centred. */
/* No padding: the file already carries a wide margin of its own, and a second one on top of
   it only shrank the mark and widened the border around it. */
.client-portal-logo img {
    display: block;
    height: auto;
    margin: 0;
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
    width: auto;
}

.client-portal-sidebar nav {
    display: flex;
    flex-direction: column;
    padding: 22px 0;
}

.client-portal-sidebar nav a,
.client-portal-logout {
    border-left: 4px solid transparent;
    color: #10213d;
    display: block;
    font-size: 1.45rem;
    font-weight: 500;
    line-height: 1.3;
    padding: 15px 18px;
    text-decoration: none;
}

.client-portal-sidebar nav a:hover,
.client-portal-sidebar nav a:focus,
.client-portal-sidebar nav a.active {
    background: rgba(255, 255, 255, 0.5);
    border-left-color: #104b91;
    color: #0b4381;
    font-weight: 700;
}

.client-portal-logout {
    margin-top: auto;
    padding-bottom: 24px;
}

.client-portal-header {
    align-items: center;
    background: #cbe8f7;
    display: flex;
    gap: 28px;
    justify-content: space-between;
    min-width: 0;
    padding: 20px 34px;
}

.client-portal-brand,
.client-portal-welcome {
    display: flex;
}

.client-portal-brand {
    flex-direction: column;
    gap: 3px;
}

.client-portal-brand strong {
    font-size: 1.8rem;
}

.client-portal-brand span {
    font-size: 1.55rem;
}

.client-portal-welcome {
    align-items: center;
    font-size: 1.65rem;
    gap: 18px;
    white-space: nowrap;
}

/* A simple account silhouette, kept inside a fixed circular frame at every viewport width. */
.client-portal-avatar {
    aspect-ratio: 1;
    background: none;
    border: 3px solid #111;
    border-radius: 50%;
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    flex: 0 0 auto;
    height: 48px;
    padding: 0;
    position: relative;
    width: 48px;
}

.client-portal-avatar::before {
    background: #111;
    border-radius: 50%;
    content: '';
    height: 27%;
    left: 50%;
    position: absolute;
    top: 20%;
    transform: translateX(-50%);
    width: 27%;
}

.client-portal-avatar::after {
    background: #111;
    border-radius: 50% 50% 28% 28%;
    bottom: 15%;
    content: '';
    height: 29%;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 58%;
}

.client-portal-content {
    min-width: 0;
    padding: 30px 36px 54px;
}

.client-portal-flash:empty {
    display: none;
}

.client-portal-flash .message {
    margin: 0 0 20px;
}

.client-application-heading {
    align-items: flex-end;
    display: flex;
    gap: 24px;
    justify-content: space-between;
}

.client-application-heading h1 {
    color: #2997df;
    font-size: 3.5rem;
    font-weight: 700;
    line-height: 1.15;
    margin: 0;
}

.client-application-owner {
    color: #5d6e86;
    font-size: 1.4rem;
    margin: 0 0 6px;
}

.client-application-count {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.client-application-count strong {
    color: #104b91;
    font-size: 2.2rem;
}

.client-application-count span {
    color: #5d6e86;
    font-size: 1.3rem;
}

.client-portal-notice {
    align-items: center;
    background: #e4f4fb;
    border: 1px solid #2d70b3;
    border-radius: 8px;
    display: flex;
    gap: 18px;
    margin: 0 0 28px;
    padding: 15px 22px;
}

.client-portal-notice-icon {
    align-items: center;
    background: #3b9df0;
    border-radius: 50%;
    color: #fff;
    display: flex;
    flex: 0 0 28px;
    font-size: 1.8rem;
    font-weight: 700;
    height: 28px;
    justify-content: center;
}

.client-portal-notice strong {
    color: #0b4381;
    display: block;
    font-size: 1.6rem;
}

.client-portal-notice p {
    color: #34445b;
    font-size: 1.3rem;
    margin: 3px 0 0;
}

.client-batch-upload {
    align-items: center;
    background: #f2f8fc;
    border: 1px solid #8bbce0;
    border-radius: 8px;
    display: grid;
    gap: 28px;
    grid-template-columns: minmax(0, 1fr) minmax(440px, 0.9fr);
    margin: 0 0 28px;
    padding: 20px 22px;
}

/*
 * The browser's own stylesheet hides a [hidden] element by setting display: none at the same
 * specificity as a plain class — one attribute selector against one class selector — so
 * whichever of the two is declared later wins. This page's own CSS loads after the browser's,
 * so ".client-batch-upload { display: grid }" above was winning and the panel stayed on
 * screen, laid out as a grid, however many times its hidden attribute was set. A class and an
 * attribute together outrank the class alone, which is what finally lets hidden mean hidden.
 */
.client-batch-upload[hidden] {
    display: none;
}

.client-batch-upload-heading {
    align-items: center;
    display: flex;
    gap: 16px;
    min-width: 0;
}

.client-batch-upload-heading > div {
    flex: 1;
    min-width: 0;
}

.client-batch-upload-close {
    align-items: center;
    align-self: flex-start;
    background: #fff;
    border: 1px solid #104b91;
    border-radius: 6px;
    color: #104b91;
    cursor: pointer;
    display: inline-flex;
    flex: none;
    font-size: 1.1rem;
    font-weight: 700;
    /* Milligram's own bare "button" rule sets a fixed height and a 3.8rem line-height sized
       for its own, taller default button. This class's padding alone was never enough to
       override that — the text kept Milligram's tall line-height inside a box this padding
       had squeezed shorter, so it sat near the top of the button instead of in the middle
       of it. Flex centering sidesteps the mismatch instead of trying to out-calculate it. */
    height: auto;
    justify-content: center;
    line-height: 1.3;
    padding: 8px 10px;
    white-space: nowrap;
}

/* Milligram's own button:focus rule repaints any focused button grey-on-white at a
   specificity (element + pseudo-class) this class alone cannot beat, and the panel focuses
   this button itself the moment it opens — so it needs its own :focus here, not only
   :focus-visible, or the word is grey on a near-white background the moment anyone sees it. */
.client-batch-upload-close:hover,
.client-batch-upload-close:focus,
.client-batch-upload-close:focus-visible {
    background: #e4f4fb;
    border-color: #104b91;
    color: #104b91;
}

.client-batch-upload-icon {
    align-items: center;
    background: #104b91;
    border-radius: 50%;
    display: flex;
    flex: 0 0 48px;
    font-size: 2.2rem;
    font-weight: 700;
    height: 48px;
    justify-content: center;
}

/*
 * Two classes, to outrank ".client-batch-upload-heading span" (one class and one element
 * selector, but still a stronger match than this rule used to be). The icon is itself a span,
 * so that rule's own grey — meant for the paragraph of description text next to it — was
 * winning over white and the arrow was rendering nearly invisible on its own dark circle.
 */
.client-batch-upload-heading .client-batch-upload-icon {
    color: #fff;
}

.client-batch-upload-heading p,
.client-batch-upload-heading h2,
.client-batch-upload-heading span {
    margin: 0;
}

.client-batch-upload-heading p {
    color: #104b91;
    font-size: 1.05rem;
    font-weight: 700;
    text-transform: uppercase;
}

.client-batch-upload-heading h2 {
    color: #10213d;
    font-size: 1.75rem;
    line-height: 1.25;
}

.client-batch-upload-heading span {
    color: #40516a;
    display: block;
    font-size: 1.15rem;
    line-height: 1.45;
    margin-top: 4px;
}

.client-batch-upload-form {
    align-items: center;
    background: #fff;
    border: 1px dashed #7b9fbe;
    border-radius: 8px;
    display: grid;
    gap: 8px 12px;
    grid-template-columns: max-content minmax(0, 1fr) max-content;
    margin: 0;
    min-width: 0;
    padding: 14px;
    transition: background-color 160ms ease, border-color 160ms ease;
}

.client-batch-upload-form.drag-active {
    background: #e4f4fb;
    border-color: #2997df;
    border-style: solid;
}

.client-batch-file-input {
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.client-batch-file-picker,
.client-batch-submit {
    border-radius: 6px;
    box-sizing: border-box;
    cursor: pointer;
    font-size: 1.15rem;
    font-weight: 700;
    height: 42px;
    line-height: 40px;
    margin: 0;
    padding: 0 15px;
    text-align: center;
    text-transform: none;
    white-space: nowrap;
}

.client-batch-file-picker {
    background: #fff;
    border: 1px solid #104b91;
    color: #104b91;
}

.client-batch-file-input:focus + .client-batch-file-picker {
    outline: 2px solid #2997df;
    outline-offset: 2px;
}

.client-batch-file-summary {
    color: #53657d;
    font-size: 1.05rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-batch-submit {
    background: #104b91;
    border: 1px solid #104b91;
    color: #fff;
}

.client-batch-submit:hover,
.client-batch-submit:focus {
    background: #0b3d76;
    border-color: #0b3d76;
}

.client-batch-submit:disabled {
    background: #8d9caf;
    border-color: #8d9caf;
    cursor: not-allowed;
}

.client-batch-drop-hint {
    color: #667085;
    font-size: 1rem;
    grid-column: 1 / -1;
    text-align: center;
}

.client-batch-file-list {
    display: grid;
    gap: 7px;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    width: 100%;
}

.client-batch-file-list[hidden] {
    display: none;
}

.client-batch-file-list li {
    align-items: center;
    background: #f4f8fc;
    border: 1px solid #cfdae6;
    border-radius: 6px;
    color: #253653;
    display: flex;
    font-size: 0.95rem;
    gap: 8px;
    justify-content: space-between;
    min-width: 0;
    padding: 7px 8px 7px 10px;
}

.client-batch-file-list li span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-batch-file-remove {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 4px;
    color: #8f1d1d;
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 28px;
    font-size: 1.1rem;
    font-weight: 700;
    height: 28px;
    justify-content: center;
    line-height: 1;
    margin: 0;
    padding: 0;
    text-transform: none;
    width: 28px;
}

.client-batch-file-remove:hover,
.client-batch-file-remove:focus {
    background: #feecec;
}

.client-upload-result {
    background: #f7faff;
    border: 1px solid #b9cce0;
    border-radius: 8px;
    margin: 0 0 28px;
    padding: 20px 22px;
}

.client-upload-result-heading,
.client-required-heading {
    align-items: center;
    display: flex;
    gap: 20px;
    justify-content: space-between;
}

.client-upload-result h2,
.client-upload-result h3,
.client-required-heading h2 {
    color: #104b91;
    margin: 0;
}

.client-upload-result-heading p,
.client-required-heading p {
    color: #5d6e86;
    font-size: 1.25rem;
    margin: 3px 0 0;
}

.client-report-download {
    background: #104b91;
    border-radius: 6px;
    color: #fff;
    font-size: 1.3rem;
    font-weight: 700;
    padding: 10px 14px;
    text-decoration: none;
    white-space: nowrap;
}

.client-upload-result-columns {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 16px;
}

.client-upload-result-columns > div + div {
    border-left: 1px solid #d4deea;
    padding-left: 24px;
}

.client-upload-result-columns ul {
    margin: 8px 0 0;
}

.client-upload-result-columns li {
    color: #40516a;
    font-size: 1.25rem;
    margin-bottom: 8px;
}

.client-upload-result-columns li strong,
.client-upload-result-columns li span {
    display: block;
}

.client-required-section {
    scroll-margin-top: 18px;
}

.client-required-heading {
    align-items: flex-end;
    margin-bottom: 12px;
}

.client-required-heading h2 {
    font-size: 2.2rem;
}

.client-required-heading-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: flex-end;
}

.client-required-progress {
    color: #104b91;
    font-size: 1.3rem;
    font-weight: 700;
    white-space: nowrap;
}

/* Sized to its own two words, not stretched to match whatever width the longer download
   link beside it happens to need. .client-upload-submit's own shared rule (further down this
   file) sets width: 100% for the narrow single-document panel it is mostly used in, which
   this button is not inside — the extra class here is what outranks that rule regardless of
   which of the two is declared first. */
.client-required-heading-actions .client-batch-upload-launch {
    min-width: 0;
    white-space: nowrap;
    width: auto;
}

.client-required-heading-actions .client-report-download {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    font-size: 1.2rem;
    justify-content: center;
    line-height: 1.25;
    min-height: 42px;
    padding: 8px 13px;
    white-space: nowrap;
}

.client-required-layout {
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 1fr) minmax(290px, 340px);
    min-width: 0;
}

.client-document-checklist {
    border: 1px solid #a9b3be;
    border-radius: 8px;
    min-width: 0;
    overflow: hidden;
}

.client-document-checklist-row {
    align-items: center;
    background: #fff;
    border: 0;
    border-radius: 0;
    color: #10213d;
    cursor: pointer;
    display: grid;
    gap: 14px;
    grid-template-columns: 20px minmax(170px, 1fr) max-content minmax(110px, 0.55fr) 10px;
    margin: 0;
    min-height: 78px;
    padding: 14px 18px;
    text-align: left;
    text-transform: none;
    width: 100%;
}

.client-document-category + .client-document-category {
    border-top: 1px solid #d9e0e7;
}

.client-document-category-toggle {
    background: #f7fafc;
}

.client-document-category-toggle .client-document-checklist-name strong {
    letter-spacing: 0.01em;
}

.client-document-category-toggle .client-document-chevron {
    transition: transform 0.15s ease;
}

.client-document-category-toggle.open .client-document-chevron {
    transform: rotate(90deg);
}

.client-document-category-list {
    border-top: 1px solid #eef2f6;
}

.client-document-category-row {
    background: #fff;
    padding-left: 40px;
}

.client-document-category-row + .client-document-category-row {
    border-top: 1px solid #eef2f6;
}

.client-document-checklist-row + .client-document-checklist-row {
    border-top: 1px solid #d9e0e7;
}

.client-document-checklist-row:hover,
.client-document-checklist-row:focus,
.client-document-checklist-row:focus-visible,
.client-document-checklist-row.selected {
    background: #edf7fd;
    box-shadow: inset 4px 0 #2997df;
    color: #10213d;
}

.client-document-checklist-row:focus-visible {
    outline: 2px solid #2997df;
    outline-offset: -3px;
}

.client-document-help {
    align-items: center;
    border: 1px solid #111;
    border-radius: 50%;
    color: #111;
    display: flex;
    flex: 0 0 20px;
    font-size: 1.2rem;
    height: 20px;
    justify-content: center;
    margin: 0;
}

.client-document-checklist-name {
    display: block;
    min-width: 0;
}

.client-document-checklist-name strong {
    color: #17243d;
    display: block;
    font-size: 1.45rem;
    line-height: 1.25;
    margin: 0;
}

.client-document-checklist-name small,
.client-document-checklist-date {
    color: #667085;
    display: block;
    font-size: 1.1rem;
    line-height: 1.35;
    margin: 3px 0 0;
    overflow-wrap: anywhere;
}

.client-document-checklist-date {
    margin: 0;
}

/* Only a category header carries a chevron, where it points at the list it opens. A document
   row had one too, which read as "this goes somewhere" when selecting it opens the upload panel
   beside it and goes nowhere. */
.client-document-chevron {
    color: #104b91;
    font-size: 2rem;
    line-height: 1;
    transform: translateX(0);
    transition: transform 160ms ease;
}

.client-document-checklist-row .client-status-pill {
    font-size: 1.15rem;
    line-height: 1.2;
    padding: 7px 10px;
    text-align: center;
    white-space: nowrap;
}

.client-upload-station {
    align-self: start;
    background: #cbe8f7;
    border: 1px solid #2d70b3;
    border-radius: 8px;
    min-height: 390px;
    padding: 24px;
    position: sticky;
    top: 18px;
}

.client-upload-station-panel {
    display: flex;
    flex-direction: column;
    gap: 22px;
    min-height: 342px;
}

.client-upload-station-panel[hidden] {
    display: none;
}

.client-upload-station-title {
    align-items: center;
    display: flex;
    gap: 14px;
}

.client-upload-station-icon {
    align-items: center;
    border: 3px solid #10213d;
    border-radius: 50%;
    display: flex;
    flex: 0 0 52px;
    font-size: 2.5rem;
    font-weight: 700;
    height: 52px;
    justify-content: center;
}

/* Same reason as .client-batch-upload-heading .client-batch-upload-icon above: the icon is
   itself a span, so ".client-upload-station-title span" (one class and one element selector)
   otherwise outranks a plain ".client-upload-station-icon" and repaints the icon in the
   description text's colour instead of its own. */
.client-upload-station-title .client-upload-station-icon {
    color: #10213d;
}

.client-upload-station-title p,
.client-upload-station-title h3,
.client-upload-station-title span,
.client-upload-station-review p {
    margin: 0;
}

.client-upload-station-title p {
    color: #104b91;
    font-size: 1.15rem;
    font-weight: 700;
    text-transform: uppercase;
}

.client-upload-station-title h3 {
    color: #10213d;
    font-size: 1.6rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.client-upload-station-title span {
    color: #40516a;
    font-size: 1.3rem;
    line-height: 1.45;
}

/*
 * Milligram sets the page's root font-size to 62.5% (10px), so a "1.3rem" here was only
 * 13px of actual text — comfortably small-print by any ordinary measure, and smaller still
 * once the width-640px rule below cut it further for the one device this text matters most
 * on. Sized in rem against that 10px root, not against the browser's own 16px default.
 */
.client-upload-station-review p {
    color: #40516a;
    font-size: 1.7rem;
    line-height: 1.5;
    /* More than one finding is sent as one line per finding; this is what turns the line
       breaks between them into actual line breaks instead of running them into one paragraph. */
    white-space: pre-line;
}

.client-upload-station-review {
    border-bottom: 1px solid rgba(16, 75, 145, 0.25);
    border-top: 1px solid rgba(16, 75, 145, 0.25);
    padding: 16px 0;
}

.client-upload-station-review strong {
    color: #10213d;
    display: block;
    font-size: 1.8rem;
    margin-bottom: 5px;
}

/* A review with more than one finding is clamped to two lines rather than hidden outright — a
   long one pushed the upload button on this panel out of reach, but hiding the whole thing
   behind a closed disclosure went too far the other way and said nothing at all without a
   click. The first finding (or the start of it) always shows; "Show more" below lifts the
   clamp for the rest. */
.client-review-text-clamped p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.client-review-text-clamped.client-review-expanded p {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
}

.client-review-show-more {
    background: none;
    border: 0;
    color: #104b91;
    cursor: pointer;
    font: inherit;
    font-size: 1.3rem;
    font-weight: 700;
    margin-top: 2px;
    padding: 0;
    text-decoration: underline;
}

.client-review-show-more:hover,
.client-review-show-more:focus {
    color: #0b3d76;
}

.client-review-spinner {
    animation: client-review-spin 0.9s linear infinite;
    border: 2px solid rgba(16, 75, 145, 0.25);
    border-radius: 50%;
    border-top-color: #104b91;
    display: inline-block;
    height: 14px;
    margin-right: 8px;
    vertical-align: -1px;
    width: 14px;
}

@keyframes client-review-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .client-review-spinner {
        animation-duration: 3s;
    }
}

/* ------------------------------------------------------------------
 * The conversation about one document.
 *
 * This was one note the client wrote over each time they saved, with
 * nothing coming back. What the broker says is the only place a
 * client is told what to actually do next, so it is the loudest
 * thing on the panel; what they said themselves sits quieter beside
 * it, as the thing being answered.
 * ------------------------------------------------------------------ */

.client-document-thread {
    display: grid;
    gap: 12px;
    margin: 0;
    min-width: 0;
}

.client-document-thread h3 {
    color: #10213d;
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0;
}

.client-document-thread-empty {
    color: #667085;
    font-size: 1.2rem;
    line-height: 1.45;
    margin: 0;
}

.client-document-thread-list {
    display: grid;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.client-thread-line {
    border-radius: 6px;
    padding: 10px 12px;
}

.client-thread-client {
    background: #f4f6f9;
    border-left: 4px solid #8c99aa;
}

.client-thread-broker {
    background: #eaf4ff;
    border-left: 4px solid #104b91;
}

.client-thread-line strong {
    display: block;
    font-size: 1.15rem;
    margin-bottom: 4px;
}

.client-thread-client strong {
    color: #667085;
}

.client-thread-broker strong {
    color: #104b91;
}

.client-thread-line p {
    color: #10213d;
    font-size: 1.3rem;
    line-height: 1.45;
    margin: 0;
    overflow-wrap: anywhere;
}

.client-thread-line small {
    color: #8792a4;
    display: block;
    font-size: 1.05rem;
    margin-top: 5px;
}

/* The history, and the box for adding to it, both folded away. A panel is for sending a file;
   showing every message at once pushed the upload button off the bottom of the screen and
   buried the one line that matters in the four before it. */
.client-thread-earlier summary,
.client-thread-compose summary {
    color: #104b91;
    cursor: pointer;
    font-size: 1.2rem;
    font-weight: 700;
    list-style: none;
    padding: 4px 0;
}

.client-thread-earlier summary::-webkit-details-marker,
.client-thread-compose summary::-webkit-details-marker {
    display: none;
}

.client-thread-earlier summary::before,
.client-thread-compose summary::before {
    content: '\203A';
    display: inline-block;
    margin-right: 7px;
    transition: transform 0.15s ease;
}

.client-thread-earlier[open] summary::before,
.client-thread-compose[open] summary::before {
    transform: rotate(90deg);
}

@media (prefers-reduced-motion: reduce) {
    .client-thread-earlier summary::before,
    .client-thread-compose summary::before {
        transition: none;
    }
}

.client-thread-earlier summary {
    color: #667085;
    font-weight: 600;
}

.client-thread-earlier > .client-document-thread-list,
.client-thread-compose > form {
    margin-top: 10px;
}

.client-upload-station-note {
    display: grid;
    gap: 8px;
    margin: 0;
    min-width: 0;
}

.client-upload-station-note .input {
    margin: 0;
}

.client-upload-station-note label {
    color: #10213d;
    display: block;
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 7px;
}

.client-upload-station-note textarea {
    background: #fff;
    border: 1px solid #8c99aa;
    border-radius: 6px;
    box-sizing: border-box;
    color: #10213d;
    font: inherit;
    line-height: 1.4;
    min-height: 84px;
    padding: 10px 12px;
    resize: vertical;
    width: 100%;
}

.client-upload-station-note textarea:focus {
    border-color: #2997df;
    box-shadow: 0 0 0 2px rgba(41, 151, 223, 0.18);
    outline: 0;
}

/* Centred by the flex box rather than by a line height. The button inherits a 38px line height
   meant for a button with no padding of its own; adding 8px of padding to that leaves a 24px
   content box holding a 38px line, which overflows it and carries the label 7px below centre. */
.client-upload-station-note button {
    background: #fff;
    border: 1px solid #104b91;
    color: #104b91;
    cursor: pointer;
}

.client-upload-station-note button:hover,
.client-upload-station-note button:focus {
    background: #edf6fd;
    color: #0b4381;
}

.document-client-note {
    background: #edf6fd;
    border-left: 3px solid #2997df;
    border-radius: 0 4px 4px 0;
    color: #1f3f62;
    margin: 7px 0;
    overflow-wrap: anywhere;
    padding: 8px 10px;
}

.client-upload-station-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: auto;
}

/*
 * The buttons stacked down one document's panel: Save note, View document, Choose file, Upload.
 * They sit one under another and are pressed one after another, so they are one size and one
 * weight rather than four near-misses.
 *
 * Centred by the flex box rather than by a line height matched to a fixed height. The two go out
 * of step the moment anything changes — a label that wraps, or the narrow-screen rules below
 * that swap the fixed height for a minimum and add vertical padding — and the label drifts off
 * centre. This way it is centred because it is centred.
 */
.client-upload-station-note button,
.client-document-view,
.client-panel-quick-upload,
.client-file-picker,
.client-upload-submit {
    align-items: center;
    border-radius: 6px;
    box-sizing: border-box;
    display: flex;
    font-size: 1.2rem;
    font-weight: 700;
    justify-content: center;
    line-height: 1.25;
    margin: 0;
    min-height: 42px;
    padding: 8px 13px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    width: 100%;
}

/* The combined rule above gives every button in this family display:flex, which otherwise beats
   the hidden attribute's own display:none at equal specificity. Nothing in that family is ever
   hidden except this one, once a file has been chosen and there is something to send. */
.client-upload-submit[hidden] {
    display: none;
}

.client-document-view,
.client-panel-quick-upload {
    background: #fff;
    border: 1px solid #104b91;
    color: #104b91;
    cursor: pointer;
}

.client-document-view:hover,
.client-document-view:focus,
.client-panel-quick-upload:hover,
.client-panel-quick-upload:focus {
    background: #edf6fd;
    color: #0b4381;
}

/*
 * Deleting is the one action here that cannot be undone, so it is given the same shape as the
 * others but a quieter, red-edged treatment: easy to find when it is wanted, and never the
 * button somebody hits by accident on the way to uploading.
 */
.client-document-delete {
    background: #fff;
    border: 1px solid #d9b3b8;
    border-radius: 6px;
    box-sizing: border-box;
    color: #a3283a;
    cursor: pointer;
    display: block;
    font-size: 1.05rem;
    font-weight: 600;
    height: 38px;
    line-height: 36px;
    margin: 0;
    padding: 0 13px;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    width: 100%;
}

.client-document-delete:hover,
.client-document-delete:focus {
    background: #fdeff1;
    border-color: #a3283a;
    color: #85202f;
}

.client-document-upload-form {
    display: grid;
    gap: 9px;
    grid-template-columns: 1fr;
    margin: 0;
    min-width: 0;
    width: 100%;
}

.client-file-input {
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.client-file-input:focus + .client-file-picker {
    outline: 2px solid #2997df;
    outline-offset: 2px;
}

.client-file-picker {
    background: #fff;
    border: 1px solid #8c99aa;
    color: #28374e;
    cursor: pointer;
}

.client-file-name {
    color: #667085;
    font-size: 1.1rem;
    max-width: 100%;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-upload-submit {
    background: #104b91;
    border: 1px solid #104b91;
    color: #fff;
}

.client-upload-submit:hover,
.client-upload-submit:focus {
    background: #0b3d76;
    border-color: #0b3d76;
}

.client-upload-complete {
    color: #166534;
    font-size: 1.2rem;
    font-weight: 700;
}

@media (max-width: 1120px) {
    .client-batch-upload {
        grid-template-columns: 1fr;
    }

    .client-required-layout {
        grid-template-columns: 1fr;
    }

    .client-upload-station {
        min-height: 0;
        position: static;
    }

    .client-upload-station-panel {
        display: grid;
        gap: 18px;
        grid-template-areas:
            "title review actions"
            "note note note";
        grid-template-columns: minmax(220px, 0.8fr) minmax(220px, 1fr) minmax(220px, 0.8fr);
        min-height: 0;
    }

    .client-upload-station-title {
        grid-area: title;
    }

    .client-upload-station-review {
        border-bottom: 0;
        border-left: 1px solid rgba(16, 75, 145, 0.25);
        border-right: 1px solid rgba(16, 75, 145, 0.25);
        border-top: 0;
        grid-area: review;
        padding: 0 18px;
    }

    .client-upload-station-note {
        grid-area: note;
    }

    .client-upload-station-actions {
        grid-area: actions;
        margin-top: 0;
    }
}

@media (max-width: 820px) {
    .client-portal-shell {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
    }

    .client-portal-header {
        padding: 14px 18px;
    }

    .client-portal-brand strong {
        font-size: 1.5rem;
    }

    .client-portal-brand span,
    .client-portal-welcome {
        font-size: 1.25rem;
    }

    .client-portal-avatar {
        height: 40px;
        width: 40px;
    }

    .client-portal-content {
        padding: 24px 18px 42px;
    }

    .client-application-heading {
        align-items: flex-start;
    }

    .client-application-heading h1 {
        font-size: 2.8rem;
    }

    .client-upload-result-columns {
        grid-template-columns: 1fr;
    }

    .client-batch-upload-form {
        grid-template-columns: max-content minmax(0, 1fr);
    }

    .client-batch-submit {
        grid-column: 1 / -1;
        width: 100%;
    }

    .client-upload-result-columns > div + div {
        border-left: 0;
        border-top: 1px solid #d4deea;
        padding-left: 0;
        padding-top: 16px;
    }

    .client-upload-station-panel {
        display: flex;
        min-height: 0;
    }

    .client-upload-station-review {
        border-bottom: 1px solid rgba(16, 75, 145, 0.25);
        border-left: 0;
        border-right: 0;
        border-top: 1px solid rgba(16, 75, 145, 0.25);
        padding: 16px 0;
    }
}

@media (max-width: 560px) {
    .client-portal-header {
        align-items: flex-start;
    }

    .client-portal-welcome > span:first-child,
    .client-application-owner,
    .client-required-heading p {
        display: none;
    }

    .client-application-heading h1 {
        font-size: 2.45rem;
    }

    .client-application-count strong {
        font-size: 1.8rem;
    }

    .client-application-count span {
        font-size: 1.05rem;
    }

    .client-portal-notice {
        align-items: flex-start;
        padding: 14px;
    }

    .client-batch-upload {
        gap: 18px;
        padding: 16px;
    }

    .client-batch-upload-heading {
        align-items: flex-start;
    }

    .client-batch-upload-icon {
        flex-basis: 40px;
        font-size: 1.8rem;
        height: 40px;
    }

    .client-batch-upload-heading h2 {
        font-size: 1.55rem;
    }

    .client-batch-upload-form {
        grid-template-columns: 1fr;
    }

    .client-batch-file-picker,
    .client-batch-submit {
        grid-column: 1;
        width: 100%;
    }

    .client-batch-file-summary {
        white-space: normal;
    }

    .client-batch-file-list {
        grid-template-columns: 1fr;
    }

    .client-batch-drop-hint {
        display: none;
    }

    .client-required-heading {
        align-items: flex-start;
    }

    .client-document-checklist-row {
        align-items: start;
        gap: 6px 12px;
        grid-template-columns: 20px minmax(0, 1fr) auto;
        height: auto;
        padding: 15px 14px;
    }

    .client-document-help {
        grid-column: 1;
        grid-row: 1;
    }

    .client-document-checklist-name {
        grid-column: 2;
        grid-row: 1;
    }

    .client-document-checklist-row .client-status-pill {
        grid-column: 2 / 4;
        grid-row: 2;
        justify-self: start;
    }

    .client-document-checklist-date {
        grid-column: 2;
        grid-row: 3;
    }

    .client-document-chevron {
        display: none;
    }

    .client-upload-station {
        padding: 20px;
    }

    .client-upload-station-title {
        align-items: flex-start;
    }
}

@media (min-width: 821px) and (max-width: 980px) {
    .client-upload-station-panel {
        grid-template-areas:
            "title review"
            "note note"
            "actions actions";
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .client-upload-station-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    body.client-portal-body {
        overflow-x: hidden;
    }

    .client-portal-content {
        min-width: 0;
    }

    .client-upload-station-panel {
        gap: 16px;
    }
}

@media (max-width: 640px) {

    .client-portal-header {
        gap: 10px;
        min-height: 60px;
        padding: 10px 12px;
    }

    .client-portal-brand strong {
        font-size: 1.2rem;
    }

    .client-portal-brand span {
        font-size: 1rem;
    }

    .client-portal-welcome > span:first-child {
        display: none;
    }

    .client-portal-avatar {
        height: 36px;
        width: 36px;
    }

    .client-portal-content {
        padding: 18px 12px 36px;
    }

    .client-application-heading {
        gap: 12px;
    }

    .client-application-heading h1 {
        font-size: 2.15rem;
        line-height: 1.2;
    }

    .client-application-count strong {
        font-size: 1.6rem;
    }

    .client-application-count span {
        font-size: 0.95rem;
    }

    .client-portal-notice {
        gap: 12px;
        margin-bottom: 20px;
    }

    .client-portal-notice strong {
        font-size: 1.3rem;
    }

    .client-portal-notice p {
        font-size: 1rem;
    }

    .client-batch-upload,
    .client-upload-result {
        margin-bottom: 20px;
    }

    .client-batch-upload-heading h2 {
        font-size: 1.4rem;
        overflow-wrap: anywhere;
    }

    .client-batch-upload-heading span {
        font-size: 1rem;
    }

    .client-batch-file-picker,
    .client-batch-submit,
    .client-upload-station-note button,
    .client-document-view,
    .client-file-picker,
    .client-upload-submit {
        padding: 10px 12px;
    }

    .client-upload-result-heading,
    .client-required-heading {
        align-items: flex-start;
        gap: 12px;
    }

    .client-upload-result-heading {
        flex-direction: column;
    }

    .client-report-download {
        text-align: center;
        white-space: normal;
        width: 100%;
    }

    .client-required-heading-actions .client-report-download {
        padding: 10px 12px;
    }

    .client-required-heading-actions {
        justify-content: flex-start;
        width: 100%;
    }

    .client-required-heading h2 {
        font-size: 1.8rem;
    }

    .client-required-progress {
        font-size: 1.05rem;
    }

    .client-document-checklist-name strong {
        font-size: 1.2rem;
        overflow-wrap: anywhere;
    }

    .client-document-checklist-name small,
    .client-document-checklist-date {
        font-size: 0.95rem;
    }

    .client-document-checklist-row .client-status-pill {
        font-size: 1rem;
    }

    .client-upload-station {
        padding: 16px;
    }

    .client-upload-station-title h3 {
        font-size: 1.35rem;
    }

    .client-upload-station-title span {
        font-size: 1.15rem;
    }

    .client-upload-station-review p {
        font-size: 1.6rem;
    }
}

@media (max-width: 380px) {
    .client-portal-content {
        padding-inline: 9px;
    }

    .client-application-heading {
        align-items: flex-start;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .client-application-heading h1 {
        font-size: 1.9rem;
    }

    .client-portal-notice-icon {
        flex-basis: 24px;
        font-size: 1.4rem;
        height: 24px;
    }

    .client-batch-upload,
    .client-upload-result,
    .client-upload-station {
        padding: 13px;
    }

    .client-batch-upload-heading {
        gap: 10px;
    }

    .client-batch-upload-heading h2 {
        font-size: 1.25rem;
    }

    .client-document-checklist-row {
        padding-inline: 11px;
    }
}

/* The lender must never be sent a tax file number, so the warning sits where files are chosen
   rather than in a policy page nobody opens. */
.client-upload-warning {
    margin: 10px 0 0;
    padding: 10px 12px;
    border-radius: 8px;
    background: #fff4e5;
    border: 1px solid #f0c48a;
    color: #7a4b00;
    font-size: 0.9rem;
    line-height: 1.45;
}

.client-upload-station-note {
    display: block;
    margin-top: 4px;
    color: #5b6b7f;
    font-size: 0.85rem;
    line-height: 1.4;
}

/* Saying where a document really belongs. The reading leaves anything it is unsure of under
   Other rather than guessing a row, so this is how it gets to the right one. */
.client-document-move-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #e6ecf3;
}

.client-document-move-form label {
    color: #5b6b7f;
    font-size: 0.9rem;
    font-weight: 600;
}

.client-document-move-form select {
    flex: 1 1 180px;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid #cfd9e4;
    border-radius: 8px;
    background: #fff;
    color: #10233c;
    font: inherit;
}

.client-document-move-form button {
    padding: 8px 16px;
    border: 1px solid #104b91;
    border-radius: 8px;
    background: #fff;
    color: #104b91;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.client-document-move-form button:hover {
    background: #104b91;
    color: #fff;
}

/* The same control on the admin side: a document is never filed on a guess, so both sides need
   a way to put one where it belongs. */
.document-move-form {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 6px 0;
}

.document-move-form select {
    max-width: 190px;
    padding: 5px 8px;
    border: 1px solid #cfd9e4;
    border-radius: 6px;
    background: #fff;
    font: inherit;
    font-size: 0.85rem;
}

.document-move-form button {
    padding: 5px 12px;
    border: 1px solid #104b91;
    border-radius: 6px;
    background: #fff;
    color: #104b91;
    font: inherit;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
}

.document-move-form button:hover {
    background: #104b91;
    color: #fff;
}

/* ------------------------------------------------------------------
 * Loan applications: the Get Started wizard, and My Loans.
 *
 * Both sit inside the client portal shell, so they inherit its sidebar,
 * header, and notice bar and only add the cards and rows of their own.
 * ------------------------------------------------------------------ */

.loan-wizard-title {
    color: #2997df;
    font-size: 3.5rem;
    font-weight: 700;
    line-height: 1.15;
    margin: 0 0 14px;
}

.loan-wizard-subtitle {
    color: #0b3b7a;
    font-size: 2.4rem;
    font-weight: 700;
    margin: 0 0 22px;
}

.loan-wizard-back {
    margin: 26px 0 0;
}

.loan-wizard-back a {
    color: #104b91;
    font-size: 1.4rem;
    font-weight: 600;
    text-decoration: none;
}

.loan-wizard-back a:hover,
.loan-wizard-back a:focus {
    text-decoration: underline;
}

.loan-purpose-form {
    margin: 0;
}

.loan-card-grid {
    display: grid;
    gap: 26px;
    grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

.loan-card-grid > li {
    display: flex;
    margin: 0;
}

/* A card is a link on the first screen and a submit button on the second, so both are reset to
   the same box rather than each carrying its own idea of padding and text alignment. The site's
   own button styling is undone here as well: a card is not a button to look at, whatever it is
   to the browser, so it keeps neither the uppercase lettering nor the fixed height. */
.loan-card {
    appearance: none;
    background: #fff;
    border: 1px solid #8bbce0;
    border-radius: 10px;
    color: inherit;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    font: inherit;
    gap: 16px;
    height: auto;
    letter-spacing: normal;
    line-height: 1.4;
    min-height: 160px;
    padding: 24px 26px;
    text-align: left;
    text-decoration: none;
    text-transform: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
    white-space: normal;
    width: 100%;
}

a.loan-card:hover,
a.loan-card:focus,
button.loan-card:hover,
button.loan-card:focus {
    border-color: #2997df;
    box-shadow: 0 6px 18px rgba(16, 75, 145, 0.14);
    transform: translateY(-2px);
}

.loan-card-heading {
    align-items: center;
    color: #2997df;
    display: flex;
    gap: 16px;
    width: 100%;
}

.loan-card .loan-card-heading strong {
    color: #2997df;
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 1.1;
    text-transform: none;
}

.loan-card-icon {
    color: #10213d;
    flex: 0 0 38px;
    height: 38px;
    width: 38px;
}

.loan-card-chevron {
    color: #2997df;
    font-size: 2.6rem;
    line-height: 1;
    margin-left: auto;
}

.loan-card-blurb {
    color: #10213d;
    font-size: 1.7rem;
    line-height: 1.35;
}

/* Picking Other means writing the answer, so this card holds a field instead of being one big
   button, and carries its own submit. */
.loan-card-written {
    cursor: default;
    gap: 10px;
}

.loan-card-written:hover,
.loan-card-written:focus-within {
    border-color: #2997df;
    box-shadow: 0 6px 18px rgba(16, 75, 145, 0.14);
}

.loan-card-written label {
    color: #34445b;
    font-size: 1.35rem;
    margin: 0;
}

.loan-card-written input[type="text"] {
    border: 1px solid #8bbce0;
    border-radius: 6px;
    font: inherit;
    font-size: 1.45rem;
    height: auto;
    margin: 0;
    padding: 9px 12px;
    width: 100%;
}

.loan-card .loan-card-continue {
    align-self: flex-start;
    background: #102f78;
    border: 0;
    border-radius: 6px;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: 1.4rem;
    font-weight: 600;
    height: auto;
    letter-spacing: normal;
    margin-top: auto;
    padding: 10px 22px;
    text-transform: none;
}

.loan-card-continue:hover,
.loan-card-continue:focus {
    background: #0b2560;
}

.loan-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.loan-list > li {
    margin: 0;
}

.loan-list-row {
    align-items: center;
    background: #fff;
    border: 1px solid #10213d;
    border-radius: 10px;
    color: inherit;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    padding: 20px 26px;
    /* The link that opens the row is stretched across it from here. */
    position: relative;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.loan-list-row:hover,
.loan-list-row:focus-within {
    border-color: #2997df;
    box-shadow: 0 6px 18px rgba(16, 75, 145, 0.14);
}

.loan-list-open {
    color: inherit;
    min-width: 0;
    text-decoration: none;
}

/* The link covers the whole card from behind, so pressing anywhere opens the application while
   the controls in front of it stay pressable. */
.loan-list-open::after {
    border-radius: 10px;
    content: '';
    inset: 0;
    position: absolute;
}

.loan-list-name {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.loan-list-name strong {
    color: #10213d;
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1.15;
}

.loan-list-name span {
    color: #34445b;
    font-size: 1.4rem;
}

.loan-list-state {
    align-items: flex-end;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 6px;
    /* In front of the stretched link, so the withdraw button inside it is reachable. */
    position: relative;
}

.loan-list-status {
    background: #d6e9f8;
    border-radius: 6px;
    color: #0b4381;
    display: block;
    font-size: 1.5rem;
    font-weight: 600;
    min-width: 240px;
    padding: 10px 18px;
    text-align: center;
}

.loan-list-status-complete {
    background: #d8f0dd;
    color: #1d6b33;
}

.loan-list-applied {
    color: #34445b;
    font-size: 1.35rem;
}

.loan-list-actions {
    display: flex;
    justify-content: flex-end;
    margin: 24px 0 0;
}

.loan-start-new {
    background: #102f78;
    border-radius: 6px;
    color: #fff;
    font-size: 1.5rem;
    font-weight: 600;
    padding: 12px 34px;
    text-decoration: none;
}

.loan-start-new:hover,
.loan-start-new:focus {
    background: #0b2560;
    color: #fff;
}

.client-application-breadcrumb {
    margin: 0 0 6px;
}

.client-application-breadcrumb a {
    color: #104b91;
    font-size: 1.4rem;
    font-weight: 600;
    text-decoration: none;
}

.client-application-breadcrumb a:hover,
.client-application-breadcrumb a:focus {
    text-decoration: underline;
}

.client-application-purpose {
    color: #34445b;
    font-size: 1.45rem;
    margin: 6px 0 0;
}

@media (max-width: 820px) {
    .loan-wizard-title {
        font-size: 2.8rem;
    }

    .loan-wizard-subtitle {
        font-size: 2rem;
    }

    .loan-card-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .loan-card {
        min-height: 0;
    }

    .loan-card-heading strong {
        font-size: 2.1rem;
    }

    .loan-list-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .loan-list-state {
        align-items: stretch;
        width: 100%;
    }

    .loan-list-status {
        min-width: 0;
    }
}

/* Withdrawing is a real thing to be able to do and a rare thing to want, so it sits quietly
   under the date inside the card it belongs to, rather than floating between the card and the
   button that starts a new application. */
.loan-list-withdraw {
    background: none;
    border: 0;
    color: #7c6f76;
    cursor: pointer;
    font: inherit;
    font-size: 1.25rem;
    margin-top: 2px;
    padding: 2px 0;
    text-decoration: underline;
}

.loan-list-withdraw:hover,
.loan-list-withdraw:focus {
    color: #8a2432;
}

/* ------------------------------------------------------------------
 * The navigation button both portals show on a narrow screen.
 *
 * Hidden wherever there is room for a sidebar, which is why it is the
 * media queries that reveal it rather than this block.
 * ------------------------------------------------------------------ */

.portal-nav-toggle {
    align-items: center;
    background: none;
    border: 0;
    color: #0b3b7a;
    cursor: pointer;
    display: none;
    font: inherit;
    font-size: 1.4rem;
    font-weight: 600;
    gap: 10px;
    margin: 0;
    padding: 14px 18px;
}

/* Three bars: the middle one is the button's own box, the other two are drawn above and below
   it, so the whole thing is one element rather than three empty spans. */
.portal-nav-toggle-bars,
.portal-nav-toggle-bars::before,
.portal-nav-toggle-bars::after {
    background: currentcolor;
    border-radius: 2px;
    content: '';
    display: block;
    height: 2px;
    width: 22px;
}

.portal-nav-toggle-bars {
    position: relative;
}

.portal-nav-toggle-bars::before {
    position: absolute;
    top: -7px;
}

.portal-nav-toggle-bars::after {
    position: absolute;
    top: 7px;
}

.portal-nav-toggle[aria-expanded="true"] .portal-nav-toggle-bars {
    background: transparent;
}

.portal-nav-toggle[aria-expanded="true"] .portal-nav-toggle-bars::before {
    top: 0;
    transform: rotate(45deg);
}

.portal-nav-toggle[aria-expanded="true"] .portal-nav-toggle-bars::after {
    top: 0;
    transform: rotate(-45deg);
}

/* ------------------------------------------------------------------
 * The client portal below the width a sidebar needs.
 *
 * This is the one place that decides it. The stylesheet carries three
 * separate 820px blocks written at different times, each with its own
 * idea of the sidebar, so a change made in one of them was quietly
 * undone by the next. Everything about the narrow-screen bar is
 * settled here, last, where it cannot be.
 * ------------------------------------------------------------------ */

@media (max-width: 820px) {
    .client-portal-shell {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto auto;
    }

    /* The bar is the logo and the menu button. It grows to hold the links when they open, so
       nothing may pin its height or lay it out in fixed columns. */
    .client-portal-sidebar {
        align-items: center;
        display: flex;
        /* The desktop sidebar is a column; across the top of a phone it is a row. */
        flex-direction: row;
        flex-wrap: wrap;
        grid-column: 1;
        grid-row: auto;
        grid-template-columns: none;
        grid-template-rows: none;
        height: auto;
        justify-content: space-between;
        padding: 0 4px 0 0;
    }

    .client-portal-logo {
        flex: 0 0 auto;
        height: 62px;
        width: 62px;
    }

    .client-portal-sidebar .portal-nav-toggle {
        display: flex;
        flex: 0 0 auto;
    }

    .client-portal-sidebar nav,
    .client-portal-logout {
        display: none;
    }

    /* flex: 0 0 100% rather than a basis alone: a basis that can still shrink just squeezes
       onto the logo's row instead of wrapping underneath it. */
    .client-portal-sidebar.open nav {
        border-top: 1px solid rgba(16, 33, 61, 0.12);
        display: flex;
        flex: 0 0 100%;
        flex-direction: column;
        overflow: visible;
        padding: 4px 0 0;
    }

    .client-portal-sidebar.open .client-portal-logout {
        display: block;
        flex: 0 0 100%;
        margin: 0;
        padding-bottom: 14px;
    }

    /* Sizing only. Whether these are shown is settled above, and repeating display here would
       quietly undo it: the two rules have the same weight and this one comes second. */
    .client-portal-sidebar nav a,
    .client-portal-logout {
        align-items: center;
        border-bottom: 0;
        border-left: 4px solid transparent;
        font-size: 1.45rem;
        height: auto;
        min-height: 48px;
        padding: 12px 16px;
        white-space: nowrap;
    }

    .client-portal-sidebar.open nav a {
        display: flex;
    }

    .client-portal-sidebar nav a:hover,
    .client-portal-sidebar nav a:focus,
    .client-portal-sidebar nav a.active {
        border-bottom-color: transparent;
        border-left-color: #104b91;
    }
}

@media (max-width: 480px) {
    /* The bars alone say menu at this width, and the word crowds the logo. */
    .portal-nav-toggle-text {
        clip-path: inset(50%);
        height: 1px;
        overflow: hidden;
        position: absolute;
        white-space: nowrap;
        width: 1px;
    }
}

/* ------------------------------------------------------------------
 * Signing out, under the profile picture.
 *
 * It used to be the last entry in the sidebar, which is not where
 * anybody looks and which dropped it entirely on a phone. Then it was
 * a menu the picture opened, which is no better for somebody who has
 * never seen the site: a photograph does not look like a button. So
 * the word is simply there, under the picture, at every width.
 * ------------------------------------------------------------------ */

.client-portal-account {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Red, and the same red every other leaving-or-removing control on the site is written in,
   rather than the navy it shared with the headings around it. And 14px rather than 11.5px:
   it sat under a 16.5px greeting at two thirds its size, which reads as a caption on the
   picture rather than as the way out. */
.client-portal-account .client-portal-logout {
    border: 0;
    color: #a3283a;
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0;
    padding: 0;
    text-decoration: none;
    white-space: nowrap;
}

.client-portal-account .client-portal-logout:hover,
.client-portal-account .client-portal-logout:focus {
    color: #85202f;
    text-decoration: underline;
}

@media (max-width: 640px) {
    /* The picture alone identifies the account at this width, and the greeting crowds it. */
    .client-portal-greeting {
        display: none;
    }
}

/* ------------------------------------------------------------------
 * One typeface, everywhere.
 *
 * The stylesheet used to set geomanist on div, html, the headings and
 * the paragraphs, which is nearly every element on the page — while
 * the admin portal, on its own stylesheet, used Montserrat. So the two
 * halves of the same product were set in different type. Worse, the
 * geomanist files it named were never in the repository, so what the
 * client portal actually rendered in was whatever the browser fell
 * back to.
 *
 * Form controls do not inherit a typeface from their parent, so they
 * are named here as well rather than quietly staying on the system UI
 * font.
 * ------------------------------------------------------------------ */

button,
input,
optgroup,
select,
textarea {
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
}

/* The circle is a flex box so the arrow sits in the middle of it. Said again, and with the
   heading in the selector, because ".client-batch-upload-heading span { display: block }" is
   written after it and matches more narrowly — so the circle was never a flex box at all, and
   the arrow had been pinned to its top-left corner the whole time. */
.client-batch-upload-heading .client-batch-upload-icon {
    align-items: center;
    display: flex;
    justify-content: center;
}

/* The arrow inside the upload circles. Sized by the circle rather than by a font, so it is the
   same on every machine and sits where it is put. The station circle carries the larger one:
   it is the only thing left in that panel's heading now the buttons under it have gone. */
.upload-arrow {
    display: block;
    height: 60%;
    width: 60%;
}

.client-upload-station-icon .upload-arrow {
    height: 68%;
    width: 68%;
}

/* ------------------------------------------------------------------
 * A file that will not be accepted, said at the moment it is chosen.
 *
 * Red, because it is a refusal: nothing has been uploaded and nothing
 * will be until a different file is picked.
 * ------------------------------------------------------------------ */

.upload-type-notice {
    background: #fdeff1;
    border-left: 4px solid #a3283a;
    border-radius: 6px;
    color: #85202f;
    font-size: 1.2rem;
    line-height: 1.45;
    margin: 8px 0 0;
    overflow-wrap: anywhere;
    padding: 9px 12px;
}

/* On phones, give the loan summary and checklist controls the full content width. */
@media (max-width: 640px) {
    .client-application-breadcrumb a {
        font-size: 1.2rem;
    }

    .client-application-heading {
        align-items: stretch;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .client-application-heading h1 {
        font-size: 2rem;
    }

    .client-application-heading .client-application-purpose {
        font-size: 1.2rem;
        line-height: 1.45;
        margin-top: 4px;
    }

    .client-application-separator {
        display: none;
    }

    .client-application-date {
        display: block;
        margin-top: 3px;
    }

    .client-application-count {
        align-items: baseline;
        flex-direction: row;
        gap: 6px;
    }

    .client-application-count strong {
        font-size: 1.45rem;
    }

    .client-application-count span {
        font-size: 1.05rem;
    }

    .client-portal-notice {
        gap: 10px;
        padding: 12px;
    }

    .client-portal-notice strong {
        font-size: 1.25rem;
        line-height: 1.35;
    }

    .client-portal-notice p {
        line-height: 1.45;
    }

    .client-required-heading {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
    }

    .client-required-heading h2 {
        font-size: 1.7rem;
    }

    .client-required-heading-actions {
        display: grid;
        gap: 10px;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .client-required-heading-actions .client-batch-upload-launch,
    .client-required-heading-actions .client-report-download {
        box-sizing: border-box;
        font-size: 1.15rem;
        height: 52px;
        line-height: 1.2;
        padding: 6px 10px;
        white-space: normal;
        width: 100%;
    }

    .client-batch-upload-heading {
        align-items: center;
        display: grid;
        gap: 8px 10px;
        grid-template-columns: 40px minmax(0, 1fr) auto;
    }

    .client-batch-upload-heading .client-batch-upload-icon {
        grid-column: 1;
        grid-row: 1;
    }

    .client-batch-upload-heading > div {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .client-batch-upload-close {
        grid-column: 3;
        grid-row: 1;
        justify-self: end;
    }
}

/* The mobile portal has two compact bars above the page content. Its former three auto-sized
   grid rows shared the unused viewport height, which stretched the navigation and header into
   a large blank panel. The content row now receives the remaining height. */
@media (max-width: 820px) {
    .client-portal-shell {
        align-content: start;
        grid-template-rows: auto auto minmax(0, 1fr);
    }

    .client-portal-sidebar,
    .client-portal-header {
        align-self: start;
    }

    .client-portal-header {
        box-sizing: border-box;
        min-height: 0;
    }

    .client-portal-logo {
        aspect-ratio: 1;
        flex: 0 0 auto;
    }

    .client-portal-logo img {
        height: auto;
        max-height: 100%;
        max-width: 100%;
        width: auto;
    }

    .client-portal-avatar {
        aspect-ratio: 1;
        box-sizing: border-box;
        flex: 0 0 auto;
    }
}

/* A document row is the natural starting point for a phone upload. Keep the form out of the
   scroll below the checklist until that row is chosen, then present it as a focused sheet with
   a clear way back to the list. The file controls come directly after the document name; the
   review and broker conversation remain available below them. */
.client-upload-station-close {
    display: none;
}

@media (max-width: 640px) {
    body.client-upload-station-open {
        overflow: hidden;
    }

    .client-upload-station {
        display: none;
    }

    body.client-upload-station-open .client-upload-station {
        align-items: center;
        background: rgba(16, 33, 61, 0.45);
        border: 0;
        border-radius: 0;
        box-sizing: border-box;
        display: flex;
        inset: 0;
        min-height: 0;
        padding: 12px;
        position: fixed;
        top: 0;
        z-index: 1000;
    }

    body.client-upload-station-open .client-upload-station-panel {
        background: #cbe8f7;
        border: 1px solid #2d70b3;
        border-radius: 16px;
        box-sizing: border-box;
        gap: 18px;
        /* A full-height sheet reads as part of the page. Leave visible space above and below
           the dialog, then let its details scroll inside once they exceed this height. */
        max-height: 74dvh;
        min-height: 0;
        overflow-y: auto;
        padding: 58px 20px 22px;
        position: relative;
        width: 100%;
    }

    body.client-upload-station-open .client-upload-station-title {
        order: 0;
        padding-right: 44px;
    }

    body.client-upload-station-open .client-upload-station-actions {
        margin-top: 0;
        order: 1;
    }

    body.client-upload-station-open .client-upload-station-review {
        order: 2;
    }

    body.client-upload-station-open .client-document-thread {
        order: 3;
    }

    body.client-upload-station-open .client-upload-station-close {
        align-items: center;
        background: #fff;
        border: 1px solid #104b91;
        border-radius: 50%;
        color: #104b91;
        cursor: pointer;
        display: flex;
        font-size: 2rem;
        font-weight: 400;
        height: 38px;
        justify-content: center;
        line-height: 1;
        padding: 0 0 3px;
        position: absolute;
        right: 16px;
        top: 14px;
        width: 38px;
    }

    body.client-upload-station-open .client-upload-station-close:hover,
    body.client-upload-station-open .client-upload-station-close:focus {
        background: #edf6fd;
        color: #0b4381;
    }
}