@font-face {
    font-family: 'DMSans-Regular';
    src: url('../fonts/DMSans-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-Regular.ttf') format('truetype');
}

* {
    font-family: 'DMSans-Regular';
}

@-webkit-keyframes ngdialog-fadeout {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes ngdialog-fadeout {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes ngdialog-fadein {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes ngdialog-fadein {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}



.ngdialog {
    box-sizing: border-box;
}

    .ngdialog *,
    .ngdialog *:before,
    .ngdialog *:after {
        box-sizing: inherit;
    }

.ngdialog {
    position: fixed;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 10000;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

    .ngdialog.ngdialog-disabled-animation,
    .ngdialog.ngdialog-disabled-animation .ngdialog-overlay,
    .ngdialog.ngdialog-disabled-animation .ngdialog-content {
        -webkit-animation: none !important;
        animation: none !important;
    }

.ngdialog-overlay {
    position: fixed;
    background: rgba(0, 0, 0, 0.4);
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: ngdialog-fadein 0.5s;
    animation: ngdialog-fadein 0.5s;
}

.ngdialog-no-overlay {
    pointer-events: none;
}

.continuebtnMHC button.btn.btn-primary-next:hover {
    background: #AE411C;
    color: white;
    transition: background-color 0.3s ease;
}

.ngdialog.ngdialog-closing .ngdialog-overlay {
    -webkit-backface-visibility: hidden;
    -webkit-animation: ngdialog-fadeout 0.5s;
    animation: ngdialog-fadeout 0.5s;
}

.continueButton {
    background: #AE411C;
    color: white;
    transition: background-color 0.3s ease;
}

.ngdialog-content {
    background: transparent;
    -webkit-backface-visibility: hidden;
    -webkit-animation: ngdialog-fadein 0.5s;
    animation: ngdialog-fadein 0.5s;
    pointer-events: all;
}

.ngdialog.ngdialog-closing .ngdialog-content {
    -webkit-backface-visibility: hidden;
    -webkit-animation: ngdialog-fadeout 0.5s;
    animation: ngdialog-fadeout 0.5s;
}

.ngdialog-close:before {
    font-family: 'DMSans-Regular';
    content: '\00D7';
    cursor: pointer;
}

.loaderlayoutbackground {
    background-color: black;
    opacity: 0.8;
}

.loaderlayout {
    z-index: 1500;
    text-align: center;
    position: relative;
    top: 50%;
    margin-top: -50px;
}



html.ngdialog-open,
body.ngdialog-open {
    overflow: hidden;
}

.errormessage {
    color: #a94442;
    font-size: 12px;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
}


.answer-options label:not(.normal) {
    width: 240px;
    padding: 10px;
    background: #FFFFFF;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    border-radius: 100px;
    text-align: left;
    /*height: 48px;*/
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    padding: 12px 24px;
    margin-bottom: 8px;
}

.answer-options label:not(.switch):not(.normal):hover {
    background-color: #EDF1F2;
    color: #000000;
    border: 1px solid #BFBFBF;
}

.answer-options label:not(.switch):not(.normal):active {
    background: #F8D1C0;
    border: 1px solid #D64204;
    box-sizing: border-box;
    border-radius: 100px;
    color: #D64204;
}

.answer-options input {
    visibility: hidden;
}

input[type="radio"] {
    width: 0px;
    display: none;
}

.img-responsive {
    float: left;
    margin: 10px 0 10px 0;
    height: 103px !important;
    width: 203px !important;
    max-width: 203px !important;
}


.footer {
    /*padding-top: 72px;*/
}

header {
    background-color: #fff;
}

.border {
    padding: 5px;
    border: 1px solid #797979;
}

.ng-fade.ng-hide {
    opacity: 0;
}

.ng-fade.ng-hide-remove,
.ng-fade.ng-hide-add {
    display: block !important;
}

.ng-fade.ng-hide-remove {
    transition: all linear 1000ms;
}

div.progress-bar {
    background-color: #D64204;
    border-radius: 0px 100px 100px 0px;
}

div.progress {
    height: 8px;
    width: 100%;
    border: 0;
    margin-bottom: 0px;
    border-radius: 0px;
    background-color: #F8D1C0;
    box-shadow: 0 0 black;
}

button, input[type=submit] {
    padding: 10px;
    border-radius: 50px;
    width: 150px;
    background-color: white;
    outline: 0;
    border: 3px solid #797979;
    color: #797979;
    margin: 15px;
}

.float-right {
    float: right;
    height: 168px;
}


.ackfeedback {
    font-size: 20px;
}

.rbtFeed .question label input {
    width: 100%;
}

button[disabled] {
    cursor: not-allowed;
}

.error {
    color: red;
}

.additional-surveys .survey {
    width: 250px;
    padding: 10px;
    display: inline-block;
    margin-left: 10px;
    border: 1px solid;
    height: 105px;
    float: left;
}

/*.survey label {
    border: 1px solid black;
    padding: 10px;
    height: 120px;
    width: 266px;
    font-weight: bolder;
   
}*/


.survey label {
    height: 300px;
    width: 266px;
    border: 1px solid rgba(49,38,29,0.25);
    border-radius: 0 0 20px 0;
    background-color: #FFFFFF;
    margin-bottom: 30px;
}

.survey #lblServey {
    font-weight: lighter;
}

.survey label.active {
    background-color: #A577A7;
    color: white;
}


.width-100-per {
    width: 100%;
}

button.report-send-email {
    margin-top: -8px;
}

button.save-user-detail {
    margin-top: -3px;
}

.Question {
    border: 1px solid;
    border-color: black;
    width: 100%;
    padding: 30px;
    font-size: 22px;
}


.subques {
    background-color: #FAF9F9;
    padding: 28px;
    padding-bottom: 10px;
    font-weight: normal;
}

.started {
    font-size: 18px;
    font-weight: normal;
    line-height: 27px;
    font-family: 'DMSans-Regular';
}

.subquesstart {
    /* background-color: #FAF9F9;*/
    background-color: white;
    padding: 28px;
    padding-bottom: 10px;
    padding-left: 0px;
    font-weight: normal;
    margin-top: 40px;
}

.last-week {
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #000000;
    margin-bottom: 16px;
}
/*.suvery-container {
    border-radius: 8px;
    padding: 24px 24px 0px 24px;
    margin: 24px 24px 0px 24px;
}*/

.suvery-container {
    border-radius: 8px;
    padding: 48px 24px 0px 24px;
    margin-left: 24px;
}

.suvery-containerPTS {
    border-radius: 8px;
    padding: 24px 24px 0px 10px;
    margin: 24px 24px 0px 24px;
}



.continuebtnMHC {
    justify-content: end;
    display: flex;
    margin-top: 24px;
    margin-bottom: -67px;
    z-index: 9999;
    margin-left: 75px;
}

/*.progress-container {
    padding: 0px 0px;
    padding-bottom: 30px;
    margin-top: 12px;
}*/
.rectangle {
    color: #31261D;
    font-size: 15px;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
    line-height: 26px;
}

.substitute {
    margin-top: 40px;
    padding: 20px;
    margin-bottom: 20px;
    background-color: rgba(255,159,26,0.1);
}

.copyright {
    text-align: center;
    font-weight: bolder;
}

.sidefont {
    font-size: 15px !important;
    line-height: 27px !important;
}

a#helplink {
    color: red;
    font-size: 14px;
    font-weight: 600;
    text-decoration: underline;
}

.welcome-to-the-black-box {
    background-color: #FAF9F9;
}

.welcome-to-the-black-text {
    position: absolute;
    height: 222px;
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 82px;
    line-height: 107px;
    left: 105px;
    left: 7.29%;
    top: 219px;
    /* top: 339px; */
}


.additional-welcome-to-the-black-text {
    color: black;
    font-size: 39px;
    font-weight: bold;
    line-height: 48px;
    padding-left: 35px;
    padding-top: 20px;
    margin-bottom: 20px;
    font-family: 'DMSans-Regular';
    text-align: center;
}

@media (max-width:1197px) and (min-width:991px) {
    .float-right {
        margin-right: 115px;
    }
}

@media only screen and (max-width: 812px) {
    .welcome-to-the-black-text {
        padding-top: 20px;
    }
}

.img {
    max-width: 100%;
}


.header-img-container {
    background: #FFF;
    padding: 0px;
}

.header-img {
    overflow: hidden;
    border-radius: 0px 0px 30px 0px;
}

    .header-img img {
        height: 100%;
        width: auto;
    }

.involved {
    color: #FF9F1A;
    font-size: 20px;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
    line-height: 24px;
    padding-top: 10px;
}


.created {
    font-size: 16px;
    line-height: 26px;
    background-color: #FAF9F9;
}

.createdLandingPage {
    font-size: 16px;
    line-height: 26px;
}

.bodycol {
    background-color: blue;
}

/* Main Container */
.trauma-container {
    max-width: 800px;
    margin: 40px auto;
    padding: 24px;
    border-radius: 10px;
    font-family: 'DM Sans',sans-serif;
    background-color: #fff;
}

/* Progress Indicator */
.trauma-progress {
    font-family: "DM Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    background-color: #E3FAED;
    width: 65px;
    color: #0B3B20;
    border-radius: 8px;
    height: 28px;
    text-align: center;
    align-items: center;
    align-content: center;
}

/* Question Styling */
.trauma-question {
    background-color: #F6F8F9;
    display: flex;
    height: auto;
    padding: 32px 24px 48px 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    align-self: stretch;
    width: 100%;
    border-radius: 8px;
    margin-left: 50px;
    margin-right: 50px;
}

.traumawarningtext {
    color: var(--black, #000);
    font-family: "DM Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}

.traumawarning {
     justify-content: end;
    display: flex;
    
}

/*.back-button-container {
    margin-top: -10px;  
    margin-left: -13px;
    padding-bottom: 15px;*/ /* Adds spacing below the button */
/*}

.btnback {
    padding: 5px 10px;*/ /* Optional: Adjust button padding for better appearance */
/*}*/

/* Ensure consistency on mobile */
/*@media (max-width: 767px) {
    .back-button-container {
        margin-top: -10px;*/ /* Same as desktop */
/*margin-left: -13px;
    }
}*/
.back-button-container {
    margin-top: 10px; /* Positive margin to place it right below options */
    margin-left: 0; /* Aligns with the left edge of the text */
    padding-bottom: 20px;
}

.btnback {
    padding: 5px 10px;
    background: transparent;
    border: none;
}

@media (max-width: 767px) {
    .back-button-container {
        margin-top: 10px;
        margin-left: 0;
    }
}

.traumawarning button {
    max-width: 250px;
    width: 250px;
    height: 60px;
    border-radius: 100px;
   /* border: 1px solid rgb(214, 66, 4);*/
    background: transparent;
    color: #D64204;
    font-family: "DM Sans", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    cursor: pointer;

}


/*    .traumawarning button:active, .traumawarning button:hover {
        width: 100% !important;
        padding: 12px 32px;
        border-radius: 100px;
        border: 1px solid #D64204;
        background: #D64204;
        color: white;
        font-family: "DM Sans", sans-serif;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 1.25px;
        text-transform: uppercase;
        cursor: pointer;
    }*/

.trauma-question-title {
    color: var(--Primary-Black, rgba(0, 0, 0, 0.95));
    font-family: "DM Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
}

.trauma-question-text {
    font-size: 16px;
    color: #666;
    line-height: 1.6;
}

/* Continue Button */
.trauma-continue-btn {
    padding: 12px 32px;
    border-radius: 100px;
    border: 1px solid #D64204;
    background: transparent;
    color: #D64204;
    font-family: 'DM Sans', sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    cursor: pointer;
}

    .trauma-continue-btn.selected {
        background-color: #D64204;
        color: white;
    }

@media (max-width: 768px) {
    .trauma-container {
        margin: 20px 15px;
        padding: 20px;
    }

    .trauma-question-text br {
        display: none;
    }

    .trauma-continue-btn {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 320px) {
    .trauma-container {
        margin: 20px 15px;
        padding: 20px;
    }

    .trauma-question-text br {
        display: none;
    }

    .trauma-continue-btn {
        width: 100%;
        text-align: center;
    }
}

.bodycontent {
    background-color: #fff;
}

.substitute-heading {
    color: #E14504;
}

.thank-you-for-taking {
    color: #31261D;
    font-size: 28px;
    font-family: 'DMSans-Regular';
    line-height: 40px;
    text-align: center;
    padding-top: 20px;
}

.impinfo {
    color: #31261D;
    font-size: 18px;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
    line-height: 40px;
    text-align: center;
    padding-top: 20px;
}


.before-you-receive-y {
    color: #31261D;
    font-size: 16px;
    line-height: 26px;
    text-align: center;
}

.do-any-of-the-below {
    color: #31261D;
    font-size: 16px;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
    line-height: 26px;
    text-align: center;
    padding-bottom: 20px;
}

.addtionalques {
    color: #FF9F1A;
    font-size: 22px;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
    line-height: 27px;
    padding-left: 15px;
}

.i-m-concerned-about {
    color: #31261D;
    font-size: 16px;
    line-height: 26px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 0px;
}


.survey label.active .addtionalques {
    color: #FFF;
}

.survey label.active .i-m-concerned-about {
    color: #FFF;
}




.Layout {
    background-color: #FAF9F9;
}

.addionalimg {
    padding-left: 15px;
    padding-top: 20px;
}

.Unselectedimg {
    padding-left: 150px;
    padding-top: 10px;
}

.Unselectedimg-selected {
    padding-left: 150px;
    padding-top: 10px;
    display: none;
}

.addionalimg-selected {
    padding-left: 15px;
    padding-top: 20px;
    display: none;
}

.survey label.active .addionalimg-selected {
    display: inline;
}

.survey label.active .addionalimg {
    display: none;
}


.survey label.active .Unselectedimg-selected {
    display: inline;
}

.survey label.active .Unselectedimg {
    display: none;
}


/*18032021*/
.btn.btn-primary {
    width: 100%;
    height: 60px;
    outline: 0;
    /*border: 2px solid #D64204;*/
    box-sizing: border-box;
    border-radius: 100px;
    color: #D64204;
    font-family: 'DMSans-Regular';
    margin: 0px;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    background-color: transparent;
}
    /*18032021*/
    .btn.btn-primary:active, .btn.btn-primary:focus {
        width: 250px;
        height: 60px;
        outline: 0;
        /*border: 2px solid #D64204;*/
        box-sizing: border-box;
        border-radius: 100px;
        color: #FFFFFF;
        font-family: 'DMSans-Regular';
        margin: 0px;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        letter-spacing: 1.25px;
        text-transform: uppercase;
        background-color: #D64204;
    }

    .btn.btn-primary:hover,
    .page button.btn.btn-primary-next:hover,
    .modal-footer .btn:hover,
    .report-page .btn.btn-primary.view:hover {
        background: #D64204;
        color: #FFFFFF;
        background: #AE411C;
        transition: 0.35s ease;
    }

/*18032021*/
.btn.btn-primary-next {
    width: 250px;
    height: 60px;
    outline: 0;
    /*border: 2px solid #D64204;*/
    box-sizing: border-box;
    border-radius: 100px;
    color: #D64204;
    font-family: 'DMSans';
    font-style: normal;
    margin: 0px;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    background-color: #F8D1C0;
}

    /*18032021*/
    .btn.btn-primary-next:active, .btn.btn-primary-next:focus {
        width: 250px;
        height: 60px;
        outline: 0;
        /*border: 2px solid #D64204;*/
        box-sizing: border-box;
        border-radius: 100px;
        font-family: 'DMSans';
        font-style: normal;
        margin: 0px;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        letter-spacing: 1.25px;
        text-transform: uppercase;
        background-color: #D64204;
    }

.btn {
    margin: 0px;
}

    .btn.btn-primary .fa {
        padding-left: 80px;
    }

.footer-img {
    margin-bottom: 15px;
}

.survey .fa {
    color: #A577A7;
    font-size: 25px;
    padding-left: 10px;
    margin-top: 20px;
    float: left;
}

.survey label.active .fa {
    color: #FFFFFF;
}

.done-your-report-is {
    color: #31261D;
    font-size: 28px;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
    line-height: 40px;
    text-align: center;
    padding-bottom: 20px;
}




.btn.btn-primary.view {
    width: 100%;
    height: 79px;
    background-color: #E14504;
    outline: 0;
    border: 1px solid #E14504;
    color: white;
    font-family: 'DMSans-Regular';
    margin: 0px;
    font-weight: 500;
    font-size: 24px;
    line-height: 31px;
    text-align: center;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-radius: 40px;
}

/*18032021*/
.report-page .btn.btn-primary.view {
    /* border: 2px solid #D64204;*/
    box-sizing: border-box;
    border-radius: 100px;
    background-color: transparent;
    width: 100%;
    color: #D64204;
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    height: auto;
    max-width: 260px;
}

    .report-page .btn.btn-primary.view:active {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

.page .question .emailreport label {
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0.25px;
    color: #000000;
    margin-bottom: 8px;
}

.page .question .btn.btn-primary {
    padding: 14px;
    height: 48px;
}

.report-page .btn.btn-primary.view.download,
.report-page .btn.btn-primary.view.email {
    font-size: 16px;
    line-height: 24px;
    border: none;
    color: #000000;
    text-transform: none;
    text-decoration: none;
}

    .report-page .btn.btn-primary.view.download:hover,
    .report-page .btn.btn-primary.view.download:active,
    .report-page .btn.btn-primary.view.email:hover,
    .report-page .btn.btn-primary.view.email:active {
        background: transparent;
        color: #D64204;
    }

.page .question .user-info-container label {
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0.25px;
    margin-bottom: 8px;
}

.report-page .btn.btn-primary.view span {
    color: #D64204;
    font-size: 22px;
    position: relative;
    top: 0;
}

.btn.btn-primary.download {
    width: 354px;
    height: 79px;
    background-color: white;
    outline: 0;
    /*    border: 1px solid #E14504;
*/
    color: #000000;
    font-family: 'DMSans-Regular';
    margin: 0px;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-radius: 40px;
}


.btn.btn-primary.email {
    width: 354px;
    height: 79px;
    background-color: white;
    outline: 0;
    /*.btn.btn-primary.download*/
    color: #000000;
    font-family: 'DMSans-Regular';
    margin: 0px;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-radius: 40px;
}

.emailreport {
    padding: 2px;
}

.suvery-container col-md-12 {
    padding: 0;
}

.we-d-love-to-hear {
    color: #31261D;
    font-size: 22px;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
    line-height: 27px;
}

.happy-contacted {
    padding-left: 15px;
    margin-top: -25px;
}

.radio.feedbackradio {
    margin-top: 0px;
    margin-bottom: 0px;
}

.feedbacktext {
    padding-left: 10px;
}

.helprectangle {
    padding: 5px 30px 15px 30px;
    background-color: #FAF9F9;
    border-radius: 0 0 20px 0;
    height: 285px;
}

.helpline {
    color: #FF9F1A;
    padding-bottom: 10px;
}

.helptextcenter {
    padding-top: 5px;
    font-size: 16px;
    line-height: 26px;
    color: #31261D;
    /*font-weight: bold;*/
    font-family: 'DMSans-Regular';
}

.helptext {
    padding-top: 20px;
    font-size: 16px;
    line-height: 26px;
    color: #31261D;
    text-align: center;
    padding-bottom: 20px;
}

/* CUSTOM RADIO */
/* https://bootsnipp.com/snippets/featured/animated-radios-amp-checkboxes-nojs */
.checkbox label:after,
.radio label:after {
    content: '';
    display: table;
    clear: both;
}

.checkbox .cr,
.radio .cr {
    position: relative;
    display: inline-block;
    border: 1px solid #a9a9a9;
    border-radius: .25em;
    width: 1.3em;
    height: 1.3em;
    margin-right: .5em;
    top: 3px;
}

.radio .cr {
    border-radius: 50%;
}

    .checkbox .cr .cr-icon,
    .radio .cr .cr-icon {
        position: absolute;
        font-size: 1.5em;
        line-height: 0;
        top: 50%;
        left: -2px;
    }

    .radio .cr .cr-icon {
        margin-left: -0.05em;
        color: #ff9f1a;
    }

.checkbox .cr .cr-icon {
    margin-left: -0.05em;
    color: #ff9f1a;
}

.radio .radioError .cr {
    border: 1px solid #cd5c5c;
}

/*.float-right {
    margin-right: 80px;
}*/


.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

    .checkbox label input[type="checkbox"] + .cr > .cr-icon,
    .radio label input[type="radio"] + .cr > .cr-icon {
        transform: scale(1.2) rotateZ(0deg);
        opacity: 0;
        transition: all .3s ease-in;
    }

    .checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
    .radio label input[type="radio"]:checked + .cr > .cr-icon {
        transform: scale(1) rotateZ(0deg);
        opacity: 1;
    }

    .checkbox label input[type="checkbox"]:checked + .cr > .cr-icon {
        transform: scale(0.6) rotateZ(0deg);
    }

    .checkbox label input[type="checkbox"]:disabled + .cr,
    .radio label input[type="radio"]:disabled + .cr {
        opacity: .5;
    }

/* END RADIO */

/* 1 pixels for top and bottom, and to 60 pixels for right and left */
.space {
    padding: 1px 60px;
}





@media only screen and (max-width: 330px) {
    .answer-options label {
        font-size: 16px;
        line-height: 24px;
    }

    input#txtEmail {
        width: 100% !important;
    }

    div.feedbackradio.radio.chkbox-lable {
        font-size: 12px !important;
        height: 82px !IMPORTANT;
        margin-left: 18px;
    }

    .emailreport {
        width: 100% !important;
        height: auto !important;
    }

    .col-md-12.below-checkbox-paragraph {
        height: 120px !important;
        width: 80% !important;
        margin-left: 46px;
    }
}


@media only screen and (max-width: 812px) {

    .space {
        padding: 1px 30px;
    }

    .thank-you-for-taking {
        font-size: 22px;
        padding-top: 5px;
        line-height: 27px;
    }

    #Substituteimg {
        display: none;
        display: none;
    }

    .float-right {
        margin-right: 80px;
    }
}

.mobile-view-header-wrapper {
    position: relative;
    float: left;
}

.createdtexts {
    color: #31261D;
    font-size: 22px;
    /* font-weight: bold; */
    line-height: 27px;
    padding-top: 30px;
    font-family: 'DMSans-Regular';
    text-align: center;
    background-color: #FAF9F9;
    margin-top: 30px;
    padding-bottom: 30px;
}

.textcreated {
    color: #31261D;
    font-size: 22px;
    font-family: 'DMSans-Regular';
    text-align: center;
}

.btn.btn-primary.btn-rathernotanswer {
    background-color: #e8e3de00;
    border-color: black;
}


    .btn.btn-primary.btn-rathernotanswer:hover {
        background-color: rgb(255, 159, 26);
    }

button.btn.btnback:hover {
    background-color: white;
    color: #000 !important;
}
/*BUS-500 Starts*/
button.btnback {
    position: relative;
}

    button.btnback:before {
        content: "";
        position: absolute;
        width: 0;
        height: 2.6px;
        bottom: -2px;
        right: 1px;
        background-color: #D64204;
        visibility: hidden;
        transition: all 0.3s ease-in-out;
    }

    button.btnback:hover:before {
        visibility: visible;
        width: 58%;
    }

/*button.btnback:hover .back-icons {
        padding-right: 5px;
    }*/
/*BUS-500 Ends*/
.subque {
    background-color: #FAF9F9;
    padding: 14px;
}

.footergapstyle {
    height: max-content;
}

.description {
    padding-bottom: 3px;
}

button, input, select, textarea {
    margin-bottom: 17px !important;
}

.question textarea {
    width: 100%;
    padding: 12px 16px;
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
}

button.btn.btnback {
    box-shadow: none;
}

    button.btn.btnback, button.btn.btnback:hover {
        /* float: left; */
        width: auto;
        padding-top: 16px;
        text-align: left;
        color: #000;
        font-family: "DM Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 22px;
        cursor: pointer;
        padding-bottom: 0px;
        margin-bottom: 8px !important;
        margin-left: 13px;
    }


        button.btn.btnback #traumaArrow {
            padding-right: 10px;
            padding-left: 0px;
            top: 0px !important;
        }

        button.btn.btnback:hover #traumaArrow {
            padding-right: 0px;
            padding-left: 10px;
        }

        button.btn.btnback #traumaArrow,
        button.btn.btnback:hover #traumaArrow {
            color: #D64204;
            font-size: 23px;
            position: relative;
            top: 3px;
        }

        button.btn.btnback span {
            padding-left: 10px;
            padding-right: 0px;
        }


        button.btn.btnback:hover span {
            padding-left: 0px;
            padding-right: 10px;
        }

        button.btn.btnback span,
        button.btn.btnback:hover span {
            color: #D64204;
            font-size: 23px;
            position: relative;
            top: 3px;
        }


        button.btn.btnback:focus {
            outline: none !important;
        }

.div-back {
    /* background-color: #FAF9F9;*/
    background-color: white;
}

label.active {
    background-color: #FCECE6;
    color: #D64204;
    border: 1px solid #D64204;
}

/*.ng-fade label.active {
    -webkit-animation: lable-blink-twice 0.6s;*/ /* Safari 4+ */
/*-moz-animation: lable-blink-twice 0.6s;*/ /* Fx 5+ */
/*-o-animation: lable-blink-twice 0.6s;*/ /* Opera 12+ */
/*animation: lable-blink-twice 0.6s;*/ /* IE 10+, Fx 29+ */
/*}*/

.page .question.questioning.ques.ans {
    background-color: #FFFFFF;
    padding: 24px;
    border-radius: 0px;
    margin-top: 24px;
    float: left;
    width: 100%;
    border-bottom: 0px;
}

@-webkit-keyframes lable-blink-twice {
    0%,60%,100% {
        background-color: #FCECE6;
        color: #D64204;
        border: 1px solid #D64204;
    }

    30%,90% {
        border: 1px solid #BFBFBF;
        background-color: white;
        color: #333;
    }
}

label.chkBoxbtn input[type=checkbox] {
    margin-top: 3px !important;
    height: 18px;
    width: 18px;
    border-radius: 4px;
    position: relative;
    outline: 0;
    margin-left: 0px !important;
    margin-right: 10px;
}

/*label.chkBoxbtn input[type="checkbox"]:hover {
    background-color: #EDF1F2;
    border-color: #DAE3E5;
}*/
.chkBoxbtn, .page .question label.chkBoxbtn {
    display: inline-flex;
    position: relative;
    padding-left: 0px !IMPORTANT;
    margin-bottom: 12px !IMPORTANT;
    cursor: pointer !IMPORTANT;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: 16px;
    line-height: 24px;
}

    .chkBoxbtn input {
        position: absolute;
        opacity: 1;
        cursor: pointer;
        height: 14px;
    }

.checkmark {
    position: absolute;
    top: 3px;
    left: 3px;
    height: 18px;
    width: 18px;
    background-color: transparent;
    border: 2px solid #666666;
    border-radius: 2px;
}


.chkBoxbtn input:checked ~ .checkmark {
    background-color: #d64204;
    border: 2px solid #d64204;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.chkBoxbtn input:checked ~ .checkmark:after {
    display: block;
}


.feedback-part1-qtext {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 16px !important;
    line-height: 24px !important;
    /* identical to box height, or 150% */
    /* black-60 */
    color: #666666;
    margin-bottom: 24px;
}

.chkBoxbtn .checkmark:after {
    left: 4px;
    top: 0px;
    width: 7px;
    height: 11px;
    border: solid #edf1f2;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.row.header-container {
    width: 100%;
    height: 387px;
    position: relative;
}

    .row.header-container img {
        width: 102.5%;
    }

    .row.header-container.landing {
        height: 475px;
    }

.get-help-now,
.get-help-now:hover {
    background-color: #D64204;
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    color: #FFFFFF;
    width: 125px;
    float: right;
    height: 125px;
    text-decoration: none;
    position: relative;
}

    .get-help-now .text {
        color: #FFFFFF;
        position: relative;
        top: 65px;
    }

    .get-help-now .down-arrow {
        position: absolute;
        bottom: 14px;
        left: 57px;
    }

p, li {
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 31px;
    color: rgba(0, 0, 0, 0.95);
    margin: 0px;
}

.modal-body p {
    font-size: 18px;
    line-height: 28px;
}

a, a:hover {
    font-style: normal;
    font-weight: 500;
    line-height: 31px;
    text-decoration-line: underline;
}

ul {
    list-style: none; /* Remove default bullets */
}

    ul li::before {
        content: "\2022"; /* Add content: \2022 is the CSS Code/unicode for a bullet */
        color: #E14504; /* Change the color */
        font-weight: bold; /* If you want it to be bold */
        display: inline-block; /* Needed to add space between the bullet and the text */
        width: 1em; /* Also needed for space (tweak if needed) */
        margin-left: -1em; /* Also needed for space (tweak if needed) */
    }

.created.col-md-offset-1 {
    margin-left: 10%;
    padding-left: 0;
    margin-top: 40px;
}

.createdLandingPage.col-md-offset-1 {
    margin-left: 10%;
    padding-left: 0;
    margin-top: 40px;
}

p.startedText {
    text-align: center;
    padding: 30px 15px 30px 5px;
    font-size: 30px;
    line-height: 50px;
}

/*.page .question {
    background-color: #EDF1F2;
    padding: 24px;
    border-radius: 8px;
    margin-top: 24px;
    float: left;
    width: 100%;
}
*/

.page .question {
    background-color: #EDF1F2;
    padding: 32px 24px;
    border-radius: 8px;
    margin-top: 24px;
    float: left;
    width: 100%;
}

.report-page .page .question {
    margin-bottom: 50px;
}

.page .question .cards .item label {
    background: #FFFFFF;
    width: 100%;
    min-height: 138px;
    background-color: white;
    margin: 0 0 8px 0;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    border-radius: 8px;
    color: black;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #000000;
    font-family: 'DMSans-Regular';
    padding: 0 12px;
}

    .page .question .cards .item label:hover {
        background: #EEEEEE;
        border: 1px solid #BFBFBF;
    }

.page .question .cards .item.active label {
    background: #FCECE6;
    border: 1px solid #D64204;
    color: #D64204;
}

p.feedBackText {
    font-size: 16px;
    line-height: 27px;
    font-family: 'DMSans-Regular';
    padding-left: 30px;
}

a.privacy {
    font-style: normal;
    font-family: DMSans-Regular;
    letter-spacing: 0.25px;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    text-decoration-line: underline;
    color: rgba(0, 0, 0, 0.95);
    text-decoration: none;
}

.suicidal {
    background: rgba(255, 159, 26, 0.1);
}

.modal-dialog {
    width: 670px !important;
}

.modal-body p.headingText {
    font-size: 26px;
    font-weight: 500;
    padding: 15px 0px 10px 0px;
}

p.youthResources {
    padding: 5px 0px 20px 0px;
}

p.youthResourcesText {
    padding: 0px 0px 18px 0px;
}

.modal-body a {
    /* color: #D64204;
    text-decoration-line: none;*/
    color: rgba(0, 0, 0, 0.95);
}

.feedback-anchor,
.feedback-anchor:hover {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #000000;
    text-decoration: none;
}

    .feedback-anchor span {
        color: #D64204;
        font-size: 24px;
        position: relative;
        top: 2px;
    }

.header-logo-wrapper {
    position: relative;
    padding: 0;
}

    .header-logo-wrapper img {
        position: absolute;
        width: 290.53px;
        height: 60px;
        left: 32px;
        top: 32px;
    }

.header-logo-wrapperr img {
    position: absolute;
    width: 400.53px;
    height: 70px;
    left: 32px;
    top: 24px;
}

.speech-bubbles {
    position: absolute;
    top: 32px;
    left: 51px;
    width: 23.7px;
    height: 23.71px;
}

.black-dog-logo {
    display: table;
    position: absolute;
    height: 60px;
    left: 32px;
    top: 32px;
    float: left;
    width: 160px;
}

.service-header {
    font-family: 'DMSans-Regular' !important;
    font-style: normal !important;
    font-weight: normal !important;
    /*font-size: 60px;    
    line-height: 70px;*/ /*148*/
    font-size: 30px !important;
    line-height: 60px !important;
    color: #000000 !important;
    text-align: left !important;
    /* padding: 90px 0 !important;*/
    /* background-image: url('../Images/SimpleContent.svg') !important;*/
    background-size: cover !important; /* or contain depending on your design */
    background-repeat: no-repeat !important;
    background-position: center !important;
    /* justify-content: space-between;*/ /*148*/
    justify-content: start !important;
    display: flex !important;
    flex-wrap: wrap !important; /* optional: helps content wrap on smaller screens */
}

.Mentalhealthmaindiv {
    margin-top: 81px;
    margin-left: 200px;
}

.MENTAL_HEALTH_CHECK {
    font-size: 20px;
    letter-spacing: 2px;
    color: #000;
    text-transform: uppercase;
    font-style: normal;
    font-weight: 400;
    font-family: 'DMSANS-REGULAR';
    line-height: 18px;
    width: max-content;
}

.Getting_Started {
    font-size: 40px;
    line-height: 32px;
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: 400;
    line-height: 56px;
    color: #000;
    width: max-content;
    margin-left: -2px;
}

@media (min-width: 600px) and (max-width : 782px) {

    .mobilewebcontaining {
        width: 100% !important;
        height: 140px !important;
    }

    .Mentalhealthmaindivs {
        /*margin-left: 62px !important;*/
        margin-top: 51px !important;
    }
}

@media (min-width: 600px) and (max-width: 774px) {

    h5 {
        font-family: 'DMSans-Regular';
        font-size: 16px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        color: #000000 !important;
    }

    .Mentalhealthmaindiv {
        margin-top: 6px;
        margin-left: 98px;
    }

    .MENTAL_HEALTH_CHECK {
        font-size: 15px;
        font-weight: 400;
        letter-spacing: 1.2px;
        color: #000;
        width: max-content;
    }

    .Getting_Started {
        font-size: 30px;
        line-height: 32px;
        font-weight: 400;
        font-family: 'DMSans-Regular';
        color: #000;
        width: max-content;
    }
}


@media (min-width: 400px) and (max-width: 600px) {

    h5 {
        font-family: 'DMSans-Regular';
        font-size: 16px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        color: #000000 !important;
    }

    .simpleContentimg.mobilewebcontaining {
        width: 100%;
        height: 140px;
    }

    .printMe .the-following-report {
        padding: 34px 0px 0px 0px;
        margin-top: -64px;
        margin-left: -14px;
    }

    .bodycontent.container-fluid .body-content {
        margin-top: 10px !important;
    }

    .bodycontent.container-fluid .body-content {
        margin-top: 0px !important;
    }

    .Mentalhealthmaindiv {
        margin-top: -27px;
        margin-left: 37px;
        line-height: 18px;
        letter-spacing: 1.2px;
    }

    .MENTAL_HEALTH_CHECK {
        font-size: 12px;
        font-style: normal;
        font-family: "DM Sans";
        font-weight: 400;
        letter-spacing: 1.2px;
        color: #000;
        text-transform: uppercase;
        width: max-content;
    }

    .Getting_Started {
        font-size: 24px;
        font-family: 'DMSans-Regular';
        line-height: 32px;
        font-weight: 400;
        font-style: normal;
        color: #000;
        width: max-content;
    }
}


@media (min-width: 300px) and (max-width: 400px) {

    .btn.btnback.backbtnseventeen {
        margin-left: 23px !important;
    }

    h5 {
        font-family: 'DMSans-Regular';
        font-size: 16px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        color: #000000 !important;
    }

    .simpleContentimg.mobilewebcontaining {
        width: 100%;
        height: 124px;
    }

    .printMe .the-following-report {
        padding: 34px 0px 0px 0px;
        margin-top: -64px;
        margin-left: -14px;
    }

    .row.black-dog-intitute .col-md-8.col-md-offset-2.padding-bottom {
        max-width: 784px !important;
        margin: auto !important;
        width: 100% !important;
        overflow-x: hidden !important;
        margin-top: -50px !important;
    }

    .Mentalhealthmaindiv {
        margin-top: -13px;
        margin-left: 25px;
    }

    .MENTAL_HEALTH_CHECK {
        font-size: 12px;
        font-style: normal;
        font-family: "DM Sans";
        font-weight: 400;
        letter-spacing: 1.2px;
        color: #000;
        width: max-content;
        text-transform: uppercase;
    }

    .Getting_Started {
        font-size: 24px;
        font-family: 'DMSans-Regular';
        line-height: 32px;
        font-weight: 400;
        font-style: normal;
        color: #000;
        width: max-content;
    }

    .get-help-now, .get-help-now:hover {
        height: 95px !important;
        width: 95px !important;
    }
}


@media (min-width: 200px) and (max-width: 300px) {


    h5 {
        font-family: 'DMSans-Regular';
        font-size: 16px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        color: #000000 !important;
    }

    .simpleContentimg.mobilewebcontaining {
        width: 100%;
        height: 80px;
    }

    img.img-fluid.depressionimgdiv.left-img-situation-8 {
        width: 59px !important;
        height: 59px !important;
        margin-top: 10px;
    }

    img.img-fluid.depressionimgdiv.Populationdiv {
        width: 60px !important;
        height: 59px !important;
        margin-top: 4px;
    }

    .imgpara.situation-8.depressivedisorders {
        height: max-content !important;
        font-size: 11px !important;
    }

    .imgpara.right-situation-8.depressivedisorders {
        height: max-content !important;
        font-size: 11px !important;
    }

    .printMe .main-support-service {
        font-family: DMSans-Regular;
        font-size: 15px !important;
        font-weight: 700 !important;
        line-height: 32px !important;
        text-align: left !important;
    }


    .printMe p.Access-our.Accessourclinics {
        font-size: 13px !important;
        font-weight: 700;
    }

    .printMe p.Discuss-with.Talk_to_your_GP {
        font-size: 13px !important;
        font-weight: 700;
    }

    .printMe .bullet-online {
        font-size: 11px;
    }

    .depressivedisorders {
        height: max-content !important;
        font-size: 11px !important;
    }

    .printMe .the-following-report {
        padding: 34px 0px 0px 0px;
        margin-top: -64px;
        margin-left: -14px;
    }


    .printMe .support-service {
        font-weight: 500 !important;
        font-size: 18px !important;
    }

    .row.black-dog-intitute .col-md-8.col-md-offset-2.padding-bottom {
        max-width: 784px !important;
        margin: auto !important;
        width: 100% !important;
        overflow-x: hidden !important;
        margin-top: -50px !important;
    }

    .BDI_NEWSS_FullColour_RGB {
        width: 100% !important;
        height: auto !important;
        display: block;
        top: 12px !important;
    }

    .get-help-now {
        background-color: #D64204;
        font-family: 'DMSans-Regular';
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
        line-height: 18px;
        text-align: center;
        color: #FFFFFF;
        width: 62px !important;
        float: right;
        height: 62px !important;
        text-decoration: none;
        position: relative;
    }

    .speech-bubbles {
        top: 8px !important;
        left: 25px !important;
        width: 14px !important;
        height: 13px !important;
    }

    .get-help-now .down-arrow {
        left: 27px !important;
        top: 27px;
    }

    .get-help-now .text {
        font-family: 'DMSans-Regular' !important;
        font-style: normal !important;
        font-weight: normal !important;
        font-size: 8px !important;
        line-height: 18px !important;
        text-align: center !important;
        letter-spacing: 0.25px !important;
        color: #FFFFFF !important;
        top: 36px !important;
    }

    .Mentalhealthmaindiv {
        margin-top: -16px;
        margin-left: 31px;
    }

    .MENTAL_HEALTH_CHECK {
        font-size: 12px;
        font-style: normal;
        font-family: "DM Sans";
        font-weight: 400;
        letter-spacing: 1.2px;
        color: #000;
        text-transform: uppercase;
        width: max-content;
    }

    .Getting_Started {
        font-size: 24px;
        font-family: 'DMSans-Regular';
        line-height: 32px;
        font-weight: 400;
        font-style: normal;
        color: #000;
        width: max-content;
    }
}


@media (min-width: 0px) and (max-width: 200px) {

    h5 {
        font-family: 'DMSans-Regular';
        font-size: 16px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        color: #000000 !important;
    }

    .Mentalhealthmaindiv {
        display: none;
    }

    .header-logo-wrapperr img {
        width: 100% !important;
        height: auto !important;
        left: 16px;
        top: 28px;
    }

    .get-help-now, .get-help-now:hover {
        height: 59px !important;
        width: 49px !important;
    }

        .get-help-now .down-arrow {
            position: absolute;
            bottom: 26px;
            left: 25px !important;
        }


        .get-help-now .text {
            font-family: 'DMSans-Regular' !important;
            font-style: normal !important;
            font-weight: normal !important;
            font-size: 6px !important;
            line-height: 18px !important;
            text-align: center !important;
            letter-spacing: 0.25px !important;
            color: #FFFFFF !important;
            top: 34px !important;
        }

    .speech-bubbles {
        top: 11px !important;
        left: 22px !important;
        width: 14px !important;
        height: 13px !important;
    }

    .Getting_Started {
        font-size: 24px;
        font-family: 'DMSans-Regular';
        line-height: 32px;
        font-weight: 400;
        font-style: normal;
        color: #000;
        width: max-content;
    }

    .MENTAL_HEALTH_CHECK {
        font-size: 12px;
        font-style: normal;
        font-family: "DM Sans";
        font-weight: 400;
        letter-spacing: 1.2px;
        color: #000;
        text-transform: uppercase;
        width: max-content;
    }
}

.body-content {
    margin: 0 auto;
    padding-bottom: 0px;
}

.bodycontent.container-fluid .service-header .body-content {
    padding-bottom: 0;
    margin-top: 0px;
}

h3 {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 32px;
    line-height: 40px;
    color: #000000;
}

.feedback-part1 {
    margin-top: 64px;
    margin-bottom: 24px;
}

.gray-out-text {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 28px;
    color: #000;
}

.red-underlined-text {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 28px;
    color: red;
    text-decoration: underline;
}

.questionbackground-dark-orange {
    background: #FFF5E8;
    border-radius: 8px;
    padding: 15px 117px 15px 24px;
    margin-bottom: 15px;
}

.feedback .gray-out-text {
    margin-bottom: 32px;
}

.landing-dark-orange {
    background: #FFF5E8;
    border-radius: 8px;
    padding: 30px 117px 30px 24px;
}

    .landing-dark-orange p {
        text-align: left;
        font-family: 'DMSans-Regular';
        font-style: normal;
        font-weight: normal;
        font-size: 18px;
        line-height: 28px;
    }

    .landing-dark-orange h4 {
        font-weight: 400;
    }

.orange-cards {
    margin-top: 20px;
}

    .orange-cards .item {
        text-align: center;
    }

        .orange-cards .item img {
            width: 85px;
            height: 85px;
        }


            .orange-cards .item img.e-health {
                width: 80px;
                height: 80px;
            }

            .orange-cards .item img.health {
                height: 74px;
            }

        .orange-cards .item p {
            font-family: 'DMSans-Regular';
            font-style: normal;
            font-weight: 500;
            font-size: 18px;
            line-height: 28px;
            color: #D64204;
            padding: 0 19px;
        }

.landing-dark-orange .btn.btn-primary {
    margin-top: 32px;
}

.landing-response,
.privacy {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0.25px;
    color: #666666;
    margin-top: 24px;
}

.vector-upper {
    position: absolute;
    top: 31px;
    left: 51px;
}

.vector-down {
    position: absolute;
    top: 39px;
    left: 59px;
}

h5 {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #000;
}

h4.gray-out {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 32px;
    color: #666666;
    margin-top: 24px;
    margin-bottom: 0px;
}

.page .question label:not(.normal) {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #000000;
    margin-top: 16px;
}

.page .question .answer-options .item {
    width: auto;
    float: left;
}

.page .question .answer-options.one-per-line .item:not(.switch):not(.normal) {
    width: 100%;
}

.page .question .answer-options.one-per-line label:not(.switch):not(.normal) {
    width: 240px;
    text-align: left;
}

.page .question .answer-options.show-in-stack .item {
    float: left;
}

    .page .question .answer-options.show-in-stack .item label {
        border-radius: 0;
        margin: 0;
        border-right: 0;
    }

    .page .question .answer-options.show-in-stack .item:first-child label {
        border-radius: 4px 0 0 4px;
    }


    .page .question .answer-options.show-in-stack .item:last-child label {
        border-radius: 0 4px 4px 0;
        border-right: 1px solid #BFBFBF;
    }

        .page .question .answer-options.show-in-stack .item:last-child label.active {
            border-right: 1px solid #D64204;
        }

.page .question .answer-options.show-in-stack.item-count-5 .item {
    width: 20%
}

    .page .question .answer-options.show-in-stack.item-count-5 .item label {
        width: 100%
    }

.show-in-stack .item label {
    text-align: center;
}

.page .question .answer-options .item label:not(.switch):not(.normal) {
    background: #FFFFFF;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    border-radius: 100px;
    width: auto;
    padding: 10px 16px;
    font-size: 16px !important;
    line-height: 22px;
    font-family: 'DMSans-Regular';
    margin-right: 8px;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 0;
    margin-top: 8px;
    transition: background 150ms ease-in, border 150ms ease-in, color 150ms ease-in;
    text-align: center;
}


.page .question .answer-options .item.yesno label:not(.switch):not(.normal):hover {
    border-radius: 100px;
    border: 1px solid var(--light-blue, #DAE3E5);
    background: var(--light-blue-50, #EDF1F2);
}


.page .question .answer-options .item.yesno label:not(.switch):not(.normal) {
    background: #FFFFFF;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    border-radius: 100px;
    width: 288px;
    padding: 10px 16px;
    font-size: 16px !important;
    line-height: 22px;
    font-family: 'DMSans-Regular';
    margin-right: 8px;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 0;
    margin-top: 8px;
    transition: background 150ms ease-in, border 150ms ease-in, color 150ms ease-in;
    text-align: center;
}

.page .question .answer-options label:not(.switch):not(.normal):hover {
    border-radius: 100px;
    border: 1px solid var(--light-blue, #DAE3E5);
    background: var(--light-blue-50, #EDF1F2);
}

/*selected  state*/
.page .question .answer-options label:not(.switch):not(.normal).active {
    border-radius: 100px;
    border: 1px solid var(--dark-orange, #D64204);
    background: var(--dark-orange-10, #FCECE6);
    color: var(--dark-orange, #D64204);
}

/*pressed state*/
.answer-options label:not(.switch):not(.normal):not(.active):active {
    border-radius: 100px;
    border: 1px solid var(--dark-orange, #D64204) !important;
    background: var(--dark-orange-25, #F8D1C0) !important;
    color: var(--dark-orange, #D64204);
}


.page .question .cards .item img {
    height: 50px;
    width: 50px;
    margin: 16px 0;
}

.page .question .cards .item .text {
    clear: both;
    width: 100%;
    text-align: center;
    display: table;
}

/*18032021*/
.page button.btn.btn-primary-next {
    float: right;
    margin-top: 32px;
    border: 0px solid #D64204;
    border-radius: 100px;
    background: #D64204;
    color: white;
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    transition: background-color 0.3s ease;
}

.continuebtnMHC button.btn.btn-primary-next {
    float: right;
    margin-top: 7px;
    border-radius: 100px;
    border-color: #D64204;
    background: transparent;
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    transition: background-color 0.3s ease;
}

    .continuebtnMHC button.btn.btn-primary-next:hover {
        background: #AE411C;
        color: white;
        transition: background-color 0.3s ease;
    }


.page button.btn.btn-primary-next:hover {
    background: #AE411C;
    transition: background-color 0.3s ease;
}

.page button.btn.btn-primary-next.selected {
    background-color: #D64204; /* selected red color */
    transition: background-color 0.15s ease-in;
}

input.form-control {
    height: 48px;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 0 !important;
}


label.switch {
    text-align: left;
    width: 36px;
    height: calc(150px / 2);
    border-radius: 60px;
    display: inline-block;
    position: relative;
    cursor: pointer;
    padding: 0;
    height: 22px;
    top: 6px;
    left: 10px;
    border: 0;
    margin-bottom: 0 !important;
    background: #bebebe;
}

label.active.switch {
    background: #D64204;
}

label.switch > span {
    display: block;
    width: 36px;
    height: 100%;
}

label.switch > input[type="radio"],
label.switch > input[type="checkbox"] {
    opacity: 0;
    position: absolute;
}

label.switch > span:before, label.switch > span:after {
    content: "";
    cursor: pointer;
    position: absolute;
}

label.switch > input[type="radio"]:focus ~ span,
label.switch > input[type="checkbox"]:focus ~ span {
    box-shadow: 0 0 0 4px #43b556;
}

label.switch > input[type="radio"]:checked:focus ~ span,
label.switch > input[type="checkbox"]:checked:focus ~ span {
    box-shadow: 0 0 0 4px #fff;
}

label.switch > span {
    border-radius: 60px;
}

    label.switch > span:before {
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        background-color: #BFBFBF;
        border-radius: 60px;
        transition: opacity .2s ease-out .1s, transform .2s ease-out .1s;
        transform: scale(1);
        opacity: 1;
    }

    label.switch > span:after {
        top: 50%;
        z-index: 3;
        transition: transform .4s cubic-bezier(0.44,-0.12, 0.07, 1.15);
        width: 16px;
        height: 16px;
        transform: translate3d(0, -50%, 0);
        background-color: #fff;
        border-radius: 100%;
        left: 2px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, .3);
    }

label.switch > input[type="radio"]:checked ~ span:before,
label.switch > input[type="checkbox"]:checked ~ span:before {
    transform: scale(0);
    opacity: .7;
}

label.switch > input[type="radio"]:checked ~ span:after,
label.switch > input[type="checkbox"]:checked ~ span:after {
    transform: translate3d(100%, -50%, 0);
    left: 0px;
}

.stack-labels {
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    position: relative;
    top: 8px;
    float: left;
    width: 100%;
}

    .stack-labels .left {
        position: relative;
        left: -15px;
    }

    .stack-labels .right {
        position: relative;
        right: -15px;
    }

.cards.row {
    margin: 0;
}

    .cards.row .item {
        padding: 0 8px 0 0;
    }

.prefer-not-to-say {
    margin-top: 32px;
    float: left;
    font-size: 16px;
    line-height: 24px;
}

.feedback-part1-container .prefer-not-to-say {
    margin-top: 29px;
}

.cards input[type=checkbox] {
    display: none;
}

.page .question .other-option label {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 16px;
    margin-top: 24px;
}

.answer-options {
    float: left;
    width: 100%; /*
    margin-bottom: 24px;
    margin-top: 8px;*/
}

.info {
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #666666;
}

.post-code {
    width: 288px;
    background: #FFFFFF;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    border-radius: 4px;
}

.email, .mobile {
    width: 577px;
    background: #FFFFFF;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    border-radius: 4px;
}

.user-info-container {
    margin-top: 16px;
}

h4 {
    font-size: 24px;
    line-height: 32px;
    font-family: DMSans-Regular;
    font-weight: normal;
}


.question-font {
    font-size: 24px;
    line-height: 31.2px;
    font-family: DMSans-Regular;
    font-weight: 400;
    font-style: normal;
    margin-bottom: 32px;
    margin-top: 0px;
}

.modal-footer {
    border: 0px;
    text-align: center;
}

    .modal-footer .btn, .modal-footer .btn:focus {
        border: 2px solid #D64204;
        box-sizing: border-box;
        border-radius: 100px;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        letter-spacing: 1.25px;
        text-transform: uppercase;
        color: #D64204;
        padding: 18px 84px;
        width: auto;
        font-family: DMSans-Regular;
        background-color: transparent;
        outline: 0;
    }

.traumatic-experience {
    font-size: 16px;
    line-height: 24px;
}

    .traumatic-experience.other {
        font-size: 18px;
        line-height: 28px;
        color: var(--black, #000);
        font-family: "DM Sans";
        font-style: normal;
        font-weight: 400;
        margin-bottom: 16px;
    }

h2 {
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 40px;
    line-height: 56px;
    color: #000000;
}

.report-page h2 {
    margin-top: 64px;
    margin-bottom: 32px;
}

.report-page .error {
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #DE0000;
    position: relative;
    top: 8px;
    padding-left: 10px;
}

    .report-page .error img {
        height: 20px;
        width: 20px;
        margin-right: 8px;
    }

.validation-error {
    background: #FCE6E6;
    border-radius: 4px 4px 0 0px;
    padding: 14px 14px 14px 44px;
    margin-top: 24px;
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #DE0000;
    position: relative;
    float: left;
    clear: both;
    width: 100%;
}

    .validation-error img {
        height: 20px;
        width: 20px;
        position: absolute;
        left: 16px;
        top: 16px;
    }

.feedback-part1-container .validation-error {
    margin-top: 0px;
}

.question.has-error,
.feedback-part1-container .has-validation-error {
    margin-top: 0px;
    border-radius: 0 0 8px 8px;
}

/*Mobile device*/
@media only screen and (max-width: 768px) {
    .img-responsive {
        float: left;
        margin: 10px 0 10px 0;
        height: 65px !important;
        width: 125px !important;
        max-width: 125px !important;
    }

    .error-background-colour {
        background-color: #fce6e6 !important;
        height: 40px !important;
        padding: 0px !important;
        margin-left: 0px !important;
        margin: 0px !important;
        width: 100% !important;
        border-radius: 7px 7px 0px 0px !important;
    }

    input#txtEmail {
        width: 100% !important;
    }

    label.email-report-optional {
        margin-left: 16px !important;
    }

    input.btn.btn-primary.view.send-email-view-btn {
        max-width: 100% !important;
    }

    .radio.feedbackradio {
        margin-left: 24px !important;
    }

    label.chkBoxbtn input[type=checkbox] {
        margin-top: 3px !important;
        height: 18px;
        width: 18px;
        border-radius: 4px;
        outline: 0;
        margin-left: -24px !important;
        margin-right: 10px;
        position: absolute;
    }

    .emailreport label.chkBoxbtn input[type=checkbox], input[type=checkbox]:checked {
        height: 18px;
        background-repeat: no-repeat;
    }

    .feedbackradio.radio.chkbox-lable {
        font-size: 12px !important;
        height: auto !IMPORTANT;
        min-height: 52px !IMPORTANT;
        margin-left: 40px !IMPORTANT;
    }

    .emailreport {
        width: 100% !important;
        height: auto !important;
    }

    .below-checkbox-paragraph {
        height: 104px !important;
        width: 80% !important;
        margin-left: 43px !important;
    }

    .get-help-now, .get-help-now:hover {
        height: 95px;
        width: 95px;
    }

    .vector-upper {
        top: 24px;
        left: 38px;
    }

    .vector-down {
        top: 31px;
        left: 45px;
    }

    .get-help-now .down-arrow {
        left: 43px;
    }

    .get-help-now .text {
        font-family: 'DMSans-Regular';
        font-style: normal;
        font-weight: normal;
        font-size: 10px;
        line-height: 18px;
        text-align: center;
        letter-spacing: 0.25px;
        color: #FFFFFF;
        top: 47px;
    }

    .service-header {
        background-size: 100%;
        font-size: 32px;
        line-height: 40px;
        background-position-y: 1px;
    }

    .page button.btn.btn-primary-next {
        width: 100%;
    }

    .page .question .answer-options.show-in-stack.item-count-5 .item label {
        width: 100%;
        padding: 12px 0;
    }

    .post-code,
    .email,
    .mobile {
        width: 100%;
    }

    .answer-options label.auto-height {
        height: auto;
    }

    .page .question label.switch,
    .feedback-part1-container label.switch {
        float: right;
        position: relative;
        top: -6px;
        left: -5px;
    }

    .feedback-part1-container label.switch {
        top: -2px;
    }

    .page .question .answer-options.prefer-not-to-say .item {
        width: 100%;
    }

    h3 {
        font-size: 24px;
        line-height: 32px;
    }

    .landing-dark-orange {
        padding: 24px 16px;
    }

    .questionbackground-dark-orange {
        padding: 24px 16px;
        margin: 15px;
    }

    .gray-out-text,
    .landing-dark-orange p,
    .orange-cards .item p {
        font-size: 16px;
        line-height: 24px;
    }

    .page .question .cards .item label {
        padding: 0 12px 16px 12px;
    }

    .modal-dialog {
        width: 95% !important;
    }

    h4,
    .question-font {
        font-size: 24px;
        line-height: 32px;
        font-family: DMSans-Regular;
    }

    .modal-body p {
        font-size: 16px;
        line-height: 24px;
    }

    .suvery-container,
    .phq9-feedback-question {
        margin: 15px;
    }

    .feedback-part1-container .suvery-container {
        margin: 0;
        padding: 24px 16px;
    }

    button.btn.btnback, button.btn.btnback:hover {
        width: 100%;
        text-align: start;
        padding-top: 3px;
        color: #000;
        font-family: "DM Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 22px;
        cursor: pointer;
        margin-top: 24px !important;
        margin-bottom: 8px !important;
    }

    .progress-outer-container {
        padding: 0 15px;
    }

    .service-header .col-md-8 {
        padding-left: 0;
    }

    .page .question .btn.btn-primary {
        width: 100%;
    }

    .gray-out-text.feedback {
        font-size: 18px;
        line-height: 28px;
    }

    .report-page h2 {
        font-size: 24px;
        line-height: 32px;
    }

    .report-page .btn.btn-primary.view {
        max-width: 100% !important;
        text-align: center !important;
        margin-left: 0 !important;
    }

    .feedbackbg .gray-out-text {
        font-size: 18px;
        line-height: 28px;
    }

    h2.feedback-page {
        font-size: 24px;
        line-height: 32px;
    }

    .lbl-postcode {
        width: 100%;
    }

    .header-logo-wrapper img {
        position: absolute;
        width: 100%;
        height: auto;
        left: 9px;
        top: 17px;
    }

    .header-logo-wrapperr img {
        position: absolute;
        width: 220px;
        height: 39.79px;
        left: 16px;
        top: 28px;
    }

    .black-dog-logo {
        height: 39.79px;
        left: 16px;
        top: 28px;
        width: 106px;
    }

    .speech-bubbles {
        top: 24px;
        left: 38px;
        width: 18px;
        height: 18px;
    }

    .page .question .answer-options label:not(.switch):not(.normal):hover {
        background: #EDF1F2;
    }

    .page .question .answer-options label:not(.switch):not(.normal).active {
        background: #FCECE6;
        border: 1px solid #D64204;
        color: #D64204;
    }


    a.btn.view-report-btn:hover:before,
    button.btn.btnback:hover:before {
        visibility: hidden;
    }

    .service-header:before {
        height: 100px;
        width: 100px;
        top: 95px;
    }

    .service-header:before {
        /* background: url(../Images/banner_graphic_seperate.svg);*/
        height: 320px;
        display: block;
        background-repeat: no-repeat;
        position: absolute;
        content: "";
    }
}

ul.ui-widget.ui-widget-content {
    width: 288px !important;
    height: 100px;
    overflow-y: scroll;
    overflow-x: hidden;
    background: #FFFFFF;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.ui-widget.ui-widget-content li.ui-menu-item::before {
    display: none;
}

ul li.ui-state-active, ul.ui-widget-content .ui-state-active {
    background: #EEEEEE;
    border: transparent;
    color: black;
    margin: 0;
}

ul.ui-widget.ui-widget-content li {
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #000000;
}

.feedback-part1-container .fa {
    position: absolute;
    top: 3px;
    left: 3px;
    color: #666666;
    height: 18px;
    transform: scale(1.431,1.125);
    width: 18px;
    display: none;
}

    .feedback-part1-container .fa.fa-check-square {
        color: #D64204;
        transform: scale(1.312,1.125);
        height: 18px;
        width: 18px;
        display: none;
    }

.custom-radio-label {
    cursor: pointer;
    display: block;
    position: relative;
    padding-left: 32px;
    margin-bottom: 12px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: all 150ms ease-in;
}

.form-check-input {
    position: absolute;
    opacity: 0;
    height: 0;
    width: 0;
}
/* Hover state for unselected items */
.custom-radio-label:hover .radio-circle:not(:checked) {
    background: #EDF1F2;
}

.radio-circle {
    position: absolute;
    left: 0;
    top: 2px;
    height: 20px;
    width: 20px;
    border: 2px solid #5E5D5D;
    border-radius: 50%;
    background: #FFFFFF;
    transition: all 150ms ease-in;
}

    /* Checkmark symbol */
    .radio-circle::after {
        content: "";
        position: absolute;
        display: none;
        left: 6px;
        top: 2px;
        width: 5px;
        height: 10px;
        border: solid white;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg);
        transition: all 150ms ease-in;
    }

/* Selected state */
input:checked ~ .custom-radio .radio-circle {
    background: #CA3E04;
    border-color: #CA3E04;
}

    input:checked ~ .custom-radio .radio-circle::after {
        display: block;
    }

/* Hover states */
.custom-radio-label:hover .radio-circle {
    border-color: #5E5D5D;
}

.custom-radio-label:hover input:checked ~ .custom-radio .radio-circle {
    background: #CA3E04;
    border-color: #CA3E04;
    transition: border-color 150ms ease-in, background-color 150ms ease-in;
}

/* Pressed state */
.custom-radio-label:active .radio-circle {
    transform: scale(0.95);
    border: 2px solid #CA3E04;
}

/* Special states */
/* Other (green) */
input.other:checked ~ .custom-radio .radio-circle {
    background: #198754;
    border-color: #198754;
}

/* Security (red) */
.security input:checked ~ .custom-radio .radio-circle {
    background: #DC3545;
    border-color: #DC3545;
}

span.radio-circle:active .radio-circle:not(:checked) {
    border: 2px solid #CA3E04;
}
/*jj*/
/*iphone 5*/
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 40/71) and (orientation:portrait) {
    .suvery-container {
        width: 91%;
    }

    .service-header:before {
        height: 100px;
        width: 100px;
    }

    .service-header:before {
        background: url(../Images/banner_graphic_seperate.svg);
        height: 320px;
        display: block;
        background-repeat: no-repeat;
        position: absolute;
        top: 125px;
        content: "";
        width: 320px;
        right: -17px;
    }
}


.feedbackbg h3 {
    margin-bottom: 30px;
}

h2.feedback-page {
    margin-bottom: 20px;
}

input[type=checkbox]:checked {
    background-image: url('../Images/SubCheckIcon.png');
    background-size: 106%;
    outline: 0 solid #E14504;
    outline-offset: 0;
    margin-left: 10px !important;
    width: 17px;
    height: 17px;
    border: none !important;
    -webkit-appearance: none;
    border-radius: 3px;
}

.demographic label.chkBoxbtn input[type=checkbox],
.page .question.demographic label.chkBoxbtn {
    margin-bottom: 0 !important;
}

.page .question.demographic .radio.feedbackradio {
    margin-top: 16px !important;
    margin-bottom: 0 !important;
}

.page .question.demographic p.info {
    margin-bottom: 8px;
}

div.page .question div.item.last-item-for-age label {
    margin-right: 0px;
}

h4.margin_bottom_10 {
    margin-bottom: 10px;
}

p.question_instructions {
    font-size: 16px;
    line-height: 24px;
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    color: #000000;
}

p.youthtext {
    font-size: 18px;
    line-height: 28px;
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    color: #000000;
}


label.email-report-optional {
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    letter-spacing: 0px;
    text-align: left;
    font-family: DMSans-Regular;
    margin: 24px 0px 24px 24px;
}

.emailreport {
    left: 267px;
    top: 503px;
    background: #EDF1F2;
    border-radius: 0px 0px 7px 7px;
    margin: 50px 0 0 0;
    margin-bottom: 32px;
}

span.email-optional {
    font-family: 'DMSans-Regular';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0px;
    color: black;
    text-align: left;
    padding-left: 8px;
}

input#txtEmail {
    height: 48px;
    width: 100%;
    border: 1px solid;
    border-radius: 4px;
}

.chkbox-lable {
    font-family: 'DMSans-Regular';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0px;
    text-align: left;
    height: 24px;
    color: black;
    margin-left: 27px;
    padding: 0px;
    margin-bottom: 4px !important;
}

.below-checkbox-paragraph {
    font-family: 'DMSans-Regular';
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    letter-spacing: 0.25px;
    text-align: left;
    margin-left: 56px;
    height: 36px;
    color: black;
    width: 616px;
}

label.chkBoxbtn.ng-binding {
    margin-bottom: 0px !important;
}

.col-md-12.below-checkbox-paragraph {
    padding: 0px;
}

.email-text-label {
    padding-left: 0px;
    margin-left: 24px;
}

input.btn.btn-primary.view.send-email-view-btn {
    height: 60px;
    max-width: 288px;
    left: 0px;
    top: 0px;
    border-radius: 100px;
    font-size: 14px;
    font-family: 'DMSans-Regular';
    background: #D64204;
    color: #FFFFFF;
}

/*18032021*/
a.btn.btn-primary.view.view-report-btn {
    font-family: 'DMSans-Regular';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0px;
    text-align: left;
    height: 24px;
    max-width: 340px;
    left: 0px;
    top: 0px;
    text-transform: none;
    border: none;
    color: black;
    margin-bottom: 38px;
    text-decoration: none;
    margin-left: 32px;
    background-color: transparent;
}

    a.btn.btn-primary.view.view-report-btn:hover {
        background: transparent;
        color: #000;
    }

a.No-thanks-btn {
    position: relative;
}

    a.No-thanks-btn:before {
        content: "";
        position: absolute;
        width: 0;
        height: 2.6px;
        bottom: -10px;
        left: 11px !important;
        background-color: #D64204;
        visibility: hidden;
        transition: all 0.3s ease-in-out;
    }

    a.No-thanks-btn:hover:before {
        visibility: visible;
        width: 78%;
    }



a.view-report-btn-hover:before {
    content: "";
    position: absolute;
    width: 0;
    height: 2.6px;
    bottom: -10px;
    left: 0px !important;
    background-color: #D64204;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}

a.view-report-btn-hover:hover:before {
    visibility: visible;
    width: 78% !important;
}


a.No-thanks-btn:hover .No-thanks-btn-icons {
    padding-left: 5px;
}




a.view-report-btn {
    position: relative;
}

    a.view-report-btn:before {
        content: "";
        position: absolute;
        width: 0;
        height: 3px;
        bottom: -10px;
        left: 12px;
        background-color: #D64204;
        visibility: hidden;
        transition: all 0.3s ease-in-out;
    }

a.view-report-btn-go:before {
    content: "";
    position: absolute;
    width: 0;
    height: 3px;
    bottom: -10px;
    left: 1px !important;
    background-color: #D64204;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}

a.view-report-btn:hover:before {
    visibility: visible;
    width: 71%;
}

a.view-report-btn-go:hover:before {
    visibility: visible;
    width: 78% !important;
}

a.view-report-btn:hover .view-report-icon {
    padding-left: 5px;
}
/*BUS-500 Ends*/
a.btn.btn-primary.view.view-report-btn span {
    color: #D64204;
    font-size: 22px;
    position: relative;
    top: 0;
    padding-left: 10px;
}

.error-background-colour {
    background-color: #ffcaca;
    height: 40px;
    padding: 0px;
    width: 906px;
    margin: 0px;
    border-radius: 7px 7px 0px 0px;
}

.col-md-8.col-md-offset-2.padding-bottom {
    padding-bottom: 128px !important;
}

.report-page .btn.btn-primary.view.padding0 {
    padding: 0 !important;
    text-align: left !important;
}






.footer_div {
    font-style: normal;
    font-weight: normal;
    background-color: #F5F8F8;
    color: #000000;
    text-align: left;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

hr.hrtage {
    border: 1px solid #BFBFBF;
    margin-top: 24px;
    margin-bottom: 24px;
}

.body-content-2 {
    margin-top: 24px;
}

.copyright-div {
    margin-bottom: 30px;
}

.footer-text-size-design {
    color: var(--Neutrals-text, #000) !important;
    font-family: "DM Sans" !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.25px !important;
}

.Privacy-span {
    margin-right: 40px;
}

.footer-text-color {
    color: black;
}

.body-content-a {
    height: 21px;
    top: 1729px;
}

.footer-text-color a {
    color: black;
    width: 92px;
    height: 21px;
    text-decoration: none;
    text-decoration-line: underline;
    font-family: 'DMSans-Regular' !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px;
    letter-spacing: 0.25px !important;
    text-align: left;
}

.terms-of-Use {
    width: 87px !important;
    height: 21px !important;
}

.footer-text-contant-size-design {
    color: var(--Neutrals-text, #000) !important;
    font-family: "DM Sans" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 28px !important;
}

.body-content-1 {
    margin-top: 37px;
}

.footer-text-contant-size {
    color: var(--Neutrals-text, #000);
    font-family: "DM Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    display: flex;
    max-width: 906px;
}



.footer-text-size {
    color: var(--Neutrals-text, #000);
    font-family: "DM Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    letter-spacing: 0.25px;
    display: flex;
    max-width: 584px;
}

.question {
    color: var(--Primary-Black, rgba(0, 0, 0, 0.95));
    font-family: "DM Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    padding-bottom: 11px;
}

.failuredown {
    padding-bottom: 32px;
}

    .failuredown .family {
        color: var(--Primary-Black, rgba(0, 0, 0, 0.95));
        font-family: "DM Sans";
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 28px;
    }

.opposite {
    padding-bottom: 32px;
}

    .opposite .questionRestless {
        color: var(--Primary-Black, rgba(0, 0, 0, 0.95));
        font-family: "DM Sans";
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 28px;
    }

.copyright-div span {
    width: 327px;
    height: 18px;
    top: 1782px;
    font-family: 'DMSans-Regular' !important;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    line-height: 18px;
    letter-spacing: 0.25px;
    text-align: left;
    color: #666666;
}


.back-button-arrow {
    margin-top: -5px;
}


@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .service-header:before {
        background: none !important;
    }
}

.margin-top-10 {
    margin-top: 10px;
}

.input-height-40 {
    height: 40px !important;
    width: 250px !important;
}

.margin-right-1 {
    margin-right: 1px;
}

/*BUS-626 Starts*/
@media (min-width: 1200px) {
    .loginform-main-div {
        width: 1109px;
    }
}

.message-color {
    color: red;
}

.margin-top-5 {
    margin-top: 40px !important;
}


.login-background_transparent-color {
    background: #D64204 !important;
    color: white !important;
    border: 2px solid #D64204 !important;
}

    .login-background_transparent-color:hover {
        background: #AE411C !important;
        color: white !important;
        border: 2px solid #AE411C !important;
    }

.btn-primary.background_transparent-color {
    background: #D64204 !important;
    color: white !important;
    border: 2px solid #D64204 !important;
}

    .btn-primary.background_transparent-color:hover {
        background: #AE411C !important;
        color: white !important;
        border: 2px solid #AE411C !important;
    }

.background_color_transparent {
    background: #D64204 !important;
    color: white !important;
    border: 2px solid #D64204 !important;
}

.btn-primary.background_transparent {
    background: transparent !important;
    color: #D64204 !important;
    border: 2px solid #D64204 !important;
}

    .btn-primary.background_transparent:hover {
        background: #AE411C !important;
        color: white !important;
        border: 2px solid #AE411C !important;
    }

.padding-left-0 {
    padding-left: 0px;
}

.testusertext {
    color: #D64204;
    font-size: 18px;
}

/*BUS-626 Ends*/

.feedback-part1-container .suvery-container.first_suvery_container {
    margin-bottom: 20px;
}

.suvery-container .track_mental_health .feedback-part1-qtext.feedback-part1-qtext2 {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: 500;
    font-size: 16px !important;
    line-height: 22px !important;
    color: #000000;
}

.suvery-container .track_mental_health .feedback-part1-qtext {
    line-height: 22px !important;
    color: #000000;
    font-weight: 400;
}

.error-background-colour-feedback {
    background-color: #ffcaca;
    height: 40px;
    padding: 0px;
    width: 413px;
    margin: 0px;
    border-radius: 7px 7px 0px 0px;
    padding-top: 7px;
}


.feedback-error {
    font-family: DMSans-Regular;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #DE0000;
    position: relative;
    /* top: 8px;*/
    padding-left: 10px;
}

.feedback-part1-disclaimer {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 13px !important;
    line-height: 24px !important;
    color: #666666;
    margin-bottom: 24px;
}

/*04-01-23*/

a.view-newss-report-btn {
    position: relative;
}

    a.view-newss-report-btn.view-newss-report-btn-go:hover .view-report-icon {
        padding-left: 5px !important;
    }

a.btn.view-newss-report-btn:hover:before,
button.btn.btnback:hover:before {
    visibility: hidden;
}

a.btn.btn-primary.view.view-newss-report-btn:hover {
    background: transparent;
    color: #000;
}

a.btn.btn-primary.view.view-newss-report-btn span {
    color: #D64204;
    font-size: 22px;
    position: relative;
    top: 0;
    padding-left: 10px;
}

a.view-newss-report-btn:before {
    content: "";
    position: absolute;
    width: 0%;
    height: 3px;
    bottom: -10px;
    left: 12px !important;
    background-color: #D64204;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}

a.btn.btn-primary.view.view-newss-report-btn {
    font-family: 'DMSans-Regular';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0px;
    text-align: left;
    height: 24px;
    max-width: 528px;
    left: 0px;
    top: 0px;
    text-transform: none;
    border: none;
    color: black;
    margin-bottom: 38px;
    text-decoration: none;
    margin-left: 32px;
    background-color: transparent;
}

a.view-newss-report-btn:hover:before {
    visibility: visible !important;
    width: 71% !important;
}

a.view-newss-report-btn-go:before {
    content: "";
    position: absolute;
    width: 0;
    height: 3px;
    bottom: -10px;
    left: 0px !important;
    background-color: #D64204;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}

a.view-newss-report-btn-go:hover:before {
    visibility: visible;
    width: 76% !important;
}

.answer-options .roleAtEWS-box {
    visibility: visible;
    border-radius: 4px;
    border: 1px solid var(--Neutrals-border, #D3D3D3);
    background: var(--white, #FFF);
    box-sizing: border-box;
    width: 240px;
    padding: 12px 18px;
    font-size: 16px;
    line-height: 24px;
    font-family: 'DMSans-Regular';
    margin-top: 8px;
    margin-left: 0px;
}

    .answer-options .roleAtEWS-box.ng-not-empty {
        color: var(--Neutrals-text, #000);
        font-family: "DM Sans";
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
    }

    .answer-options .roleAtEWS-box.ng-empty {
        color: var(--Neutrals-text-disabled, #B7B7B7);
        /* desktop/text/text-sm/regular */
        font-family: "DM Sans";
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px; /* 142.857% */
    }

.printMe .centered-text {
    color: #000;
    text-align: center;
    font-family: "DM Sans";
    font-size: 16px !important;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}

.printMe .additional-text {
    color: #706F6F;
    text-align: center;
    font-family: "DM Sans";
    font-size: 14px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

@media (max-width:470px) {
    .bodycontent.container-fluid .service-header .body-content {
        padding-bottom: 0;
        margin-top: 0px;
    }

    .emailreport {
        padding: 0 18px 0 28px !important;
    }

    .skeleton {
        background-color: #d3d9db;
        color: transparent;
        width: 222px !important;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
    }


    .header-image-replaced:before {
        background: url('') !important;
        background-repeat: no-repeat !important;
    }

    .service-header:before {
        height: 100px;
        width: 169px !important;
        top: 95px;
        margin-right: 0px;
    }

    .header-image-replaced:before {
        background: url('') !important;
        background-repeat: no-repeat !important;
    }
}

.skeleton {
    background-color: #d3d9db;
    color: transparent;
    width: 489px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.design {
    height: 28px;
    background-color: #E8E8E8;
}


.header-image-replaced:before {
    background: url(../Images/header-images.svg) !important;
    background-repeat: no-repeat !important;
}

p.centered-text {
    color: #000;
    text-align: center;
    font-family: "DM Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}

p.additional-text {
    color: var(--Neutrals-text-weak, #706F6F);
    text-align: center;
    /* desktop/text/text-sm/regular */
    font-family: "DM Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
}

.printMe .centered-text {
    color: #000;
    text-align: center;
    font-family: "DM Sans";
    font-size: 16px !important;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}

.printMe .additional-text {
    color: #000;
    text-align: center;
    font-family: "DM Sans";
    font-size: 14px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.body-content.skeleton {
    background-color: #d3d9db;
    color: transparent;
    width: 489px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

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

.popup-content {
    background-color: white;
    width: 100%;
    max-width: 372px;
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-top: 32px;
    padding-bottom: 22px;
    padding-left: 16px;
    padding-right: 16px;
}

@media (max-width: 767px) {
    .popup-content {
        max-width: 342px;
        padding-top: 32px;
        padding-bottom: 22px;
        padding-left: 16px;
        padding-right: 16px;
    }
}


.under18-warning {
    border-radius: 100px;
    border: 1px solid var(--Danger-border, #FF2525) !important;
    background: var(--Danger-background, #FFF0F0) !important;
    padding: 4px 8px;
    border-radius: 4px;
    display: inline-block;
    color: #000000 !important;
}

.disablechips {
    pointer-events: none;
}

.disablechipbtn {
    background-color: #B7B7B7 !important;
}


.blackdogmaindiv {
    margin-left: 0px;
    margin-right: 0px;
}

.engagement_type {
    margin-left: 0px;
    margin-top: -11px;
}

.engagement_type_text {
    margin-top: 10px;
    font-size: 14px;
}

.engagement_type div .no-margin-left {
    margin-left: 0px !important;
}

.MHC_Block {
    height: auto;
    margin-top: 18px;
    display: flex;
    width: 100%;
    padding: 32px 0px 48px 7px;
    flex-direction: column;
    align-items: flex-start;
}


.MHCtexts {
    font-size: 16px;
    line-height: 30px;
    color: #000;
}

.MHCheadingdiv {
    margin-bottom: 16px;
}

.MHCheading {
    color: var(--black, #000);
    font-family: "DM Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
}


.MHCdivfirst {
}

.MHCdivsecond {
}

.MHCdivthird {
}

.modalheader {
    position: relative;
    padding: 15px;
}

.modal-custom {
    max-width: 564px;
    margin: auto;
}

.questionSeventeen {
}

.modal-content_confidential {
    border-radius: 8px;
    padding: 32px;
}

.modal-dialog-centered {
    display: flex;
    align-items: center;
    min-height: 100vh;
}

.modalbody button {
    padding: 10px 20px;
    cursor: pointer;
    border: 2px solid #D64204;
}

    .modalbody button:active, .modalbody button:hover {
        width: 100% !important;
        outline: 0 !important;
        border: 2px solid #D64204 !important;
        box-sizing: border-box !important;
        border-radius: 100px !important;
        color: #FFFFFF !important;
        font-family: 'DMSans-Regular' !important;
        font-weight: 500 !important;
        font-size: 14px !important;
        line-height: 20px !important;
        text-align: center !important;
        letter-spacing: 1.25px !important;
        text-transform: uppercase !important;
        background-color: #D64204 !important;
    }

._confidential_header_text {
    color: var(--black, #000);
    font-family: "DM Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
}

._confidential_body_text {
    color: var(--black, #000);
    font-family: "DM Sans";
    font-size: 17px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 28px !important;
}

.role_at_EWS_types {
    width: 10px !important;
    display: block !important;
    visibility: visible !important;
}

.role_at_EWS_types_div {
    display: flex;
    gap: 10px;
    min-width: 400px;
    justify-content: start;
    text-align: start;
}

    .role_at_EWS_types_div:hover {
        cursor: pointer;
    }


.square-radio {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 12px !important;
    height: 12px;
    border: 1px solid black;
    display: inline-block;
    border-radius: 0;
    position: relative;
    cursor: pointer;
    vertical-align: middle;
}

.role_at_EWS_types.square-radio:checked {
    background-image: url(../Images/vectorIcons.svg) !important;
    background-repeat: no-repeat;
    background-position: 0px;
    background-size: 18px 18px;
    width: 19px !important;
    height: 19px !important;
    margin-left: 8px !important;
    margin-right: -5px;
    margin-top: 1px;
    outline-offset: -4px !important;
}

.role_at_EWS_types.square-radio.preferid:checked {
    background-image: url(../Images/vectorIcons.svg) !important;
    background-repeat: no-repeat;
    background-position: 0px;
    background-size: 18px 18px;
    border-radius: 17%;
    width: 19px !important;
    height: 19px !important;
    margin-left: -3px !important;
    margin-right: -5px;
    margin-top: 1px;
    outline-offset: -4px !important;
}

.role_at_EWS_types.role_at_EWS_types_Experience.square-radio:checked {
    background-image: url(../Images/vectorIcons.svg) !important;
    background-repeat: no-repeat;
    background-position: 0px;
    background-size: 18px 18px;
    border-radius: 17%;
    width: 19px !important;
    height: 19px !important;
    margin-left: -3px !important;
    margin-right: -4px;
    margin-top: 1px;
    margin-bottom: 13px !important;
}

.square-radio:focus {
    /* outline: 1px solid #D64204 !important;*/
    /*outline: 1px solid #000 !important;*/
    outline-offset: -10px !important;
}

.square-radio:checked::before {
    content: '' /*'✔'*/;
    position: absolute;
    top: -47%;
    left: -4%;
    width: 0px;
    height: 0px;
    background-color: white;
    color: white;
}


/*.page .question.questioning.ques {
    background-color: #FFFFFF;*/ /*NEWSS-183*/
/*border-radius: 0px;
    margin-top: 8px;
    float: left;
    width: 100%;
    border-bottom: 2px solid #D3D3D3;
}*/

.page .question.questioning.ques {
    background-color: #FFFFFF;
    border-radius: 0px;
    margin-top: 0px;
    float: left;
    width: 100%;
    border-bottom: 2px solid #D3D3D3;
}

.Pleasecheckallthatapply {
    color: var(--black, #000);
    font-family: "DM Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}




.tooltip-container {
    display: inline-block;
    margin-right: 8px;
    cursor: pointer;
    max-width: 220px;
    float: right;
}

#FireServices {
    margin-top: -9px;
}

#Police {
    margin-top: -9px;
}

#WildlifeRescue {
    margin-top: -9px;
}



.custom-tooltip {
    overflow-wrap: break-word;
}

.info-icons {
    color: #5E5D5D;
    border-radius: 50%;
    width: 19px;
    height: 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    background: white;
    border: 2px solid #5E5D5D;
    margin-left: 5px;

}
.info_custom_icon {
    border-radius: 50%;
    width: 19px;
    height: 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    margin-left: 1px !important;
    border: 2px solid rgb(214, 66, 4) !important;
    background: transparent !important;
    color: #D64204 !important;
}

.checktext {
    color: var(--Neutrals-text, #000);
    font-family: "DM Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
}

.custom-tooltip {
    position: absolute;
    visibility: hidden;
    background-color: #F2F4F7;
    color: black;
    text-align: center;
    padding: 24px 14px;
    border-radius: 11px;
    max-width: 250px; /* Set a max-width */
    word-wrap: break-word; /* Wrap long words */
    white-space: normal; /* Allow normal line breaks */
    z-index: 1;
    bottom: 125%;
    left: 50%;
    font-family: DMSans-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
    white-space: nowrap;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

    .custom-tooltip::before {
        content: "";
        position: absolute;
        bottom: -15px;
        left: 50%;
        transform: translateX(-50%);
        border-width: 8px;
        border-style: solid;
        border-color: #F2F4F7 transparent transparent transparent;
    }

.tooltip-container:hover .custom-tooltip,
.tooltip-container:focus .custom-tooltip,
.tooltip-container.clicked .custom-tooltip {
    visibility: visible;
    display: block;
    opacity: 1;
}

.tooltip-container:hover .info-icons,
.tooltip-container:focus .info-icons,
.tooltip-container.clicked .info-icons {
    background: #FEE1D5;
    border: 2px solid #CA3E04;
    color: #CA3E04;
}

.tooltip-inner {
    max-width: none !important;
    white-space: normal !important;
    max-width: 396px !important;
    min-width: 288px;
    width: max-content;
    height: auto;
    background-color: #F2F4F7;
    color: #000;
    min-height: 52px;
    text-align: start;
    align-content: center;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
    padding: 24px 14px;
    z-index: 9999;
}

.tooltip.top {
    padding: 5px 0;
    margin-top: -3px;
    left: 0px !important;
    padding-left: 17px;
}

.traumaskip_btn {
    margin-left: -9px;
}

.webmobile {
    padding: 32px 32px 48px 32px;
}

@media only screen and (min-width: 600px) {
    .engagement_type .subcheckbox:hover {
        background-color: #c1ced1;
        border-radius: 8px;
    }
}

@media only screen and (max-width: 600px) {
    .engagement_type .hover-enabled:hover {
        background-color: #c1ced1 !important;
        border-radius: 8px !important;
    }

    .MHC_Block {
        width: 100% !important;
        padding-left: 16px;
        padding-right: 16px;
    }

    .page .question .answer-options .item label:not(.switch):not(.normal) {
        text-align: left !important;
    }

    .tooltip-inner {
        text-align: start;
        align-content: center;
        white-space: normal !important;
        max-width: 300px !important;
        width: max-content;
        min-height: 52px;
        background-color: #F2F4F7;
        color: #000;
        padding: 8px;
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
        padding: 24px 14px;
        z-index: 1000;
    }

    ._confidential_header_text {
        color: var(--black, #000);
        font-family: "DM Sans";
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 28px;
    }

    .modal-content_confidential {
        padding-left: 16px;
        padding-right: 32px;
        padding-bottom: 48px;
        padding-top: 32px;
    }

    .gotoresourceheader {
        color: var(--black, #000) !important;
        font-family: "DM Sans" !important;
        font-size: 18px !important;
        font-style: normal !important;
        font-weight: 500 !important;
        line-height: 28px !important;
    }

    .MHCheading {
        color: var(--black, #000) !important;
        font-family: "DM Sans" !important;
        font-size: 16px !important;
        font-style: normal !important;
        font-weight: 500 !important;
        line-height: 24px !important;
    }

    .trauma-question-title {
        color: var(--black, #000);
        font-family: "DM Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: 24px;
    }
}

#FireServices .tooltip.top .tooltip-arrow,
.tooltip.bottom .tooltip-arrow {
    left: 36% !important;
    transform: translateX(-50%);
    border-top-color: #F2F4F7;
}

#FireServices .tooltip.left .tooltip-arrow,
.tooltip.right .tooltip-arrow {
    top: 36% !important;
    transform: translateY(-50%);
    border-top-color: #F2F4F7;
}

#Police .tooltip.top .tooltip-arrow,
.tooltip.bottom .tooltip-arrow {
    left: 31% !important;
    transform: translateX(-50%);
    border-top-color: #F2F4F7;
}

#Police .tooltip.left .tooltip-arrow,
.tooltip.right .tooltip-arrow {
    top: 31% !important;
    transform: translateY(-50%);
    border-top-color: #F2F4F7;
}


#WildlifeRescue .tooltip.top .tooltip-arrow,
.tooltip.bottom .tooltip-arrow {
    left: 55% !important;
    transform: translateX(-50%);
    border-top-color: #F2F4F7;
}

#WildlifeRescue .tooltip.left .tooltip-arrow,
.tooltip.right .tooltip-arrow {
    top: 55% !important;
    transform: translateY(-50%);
    border-top-color: #F2F4F7;
}


.demographicQues .suvery-container.container-fluid.removesurveycontainer {
    /* padding: 0px 24px 0px 24px; */
}

#q5 {
    position: relative;
}

@media (max-width: 768px) {

    .page .question.questioning.ques {
        border-bottom-width: 2px;
        padding: 32px 24px 16px 0px;
    }
}

.subcheckbox .subcheckboxs:checked {
    background-image: url('../Images/checkbox_subset.png');
    background-size: 100%;
    outline: 0 solid #E14504;
    outline-offset: 0;
    margin-left: 37px !important;
    width: 14px;
    height: 14px;
    border: none !important;
    -webkit-appearance: none;
    margin-top: 10px;
    border-radius: 0px;
}





.optional2 {
    color: var(--Neutrals-text-weak, #706F6F);
    font-family: "DM Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin-left: 10px;
}

.dochealth {
    color: var(--black, #000);
    font-family: "DM Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}


.Experiencing {
    color: var(--Neutrals-text, #000);
    font-family: "DM Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}


.your-class-name {
    margin-bottom: 10px;
}



.itembackground {
    background-color: #EDF1F2;
    padding-top: 16px;
    padding-right: 16px;
    max-width: 500px;
    margin-left: -10px;
    margin-top: -10px;
    overflow: hidden;
    border-radius: 9px;
    padding-bottom: 16px;
}



@keyframes slideDown {
    0% {
        height: 33px;
        overflow: hidden;
    }

    100% {
        overflow: hidden;
        height: 155px;
        opacity: 1;
    }
}

@keyframes slideUp {
    0% {
        height: 155px;
        width: 400px;
        opacity: 1;
    }

    100% {
        height: 33px;
        width: 400px;
    }
}





.itembackground {
    transform-origin: top left;
    animation: slideDown 0.5s ease-out forwards;
}

    .itembackground.hide {
        animation: slideUp 0.5s ease-out forwards;
    }


.itembackground-revers {
    transform-origin: top left;
    animation: slideUp 0.5s ease-out forwards;
}

    .itembackground-revers.hide {
        animation: slideUp 0.5s ease-out forwards;
    }

.role_at_EWS_types_div_experience {
    padding-left: 10px;
    margin-left: -10px;
    max-width: 500px;
}

    .role_at_EWS_types_div_experience:hover {
        background-color: #EDF1F2;
        max-width: 500px;
        border-radius: 15px;
        border-radius: 9px;
        overflow: hidden;
    }


.role_at_EWS_types_div_experiencenew {
    padding-left: 10px;
    margin-left: -10px;
    max-width: 500px;
}

    .role_at_EWS_types_div_experiencenew:hover {
        background-color: #EDF1F2;
        max-width: 500px;
        border-radius: 15px;
        border-radius: 9px;
        overflow: hidden;
    }

.experience_div {
    align-items: center;
    text-align: center;
    align-content: center;
    margin-top: 12px;
    margin-bottom: 4px;
}


.roleAtEWS-box-experience {
    margin-top: -11px;
    margin-bottom: 11px;
}

.traumaprogress {
    margin-bottom: 32px;
    margin-left: 0px;
    margin-top: -48px;
}



.role_at_Services_types {
    display: block !important;
    visibility: visible !important;
    margin-left: 10px !important;
}


    .role_at_Services_types.square-radio:checked {
        background-image: url(../Images/vectorIcons.svg) !important;
        background-repeat: no-repeat;
        background-position: 0px;
        background-size: 18px 18px;
        border-radius: 17%;
        width: 19px !important;
        height: 19px !important;
        margin-left: 8px !important;
        margin-right: -5px;
        margin-top: 1px;
        outline-offset: -4px !important;
        margin-bottom: 13px !important;
    }

.role_at_Services_types_div:hover {
    background-color: #f5f5f5 !important;
    border-radius: 8px;
    cursor: pointer;
    /*max-width: 420px;*/
}


.role_at_Services_types_div {
    display: flex;
    gap: 10px;
    padding: 10px 10px 0 0;
    margin-left: -8px;
    width: 400px;
}

@media (max-width: 768px) {

    .traumaprogress {
        margin-bottom: 32px;
        margin-left: 0px;
        margin-top: 0px;
    }

    .answer-options .item {
        padding-bottom: 0px;
        margin-bottom: 0px;
    }

        .answer-options .item:last-child {
            border-bottom: none;
            margin-bottom: 0;
        }
}

@keyframes slideDownMobile {
    0% {
        width: 250px;
        height: 33px;
        overflow: hidden;
    }

    100% {
        width: 400px;
        height: 150px;
        overflow: hidden;
    }
}

@keyframes slideUpMobile {
    0% {
        /* width: 400px;*/
        max-height: 150px;
        overflow: hidden;
    }

    100% {
        width: 250px;
        max-height: max-content;
        overflow: hidden;
    }
}



.role_at_EWS_types_div_experience_style {
    padding-top: 10px;
    padding-bottom: 0px;
}

.backbtnNinth {
    padding-top: 4px !important;
}


@media (max-width: 600px) {

    .traumawarning button {
        width: 100% !important;
        max-width: 100% !important;
        height: 60px;
        border-radius: 100px;
        border: 1px solid rgb(214, 66, 4);
        background: transparent;
        color: #D64204;
        font-family: "DM Sans", sans-serif;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 1.25px;
        text-transform: uppercase;
        cursor: pointer;
        margin-left: 15px;
        margin-right: 15px;
        margin-bottom: 8px !important;
    }

        .traumawarning button:hover {
            background: #AE411C;
            color: white;
            transition: background-color 0.3s ease;
        }

    .traumawarning {
        justify-content: end;
        display: flex;
    
    }

    /*.btn.btnback.backbtnseventeen {*/
    /*padding-top: 86px;*/
    /*margin-left: -30px;
    }*/

    .backbtnNinth {
        padding-left: 16px;
        margin-top: 0px !important;
    }

    .btn.btnback.backbtnseventeen {
        margin-left: 66px;
        margin-top: 4px;
    }

    .MHC_Block {
        padding: 24px 16px 32px 16px;
    }

    .demographicQues {
        margin-bottom: -30px;
    }

    .hello {
        height: 48px !important;
    }

    .itembackground {
        margin-bottom: -17px !important;
    }

    .continuebtnMHC {
        justify-content: end;
        display: flex;
        margin-top: 24px;
        margin-bottom: 0px !important;
        z-index: 9999;
        margin-left: 0px;
    }

    .role_at_EWS_types_div_experience_style {
        /* padding-top: 11px;
        padding-bottom: 4px;*/
        padding-top: 16px;
        padding-bottom: 16px
    }

    .experience_div {
        align-items: center;
        text-align: center;
        align-content: center;
        margin-top: 16px;
        margin-bottom: 16px;
    }

    .role_at_Services_types_div:hover {
        background: #EDF1F2;
        border-radius: 0px;
        cursor: pointer;
        max-width: 420px;
    }

    .role_at_EWS_types_div_experience:hover {
        background-color: #EDF1F2;
        max-width: 100%;
        border-radius: 15px;
        border-radius: 0px;
        overflow: hidden;
    }

    .role_at_EWS_types_div_experience_style:hover {
        margin-bottom: 0px;
        margin-top: 1px;
    }

    .role_at_EWS_types_div_experiencenew:hover {
        background-color: #EDF1F2;
        max-width: 355px;
        border-radius: 15px;
        border-radius: 9px;
        overflow: hidden;
        margin-bottom: 4px;
        s
    }

    .itembackground {
        transform-origin: top left !important;
        animation: slideDownMobile 0.5s ease-out forwards !important;
    }

        .itembackground.hide {
            animation: slideUpMobile 0.5s ease-out forwards !important;
        }

    .itembackground-revers {
        transform-origin: top left !important;
        animation: slideUpMobile 0.5s ease-out forwards !important;
    }

        .itembackground-revers.hide {
            animation: slideDownMobile 0.5s ease-out forwards !important;
        }

    .confidentialoption {
        /*margin-top: 32px !important;*/
    }

    .role_at_Services_types_div {
        display: flex;
        gap: 10px;
        padding: 16px 16px 16px 0;
        margin-left: -8px;
        width: 100%;
    }

    .page .question label:not(.normal) {
        font-family: 'DMSans-Regular' !important;
        font-style: normal;
        font-weight: 400 !important;
        font-size: 20px !important;
        line-height: 30px !important;
        color: #000;
        margin-top: 8px;
    }



    .page .question label.fontmobilemodify:not(.normal) {
        font-family: 'DMSans-Regular' !important;
        font-style: normal !important;
        font-weight: 400 !important;
        font-size: 16px !important;
        line-height: 22px !important;
        color: #000;
        padding: 10px 16px !important;
    }



    .answer-options label:not(.normal) {
        width: 240px;
        padding: 10px;
        background: #FFFFFF;
        border: 1px solid #BFBFBF;
        box-sizing: border-box;
        border-radius: 100px;
        text-align: left;
        font-family: DMSans-Regular !important;
        font-style: normal;
        font-weight: 400 !important;
        font-size: 16px !important;
        line-height: 22px !important;
        padding: 12px 24px;
        margin-bottom: 8px;
    }



    h4 {
        font-size: 20px !important;
        font-style: normal;
        font-weight: 400 !important;
        line-height: 130% !important;
        font-family: DMSans-Regular;
    }

    .question-font {
        font-size: 20px !important;
        font-style: normal;
        font-weight: 400 !important;
        line-height: 130% !important;
        font-family: DMSans-Regular;
        margin-bottom: 32px;
        margin-top: 0px;
    }

    .last-week {
        font-family: DMSans-Regular;
        font-style: normal;
        font-weight: 400;
        font-size: 16px !important;
        line-height: 24px;
        color: #000000;
        margin-bottom: 16px;
    }

    #FireServices .tooltip.top .tooltip-arrow,
    .tooltip.bottom .tooltip-arrow {
        left: 46% !important;
        transform: translateX(-50%);
        border-top-color: #F2F4F7;
    }

    #FireServices .tooltip.left .tooltip-arrow,
    .tooltip.right .tooltip-arrow {
        top: 46% !important;
        transform: translateY(-50%);
        border-top-color: #F2F4F7;
    }

    #Police .tooltip.top .tooltip-arrow,
    .tooltip.bottom .tooltip-arrow {
        left: 32% !important;
        transform: translateX(-50%);
        border-top-color: #F2F4F7;
    }

    #Police .tooltip.left .tooltip-arrow,
    .tooltip.right .tooltip-arrow {
        top: 32% !important;
        transform: translateY(-50%);
        border-top-color: #F2F4F7;
    }


    #AnimalRescue .tooltip.top .tooltip-arrow,
    .tooltip.bottom .tooltip-arrow {
        left: 60% !important;
        transform: translateX(-50%);
        border-top-color: #F2F4F7;
    }

    #AnimalRescue .tooltip.left .tooltip-arrow,
    .tooltip.right .tooltip-arrow {
        top: 60% !important;
        transform: translateY(-50%);
        border-top-color: #F2F4F7;
    }


    /*.Mentalhealthmaindivs {
        margin-left: 16px !important;
        margin-top: 62px !important;
    }*/

    .Mentalhealthmaindivs {
        margin-left: -5px !important;
        margin-top: 62px !important;
    }

    .optional {
        color: var(--Neutrals-text-weak, #706F6F);
        font-family: "DM Sans";
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        display: block !important;
        margin-left: 1px;
        /*margin-bottom: 8px;*/
    }

    .optional2 {
        display: none !important;
    }

    .your-class-name {
        width: 200px;
    }
}

.modalcontentgotoresource {
    max-width: 554px;
}

.gotoresourceheader {
    color: var(--black, #000);
    font-family: "DM Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
}

.Continuebtn .btn.btn-primary:active, .Continuebtn .btn.btn-primary, .Continuebtn .btn.btn-primary:hover {
    width: 100%;
    height: 60px;
    outline: 0;
    border-radius: 100px;
    color: #FFFFFF;
    font-family: 'DMSans-Regular';
    margin: 0px;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    background-color: #D64204;
}

.Continuebtn .btn.btn-primary {
    width: 100%;
    height: 60px;
    outline: 0;
    color: #D64204;
    font-family: 'DMSans-Regular';
    margin: 0px;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    background-color: #FFFFFF;
    border-radius: 100px;
    border: 2px solid var(--dark-orange, #D64204);
}


.gotoresourcetext {
    color: var(--black, #000);
    font-family: "DM Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.gotoresourcecross {
    color: #D64204;
    text-decoration: none;
    opacity: 1;
    position: absolute;
    margin-left: -41px;
    margin-top: -4px;
}

.gap {
    padding-top: 16px;
}

.quesbackbtn {
    margin-left: -9px;
    JUSTIFY-CONTENT: center;
    DISPLAY: FLEX;
}


.add-other-class {
    background-color: #EDF1F2 !important;
    width: 500px !important;
    border-radius: 15px !important;
    border-radius: 9px !important;
}

.add-One-class {
    background-color: #EDF1F2 !important;
    width: 421px !important;
    border-radius: 15px !important;
    border-radius: 9px !important;
}

@media (min-width: 768px) and (max-width: 1240px) {

    /*.Mentalhealthmaindivs {
        margin-left: 93px !important;
        margin-top: 26px !important;
    }*/

    .Mentalhealthmaindivs {
        margin-left: 11px !important;
        margin-top: 37px !important;
    }
}

@media (max-width: 991px) {

    .quesbackbtn {
        margin-top: -32px;
        margin-left: -11px;
        justify-content: start;
        display: block;
    }

    .itembackground {
        background-color: #EDF1F2;
        padding-top: 10px;
        max-width: 358px;
        /*margin-bottom: 17px;*/
        margin-left: -10px;
        margin-top: -10px;
        overflow: hidden;
        border-radius: 0;
    }

    /*.role_at_EWS_types_div {
        display: flex;
        gap: 10px;
        min-width: 350px;
        justify-content: start;
        text-align: start;
    }*/

    .role_at_EWS_types_div {
        display: flex;
        gap: 10px;
        min-width: 350px;
        justify-content: start;
        text-align: start;
        height: max-content !important;
    }

    .add-other-class {
        background-color: #EDF1F2 !important;
        width: 350px !important;
        border-radius: 15px !important;
        border-radius: 9px !important;
    }

    .add-One-class {
        background-color: #EDF1F2 !important;
        width: 323px !important;
        border-radius: 15px !important;
        border-radius: 9px !important;
    }
}

@media(max-width:1205px) {
    .itembackground {
        background-color: #EDF1F2;
        padding-top: 16px;
        padding-right: 16px;
        max-width: 364px;
        margin-left: -10px;
        margin-top: -14px;
        overflow: hidden;
        border-radius: 0;
        width: auto !important;
        margin-bottom: -4px;
    }
}


.otherstyle {
    padding-bottom: 13px;
    margin-top: 26px;
    margin-left: -76px;
}


@keyframes slideDownsmallermobile {
    0% {
        height: 45px;
        overflow: hidden;
        width: 0px;
    }

    100% {
        overflow: hidden;
        height: 150px;
        width: 352px;
        opacity: 1;
    }
}

@keyframes slideUpsmallermobile {
    0% {
        height: 150px;
        opacity: 1;
    }

    100% {
        height: 45px;
        width: 324px;
    }
}


@media (max-width: 400px) {
    .itembackground {
        margin-bottom: -17px !important;
    }

    .role_at_EWS_types_div_experience_style:hover {
        /*margin-bottom: 3px !important;*/
    }

    .roleatEWSexperiencebottomborder {
        border-bottom: 1px solid #D3D3D3 !important;
        margin-left: -9px !important;
        width: 300px !important;
    }

    /*  .role_at_EWS_types_div_experience:hover {
        background-color: #EDF1F2;
        width: 300px !important;
        border-radius: 15px;
        border-radius: 9px;
    }*/

    .role_at_EWS_types_div_experiencenew:hover {
        background-color: #EDF1F2;
        width: 324px !important;
        border-radius: 15px;
        border-radius: 9px;
    }

    .role_at_Services_types_div:hover {
        background: #EDF1F2;
        border-radius: 0px;
        cursor: pointer;
        width: 300px !important;
    }



    .itembackground {
        background-color: #EDF1F2;
        padding-top: 10px;
        max-width: 300px !important;
        margin-left: -10px;
        margin-top: -15px;
        overflow: hidden;
        border-radius: 0;
        width: 324px !important;
    }


    .itembackground {
        transform-origin: top left;
        animation: slideDownsmallermobile 0.5s ease-out forwards;
    }

        .itembackground.hide {
            animation: slideUpsmallermobile 0.5s ease-out forwards;
        }


    .itembackground-revers {
        transform-origin: top left;
        animation: slideUp 0.5s ease-out forwards;
    }

        .itembackground-revers.hide {
            animation: slideUp 0.5s ease-out forwards;
        }



    .answer-options .roleAtEWS-box {
        visibility: visible;
        border-radius: 4px;
        border: 1px solid var(--Neutrals-border, #D3D3D3);
        background: var(--white, #FFF);
        box-sizing: border-box;
        width: 209px;
        padding: 12px 18px;
        font-size: 16px;
        line-height: 24px;
        font-family: 'DMSans-Regular';
        margin-top: 8px;
        margin-left: 0px;
    }

    .role_at_EWS_types_div {
        display: flex;
        gap: 10px;
        min-width: 300px;
        justify-content: start;
        text-align: start;
    }

    .role_at_EWS_types_div_experience:hover {
        background-color: #EDF1F2 !important;
        border-radius: 15px !important;
        border-radius: 0px !important;
        max-width: 323px;
        width: 300px !important;
        margin-bottom: 0px;
    }


    .otherstyle {
        padding-bottom: 13px;
        margin-top: 26px;
        margin-left: -83px;
    }

    .add-other-class {
        background-color: #EDF1F2 !important;
        width: 242px !important;
        border-radius: 15px !important;
        border-radius: 9px !important;
    }

    .role_at_EWS_types_div_experience.add-other-class.add-another-class {
        background-color: #EDF1F2 !important;
        width: 300px !important;
        border-radius: 15px !important;
        border-radius: 0px !important;
    }

    .add-One-class {
        background-color: #EDF1F2 !important;
        width: 233px !important;
        border-radius: 15px !important;
        border-radius: 9px !important;
    }

    .hello {
        height: 48px !important;
    }
}

/*.hello{
    height:64px !important;
}*/

.subOptionItem {
    cursor: pointer;
    padding-right: 0px;
}

.role_at_EWS_types_div_experience.disable-hover:hover {
    background-color: transparent;
    overflow: unset;
}

label.normal {
    display: flex;
    gap: 10px;
    font-weight: unset;
    margin: 0;
}


.mobilewebcontaining {
    width: 100%;
    height: auto;
}


/*.Mentalhealthmaindivs {
    margin-top: 100px;
    margin-left: 257px;
    display: inline-grid;
}*/

.Mentalhealthmaindivs {
    margin-top: 100px;
    display: inline-grid;
    padding-left: 24px;
    margin-left: 8px;
}


.progressouter {
    padding-left: 0px;
    padding-right: 0px;
}

.confidentialoption {
    margin-top: -12px;
}

h5.responsesConfidential {
    margin-bottom: 0px;
    margin-top: -8px;
}

.subcheckboxsdefault {
    -webkit-appearance: none;
    -moz-appearance: none;
    visibility: visible !important;
    margin-bottom: 5px !important;
    margin-left: 37px !important;
    border-radius: 0px !important;
    width: 12px !important;
    height: 12px !important;
    margin-top: 11px !important;
    border: 1px solid black !important;
}

    .subcheckboxsdefault:focus {
        outline: 0px !important;
    }

#popup {
    display: none;
    position: fixed;
    top: 20%;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border: 1px solid #ccc;
    padding: 107px 160px 107px 160px;
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    width: 100%;
    text-align: center;
    font-family: Arial, sans-serif;
    margin-top: -37px;
    z-index: 1;
    max-width: 590px;
    height: 396px;
}

.popup-contents {
    background-color: white;
    width: 100%;
    max-width: 372px;
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-top: 32px;
    padding-bottom: 22px;
    padding-left: 16px;
    padding-right: 16px;
}

    .popup-contents img {
        width: 62.609px;
        height: 72px;
    }

.progress-wrappers {
    margin-top: 20px;
    text-align: left;
    gap: 7px;
}

.percentage-text {
    color: var(--Neutrals-text-weak, #706F6F);
    text-align: right;
    font-family: "DM Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    text-transform: uppercase;
}

p.centered-texts {
    color: #000;
    text-align: center;
    font-family: "DM Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 4px;
}

.progress-bars {
    max-width: 210px;
    background-color: #F8D1C0;
    border-radius: 5px;
    overflow: hidden;
    height: 8px;
    margin-top: 5px;
}

.progress-fills {
    height: 20px;
    width: 0%;
    background-color: #D64204;
    transition: width 0.3s ease;
}

.final-message {
    display: none;
}

.green-tick {
    display: none;
    width: 50px;
    height: 50px;
}


.my-element.ng-enter {
    opacity: 0;
    transition: opacity 150ms ease-in 50ms;
}

.my-element.ng-enter-active {
    opacity: 1;
}

.my-element.ng-leave {
    opacity: 1;
    transition: opacity 150ms ease-in 50ms;
}

.my-element.ng-leave-active {
    opacity: 0;
}

.Mentalhealthmaindivsdummy {
    display: inline-grid;
    filter: blur(4px);
    margin-left: 169px !important;
}


.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5); /* semi-transparent dark background */
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

body.no-scroll {
    overflow: hidden;
}

.copyright-div-design {
    margin-bottom: 34px !important;
}

.serviceText {
    color: var(--Danger-text, #DE0602);
    font-family: "DM Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding-bottom: 24px;
}


.trauma-question-backbtn-continuebtn {
    /* display: flex;
    height: auto;
    align-items: flex-start;
    gap: 10px;
    align-self: stretch;
    width: 100%;
    margin-left: 9px;
    margin-right: 50px;*/
    display: flex;
    align-items: center;
    gap: 32px;
    align-self: stretch;
}

@media (max-width: 600px) {
    .trauma-tooltip-text::after {
        left: 38% !important;
    }

    .trauma-tooltip-text{
        width: 325px !important;
    }
    .continuebtnMHC button.btn.btn-primary-next {
        float: right;
        margin-top: 8px;
        border-radius: 100px;
        border-color: #D64204;
        background: transparent;
        font-family: 'DMSans-Regular';
        font-style: normal;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        letter-spacing: 1.25px;
        text-transform: uppercase;
        transition: background-color 0.3s ease;
        width: 100%;
        margin-bottom: 8px !important;
    }

    .webmobile {
        padding: 32px 32px 48px 16px;
    }

    .role_at_EWS_types_div_experience {
        padding-left: 10px;
        margin-left: -10px;
        width: 100%;
    }

    .add-other-class.add-another-class {
        background-color: #EDF1F2 !important;
        width: 100% !important;
        border-radius: 15px !important;
        border-radius: 0px !important;
    }

    .quesbackbtn {
        margin-top: -32px;
        margin-left: -46px;
        justify-content: start;
        display: flex;
    }

    .trauma-question-backbtn-continuebtn {
        height: auto;
        align-items: flex-start;
        gap: 10px;
        align-self: stretch;
        width: 100%;
        margin-left: 6px;
        margin-right: 50px;
        flex-direction: column-reverse;
    }

    .removebr {
        display: none;
    }

    .trauma-question {
        background-color: #F6F8F9;
        display: flex;
        height: auto;
        padding: 24px 16px 32px 16px;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        align-self: stretch;
        width: 100%;
        border-radius: 8px;
        width: 95%;
        margin-left: 13px;
        margin-right: 0px;
    }

    .suvery-containerPTS {
        border-radius: 8px;
        padding: 24px 24px 0px 0px;
        margin: 24px 24px 0px 5px;
    }

    .footer-text-size-design {
        color: var(--Neutrals-text, #000) !important;
        font-family: "DM Sans" !important;
        font-size: 12px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 18px !important;
        letter-spacing: 0.25px !important;
        max-width: 584px;
    }

    .footer-text-color-mobile {
        margin-top: 40px;
        margin-bottom: 24px;
    }

    hr.hrtage {
        border: 1px solid #BFBFBF;
    }

    .suvery-container {
        border-radius: 8px;
        padding: 0px 0px 0px 0px;
        margin: 32px 24px 0px 18px;
    }

    .Mentalhealthmaindivsdummy {
        display: inline-grid;
        margin-left: 65px !important;
        margin-top: 10px !important;
        filter: blur(4px);
    }


    .roleatEWSexperiencebottomborder {
        border-bottom: 1px solid #D3D3D3;
        margin-left: -9px;
        /*width: 324px*/
        width: 100%;
    }

    .roleatEWSexperiencebottombordernew {
        border-bottom: 1px solid #D3D3D3;
        margin-left: -9px;
        width: 355px;
    }

    .custom-tooltip {
        max-width: 90vw;
        font-size: 13px;
    }

    h5.responsesConfidential {
        margin-bottom: 0px !important;
        margin-top: 24px !important;
    }

    /*  .engagement_type .subcheckbox:active {
        background-color: #c1ced1 !important;
        border-radius: 0px !important;
    }*/

    #popup {
        display: none !important;
        position: fixed !important;
        top: 39% !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        background: #fff !important;
        border: 1px solid #ccc !important;
        padding: 34px 10.652px 33.116px 9px !important;
        border-radius: 8px !important;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.2) !important;
        width: 288px !important;
        text-align: center !important;
        font-family: Arial, sans-serif !important;
        margin-top: -37px !important;
        z-index: 1 !important;
        max-width: 590px !important;
        flex-direction: column !important;
        height: 248px !important;
        align-items: center !important;
        display: flex !important;
    }

    .progress-wrappers {
        margin-top: 20px;
        text-align: left;
        gap: 7px;
        width: 100%;
        margin-left: 12px;
    }
}


.back_btn_questions {
    padding-top: 0px;
}

.tooltip.in {
    opacity: 1 !important;
}

.quest {
    padding-left: 0px !important;
}


.page .question .answer-options .item.yesno label:not(.switch):not(.normal).active {
    background: #FCECE6;
    border: 1px solid #D64204;
    color: #D64204;
}


.answer-options.answer-options_new label.active {
    background-color: #FCECE6 !important;
    color: #D64204 !important;
    border: 1px solid #D64204 !important ;
}



.trauma-tooltip-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
   /* margin-left: 6px;*/
}

    .trauma-tooltip-container:hover .info-icons,
    .trauma-tooltip-container:focus .info-icons,
    .trauma-tooltip-container.clicked .info-icons {
        background: #FEE1D5;
        border: 2px solid #CA3E04;
        color: #CA3E04;
    }

.trauma-info-icon {
    width: 20px;
    height: 20px;
    background-color: #007BFF;
    color: white;
    font-weight: bold;
    border-radius: 50%;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    display: inline-block;
    font-family: Arial, sans-serif;
}

.trauma-tooltip-text {
    visibility: hidden;
    width: 676px;
    background-color: #F6F8F9;
    color: #000;
    text-align: left;
    border-radius: 5px;
    padding: 23px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -125px;
    opacity: 0;
    transition: opacity 0.3s;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15);
}

.trauma-tooltip-container:hover .trauma-tooltip-text {
    visibility: visible;
    opacity: 1;
}

.trauma-tooltip-text::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 19%;
    color: #F6F8F9;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #333 transparent transparent transparent;
}

.custom_class{
    display: inline-block;
    float: left;
    width: auto;
}

/*backbutton adjust form all  iphone devices*/
@media only screen and (min-device-width: 320px) and (max-device-width: 428px) and (-webkit-device-pixel-ratio: 2), only screen and (min-device-width: 320px) and (max-device-width: 428px) and (-webkit-device-pixel-ratio: 3) {

    .custom_class1 {
        margin-top: 50px !important;
    }    
}
/* tooltip hover background change*/

.role_at_EWS_types_div:hover,
.role_at_EWS_types_div_experience:hover,
.itembackground:hover {
    cursor: pointer;
    background-color: #f5f5f5 !important;
}

.role_at_EWS_types_div:has(.info-icons:hover),
.role_at_EWS_types_div_experience:has(.info-icons:hover),
.itembackground:has(.info-icons:hover) {
    background-color: transparent !important;
}


@media (min-width: 600px) {
    .traumawarning {
        width: 250px;
        height: 60px;
        flex-shrink: 0;
        border-radius: 100px;
        border: 2px solid var(--dark-orange, #D64204);
    }

        .traumawarning button {
            color: var(--dark-orange, #D64204) !important;
            text-align: center !important;
            font-family: "DM Sans" !important;
            font-size: 14px !important;
            font-style: normal !important;
            font-weight: 500 !important;
            line-height: 20px !important;
            letter-spacing: 1.25px !important;
            text-transform: uppercase !important;
        }

        .traumawarning:hover {
            background: #AE411C;
            color: white;
            transition: background-color 0.3s ease;
        }

        .traumawarning:hover button {
            color: white !important;
        }
        
        .traumawarning button:active {
            box-shadow: none;
        }

    .btnskip {
        display: flex !important;
        width: 243px !important;
        height: 24px !important;
        padding-bottom: 2px !important;
        justify-content: flex-end !important;
        align-items: center !important;
    }

    .btncontinue {
        padding-left: 0px;
        padding-right: 0px;
        
    }

    .btncontinuecustom {
        padding-left: 0px;
        padding-right: 0px;
    }

    button.btn.btnback.override-margin {
        margin-top: 0px !important;
    }

    .btncontinuecustm {
        padding-right: 0px !important;
        padding-left: 0px !important;
        margin-left: 50px;
    }
}
    .btn.focus, .btn:focus, .btn:hover {
        color: #333;
        text-decoration: none;
        outline: none !important;
    }

@media (max-width: 768px) and (max-height: 1024px) {
    .btncontinuecustm {
        margin-left: 0px !important;
    }

    .trauma-question-backbtn-continuebtn {
        margin: 0 !important;
    }
}

@media (max-width: 820px) and (max-height: 1180px) {
    .btncontinuecustm {
        margin-left: 0px !important;
    }
}

@media (max-width: 838px) and (max-height: 704px) {
    .trauma-question-backbtn-continuebtn {
        margin-right: 39px;
    }
}


@media (max-width: 976px) and (max-height: 704px) {
    .trauma-question-backbtn-continuebtn {
        margin-right: 50px; 
    }
}
@media (max-width: 987px) and (max-height: 704px) {

    .trauma-question-backbtn-continuebtn {
        margin-right: 39px; 
    }
}

@media (max-width: 912px) and (max-height: 1368px) {

    .trauma-question-backbtn-continuebtn {
        margin-right: 45px; 
    }
}
@media (min-width: 917px) and (max-width: 985px) and (max-height: 1056px) {
   
    .trauma-question-backbtn-continuebtn {
        margin-right: 30px; 
    }
}
@media (min-width: 913px) and (max-width: 989px) and (max-height: 1057px) {

    .trauma-question-backbtn-continuebtn {
        margin-right: 39px; 
    }
}