.mainContainer {
    font-family: Helvetica
}

body {
    color: #333;
    font-size: medium !important;
    line-height: normal !important;
    text-align: left !important
}

.displayNone {
    display: none
}

@media (min-width:800px) and (max-width:1050px) {
    .th-page-javatar .chat-container {
        right: 24px;
        width: 400px
    }

    .th-page-javatar .chat-container .question-tooltip {
        min-width: 240px
    }

    .th-page-javatar .rail-left {
        padding-left: 24px;
        width: calc(100% - 424px)
    }

    .th-page-javatar .cc-form-rail-left-wrapper {
        width: calc(100% - 424px)
    }

    .th-page-javatar .cc-form-content {
        padding-left: 24px
    }
}

@media (min-width:1051px) and (max-width:1100px) {
    .th-page-javatar .chat-container {
        right: 24px;
        width: 415px
    }

    .th-page-javatar .chat-container .question-tooltip {
        min-width: 240px
    }

    .th-page-javatar .rail-left {
        padding-left: 24px;
        width: calc(100% - 439px)
    }

    .th-page-javatar .cc-form-rail-left-wrapper {
        width: calc(100% - 439px)
    }

    .th-page-javatar .cc-form-content {
        padding-left: 24px
    }
}

@media (min-width:1101px) and (max-width:1150px) {
    .th-page-javatar .chat-container {
        right: 32px;
        width: 425px
    }

    .th-page-javatar .chat-container .question-tooltip {
        min-width: 245px
    }

    .th-page-javatar .rail-left {
        padding-left: 32px;
        width: calc(100% - 457px)
    }

    .th-page-javatar .cc-form-rail-left-wrapper {
        width: calc(100% - 457px)
    }

    .th-page-javatar .cc-form-content {
        padding-left: 32px
    }
}

@media (min-width:1151px) and (max-width:1200px) {
    .th-page-javatar .chat-container {
        right: 40px;
        width: 435px
    }

    .th-page-javatar .chat-container .question-tooltip {
        min-width: 250px
    }

    .th-page-javatar .rail-left {
        padding-left: 40px;
        width: calc(100% - 475px)
    }

    .th-page-javatar .cc-form-rail-left-wrapper {
        width: calc(100% - 475px)
    }

    .th-page-javatar .cc-form-content {
        padding-left: 40px
    }
}

@media (min-width:1201px) and (max-width:1365px) {
    .th-page-javatar .chat-container {
        right: 80px;
        width: 440px
    }

    .th-page-javatar .chat-container .question-tooltip {
        min-width: 260px
    }

    .th-page-javatar .rail-left {
        padding-left: 80px;
        width: calc(100% - 520px)
    }

    .th-page-javatar .cc-form-rail-left-wrapper {
        width: calc(100% - 520px)
    }

    .th-page-javatar .cc-form-content {
        padding-left: 80px
    }

    .th-page-javatar .rail-left {
        padding-right: 32px
    }

    .th-page-javatar .cc-rail-left>div {
        padding-right: 32px
    }
}

@media (min-width:1366px) and (max-width:1599px) {
    .th-page-javatar .chat-container {
        right: 100px;
        width: 460px
    }

    .th-page-javatar .chat-container .question-tooltip {
        min-width: 270px
    }

    .th-page-javatar .rail-left {
        padding-left: 100px;
        width: calc(100% - 560px)
    }

    .th-page-javatar .cc-form-rail-left-wrapper {
        width: calc(100% - 560px)
    }

    .th-page-javatar .cc-form-content {
        padding-left: 100px
    }

    .th-page-javatar .rail-left {
        padding-right: 40px
    }

    .th-page-javatar .cc-rail-left>div {
        padding-right: 40px
    }
}

@media (min-width:1450px) {
    .th-page-javatar .rail-left {
        padding-right: 48px
    }

    .th-page-javatar .cc-rail-left>div {
        padding-right: 48px
    }
}

@media (min-width:1600px) and (max-width:1919px) {
    .th-page-javatar .chat-container {
        right: 125px;
        width: 552px
    }

    .th-page-javatar .chat-container .question-tooltip {
        min-width: 270px
    }

    .th-page-javatar .rail-left {
        padding-left: 125px;
        width: calc(100% - 677px)
    }

    .th-page-javatar .cc-form-rail-left-wrapper {
        width: calc(100% - 677px)
    }

    .th-page-javatar .cc-form-content {
        padding-left: 125px
    }
}

@media (min-width:1920px) {
    .th-page-javatar .chat-container {
        right: 125px;
        width: 686px
    }

    .th-page-javatar .chat-container .question-tooltip {
        min-width: 270px
    }

    .th-page-javatar .rail-left {
        padding-left: 125px;
        width: calc(100% - 811px)
    }

    .th-page-javatar .cc-form-rail-left-wrapper {
        width: calc(100% - 811px)
    }

    .th-page-javatar .cc-form-content {
        padding-left: 125px
    }
}

.cc-form-rail-left-wrapper {
    z-index: 1
}

.re-trust-logos .container {
    flex-direction: row;
    margin-top: -5px;
    padding-left: 0;
    padding-top: 0
}

.re-trust-logos .container div[data-element=digicert-logo] {
    display: none
}

.re-exit .re-modal__content {
    width: 280px
}

.de-cc-form .form .three-fields-container {
    max-width: 367px !important
}

.cc-form-rail-left {
    padding-bottom: 0
}

.de-cc-form .form__error.is-active {
    box-sizing: border-box
}

.de-cc-apple-pay-form.is-desktop .input .input__field {
    box-sizing: border-box
}

.de-cc-apple-pay-form.is-desktop .apple-pay-form__field-label {
    margin-block: 0
}

.de-cc-apple-pay-form.is-desktop .apple-pay-form__row {
    margin-top: 0
}

.body-wrapper .de-cc-form .form__billing .input--text {
    display: flex
}

.body-wrapper .de-cc-form .form__billing .input__field {
    width: 100% !important
}

.de-cc-contact-customer-care .container {
    align-items: unset;
    box-sizing: border-box;
    flex-direction: row;
    justify-content: unset;
    line-height: normal;
    max-width: none;
    width: auto !important
}

.pageFooter {
    margin-bottom: 0 !important
}

.bgCntAfford {
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    flex-direction: column-reverse;
    height: 1000px;
    position: relative
}

