@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;
}

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

.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 {
    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;
}

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

    .answer-options label:not(.switch):active {
        background: #FCECE6;
        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: 20px;
}

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; /* or inline-block, as appropriate */
}

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

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

div.progress {
    height: 8px;
    width: 100%;
    border: 0;
    margin-bottom: 0px;
    border-radius: 100px;
    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: 500;
    font-size: 18px;
    line-height: 28px;
    color: #000000;
    margin-bottom: 24px;
}

.suvery-container {
    background-color: #EDF1F2;
    border-radius: 8px;
    padding: 24px 24px;
    float: left;
}

/*.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;
}

.bodycontent {
    background-color: #fff;
}

.substitute-heading {
    color: #E14504;
}

.thank-you-for-taking {
    color: #31261D;
    font-size: 28px;
    /*font-weight: bold;*/
    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;
}

.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: 0;
        text-align: left;
        margin-top: 32px;
        font-size: 16px;
        font-family: DMSans-Regular;
        line-height: 24px;
        font-weight: normal;
        color: #000000;
    }

        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+ */
}


@-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;
}

.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);
}

.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%;
}

.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';
    font-style: normal;
    font-weight: normal;
    font-size: 60px;
    line-height: 70px;
    color: #000000;
    text-align: left;
    padding: 90px 0;
    /*  background-image: url('../Images/SimpleContent.svg');*/
    background-image: none;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-color: #edf1f2;
}

    .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: 0px;
    }

.body-content {
    max-width: 906px;
    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;
    /*margin-bottom: 32px;*/
}

.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: normal;
    font-size: 18px;
    line-height: 28px;
    color: #000000;
}

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 {
    font-family: 'DMSans-Regular';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 32px;
    color: #000000;
    margin-bottom: 24px;
}

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

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

.page .question .answer-options.one-per-line label:not(.switch) {
    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 label:not(.switch) {
    background: #FFFFFF;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    border-radius: 100px;
    width: auto;
    padding: 12px 18px;
    font-size: 16px;
    line-height: 24px;
    font-family: 'DMSans-Regular';
    margin-right: 8px;
    margin-bottom: 0;
    margin-top: 8px;
}

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


    .page .question .answer-options label:not(.switch).active {
        background: #FCECE6;
        border: 1px solid #D64204;
        color: #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;
}

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

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;
}
/*.page .question .cards .item img.health-professional {
    width: 38.97px;
    height: 38.87px
}
.page .question .cards .item img.icon_mobileheart {
    height: 41.895835876464844px;
    width: 25.59375px;
}
.page .question .cards .item img.gp-icon-2 {
    height: 30.659996032714844px;
    width: 39.63234329223633px;
}
.page .question .cards .item img.icon_research {
    height: 35.208335876464844px;
    width: 35.135414123535156px;
}
.page .question .cards .item img.icon_mobilesmile {
    height: 41.895835876464844px;
    width: 25.59375px;
}*/
.answer-options {
    float: left;
    width: 100%;
}

.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,
.question-font {
    font-size: 24px;
    line-height: 32px;
    font-family: DMSans-Regular;
    font-weight: normal;
    /* margin-bottom: 26px;*/
}

.progress-outer-container {
    margin-top: 64px;
}

.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;
    }

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% 90px;
        font-size: 32px;
        line-height: 40px;
        padding: 35px 89px 35px 16px;
        background-color: #edf1f2;
    }

    .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: center;
    }

    .progress-outer-container {
        margin-top: 32px;
        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: 193px;
        height: 39.79px;
        left: 16px;
        top: 28px;
    }

    .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):hover {
        background: white;
    }

    .page .question .answer-options label:not(.switch).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;
        /*top: 125px;*/
        content: "";
/*        width: 320px;
        margin-right: -31px;*/
    }
}

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;
    /* identical to box height, or 150% */
    /* black */
    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;
    }

/*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;
    }
}

.bodycontent.container-fluid .body-content {
    margin-top: 58px;
}



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

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

input[type=checkbox]:checked {
    background-image: url('../Images/Vector.svg');
    background-size: 100%;
    outline: 0 solid #E14504;
    outline-offset: 0;
    margin-left: 12px !important;
    width: 14px;
    height: 14px;
    border: none !important;
    -webkit-appearance: none;
}

.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;
}

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

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

.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;
}



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

.footer-text-contant-size {
    font-family: 'DMSans-Regular' !important;
    font-size: 14px;
    font-style: normal;
    width: 554px;
    height: 63px;
    word-spacing: 0px;
    font-weight: 400;
    line-height: 21px;
    letter-spacing: 0px;
    text-align: left;
}



.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;
    /* identical to box height, or 150% */
    /* black-60 */
    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;
    background: #FFFFFF;
    border: 1px solid #BFBFBF;
    box-sizing: border-box;
    width: 240px;
    padding: 12px 18px;
    font-size: 16px;
    line-height: 24px;
    font-family: 'DMSans-Regular';
    margin-right: 8px;
    margin-top: 8px;
}






/*.progress-container {
    background-color: #F8D1C0;
    border-radius: 5px;
    overflow: hidden;
    height: 8px;*/
/* margin: 11px 0; */
/*position: relative;*/
/* width: 210px;*/
/*margin-left: 0px;
    margin-bottom: 16px;
    margin-top: 8px;
}

.progress-bar {
    width: 80%;
    height: 100%;
    background-color: #D64204;
}

.progress-text {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: black;
    font-weight: bold;
}

.progress-image {
    width: 62px;
    height: 72px;
    margin-bottom: 0;
}

.popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 590px;
    height: 396px;
    background-color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    flex-shrink: 0;
    z-index: 1000;
    border-radius: 13px;
    background: var(--BG-Primary, #FFF);
}

.popup-content {
    text-align: center;
    width: 268px;
    margin-top: 107px;
    margin-bottom: 107px;
    margin-right: 161px;
    margin-left: 161px;
}*/


/*.popup-content {
    text-align: center;
    width: 268px;
    margin-top: 107px;
    margin-bottom: 107px;
    margin-right: 161px;
    margin-left: 161px;
}
*/




.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;
       /* width: 200px !important;*/
    }

    .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, #000);
    text-align: center;
    font-family: "DM Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin-top: 2px;
}












.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;
    /* padding: 32px 16px; */
    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;
    }
}