@media (min-width:1920px) {
    .ctnAffordWhiteBG {
        width: 100%
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .ctnAffordWhiteBG {
        width: 100%
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .ctnAffordWhiteBG {
        width: 100%
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .ctnAffordWhiteBG {
        width: 100%
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .ctnAffordWhiteBG {
        width: 100%
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .ctnAffordWhiteBG {
        width: 100%
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .ctnAffordWhiteBG {
        width: 100%
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .ctnAffordWhiteBG {
        width: 100%
    }
}

@media (max-width:1024px) {
    .ctnAffordWhiteBG {
        max-width: 100%
    }
}

.cntAffordContainer {
    background: #f5f5f5
}

@media (min-width:1920px) {
    .cntAffordContainer {
        margin-right: 0
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .cntAffordContainer {
        margin-right: 0
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .cntAffordContainer {
        margin-right: 0
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .cntAffordContainer {
        margin-right: 0
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .cntAffordContainer {
        margin-right: 0
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .cntAffordContainer {
        margin-right: 0
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .cntAffordContainer {
        margin-right: 0
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .cntAffordContainer {
        margin-right: 0
    }
}

@media (min-width:1920px) {
    .cntAffordContainercntAfford {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .cntAffordContainercntAfford {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .cntAffordContainercntAfford {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .cntAffordContainercntAfford {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .cntAffordContainercntAfford {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .cntAffordContainercntAfford {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .cntAffordContainercntAfford {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .cntAffordContainercntAfford {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .cntAffordContainercntAfford {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .cntAffordContainercntAfford {
        margin-left: 16px;
        margin-right: 16px
    }
}

.cntAffordContainertitleContainer {
    display: flex;
    flex-direction: column;
    margin-bottom: 24px;
    padding-top: 56px
}

.cntAffordContainertitle {
    font-size: 40px;
    font-weight: 700;
    line-height: 48px;
    text-align: left
}

.cntAffordContainerdesc {
    margin-bottom: 32px;
    text-align: left
}

.cntAffordContainerdescText1 {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 16px
}

.cntAffordContainerdescText2 {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px
}

.cntAffordContainerbtnContainer {
    padding-bottom: 64px
}

.cntAffordContainerchatButton {
    background-color: #2aa6f8;
    border: 1px solid #2aa6f8;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-weight: 700;
    height: 48px;
    line-height: 24px;
    min-width: 150px;
    padding: 12px 24px
}

.cntAffordContainerchatButton:hover {
    border: 1px solid #2aa6f8;
    color: #fff
}

.cntAffordContainerchatButton:active {
    border: 1px solid #2aa6f8;
    color: #fff
}

@media (max-width:480px) {
    .bgCntAfford {
        background-size: 100% 300px;
        flex-direction: column;
        height: auto
    }

    .cntAffordContainer {
        margin-top: 300px
    }

    .cntAffordContainertitleContainer {
        align-items: center;
        margin-bottom: 8px;
        padding-top: 40px;
        width: auto
    }

    .cntAffordContainertitle {
        font-size: 24px;
        line-height: 28px;
        text-align: center
    }

    .cntAffordContainerdesc {
        margin-bottom: 24px;
        text-align: center
    }

    .cntAffordContainerdescText1 {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 8px
    }

    .cntAffordContainerdescText2 {
        font-size: 16px;
        font-weight: 700;
        line-height: 24px
    }

    .cntAffordContainerbtnContainer {
        padding-bottom: 40px;
        text-align: center
    }
}

@media (min-width:481px) and (max-width:767px) {
    .bgCntAfford {
        background-size: 100% 320px;
        flex-direction: column;
        height: auto
    }

    .cntAffordContainer {
        margin-top: 320px
    }

    .cntAffordContainertitleContainer {
        align-items: center;
        margin-bottom: 12px;
        padding-top: 40px;
        width: auto
    }

    .cntAffordContainertitle {
        font-size: 24px;
        line-height: 28px;
        text-align: center
    }

    .cntAffordContainerdesc {
        margin-bottom: 24px;
        text-align: center
    }

    .cntAffordContainerdescText1 {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 8px
    }

    .cntAffordContainerdescText2 {
        font-size: 16px;
        font-weight: 700;
        line-height: 24px
    }

    .cntAffordContainerbtnContainer {
        padding-bottom: 40px;
        text-align: center
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .bgCntAfford {
        background-size: 100% 450px;
        flex-direction: column;
        height: auto
    }

    .cntAffordContainer {
        margin-top: 450px
    }

    .cntAffordContainertitleContainer {
        align-items: center;
        margin-bottom: 12px;
        padding-top: 40px;
        text-align: center;
        width: auto
    }

    .cntAffordContainertitle {
        font-size: 32px;
        line-height: 40px
    }

    .cntAffordContainerdesc {
        text-align: center
    }

    .cntAffordContainerbtnContainer {
        padding-bottom: 48px;
        text-align: center
    }
}

.expertHelpContainer {
    padding-top: 56px
}

@media (min-width:1920px) {
    .expertHelpContainer {
        width: 100%
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .expertHelpContainer {
        width: 100%
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .expertHelpContainer {
        width: 100%
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .expertHelpContainer {
        width: 100%
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .expertHelpContainer {
        width: 100%
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .expertHelpContainer {
        width: 100%
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .expertHelpContainer {
        width: 100%
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .expertHelpContainer {
        width: 100%
    }
}

@media (max-width:1024px) {
    .expertHelpContainer {
        max-width: 100%
    }
}

.expertHelpColorContainer {
    background: #f5f5f5
}

.expertHelp {
    display: flex;
    flex-direction: column
}

@media (min-width:1920px) {
    .expertHelp {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .expertHelp {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .expertHelp {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .expertHelp {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .expertHelp {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .expertHelp {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .expertHelp {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .expertHelp {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .expertHelp {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .expertHelp {
        margin-left: 16px;
        margin-right: 16px
    }
}

.expertHelpTitle {
    font-size: 40px;
    font-weight: 700;
    line-height: 48px;
    margin-bottom: 32px;
    text-align: left
}

.expertHelpSpecialities {
    font-size: 20px;
    line-height: 32px;
    margin-bottom: 40px;
    text-align: left
}

.expertHelpFlexItems {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

@media (max-width:480px) {
    .expertHelpContainer {
        padding-top: 40px
    }

    .expertHelp {
        align-items: center;
        margin-bottom: 24px
    }

    .expertHelpFlexItems {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;
        margin-bottom: 16px
    }

    .expertHelpTitle {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 8px;
        text-align: center;
        width: auto
    }

    .expertHelpSpecialities {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 32px;
        text-align: center;
        width: auto
    }
}

@media (min-width:481px) and (max-width:767px) {
    .expertHelpContainer {
        padding-top: 40px
    }

    .expertHelp {
        align-items: center;
        margin-bottom: 24px
    }

    .expertHelpFlexItems {
        display: flex;
        flex-direction: row;
        justify-content: space-between
    }

    .expertHelpTitle {
        font-size: 24px;
        line-height: 32px;
        text-align: center;
        width: auto
    }

    .expertHelpSpecialities {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 32px;
        text-align: center;
        width: auto
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .expertHelpContainer {
        padding-top: 40px
    }

    .expertHelp {
        align-items: center;
        margin-bottom: 24px
    }

    .expertHelpFlexItems {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;
        margin-left: 100px;
        margin-right: 100px
    }

    .expertHelpTitle {
        font-size: 32px;
        line-height: 40px;
        text-align: center;
        width: auto
    }

    .expertHelpSpecialities {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 24px;
        text-align: center;
        width: auto
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
    .expertHelpContainer {
        padding-top: 40px
    }

    .expertHelpFlexItems {
        display: flex;
        flex-direction: row
    }

    .expertHelp {
        align-items: center;
        margin-bottom: 24px
    }

    .expertHelpTitle {
        font-size: 32px;
        line-height: 40px;
        text-align: center;
        width: auto
    }

    .expertHelpSpecialities {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 24px;
        text-align: center;
        width: auto
    }
}

.expertHelpItem {
    align-items: center;
    display: flex;
    flex-basis: 22%;
    flex-direction: column;
    margin-bottom: 64px
}

.expertHelpItemImg {
    height: 36px;
    width: 36px
}

.expertHelpItemDescription {
    font-size: 16px;
    line-height: 24px;
    margin-top: 16px;
    text-align: center;
    width: 100%
}

@media (max-width:480px) {
    .expertHelpItem {
        align-items: center;
        display: flex;
        flex-basis: 34%;
        flex-direction: column;
        margin-bottom: 24px
    }

    .expertHelpItemImg {
        height: 36px;
        width: 36px
    }

    .expertHelpItemDescription {
        font-size: 14px;
        line-height: 20px;
        margin-top: 12px;
        text-align: center
    }
}

@media (min-width:481px) and (max-width:767px) {
    .expertHelpItem {
        align-items: center;
        display: flex;
        flex-basis: 20%;
        flex-direction: column;
        margin-bottom: 24px
    }

    .expertHelpItemImg {
        height: 36px;
        width: 36px
    }

    .expertHelpItemDescription {
        font-size: 14px;
        line-height: 20px;
        margin-top: 12px;
        text-align: center
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .expertHelpItem {
        align-items: center;
        display: flex;
        flex-basis: 34%;
        flex-direction: column;
        margin-bottom: 64px
    }

    .expertHelpItemImg {
        height: 36px;
        width: 36px
    }

    .expertHelpItemDescription {
        font-size: 16px;
        line-height: 24px;
        margin-top: 16px;
        text-align: center
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
    .expertHelpItem {
        align-items: center;
        display: flex;
        flex-basis: 22%;
        flex-direction: column;
        margin-bottom: 64px
    }

    .expertHelpItemImg {
        height: 36px;
        width: 36px
    }

    .expertHelpItemDescription {
        font-size: 16px;
        line-height: 24px;
        margin-top: 16px;
        text-align: center
    }
}

@media (min-width:1920px) {
    .footerContainer {
        width: calc(100% - 811px)
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .footerContainer {
        width: calc(100% - 677px)
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .footerContainer {
        width: calc(100% - 560px)
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .footerContainer {
        width: calc(100% - 520px)
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .footerContainer {
        width: calc(100% - 475px)
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .footerContainer {
        width: calc(100% - 457px)
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .footerContainer {
        width: calc(100% - 439px)
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .footerContainer {
        width: calc(100% - 424px)
    }
}

@media (max-width:1024px) {
    .footerContainer {
        max-width: 100%
    }
}

.transcend-logo-container {
    display: none
}

.pageFooter {
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
    margin-top: 72px
}

@media (min-width:1920px) {
    .pageFooter {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .pageFooter {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .pageFooter {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .pageFooter {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .pageFooter {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .pageFooter {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .pageFooter {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .pageFooter {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .pageFooter {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .pageFooter {
        margin-left: 16px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .pageFooter {
        align-items: center;
        margin-bottom: 72px;
        margin-top: 40px
    }
}

.footerDisclaimer {
    color: #19334a;
    line-height: 24px;
    margin-right: 35px;
    padding-bottom: 32px
}

@media (max-width:1024px) {
    .footerDisclaimer {
        text-align: center
    }
}

.copyright {
    color: #333;
    font-size: 12px;
    line-height: 20px
}

@media (max-width:1024px) {
    .copyright {
        align-items: center
    }
}

.poweredBy {
    color: #333;
    font-size: 12px;
    line-height: 20px
}

@media (max-width:1024px) {
    .poweredBy {
        align-items: center
    }
}

.tos {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    font-weight: 700;
    gap: 12px;
    line-height: 20px;
    margin-bottom: 100px
}

@media (max-width:1024px) {
    .tos {
        align-items: center
    }
}

.tosItem {
    color: #666;
    text-decoration: none
}

@media (width:320px) and (height:568px) {

    .copyright,
    .poweredBy,
    .tos {
        font-size: 11px
    }
}

.hero {
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    flex-direction: column;
    height: 100vh;
    justify-content: space-between;
    min-height: 550px;
    position: relative;
    text-align: left
}

.heroWithChat {
    display: flex;
    flex-direction: row;
    height: 100%;
    z-index: 1
}

.heroBackGroundColor {
    background-color: #000;
    height: 100%;
    left: 0;
    opacity: .2;
    position: absolute;
    top: 0;
    width: 100%
}

.heroContent {
    height: 100%
}

@media (min-width:1920px) {
    .heroContent {
        width: calc(100% - 811px)
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .heroContent {
        width: calc(100% - 677px)
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .heroContent {
        width: calc(100% - 560px)
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .heroContent {
        width: calc(100% - 520px)
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .heroContent {
        width: calc(100% - 475px)
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .heroContent {
        width: calc(100% - 457px)
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .heroContent {
        width: calc(100% - 439px)
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .heroContent {
        width: calc(100% - 424px)
    }
}

@media (max-width:1024px) {
    .heroContent {
        max-width: 100%
    }
}

.heroLogoContainer {
    height: 61.47px
}

.infoItem {
    margin-top: .5rem !important
}

.headerStepsContainer {
    margin-left: 40px !important
}

.heroLogo {
    height: 100%
}

.heroContentContainer {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
    padding-bottom: 80px
}

@media (min-width:1920px) {
    .heroContentContainer {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .heroContentContainer {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .heroContentContainer {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .heroContentContainer {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .heroContentContainer {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .heroContentContainer {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .heroContentContainer {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .heroContentContainer {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .heroContentContainer {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .heroContentContainer {
        margin-left: 16px;
        margin-right: 16px
    }
}

@media (min-width:1920px) {
    .heroContentContainer {
        padding-top: 48px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .heroContentContainer {
        padding-top: 48px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .heroContentContainer {
        padding-top: 48px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .heroContentContainer {
        padding-top: 48px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .heroContentContainer {
        margin-top: 48px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .heroContentContainer {
        padding-top: 48px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .heroContentContainer {
        padding-top: 48px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .heroContentContainer {
        padding-top: 48px
    }
}

@media (max-width:1024px) {
    .heroContentContainer {
        padding-top: 48px
    }
}

@media (max-width:767px) {
    .heroContentContainer {
        padding-top: 16px
    }
}

.tagLineWithSteps,
.taglineContainer {
    display: flex;
    flex-direction: column
}

.stepsContainer {
    color: #fff;
    display: flex;
    flex-direction: row;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 25px
}

.tagline1 {
    color: #fff;
    font-size: 48px;
    font-weight: 700;
    line-height: 60px
}

.tagline2 {
    color: #fff;
    font-size: 32px;
    font-weight: 400;
    line-height: 40px;
    margin-bottom: 0;
    margin-top: 24px
}

.th-chat-integrated-dialog .th-chat-message {
    background: #fff !important
}

.th-chat-integrated-dialog .th-chat-message:first-child {
    padding-top: 24px
}

.chatContainer {
    bottom: 20px;
    box-shadow: 2px 2px 40px rgba(51, 51, 51, .35);
    line-height: 24px;
    position: fixed;
    text-align: left;
    top: 100px;
    z-index: 9999
}

@media (min-width:1920px) {
    .chatContainer {
        right: 125px;
        width: 686px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .chatContainer {
        right: 125px;
        width: 552px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .chatContainer {
        right: 100px;
        width: 460px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .chatContainer {
        right: 80px;
        top: 80px;
        width: 440px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .chatContainer {
        right: 40px;
        top: 80px;
        width: 435px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .chatContainer {
        right: 32px;
        top: 80px;
        width: 425px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .chatContainer {
        right: 24px;
        top: 80px;
        width: 415px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .chatContainer {
        right: 24px;
        top: 80px;
        width: 400px
    }
}

.th-prominent-chat-window {
    background: #fff !important;
    border-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important
}

.mu-expert-profile:before {
    padding-left: 24px !important
}

.th-prominent-chat-window .mu-expert-profile .profile {
    height: auto !important
}

.th-prominent-chat-window .profile__name {
    display: none;
    font-size: 16px !important;
    line-height: 24px !important
}

.th-prominent-chat-window .profile__rating {
    display: none !important
}

.th-prominent-chat-window .profile__credentials,
.th-prominent-chat-window .profile__title {
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 24px !important
}

.th-prominent-chat-window .mu-expert-profile {
    background: #3c67da !important;
    max-width: 100% !important
}

.th-prominent-chat-window .mu-expert-profile .profile__question-count {
    font-size: 14px !important;
    line-height: 16px !important
}

.th-prominent-chat-window .mu-expert-profile .profile__avatar {
    height: auto !important;
    width: auto !important
}

.th-prominent-chat-window .mu-expert-profile .profile--blue {
    background: #3c67da !important;
    padding-bottom: 25px
}

.th-prominent-chat-window .mu-expert-profile .profile__details {
    margin-left: 5px;
    padding-left: 5px !important
}

.th-prominent-chat-window .header .profile .profile__avatar,
.th-prominent-chat-window .header .profile .profile__details {
    align-self: flex-start
}

.th-prominent-chat-window .mu-expert-profile .profile__avatar-wrapper {
    margin-left: 5px;
    width: 128px !important
}

.th-prominent-chat-window .mu-expert-profile .profile__avatar-image {
    border: 0 !important;
    border-radius: 0 !important;
    height: 48px !important;
    width: 128px !important
}

.th-prominent-chat-window .profile__credentials {
    color: #fff !important;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px
}

.th-prominent-chat-window .mu-expert-profile .profile__avatar-wrapper:after {
    bottom: -1px;
    box-sizing: border-box;
    content: " ";
    display: block;
    height: 26px;
    line-height: 24px;
    position: absolute;
    right: -5px;
    text-rendering: optimizeLegibility;
    width: 23px;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased
}

.th-prominent-chat-window .body {
    background: #fff !important;
    height: calc(100% - 270px) !important;
    padding-bottom: 0 !important
}

.th-prominent-chat-window .body.extended {
    height: calc(100% - 125px) !important
}

.th-prominent-chat-window .body:after {
    content: " ";
    display: block;
    padding-bottom: 30px
}

.th-chat-integrated-dialog {
    background: #fff !important
}

.th-chat-integrated-dialog .expert .text {
    background: #f5f5f5 !important;
    border: 0 !important
}

.th-chat-integrated-dialog .expert .text:after,
.th-chat-integrated-dialog .expert .text:before {
    content: none !important
}

.th-chat-integrated-dialog .customer .text:after,
.th-chat-integrated-dialog .customer .text:before {
    content: none !important
}

.th-chat-integrated-question-box .send-btn {
    -webkit-appearance: none !important;
    background: #00c508 !important;
    font-size: 14px !important;
    width: 113px !important
}

.th-chat-integrated-question-box {
    background-color: #ccc !important;
    max-width: 100% !important
}

.th-chat-integrated-question-box .text-box {
    border: 1px solid #00c508 !important;
    height: 64px !important
}

.th-chat-integrated-question-box .text-box:after,
.th-chat-integrated-question-box .text-box:before {
    content: none !important
}

.th-chat-integrated-question-box .text-box .text-area {
    height: auto !important
}

.th-chat-integrated-question-box .online-now {
    display: none !important
}

.th-chat-integrated-question-box .send-btn:hover {
    background: #00a507 !important
}

.th-chat-integrated-question-box .send-btn:active {
    background: #008206 !important
}

.th-chat-integrated-dialog .th-chat-message .va-avatar,
.th-chat-integrated-dialog .typing-box .typing-text .va-avatar {
    background: none !important;
    border-radius: 0 !important
}

@media (min-width:1025px) {
    .th-prominent-chat-window {
        width: 100%
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .hero {
        background-position: 100%;
        height: auto
    }

    .hero,
    .heroWithChat {
        flex-direction: column
    }

    .heroWithChat {
        height: 100%
    }

    .heroContentContainer {
        padding-bottom: 0;
        padding-top: 12px
    }

    .taglineContainer {
        margin-top: 16px
    }

    .tagline1 {
        font-size: 32px;
        line-height: 40px
    }

    .tagline2 {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 0;
        margin-top: 8px
    }

    .stepsContainer {
        display: none
    }

    .chatContainer {
        height: inherit;
        inset: auto 0;
        margin-bottom: 32px;
        margin-right: 16px;
        margin-top: 16px;
        min-height: 550px !important;
        position: relative;
        text-align: left;
        width: auto;
        z-index: 0 !important
    }

    .th-prominent-chat-window {
        border-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        min-height: 550px !important;
        min-width: auto !important;
        position: inherit !important
    }

    .th-prominent-chat-window .body {
        height: calc(100% - 270px) !important
    }
}

@media (min-width:768px) and (max-width:1024px) and (min-width:1920px) {
    .chatContainer {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:1919px) and (min-width:1600px) {
    .chatContainer {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:1599px) and (min-width:1367px) {
    .chatContainer {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:1366px) and (min-width:1201px) {
    .chatContainer {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:1200px) and (min-width:1151px) {
    .chatContainer {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:1150px) and (min-width:1101px) {
    .chatContainer {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:1100px) and (min-width:1051px) {
    .chatContainer {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:1050px) and (min-width:1025px) {
    .chatContainer {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:1024px) {
    .chatContainer {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (min-width:768px) and (max-width:1024px) and (max-width:767px) {
    .chatContainer {
        margin-left: 16px;
        margin-right: 16px
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
    .hero {
        min-height: 530px
    }

    .heroWithChat {
        flex-direction: row;
        height: 100%;
        justify-content: space-between
    }

    .heroContentContainer {
        padding-top: 0
    }

    .heroLogoContainer {
        height: auto;
        margin-top: 12px
    }

    .heroLogo {
        height: 28px;
        width: 86px
    }

    .taglineContainer {
        margin-top: 16px
    }

    .tagline1 {
        font-size: 32px;
        line-height: 40px
    }

    .tagline2 {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 0;
        margin-top: 12px
    }

    .stepsContainer {
        display: flex;
        flex-direction: column;
        margin-top: 16px
    }

    .stepItem {
        margin-bottom: 12px
    }

    .chatContainer {
        bottom: auto;
        margin-bottom: 32px;
        margin-top: 56px;
        min-height: 400px;
        position: relative;
        right: 16px;
        text-align: left;
        top: auto;
        width: 850px;
        z-index: 0 !important
    }

    .th-prominent-chat-window .body {
        height: calc(100% - 270px) !important
    }
}

@media (max-width:767px) {
    .hero {
        background-position: 100%;
        min-height: 450px
    }

    .heroWithChat {
        height: 100%;
        justify-content: space-between
    }

    .heroContentContainer {
        justify-content: flex-start
    }

    .taglineContainer {
        margin-right: 5px;
        margin-top: 16px
    }

    .tagline1 {
        font-size: 24px;
        line-height: 28px
    }

    .tagline2 {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 0;
        margin-top: 8px
    }

    .stepsContainer {
        display: flex;
        flex-direction: column;
        margin-top: 16px
    }

    .stepItem {
        margin-bottom: 12px
    }

    .heroLogoContainer {
        height: 28px
    }

    .chatContainer {
        bottom: auto;
        margin-bottom: 16px;
        margin-top: 40px;
        min-height: 400px;
        position: relative;
        right: 16px;
        text-align: left;
        top: auto;
        width: 500px;
        z-index: 0 !important
    }

    .th-prominent-chat-window {
        min-height: 400px;
        min-width: auto
    }

    .mu-expert-profile:before {
        font-size: 14px !important;
        line-height: 20px !important;
        padding-left: 12px !important;
        padding-top: 12px !important
    }

    .th-prominent-chat-window .profile__credentials,
    .th-prominent-chat-window .profile__title {
        font-size: 12px !important;
        font-weight: 400 !important;
        line-height: 16px !important
    }

    .th-prominent-chat-window .body {
        height: calc(100% - 232px) !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile__avatar-image {
        border: 0 !important;
        border-radius: 0 !important;
        height: 40px !important;
        width: 96px !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile__avatar {
        width: 100px !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile--blue {
        padding-bottom: 12px;
        padding-top: 8px
    }

    .th-prominent-chat-window .mu-expert-profile .profile__avatar-wrapper {
        margin-left: 0;
        width: 95px !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile__avatar-wrapper:after {
        height: 20px;
        right: -3px;
        width: 20px
    }

    .th-chat-integrated-dialog .th-chat-message:first-child {
        padding-top: 12px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) {
    .hero {
        background-position: 100%;
        flex-direction: column;
        height: auto
    }

    .heroContentContainer {
        padding-bottom: 0
    }

    .heroWithChat {
        flex-direction: column
    }

    .taglineContainer {
        margin-top: 16px
    }

    .tagline1 {
        font-size: 24px;
        line-height: 28px
    }

    .tagline2 {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 0;
        margin-top: 8px
    }

    .stepsContainer {
        display: none
    }

    .heroLogoContainer {
        height: 28px
    }

    .chatContainer {
        height: inherit;
        inset: auto 0;
        margin-bottom: 32px;
        margin-right: 16px;
        margin-top: 16px;
        position: relative;
        text-align: left;
        width: auto;
        z-index: 0 !important
    }

    .mu-expert-profile:before {
        padding-left: 12px !important;
        padding-top: 12px !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile--blue {
        padding-bottom: 12px;
        padding-top: 8px
    }

    .th-prominent-chat-window .profile {
        padding: 12px
    }

    .th-prominent-chat-window {
        border-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        min-width: auto !important;
        position: inherit !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile__details {
        max-width: 100% !important
    }

    .th-prominent-chat-window .body {
        height: calc(100% - 232px) !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile__avatar-image {
        border: 0 !important;
        border-radius: 0 !important;
        height: 40px !important;
        width: 96px !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile__avatar {
        width: 100px !important
    }

    .th-prominent-chat-window .mu-expert-profile .profile__avatar-wrapper:after {
        height: 20px;
        right: -3px;
        width: 20px
    }

    .th-prominent-chat-window .mu-expert-profile .profile__avatar-wrapper {
        margin-left: 0;
        width: 95px !important
    }

    .th-prominent-chat-window .header .profile .profile__details {
        align-self: flex-end
    }

    .th-chat-integrated-dialog .th-chat-message:first-child {
        padding-top: 16px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (min-width:1920px) {
    .chatContainer {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:1919px) and (min-width:1600px) {
    .chatContainer {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:1599px) and (min-width:1367px) {
    .chatContainer {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:1366px) and (min-width:1201px) {
    .chatContainer {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:1200px) and (min-width:1151px) {
    .chatContainer {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:1150px) and (min-width:1101px) {
    .chatContainer {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:1100px) and (min-width:1051px) {
    .chatContainer {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:1050px) and (min-width:1025px) {
    .chatContainer {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:1024px) {
    .chatContainer {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-width:767px) {
    .chatContainer {
        margin-left: 16px;
        margin-right: 16px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-height:840px) {
    .chatContainer {
        min-height: 540px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-height:780px) {
    .chatContainer {
        min-height: 500px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-height:680px) {
    .chatContainer {
        min-height: 475px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-height:840px) {
    .th-prominent-chat-window {
        min-height: 540px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-height:780px) {
    .th-prominent-chat-window {
        min-height: 500px
    }
}

@media (max-width:767px) and (max-aspect-ratio:121/80) and (max-height:680px) {
    .th-prominent-chat-window {
        min-height: 475px
    }
}

@media (width:320px) and (height:568px) {
    .tagline1 {
        font-size: 22px
    }

    .tagline2 {
        font-size: 12px
    }

    .th-chat-integrated-dialog .customer .name,
    .th-chat-integrated-dialog .expert .name {
        font-size: 10px
    }

    .th-chat-integrated-dialog .th-chat-message .text {
        font-size: 12px
    }

    .th-chat-integrated-dialog .typing-box .typing-text .name,
    .th-chat-integrated-dialog .typing-box .typing-text.animated .name {
        font-size: 10px
    }

    .th-prominent-chat-window .profile__credentials,
    .th-prominent-chat-window .profile__title {
        font-size: 10px !important
    }
}

@media (width:568px) and (height:320px) and (orientation:landscape) {
    .th-chat-integrated-dialog .expert .name {
        font-size: 10px
    }

    .th-chat-integrated-dialog .customer .name {
        font-size: 11px
    }

    .th-chat-integrated-dialog .th-chat-message .text {
        font-size: 12px
    }

    .th-chat-integrated-dialog .typing-box .typing-text .name,
    .th-chat-integrated-dialog .typing-box .typing-text.animated .name {
        font-size: 11px
    }

    .th-prominent-chat-window .profile__credentials,
    .th-prominent-chat-window .profile__title {
        font-size: 11px !important
    }
}

@media (max-height:568px) and (max-width:320px) {

    .th-chat-integrated-dialog .customer .name,
    .th-chat-integrated-dialog .expert .name,
    .th-chat-integrated-dialog .typing-box .typing-text .name,
    .th-chat-integrated-dialog .typing-box .typing-text.animated .name {
        font-size: 10px
    }
}

@media screen and (min-resolution:1.5dppx),
screen and (min-resolution:144dpi) {
    .tagline1 {
        font-size: 40px;
        line-height: 1;
    }

    .tagline2 {
        font-size: 24px
    }

    .th-prominent-chat-window .profile__credentials,
    .th-prominent-chat-window .profile__title {
        font-size: 14px !important
    }
}

.stepItem {
    display: flex;
    flex-direction: row;
    padding-right: 16px
}

.stepItemImage {
    border-radius: 50%;
    margin-right: 8px;
    text-align: center
}

.stepItemDesc {
    color: #fff;
    font-family: Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media (max-width:480px) {
    .stepItem {
        padding-right: 0
    }

    .stepItemDesc {
        font-size: 10px;
        line-height: 16px;
        padding-left: 5px;
        padding-top: 18px;
        text-align: center
    }

    .stepItemImage {
        display: none
    }
}

@media (min-width:481px) and (max-width:767px) {
    .stepItem {
        padding-right: 0
    }

    .stepItemDesc {
        font-size: 11px;
        line-height: 16px;
        padding-left: 0
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .stepItem {
        padding-right: 0
    }

    .stepItemDesc {
        font-size: 11px;
        line-height: 16px;
        padding-left: 0;
        padding-top: 19px
    }

    .stepItemImage {
        display: none
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
    .stepItemDesc {
        font-size: 16px;
        line-height: 24px;
        padding-left: 0;
        padding-top: 0
    }

    .stepItemImage {
        display: flex
    }
}

.headerStepsContainer {
    display: flex;
    flex-direction: row;
    margin-bottom: 18px;
    margin-left: 50px;
    margin-right: auto
}

.headerLogoLinksContainer {
    display: flex;
    justify-content: space-between
}

.headerLogoContainer {
    height: 61.47px
}

.headerLogo {
    height: 56px
}

@media (min-width:768px) and (max-width:1024px) {
    .headerLogoLinksContainer {
        display: flex;
        height: 26px
    }

    .headerLogo {
        height: 100%
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
    .headerLogoLinksContainer {
        display: flex;
        height: 26px
    }

    .headerLogoContainer {
        height: auto;
        margin-top: 12px
    }

    .headerLogo {
        height: 24px;
        width: 70px
    }

    .stepsContainer {
        display: flex;
        flex-direction: column;
        margin-top: 16px
    }

    .stepItem {
        margin-bottom: 12px
    }
}

@media (min-width:481px) and (max-width:767px) {
    .header {
        background-position: 100%
    }

    .headerLogo {
        height: 22px;
        width: auto
    }

    .headerStepsContainer {
        display: flex;
        flex-direction: row;
        margin-bottom: 10px;
        margin-left: 20px
    }

    .stepItem {
        margin-bottom: 12px
    }

    .headerLogoContainer {
        height: 28px
    }
}

@media (max-width:767px) and (orientation:portrait) {
    .header {
        background-position: 100%;
        flex-direction: column;
        height: auto
    }

    .headerLogo {
        height: 26px;
        width: auto
    }

    .headerStepsContainer {
        display: flex;
        flex-direction: row;
        margin-bottom: 0;
        margin-left: inherit;
        margin-right: inherit
    }

    .headerLogoContainer {
        height: 28px
    }
}

.infoItem {
    display: flex;
    flex-direction: row;
    margin-right: 25px;
    width: max-content
}

.infoItemImage {
    border-radius: 20px;
    border-radius: 50%;
    margin-right: 8px;
    text-align: center
}

.infoItemDesc {
    color: #fff;
    font-family: Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px
}

@media (max-width:480px) {
    .infoItem {
        margin-right: 5px;
        padding-right: 0
    }

    .infoItemDesc {
        font-family: Helvetica;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 24px;
        margin-left: 24px
    }

    .infoItemImage {
        display: none
    }
}

@media (min-width:481px) and (max-width:767px) {
    .infoItem {
        margin-right: 15px;
        padding-right: 0
    }

    .infoItemDesc {
        font-family: Helvetica;
        font-size: 11px;
        font-style: normal;
        font-weight: 700;
        line-height: 24px
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .infoItem {
        margin-right: 10px;
        padding-right: 0
    }

    .infoItemDesc {
        font-family: Helvetica;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 24px;
        margin-left: 24px
    }

    .infoItemImage {
        display: none
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
    .infoItemDesc {
        font-size: 16px;
        line-height: 24px;
        padding-left: 0;
        padding-top: 0
    }

    .infoItemImage {
        display: flex
    }
}

.infoItemURl {
    color: #fff;
    cursor: pointer
}

.infoItemURl:hover {
    color: #fff;
    cursor: pointer;
    text-decoration: underline
}

.infoItemURlActive {
    color: #fff;
    cursor: pointer;
    text-decoration: underline
}

.infoItemURlActive:hover {
    color: #fff !important;
    cursor: pointer;
    text-decoration: underline
}

.chatHeader .mu-expert-profile {
    background: #19334a !important;
    max-width: 100% !important
}

.chatHeader .mu-expert-profile:before {
    color: #96dbed !important
}

.chatHeader .mu-expert-profile .profile__title {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    margin-top: -16px
}

.chatHeader .mu-expert-profile .profile--blue {
    background: #19334a !important;
    padding-bottom: 16px;
    padding-top: 20px
}

.chatHeader .mu-expert-profile .profile__details {
    margin-left: 16px;
    padding-left: 0 !important
}

.chatHeader .header .profile .profile__avatar,
.chatHeader .header .profile .profile__details {
    align-self: flex-start
}

.chatHeader .mu-expert-profile .profile__avatar-wrapper {
    margin-left: 5px;
    width: 128px !important
}

.chatHeader .mu-expert-profile .profile__avatar-image {
    border: 0 !important;
    border-radius: 0 !important;
    height: 48px !important;
    width: 128px !important
}

.thread-content .details .post__meta__author {
    color: #999;
    font-size: 12px;
    font-weight: 400;
    margin: 0
}

.container--pearlChat>.avatar {
    height: 30px;
    width: 30px
}

.container--pearlChat>.avatar .avatar {
    height: 100%;
    width: 30px
}

.container--pearlChat>.body .bubble {
    font-size: 14px !important
}

.container--pearlChat>.body .bubble.bubble-gray {
    background: #e7edf5 !important
}

.container--pearlChat .customer-message .bubble.bubble-blue {
    background: #e7edf5 !important
}

.thread-bottom .input__container {
    height: 48px
}

.thread-input .container__submit .submit__wrapper .submit-button {
    font-size: 14px
}

.profile__avatar-image {
    animation-duration: 2s;
    animation-name: slideDown
}

@media (min-width:768px) and (max-width:1024px) {
    .chatContainer .thread-content {
        height: 550px !important
    }
}

@keyframes slideDown {
    0% {
        height: 0;
        opacity: 0
    }

    to {
        height: 55px;
        margin-top: 0;
        opacity: 1
    }
}

.container__submit {
    align-self: flex-end;
    padding-top: 16px
}

.input__container:hover {
    box-shadow: 0 4px 8px rgba(8, 62, 84, .15)
}

.input-attachment__icon svg {
    display: block;
    height: 24px;
    width: 24px;
    fill: #999;
    color: #999;
    stroke: currentColor;
    transform: scaleY(1) rotate(45deg)
}

.input-attachment__icon svg .svg__icon {
    display: block;
    height: 100%;
    width: 100%
}

.input-attachment__icon--active svg {
    display: block;
    height: 24px;
    width: 24px;
    fill: #139bc9;
    color: #139bc9;
    stroke: currentColor
}

.input-attachment__icon--active svg .svg__icon {
    display: block;
    height: 100%;
    width: 100%
}

.input-attachment__icon svg:hover {
    display: block;
    height: 24px;
    width: 24px;
    stroke: currentColor
}

.input-attachment__icon svg:hover .svg__icon {
    display: block;
    height: 100%;
    width: 100%
}

.input-attachment__icon--disabled svg:hover {
    display: block;
    height: 24px;
    width: 24px;
    fill: #999;
    color: #999;
    stroke: currentColor
}

.input-attachment__icon--disabled svg:hover .svg__icon {
    display: block;
    height: 100%;
    width: 100%
}

.input-attachment__field-container {
    margin-left: 24px
}

.input-attachment__list {
    min-height: 40px
}

.avatar {
    height: 32px;
    position: relative;
    width: 32px
}

.avatar:after,
.avatar:before {
    border-radius: 50%;
    content: "";
    display: block;
    position: absolute
}

.avatar__online:before {
    background: #fff;
    bottom: -2px;
    height: 12px;
    right: -2px;
    width: 12px
}

.avatar__online:after {
    background: #00bf8f;
    bottom: 0;
    height: 8px;
    right: 0;
    width: 8px
}

.image {
    background-color: #f5f5f5;
    border-radius: 50%;
    height: 100%;
    max-height: 100%;
    max-width: 100%;
    overflow: hidden;
    width: 100%
}

.avatar--browserExtension {
    height: 40px;
    position: relative;
    width: 40px
}

.chat {
    background: #fff;
    margin-left: 246px;
    padding: 24px 40px
}

.chat__header {
    align-items: center;
    background: #fff;
    display: flex;
    justify-content: space-between;
    padding-left: 32px;
    padding-right: 32px;
    padding-top: 24px
}

.chat__header__disconnected {
    background-color: #ebebeb !important
}

.chat__heading {
    font-size: 24px;
    font-weight: 700;
    font-weight: 400;
    line-height: 28px
}

.chat__text {
    font-size: 14px;
    line-height: 20px;
    padding-right: 24px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.thread-main {
    min-height: 100%
}

.thread-input {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px
}

.message-text-bottom-padding {
    padding-bottom: 16px
}

.message-text-inline {
    display: inline
}

.conversation {
    height: 100%;
    position: relative
}

.container {
    justify-content: stretch
}

.rating {
    cursor: pointer;
    display: flex;
    padding: 0 3px;
    position: relative
}

.rating__star {
    display: flex;
    padding: 0 1px
}

.rating__star svg {
    fill: #ccc
}

.rating__star.rating__star--active svg {
    fill: #ffb15d
}

.rating.rating--rated:hover {
    cursor: default
}

.star-icon {
    background-size: 20px 30px
}

.rating-label {
    color: #666;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 4px;
    text-align: center
}

.rating-content {
    justify-content: flex-end
}

.rating-note {
    font-size: 12px;
    line-height: 16px;
    margin-top: 8px;
    text-align: right
}

.star-padding {
    padding: 0 4px
}

.add-bonus-link {
    margin-top: 16px;
    text-align: right
}

.group {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    padding-left: 32px;
    padding-right: 32px
}

.group__disconnected {
    background-color: #ebebeb;
    padding-bottom: 24px
}

.first-group {
    flex: 0 0 0;
    padding-top: 0
}

.first-group:has(aside) {
    flex: 1 0 0
}

.first-group>div {
    flex-shrink: 0
}

.last-group {
    padding-bottom: 24px
}

.group.wide {
    padding-left: 16px;
    padding-right: 16px
}

.first-group.wide {
    padding-top: 8px
}

.first-group.wide-no-space {
    padding-top: 0
}

.last-group.wide,
.last-group.wide-no-space {
    padding-bottom: 16px
}

.group.desktop-redesign {
    padding-left: 24px;
    padding-right: 24px
}

.messages-group-container:has(aside) {
    display: flex;
    flex: 1 0 0;
    flex-direction: column
}

.messages-group-container {
    width: 100%
}

.messages-group-container__customer {
    align-self: flex-end;
    display: flex;
    flex-direction: column
}

.messages-group-container__customer .messages-group {
    justify-content: flex-end
}

.messages-group-container__customer>div:not(:first-child) {
    margin-top: 0
}

.messages-group-container>div:not(:last-of-type) {
    padding-left: 32px
}

.messages-group-container>div:not(:first-child) {
    margin-top: 0
}

.messages-group-container .messages-group {
    align-self: flex-end;
    max-width: 688px !important;
    padding-left: 32px
}

.messages-group-container .messages-group__avatar {
    height: 32px;
    margin-left: -32px;
    width: 32px
}

.messages-group-container .messages-group__avatar.animate {
    animation: slideFromTop .4s ease-out
}

@keyframes slideFromTop {
    0% {
        bottom: 100%
    }

    to {
        bottom: 0
    }
}

.messages-group-container--pearlChat {
    width: 100%
}

.messages-group-container--pearlChat>div:not(:first-child) {
    margin-top: 4px !important
}

.messages-group--pearlChat {
    justify-content: flex-end;
    padding-left: 56px
}

.messages-group--pearlChat__avatar {
    height: 32px;
    margin-left: -32px;
    width: 32px
}

.messages-group--pearlChat__avatar.animate {
    animation: slideFromTop .4s ease-out
}

.container {
    color: #666;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    margin: 8px 10px
}

.container a {
    text-decoration: underline
}

.message-container {
    background-color: #f1f8fa;
    border: 1px solid #ebebeb;
    border-radius: 8px;
    padding: 16px
}

.content-container {
    display: flex
}

.image-container {
    flex: 1
}

.text-container {
    padding-left: 16px
}

.header {
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    text-wrap: balance
}

.body,
.header {
    padding-bottom: 8px
}

.body {
    font-size: 14px;
    line-height: 20px;
    text-align: left
}

.buttons-container {
    display: flex;
    gap: 12px
}

.buttons-container button {
    flex: 1
}

.input__container:hover {
    box-shadow: 0 .5px 6px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .2)
}

@media (min-width:320px) and (max-width:767px) {
    .input__container {
        padding: 18px 8px
    }

    .input__field {
        font-size: 14px;
        height: 20px !important;
        line-height: 20px;
        min-height: 20px
    }
}

.input__container {
    border: 1px solid #999;
    padding: 12px 16px
}

.input__container:hover {
    border: 1px solid #139bc9
}

.input__field {
    min-height: 20px
}

.input__field:focus::placeholder {
    color: transparent
}

.input__container--browserExtension .input__field {
    min-height: 20px
}

.submit-mobile-button {
    background-color: #fff;
    width: 24px
}

.detailed-option-button {
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 4px;
    display: flex;
    justify-content: space-between;
    padding: 8px 16px;
    width: 100%
}

.detailed-option-button:focus,
.detailed-option-button:hover {
    background-color: #deeef3;
    color: #000
}

.detailed-option-button:focus {
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #127fab
}

.detailed-option-button .header {
    color: #139bc9;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: -4px
}

.detailed-option-button .text {
    color: #666;
    font-size: 12px
}

.detailed-option-button .text-container {
    display: inline-block
}

.detailed-option-button svg {
    fill: grey
}

.container {
    bottom: 0;
    margin: auto -16px -16px;
    overflow: hidden;
    padding: 0 16px 16px;
    position: sticky;
    z-index: 1
}

.inner-container {
    background: #fff;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 8px 24px 0 #0003, 0 4px 12px 0 #0000000a;
    display: flex;
    flex-direction: column;
    margin: 16px -16px -16px;
    overflow: hidden;
    padding: 16px;
    row-gap: 8px;
    transform: translateY(100%);
    transition: transform 1s ease-in-out;
    width: 100vw
}

.inner-container-appear-done {
    transform: translateY(0)
}

.message-button {
    color: #139bc9;
    font-weight: 700
}

.message-button:hover {
    cursor: pointer
}

@media (max-width:767px) {
    .message-button {
        font-size: 14px;
        line-height: 20px
    }
}

.icon-buttons {
    display: flex;
    justify-content: flex-end;
    padding-top: 8px;
    transition: fill .2s ease-in-out
}

.icon-buttons .button-wrapper {
    cursor: pointer;
    padding: 8px
}

.icon-buttons .button-wrapper:hover .dislike-button,
.icon-buttons .button-wrapper:hover .like-button {
    cursor: pointer;
    fill: #0d6b8f
}

@media (max-width:767px) {

    .icon-buttons .button-wrapper:hover .dislike-button,
    .icon-buttons .button-wrapper:hover .like-button {
        fill: #999
    }
}

.chatCollapsed {
    color: #009e76;
    font-weight: 700
}

.chatRoot {
    height: 100%;
    padding: 0
}

.container {
    display: block;
    font-family: Helvetica, Arial, Lucida Grande, sans-serif;
    line-height: 10px;
    position: relative
}

.container__reply {
    align-items: center;
    padding-top: 4px
}

@media (min-width:320px) and (max-width:767px) {
    .container__submit {
        padding-top: 8px
    }
}

.validation-error {
    color: #d5391a;
    display: block;
    font-size: 12px;
    line-height: 16px;
    min-height: 16px
}

.svg__instance {
    display: block;
    height: 100%;
    width: 100%
}

.svg__el {
    height: 0;
    overflow: hidden;
    position: absolute;
    width: 0
}

.svg__a {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.5px
}

.svg__a--medium {
    stroke-width: 1px
}

.svg__a--thin {
    stroke-width: .5px
}

.svg__a--bold {
    stroke-width: 5px
}

.svg__b {
    stroke-miterlimit: 10
}

.svg__c {
    fill-rule: evenodd
}

.svg__d {
    fill: none;
    stroke: #2b5bd9
}

.svg__d--stroke {
    stroke-linecap: round;
    stroke-linejoin: round
}

.svg .path_a,
.svg .path_b {
    cursor: default
}

.tooltip_display_inline_block {
    display: inline-block
}

.tooltip_display_block {
    display: block
}

.tooltip {
    position: relative
}

.tooltip__content {
    background-color: #000;
    border-radius: 4px;
    bottom: calc(100% + 16px);
    color: #fff;
    font-size: 16px;
    left: 50%;
    line-height: 24px;
    padding: 24px;
    position: absolute;
    transform: translateX(-50%)
}

.tooltip__content:after {
    border: 7px solid #000;
    border-bottom-right-radius: 2px;
    bottom: -5px;
    content: " ";
    left: calc(50% - 6px);
    position: absolute;
    transform: rotate(45deg)
}

.tooltip__content-with-fixed-width {
    width: 280px
}

.tooltip__content-with-fixed-width-for-private-ratings {
    width: 308px
}

.tooltip__content-with-fixed-width-for-ratings-info-request-responses {
    width: 355px
}

@media (max-width:1280px) {
    .tooltip__content-with-fixed-width-for-ratings-info-request-responses {
        width: 304px
    }
}

@media (max-width:980px) {
    .tooltip__content-with-fixed-width-for-ratings-info-request-responses {
        width: 256px
    }
}

.tooltip__content-with-fixed-width-for-rating-premium-service {
    width: 296px
}

.tooltip__content-width-post-rating-chat {
    min-width: 220px;
    padding: 16px
}

.tooltip__content-fixed-to-left {
    bottom: calc(100% + 18px);
    font-size: 14px;
    left: 0;
    line-height: 20px;
    padding: 16px;
    position: absolute;
    transform: translateX(-16px);
    width: 360px
}

.tooltip__content-fixed-to-left:after {
    border: 6px solid #000;
    border-bottom-right-radius: 2px;
    bottom: -6px;
    content: " ";
    left: 22px;
    position: absolute;
    transform: rotate(45deg)
}

@media (max-width:1280px) {
    .tooltip br {
        display: none
    }
}

.tooltip__close {
    cursor: pointer;
    position: absolute;
    right: 16px;
    top: 16px
}

.tooltip__close svg {
    display: block;
    margin: 0
}

.attachment {
    border-radius: 20px;
    margin-top: 8px
}

.attachment__icon {
    margin: 4px
}

.attachment__icon svg {
    left: 8px;
    top: 8px
}

.attachment__delete-button svg {
    fill: #999
}

.attachment {
    align-items: center;
    background-color: #ebebeb;
    border-radius: 24px;
    display: flex;
    margin-right: 8px;
    margin-top: 4px;
    min-height: 36px
}

.attachment__icon {
    display: block;
    margin: 0
}

.attachment__icon svg {
    left: 5px;
    position: absolute;
    top: 5px
}

.attachment__name {
    cursor: default;
    font-size: 12px;
    line-height: 16px;
    margin-right: 8px
}

.attachment__delete-button {
    align-items: center;
    display: flex;
    height: 24px;
    margin-right: 8px;
    width: 24px
}

.attachment__delete-button i {
    margin: 0 auto
}

.attachment__delete-button svg {
    fill: #666;
    cursor: pointer
}

.attachment:active {
    background-color: #999
}

.attachment:hover {
    background-color: #ccc
}

.attachment:active .attachment__delete-button,
.attachment:hover .attachment__delete-button {
    background-color: #999;
    border-radius: 50%
}

.attachment:active .attachment__delete-button svg,
.attachment:hover .attachment__delete-button svg {
    position: relative;
    fill: #fff
}

.progress-ring,
.progress-ring__canvas {
    height: 32px;
    width: 32px
}

.progress-ring {
    height: 26px;
    margin-left: 8px;
    margin-right: 6px;
    position: relative;
    width: 26px
}

.progress-ring__canvas {
    height: 26px;
    left: 0;
    position: absolute;
    top: 0;
    width: 26px
}

.progress-ring__canvas--hidden {
    display: none
}

.input__container {
    border: 1px solid #ccc;
    border-radius: 4px;
    flex: 1 1 0;
    margin-left: 28px;
    padding: 9px 8px
}

.input__container--active {
    border: 1px solid #139bc9;
    box-shadow: 0 0 5px 0 rgba(19, 155, 201, .5)
}

.input__field {
    font-size: 16px;
    height: 20px;
    line-height: 24px
}

.input-attachment__icon {
    align-self: flex-end;
    cursor: pointer;
    position: relative;
    right: 35px
}

.input-attachment__icon svg {
    fill: #666;
    color: #666;
    height: auto;
    transform: none;
    width: auto;
    stroke: none
}

.input-attachment__icon--active svg {
    fill: #666;
    color: #666
}

.input-attachment__icon svg:hover {
    height: auto;
    width: auto;
    fill: #139bc9;
    color: #139bc9;
    stroke: none
}

.input-attachment__icon--disabled {
    cursor: default
}

.input-attachment__icon--disabled svg:hover {
    fill: #666;
    color: #666;
    stroke: none
}

.input-attachment__file {
    display: none
}

.input-attachment__field {
    display: block;
    font-size: 14px;
    line-height: 20px
}

.input-attachment__field-container {
    margin-left: -20px;
    width: 100%
}

.input-attachment__list {
    display: flex;
    flex-wrap: wrap;
    max-height: 96px;
    min-height: 36px;
    overflow-y: auto
}

.input-attachment__list--hidden {
    display: none
}

.upload-icon {
    display: inline-block;
    position: relative
}

.container--browserExtension,
.container--pearlChat {
    padding-bottom: 8px;
    padding-left: 16px
}

.bubble {
    border-radius: 28px;
    display: inline-block;
    min-width: 40px;
    padding: 16px 24px;
    word-wrap: anywhere
}

.bubble.bubble-blue {
    background-color: #139bc9;
    color: #fff;
    float: right
}

.bubble.bubble-blue a {
    color: #fff;
    text-decoration: underline
}

.bubble.bubble-blue svg {
    color: #fff
}

.bubble.bubble-gray {
    background-color: #f5f5f5;
    color: #333
}

.bubble.bubble-gray a {
    color: #139bc9;
    text-decoration: underline
}

.bubble.bubble-gray svg {
    color: #139bc9
}

.bubble.bubble-image-text {
    margin-bottom: 4px
}

.bubble ol,
.bubble ul {
    list-style-position: inside
}

.bubble--pearlChat {
    width: inherit
}

.bubble--browserExtension {
    min-width: 6px;
    word-break: break-word
}

.bubble--browserExtension.bubble-blue a,
.bubble--browserExtension.bubble-gray a {
    color: #228eaa !important;
    cursor: pointer;
    font-weight: 700;
    text-decoration: none !important
}

.bubble--browserExtension.bubble-blue a:hover,
.bubble--browserExtension.bubble-gray a:hover {
    color: #ff9a2e !important
}

@media (max-width:767px) {
    .bubble {
        border-radius: 24px;
        max-width: 90em;
        padding: 12px 16px
    }
}

.typing-indicator {
    align-items: center;
    background-color: #f5f5f5;
    border-radius: 28px;
    display: inline-flex;
    height: 28px;
    justify-content: center
}

.typing-indicator span {
    background-color: #999;
    border-radius: 50%;
    display: block;
    height: 8px;
    opacity: .4;
    width: 8px
}

.typing-indicator span:first-child {
    animation: blink 1s .3333s infinite
}

.typing-indicator span:nth-child(2) {
    animation: blink 1s .6666s infinite;
    margin: 0 4px
}

.typing-indicator span:nth-child(3) {
    animation: blink 1s .9999s infinite
}

@keyframes blink {
    50% {
        opacity: 1
    }
}

.post__meta {
    align-items: center;
    color: #999;
    display: flex;
    font-size: 12px;
    justify-content: space-between;
    line-height: 16px;
    padding: 0 24px
}

.post__meta__author {
    padding-right: 8px
}

.post__meta__author__name,
.post__meta__author__title {
    display: inline
}

.post__meta__date {
    padding: 0
}

.chatBody {
    background: #fff;
    display: flex;
    flex: 1 0 0;
    flex-direction: column
}

.container {
    color: #333;
    max-width: 600px;
    white-space: pre-wrap
}

.grey-text {
    color: #999;
    font-weight: 700;
    margin-right: 4px
}

.sentence {
    padding-bottom: 4px
}

.image {
    display: block;
    line-height: 10px;
    margin-bottom: 5px;
    margin-top: 5px
}

.image__preview-container {
    cursor: pointer;
    display: inline-block
}

.image__preview-container img {
    border-radius: 28px;
    display: block;
    max-height: 230px;
    max-width: 320px
}

.image__fullscreen {
    align-items: center;
    background: rgba(0, 0, 0, .7);
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1
}

.image__fullscreen__container {
    display: inline-flex;
    position: relative
}

.image__fullscreen__container img {
    display: block;
    max-height: 600px;
    max-width: 720px
}

.image__fullscreen__container span {
    align-items: center;
    background: #ebebeb;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    position: absolute;
    right: 20px;
    top: 20px;
    width: 32px
}

.image__fullscreen__container span svg {
    display: block;
    height: 16px;
    width: 16px;
    fill: #333;
    color: #333;
    stroke: currentColor
}

.image__fullscreen__container span svg .svg__icon {
    display: block;
    height: 100%;
    width: 100%
}

.file {
    align-items: center;
    display: flex;
    flex-direction: row
}

.file svg {
    display: block;
    height: 24px;
    width: 24px;
    fill: #333;
    color: #333;
    stroke: currentColor
}

.file svg .svg__icon {
    display: block;
    height: 100%;
    width: 100%
}

.file .file-metadata {
    display: flex;
    flex-direction: column;
    margin-left: 8px
}

.file .file-metadata .file-fileName {
    font-weight: 700;
    line-height: 20px
}

.file .file-metadata span {
    line-height: 20px
}

.files {
    display: flex;
    flex-direction: column
}

.files .file:not(:first-child) {
    padding-top: 16px
}

.container {
    padding-bottom: 8px;
    padding-top: 8px
}

.container .view-history {
    align-items: center;
    color: #666;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    justify-content: flex-end
}

.container .view-history__text {
    font-size: 14px;
    line-height: 20px;
    padding-right: 4px
}

.container .view-history__arrow {
    height: 12px;
    width: 12px;
    fill: #666
}

.container .view-history__arrow__up {
    transform: rotate(180deg)
}

.container .view-history__arrow:hover svg {
    fill: #139bc9
}

.container .messageContainer {
    display: flex;
    flex-direction: column;
    padding-top: 24px;
    width: 80%
}

.container .messageContainer__text {
    margin-left: 64px;
    max-width: 600px
}

.container--pearlChat {
    padding-right: 24px;
    width: 100%
}

.container--pearlChat .body {
    width: 100%
}

.container--browserExtension {
    text-align: left;
    width: 95%
}

div .option-button {
    border-radius: 24px;
    padding: 12px 16px
}

.container {
    align-items: flex-end;
    flex: 1;
    margin-top: 8px;
    width: 100%
}

div .option-button {
    border-radius: 40px;
    color: #000;
    display: block;
    flex-shrink: 0;
    font-weight: 400;
    margin-top: 8px
}

div .option-button:focus,
div .option-button:hover {
    background-color: #deeef3;
    border-color: #139bc9;
    color: #000
}

div .option-button:focus {
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #127fab
}

.plain {
    display: inline-block
}

.plain__text {
    margin: 0;
    white-space: pre-line
}

.plain--browserExtension__text {
    margin-block: 0
}

@media (max-width:767px) {
    .plain__text {
        font-size: 14px;
        line-height: 20px
    }
}

.rich {
    display: inline-block;
    vertical-align: text-bottom
}

.rich__text {
    white-space: pre-line
}

@media (max-width:767px) {
    .rich__text {
        font-size: 14px;
        line-height: 20px
    }
}

.notification {
    align-items: center;
    display: flex
}

.notification__content {
    max-width: 90%;
    padding: 0 8px;
    text-align: center
}

.notification__content--base,
.notification__content--conversation-finished {
    color: #666
}

.notification__content--chat-closed {
    color: #333;
    padding: 0 12px
}

.notification__content--error {
    color: #e85c41
}

.notification__content a,
.notification__content a:hover {
    color: #139bc9
}

.notification__delimiter {
    flex: 1
}

.notification__delimiter--base,
.notification__delimiter--chat-closed {
    border-bottom: 1px solid #7fc5dd
}

.notification__delimiter--error {
    border-bottom: 1px solid #e85c41
}

.notification--pearlChat--base {
    color: #333
}

@media (max-width:767px) {

    .notification__content--base,
    .notification__content--paragraph {
        font-size: 14px;
        line-height: 20px
    }
}

.secureMessage {
    display: inline-flex;
    justify-content: center;
    padding-right: 8px
}

.phone-conference-notification {
    text-align: center
}

.phone-conference-notification_badge {
    display: block
}

.phone-conference-notification_badge--starting {
    background-color: #f5f5f5 !important;
    border-radius: 16px !important;
    color: #002e22 !important;
    margin: 0 !important;
    padding: 6px 6px 6px 4px !important
}

.phone-conference-notification_badge--completed,
.phone-conference-notification_badge--in-progress {
    background-color: #e7f5f2 !important;
    border-radius: 16px !important;
    color: #002e22 !important;
    margin: 0 !important;
    padding: 6px 6px 6px 4px !important
}

.phone-conference-notification_badge--missed-call {
    background-color: #f5f5f5 !important;
    border-radius: 16px !important;
    color: #333 !important;
    margin: 0 !important;
    padding: 6px 6px 6px 4px !important
}

.phone-conference-notification_badge--failed {
    background-color: #fce9e6 !important;
    border-radius: 16px !important;
    color: #6c1504 !important;
    margin: 0 !important;
    padding: 6px 6px 6px 4px !important
}

.phone-conference-notification_label {
    font-size: 14px !important
}

.phone-conference-notification_duration {
    color: #999 !important;
    font-size: 14px !important
}

.phone-conference-notification_summary {
    margin-top: 16px
}

.secure-message-sub-container,
.video-room-notification {
    align-items: center;
    display: flex
}

.video-room-notification {
    color: #333;
    font-size: 14px;
    font-weight: 700;
    justify-content: space-between;
    line-height: 20px;
    text-align: left
}

.video-room-container {
    align-items: center;
    background-color: #deeef3;
    border-radius: 8px;
    display: flex;
    flex-direction: row;
    padding: 16px
}

.disclaimer {
    color: #666;
    font-size: 12px;
    line-height: 16px
}

.join-room-button {
    margin-left: 8px
}

.video-call-icon {
    display: flex;
    margin-right: 6px
}

.date {
    padding: 0
}

.date--edited,
.date--posted {
    display: inline
}

.container {
    padding-left: 32px;
    padding-right: 24px
}

.body .thinking-message-desktop {
    color: grey;
    font-size: 16px;
    height: 28px;
    line-height: 24px;
    margin-right: 20px;
    position: relative
}

.body .thinking-message-mobile {
    color: grey;
    font-size: 14px;
    line-height: 20px;
    margin-right: 18px;
    position: relative
}

.body .thinking-message-desktop:after,
.body .thinking-message-mobile:after {
    animation: animloader 1s linear infinite;
    background: currentColor;
    box-sizing: border-box;
    content: "";
    height: 2px;
    position: absolute;
    width: 2px
}

.body .thinking-message-mobile:after {
    bottom: 5px;
    right: -6px
}

.body .thinking-message-desktop:after {
    bottom: 11px;
    right: -4px
}

@keyframes animloader {
    0% {
        box-shadow: 5px 0 hsla(0, 0%, 100%, 0), 10px 0 hsla(0, 0%, 100%, 0)
    }

    50% {
        box-shadow: 5px 0 #999, 10px 0 hsla(0, 0%, 100%, 0)
    }

    to {
        box-shadow: 5px 0 #999, 10px 0 #999
    }
}

.thread-content-jp {
    border: 1px solid #ebebeb;
    box-shadow: none
}

.container {
    flex-direction: column
}

.container .heading {
    background: #f5f5f5;
    background-size: 50%;
    border: 1px #ccc;
    border-radius: 30px 30px 0 0;
    border-style: solid solid hidden;
    display: flex;
    padding: 16px 24px;
    width: 100%
}

.container .rating-control {
    align-items: center;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 0 0 30px 30px;
    display: flex;
    flex-direction: column;
    height: 104px;
    justify-content: center;
    width: 100%
}

.container .button {
    margin-top: 16px
}

.container .star {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 100%
}

.container .star i svg {
    display: block;
    height: 40px;
    width: 40px;
    fill: #139bc9;
    color: #139bc9;
    stroke: currentColor
}

.container .star i svg .svg__icon {
    display: block;
    height: 100%;
    width: 100%
}

.container .star:hover i svg {
    display: block;
    height: 40px;
    width: 40px;
    fill: #127fab;
    color: #127fab;
    stroke: currentColor
}

.container .star:hover i svg .svg__icon {
    display: block;
    height: 100%;
    width: 100%
}

.container .line {
    border-left: 1px solid #ccc;
    height: 104px
}

.star-padding {
    padding: 0 8px
}

.avatar {
    margin-top: 20px;
    padding-bottom: 60px
}

.container {
    align-self: flex-start;
    justify-content: flex-start;
    margin-top: 24px;
    width: 60%
}

.body {
    display: flex;
    flex-direction: column
}

.container {
    align-self: flex-end;
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
    width: 80%
}

.body {
    display: block;
    margin-left: 8px;
    max-width: 648px
}

.container--pearlchat {
    margin-top: 16px;
    width: 100%
}

.body--pearlchat {
    margin-left: 64px
}

.input__container {
    align-items: center;
    background: #fff;
    border: 1px solid #139bc9;
    border-radius: 8px;
    display: flex;
    flex: 1;
    flex-basis: auto;
    height: 88px;
    padding: 16px;
    width: 100%
}

.input__container--active {
    box-shadow: 0 .5px 6px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .2)
}

.input__container--shaking {
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: shaking;
    animation-name: shaking
}

.input__container--disabled {
    background-color: #f5f5f5;
    border: 1px solid #999;
    box-shadow: none;
    opacity: .5;
    pointer-events: none
}

.input__container:hover {
    border-color: #139bc9
}

.input__container--expanded {
    padding-bottom: 8px;
    padding-right: 6px;
    padding-top: 8px
}

.input__field {
    border: 0;
    display: block;
    height: 24px;
    line-height: 20px;
    overflow: hidden auto;
    padding: 0;
    resize: none;
    width: 100%
}

.input__field::-webkit-input-placeholder {
    color: #999
}

.input__field::-moz-placeholder {
    color: #999
}

.input__field:-ms-input-placeholder {
    color: #999
}

.input__field:-moz-placeholder {
    color: #999
}

.input__field::placeholder {
    overflow-y: hidden
}

.input__field--pearlChat {
    min-height: 72px
}

.input__container--browserExtension {
    border: 1px solid #ccc;
    border-radius: 0;
    box-shadow: none !important;
    padding: 3px 3px 3px 16px
}

.input__container--browserExtension--active {
    box-shadow: none !important
}

.input__container--browserExtension:hover {
    box-shadow: none !important
}

.input__container--browserExtension .input__field {
    background: #fff;
    font-family: Helvetica, Arial, Lucida Grande, sans-serif;
    line-height: 26px;
    margin: 0;
    max-height: 68px;
    outline: 0;
    padding-top: 2px;
    width: 100%
}

.input__container--browserExtension .input__field::placeholder {
    overflow-y: auto
}

.input__container--browserExtension .input__field:focus::placeholder {
    color: #999
}

@keyframes shaking {

    0%,
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    25% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }

    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
}

.validation-tooltip {
    background-color: #000;
    border-radius: 4px;
    height: 72px;
    left: 50%;
    opacity: .95;
    padding: 24px;
    position: absolute;
    text-align: center;
    top: -88px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 288px;
    z-index: 999
}

.validation-tooltip:after {
    background-color: #000;
    border-bottom-right-radius: 2px;
    bottom: -5px;
    content: "";
    height: 12px;
    left: 50%;
    opacity: .95;
    position: absolute;
    -webkit-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg);
    width: 12px
}

.validation-tooltip span {
    color: #fff;
    font-size: 16px;
    line-height: 24px
}

.thread-content {
    background-color: #fff;
    border-radius: 16px;
    box-shadow: 0 0 20px rgba(0, 0, 0, .2)
}

.thread-footer {
    padding-top: 16px
}

.thread-input {
    background: #fff;
    padding: 24px 32px
}

.thread-content--pearlChat {
    border-radius: 4px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .04), 0 10px 32px rgba(0, 0, 0, .2)
}

.thread-content--pearlChat .thread-footer {
    padding-top: 8px
}

.thread-content--pearlChat .thread-input {
    padding: 16px
}

.thread-content-browser-extension {
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: none;
    height: auto;
    padding: 0 16px 16px
}

.thread-content-browser-extension .thread-footer {
    padding-top: 0
}

.thread-content-browser-extension .thread-input {
    padding: 0
}

.thread-content-browser-extension .thread-bottom__withShadow,
.thread-content-browser-extension .thread-top__withShadow {
    box-shadow: none
}

.avatar {
    align-items: flex-end;
    display: flex;
    height: 32px !important;
    justify-content: end;
    margin-top: 14px;
    width: 32px !important
}

.avatar .image {
    border-radius: 0 !important
}

.typingMessageContainer {
    align-self: flex-start;
    display: flex;
    justify-content: flex-start
}

.typingMessageContainer .bubble.bubble-gray.bubble--pearlChat {
    background: rgba(82, 186, 213, .25);
    border: 1px solid #a8dcea;
    border-radius: 3px;
    display: inline-block;
    line-height: 8px;
    padding: 8px;
    position: relative
}

.typingMessageContainer .bubble.bubble-gray.bubble--pearlChat .typing-indicator {
    background: transparent;
    height: 20px
}

.typingMessageContainer .bubble.bubble-gray.bubble--pearlChat:before {
    border-bottom: 8px solid transparent;
    border-right: 8px solid #cde7ed;
    border-top: 8px solid transparent;
    content: "";
    display: block;
    left: -8px;
    position: absolute;
    top: 8px
}

.typingMessageContainer .bubble.bubble-gray.bubble--pearlChat:after {
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    border-top: 14px solid transparent;
    border-color: #cde7ed transparent transparent;
    border-style: solid;
    border-width: 8px 7px 14px 8px;
    left: -8px;
    top: 8px;
    -webkit-transform: translate(15.5555555%, -15.5555555%) rotate(90deg) translateY(50%);
    transform: translate(15.5555555%, -15.5555555%) rotate(90deg) translateY(50%)
}

.typingContainerBody {
    display: flex;
    flex-direction: column;
    margin-bottom: 24px;
    margin-left: 16px
}

.details {
    margin-bottom: 4px
}

@media (max-width:767px) {
    .typingMessageContainer .avatar {
        height: 24px !important;
        width: 24px !important
    }

    .typingMessageContainer {
        padding: 16px
    }

    .typingMessageContainer .bubble.bubble-gray.bubble--pearlChat {
        background: #f5f5f5;
        border: 1px solid #f5f5f5;
        margin-bottom: 10px;
        padding: 10px 12px
    }

    .typingMessageContainer .bubble.bubble-gray.bubble--pearlChat:before {
        display: none
    }
}

.container__reply {
    display: flex;
    flex-direction: column
}

.container__submit {
    display: flex;
    flex-direction: row;
    margin-top: 8px
}

.container .experts-online__wrapper {
    display: flex;
    flex: 1;
    flex-direction: row;
    justify-content: center;
    margin-top: 8px;
    width: 100%
}

.container .online-indicator {
    background-color: #00bf8f;
    border-radius: 50%;
    height: 8px;
    margin-right: 8px;
    width: 8px
}

.container .experts-online-text-wrapper,
.container .online-indicator-wrapper {
    display: flex;
    flex-direction: column;
    place-content: center center
}

.container .experts-online-text {
    font-size: 12px;
    letter-spacing: .07px;
    line-height: 16px
}

.container .submit__wrapper {
    width: auto
}

.container .input__wrapper {
    width: 100%
}

@media (max-width:767px) {
    .container .container__replyMaximized {
        align-items: flex-start;
        display: flex;
        flex-direction: row;
        justify-content: space-evenly
    }

    .container .container__submit {
        display: flex;
        flex-direction: row;
        margin-top: 8px
    }

    .container .container__submit.maximized {
        margin-top: 0 !important;
        width: 15% !important
    }

    .container .input__wrapper {
        width: 100%
    }

    .container .input__wrapper.maximized {
        width: 85% !important
    }
}

@media screen and (min-resolution:1.5dppx),
screen and (min-resolution:144dpi) {
    .chatHeader .mu-expert-profile .profile__title {
        font-size: 14px !important
    }
}

.mu-expert-profile .profile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 16px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: Helvetica;
    height: 120px;
    position: relative
}

.mu-expert-profile .profile--blue {
    background: #52bad5
}

.mu-expert-profile .profile--gradient {
    background: linear-gradient(159.95deg, #52bad5, #64bbe8 27.62%, #6473e5 82.41%, #5c8ad3)
}

.mu-expert-profile .profile__avatar {
    height: 96px;
    overflow: hidden;
    width: 96px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: relative
}

.mu-expert-profile .profile__avatar .online-circle:before {
    background: #00bf8f;
    border: 1px solid #fff;
    border-radius: 50%;
    bottom: 12px;
    content: "";
    display: block;
    height: 14px;
    position: absolute;
    right: 12px;
    width: 14px
}

.mu-expert-profile .profile__verified {
    bottom: 2px;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .48));
    -webkit-filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .48));
    position: absolute;
    right: 11px;
    width: 23px
}

.mu-expert-profile .profile__avatar-wrapper {
    height: 100%;
    width: 100%
}

.mu-expert-profile .profile__avatar-image {
    border: 8px solid hsla(0, 0%, 100%, .1);
    border-radius: 50%;
    height: 100%;
    width: 100%
}

.mu-expert-profile .profile__details {
    color: #fff;
    font-size: 12px;
    line-height: 16px;
    max-width: -o-calc(100% - 100px);
    max-width: calc(100% - 100px);
    padding-left: 24px
}

.mu-expert-profile .profile__name {
    font-size: 20px;
    line-height: 20px;
    padding-bottom: 8px
}

.mu-expert-profile .profile__title-prefix {
    background-color: #1c758d;
    border-radius: 2px;
    color: #fff;
    margin-right: 4px;
    padding: 2px 4px
}

.mu-expert-profile .profile__credentials,
.mu-expert-profile .profile__title {
    color: hsla(0, 0%, 100%, .75)
}

.mu-expert-profile .profile__rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 8px;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.mu-expert-profile .profile__star-icon {
    display: block;
    margin-right: 4px
}

.mu-expert-profile .profile__star-icon .icon {
    vertical-align: top
}

.mu-expert-profile .profile__question-count {
    color: hsla(0, 0%, 100%, .75);
    line-height: 12px;
    padding-left: 8px
}

.mu-expert-profile .profile__count-number {
    color: #fff;
    font-weight: 700
}

.mu-expert-profile.btc-design .profile .profile__details .profile__credentials,
.mu-expert-profile.btc-design .profile .profile__details .profile__title {
    color: #fff
}

.mu-expert-profile.has-flag .profile__name {
    padding-right: 32px
}

.mu-expert-profile .flag {
    border-radius: 2px;
    height: 16px;
    position: absolute;
    right: 16px;
    top: 12px;
    width: 22px
}

.mu-expert-profile .flag.mobile {
    right: 12px;
    top: 8px
}

.mu-expert-profile:before {
    color: #fff !important;
    display: block;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    padding-left: 20px !important;
    padding-top: 16px !important
}

.profile--blue:before {
    font-size: 16px;
    font-weight: 700;
    line-height: 20px
}

.chatHeader .body {
    background: #fff !important;
    height: calc(100% - 270px) !important;
    padding-bottom: 0 !important
}

.chatHeader .body:after {
    content: " ";
    display: block;
    padding-bottom: 30px
}

.chatHeader {
    background: #fff !important;
    border-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important
}

.chatHeader p {
    margin-block-end: 0;
    margin-block-start: 0
}

.chatHeader .mu-expert-profile .profile {
    height: 100%
}

.chatHeader .profile__name {
    display: none;
    font-size: 16px !important;
    line-height: 24px !important
}

.chatHeader .profile__rating {
    display: none !important
}

.chatHeader .profile__credentials,
.chatHeader .profile__title {
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 24px !important
}

.chatHeader .mu-expert-profile .profile__question-count {
    font-size: 14px !important;
    line-height: 16px !important
}

.chatHeader .mu-expert-profile .profile__avatar {
    height: auto !important;
    width: auto !important
}

.chatHeader .mu-expert-profile .profile__avatar-wrapper:after {
    bottom: 9px;
    box-sizing: border-box;
    content: " ";
    display: block;
    height: 20px;
    line-height: 24px;
    position: absolute;
    right: -4px;
    text-rendering: optimizeLegibility;
    width: 20px;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased
}

@media (max-width:767px) and (max-aspect-ratio:121/80) {
    .mu-expert-profile:before {
        padding-left: 12px !important;
        padding-top: 12px !important
    }
}

@media (max-width:767px) {
    .mu-expert-profile:before {
        display: none
    }

    .thread-top {
        position: unset !important
    }

    .profile.profile--blue {
        position: unset
    }

    .chatHeader .mu-expert-profile .profile--blue {
        background-image: linear-gradient(153.86deg, #252e4e 4.55%, #4e5e96) !important;
        padding: 40px 11px 12px !important
    }

    .chatHeader .mu-expert-profile .profile__avatar-wrapper {
        margin-left: 10px
    }

    .chatHeader .mu-expert-profile .profile__avatar-image {
        height: 48px !important;
        width: 124px !important
    }

    .chatHeader .mu-expert-profile .profile__avatar {
        position: absolute;
        top: -24px
    }

    .mu-expert-profile .profile__details {
        max-width: 100%
    }

    .chatHeader .mu-expert-profile .profile__credentials,
    .chatHeader .mu-expert-profile .profile__title {
        font-size: 12px !important;
        font-weight: 400 !important;
        line-height: 16px !important
    }

    .chatHeader .mu-expert-profile .profile__credentials {
        padding-left: 20px !important
    }

    .chatHeader .mu-expert-profile .profile__title {
        display: flex;
        margin-top: 0 !important;
        padding-bottom: 2px
    }
}

.input__container {
    height: auto !important
}

.layoutPadding {
    padding-left: 32px;
    padding-right: 32px
}

@media (min-width:1140px) {
    .layoutPadding {
        padding-left: 40px;
        padding-right: 40px
    }
}

@media (min-width:1440px) {
    .layoutPadding {
        display: flex;
        justify-content: center;
        padding-left: 40px;
        padding-right: 40px
    }
}

@media (min-width:768px) and (max-width:1023px) {
    .layoutPadding {
        padding-left: 40px;
        padding-right: 40px
    }
}

@media (max-width:767px) {
    .layoutPadding {
        padding-left: 24px;
        padding-right: 24px
    }
}

.fontBold {
    font-family: inter_bold, Helvetica, sans-serif !important
}

.thread-top {
    background-color: #fff
}

.thread-content {
    border-radius: 8px;
    box-shadow: 0 .5px 6px 0 rgba(0, 0, 0, .04), 0 4px 12px 0 rgba(0, 0, 0, .2);
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden
}

.thread-content>.container {
    justify-content: flex-start;
    max-width: none;
    overflow-y: auto;
    padding-left: 20px;
    padding-right: 20px;
    width: -webkit-fill-available !important;
    width: -moz-available !important
}

.thread-main {
    background: #fff;
    display: flex;
    flex-direction: column
}

.thread-main .container {
    max-width: none
}

.thread-footer {
    background: #fff;
    padding-top: 0
}

.thread-input {
    padding: 16px
}

.thread-input .container {
    background: #d6e1ee;
    max-width: none;
    overflow: visible;
    padding: 15px 20px 14px;
    position: relative;
    width: auto !important
}

.thread-input .container__reply {
    width: 100%
}

.thread-input .container__submit {
    flex-direction: column-reverse;
    margin-top: 12px;
    padding-top: 0;
    width: 100%
}

.thread-input .container__submit .submit__wrapper {
    width: 100%
}

.thread-input .container__submit .submit__wrapper .submit-button-container {
    padding-left: 0
}

.thread-input .container__submit .submit__wrapper .submit-button {
    background: #2aa6f8;
    height: 40px;
    padding: 0;
    width: 100%
}

.thread-input .container__submit .submit__wrapper .submit-button:hover {
    background: #0d90e8
}

.thread-input .container__submit .experts-online__wrapper {
    display: none
}

.thread-input .container .validation-tooltip {
    align-items: center;
    background: #333;
    height: auto;
    justify-content: center;
    opacity: 1;
    padding: 12px 36px !important;
    padding: 0;
    top: -40px;
    width: 185px
}

.thread-input .container .validation-tooltip:after {
    background: #333;
    bottom: -10px;
    height: 20px;
    opacity: 1;
    width: 20px
}

.thread-input .container .validation-tooltip span {
    display: flex;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .07px;
    line-height: 20px
}

.thread-input .container .validation-tooltip:not(.hidden) {
    display: flex;
    z-index: 99
}

.thread-bottom,
.thread-top {
    position: relative;
    z-index: auto
}

.thread-bottom__withShadow,
.thread-top__withShadow {
    box-shadow: 0 .5px 6px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .2)
}

.thread-bottom {
    margin-top: -1px;
    z-index: 10
}

.commentModal .modalContent {
    padding: 0
}

.container {
    margin: 0;
    padding-left: 24px;
    width: 100% !important
}

.thread-main {
    height: auto;
    min-height: auto;
    width: 100%
}

.chatBody {
    margin-left: 0;
    margin-right: 0;
    width: 100%
}

.thread-input {
    padding: 0 !important
}

.group {
    display: block;
    padding-left: 0 !important;
    padding-right: 0 !important
}

.avatar {
    align-self: flex-start;
    height: 20px;
    padding-bottom: 0;
    padding-top: 0;
    width: 20px
}

.container--pearlChat {
    flex-direction: row;
    padding-left: 0;
    padding-right: 0
}

.container--pearlChat>.avatar {
    margin-top: 0
}

.container--pearlChat>.avatar>.avatar {
    margin-top: 25px
}

.container--pearlChat>.avatar>.avatar .image {
    background: none
}

.container--pearlChat>.body {
    display: flex !important;
    margin-left: 16px
}

.container--pearlChat>.body .bubble {
    border-radius: 6px;
    font-size: 16px;
    line-height: 20px;
    padding: 8px 12px
}

.container--pearlChat>.body .bubble ul {
    white-space: normal
}

.container--pearlChat>.body .bubble.bubble-blue {
    background: hsla(0, 0%, 80%, .2);
    border: 1px solid #ccc;
    color: #333
}

.container--pearlChat>.body .bubble.bubble-gray {
    background-color: transparent;
    color: #333
}

.container--pearlChat>.body .bubble.bubble-gray:has(.typing-indicator) {
    background: rgba(82, 186, 213, .25) !important;
    border-color: #a8dcea !important
}

.container--pearlChat>.body .bubble.bubble-gray:has(.typing-indicator):after {
    border-color: #cde7ed transparent transparent;
    border-style: solid;
    border-width: 8px 8px 16px;
    content: "";
    display: block;
    left: 36px;
    position: absolute;
    top: 25px;
    transform: translate(15.5556%, -15.5556%) rotate(90deg) translateY(50%)
}

.container--pearlChat>.body .bubble.bubble-gray .typing-indicator {
    background: transparent
}

.container--pearlChat .image {
    border-radius: 0
}

.input__container {
    border: 1px solid #cbd6e1;
    border-radius: 6px;
    box-shadow: none;
    height: 64px;
    margin-left: 0;
    padding: 10px 15px 10px 10px;
    position: relative;
    width: -webkit-fill-available;
    width: -moz-available
}

.input__container:hover {
    border: 1px solid #cbd6e1;
    box-shadow: none
}

.input__container--disabled {
    background: #fff;
    opacity: 1
}

.input__container--shaking {
    animation: none
}

.input__container--shaking .input__container {
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: shaking;
    animation-name: shaking
}

.input__container textarea:hover {
    cursor: text
}

.input__container textarea:disabled {
    background: #fff
}

.input__field {
    color: #333;
    display: flex;
    font-family: Helvetica;
    font-size: 14px;
    line-height: 18px;
    min-height: 40px !important;
    outline: none
}

.input__field::placeholder {
    color: #666;
    font-size: 15px !important
}

.input__field:focus::placeholder {
    color: #666;
    opacity: 1
}

.thread-top {
    background-color: transparent !important
}

.thread-content {
    background-color: transparent
}

.threadBodyContainer {
    height: auto;
    width: 100%
}

.details {
    justify-content: flex-start;
    margin-bottom: 0
}

.details .post__meta {
    color: #6b778c;
    line-height: normal;
    padding: 0 0 4px
}

.details .post__meta__author {
    padding-right: 0
}

div[data-attr=expert-message]:first-of-type {
    padding-top: 16px
}

div[data-attr=expert-message].container {
    justify-content: flex-start
}

div[data-attr=customer-message] {
    margin-bottom: 8px;
    margin-top: 4px;
    width: auto
}

div[data-attr=customer-message] .details {
    justify-content: flex-end
}

div[data-attr=customer-message]>div {
    max-width: calc(100% - 48px)
}

div[data-attr=customer-message] .bubble.bubble-blue {
    background: hsla(0, 0%, 80%, .2);
    border: 1px solid #ccc;
    border-radius: 3px;
    color: #333;
    line-height: 20px;
    min-width: auto;
    padding: 8px 12px
}

div[data-attr=customer-message] .post__meta {
    align-items: flex-end;
    padding: 0
}

div[data-attr=customer-message] .post__meta__author {
    margin: 0;
    padding-right: 0
}

.maximized.heroContainer {
    height: auto
}

@media (max-width:767px),
only screen and (min-device-width:375px) and (-webkit-min-device-pixel-ratio:3) and (orientation:landscape) {
    .showModal {
        transform: scale(1)
    }

    .maximized.heroContainer {
        padding: 0 !important
    }

    .maximized .modalContent {
        height: 100%
    }

    .maximized .chatContainer {
        bottom: 0 !important;
        display: block !important
    }

    .maximized .conversation-adjuster {
        margin-top: auto !important
    }

    .maximized.defaultTextBox {
        height: 100%
    }

    .maximized .thread-content>.container {
        flex-direction: column-reverse
    }
}

@media (max-width:767px) and (orientation:portrait) {
    .maximized.heroContainer {
        padding: 0 !important
    }

    .maximized .chatContainer {
        bottom: 0 !important;
        display: block !important;
        height: calc(var(--vh, 1vh)) !important
    }

    .maximized .conversation-adjuster {
        margin-top: auto !important
    }

    .maximized.defaultTextBox {
        height: 100%
    }
}

.hidden {
    display: none
}

@media (max-width:767px) {
    .thread-bottom {
        background-color: #fff;
        bottom: 0;
        position: sticky;
        width: 100%;
        z-index: 100
    }

    .thread-input .container {
        background: #fff;
        padding-left: 16px;
        padding-right: 16px;
        padding-top: 0
    }

    .thread-input .container.maximized {
        align-items: stretch;
        flex: 1;
        flex-direction: column;
        justify-content: flex-start;
        margin-bottom: 0;
        padding-bottom: 24px;
        width: 100%
    }

    .thread-input .container.maximized .input__container {
        padding: 5px 8px !important
    }

    .thread-input .container .validation-tooltip {
        padding: 8px !important
    }

    .thread-input .container .validation-tooltip span {
        font-size: 12px;
        font-weight: 400
    }

    .thread-input .container .validation-tooltip:after {
        bottom: -5px;
        height: 10px;
        width: 10px
    }

    .thread-input .container__submit .experts-online__wrapper {
        display: flex;
        font-size: 12px;
        justify-content: center;
        margin-top: 9px
    }

    .input__container {
        border: 1px solid #19334a;
        border-radius: 4px;
        box-shadow: 0 .5px 6px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .2);
        height: auto !important
    }

    .input__container:hover {
        border: 1px solid #19334a;
        box-shadow: 0 .5px 6px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .2);
        height: auto !important
    }

    .input__field {
        color: #333;
        display: flex;
        font-family: Helvetica;
        font-size: 14px;
        height: auto !important;
        line-height: 18px;
        min-height: 20px !important;
        outline: none
    }

    .input__field::placeholder {
        color: #666;
        font-size: 15px !important
    }

    .input__field:focus::placeholder {
        color: #666;
        opacity: 1
    }

    .threadBodyContainer {
        display: flex;
        flex: 1;
        flex-direction: column;
        height: auto
    }

    .threadBodyContainer.maximized {
        justify-content: flex-end
    }

    .container--pearlChat {
        flex-direction: row;
        padding-left: 0;
        padding-right: 0
    }

    .container--pearlChat>.body {
        display: flex !important;
        margin-left: 16px
    }

    .container--pearlChat>.body .bubble {
        border-radius: 6px;
        font-size: 16px;
        line-height: 20px;
        padding: 8px 12px
    }

    .container--pearlChat>.body .bubble ul {
        margin: 8px 0;
        padding-left: 20px;
        white-space: normal
    }
}

.container {
    background-color: #fff;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 0;
    overflow-y: auto
}

.container:has(aside) {
    display: flex;
    flex-direction: column
}

.container--browserExtension {
    flex-basis: auto;
    max-height: 272px;
    min-height: 120px;
    overflow: overlay
}

.container--desktopRedesign {
    scrollbar-color: #d3d3d3 transparent;
    scrollbar-width: thin
}

.no-scrollbars-container {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.no-scrollbars-container::-webkit-scrollbar {
    display: none
}

.disclaimer-container {
    align-items: center;
    display: flex;
    gap: 8px;
    margin: 0;
    padding-top: 8px
}

.disclaimer-container span {
    color: #666;
    flex-shrink: 1;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: .05px;
    line-height: 16px;
    min-width: 0;
    text-align: center
}

.disclaimer-container:after,
.disclaimer-container:before {
    align-self: baseline;
    background-color: #ccc;
    content: "";
    flex: 1 1 20px;
    height: 1px;
    margin-top: 9px;
    min-width: 20px
}

@media (max-width:767px) {
    .disclaimer-container {
        gap: 4px;
        padding-left: 16px;
        padding-right: 16px
    }

    .disclaimer-container span {
        font-size: 11px
    }
}

.urgencyCard {
    align-items: flex-start;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    font-family: Helvetica, sans-serif;
    margin-bottom: 16px;
    margin-left: 48px;
    padding: 16px
}

.urgencyCard .urgencyHeader {
    color: var(--Color-New-Gray-80, #536167);
    font-family: Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    height: 16px;
    letter-spacing: .05px;
    line-height: 16px
}

.urgencyCard .urgencyTitle {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .15px;
    line-height: 20px;
    padding-bottom: 8px;
    padding-top: 4px
}

.urgencyCard .urgencyTitle .urgencyIndicator {
    border-radius: 9999px;
    display: inline-block;
    height: 12px;
    width: 12px
}

.urgencyCard .urgencyTitle .urgencyText {
    margin-left: 8px
}

.urgencyCard .urgencyAdvice,
.urgencyCard .urgencyDescription {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 4px 0
}

.urgencyCard .urgencyDescription {
    color: var(--Color-New-Gray-80, #536167)
}

.urgencyCard .urgencyAdvice {
    color: var(--Color-New-Gray-90, #2e3538)
}

.urgencyCard .urgencyButton {
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    font-weight: 700;
    margin-top: 12px;
    padding: 10px 16px
}

.urgency-low {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0
}

.urgency-low .urgencyIndicator {
    background: var(--color-bg-strong-success, #00bf8f)
}

.urgency-low .urgencyText {
    color: var(--Color-New-Green-70, #007a5c)
}

.urgency-low .urgencyButton {
    background-color: var(--Secondary-Colors-Green-50, #00bf8f);
    border: 1px solid var(--Secondary-Colors-Green-50, #00bf8f)
}

.urgency-low .urgencyButton.disabled {
    background-color: #7ad0b5;
    border: 1px solid #7ad0b5;
    cursor: default
}

.urgency-medium {
    background-color: #fff3e5;
    border: 1px solid #ffddb8
}

.urgency-medium .urgencyIndicator {
    background: var(--Yellow-Yellow-70, #f98406)
}

.urgency-medium .urgencyText {
    color: var(--Yellow-Yellow-90, #9f5404)
}

.urgency-medium .urgencyButton {
    background: var(--Yellow-Yellow-70, #f98406);
    border: 1px solid #f98406
}

.urgency-medium .urgencyButton.disabled {
    background-color: #ffb15d;
    border: 1px solid #ffb15d;
    cursor: default
}

.urgency-high {
    background-color: #fef2f2;
    border: 1px solid #fcbdb1
}

.urgency-high .urgencyIndicator {
    background-color: var(--Orange-Orange-50, #e85c41)
}

.urgency-high .urgencyText {
    color: var(--Orange-Orange-80, #9d230b)
}

.urgency-high .urgencyButton {
    background-color: var(--Orange-Orange-50, #e85c41);
    border: 1px solid #e85c41
}

.urgency-high .urgencyButton.disabled {
    background-color: #f79e8d;
    border: 1px solid #f79e8d;
    cursor: default
}

.submit-button {
    -webkit-appearance: none;
    background: none;
    background: #e85c41;
    border: 0;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    line-height: 24px;
    outline: none;
    padding: 12px 24px;
    text-decoration: none;
    transition: background-color .1s ease-in-out, color .1s ease-in-out, box-shadow .1s ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.submit-button:hover {
    background: #d5391a
}

.submit-button:focus {
    background: #9d230b
}

.submit-button--disabled {
    opacity: .5;
    pointer-events: none
}

.submit-button-container {
    padding-left: 24px
}

.submit-mobile-button {
    background-color: transparent;
    border: none;
    height: 40px;
    margin-left: 16px;
    margin-right: 8px;
    width: 40px
}

.submit-mobile-button-container {
    align-self: center
}

.submit-desktop-button-container {
    padding-left: 12px
}

.verifiedExpertItem {
    display: flex;
    flex-basis: 30%;
    flex-direction: column;
    margin-bottom: 64px;
    margin-left: 8px;
    margin-right: 8px
}

.verifiedExpertItemimg {
    height: 184px;
    width: 184px
}

.verifiedExpertItemstarImg {
    margin-top: 4px
}

.verifiedExpertItemName {
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    margin-top: 16px
}

.verifiedExpertItemTitle {
    font-size: 16px;
    margin-top: 4px
}

.verifiedExpertItemDescription {
    font-size: 16px;
    line-height: 24px;
    margin-top: 16px
}

@media (max-width:767px) {
    .verifiedExpertItem {
        align-items: center;
        flex-basis: 100%;
        margin-bottom: 24px
    }

    .verifiedExpertItemimg {
        height: 132px;
        width: 132px
    }

    .verifiedExpertItemName {
        font-size: 16px
    }

    .verifiedExpertItemTitle {
        font-size: 14px
    }

    .verifiedExpertItemDescription {
        font-size: 14px;
        text-align: center
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .verifiedExpertItem {
        align-items: center;
        flex-basis: 30%;
        margin-bottom: 24px
    }

    .verifiedExpertItemimg {
        height: 132px;
        width: 132px
    }

    .verifiedExpertItemName {
        font-size: 16px
    }

    .verifiedExpertItemTitle {
        font-size: 14px
    }

    .verifiedExpertItemDescription {
        font-size: 16px;
        line-height: 24px;
        text-align: center
    }
}

.verifiedExpertContainer {
    margin-top: 56px
}

@media (min-width:1920px) {
    .verifiedExpertContainer {
        width: 100%
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .verifiedExpertContainer {
        width: 100%
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .verifiedExpertContainer {
        width: 100%
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .verifiedExpertContainer {
        width: 100%
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .verifiedExpertContainer {
        width: 100%
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .verifiedExpertContainer {
        width: 100%
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .verifiedExpertContainer {
        width: 100%
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .verifiedExpertContainer {
        width: 100%
    }
}

@media (max-width:1024px) {
    .verifiedExpertContainer {
        max-width: 100%
    }
}

.verifiedExpert {
    display: flex;
    flex-direction: column
}

@media (min-width:1920px) {
    .verifiedExpert {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .verifiedExpert {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .verifiedExpert {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .verifiedExpert {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .verifiedExpert {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .verifiedExpert {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .verifiedExpert {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .verifiedExpert {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .verifiedExpert {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .verifiedExpert {
        margin-left: 16px;
        margin-right: 16px
    }
}

.verifiedExpertTitle {
    font-size: 40px;
    font-weight: 700;
    line-height: 48px;
    margin-bottom: 32px;
    text-align: left
}

.verifiedExpertsubTitle {
    font-size: 20px;
    line-height: 32px;
    margin-bottom: 40px;
    text-align: left
}

.verifiedExpertItems {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

@media (max-width:480px) {
    .verifiedExpertContainer {
        margin-top: 40px
    }

    .verifiedExpertItems {
        flex-direction: column
    }

    .verifiedExpert {
        align-items: center
    }

    .verifiedExpertTitle {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 8px;
        text-align: center;
        width: auto
    }

    .verifiedExpertsubTitle {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 32px;
        text-align: center;
        width: auto
    }
}

@media (min-width:481px) and (max-width:767px) {
    .verifiedExpertContainer {
        margin-top: 40px
    }

    .verifiedExpertItems {
        flex-direction: column
    }

    .verifiedExpert {
        align-items: center
    }

    .verifiedExpertTitle {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 12px;
        text-align: center;
        width: auto
    }

    .verifiedExpertsubTitle {
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        width: auto
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .verifiedExpertContainer {
        margin-top: 40px
    }

    .verifiedExpertItems {
        flex-direction: column
    }

    .verifiedExpert {
        align-items: center
    }

    .verifiedExpertTitle {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 8px;
        text-align: center;
        width: auto
    }

    .verifiedExpertsubTitle {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 32px;
        text-align: center;
        width: auto
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
    .verifiedExpertContainer {
        margin-top: 40px
    }

    .verifiedExpertItems {
        flex-direction: row;
        justify-content: space-between
    }

    .verifiedExpert {
        align-items: center
    }

    .verifiedExpertTitle {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 8px;
        text-align: center;
        width: auto
    }

    .verifiedExpertsubTitle {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 32px;
        text-align: center;
        width: auto
    }
}

.whatUGetContainer {
    margin-top: 56px
}

@media (min-width:1920px) {
    .whatUGetContainer {
        width: 100%
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .whatUGetContainer {
        width: 100%
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .whatUGetContainer {
        width: 100%
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .whatUGetContainer {
        width: 100%
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .whatUGetContainer {
        width: 100%
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .whatUGetContainer {
        width: 100%
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .whatUGetContainer {
        width: 100%
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .whatUGetContainer {
        width: 100%
    }
}

@media (max-width:1024px) {
    .whatUGetContainer {
        max-width: 100%
    }
}

.whatUGet {
    display: flex;
    flex-direction: column
}

@media (min-width:1920px) {
    .whatUGet {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .whatUGet {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .whatUGet {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .whatUGet {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .whatUGet {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .whatUGet {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .whatUGet {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .whatUGet {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .whatUGet {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .whatUGet {
        margin-left: 16px;
        margin-right: 16px
    }
}

.whatUGettitle {
    font-size: 40px;
    font-weight: 700;
    line-height: 48px;
    margin-bottom: 48px
}

.itmes {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 24px
}

@media (max-width:1024px) {
    .whatUGetContainer {
        margin-top: 40px
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .whatUGet {
        text-align: center
    }

    .whatUGettitle {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 32px
    }

    .itmes {
        flex-direction: column
    }
}

@media (max-width:767px) {
    .whatUGet {
        text-align: center
    }

    .whatUGettitle {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 32px
    }

    .itmes {
        flex-direction: column
    }
}

@media (max-width:480px) {
    .itmes {
        flex-direction: column;
        padding-bottom: 8px
    }
}

.whatUGetItem {
    display: flex;
    flex-basis: 45%;
    flex-direction: column;
    margin-bottom: 40px
}

.whatUGetItemimg {
    border: 10px solid #f5f5f5;
    border-radius: 50%;
    box-sizing: border-box;
    display: block;
    height: 248px;
    margin-bottom: 32px;
    width: 248px
}

.whatUGetItemtext {
    display: flex;
    flex-direction: column
}

.whatUGetItemheadline {
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 16px
}

.whatUGetItemdesc {
    font-size: 16px;
    line-height: 24px
}

@media (min-width:768px) and (max-width:1024px) {
    .whatUGetItem {
        align-items: end;
        flex-basis: auto;
        flex-direction: row;
        margin-bottom: 32px
    }

    .whatUGetItemimg {
        height: 160px;
        margin-bottom: 0;
        margin-right: 24px;
        width: 160px
    }

    .whatUGetItemtext {
        margin-top: 20px;
        text-align: left
    }

    .whatUGetItemheadline {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 8px
    }

    .whatUGetItemdesc {
        font-size: 16px;
        line-height: 24px
    }
}

@media (min-width:481px) and (max-width:767px) {
    .whatUGetItem {
        align-items: center;
        flex-basis: auto;
        margin-bottom: 32px;
        text-align: center
    }

    .whatUGetItemimg {
        height: 132px;
        margin-bottom: 16px;
        width: 132px
    }

    .whatUGetItemheadline {
        font-size: 16px;
        line-height: 20px;
        margin-bottom: 8px
    }

    .whatUGetItemdesc {
        font-size: 14px;
        line-height: 20px
    }
}

@media (max-width:480px) {
    .whatUGetItem {
        align-items: center;
        flex-basis: auto;
        margin-bottom: 32px;
        text-align: center
    }

    .whatUGetItemimg {
        height: 132px;
        margin-bottom: 16px;
        width: 132px
    }

    .whatUGetItemheadline {
        font-size: 16px;
        line-height: 20px;
        margin-bottom: 8px
    }

    .whatUGetItemdesc {
        font-size: 14px;
        line-height: 20px
    }
}

.th-ccpa-banner {
    background: rgba(0, 0, 0, .9);
    padding: 14px;
    position: relative
}

.th-ccpa-banner.hidden {
    display: none
}

.th-ccpa-banner .ccpa-text {
    color: #fff;
    font-family: Helvetica, Arial, Lucida Grande, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .07px;
    line-height: 20px;
    text-align: center
}

.th-ccpa-banner .ccpa-text a {
    color: #fff;
    text-decoration: underline
}

.th-ccpa-banner .ccpa-text a:hover {
    color: #ebebeb;
    text-decoration: none
}

.th-ccpa-banner .ccpa-text a:active {
    color: #fff;
    text-decoration: none
}

.th-ccpa-banner .ccpa-close-button {
    cursor: pointer;
    height: 40px;
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px
}

.th-ccpa-banner .ccpa-close-button svg {
    height: 12px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 12px
}

.th-ccpa-banner {
    box-sizing: border-box;
    height: 48px;
    left: 0;
    padding: 16px 35px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10000
}

.th-ccpa-banner .ccpa-text {
    margin-block: 0
}

@media (min-width:768px) and (max-width:979px) {
    .th-ccpa-banner {
        padding: 16px
    }

    .th-ccpa-banner .ccpa-text {
        margin: 0 auto
    }

    .th-ccpa-banner .ccpa-close-button {
        height: 30px;
        right: 0;
        width: 30px
    }
}

@media (max-width:768px) and (min-width:480px) and (orientation:landscape) {
    .th-ccpa-banner {
        height: 32px
    }
}

@media (max-width:767px) {
    .th-ccpa-banner {
        padding: 8px 16px;
        width: 100%
    }

    .th-ccpa-banner .ccpa-text {
        font-size: 11px;
        letter-spacing: 0;
        line-height: 16px;
        padding: 0 16px;
        text-align: center
    }

    .th-ccpa-banner .ccpa-close-button {
        height: 25px;
        right: 2px;
        top: 50%;
        transform: translateY(-50%);
        width: 25px
    }
}

@media (max-width:420px) {
    .th-ccpa-banner {
        height: 50px
    }
}

@media (width:320px) and (height:568px) {
    .th-ccpa-banner .ccpa-text {
        font-size: 10px
    }
}

@media (width:568px) and (height:320px) and (orientation:landscape) {
    .th-ccpa-banner .ccpa-text {
        font-size: 10px
    }
}

.top-auto-height .th-ccpa-banner {
    bottom: auto !important;
    height: auto
}

.trusted-form-iframe {
    bottom: 0;
    display: block;
    height: 100vh;
    left: 0;
    opacity: 0;
    position: fixed;
    width: 100vw;
    z-index: -100
}

.tcpa-banner-container {
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999
}

.tcpa-banner {
    background: rgba(0, 0, 0, .9);
    box-sizing: border-box;
    color: #fff;
    display: flex;
    font-family: Helvetica, Arial, Lucida Grande, sans-serif;
    font-size: 11px;
    gap: 14px;
    justify-content: space-between;
    letter-spacing: .05px;
    line-height: 16px;
    min-height: 48px;
    padding: 10px 14px 10px 16px;
    text-align: center;
    width: 100%
}

.tcpa-banner.hidden {
    display: none
}

.tcpa-banner a {
    color: #fff;
    text-decoration: underline
}

.tcpa-banner a:hover {
    color: #ebebeb;
    text-decoration: none
}

.tcpa-banner a:active {
    color: #fff;
    text-decoration: none
}

.tcpa-banner .text {
    flex: 1
}

.tcpa-banner .close-button-wrapper {
    display: flex
}

.tcpa-banner .close-button-wrapper .close-button {
    font-size: 17px;
    height: auto;
    position: relative;
    top: 1px;
    width: 12px
}

.close-button {
    font-size: 16px;
    height: 40px;
    justify-content: center;
    width: 40px
}

.close-button,
.custom-checkbox-container {
    align-items: center;
    cursor: pointer;
    display: flex
}

.custom-checkbox-container {
    opacity: 1
}

.custom-checkbox-container.disabled {
    cursor: not-allowed;
    opacity: .5
}

.custom-checkbox-container .custom-checkbox {
    align-items: center;
    background-color: #fff;
    border-radius: 2px;
    display: flex;
    height: 12px;
    justify-content: center;
    margin-right: 8px;
    transition: background-color .3s ease;
    width: 12px;
    stroke: #fff
}

.custom-checkbox-container .custom-checkbox.checked {
    background-color: #52bad5
}

.custom-checkbox-container .custom-checkbox.checked:hover {
    background-color: #30a6c5
}

.custom-checkbox-container .custom-checkbox.checked:active {
    background-color: #1c758d
}

.custom-checkbox-container .custom-checkbox.bordersOnly {
    background-color: #333;
    border: 1px solid #fff
}

.custom-checkbox-container .custom-checkbox.bordersOnly.checked {
    background-color: #333
}

.custom-checkbox-container .custom-checkbox.bordersOnly.checked:hover {
    background-color: #30a6c5
}

.custom-checkbox-container .custom-checkbox.bordersOnly.checked:active {
    background-color: #1c758d
}

.custom-checkbox-container .label {
    align-self: baseline
}

.checkbox-leadgen {
    display: inline-flex;
    margin-left: 12px
}

.checkbox-leadgen:first-of-type {
    margin-left: 8px
}

.leadgen-consent {
    width: 100%
}

.linksLibraryContainer {
    padding-bottom: 56px;
    padding-top: 56px
}

.linksLibraryColorContainer {
    margin: 0
}

.linksLibrary {
    display: flex;
    flex-direction: column
}

.linksLibrarytitle {
    font-size: 24px;
    font-weight: 700;
    line-height: 28px;
    margin-bottom: 32px
}

.linksLibraryitemBox {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    width: fit-content
}

.linksLibraryitemBox a {
    text-decoration: none
}

.linksLibraryitemBox a:hover {
    text-decoration: underline
}

.linksLibraryMobileBox {
    display: flex;
    flex-direction: row;
    gap: 30px;
    justify-content: center;
    margin: 0 auto;
    max-width: 600px;
    width: 100%
}

.linksLibraryMobileColumn {
    display: flex;
    flex: 1;
    flex-direction: column;
    max-width: 280px;
    min-width: 0
}

@media (min-width:768px) and (max-width:1024px) {
    .linksLibraryContainer {
        padding-bottom: 40px;
        padding-top: 40px
    }

    .linksLibrary {
        display: flex;
        flex-direction: column
    }

    .linksLibrarytitle {
        font-size: 24px;
        line-height: 28px;
        margin-bottom: 32px;
        text-align: center
    }

    .linksLibraryitemBox {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        width: auto
    }
}

@media (min-width:481px) and (max-width:767px) {
    .linksLibraryContainer {
        padding-bottom: 32px;
        padding-top: 40px
    }

    .linksLibrary {
        text-align: center
    }

    .linksLibrarytitle {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 24px
    }

    .linksLibraryMobileBox {
        gap: 30px;
        max-width: 500px;
        padding: 0 20px
    }

    .linksLibraryMobileColumn {
        max-width: 220px
    }
}

@media (max-width:480px) {
    .linksLibraryContainer {
        padding-bottom: 32px;
        padding-top: 40px
    }

    .linksLibrary {
        text-align: center
    }

    .linksLibrarytitle {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 24px;
        text-align: left
    }

    .linksLibraryMobileBox {
        gap: 20px;
        max-width: 400px;
        padding: 0 15px
    }

    .linksLibraryMobileColumn {
        max-width: 180px
    }
}

.linksLibraryItem {
    display: flex;
    flex-direction: column;
    margin-bottom: 8px;
    margin-right: 30px
}

.linksLibraryItemtext {
    display: flex;
    flex-direction: column;
    font-size: 16px;
    font-weight: 700;
    height: 20px;
    line-height: 20px;
    min-width: 155px
}

.linksLibraryItemtexta {
    color: #666;
    cursor: pointer
}

.linksLibraryItemtexta:hover {
    color: #00a507
}

.linksLibraryItemtexta:active {
    color: #008206
}

@media (min-width:768px) {
    .linksLibraryItemtextspan {
        display: none
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .linksLibraryItem {
        align-items: center;
        display: flex;
        flex-direction: column;
        margin-right: 0
    }

    .linksLibraryItemtext {
        text-align: left
    }
}

@media (min-width:481px) and (max-width:767px) {
    .linksLibraryItem {
        break-inside: avoid;
        display: flex;
        flex-direction: column;
        margin-bottom: 8px;
        margin-right: 0;
        padding-left: 0;
        text-align: left
    }

    .linksLibraryItemtext {
        height: auto;
        max-width: none;
        min-width: auto;
        text-align: left
    }

    .linksLibraryItemtexta {
        display: inline;
        hyphens: auto;
        line-height: 1.3;
        text-align: left;
        text-decoration: none;
        word-break: break-word;
        word-spacing: .2em
    }

    .linksLibraryItemtextspan {
        font-size: 12px;
        margin-left: 3px
    }

    .linksLibraryItemtextspanimg {
        height: 10px;
        width: 10px
    }
}

@media (max-width:480px) {
    .linksLibraryItem {
        align-items: flex-start;
        break-inside: avoid;
        display: flex;
        flex-direction: column;
        margin-bottom: 8px;
        margin-right: 0;
        text-align: left
    }

    .linksLibraryItemtext {
        height: auto;
        line-height: 18px;
        max-width: none;
        min-width: auto;
        padding: 4px 0;
        text-align: left
    }

    .linksLibraryItemtexta {
        display: inline;
        hyphens: auto;
        line-height: 1.2;
        text-align: left;
        text-decoration: none;
        word-break: break-word;
        word-spacing: .1em
    }

    .linksLibraryItemtextspan {
        font-size: 12px;
        margin-left: 3px
    }

    .linksLibraryItemtextspanimg {
        height: 10px;
        width: 10px
    }
}

@media (max-width:767px) {
    .linksLibraryItemtext {
        display: block
    }

    .linksLibraryItemnowrap {
        display: inline;
        white-space: nowrap
    }

    .lastWordWithIcon {
        background: var(--next-icon-url) no-repeat right center;
        background-size: 10px 10px;
        display: inline-block;
        padding-right: 14px
    }
}

.seeAllLegalQuestions {
    color: #2b2d42
}

.seeAllLegalQuestionsMain {
    background: #f5f5f5;
    height: 310px;
    margin-top: 60px
}

.seeAllLegalQuestionsPadding {
    padding-left: 0
}

.seeAllLegalQuestionsTextImageContainer {
    display: flex;
    flex-direction: row
}

@media (min-width:1920px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .seeAllLegalQuestionsTextImageContainer {
        margin-left: 16px;
        margin-right: 16px
    }
}

.seeAllLegalQuestionsContainer {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.seeAllLegalQuestionsTextContainer {
    float: left
}

@media (min-width:1920px) {
    .seeAllLegalQuestionsTextContainer {
        width: calc(100% - 811px)
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .seeAllLegalQuestionsTextContainer {
        width: calc(100% - 677px)
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .seeAllLegalQuestionsTextContainer {
        width: calc(100% - 560px)
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .seeAllLegalQuestionsTextContainer {
        width: calc(100% - 520px)
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .seeAllLegalQuestionsTextContainer {
        width: calc(100% - 475px)
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .seeAllLegalQuestionsTextContainer {
        width: calc(100% - 457px)
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .seeAllLegalQuestionsTextContainer {
        width: calc(100% - 439px)
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .seeAllLegalQuestionsTextContainer {
        width: calc(100% - 424px)
    }
}

@media (max-width:1024px) {
    .seeAllLegalQuestionsTextContainer {
        max-width: 100%
    }
}

.seeAllLegalQuestionsHeader {
    color: #333;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    height: auto;
    letter-spacing: -.25px;
    line-height: 48px;
    width: 420px
}

.seeAllLegalQuestionsSubtext {
    color: #333;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .15px;
    line-height: 32px;
    max-width: 415px
}

.seeAllLegalQuestionsAnchor {
    color: #000;
    text-decoration: none
}

.seeAllLegalQuestionsAnchor:hover {
    color: #000;
    text-decoration: none
}

.seeAllLegalQuestionsText {
    background: #2aa6f8;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    font-size: 20px;
    letter-spacing: .15px;
    line-height: 20px;
    margin-top: 10px;
    padding: 16px 0;
    text-align: center;
    width: 341px
}

.seeAllLegalQuestionsImage {
    height: 290px;
    margin-left: -10px;
    padding-top: 20px;
    width: auto
}

@media (min-width:1920px) {
    .layoutWidth {
        width: calc(100% - 811px)
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .layoutWidth {
        width: calc(100% - 677px)
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .layoutWidth {
        width: calc(100% - 560px)
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .layoutWidth {
        width: calc(100% - 520px)
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .layoutWidth {
        width: calc(100% - 475px)
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .layoutWidth {
        width: calc(100% - 457px)
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .layoutWidth {
        width: calc(100% - 439px)
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .layoutWidth {
        width: calc(100% - 424px)
    }
}

@media (max-width:1024px) {
    .layoutWidth {
        max-width: 100%
    }
}

@media (min-width:1920px) {
    .layoutMargin {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .layoutMargin {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .layoutMargin {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .layoutMargin {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .layoutMargin {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .layoutMargin {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .layoutMargin {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .layoutMargin {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .layoutMargin {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .layoutMargin {
        margin-left: 16px;
        margin-right: 16px
    }
}

@media (min-width:1920px) {
    .layoutMarginRight {
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .layoutMarginRight {
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .layoutMarginRight {
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .layoutMarginRight {
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .layoutMarginRight {
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .layoutMarginRight {
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .layoutMarginRight {
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .layoutMarginRight {
        margin-right: 16px
    }
}

@media (min-width:1920px) {
    .layoutPaddingTop {
        padding-top: 48px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .layoutPaddingTop {
        padding-top: 48px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .layoutPaddingTop {
        padding-top: 48px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .layoutPaddingTop {
        padding-top: 48px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .layoutPaddingTop {
        margin-top: 48px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .layoutPaddingTop {
        padding-top: 48px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .layoutPaddingTop {
        padding-top: 48px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .layoutPaddingTop {
        padding-top: 48px
    }
}

@media (max-width:1024px) {
    .layoutPaddingTop {
        padding-top: 48px
    }
}

@media (max-width:767px) {
    .layoutPaddingTop {
        padding-top: 16px
    }
}

.linksLibraryContainer {
    padding-bottom: 0 !important
}

@media (min-width:1920px) {
    .linksLibraryContainer {
        width: calc(100% - 811px)
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .linksLibraryContainer {
        width: calc(100% - 677px)
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .linksLibraryContainer {
        width: calc(100% - 560px)
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .linksLibraryContainer {
        width: calc(100% - 520px)
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .linksLibraryContainer {
        width: calc(100% - 475px)
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .linksLibraryContainer {
        width: calc(100% - 457px)
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .linksLibraryContainer {
        width: calc(100% - 439px)
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .linksLibraryContainer {
        width: calc(100% - 424px)
    }
}

@media (max-width:1024px) {
    .linksLibraryContainer {
        max-width: 100%
    }
}

@media (min-width:1920px) {
    .linksLibrary {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .linksLibrary {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .linksLibrary {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .linksLibrary {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .linksLibrary {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .linksLibrary {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .linksLibrary {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .linksLibrary {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .linksLibrary {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .linksLibrary {
        margin-left: 16px;
        margin-right: 16px
    }
}

@media (min-width:1920px) {
    .legalQuestionsContainer {
        width: calc(100% - 811px)
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .legalQuestionsContainer {
        width: calc(100% - 677px)
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .legalQuestionsContainer {
        width: calc(100% - 560px)
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .legalQuestionsContainer {
        width: calc(100% - 520px)
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .legalQuestionsContainer {
        width: calc(100% - 475px)
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .legalQuestionsContainer {
        width: calc(100% - 457px)
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .legalQuestionsContainer {
        width: calc(100% - 439px)
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .legalQuestionsContainer {
        width: calc(100% - 424px)
    }
}

@media (max-width:1024px) {
    .legalQuestionsContainer {
        max-width: 100%
    }
}

@media (min-width:1920px) {
    .legalQuestions {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .legalQuestions {
        margin-left: 125px;
        margin-right: 40px
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .legalQuestions {
        margin-left: 100px;
        margin-right: 40px
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .legalQuestions {
        margin-left: 80px;
        margin-right: 35px
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .legalQuestions {
        margin-left: 40px;
        margin-right: 30px
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .legalQuestions {
        margin-left: 30px;
        margin-right: 25px
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .legalQuestions {
        margin-left: 25px;
        margin-right: 20px
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .legalQuestions {
        margin-left: 20px;
        margin-right: 16px
    }
}

@media (max-width:1024px) {
    .legalQuestions {
        margin-left: 24px;
        margin-right: 24px
    }
}

@media (max-width:767px) {
    .legalQuestions {
        margin-left: 16px;
        margin-right: 16px
    }
}

.App {
    font-family: sans-serif;
    text-align: center
}

.legalQuestionsColorContainer {
    background: #fff
}

.legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions {
    display: flex;
    flex-direction: column
}

.legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer {
    background: #eaeefb;
    margin-top: 36px
}

.legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer {
    display: flex;
    padding: 32px
}

.legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer .dropDownContainer {
    margin-right: 8px;
    width: 80%
}

.legalQuestionsColorContainer .qnaBox {
    display: flex;
    flex-direction: column
}

.legalQuestionsColorContainer .qnaBoxTitle {
    color: #2b2d42;
    font-size: 40px;
    font-weight: 700;
    line-height: 48px;
    margin-top: 56px
}

.legalQuestionsColorContainer .qnaBoxResultTitle {
    color: #6b6c7b;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    margin-top: 24px
}

@media (max-width:767px) {
    .legalQuestionsColorContainer .qnaBoxResultTitle {
        font-size: 14px;
        line-height: 20px
    }
}

@media (min-width:768px) and (max-width:1023px) and (orientation:portrait) {
    .legalQuestionsColorContainer .qnaBoxResultTitle {
        font-size: 14px;
        line-height: 20px
    }
}

@media (min-width:768px) and (max-width:1023px) and (orientation:landscape) {
    .legalQuestionsColorContainer .qnaBoxResultTitle {
        font-size: 16px;
        line-height: 24px
    }
}

.legalQuestionsColorContainer .homeLegalQuestionsContainer {
    background: #f5f5f5;
    margin-right: 32px;
    margin-top: 10px
}

@media (min-width:1920px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        width: calc(100% - 811px)
    }
}

@media (max-width:1919px) and (min-width:1600px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        width: calc(100% - 677px)
    }
}

@media (max-width:1599px) and (min-width:1367px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        width: calc(100% - 560px)
    }
}

@media (max-width:1366px) and (min-width:1201px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        width: calc(100% - 520px)
    }
}

@media (max-width:1200px) and (min-width:1151px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        width: calc(100% - 475px)
    }
}

@media (max-width:1150px) and (min-width:1101px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        width: calc(100% - 457px)
    }
}

@media (max-width:1100px) and (min-width:1051px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        width: calc(100% - 439px)
    }
}

@media (max-width:1050px) and (min-width:1025px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        width: calc(100% - 424px)
    }
}

@media (max-width:1024px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainer {
        max-width: 100%
    }
}

.legalQuestionsColorContainer .homeLegalQuestionsContainerbtnContainer {
    display: inline-block;
    margin-left: 8px
}

.legalQuestionsColorContainer .homeLegalQuestionsContainerchatButton {
    background-color: #999;
    border: 1px solid #999;
    border-radius: 8px;
    color: #e2f0f9;
    cursor: pointer;
    font-size: 16px;
    font-weight: 700;
    height: 48px;
    line-height: 19px;
    width: 137px
}

@media (max-width:320px) {
    .legalQuestionsColorContainer .homeLegalQuestionsContainerchatButton {
        font-size: 12px
    }
}

.legalQuestionsColorContainer .homeLegalQuestionsContainerchatButton:hover {
    border: 1px solid #2b5bd9;
    color: #2b5bd9
}

.legalQuestionsColorContainer .homeLegalQuestionsContainerchatButton:active {
    border: 1px solid #2b5bd9;
    color: #2b5bd9
}

.legalQuestionsColorContainer .dropbtn {
    background: #fff;
    border: 1px solid #3985e2;
    border-radius: 8px;
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    font-size: 16px;
    justify-content: space-between;
    max-height: 48px;
    padding: 15px;
    width: inherit
}

@media (min-width:1024px) {
    .legalQuestionsColorContainer .dropbtn {
        font-size: 16px;
        line-height: 20px;
        padding: 14px
    }
}

@media (max-width:480px) {
    .legalQuestionsColorContainer .dropbtn {
        font-size: 12px;
        font-weight: 400;
        line-height: 16px
    }
}

@media (min-width:481px) and (max-width:767px) {
    .legalQuestionsColorContainer .dropbtn {
        font-size: 16px;
        font-weight: 400;
        line-height: 20px
    }
}

@media (min-width:768px) and (max-width:1023px) and (orientation:portrait) {
    .legalQuestionsColorContainer .dropbtn {
        font-size: 16px;
        font-weight: 400;
        line-height: 20px
    }
}

@media (min-width:768px) and (max-width:1023px) and (orientation:landscape) {
    .legalQuestionsColorContainer .dropbtn {
        font-size: 16px;
        font-weight: 400;
        line-height: 20px
    }
}

.legalQuestionsColorContainer .dropbtn:focus,
.legalQuestionsColorContainer .dropbtn:hover {
    border: 1px solid #3e8e41
}

.legalQuestionsColorContainer #myInput {
    background: #fff;
    border: 1px solid #80818e;
    border-radius: 8px;
    box-sizing: border-box;
    font-size: 16px;
    padding: 14px 20px 12px 45px;
    width: inherit
}

.legalQuestionsColorContainer #myInput:focus {
    outline: 3px solid #ddd
}

.legalQuestionsColorContainer .dropdown {
    position: relative
}

.legalQuestionsColorContainer .dropDownContentContainer {
    display: grid;
    margin-left: 12px;
    margin-right: 12px;
    margin-top: 8px
}

.legalQuestionsColorContainer .dropdown-content {
    background-color: #fff;
    border: 1px solid #ddd;
    display: none;
    margin-top: 10px;
    max-height: 484px;
    min-height: 150px;
    overflow: auto;
    position: absolute;
    width: 100%;
    z-index: 1
}

.legalQuestionsColorContainer .hide {
    display: none
}

.legalQuestionsColorContainer .dropdown-content a {
    color: #000;
    display: block;
    padding: 12px 16px 12px 8px;
    text-decoration: none
}

.legalQuestionsColorContainer .dropdown a:hover {
    background-color: #fff
}

.legalQuestionsColorContainer .show {
    display: block
}

.legalQuestionsColorContainer .dropdownImage {
    display: block;
    padding-top: 5px
}

.legalQuestionsColorContainer .dropdownSearchImage {
    margin-left: 22px;
    margin-top: 22px;
    position: absolute
}

.legalQuestionsColorContainer .dropdownCloseImage {
    cursor: pointer;
    margin-right: 22px;
    margin-top: 20px;
    position: absolute;
    right: 0
}

.legalQuestionsColorContainer .dropdownText {
    font-size: 16px;
    line-height: 20px
}

@media (min-width:1024px) {
    .legalQuestionsColorContainer .dropdownText {
        font-size: 16px;
        line-height: 20px
    }
}

@media (max-width:480px) {
    .legalQuestionsColorContainer .dropdownText {
        font-size: 14px;
        font-weight: 400;
        line-height: 20px
    }
}

@media (min-width:481px) and (max-width:767px) {
    .legalQuestionsColorContainer .dropdownText {
        font-size: 16px;
        font-weight: 400;
        line-height: 20px
    }
}

@media (min-width:768px) and (max-width:1023px) and (orientation:portrait) {
    .legalQuestionsColorContainer .dropdownText {
        font-size: 16px;
        font-weight: 400;
        line-height: 20px
    }
}

@media (min-width:768px) and (max-width:1023px) and (orientation:landscape) {
    .legalQuestionsColorContainer .dropdownText {
        font-size: 16px;
        font-weight: 400;
        line-height: 20px
    }
}

@media (max-width:480px) {
    .legalQuestionsColorContainer {
        background: #fff
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions {
        display: flex;
        flex-direction: column
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer {
        background: #eaeefb;
        margin-top: 24px
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer {
        display: flex;
        padding: 24px 16px
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer .dropDownContainer {
        margin-right: 8px;
        width: 80%
    }

    .legalQuestionsColorContainer .qnaBox {
        display: flex;
        flex-direction: column
    }

    .legalQuestionsColorContainer .qnaBoxTitle {
        color: #2b2d42;
        font-size: 24px;
        font-weight: 700;
        line-height: 28px;
        margin-top: 40px
    }

    .legalQuestionsColorContainer .qnaBoxResultTitle {
        color: #6b6c7b;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        margin-top: 12px
    }

    .legalQuestionsColorContainer .homeLegalQuestionsContainerchatButton {
        background-color: #999;
        border: 1px solid #999;
        border-radius: 8px;
        color: #e2f0f9;
        cursor: pointer;
        font-size: 12px;
        font-weight: 700;
        height: 48px;
        line-height: 16px;
        width: 100px
    }

    .dropDownContentContainer {
        width: 94%
    }
}

@media (min-width:481px) and (max-width:767px) {
    .legalQuestionsColorContainer {
        background: #fff
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions {
        display: flex;
        flex-direction: column
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer {
        background: #eaeefb;
        margin-top: 24px
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer {
        display: flex
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer .dropDownContainer {
        margin-right: 8px;
        width: 80%
    }

    .legalQuestionsColorContainer .qnaBox {
        display: flex;
        flex-direction: column
    }

    .legalQuestionsColorContainer .qnaBoxTitle {
        color: #2b2d42;
        font-size: 28px;
        font-weight: 700;
        line-height: 36px;
        margin-top: 16px;
        text-align-last: center
    }

    .legalQuestionsColorContainer .qnaBoxResultTitle {
        color: #6b6c7b;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        margin-top: 12px;
        text-align-last: center
    }

    .legalQuestionsColorContainer .homeLegalQuestionsContainerchatButton {
        background-color: #999;
        border: 1px solid #999;
        border-radius: 8px;
        color: #e2f0f9;
        cursor: pointer;
        font-size: 14px;
        font-weight: 700;
        height: 48px;
        line-height: 20px;
        width: 121px
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:portrait) {
    .legalQuestionsColorContainer {
        background: #fff
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions {
        display: flex;
        flex-direction: column
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer {
        background: #eaeefb;
        margin-top: 24px
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer {
        display: flex;
        padding: 32px 24px
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer .dropDownContainer {
        margin-right: 8px;
        width: 80%
    }

    .legalQuestionsColorContainer .qnaBox {
        display: flex;
        flex-direction: column
    }

    .legalQuestionsColorContainer .qnaBoxTitle {
        color: #2b2d42;
        font-size: 24px;
        font-weight: 700;
        line-height: 28px;
        margin-top: 56px;
        text-align-last: center
    }

    .legalQuestionsColorContainer .qnaBoxResultTitle {
        color: #6b6c7b;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        margin-top: 12px;
        text-align-last: center
    }

    .legalQuestionsColorContainer .homeLegalQuestionsContainerchatButton {
        background-color: #999;
        border: 1px solid #999;
        border-radius: 8px;
        color: #e2f0f9;
        cursor: pointer;
        font-size: 14px;
        font-weight: 700;
        height: 48px;
        line-height: 20px;
        width: 132px
    }
}

@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
    .legalQuestionsColorContainer {
        background: #fff
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions {
        display: flex;
        flex-direction: column
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer {
        background: #eaeefb;
        margin-top: 24px
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer {
        display: flex;
        padding: 32px 24px
    }

    .legalQuestionsColorContainer .legalQuestionsContainer .legalQuestions .dropDownColorContainer .legaldropDownColorContainer .dropDownContainer {
        margin-right: 8px;
        width: 80%
    }

    .legalQuestionsColorContainer .qnaBox {
        display: flex;
        flex-direction: column
    }

    .legalQuestionsColorContainer .qnaBoxTitle {
        color: #2b2d42;
        font-size: 24px;
        font-weight: 700;
        line-height: 28px;
        margin-top: 56px;
        text-align-last: center
    }

    .legalQuestionsColorContainer .qnaBoxResultTitle {
        color: #6b6c7b;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        margin-top: 12px;
        text-align-last: center
    }

    .legalQuestionsColorContainer .homeLegalQuestionsContainerchatButton {
        background-color: #999;
        border: 1px solid #999;
        border-radius: 8px;
        color: #e2f0f9;
        cursor: pointer;
        font-size: 14px;
        font-weight: 700;
        height: 48px;
        line-height: 20px;
        width: 180px
    }
}

.contact-wrapper {
    max-width: 1000px;
    margin: 60px auto;
    padding: 50px;
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.06);
    font-family: 'Segoe UI', sans-serif;
}

.contact-title {
    text-align: center;
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 45px;
    color: #111;
    letter-spacing: 0.5px;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px 60px;
}

.contact-item {
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.contact-icon {
    min-width: 52px;
    height: 52px;
    border-radius: 14px;
    background: #f4f6f8;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #0a3d62;
    transition: 0.3s ease;
}

.contact-item:hover .contact-icon {
    background: #0a3d62;
    color: #fff;
}

.contact-info {
    font-size: 16px;
    color: #333;
    line-height: 1.6;
}

.contact-info strong {
    display: block;
    font-weight: 600;
    margin-bottom: 4px;
    color: #111;
}

.contact-info a {
    color: #0a3d62;
    text-decoration: none;
    font-weight: 500;
}

.contact-info a:hover {
    text-decoration: underline;
}

/* Красивое расписание */
.hours {
    display: grid;
    grid-template-columns: 80px 1fr;
    row-gap: 6px;
}

.hours span {
    color: #555;
}

.hours strong {
    font-weight: 500;
}

/* Адаптив */
@media (max-width: 900px) {
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }
}

.team-section {
    max-width: 1200px;
    margin: 80px auto;
    padding: 0 20px;
    font-family: 'Segoe UI', sans-serif;
}

.team-title {
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 60px;
    color: #111;
}

.team-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.team-card {
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.06);
    padding: 40px 30px;
    text-align: center;
    transition: 0.3s ease;
}

.team-card:hover {
    transform: translateY(-8px);
}

.team-avatar {
    width: 130px;
    height: 130px;
    margin: 0 auto 25px;
    border-radius: 50%;
    overflow: hidden;
    border: 5px solid #f4f6f8;
}

.team-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-name {
    font-size: 20px;
    font-weight: 600;
    color: #111;
    margin-bottom: 6px;
}

.team-position {
    font-size: 14px;
    color: #0a3d62;
    font-weight: 500;
    margin-bottom: 18px;
    letter-spacing: 0.5px;
}

.team-description {
    font-size: 14px;
    color: #555;
    line-height: 1.6;
}

/* 📱 Адаптив */
@media (max-width: 992px) {
    .team-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .team-grid {
        grid-template-columns: 1fr;
    }
}