body {
    color: var(--body-color);
    font-family: "Inter", sans-serif !important;
    background: var(--gray-50);
    overscroll-behavior-y: contain;
    overflow-x: hidden;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    background-color: var(--gray-200);
}

::-webkit-scrollbar {
    width: 5px;
    background-color: var(--gray-50);
}

::-webkit-scrollbar {
    height: 4px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: var(--gray-700);
}

p {
    margin: 0px;
}

.heading {
    margin: 0px;
}

img {
    max-width: 100%;
}

/***Fonts css***/
@font-face {
    font-family: "sk-modernistbold";
    src: url("../fonts/sk-modernist-bold-webfont.woff2") format("woff2"),
        url("../fonts/sk-modernist-bold-webfont.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "sk-modernistmono";
    src: url("../fonts/sk-modernist-mono-webfont.woff2") format("woff2"),
        url("../fonts/sk-modernist-mono-webfont.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "sk-modernistregular";
    src: url("../fonts/sk-modernist-regular-webfont.woff2") format("woff2"),
        url("../fonts/sk-modernist-regular-webfont.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

:root {
    --body-color: var(--gray-900);
    --gray-50: #ffffff;
    --gray-100: #fafafa;
    --gray-200: #f5f5f5;
    --gray-300: #f0f0f0;
    --gray-400: #e9e9e9;
    --gray-500: #cccccc;
    --gray-600: #9c9c9c;
    --gray-700: #676767;
    --gray-800: #343434;
    --gray-900: #000000;

    --primary-pink-50: #ffd6e9;
    --primary-pink-100: #ff8ac1;
    --primary-pink-200: #ff6db1;
    --primary-pink-300: #e32f83;
    --primary-pink-400: #a72561;

    --secondary-purple-50: #c09be0;
    --secondary-purple-100: #ac7ad5;
    --secondary-purple-200: #9759cb;
    --secondary-purple-300: #793eab;
    --secondary-purple-400: #5c208d;

    --tertiary-gold-50: #ffe9d0;
    --tertiary-gold-100: #ffe2c0;
    --tertiary-gold-200: #f2c690;
    --tertiary-gold-300: #d7a56a;
    --tertiary-gold-400: #c38d4d;

    --success-green-50: #bff0a8;
    --success-green-200: #378b10;
    --success-green-400: #164103;

    --warning-yellow-50: #fcddae;
    --warning-yellow-200: #ffb800;
    --warning-yellow-400: #cb7a00;

    --danger-red-50: #ffd3d3;
    --danger-red-200: #ff0000;
    --danger-red-400: #ad0000;

    /****var****/
    --xs: 4px;
    --s: 8px;
    --m: 12px;
    --l: 16px;
    --xl: 20px;
    --2XL: 24px;
    --3XL: 32px;
    --4XL: 40px;
    /****var****/

    --PhoneInput-color--focus: #03b2cb;
    --PhoneInputInternationalIconPhone-opacity: 0.8;
    --PhoneInputInternationalIconGlobe-opacity: 0.65;
    --PhoneInputCountrySelect-marginRight: 0.35em;
    --PhoneInputCountrySelectArrow-width: 0.3em;
    --PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);
    --PhoneInputCountrySelectArrow-borderWidth: 1px;
    --PhoneInputCountrySelectArrow-opacity: 0.45;
    --PhoneInputCountrySelectArrow-color: currentColor;
    --PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);
    --PhoneInputCountrySelectArrow-transform: rotate(45deg);
    --PhoneInputCountryFlag-aspectRatio: 1.5;
    --PhoneInputCountryFlag-height: 1em;
    --PhoneInputCountryFlag-borderWidth: 1px;
    --PhoneInputCountryFlag-borderColor: rgba(0, 0, 0, 0.5);
    --PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);
    --PhoneInputCountryFlag-backgroundColor--loading: rgba(0, 0, 0, 0.1);
}

/***All Heading and text css start here ***/
.heading {
    font-family: "sk-modernistbold";
    letter-spacing: 0px;
    color: var(--gray-900);
}

h1,
.h1 {
    /* font-size:40px;
      line-height:48px; */
    font-size: 30px;
    line-height: 36px;
}

h2,
.h2 {
    font-size: 30px;
    line-height: 36px;
}

h3,
.h3 {
    font-size: 28px;
    line-height: 34px;
}

h4,
.h4 {
    font-size: 24px;
    line-height: 29px;
}

.subtitle-1 {
    font-size: 24px;
    line-height: 33px;
    font-family: "Inter", sans-serif;
    font-weight: 500;
    color: var(--gray-900);
}

.subtitle-2 {
    font-size: 20px;
    line-height: 26px;
    font-family: "Inter", sans-serif;
    font-weight: 500;
    color: var(--gray-900);
}

.body-text {
    font-family: "Inter", sans-serif;
    letter-spacing: 0px;
}

.body-text-1 {
    font-size: 18px;
    line-height: 30px;
    font-weight: 500;
}

.body-text-1.semibold-font {
    line-height: 24px;
}

.body-text-2 {
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.body-text-3 {
    font-size: 14px;
    line-height: 22px;
    font-weight: 400;
}

.caption {
    font-family: "Inter", sans-serif;
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
    letter-spacing: 0;
}

.overline {
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
}

.semi-bold-font {
    font-weight: 600;
}

.normal-font {
    font-weight: 400;
}

.medium-font {
    font-weight: 500;
}

.bold-font {
    font-weight: 700;
}

.light-font {
    font-weight: 300;
}

/***All Heading and text css end here ***/

/***Buttons css***/
button:focus {
    box-shadow: none;
    outline: none;
}

.btn,
.primary-small,
.secondary-btn,
.ghost-btn {
    background: var(--gray-900);
    border: 1px solid var(--gray-900);
    border-radius: 50px;
    color: var(--gray-50);
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    padding: 10px 20px;
    min-height: 38px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
}

.btn:hover {
    background: #2b2b2b !important;
    border-color: #2b2b2b !important;
}

/*.btn-active{
  background: var(--gray-700) !important;	
  color: var(--gray-50) !important;
  border-color: var(--gray-700) !important;
  }*/

.add-cat-data-btn button.secondary-btn.btn-active img {
    /* -webkit-filter: invert(100%);
      filter: invert(100%); */
    opacity: 1 !important;
}

.btn.btn-active:hover {
    background: #2b2b2b !important;
    border-color: #2b2b2b !important;
}

.btn:focus,
.btn.focus {
    box-shadow: none;
}

.btn.btn-disabled,
.btn.btn-disabled:focus {
    background: var(--gray-500) !important;
    color: var(--gray-50) !important;
    border-color: var(--gray-500) !important;
    cursor: not-allowed !important;

}

.primary-medium,
.secondary-medium,
.ghost-medium {
    padding: 8px 20px;
    min-height: 41px;
    font-size: 14px;
    line-height: 25px;
}

.primary-large,
.secondary-large,
.ghost-large {
    font-size: 18px;
    line-height: 30px;
    padding: 14px 30px;
    min-height: 58px;
    justify-content: center;
    text-decoration: none !important;
}

.secondary-btn {
    color: var(--gray-900);
    background: unset;
}

.secondary-btn:hover {
    background: var(--gray-900) !important;
    color: var(--gray-50) !important;
    border-color: var(--gray-900) !important;
}

.secondary-btn:hover img {
    -webkit-filter: invert(100%);
    /* Safari/Chrome */
    filter: invert(100%);
}

button.secondary-btn.btn-disabled {
    color: var(--gray-500) !important;
    border: 1px solid var(--gray-500) !important;
    background: unset !important;
    cursor: not-allowed;
}

button.secondary-btn.btn-disabled img {
    opacity: 0.2;
    -webkit-filter: unset;
    filter: unset;
}

.btn-with-icon img,
.btn-with-icon svg {
    margin-right: 8px;
}

.ghost-btn {
    background: 0;
    border: 1px solid transparent;
    color: var(--gray-900);
    cursor: pointer;
}

.ghost-btn:hover {
    border: 1px solid var(--gray-900) !important;
    color: var(--gray-900) !important;
    background-color: unset !important;
}

.ghost-btn.btn-active {
    background: var(--gray-300) !important;
    border: 1px solid var(--gray-900) !important;
    color: var(--gray-900) !important;
}

.ghost-btn.btn-active:hover {
    background: transparent !important;
}

.ghost-btn.btn-disabled {
    background: none !important;
    border: 1px solid transparent !important;
    color: var(--gray-500) !important;
    cursor: not-allowed !important;
}

.ghost-small img,
.primary-small img,
.secondary-small img,
.ghost-small img,
.ghost-small svg,
.primary-small svg,
.secondary-small svg {
    width: 16px;
    height: 16px;
}

.ghost-large img,
.primary-large img,
.secondary-large img,
.ghost-large svg,
.primary-large svg,
.secondary-large svg {
    width: 24px;
    height: 24px;
}

.btn-with-icon-right img,
.btn-with-icon-right svg {
    margin-left: 8px;
    margin-right: 0px;
}

.defefing-question-step-data .btn-with-icon-right svg {
    margin-left: 8px !important;
}

.ghost-btn.btn-disabled img .secondary-btn.btn-disabled img,
.ghost-btn.btn-disabled svg,
.secondary-btn.btn-disabled svg {
    opacity: 0.2;
}

.ghost-btn .gray-50-svg path,
.secondary-btn .gray-50-svg path {
    stroke: var(--gray-900) !important;
}

.secondary-btn:hover .gray-50-svg path,
.secondary-btn:hover .gray-900-svg path {
    stroke: var(--gray-50) !important;
}

.secondary-btn.selected-btn .gray-50-svg path {
    stroke: #fff !important;
}

button.secondary-btn.btn-disabled:hover .gray-50-svg path,
button.secondary-btn.btn-disabled:hover .gray-900-svg path {
    stroke: var(--gray-900);
}

.secondary-btn.btn-active .gray-50-svg path {
    stroke: var(--gray-50);
}

.secondary-btn.btn-active:hover .gray-50-svg path {
    stroke: var(--gray-50) !important;
}

.secondary-btn.btn-active:hover .gray-50-svg path {
    stroke: var(--gray-900);
}

.selected-btn,
.selected-btn:hover {
    background: #378b10 !important;
    color: var(--gray-50) !important;
    border: #378b10 !important;
}

.navy-btn {
    background: #2151f5;
    border-color: #2151f5;
}

.navy-btn:hover {
    background: #2151f5 !important;
    border-color: #2151f5 !important;
}

.selected-btn:hover svg path,
.selected-btn svg path {
    stroke: #fff !important;
}

.selected-btn:hover img {
    -webkit-filter: unset;
    filter: unset;
}

.tester-profile-account-head-wrap .researcher-profile-form-btn button {
    font-family: "Inter", sans-serif !important;
}

.sb-show-main button.secondary-btn.btn-active {
    background-color: #676767 !important;
    border-color: #676767 !important;
}

.sb-show-main button.secondary-btn.btn-active:hover {
    background-color: #000 !important;
    border-color: #000 !important;
}

.sb-show-main .btn-active {
    background: var(--gray-900) !important;
    color: var(--gray-50) !important;
    border-color: var(--gray-900) !important;
}

.researcher-profile-form-btn button.btn.primary-large.no-hover-state {
    width: 179px;
}

.researcher-profile-form-btn button.btn.primary-medium.no-hover-state {
    width: 133px;
}

/***Buttons css***/

/***Toggle button****/
.switch {
    position: relative;
    display: flex;
    height: 32px;
    margin: 0 !important;
    padding: 0;
    cursor: pointer;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-btn-wrap .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    width: 42px;
    height: 24px;
    background: var(--gray-500);
}

.toggle-btn-wrap .slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 2px;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
    top: 2px;
    background-color: var(--gray-50);
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.switch input:checked+.slider {
    background: var(--primary-pink-200);
}

.switch input:checked+.slider:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}

.toggle-btn-wrap .slider.round {
    border-radius: 100px;
}

.toggle-btn-wrap .slider.round:before {
    border-radius: 100%;
}

.toggle-with-label .toggle_btn_label {
    padding-left: 54px;
    position: relative;
    top: 0px;
}

/****Toggle buton css end here*****/

/***Radio Button css start here***/

.radio-btn-wrap {
    display: flex;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    align-items: center;
}

.radio-btn-wrap input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.radio-btn-wrap .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 24px;
    width: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1.5px solid var(--gray-500);
    border-radius: 50%;
}

.radio-btn-wrap input:checked~.checkmark {
    background-color: var(--gray-50);
    border-color: var(--gray-900);
}

.radio-btn-wrap .checkmark:after {
    content: "";
    display: none;
}

.radio-btn-wrap input:checked~.checkmark:after {
    display: block;
}

.radio-btn-wrap .checkmark:after {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--gray-900);
}

/***Radio Button css end here***/

/***Check box css end here***/
.checkbox-wrap {
    display: flex;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    align-items: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.whatsupplabel .checkbox-wrap {
    display: inline-flex;
}

.checkbox-wrap input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkbox-wrap .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    height: 24px;
    justify-content: center;
    width: 24px;
    border: 1px solid var(--gray-500);
    border-radius: 5px;
}

.checkbox-wrap input:checked~.checkmark {
    background-color: var(--primary-pink-200);
    border-color: var(--primary-pink-200);
}

.checkbox-wrap .checkmark:after {
    content: "";
    display: none;
}

.checkbox-wrap input:checked~.checkmark:after {
    display: block;
}

.checkbox-wrap .checkmark:after {
    top: 0;
    width: 13px;
    height: 10px;
    background-image: url(../img/white-check-mark.svg);
    background-repeat: no-repeat;
}

/***Check box css end here***/
/*** Input field css start here***/
.form-control {
    border: 1px solid var(--gray-600);
    border-radius: 10px;
    height: 55px;
    background: unset !important;
    color: var(--gray-900);
    position: relative;
    padding-left: 16px;
    z-index: 1;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400 !important;
}

.form-control:focus,
.focused .form-control {
    box-shadow: none;
    border-color: var(--gray-700);
    color: var(--gray-900);
}

.input-position-relative {
    position: relative;
}

.input-right-icon {
    position: absolute;
    cursor: pointer;
    top: 16px;
    right: 11px;
    z-index: 1;
}

.read-only-field .input-right-icon {
    top: 14.7px;
}

.input-field label {
    position: absolute;
    top: 16px;
    left: 16px;
    width: auto;
    color: var(--gray-600);
    transition: 0.2s all;
    cursor: text;
    margin: 0;
    display: flex;
    align-items: center;
    z-index: -1;
}

.form-control:hover {
    border-color: var(--gray-700);
}

.form-group:hover .control-label {
    color: var(--gray-700);
}

.input-field input:focus~label,
.input-field textarea:focus~label,
.input-field.focused label {
    top: -9px;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-700);
    background: var(--gray-50);
    padding: 0 8px;
    z-index: 1;
    left: 10px;
}

.input-field input:focus~span,
.focused span,
.focused .input-right-icon {
    opacity: 1 !important;
}

.input-with-right-icon .form-control {
    padding-right: 47px;
}

.input-icon {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 0;
    opacity: 0.6;
}

.input-with-icon label {
    padding-left: 35px;
}

.input-with-icon .form-control {
    padding-left: 50px;
}

.textarea-form-group .form-control {
    resize: none !important;
    min-height: 110px;
    padding-top: 16px;
    padding-bottom: 16px;
}

.textarea-form-group .clear {
    display: none !important;
}

.field-error .form-control,
.field-error:hover .form-control {
    border-color: var(--danger-red-200) !important;
}

.form-group {
    max-width: 400px;
}

.read-only-field .form-control {
    border: 1px solid var(--gray-500) !important;
    color: var(--gray-500) !important;
    padding-right: 37px;
    cursor: not-allowed;
}

.read-only-field .control-label {
    color: var(--gray-500) !important;
}

.read-only-field span img {
    opacity: 0.2 !important;
    cursor: not-allowed;
}

.form-group .caption {
    margin-top: 8px;
    color: var(--gray-700);
    display: block;
}

.field-error .caption,
.field-error .input-error {
    color: var(--danger-red-200);
}

.inc-dec-counter {
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    width: 134px;
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    justify-content: space-between;
    background: #f0f0f0;
    overflow: hidden;
}

.inc-dec-counter input,
.inc-dec-counter input:focus {
    background: var(--gray-50);
    border: 0;
    width: 52px;
    height: 40px;
    text-align: center;
    border-left: 1px solid var(--gray-400);
    border-right: 1px solid var(--gray-400);
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-900);
    outline: none;
}

@keyframes InputslideUp {
    0% {
        transform: perspective(400px) rotateY(0);
    }

    100% {
        transform: perspective(400px) rotateY(360deg);
    }
}

.counter-input.slideUp {
    animation: InputslideUp 0.5s ease-in-out forwards;
}

.inc-dec-counter button {
    height: 40px;
    width: 100%;
    border: 0;
    background: unset;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inc-dec-counter button:hover {
    background: var(--gray-500);
}

.dropdown-container .css-1okebmr-indicatorSeparator {
    display: none;
}

.dropdown-container .css-1s2u09g-control {
    border: 1px solid var(--gray-600);
    border-radius: 10px;
    height: 55px;
    box-shadow: none;
}

.dropdown-container .css-t3ipsp-control,
.dropdown-container .css-13cymwt-control {
    border: 1px solid var(--gray-600);
    border-radius: 10px;
    height: 55px;
    box-shadow: none;
}

.dropdown-container .css-1u9des2-indicatorSeparator {
    display: none;
}

.dropdown-container .css-1s2u09g-control:focus,
.dropdown-container .css-1s2u09g-control:hover,
.dropdown-container .css-1pahdxg-control:hover,
.dropdown-container .css-1pahdxg-control:focus,
.dropdown-container.focused .css-1s2u09g-control,
.dropdown-container.focused .css-1pahdxg-control {
    border: 1px solid var(--gray-700) !important;
}

.dropdown-container.field-warning .css-1s2u09g-control:hover,
.dropdown-container.field-warning .css-1pahdxg-control:hover,
.dropdown-container.field-warning .css-1s2u09g-control,
.dropdown-container.field-warning .css-1pahdxg-control {
    border: 1px solid var(--warning-yellow-200) !important;
}

.dropdown-container .css-t3ipsp-control:focus,
.dropdown-container .css-t3ipsp-control:hover,
.dropdown-container .css-t3ipsp-control:hover,
.dropdown-container .css-t3ipsp-control:focus,
.dropdown-container.focused .css-t3ipsp-control,
.dropdown-container.focused .css-t3ipsp-control {
    border: 1px solid var(--gray-700) !important;
}

.dropdown-container.focused .css-1c0arv4-placeholder {
    color: var(--gray-900) !important;
}

.dropdown-container .css-1s2u09g-control .css-1wy0on6,
.dropdown-container .css-tlfecz-indicatorContainer,
.dropdown-container .css-1gtu0rj-indicatorContainer {
    opacity: 1;
    position: relative;
    right: 0px;
}

.dropdown-container .css-1s2u09g-control:hover .css-1wy0on6,
.dropdown-container:hover .css-tlfecz-indicatorContainer,
.dropdown-container:hover .css-1gtu0rj-indicatorContainer {
    opacity: 1;
}

.dropdown-container.focused .css-1s2u09g-control .css-1wy0on6,
.dropdown-container.focused .css-tlfecz-indicatorContainer,
.dropdown-container.focused .css-1gtu0rj-indicatorContainer {
    opacity: 1;
}

.dropdown-container .css-1pahdxg-control,
.dropdown-container .css-1pahdxg-control:focus {
    border: 1px solid var(--gray-600) !important;
    border-radius: 10px;
    height: 55px;
    box-shadow: none;
}

.dropdown-container .css-1pahdxg-control:hover,
.css-1pahdxg-control:hover {
    border-color: var(--gray-700) !important;
}

.dropdown-container .css-1s2u09g-control:hover .css-1c0arv4-placeholder {
    color: var(--gray-900) !important;
}

.dropdown-container .css-1pahdxg-control:hover .css-1c0arv4-placeholder,
.css-1pahdxg-control:hover .css-1c0arv4-placeholder {
    color: var(--gray-900) !important;
}

.dropdown-container.active .css-1s2u09g-control,
.dropdown-container.active .css-1s2u09g-control:focus {
    border: 1px solid var(--gray-900);
}

.dropdown-container.active .css-1s2u09g-control .css-1wy0on6 {
    opacity: 1;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.css-1wy0on6 {
    margin-right: 1px;
}

.css-26l3qy-menu {
    background: var(--gray-50) !important;
    border: 1px solid var(--gray-400) !important;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05) !important;
    border-radius: 10px !important;
    padding: 0px !important;
    overflow: hidden;
    margin: 0px !important;
}

.css-11unzgr,
.css-4ljt47-MenuList,
.css-26l3qy-menu>div {
    padding: 0px !important;
}

.css-11unzgr>div,
.css-4ljt47-MenuList>div,
.css-26l3qy-menu>div>div {
    font-weight: 500 !important;
    font-size: 16px !important;
    line-height: 25px !important;
    padding: 17px 20px !important;
    margin: 0px !important;
    cursor: pointer;
    font-family: "Inter", sans-serif;
    display: flex;
    align-items: center;
}

.country-flag-icon {
    margin-right: 5px;
    position: relative;
    top: 4px;
    width: 24px !important;
}

.css-ackcql,
.css-9gakcf-option,
.css-6j8wv5-Input {
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 24px !important;
    color: var(--gray-900) !important;
    font-family: "Inter", sans-serif;
}

.css-9gakcf-option,
.css-1n7v3ny-option {
    background: unset !important;
}

.css-11unzgr>div:hover,
.css-4ljt47-MenuList>div:hover,
.css-26l3qy-menu>div>div:hover {
    background: var(--gray-200) !important;
}

.css-qc6sy-singleValue,
.css-1s2u09g-control input {
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 24px !important;
    display: flex !important;
    align-items: center !important;
    color: var(--gray-900) !important;
    margin: 0px !important;
    padding-left: 0px;
    font-family: "Inter", sans-serif;
}

.dropdown-container .css-1d8n9bt {
    padding-left: 15px;
}

.dropdown-container .country-dropdown .css-1d8n9bt {
    padding-left: 41px;
}

.dropdown-container.country-with-value .country-dropdown .css-1d8n9bt {
    padding-left: 41px !important;
    display: flex;
}

.dropdown-container.country-with-value .country-dropdown .css-1d8n9bt>svg {
    margin-right: 5px;
    width: 16px !important;
    height: 16px !important;
}

.dropdown-container .country-dropdown .css-1d8n9bt .css-1c0arv4-placeholder {
    margin-left: 0px !important;
    position: absolute;
    left: 0;
    cursor: text;
}

.country-dropdown .css-ackcql,
.country-dropdown .css-1s2u09g-control,
.country-dropdown .css-1c0arv4-placeholder,
.country-dropdown .css-1pahdxg-control {
    cursor: text;
}

.multiselect-dropdown .css-1c0arv4-placeholder,
.multiselect-dropdown .css-ackcql,
.multiselect-dropdown .css-1s2u09g-control,
.multiselect-dropdown .css-1pahdxg-control {
    cursor: pointer !important;
}

.dropdown-container .multiselect-dropdown .css-1d8n9bt {
    padding-left: 15px;
}

.dropdown-container.focused .css-1d8n9bt,
.dropdown-container.active .css-1d8n9bt,
.dropdown-container .css-319lph-ValueContainer {
    padding-left: 16px;
}

.country-dropdown .css-319lph-ValueContainer {
    padding-left: 41px;
}

.country-dropdown .css-319lph-ValueContainer .css-1c0arv4-placeholder {
    margin-left: 0px !important;
    left: 2px !important;
}

.country-dropdown.multiselect-dropdown .css-319lph-ValueContainer .css-1c0arv4-placeholder {
    margin-left: 7px !important;
    left: 9px !important;
}

.dropdown-container .css-11unzgr>div {
    padding: 17px 22px !important;
}

.underline-link:hover {
    text-decoration: underline;
    color: var(--gray-900);
}

.css-1wy0on6 {
    cursor: pointer;
}

.css-1rhbuit-multiValue {
    display: none !important;
}

.country-dropdown .css-1wy0on6,
.country-dropdown .css-1hb7zxy-IndicatorsContainer {
    display: none !important;
}

.country-dropdown .control-label {
    margin-left: 32px;
}

.focused .country-dropdown .control-label {
    margin-left: 0px;
}

.country-dropdown .css-ackcql,
.country-dropdown .css-vwja0k {
    margin-left: 0px !important;
}

.country-dropdown .css-1hwfws3,
.country-dropdown .css-g1d714-ValueContainer {
    padding-left: 41px;
}

.chips-flag svg {
    width: 20px !important;
    height: 20px !important;
    position: relative;
    top: 3px;
    margin-right: 5px !important;
}

.dropdown-chips {
    margin: 8px -5px 0px;
}

.dropdown-chips .chip {
    margin: 4px 5px;
}

.chips-flag {
    position: relative;
    top: -1px;
}

.css-1c0arv4-placeholder {
    margin-left: 34px !important;
    position: absolute;
    left: 9px;
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-600) !important;
}

.css-1hwfws3 .css-1c0arv4-placeholder {
    margin-left: 32px !important;
}

.multiselect-dropdown .css-1c0arv4-placeholder {
    margin-left: 6px !important;
}

.multiselect-dropdown .css-319lph-ValueContainer {
    padding-left: 0px;
}

.multiselect-dropdown .css-1wy0on6,
.multiselect-dropdown .css-1hb7zxy-IndicatorsContainer {
    display: flex !important;
}

.multiselect-dropdown .css-ackcql,
.multiselect-dropdown .css-vwja0k {
    margin-left: 7px !important;
}

/*** Input field css start here***/

/*** Search field css start here***/
.search-input-field .form-control {
    height: 66px;
    color: var(--gray-900);
}

.search-input-field .form-control.body-text-2 {
    font-weight: 500 !important;
    position: relative;
    z-index: 0;
}

.search-input-field.active-search .input-icon {
    opacity: 1;
}

.search-input-field:hover .input-icon {
    opacity: 1;
}

.search-input-field .input-icon,
.search-input-field .input-right-icon {
    top: 50%;
    transform: translateY(-50%);
}

.search-input-field .input-icon {
    opacity: 1;
}

.search-input-field ::placeholder {
    color: var(--gray-600);
    opacity: 1;
}

.search-input-field :-ms-input-placeholder {
    color: var(--gray-600);
}

.search-input-field ::-webkit-input-placeholder {
    color: var(--gray-600);
}

.search-input-field:hover ::placeholder {
    color: var(--gray-700);
    opacity: 1;
}

.search-input-field:hover :-ms-input-placeholder {
    color: var(--gray-700);
}

.search-input-field:hover ::-webkit-input-placeholder {
    color: var(--gray-700);
}

.search-input-field .hover-inline-svg svg path,
.search-input-field .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-700);
}

.active-search .hover-inline-svg svg path,
.active-search .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-900);
}

.active-search .input-icon .hover-inline-svg svg path,
.active-search .input-icon .hover-inline-svg svg .change-stroke,
.search-input-field.focused .input-icon .hover-inline-svg svg path,
.search-input-field.focused .input-icon .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-900) !important;
}

.active-search .input-right-icon .hover-inline-svg svg path,
.active-search .input-right-icon .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-700);
}

.inactive-search .input-icon {
    opacity: 0.1 !important;
}

.inactive-search input:focus~span {
    opacity: 0.1 !important;
}

.inactive-search .form-control {
    border: 1px solid var(--gray-500);
    color: var(--gray-500);
}

.inactive-search ::placeholder {
    color: var(--gray-500);
    opacity: 1;
}

.inactive-search :-ms-input-placeholder {
    color: var(--gray-500);
}

.inactive-search ::-webkit-input-placeholder {
    color: var(--gray-500);
}

.inactive-search:hover ::placeholder {
    color: var(--gray-500);
    opacity: 1;
}

.inactive-search:hover :-ms-input-placeholder {
    color: var(--gray-500);
}

.inactive-search:hover ::-webkit-input-placeholder {
    color: var(--gray-500);
}

.active-search .form-control {
    border: 1px solid var(--gray-700);
}

span.dashboard-search-data-wrap.active-search-1 .form-control {
    border: 1px solid var(--gray-700);
}

.search-input-field .input-icon svg {
    width: 32px;
    height: 32px;
}

.small-search-field .form-control {
    min-height: 55px;
    padding-left: 45px;
    height: auto;
    line-height: 0px !important;
}

.small-search-field .input-icon svg {
    width: 24px;
    height: 24px;
}

/*** Search field css end here***/

/***Icons Css***/
.icon-small {
    width: 16px;
    height: 16px;
}

.icon-medium {
    width: 24px;
    height: 24px;
}

.icon-large {
    width: 32px;
    height: 32px;
}

.icon-extralarge {
    width: 40px;
    height: 40px;
}

.gray-50-svg path {
    stroke: #fff !important;
}

.gray-50-svg circle {
    stroke: #fff;
}

.gray-50-svg circle#Ellipse\ 248 {
    fill: #fff;
}

.inline-svg-- {
    display: flex !important;
    align-items: center;
}

.workspace-menu-btn {
    display: flex;
    align-items: center;
}

.workspace-menu-btn .inline-svg-- {
    display: inline-flex;
    margin-left: 8px;
    position: relative;
    top: 1px;
    width: 18px;
}

.gray-600-svg path {
    stroke: #9c9c9c;
}

.success-200-svg path {
    stroke: #378b10;
}

.success-green-200-svg path,
.success-green-200 path {
    stroke: #378b10;
}

.success-green-400 path {
    stroke: #164103;
}

.gray-700-svg path {
    stroke: #676767 !important;
}

.danger-200-svg path,
.danger-red-200-svg path {
    stroke: #ff0000;
}

.secondry-purple-200-svg path,
.secondary-purple-200 path,
.secondary-purple-200-svg path {
    stroke: #9759cb;
}

.tertiary-gold-200 path {
    stroke: #f2c690;
}

.warning-200-svg path,
.warning-yellow-200-svg path {
    stroke: #ffb800;
}

.pink-200-svg path {
    stroke: #ff6db1;
}

.email-auto-margin svg {
    width: 40px;
    height: 40px;
    margin: 0 auto;
}

/***Toast Message css start here***/
.errortoast {
    box-shadow: none !important;
    max-width: initial !important;
    background: none !important;
    padding: 0px !important;
    border: 0px !important;
    max-width: 1024px !important;
    width: 100% !important;
}

.successtoast {
    box-shadow: none !important;
    max-width: initial !important;
    background: none !important;
    padding: 0px !important;
    border: 0px !important;
    max-width: 1024px !important;
    width: 100% !important;
}

.toast-message-wrap {
    display: flex;
    align-items: center;
    background: var(--gray-500);
    padding: 8px 16px;
    border-radius: 10px;
    color: var(--gray-50);
    min-height: 41px;
    max-width: 100%;
    margin: 0 auto;
    width: 100%;
}

.toast-data {
    padding: 0px 9px;
    width: 100%;
}

.toast-success {
    background: var(--success-green-200);
}

.toast-warning {
    background: var(--warning-yellow-200);
    color: var(--gray-900);
}

.toast-warning .toast-data a {
    color: var(--gray-900);
}

.toast-cross-icon {
    cursor: pointer;
    width: 24px;
    display: flex;
}

.toast-error,
.toast-snowflake {
    background: var(--danger-red-200);
}

.toast-data a {
    color: var(--gray-50);
    text-decoration: underline;
    margin-left: 4px;
}

.toast-error svg path,
.toast-success svg path {
    stroke: #fff !important;
}

.toast-left-icon {
    display: flex;
}

.toast-message-wrap.toast-info.gold-info {
    border: 1px solid#F2C690;
    background: #ffedd9;
}

.toast-warning .link-text {
    color: #9759cb !important;
}

.toast-warning .link-text:hover {
    color: #5c208d !important;
}

/***Toast Message css end here***/

/***Tooltip css start***/
.tooltip-wrapper {
    font-family: "Inter", sans-serif;
    background: var(--gray-900);
    border-radius: 10px;
    color: var(--gray-50);
    padding: 12px 18px;
    width: 301px;
    line-height: 30px;
    font-weight: 400;
    font-size: 16px;
    position: absolute;
    margin-top: 30px;
    margin-left: 50px;
    filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.15));
}

.tooltipChart {
    width: auto;
    white-space: nowrap;
    display: block;
    background: var(--gray-900);
    border-radius: 10px;
    color: var(--gray-50);
    padding: 12px 18px;
}

.likert-scale-aggregated-data .tooltipChart {
    white-space: unset;
}

.pie-chart-box .tooltipChart {
    z-index: 999 !important;
}

.top-tooltip::before {
    content: "";
    position: absolute;
    display: block;
    width: 0px;
    left: 50%;
    top: 6px;
    border: 11px solid transparent;
    border-top: 0;
    border-bottom: 12px solid var(--gray-900);
    transform: translate(-50%, calc(-100% - 5px));
}

.left-tooltip::before {
    content: "";
    position: absolute;
    display: block;
    width: 0px;
    left: 6px;
    top: 50%;
    border: 11px solid transparent;
    border-left: 0;
    border-right: 12px solid var(--gray-900);
    transform: translate(calc(-100% - 5px), -50%);
}

.right-tooltip::before {
    content: "";
    position: absolute;
    display: block;
    width: 0px;
    right: 6px;
    top: 50%;
    border: 11px solid transparent;
    border-right: 0;
    border-left: 12px solid var(--gray-900);
    transform: translate(calc(100% + 5px), -50%);
}

.bottom-tooltip::before {
    content: "";
    position: absolute;
    display: block;
    width: 0px;
    left: 50%;
    bottom: 6px;
    border: 11px solid transparent;
    border-bottom: 0;
    border-top: 12px solid var(--gray-900);
    transform: translate(-50%, calc(100% + 5px));
}

/***Tooltip css end***/

/****Margin classes start***/
.mb-60 {
    margin-bottom: 56px;
}

.mb-40 {
    margin-bottom: var(--4XL);
}

.mt-32 {
    margin-top: var(--3XL);
}

.mb-32 {
    margin-bottom: var(--3XL);
}

.mt-16 {
    margin-top: var(--l);
}

.mb-16 {
    margin-bottom: var(--l);
}

.mt-20 {
    margin-top: var(--xl) !important;
}

.mb-20 {
    margin-bottom: var(--xl) !important;
}

.mb-12 {
    margin-bottom: var(--m) !important;
}

.mt-8 {
    margin-bottom: var(--s);
}

.mb-8 {
    margin-bottom: var(--s);
}

/***Margin classes end*****/

/***Header css start here ***/
.logo svg {
    width: 78px;
}

.header-logout-loader {
    position: fixed;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    top: 0px;
    justify-content: center;
    left: 0px;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 999;
}

.header-logout-loader svg,
.header-logout-loader img {
    width: 70px;
    height: 70px;
}

.header .dropdown.show .dropdown-toggle .workspace-menu-btn .inline-svg-- svg,
.header .dropdown.show .dropdown-toggle .profile-dropdown-icon .inline-svg-- svg {
    transform: rotate(180deg);
}

.header-credit-skeleton {
    margin-right: 8px;
    background-color: #676767 !important;
    --base-color: #656565 !important;
    --highlight-color: #656565 !important;
}

.header-circular-skelton .header-credit-skeleton {
    margin: 0px;
}

.header-circular-skelton span {
    margin-left: -7px !important;
}

.header-circular-skelton {
    position: relative;
    left: 7px;
}

.hdr-workspace-data .dropdown.dropdown {
    display: flex;
    align-items: center;
}

.hdr-workspace-data .circular-name-icon:hover .tooltip-wrapper {
    top: 67px;
    white-space: nowrap;
}

.hdr-workspace-data .circular-name-icon-wrap .circular-name-icon-gray-300 {
    background: #676767;
}

.hdr-workspace-data a {
    text-decoration: none;
}

.header-lhs-side .background-black {
    display: flex;
    align-items: center;
}

.circular-name-icon-wrap {
    display: flex;
    align-items: center;
}

.circular-name-icon-wrap span {
    display: flex;
    width: 32px;
    height: 32px;
    border-radius: 100%;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 1.6px solid var(--gray-900);
    margin-left: -5px;
    font-weight: 600;
    color: var(--gray-50);
    font-size: 16px;
    cursor: pointer;
}

.header .circular-name-icon-wrap span {
    width: 34px !important;
    height: 34px !important;
}

.circular-name-icon:hover .tooltip-wrapper {
    display: block;
    margin: 0px;
    top: 42px;
    width: auto;
    min-width: auto;
    z-index: 99999;
}

.circular-name-icon:hover .tooltip-wrapper p {
    color: #fff;
    padding: 0px;
}

.circular-name-icon-wrap span:first-child {
    margin-left: 0px;
}

.circular-name-icon-primary-gray-300 {
    background: var(--gray-600);
}

.circular-name-icon-gray-50 {
    background: var(--gray-50);
}

.circular-name-icon-gray-300 {
    background: var(--gray-500);
}

.circular-name-icon-primary-pink-300 {
    background: var(--primary-pink-300);
}

.circular-name-icon-secondary-purple-300 {
    background: var(--secondary-purple-300);
}

.circular-name-icon-tertiary-gold-300 {
    background: var(--tertiary-gold-300);
}

.circular-name-icon {
    display: flex;
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 100%;
    align-items: center;
    justify-content: center;
    position: relative;
    font-weight: 600;
    color: var(--gray-50);
    font-size: 16px;
    cursor: pointer;
}

.circular-icon-wrap span:first-child {
    margin-left: 0px;
}

.header {
    background: var(--gray-900);
    padding: 0px 40px;
    color: var(--gray-50);
    min-height: 72px;
    display: flex;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 99;
}

.header.researcher-header.tester-header,
.taking-test-header {
    height: 64px;
    min-height: 64px;
}

.header-lhs-side {
    display: flex;
    align-items: center;
}

.header-inner-data {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-rhs-side {
    display: flex;
    align-items: center;
    /* width: calc(100% - 715px);
      justify-content: end; */
}

.header-rhs-side .menu-mid-links {
    border-bottom: 0px;
}

.tester-header .hamburger-items .dropdown-item:last-child {
    border-bottom: 0px;
}

.header .container {
    max-width: 1920px;
    padding: 0;
}

.hdr-workspace-data {
    display: flex;
    align-items: center;
    padding-left: 22px;
    padding-right: 0;
    border-left: 1px solid var(--gray-700);
    margin-left: var(--3XL);
    position: relative;
    max-height: 40px;
}

.added-workspace-tooltip {
    position: absolute;
    top: 74px;
    left: -30px;
    z-index: 999999 !important;
}

.added-workspace-tooltip .tooltip-wrapper {
    display: block;
    margin: 0px;
    width: 340px;
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.added-workspace-tooltip .tooltip-wrapper svg {
    margin-right: 10px;
}

@keyframes floating {
    from {
        transform: translate(0, 0px);
    }

    65% {
        transform: translate(0, 15px);
    }

    to {
        transform: translate(0, -0px);
    }
}

.header-credits-wrap {
    margin-left: 52px;
    display: flex;
    align-items: center;
}

.header-credits-wrap .header-link:last-child {
    margin-left: 8px;
}

.header-link {
    display: flex;
    align-items: center;
    color: var(--gray-50);
    text-decoration: none;
}

.header-link:hover {
    color: var(--gray-50);
    text-decoration: none;
}

.header-credits-wrap .header-link:first-child {
    margin-right: 48px;
}

.header-link img,
.header-link svg {
    margin-right: 12px;
}

.workspace-dropdown {
    padding-right: 16px;
    display: flex;
    align-items: center;
}

.researcher-header .workspace-dropdown {
    padding-right: 0px;
}

.researcher-header .workspace-dropdown .react-loading-skeleton {
    position: relative;
    top: -2px;
}

.hdr-workspace-data .added-workspace-dropdown .dropdown button,
.header-rhs-side .header-credits-wrap .dropdown button {
    height: 56px !important;
    padding: 0px 10px !important;
    border-radius: 8px !important;
    transition: 0.3s;
}

.hdr-workspace-data .added-workspace-dropdown .dropdown button:hover,
.header-rhs-side .header-credits-wrap .dropdown button:hover {
    background: #2b2b2b !important;
}

.header-skelton-wrap .react-loading-skeleton {
    top: -2px;
}

.researcher-header .circular-name-icon-wrap {
    margin-left: 6px;
}

.researcher-header .circular-name-icon-wrap a span {
    margin-left: -5px;
}

.researcher-header .circular-name-icon-wrap a:hover {
    text-decoration: none;
}

.researcher-header .header-rhs-side .hamburger-items {
    right: 0px;
    top: 2px;
}

.workspace-menu-btn,
.header-credits-wrap dropdown button {
    color: var(--gray-50) !important;
}

.css-tlfecz-indicatorContainer {
    cursor: pointer;
}

.workspace-dropdown img {
    margin-left: 11px;
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.header .secondary-btn {
    color: var(--gray-50);
    background: var(--gray-900);
    border: 1px solid var(--gray-50);
}

.header .secondary-btn:hover,
.header .secondary-btn:focus {
    color: var(--gray-50) !important;
    background: var(--gray-900) !important;
    border-color: var(--gray-50) !important;
    border: 1px solid var(--gray-50) !important;
}

.header .hamburger-items {
    min-width: 226px;
    background: var(--gray-900);
    border: 0;
    padding: 0px 20px;
    top: 8px;
    position: absolute;
}

.header .dropdown-menu {
    top: 64px !important;
    left: -40px !important;
    padding: 0 !important;
    box-shadow: none !important;
    width: auto;
    transform: unset !important;
    white-space: nowrap;
    background-color: unset;
}

.header .hdr-workspace-data .dropdown-menu {
    left: 50% !important;
    transform: translateX(-84%) !important;
}

.header .dropdown.show button {
    color: var(--gray-50) !important;
    background: unset !important;
    border-radius: 0px;
}

.header .scroll-menu button.white-bg-btn,
.white-bg-btn {
    background-color: #fff !important;
    color: #000 !important;
    min-height: auto !important;
    border: 1px solid #fff !important;
}

.header .workspace-dropdown .white-bg-btn {
    color: #000 !important;
}

.header .workspace-dropdown .white-bg-btn:hover {
    background-color: #fff !important;
    color: #000 !important;
    min-height: auto !important;
    border: 1px solid #fff !important;
}

.header .invite-workspace-notifivation .notification-wrap .white-bg-btn:hover {
    background-color: #fff !important;
    color: #000 !important;
    min-height: auto !important;
    border: 1px solid #fff !important;
}

.header .scroll-menu button.white-bg-btn {
    width: 102px;
}

.header .scroll-menu .notification-wrap button {
    font-weight: 500 !important;
    font-size: 12px !important;
    line-height: 17px !important;
    border-radius: 50px !important;
    padding: 10px 20px !important;
    height: auto !important;
}

.header .scroll-menu .notification-wrap .secondary-btn.btn-disabled {
    border: 1px solid #676767 !important;
    color: #676767 !important;
}

.header .dropdown.show .notification-wrap .secondary-btn.btn-disabled svg {
    opacity: 1 !important;
}

.header .scroll-menu .notification-wrap .btn.btn-disabled {
    background-color: #cccccc !important;
    color: #fff !important;
    border-color: #ccc !important;
}

.notification-wrap .btn.btn-disabled .gray-900-svg path {
    stroke: var(--gray-50) !important;
}

.header .dropdown.show .notification-wrap .secondary-btn.btn-disabled svg path {
    stroke: #676767 !important;
}

.notification-wrap button svg {
    width: 16px !important;
    height: 16px !important;
    margin-right: 4px;
}

.notification-wrap .gray-50-svg path {
    stroke: var(--gray-50);
}

.notification-wrap .gray-900-svg path {
    stroke: var(--gray-900) !important;
}

.notification-wrap {
    margin-top: 8px;
    margin-bottom: 24px;
}

.notification-wrap .secondary-btn {
    width: 104.72px;
    border: 1px solid #fff !important;
}

.login-user-thum {
    margin-right: 8px;
}

.profile-dropdown-icon svg {
    width: 18px !important;
    height: 18px;
    margin: 0 !important;
    padding: 0px !important;
}

.login-user-name {
    margin-right: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 300px;
}

.workspace-name-dropdown {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
}

.workspace-dropdown button,
.header .header-credits-wrap button {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-50) !important;
}

.workspace-dropdown button:after,
.header .header-credits-wrap button:after {
    display: none;
}

.header .hamburger-items .dropdown-item {
    padding: 20px 0px;
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-600);
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--gray-700);
}

.header .hamburger-items .dropdown-item:hover,
.header .hamburger-items .dropdown-item:focus {
    background: var(--gray-900);
    color: var(--gray-50) !important;
}

.header-rhs-side button.ghost-btn.ghost-medium {
    margin-right: 32px;
    font-size: 16px;
    line-height: 25px;
}

.researcher-header .hdr-workspace-data .hamburger-items .workspace-menu-list .dropdown-item,
.researcher-header .hdr-workspace-data .hamburger-items .menu-mid-links .dropdown-item {
    padding: 12px 0px;
}

.researcher-header .hamburger-items .workspace-menu-list .dropdown-item:first-child,
.menu-mid-links .dropdown-item:first-child {
    padding-top: 24px !important;
}

.researcher-header .hamburger-items .workspace-menu-list .dropdown-item:last-child,
.menu-mid-links .dropdown-item:last-child {
    padding-bottom: 24px !important;
}

.header .hamburger-items .dropdown-item:hover svg path {
    stroke: var(--gray-50) !important;
}

.header .hamburger-items .dropdown-item svg {
    margin-right: 15px;
}

.header .hdr-workspace-data .hamburger-items .dropdown-item:last-child {
    border: none;
}

.header .hamburger-items .dropdown-item svg {
    width: 24px;
}

.header .header-credits-wrap .dropdown.show button svg,
.header .header-credits-wrap .dropdown.show button img {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
}

.header .header-credits-wrap .dropdown img,
.header .header-credits-wrap .dropdown svg {
    margin-right: 12px;
}

.header .header-credits-wrap .dropdown-menu {
    top: 69px !important;
    right: -10px !important;
    left: auto !important;
    background: unset;
}

.guest-result-viewer-text {
    display: flex;
    align-items: center;
    padding-left: 32px;
    padding-right: 0;
    border-left: 1px solid var(--gray-700);
    margin-left: 32px;
}

.header-credits-wrap .logged-in-user-info svg {
    margin-right: 8px;
}

.taking-test-header .score-link-header svg {
    margin-right: 8px;
}

.arabic_wrapper .header-credits-wrap .logged-in-user-info svg,
.arabic_wrapper .taking-test-header .score-link-header svg {
    margin-right: 0px;
    margin-left: 8px;
}

.taking-test-header .header-credits-wrap .header-link:first-child,
.taking-test-header .score-link-header {
    margin-left: 0;
}

.logged-in-user-info {
    margin-right: 28px;
    align-items: center;
}

.span-workspace-owner-icon {
    background: #fff;
    width: 40px;
    height: 40px;
    display: inline-block;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: var(--m);
}

.disabled-workspace-list .workspace-list-repeat {
    opacity: 0.5;
    cursor: not-allowed;
}

.span-workspace-owner-icon img,
.span-workspace-owner-icon svg {
    margin: 0px;
}

.span-workspace-owner-icon .gray-900-svg path {
    stroke: #000 !important;
}

.workspace-owner-info-dropdown .span-workspace-owner-icon {
    margin: 0 auto;
}

.workspace-owner-info-dropdown a:hover {
    text-decoration: none;
}

.workspace-type-info .text-white {
    color: #fff;
}

.workspace-type-info {
    margin: 10px 0;
    position: relative;
}

.invite-workspace-notifivation .workspace-type-info::after {
    position: absolute;
    content: "";
    background: #ff6db1;
    width: 16px;
    height: 16px;
    border-radius: 100%;
    right: 3px;
    top: 12px;
}

.disabled-workspace-list .invite-workspace-notifivation .workspace-type-info::after {
    display: none !important;
}

.added-workspaces-for-user.disabled-workspace-list .invite-workspace-notifivation .workspace-type-info p {
    width: 148px;
}

.added-workspaces-for-user .invite-workspace-notifivation .workspace-type-info p {
    width: 115px;
}

.added-workspaces-for-user .workspace-type-info {
    width: calc(100% - 74px);
}

.header-info-type {
    color: #9c9c9c;
}

.upgrade-to-team-plan {
    border-radius: 5px;
    background: linear-gradient(104deg, #9759cb 6.71%, #ff66ad 93.72%);
    color: #fff;
    padding: 4px 10px;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 17px;
    display: block;
    text-align: center;
    width: 147px;
    margin: 10px auto 0px;
    cursor: pointer;
}

.workspace-owner-info-dropdown {
    border-bottom: 1px solid #676767;
    padding-bottom: 24px;
    padding-top: 20px;
}

.workspace-owner-info-dropdown .workspace-type-info {
    margin-bottom: 0px;
}

.hdr-workspace-data .workspace-menu-list a {
    border: 0px !important;
}

.hdr-workspace-data .workspace-menu-list {
    border-bottom: 0px;
}

.workspace-menu-list .topnavigationlist {
    padding: 0px;
}

.workspace-menu-list .topnavigationlist a svg {
    margin-right: 15px;
}

.workspace-menu-list .topnavigationlist ul {
    margin: 12px 0;
}

.workspace-arrow {
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
}

.added-workspaces-for-user {
    border-bottom: 1px solid #676767;
    padding: 24px 0;
}

.added-workspaces-for-user a:hover {
    text-decoration: none;
}

.hamburger-items .added-workspaces-for-user a:hover .workspace-list-repeat {
    text-decoration: none;
    background: #2b2b2b !important;
    transition: 0.3s;
}

.hamburger-items .added-workspaces-for-user a .workspace-list-repeat {
    padding: 0px 0px 0px 7px;
    border-radius: 8px;
    transition: 0.3s;
}

.hamburger-items .added-workspaces-for-user .workspace-type-info {
    margin: 7px 0px;
}

.added-workspaces-for-user .header-info-type {
    margin-top: -1px;
    display: block;
}

.added-workspaces-for-user .workspace-type-info p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 148px;
    text-align: left !important;
}

.workspaces-list-heading {
    color: #9c9c9c;
    display: block;
    margin-bottom: 12px;
}

.credits-count {
    margin-left: 32px;
    height: 56px;
    padding: 0px 10px;
    border-radius: 8px;
    transition: 0.3s;
}

.credits-count:hover {
    background: #2b2b2b;
}

.added-workspace-dropdown .hamburger-items {
    padding: 0px;
    min-width: 262px;
}

.added-workspace-dropdown .hamburger-items .scroll-menu {
    padding: 0px 20px;
    max-height: 70vh;
    overflow-y: auto;
}

.scroll-menu::-webkit-scrollbar {
    width: 0px;
    background-color: var(--gray-50);
}

.scroll-menu::-webkit-scrollbar {
    height: 0px;
}

.add-work-space-link a,
.add-workspace-link a {
    border-top: 1px solid #676767 !important;
}

.scroll-menu .added-workspaces-for-user {
    border-bottom: 0px;
    border-top: 1px solid #676767;
}

.more-workspaces::before {
    background: linear-gradient(0deg, #000 30%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    content: "";
    bottom: 66px;
    width: 100%;
    height: 34px;
    left: 0px;
}

.add-work-space-link {
    padding: 0px 20px;
    position: relative;
}

.hamburger-items .react-loading-skeleton {
    top: 0px !important;
    width: 100% !important;
    display: block;
    margin: 0px !important;
    --base-color: #676767 !important;
    --highlight-color: #676767 !important;
    margin-top: 12px !important;
    margin-bottom: 12px !important;
    height: 20px !important;
    line-height: 0px !important;
}

.hamburger-items span br {
    display: none;
}

.login-user-name-info {
    padding-top: 20px;
    border-bottom: 1px solid #676767;
    padding-bottom: 20px;
}

.hdr-workspace-data .menu-mid-links a {
    border: 0px !important;
}

.menu-mid-links {
    border-bottom: 1px solid #676767;
}

.login-user-name-info .login-user-name {
    color: #fff;
    max-width: 150px;
    margin-right: 0;
}

/***Header css end here ***/

/****Dashboard components css***/
.dashboard-sub-head-wrap {
    margin-bottom: var(--3XL);
}

.loading-cards .test-time-data span {
    display: block !important;
}

.loading-cards .test-time-data .react-loading-skeleton {
    margin-bottom: 0px !important;
}

.page-data-wrapper {
    max-width: 100%;
    margin: 32px auto 80px;
    width: 100%;
    padding: 0px 120px;
    min-height: calc(100vh - 126px);
}

.create-test-card {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 20px;
    height: 100%;
    cursor: pointer;
}

.create-test-card .tooltip-wrapper {
    z-index: 22;
}

.create-test-card .test-card-info h4 .tag {
    display: none;
}

.create-test-card:hover,
.selected-card {
    border-color: var(--gray-900);
}

.create-new-test-modal .credits-text {
    display: none;
}

.creat-test-cards-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 0px -16px;
}

.creat-test-card-repeat {
    padding: 16px;
    width: 25%;
}

.create-test-card .body-text-3 {
    font-weight: 500;
    color: #676767;
}

.card-placeholder-img img,
.card-placeholder-img svg {
    width: 100%;
    height: auto;
}

.create-test-card:hover .card-placeholder-img .card-sorting-placeholder .change-hover,
.selected-card .card-placeholder-img .card-sorting-placeholder .change-hover {
    fill: #ffedd9;
}

.create-test-card:hover .card-placeholder-img .preference-placeholder .change-hover,
.selected-card .card-placeholder-img .preference-placeholder .change-hover {
    fill: #ff9bca;
    stroke: #ff6db1;
}

.create-test-card:hover .card-placeholder-img .preference-placeholder .pre-circle-hover,
.selected-card .card-placeholder-img .preference-placeholder .pre-circle-hover {
    fill: var(--gray-50);
}

.create-test-card:hover .card-placeholder-img .preference-placeholder .hart-hhover,
.selected-card .card-placeholder-img .preference-placeholder .hart-hhover {
    fill: #ff6db1;
}

.create-test-card:hover .card-placeholder-img .tree-test-placeholder .change-hover,
.selected-card .card-placeholder-img .tree-test-placeholder .change-hover {
    fill: #bf8ee8;
    stroke: #9759cb;
}

.create-test-card:hover .card-placeholder-img .tree-test-placeholder .back,
.selected-card .card-placeholder-img .tree-test-placeholder .back {
    stroke: var(--gray-50);
}

.create-test-card:hover .card-placeholder-img .survey-placeholder .change-hover,
.selected-card .card-placeholder-img .survey-placeholder .change-hover {
    fill: var(--gray-900);
}

.create-test-card:hover .card-placeholder-img .survey-placeholder .change-hover-2,
.selected-card .card-placeholder-img .survey-placeholder .change-hover-2 {
    fill: #bf8ee8;
    stroke: #9759cb;
}

.create-test-card:hover .card-placeholder-img .survey-placeholder .change-hover-3,
.selected-card .card-placeholder-img .survey-placeholder .change-hover-3 {
    fill: #ffedd9;
    stroke: #c38d4d;
}

.create-test-card:hover .card-placeholder-img .survey-placeholder .change-hover-4,
.selected-card .card-placeholder-img .survey-placeholder .change-hover-4 {
    stroke: #c38d4d;
    fill: var(--gray-50);
}

.create-test-card:hover .card-placeholder-img .survey-placeholder .change-eye,
.selected-card .card-placeholder-img .survey-placeholder .change-eye {
    stroke: #c38d4d;
}

.create-test-card:hover .card-placeholder-img .five-second-placeholder .change-hover,
.selected-card .card-placeholder-img .five-second-placeholder .change-hover {
    fill: var(--gray-900);
}

.create-test-card:hover .card-placeholder-img .first-click-placeholder .change-hover,
.selected-card .card-placeholder-img .first-click-placeholder .change-hover {
    fill: #bf8ee8;
    stroke: #9759cb;
}

.create-test-card:hover .card-placeholder-img .prototype-test-placeholder .change-hover-arrow-pink,
.selected-card .card-placeholder-img .prototype-test-placeholder .change-hover-arrow-pink {
    fill: #ff6db1;
}

.create-test-card:hover .card-placeholder-img .prototype-test-placeholder .change-hover-arrow-purpl,
.selected-card .card-placeholder-img .prototype-test-placeholder .change-hover-arrow-purpl {
    fill: #9759cb;
}

.create-test-card:hover .card-placeholder-img .prototype-test-placeholder .change-hover-pink,
.selected-card .card-placeholder-img .prototype-test-placeholder .change-hover-pink {
    stroke: #ff6db1;
    fill: #ffd6e9;
}

.create-test-card:hover .card-placeholder-img .prototype-test-placeholder .change-hover-purpl,
.selected-card .card-placeholder-img .prototype-test-placeholder .change-hover-purpl {
    stroke: #9759cb;
    fill: #efdcff;
}

.loading-cards {
    background: var(--gray-200) !important;
}

.loading-cards:after {
    display: none;
}

.test-card-info h4 {
    margin-bottom: 8px;
}

.first-click-heading>div {
    display: flex;
    align-items: center;
}

.card-placeholder-img {
    margin-bottom: 16px;
    line-height: 0px;
}

.page-heading-wrap {
    padding-bottom: 32px;
    margin-bottom: 32px;
    border-bottom: 1px solid #e3e3e3;
}

.all-test-listing-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 5px -9px 0;
}

.researcher-test-card .tag-wrap {
    display: inline-flex;
    align-items: center;
    width: 100%;
}

.researcher-test-card .tag-wrap .tag {
    margin: 0px var(--xs);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.test-list-head .heading a {
    color: var(--gray-900);
    text-decoration: none !important;
}

.card-footer-left-loader span {
    display: flex;
    align-items: center;
}

.menu-item {
    cursor: pointer;
    margin-left: 12px;
}

.test-time-data {
    margin: 0 -10px;
    width: 100%;
}

.test-time-data-repeat {
    padding: 0 10px;
}

.test-time-data-repeat .heading {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.test-time-data-repeat span {
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: inline-block;
}

.test-time-data-repeat .heading sub {
    bottom: 0;
    font-size: 16px;
    margin-left: 5px;
}

.test-list-data .hamburger-items {
    overflow: hidden;
    position: absolute;
    bottom: -4px;
    right: 20px;
}

.test-list-data .hamburger-items .dropdown-item {
    padding: 8px 20px;
}

.test-date-wrap span {
    color: var(--gray-900);
}

.dashboard-filter-left span {
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-600);
    padding: 0px 12px 16px;
    margin-right: 20px;
    cursor: pointer;
    border-bottom: 4px solid transparent;
    display: inline-flex;
    font-weight: 500;
    align-items: center;
}

.dashboard-filter-left span:last-child {
    margin-left: 0px;
}

.dashboard-filter-left.inner-navigation span a {
    color: var(--gray-600);
    position: relative;
    text-decoration: none;
}

.dashboard-filter-left.inner-navigation span a span {
    font-size: 18px;
    line-height: 1;
    color: var(--gray-600);
    padding: 0px;
    margin-right: 0px;
    cursor: pointer;
    border-bottom: none;
    display: inline-flex;
    font-weight: 500;
    align-items: center;
}

.dashboard-filter-left.inner-navigation span.active a {
    color: var(--gray-900);
}

.live-test .menu-item,
.completed-test .menu-item {
    position: relative;
    bottom: 1px;
}

.dashboard-filter-left .active {
    color: var(--gray-900);
    border-color: var(--gray-900);
}

.dashboard-filter-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.dashboard-filter-wrap .dropdown-menu {
    z-index: 22;
}

.dashboard-filter-right {
    display: flex;
    align-items: start;
}

.filter-menu-btn {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-900);
}

.filter-menu-btn svg {
    margin-left: 10px;
    width: 24px;
}

.filter-menu-wrap {
    display: flex;
    align-items: center;
    position: relative;
}

.filter-menu-wrap .hamburger-items {
    position: absolute;
    top: 36px;
    z-index: 2;
}

.dropdown-toggle,
.dropdown-toggle:hover,
.dropdown-toggle:focus,
.dropdown-toggle:active {
    background: unset !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    outline: none !important;
    height: auto !important;
    min-height: auto !important;
}

.dropdown-toggle:after {
    display: none;
}

.dropdown-menu .text-danger,
.dropdown-menu .text-danger:hover,
.dropdown-menu .text-danger:focus {
    color: #ff0000 !important;
}

.dropdown-menu {
    transform: unset !important;
    inset: unset !important;
    padding: 0;
    margin: 0;
    border: 0px;
    top: 5px !important;
}

.filter-sort-btn {
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    margin-left: 18px;
    color: var(--gray-900);
    cursor: pointer;
    display: flex;
    align-items: center;
}

.filter-sort-btn img,
.filter-sort-btn svg {
    margin-left: 10px;
    width: 24px;
}

.duplicate-test {
    margin-right: 8px;
}

.reported-tester-test {
    margin: 0px 0px 0px 8px;
    overflow: visible !important;
}

.duplicate-test .tooltip-wrapper {
    opacity: 1;
    right: -31px;
    top: -64px;
    width: auto;
    min-width: 264px;
    left: auto !important;
    bottom: auto !important;
}

.duplicate-test .bottom-tooltip::before {
    left: 84%;
}

.duplicate-test:hover .tooltip-wrapper {
    display: block;
    opacity: 1;
}

.reported-tester-test .tooltip-wrapper {
    margin: 0 !important;
    left: -182px !important;
    top: -60px;
    right: auto;
    bottom: auto !important;
    opacity: 1 !important;
    width: 100%;
    min-width: 100%;
}

.reported-tester-test .bottom-tooltip::before {
    left: 82%;
}

.reported-tester-test:hover .tooltip-wrapper {
    display: block;
    opacity: 1;
}

.test-footer-rhs .menu-item {
    margin-left: 0px;
}

.dashboard-filter-loader {
    display: flex;
    align-items: center;
    justify-content: center;
}

.dashboard-filter-loader .loader_section,
.no-test-data-available {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    min-height: calc(100vh - 380px);
}

.dashboard-filter-loader .loader_section img {
    width: 70px;
}

.no-test-data-available {
    text-align: center;
}

.loader_page {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
}

.reported-tester-test .tooltip-wrapper {
    min-width: 264px !important;
}

.researcher-test-card .reported-tester-test .tooltip-wrapper {
    min-width: auto !important;
    width: fit-content !important;
}

.cards-min-height {
    min-height: calc(100vh - 520px);
}

.total-test-count-filter {
    color: var(--gray-900);
    position: relative;
    top: 32px;
}

/****Dashboard components css end***/

/***Test setting  modal css****/
.modal-body {
    padding: 28px;
}

.create-test-modal .creat-test-card-repeat {
    width: 25%;
    padding: 7.5px;
}

.create-new-test-modal .creat-test-cards-wrapper {
    margin: 0px -7.5px;
}

.create-new-test-modal .create-test-card {
    padding: 12px;
}

.create-new-test-modal .modal-header-top {
    margin-bottom: 22.5px;
}

.create-new-test-modal .modal-button {
    margin-top: 22.5px;
    text-align: center;
}

.create-new-test-modal .modal-button .btn {
    min-width: 228px;
    justify-content: center;
}

.create-test-modal .test-card-info h4 {
    margin-bottom: 0px;
}

.create-test-modal .test-card-info h4>div {
    display: flex;
    align-items: center;
}

.create-new-test-modal .modal-lg {
    max-width: 1129px;
    width: calc(100% - 15px);
}

.modal.show .modal-dialog {
    width: calc(100% - 15px);
}

.modal-lg.modal-body {
    width: 100% !important;
}

.test-setting-modal .modal-dialog {
    max-width: 604px;
}

.modal-content {
    border: 0;
    border-radius: 20px;
}

.modal-header-top {
    display: flex;
    align-items: start;
    justify-content: space-between;
    margin-bottom: 32px;
}

.modal-header-top .h3 {
    max-width: calc(100% - 40px);
    text-align: left;
}

.modal-header-top .close {
    opacity: 1;
    text-shadow: none;
    margin: 0px !important;
    border: 1px solid var(--gray-400);
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-header-top .close:hover {
    border-color: var(--gray-500);
}

.modal-header-top .close:focus {
    border-color: var(--gray-900) !important;
}

.modal-header-top .close:focus .hover-inline-svg svg path {
    stroke: var(--gray-900) !important;
}

.modal-header-top .close .hover-inline-svg svg path {
    stroke: var(--gray-700);
}

.modal-header-top .close:hover .hover-inline-svg svg path {
    stroke: var(--gray-900) !important;
}

.confirmation-modal-wrap .modal-header-top img {
    width: 32px;
    height: 32px;
}

.test-setting-modal .form-group {
    max-width: 100%;
    margin-bottom: 20px !important;
}

.test-setting-modal .language-selection-radio label {
    margin: 0px 59px;
}

.test-setting-modal .language-selection-radio {
    display: flex;
    align-items: center;
    margin: 0px -59px 32px;
}

.test-setting-modal .primary-large {
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 20px;
}

.test-setting-modal .subtitle-2,
.test-setting-modal .heading {
    color: var(--gray-900);
}

.test-setting-modal .radio-btn-label {
    font-weight: 500;
    font-size: 18px;
    color: var(--gray-900);
}

.test-setting-label p {
    margin: 12px 0 20px;
    line-height: 25px;
    color: var(--gray-700);
}

.test-setting-hint {
    margin: 8px 0px 15px;
}

.test-setting-hint p {
    color: var(--gray-700);
}

.confirmation-modal-wrap .modal-dialog {
    max-width: 608px;
    width: calc(100% - 15px);
}

.confirmation-modal-wrap .modal-header-top h2 {
    margin-bottom: 0px;
}

.confirmation-modal-wrap .subtitle-2 {
    max-width: 100%;
    color: var(--gray-700);
}

.confirm-buttons-wrap {
    margin: 32px -10px 0px;
    display: flex;
    align-items: center;
}

.confirm-buttons-wrap button {
    margin: 0px 10px;
    justify-content: center;
}

.confirm-buttons-wrap button i {
    display: none;
}

.confirmation-modal-wrap .modal-header-top .close {
    padding: 1px;
}

/***Create test modal css***/
.test-card-info h4 {
    display: flex;
    align-items: center;
}

.test-card-info h4 .info-wrap {
    margin-left: 5px;
    cursor: pointer;
    position: relative;
    line-height: 0px;
}

.info-wrap .bottom-tooltip {
    margin: 0px;
    bottom: 40px;
    left: -139px;
    opacity: 0;
    transition: 0.3s;
    display: none;
}

.info-wrap:hover .tooltip-wrapper {
    opacity: 1;
    display: block;
}

.create-new-project-modal-inner-data .switch-mamber-team {
    display: flex !important;
}

/***Create test modal css end***/

/***Chip css***/
.chips-wrap .chip {
    margin: 5px;
}

.chips-wrap {
    margin: 0px -5px;
}

.chip {
    background: #f0f0f0;
    border: 1px solid var(--gray-700);
    border-radius: 50px;
    padding: 8px 26px;
    /* min-width: 85px; */
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-700);
    display: inline-flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    justify-content: space-between;
}

.chip.chip-default {
    justify-content: center;
}

@media (hover: hover) and (pointer: fine) {
    .chip:hover {
        background: #efdcff;
    }
  }

.chip-option-icon-left {
    margin-right: 6px;
    min-width: 18px;
}

.chip-selected {
    border-color: #5c208d;
    color: var(--gray-900);
    background: #efdcff;
}

.chip-selected .chip-option-icon-left {
    position: absolute;
    left: 11px;
}

.chip-selected .chip-name {
    position: relative;
    left: 9px;
}

.chip-icon-left .chip-option-icon-left {
    background: var(--gray-900);
    width: 24px;
    height: 24px;
    display: flex;
    border-radius: 100%;
    text-align: center;
    padding: 2px 0;
    align-items: center;
    justify-content: center;
}

.chip-icon-left {
    padding: 6px 16px 6px 8px;
    background: #efdcff;
    border: 0px;
    color: var(--gray-900);
}

.chip-icon-right .chip-option-icon-right {
    background: var(--gray-900);
    width: 24px;
    min-width: 24px;
    height: 24px;
    display: flex;
    border-radius: 100%;
    text-align: center;
    padding: 2px 0;
    align-items: center;
    margin-left: 6px;
    justify-content: center;
}

.chip-icon-right {
    padding: 6px 8px 6px 16px;
    background: #efdcff;
    border: 0px;
    color: var(--gray-900);
}

/***Accordian css***/
.accordian-wrapper {
    border-bottom: 1px solid var(--gray-400);
    padding-bottom: 24px;
    margin-bottom: 24px;
}

.accordian-small {
    padding-bottom: 16px;
    margin-bottom: 16px;
}

.accordian-small .accordian-body-text {
    font-size: 14px;
    line-height: 25px;
}

.accordian-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.accordian-header .subtitle-1 {
    font-size: 20px;
    line-height: 26px;
}

.accordian-header .accordian-header-subtitle {
    font-size: 16px;
    line-height: 24px;
}

.accordion-action {
    cursor: pointer;
}

.accordian-header h3 {
    margin: 0px;
    display: flex;
    max-width: calc(100% - 30px);
    align-items: center;
}

.accordian-header-subtitle {
    margin-left: 8px;
    color: var(--gray-700);
}

.accordian-body-text {
    color: var(--gray-700);
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    margin-top: 32px;
}

/****Status and tags css****/
.link-text {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    text-decoration: underline;
    color: #9759cb;
}

.link-text:hover {
    color: #5c208d;
    text-decoration: underline;
}

.underline-link {
    font-weight: 700;
    font-size: 30px;
    line-height: 36px;
    color: var(--gray-900);
    text-decoration: none;
}

.underline-link:hover {
    text-decoration: underline;
    color: var(--gray-900);
}

.test-list-repeat-wrap .hamburger-menu .dropdown-menu {
    right: 10px !important;
    bottom: 0px !important;
    top: auto !important;
}

.hamburger-items {
    background: var(--gray-50);
    border: 1px solid var(--gray-400);
    box-shadow: 0px 4px 10px rgb(0 0 0 / 5%);
    border-radius: 10px;
    min-width: 166px;
    z-index: 5;
    overflow: hidden;
}

.hamburger-items .dropdown-item {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-900);
    cursor: pointer;
    padding: 18px 20px;
}

.hamburger-items .dropdown-item:hover {
    background: var(--gray-200);
    color: var(--gray-900);
    box-shadow: none;
}

.hamburger-items .dropdown-item:focus,
.hamburger-items .dropdown-item.active {
    color: var(--secondary-purple-200);
    background: none;
}

.dashboard-filter-wrap .dropdown.show button svg,
.dashboard-filter-wrap .dropdown.show button img {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.status-tag {
    border: 1px solid var(--gray-400);
    border-radius: 20px;
    display: flex;
    align-items: center;
    background: var(--gray-50);
}

.test-list-repeat-wrap .status-live:before {
    margin-right: var(--xs);
    position: relative;
}

.status-draft a {
    color: #ffb800;
}

.status-live a {
    color: #378b10;
}

.status-completed a {
    color: var(--gray-900);
}

.tag-wrap {
    margin: 12px -6px;
}

.tag-wrap .tag {
    margin: 0px 6px;
}

.tag {
    background: var(--gray-900);
    border: 1px solid var(--gray-900);
    border-radius: 5px;
    color: var(--gray-50);
    padding: 3px 8px;
    margin: 0px 3px;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    min-height: 23px;
    display: inline-block;
}

.pink-filled-tag {
    background: #ff6db1;
    border-color: #ff6db1;
}

.pink-tag,
.purple-tag,
.gold-tag {
    background: var(--primary-pink-50);
    border: 1px solid var(--primary-pink-200);
    border-radius: 4px;
    color: var(--gray-900);
    font-weight: 500;
    font-size: 14px;
    line-height: 22px !important;
    min-height: 31px;
}

.purple-tag {
    background: #efdcff;
    border: 1px solid #9759cb;
}

.gold-tag {
    background: #ffedd9;
    border: 1px solid #f2c690;
}

.danger-tag {
    background: #ff0000;
    border-color: #ff0000;
}

.status-Draft,
.status-draft {
    border-color: var(--gray-900);
    color: var(--gray-900);
}

.status-live {
    color: #378b10 !important;
    border-color: #378b10;
}

.status-live:before {
    content: "";
    background: #378b10;
    width: 6px;
    height: 6px;
    display: inline-block;
    border-radius: 100%;
    margin-right: var(--xs);
}

.status-completed {
    border-color: var(--gray-900);
    color: var(--gray-900) !important;
}

.progress-bar-wrap {
    padding-top: 13px;
}

.progress-bar-wrap p {
    margin-bottom: 10px;
    color: var(--gray-900);
}

.progress-bar-inner {
    background: var(--gray-50);
    border-radius: 5px;
    height: 5px;
    width: 170px;
    position: relative;
    overflow: hidden;
}

.progress-fill {
    background: var(--gray-900);
    border-radius: 5px;
    height: 5px;
}

/****Status and tags css****/

/*** three column layout css***/
.page-data-wrapper.create-test-data-wrapper {
    padding: 0;
    margin: 0;
}

.test-name-wrap .edit-test-name.heading {
    margin: 0px;
}

.test-name-wrap .edit-test-name.heading input,
.test-name-wrap .edit-test-name.heading input:focus {
    background: unset;
    border: 0px;
    border-bottom: 1px solid var(--gray-600);
    box-shadow: none;
    padding: 0px;
    outline: none;
    padding-left: 5px;
    font-size: 20px;
    line-height: 26px;
    border-radius: 0px;
    font-weight: 500;
}

.auto-width-input {
    font-family: "Inter", sans-serif;
}

.three-column-layout-top-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--m) var(--4XL);
    border-bottom: 1px solid var(--gray-400);
    background: #fcfcfc;
    position: sticky;
    top: 72px;
    z-index: 22;
}

.autosave-icon {
    display: flex;
    align-items: center;
}

.test-header-left-data {
    display: flex;
    align-items: center;
    width: calc(100% - 400px);
}

.test-header-right-data {
    display: flex;
    align-items: center;
}

.test-header-right-data button img {
    width: 16px;
    height: 16px;
}

.header-autosave-icon {
    margin: 0px var(--xl);
    width: 24px;
    text-align: center;
}

.test-header-right-data .autosave-icon .tooltip-wrapper {
    display: none;
    right: -136px;
    text-align: center;
    top: 11px;
}

.test-header-right-data .autosave-icon:hover .tooltip-wrapper {
    display: block;
}

.test-header-tags {
    display: flex;
    align-items: center;
    margin: 0 -6px;
}

.test-header-tags .tag {
    margin-right: var(--m);
    margin-left: 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 132px;
}

.create-test-header .test-header-tags .tag,
.create-test-header .test-header-tags .project-tag-name {
    max-width: max-content;
}

.test-header-tags .project-tag-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 92px;
    display: inline-block !important;
}

.test-header-tags a,
.test-header-tags a:hover {
    text-decoration: none;
}

.test-name-wrap {
    display: flex;
    align-items: center;
    max-width: calc(100% - 336px);
}

.length-icon {
    margin-right: var(--s);
    position: relative;
    top: -1px;
}

.back-arrow-btn {
    display: inline-flex;
    padding: var(--m);
    margin-right: var(--2XL);
    border: 1px solid #e9e9e9;
    border-radius: var(--s);
    width: 40px;
    height: 40px;
    align-items: center;
}

.back-arrow-btn svg {
    width: 16px;
    height: 16px;
}

.back-arrow-btn:hover {
    border-color: #000;
}

.back-arrow-btn:hover svg path {
    stroke: #000 !important;
}

.test-name-wrap .heading {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 64px);
}

.edit-test-name {
    margin: 0px var(--2XL) 0px var(--m);
    cursor: pointer;
    display: flex;
    align-items: center;
}

.edit-test-name img {
    width: 24px;
    height: 24px;
}

.three-column-layout-body {
    display: flex;
    width: 100%;
    min-height: calc(100vh - 192px);
}

.three-column-layout-left {
    width: 248px;
    background: #fcfcfc;
    padding-left: 40px;
}

.three-column-layout-center {
    width: calc(100% - 690px);
    padding: 47px 39px 40px;
    border-left: 1px solid #f0f0f0;
    border-right: 1px solid #f0f0f0;
}

.three-column-layout-center.two-column {
    width: calc(100% - 248px);
}

.three-column-layout-right {
    width: 442px;
    background: #fcfcfc;
    padding: 47px 40px;
}

.three-column-layout-left .stepper-wrap {
    display: table;
    margin: 47px 0px 40px;
    position: sticky;
    top: 176px;
    height: auto;
    transition: 0.3s;
    z-index: 1;
}

.recruit-tile {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 32px;
    margin-top: 32px;
}

.recruitment-tiles-wrap .recruit-tile {
    min-height: 290px;
}

.recurt-order-listing {
    padding: 0;
    list-style: none;
    min-height: 204px;
}

.recurt-order-listing li {
    margin-bottom: 12px;
}

.recurt-order-listing li span {
    margin-right: 8px;
}

.recurt-order-listing li p {
    margin: 0 !important;
    padding: 0 !important;
}

.user-response-wrap {
    display: flex;
    align-items: center;
}

.user-response-wrap p,
.user-response-oprat p {
    margin: 0 !important;
}

.credit-sub.d-flex .info-wrap {
    margin-left: 4px;
    cursor: pointer;
    top: 0px;
}

.user-response-wrap img {
    margin-right: 8px;
}

.user-response-oprat {
    padding: 0px 10px;
}

.user-response-wrap .info-wrap:hover .tooltip-wrapper {
    bottom: 38px;
    left: -172px;
    z-index: 2;
    width: 367px;
}

.recruit-footer-info .user-response-wrap .info-wrap:hover .tooltip-wrapper {
    bottom: 30px;
    left: -175px;
}

.user-response-wrap.participants_info-tooltip:hover .tooltip-wrapper {
    left: -216px;
}

.user-response-wrap.participants_info-tooltip:hover .bottom-tooltip::before {
    left: 62%;
}

.user-response-wrap .tooltip-wrapper p .link-text {
    margin-left: 2px;
    cursor: pointer;
}

.participants_info-tooltip p.body-text.body-text-2.white-color .link-text {
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.user-response-wrap .info-wrap .tooltip-wrapper p {
    color: #fff;
}

.user-response-wrap .info-wrap .tooltip-wrapper p .gray-50-svg {
    margin-right: 8px;
}

.user-response-wrap .info-wrap .tooltip-wrapper p .pink-200-svg {
    margin: 0px 8px 0px 12px;
}

.credit-score-tooltip-info {
    margin: 4px 0px;
}

.credit-score-tooltip-info p {
    margin: 8px 0px !important;
}

.recruit-tile-button button {
    width: 100%;
}

.recruit-tile-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.recruit-tile .heading {
    font-size: 28px;
    line-height: 33px;
    min-height: 69px;
    display: flex;
    align-items: center;
}

.recruit-tile .heading br {
    display: none;
}

.recruit-tile .body-text {
    margin: 20px 0px;
    color: var(--gray-700);
}

.recruitment-tiles-wrap {
    min-height: calc(100vh - 500px);
}

.recruitment-top-head p {
    margin-top: 12px;
    color: var(--gray-700);
}

.recruit-bottom-right {
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    display: flex;
    align-items: center;
    color: var(--gray-700);
}

.recruit-bottom-right img {
    margin-right: 10px;
}

.recruit-participant-top-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.recruit-participant-top-heading span a {
    color: var(--gray-900);
    text-decoration: underline;
}

.recruit-participant-top-heading span {
    color: var(--gray-900);
    position: relative;
    top: 1px;
    display: none;
}

.recruit-participant-top-heading button img {
    width: 16px;
    height: 16px;
}

.recruit-participant-top-heading button {
    min-width: 170px;
    margin-left: 11px;
    padding: 8px 0;
    justify-content: center;
}

.recurit-panel-top-head {
    border-bottom: 1px solid var(--gray-400);
    padding-bottom: 32px;
    margin-bottom: 32px;
}

.recurit-panel-tabs-wrap .accordian-header {
    z-index: 1;
}

.screen-question-radio {
    position: relative;
    z-index: 1;
}

.info-wrap {
    position: relative;
}

.agegender-graph-wrap {
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin-top: 52px;
    margin-bottom: 32px;
}

.agegender-data-count {
    width: 200px;
}

.agegender-data-count p {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-700);
    margin-bottom: 9px;
}

.agegender-data-count p strong {
    color: var(--gray-900);
}

.graph-hold-wrap .chartSliderCombo {
    margin: 0px auto !important;
}

.agegender-graphoption-wrap {
    width: calc(100% - 200px);
}

.graph-filter-buttons {
    display: table;
    margin: 0px auto 32px;
}

.btns-wrap-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0px;
    position: relative;
    top: 4px;
}

.btns-wrap-bottom button {
    justify-content: center;
}

.graph-data-loder>div,
.recritment-section-loader>div {
    display: flex;
    min-height: 200px;
    align-items: center;
    justify-content: center;
}

.graph-data-loder>div {
    min-height: 224px;
}

.graph-data-loder img,
.recritment-section-loader img {
    width: 70px;
}

.vertical-checkboxes-wrap {
    margin-top: 50px;
}

.vertical-checkboxes-wrap .checkbox-wrap {
    margin-bottom: 20px;
    margin-top: 20px;
}

.vertical-checkboxes-wrap .checkbox-wrap p {
    color: var(--gray-900);
}

.predefined-categories {
    color: var(--gray-900);
}

.other-countries-wrap {
    margin: 20px 0;
}

.other-countries-wrap p {
    margin-bottom: 20px;
    color: var(--gray-900);
}

.other-countries-wrap .form-group {
    max-width: 100%;
}

.other-countries-wrap .form-group .dropdown-field {
    max-width: 400px;
    margin-bottom: 20px;
}

.vertical-checkboxes-wrap.predefined-categories ul {
    padding: 0;
    list-style: none;
    margin-bottom: 40px;
}

.average-time-wrap .form-group {
    margin-top: 32px;
}

.average-time-wrap p {
    color: var(--gray-900);
}

.image-radio-btns-wrap {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    margin: 0px -10px;
}

.image-radio-btns-wrap li {
    min-height: 169px;
    min-width: 195px;

    margin: 10px;
    text-align: center;
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 5px;
    padding: 32px 40px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.img-checkbox-inner img {
    opacity: 0.5;
}

.image-radio-btns-wrap li:hover {
    color: var(--gray-900);
    border-color: var(--gray-900);
}

.image-radio-btns-wrap li:hover .img-checkbox-inner img {
    opacity: 1;
}

.image-radio-btns-wrap li:hover .img-checkbox-inner p {
    color: var(--gray-900);
}

.image-radio-btns-wrap .image-checkbox-btns-selected {
    background: #efdcff;
    border-color: var(--gray-900);
    color: var(--gray-900);
}

.image-radio-btns-wrap .image-checkbox-btns-selected .img-checkbox-inner p {
    color: var(--gray-900);
}

.image-radio-btns-wrap .image-checkbox-btns-selected .img-checkbox-inner img {
    opacity: 1;
}

.fav-device-wrap p {
    color: var(--gray-900);
    margin-bottom: var(--xl);
}

.img-checkbox-inner p {
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-700);
    margin: 19px 0 0;
}

.most-used-apps {
    margin-top: 22px;
}

.employment-type-wrap .form-group {
    margin-bottom: 27px !important;
    max-width: 100%;
}

.employment-type-wrap .form-group .input-position-relative {
    max-width: 400px;
    margin-bottom: 20px;
}

.employment-type-wrap .form-group:last-child {
    margin-bottom: 0px !important;
}

.household-number-wrap .col-md-8 {
    max-width: 430px;
}

.household-number-wrap .select-household .form-group .input-position-relative {
    margin-bottom: 0px !important;
}

.advanced-options-control span {
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-900);
    display: table;
    margin: 0 auto;
    cursor: pointer;
    padding: 5px 20px;
    background: var(--gray-50);
    position: relative;
}

.advanced-options-control:after {
    border-top: 1px solid var(--gray-400);
    height: 1px;
    content: "";
    width: 100%;
    position: absolute;
    top: 50%;
    z-index: -1;
}

.advanced-options-control {
    position: relative;
}

.advanced-options-control span img {
    margin-right: 7px;
    transition: 0.3s;
}

.adavanced-options-open span img {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.estimated-panel-size {
    position: sticky !important;
    top: 180px !important;
    z-index: 3;
    height: auto;
    transition: 0.3s;
    margin-bottom: 70px;
    width: 100% !important;
}

.estimated-panel-size .create-test-preview-area-inner {
    text-align: left;
    margin: 0px;
    animation: unset;
}

.estimate-panel-footer {
    display: flex;
    align-items: center;
    border-top: 1px solid var(--gray-400);
    margin-top: 32px;
    padding-top: 32px;
    justify-content: space-between;
    color: var(--gray-900);
}

.estimate-count-area span {
    margin-left: 10px;
    display: inline-block;
}

.estimate-count-area {
    display: flex;
    align-items: center;
    margin-top: 20px;
    justify-content: space-between;
    color: var(--gray-900);
}

.estimatepanel-panel-mid-area {
    margin-top: 24px;
}

.estimatepanel-panel-mid-area .insufficient-responses-wrap {
    display: none !important;
}

.estimate-progress-bar {
    height: 5px;
    border-radius: 20px;
    background: #d9d9d9;
    width: 100%;
    position: relative;
}

.estimatepanel-panel-mid-area h1 {
    margin-bottom: 12px;
}

.progress-width {
    height: 5px;
    border-radius: 20px;
    display: inline-block;
    position: absolute;
    left: 0;
    top: 0;
    transition: 1s;
}

.estimate-responses-wrap {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    justify-content: space-between;
    margin-top: 12px;
}

.estimated-panel-color-red h1 {
    color: #ff0000;
}

.estimated-panel-color-red .progress-width {
    width: 30%;
    background: #ff0000;
}

.estimated-panel-color-yellow h1 {
    color: #ffb800;
}

.estimated-panel-color-yellow .progress-width {
    width: 50%;
    background: #ffb800;
}

.estimated-panel-color-green h1 {
    color: #378b10;
}

.estimated-panel-color-green .progress-width {
    background: #378b10;
    width: 100%;
}

.estimate-error-wrap {
    background: #ff0000;
    border-radius: 10px;
    padding: 8px 16px;
    color: var(--gray-50);
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    display: flex;
    align-items: center;
}

.estimate-error-wrap span {
    display: inline-block;
    width: calc(100% - 30px);
    padding-left: 8px;
}

.estimate-error-wrap span a {
    color: var(--gray-50);
    text-decoration: underline;
}

.estimate-error-wrap svg {
    width: 24px;
    height: 24px;
}

.estimated-credit-link {
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    color: #000;
}

.estimated-credit-link a {
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
}

/***Welcome page css***/
.test-welcome-inner-data-hold {
    display: flex;
    justify-content: space-between;
}

.test-welcome-image-wrap {
    overflow: hidden;
    width: 319px;
    /* newcss */
    /* margin-top:54px; */
}

.test-welcome-image-wrap .project-modal-img {
    position: relative;
    overflow: hidden;
    border-radius: 20px;

    background: var(--gray-300);
}

.remove-img {
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    text-decoration: underline;
    position: relative;
    cursor: pointer;
    color: #ff0000;
    position: absolute;
    bottom: -60px;
    width: 100%;
    text-align: center;
    background: rgba(255, 255, 255, 0.5);
    padding: 10px;
    transition: 0.3s;
}

.test-welcome-image-wrap .project-modal-img:hover .remove-img {
    bottom: 0px;
}

.change-image-link input {
    position: absolute;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    cursor: pointer;
    bottom: 0px;
    top: 0px;
}

.change-image-link {
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    text-decoration: underline;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.test-welcome-image-wrap .change-image-link {
    color: #9759cb;
}

.test-welcome-image-wrap .change-image-link:hover {
    color: #5c208d;
}

.change-welcome-image {
    text-align: center;
}

.upload-project-img img,
.uploaded-project-img img {
    border-radius: 0px;
    height: 381px;
    object-fit: contain;
    display: table;
    margin: 0 auto;
}

.upload-image-placeholder {
    object-fit: none !important;
}

.test-welcome-top-head {
    margin-bottom: 32px;
}

.test-welcome-page-wrap .form-group {
    max-width: 100%;
    margin-bottom: 27px !important;
}

.test-welcome-page-left {
    width: calc(100% - 319px);
    padding-right: 67px;
}

.test-welcome-top-head p {
    margin-top: 20px;
    color: var(--gray-700);
}

.upload-image-placeholder {
    object-fit: contain !important;
    width: 100% !important;
}

.test-section-loader {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.test-section-loader img,
.modal-loader img {
    width: 70px !important;
}

.country-flag-icon {}

.modal-loader {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    width: 100%;
}

/***Welcome page css***/

/***Chart css start ***/
.chartSliderCombo {
    max-width: 523px;
    margin: 10px 40px;
}

.chartSliderCombo .chartArea {
    position: relative;
    width: 100%;
    height: 231px;
}

.chartSliderCombo .chartArea .bar {
    position: absolute;
    background-color: #9759cb;
}

.chartSliderCombo .chartArea .gray-bar {
    position: absolute;
    background-color: var(--gray-400) !important;
}

.chartSliderCombo .sliderArea {
    position: relative;
}

.chartSliderCombo .slider {
    position: relative;
    width: 100%;
    top: 13px;
    height: 30px;
}

.chartSliderCombo .slider p {
    font-weight: 600;
    font-size: 14px;
    line-height: 33px;
    color: var(--gray-900);
}

.slider__track,
.slider__range {
    border-radius: 3px;
    height: 5px;
    position: absolute;
}

.slider__track {
    /*background-color: #ced4da;*/
    width: 100%;
    z-index: 1;
}

.slider__range {
    background-color: #9fe5e1;
    z-index: 2;
}

/* Removing the default appearance */
.thumb,
.thumb::-webkit-slider-thumb {
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
}

.thumb {
    pointer-events: none;
    position: absolute;
    height: 0;
    width: 100%;
    outline: none;
    opacity: 0;
}

.thumb--zindex-3 {
    z-index: 3;
    left: -11px;
}

.thumb--zindex-4 {
    z-index: 4;
    right: -11px;
}

.sliderArea {
    margin-top: -5px;
}

/* For Chrome browsers */
.rc-slider-handle {
    background-color: var(--gray-50) !important;
    border: none !important;
    background-image: url(../img/slide-move.svg);
    background-size: 10px !important;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50% !important;
    border: 1px solid #9759cb !important;
    box-shadow: 0px 4px 6px rgb(0 0 0 / 8%) !important;
    cursor: pointer !important;
    height: 32px !important;
    width: 32px !important;
    margin-top: 0 !important;
    pointer-events: all;
    top: -11px;
    opacity: 1 !important;
}

.chartSliderCombo .slider__track,
.chartSliderCombo .slider__range {
    display: none;
}

.chartSliderCombo .rc-slider-rail,
.chartSliderCombo .rc-slider-track {
    height: 1px;
}

.rc-slider-track {
    background-color: unset !important;
}

/* For Firefox browsers */
.thumb::-moz-range-thumb {
    background-color: var(--gray-50);
    border: none;
    background-image: url(../img/slide-move.svg);
    background-size: 10px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    border: 1px solid #9759cb;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    height: 32px;
    width: 32px;
    margin-top: 4px;
    pointer-events: all;
    position: relative;
    display: none;
}

.slider__left-value,
.slider__right-value,
.slider__middle-value {
    position: absolute;
}

.slider__left-value {
    left: 0;
}

.slider__right-value {
    left: 0;
}

.slider__left-value {
    left: 0;
}

.slider__middle-value {
    left: 0;
}

.filter-buttons-wrap {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 40px;
    display: inline-flex;
    min-width: 324px;
    padding: 4px 5px;
}

.filter-button-option {
    padding: 4px 35px;
    border-radius: 17px;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-900);
    cursor: pointer;
    border: 1px solid transparent;
}

.filter-button-selected {
    background: #efdcff;
    border: 1px solid #9759cb;
    color: #5c208d;
}

/***Chart css end ***/

/***Stepper css****/
.stepper-wrap .info-wrap {
    position: absolute;
    display: flex;
    margin-left: 6px;
    right: -30px;
    top: 5px;
}

.stepper-wrap .tooltip-wrapper {
    margin: 0;
    left: 160%;
    top: -24px;
    display: none;
    min-height: 70px;
    display: none;
    align-items: center;
}

.stepper-wrap .info-wrap:hover .tooltip-wrapper {
    display: flex;
}

.stepper-wrap .left-tooltip::before {
    top: 35px;
}

.stepper-wrap {
    display: inline-block;
}

.step-repeat {
    display: flex;
    align-items: center;
    margin-bottom: 59px;
    font-weight: 600;
    font-size: 20px;
    color: var(--gray-500);
    position: relative;
}

.step-repeat:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 34px;
    background: var(--gray-500);
    bottom: 44px;
    left: 15.5px;
}

.stepper-wrap .step-repeat.completed-step:first-child {
    margin-bottom: 46px;
}

.step-repeat:last-child {
    margin-bottom: 0px;
}

.step-repeat:nth-last-child(2) {
    margin-bottom: 58px;
}

.step-repeat:first-child:before {
    display: none;
}

.stepper-count {
    width: 32px;
    height: 32px;
    background: var(--gray-500);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    color: var(--gray-50);
    font-weight: 500;
    font-size: 16px;
    line-height: 0;
}

.step-repeat.sub-pages-steps {
    display: block;
    margin-bottom: 0px;
}

.sub-pages-steps:before {
    display: none;
}

.sub-pages-steps-repeat .stepper-count {
    width: 9px;
    height: 9px;
    margin-left: 12px;
}

.sub-pages-steps .sub-pages-steps-repeat:last-child {
    margin-bottom: 46px;
}

.sub-pages-steps-repeat {
    display: flex;
    align-items: center;
    margin-bottom: 33px;
    font-weight: 600;
    font-size: 14px;
    line-height: 33px;
    position: relative;
}

.sub-pages-steps-repeat a,
.step-repeat a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--gray-500);
    position: relative;
}

.main-step-page:hover a {
    color: #9c9c9c;
}

.main-step-page:hover .stepper-count {
    background-color: #9c9c9c;
}

/* .step-repeat.sub-pages-steps:hover a{
      color: var(--gray-500);	
  } */

.sub-pages-steps-repeat:hover a {
    color: #9c9c9c;
}

.sub-pages-steps-repeat:hover .stepper-count {
    background-color: #9c9c9c;
}

.sub-pages-steps-repeat:after {
    position: absolute;
    content: "";
    width: 1px;
    height: 34px;
    background: var(--gray-500);
    bottom: 33px;
    left: 15.5px;
}

.completed-step,
.completed-step a {
    color: var(--primary-pink-200) !important;
}

.completed-step .stepper-count {
    background-color: var(--primary-pink-200) !important;
}

.active-step,
.active-step a {
    color: var(--gray-900) !important;
}

.active-step .stepper-count {
    background-color: var(--gray-900) !important;
}

.active-step:after,
.completed-step:before {
    background-color: var(--gray-900);
}

/***Stepper css end****/

/***Card sorting css****/
.card-sorting-test-wrap {
    background: #fcfcfc;
    border-radius: 12px;
    border: 1px solid var(--gray-400);
    margin-bottom: 32px;
    position: relative;
    z-index: unset !important;
}

.card-sorting-test-wrap .input-field label,
.card-sorting-test-wrap .form-control {
    /*z-index: 0;*/
}

.cardsorting-wrap-top {
    /*  padding: 21px 32px; */
    padding: 24px;
    border-bottom: 1px solid var(--gray-400);
}

.first-click-design-loop .cardsorting-wrap-top {
    border-bottom: 0px;
}

.cardsorting-wrap-mid-data {
    padding: var(--3XL);
}

.cardsorting-wrap-bottom {
    border-top: 1px solid var(--gray-400);
    padding: 21px 32px 0px;
}

.cardsorting-wrap-bottom-text {
    margin-bottom: 16px;
    display: block;
}

.cardsort-radio-wrap .radio-btn-wrap .checkmark {
    top: 4px;
}

.cardsort-radio-wrap p {
    position: relative;
    margin: 0px 0 0 34px;
}

.cardsort-radio-wrap {
    margin-bottom: 32px;
}

.cardsort-radio-wrap label p {
    position: static;
    margin: 0;
}

.cardsort-radio-wrap label p span {
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-900);
}

.select-card-option-repeat {
    margin-bottom: 32px;
}

.selected-card-option.field1 .select-card-option-repeat:nth-child(2) {
    margin-bottom: 0px;
}

.csv-import-btn {
    position: relative;
    overflow: hidden;
    border: 0;
    background: none;
}

.cat-card-top-sub-data a,
.cat-card-top-sub-data button,
.cat-card-top-sub-data .upload-image-label .change-image-link {
    color: #9759cb;
    text-decoration: underline;
    margin: 0px 1px;
    padding: 0px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
}

.cat-card-top-sub-data a:hover,
.cat-card-top-sub-data button:hover,
.cat-card-top-sub-data .upload-image-label .change-image-link:hover {
    color: #5c208d;
}

.csv-import-btn input {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
}

.cat-add-data-wrap .form-group {
    max-width: 100%;
}

.add-cat-data-btn {
    margin: 20px 0;
}

.add-cat-data-btn button img {
    width: 16px;
    height: 16px;
}

.added-cardsorting-category-wrap>div {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    margin: 0 -0px;
}

.drag-area-top {
    display: flex;
    align-items: center;
    width: calc(100% - 48px);
}

.added-card-cat-repeat {
    width: 100%;
    /*background: #EFDCFF;*/
    /*border: 1px solid #9759CB;*/
    border: 1px solid;
    border-radius: 10px;
    /*padding: 12px 16px;*/
    margin: 10px 0px 10px;
    display: flex;
    align-items: center;
    /*min-height:50px;*/
}

.added-card-cat-repeat .drag-area-bottom {
    display: flex;
    align-items: center;
    justify-content: end;
    margin-top: 0px;
}

.added-card-cat-repeat .drag-area-bottom span {
    cursor: pointer;
    display: flex;
    align-items: center;
    margin-left: 4px;
}

.drag-area-bottom span img {
    width: 16px;
    height: 16px;
    margin: 0px 5px;
}

.drag-area-top .ans-icon {
    display: flex;
    margin-right: 6px;
}

.drag-area-top .ans-data {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 20px);
}

.added-cat-count-data {
    display: flex;
    align-items: center;
    margin-top: 18px;
}

.added-cat-count-data button img {
    width: 16px;
    height: 16px;
}

.cardsort-data-count {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: #9759cb;
    display: inline-block;
    margin-right: 8px;
}

.cards-chips-wrap {
    margin: 0px -5px;
}

.cards-chips-wrap .chip {
    margin: 0px 5px 4px;
}

.cardsorting-wrap-top .subtitle-2 {
    color: var(--gray-900);
    margin-bottom: 8px;
    display: block;
}

.cardsorting-wrap-top .body-text {
    color: var(--gray-700);
}

.create-test-preview-area {
    position: absolute;
    right: -442px;
    top: 0;
    width: 360px;
}

.tree-task-tip {
    margin-top: 12px;
}

.tree-search-nav button {
    border: 0px;
    background-color: unset;
    outline: none;
    box-shadow: none;
    cursor: pointer;
}

.tree_test_result {
    position: absolute;
    width: 100%;
    bottom: -36px;
}

.build-tree-search-wrap {
    position: relative;
}

.tree-search-nav .disabled-btn {
    pointer-events: none;
    opacity: 0.3;
    cursor: not-allowed;
}

.create-test-preview-area-inner {
    padding: var(--2XL);
    text-align: center;
    margin: 12px 0 0;
    background: #ffffff;
    box-shadow: 0px 2.43006px 19.4405px rgb(0 0 0 / 7%);
    border-radius: 8.10021px;
}

.support-button,
.support-button:hover {
    border-radius: 100%;
    width: 64px;
    display: inline-flex;
    align-items: center;
    padding: 0;
    position: fixed;
    bottom: 70px;
    right: 40px;
    z-index: 999;
    line-height: 30px;
    text-decoration: none;
    background: #000;
    font-size: 0;
    height: 64px;
    justify-content: center;
}

.support-button svg {
    margin-right: 0px;
}

.support-button path {
    stroke: #fff;
}

.support-button:hover {
    background: #2b2b2b !important;
    transition: 0.2s;
}

.card-sorting-creating-test-wrap .accordian-header .info-wrap {
    display: none;
}

.accordian-header .info-wrap {
    display: flex;
    display: flex;
    top: 1px;
}

#hours_spend_online .css-319lph-ValueContainer,
#education_level .css-319lph-ValueContainer {
    padding-left: 16px;
}

#hours_spend_online.focused .css-319lph-ValueContainer,
#education_level.focused .css-319lph-ValueContainer {
    padding-left: 16px;
}

/***Publish page css***/
.ordersummary-table-wrap {
    margin-top: 24px;
}

.ordersummary-table-wrap table {
    width: 100%;
}

.checkout-modal-wrap .credit-card-field #field-wrapper label:nth-child(2) {
    width: calc(100% - 240px);
}

.ordersummary-table-wrap table td {
    padding-bottom: 16px;
    vertical-align: middle;
    color: var(--gray-700);
}

.ordersummary-table-wrap table tr td:last-child {
    text-align: right;
    color: var(--gray-900);
}

.pay-on-fly-order-summary-total {
    border-top: 1px solid var(--gray-200);
}

.order-credits-required-row td {
    border-top: 1px solid #e9e9e9;
}

.ordersummary-table-wrap table tr:first-child td {
    border: 0;
}

.ordersummary-table-wrap table .pay-on-fly-order-summary-total td {
    padding-top: 8px;
    color: var(--gray-900);
    font-size: 24px;
    font-family: "sk-modernistbold";
}

.outstanding-amount-total {
    display: flex;
    align-items: center;
    justify-content: end;
}

.crdis-price-text {
    /* font-weight: 500;
      font-size: 14px;
      line-height: 25px; */
    text-align: right;
    color: var(--gray-600);
    margin-right: 7px;
    text-decoration: line-through var(--gray-900);
}

.green-color-txt {
    color: #378b10 !important;
}

.pay-on-fly-coupon-code-wrap {
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    overflow: hidden;
}

.pay-on-fly-promo-code-hdr {
    background: #fcfcfc;
    border-radius: 10px 10px 0px 0;
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px;
    cursor: pointer;
}

.pay-on-fly-payment-methods .pay-on-fly-promo-code-hdr {
    cursor: default;
}

.promocode-inner-form-wrap {
    padding: 22px 22px 32px;
    border-top: 1px solid var(--gray-400);
}

.pubish-payment-inner-wrap .checkbox-wrap p {
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-700);
    font-weight: 500;
}

.promocode-field-wrap {
    margin-top: 22px;
    display: flex;
    align-items: center;
    width: 100%;
}

.promocode-field-wrap .field-error .caption {
    position: absolute;
}

.promocode-field-wrap .form-group {
    max-width: 100%;
}

.apply-promo-code-btn button,
.remove-promo-code-btn button {
    min-width: 170px;
    margin-left: 40px;
}

.promocode-inner-form-wrap p,
.pay-on-fly-promo-code-hdr span {
    color: var(--gray-900);
}

p.sc-eDvSVe {
    font-size: 12px;
    font-weight: 500;
    color: #ff0000;
}

.promo-code-applied-wrap {
    display: flex;
    align-items: center;
    margin: 10px 0;
}

.promo-code-applied-wrap .promocode-text i {
    margin-right: 4px;
}

.promo-code-applied-wrap .remove-promocode-icon {
    margin-left: 9px;
    cursor: pointer;
}

.promo-code-applied-wrap .remove-promocode-icon img {
    width: 24px;
}

.promo-code-applied-wrap .promocode-text {
    color: var(--gray-900);
    font-weight: 500;
}

.promocode_description {
    width: 100%;
    margin: 0px 15px;
}

.promocode-field-wrap .input-right-icon {
    right: 14px;
}

.promocode_description p,
.coupon-code-error {
    font-weight: 600;
    font-size: 14px;
    line-height: 33px;
    display: flex;
    align-items: center;
    color: #378b10;
    margin-top: 22px;
}

.coupon-code-error {
    color: #ff0000;
    margin: 22px 15px 0px;
}

.promocode-text img {
    width: 24px;
    margin-right: 7px;
}

.pay-promo-close img {
    width: 24px;
    cursor: pointer;
}

.pay-on-fly-payment-methods {
    margin-top: 40px;
}

.add-paymentmethod-wrap {
    margin: 20px 0px 15px 0px;
}

.addedpayment-cards-wrap {
    align-items: center;
}

.addedpayment-cards-wrap .card-left-side {
    display: flex;
    align-items: center;
}

.addedpayment-cards-wrap .card-left-side label {
    display: flex;
    align-items: center;
    margin: 0px;
}

.addedpayment-cards-wrap .card-left-side label p {
    margin: 0px 0px 0px;
}

.addedpayment-cards-wrap .primary-card {
    margin: 0 10px;
    font-weight: bold;
}

.addedpayment-cards-wrap .card-left-side label .checkmark {
    top: -10px;
}

.card-last-number {
    font-weight: 400;
    font-size: 16px;
    line-height: 33px;
    margin-right: 20px;
    position: relative;
    top: 1px;
}

.addedpayment-cards-wrap {
    margin-bottom: 22px;
    border: 1px solid var(--gray-400);
    height: 80px;
    border-radius: 10px;
    justify-content: space-between;
    padding: 0px 20px;
}

.addedpayment-cards-wrap .card-left-side p img {
    width: 40px;
    margin: 0 1px 0 0;
    height: 32px;
}

.input_error,
.card-error {
    border-color: #ff0000 !important;
}

span.input_error,
.card-error {
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: #ff0000 !important;
    margin-top: 1px;
}

.add-card-field-hold .selected_card_type {
    position: absolute;
    right: 14px;
    width: 41px;
    top: 14px;
    z-index: 2;
}

.remove-card {
    display: inline-block;
    cursor: pointer;
}

.remove-card img {
    width: 24px;
}

.publish-page-bottom-wrap .card-secure-text {
    display: flex;
    align-items: center;
    margin: 10px 0 32px;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-700);
}

.publish-page-bottom-wrap .card-secure-text svg {
    margin-right: 7px;
}

.publish-page-bottom-wrap button {
    width: 100%;
}

.text-danger {
    color: #ff0000 !important;
}

.add-paymentmethod-wrap .form-group {
    max-width: 100%;
}

.congratulation-modal-wrap .modal-body {
    padding: 0px;
}

.congrts-img {
    width: 100%;
}

.congrats-modal-text {
    padding: 0px 10px 64px 10px;
    text-align: center;
    position: relative;
    z-index: 2;
    margin-top: -70px;
}

.congrts-modal-wrap {
    margin-top: 40px;
}

.congrats-modal-text h2 {
    color: #9759cb;
    margin: 16px 0 32px;
}

.congrats-modal-text p {
    color: var(--gray-900);
    margin: 0;
    padding: 0px 40px;
}

.publish-page-row .recurit-panel-top-head p {
    margin-top: 20px;
}

.publish-page-row .recurit-panel-top-head p a,
.publish-page-row .recurit-panel-top-head p button {
    color: var(--gray-900);
    text-decoration: underline;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    padding: 0px;
    min-height: auto;
    margin: 0px 2px;
    border: 0px !important;
    border-radius: 0px !important;
}

.publish-page-row .recurit-panel-top-head p a:hover,
.publish-page-row .recurit-panel-top-head p button:hover {
    color: #5c208d !important;
}

.cards-accepted-wrap span {
    margin-right: 20px;
}

.cards-accepted-wrap span img {
    width: 40px;
    height: 32px;
    object-fit: contain;
}

.cards-accepted-wrap {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.publish-page-loader {
    display: flex;
    min-height: calc(100vh - 220px);
    align-items: center;
    justify-content: center;
}

.added-payment-method-cards-wrapper .overline {
    display: block;
    padding-left: 15px;
    margin-bottom: 20px;
    width: 100%;
}

.add-paymentmethod-wrap .sc-bcXHqe {
    -webkit-box-flex: 0;
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    margin-bottom: 10px;
    width: 100%;
}

.add-paymentmethod-wrap .credit-card-field {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
}

.add-paymentmethod-wrap #field-wrapper {
    height: 65px !important;
    background: #ffffff !important;
    border: 1px solid var(--gray-400) !important;
    border-radius: 10px !important;
    padding: 8px 20px !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.add-paymentmethod-wrap #field-wrapper:hover {
    border-color: var(--gray-700) !important;
}

.add-paymentmethod-wrap #field-wrapper label {
    margin: 0px 5px !important;
}

.add-paymentmethod-wrap #field-wrapper input {
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 33px !important;
    color: var(--gray-900) !important;
    background-color: unset !important;
}

.same-card-error #field-wrapper input {
    color: #ff0000 !important;
}

.same-card-error #field-wrapper input:-webkit-autofill,
.same-card-error #field-wrapper input:-webkit-autofill:hover,
.same-card-error #field-wrapper input:-webkit-autofill:focus,
.same-card-error #field-wrapper input:-webkit-autofill:active {
    -webkit-text-fill-color: #ff0000 !important;
}

.add-paymentmethod-wrap .active-card-input #field-wrapper {
    border: 1px solid var(--gray-700) !important;
}

.add-paymentmethod-wrap .sc-bcXHqe p {
    display: none;
}

/*.add-paymentmethod-wrap #field-wrapper.is-invalid input{
  color: #ff0000 !important;		
  }*/

.add-paymentmethod-wrap .credit-card-error #field-wrapper label:nth-child(2) input,
.add-paymentmethod-wrap .exp-date-error #field-wrapper label:nth-child(3) input {
    color: #ff0000 !important;
}

.add-paymentmethod-wrap #field-wrapper input::placeholder {
    color: var(--gray-500);
    opacity: 1;
}

.add-paymentmethod-wrap #field-wrapper input:-ms-input-placeholder {
    color: var(--gray-500);
}

.add-paymentmethod-wrap #field-wrapper input::-ms-input-placeholder {
    color: var(--gray-500);
}

.toggle-button-group-wrap .toggle-btn-repeat {
    margin-bottom: 22px;
}

.toggle-button-group-wrap .toggle-btn-repeat .switch {
    height: auto;
}

.toggle-button-group-wrap .switch input:checked+.slider~p {
    color: var(--gray-900);
}

.row.add-paymentmethod-wrap .icon-medium {
    position: relative;
    top: 19px;
    left: 7px;
}

label.switch {
    height: auto;
}

.screen-question-radio .toggle-custom-class .switch {
    display: inline-flex;
}

.screen-question-radio .toggle-custom-class .info-wrap {
    top: 6.5px !important;
}

/***Prefer test css***/
.preference-designs-inner-hold {
    display: flex;
    width: auto !important;
    flex-wrap: wrap;
    margin: 0px -16px;
}

.preference-test-designs-repeat {
    width: 50%;
}

.upload-image-hold {
    width: 50%;
    padding: 0px 16px 40px;
}

.upload-image-inner-wrapper {
    height: 100%;
    background: #ffffff;
    border: 1px dashed var(--gray-500);
    border-radius: 10px;
    padding: 15px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 350px;
    position: relative;
    max-width: 413px;
}

.upload-image-hold .upload-image-inner-wrapper {
    width: 100%;
    max-width: 100%;
}

.upload-image-inner-wrapper .toast-message-wrap {
    width: 100%;
    position: absolute;
    top: 103%;
    z-index: 2;
}

.test-welcome-image-wrap .input_error {
    padding: 14px;
    width: 100%;
    margin: 0 auto;
    position: absolute;
    bottom: 0px;
    background: rgba(255, 255, 255, 0.8);
}

.prefer-test-preview-bottom-wrap button img {
    width: 16px;
    height: 16px;
}

table.prefrence-aggreatedtable.prefer-aggregatd-data-table.table.mt-32 thead th:first-child {
    width: 370px;
}

.file_error_pref {
    border-color: #ff0000;
}

.upload-image-information-wrapper .subtitle-2 {
    color: var(--gray-900);
}

.upload-image-information-wrapper .body-text {
    margin: 8px 0;
    color: var(--gray-700);
}

.upload-image-information-wrapper .caption {
    color: var(--gray-700);
}

.upload-image-information-wrapper {
    text-align: center;
}

.up-img-btn {
    min-width: 154px;
    margin: 50px auto 0;
    display: flex;
    padding: 0;
    overflow: hidden;
}

.up-img-btn img {
    margin-right: 11px;
}

.up-img-btn input {
    position: absolute;
    left: 0px;
    right: 0px;
    height: 100%;
    opacity: 0;
}

.added-design-preview-thum {
    background: #ffffff;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
}

.preference-test-designs-repeat .added-design-preview-thum {
    max-width: 100%;
}

.added-design-preview-thum {
    max-width: 413px;
}

.preference-test-designs-repeat {
    padding: 0px 16px 40px;
}

.prefer-design-image-view-hold {
    width: 100%;
}

.prefer-test-thum-data-hold {
    display: flex;
    align-items: center;
}

.added-design-img-thm {
    background: #ffffff;
    border: 1px solid var(--gray-400);
    text-align: center;
    margin-bottom: 24px;
    position: relative;
    overflow: hidden;
    padding: 12px;
}

.added-design-img-thm img {
    height: 300px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

.design-preview-btn-wrap {
    position: absolute;
    top: 0;
    opacity: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.added-design-img-thm:hover .design-preview-btn-wrap {
    opacity: 1;
}

.design-preview-btn-wrap button img {
    width: 16px;
    height: 16px !important;
    object-fit: contain;
}

.design-preview-btn-wrap a {
    display: inline-block;
    text-decoration: none !important;
}

.design-preview-btn-wrap button,
.design-preview-btn-wrap button:focus,
.design-preview-btn-wrap button:hover {
    background: #ffffff !important;
    border-color: var(--gray-50) !important;
    color: var(--gray-900) !important;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    min-width: 106px;
}

.prefer-designpreview-thum-data-wrap {
    padding: 25px 25px 25px 0;
    width: calc(100% - 25px);
}

.prefe-test-name-wrap .edit-btn {
    padding: 2px;
    margin-left: 14px;
    display: flex;
    cursor: pointer;
}

.prefe-test-name-wrap {
    margin-bottom: 25px;
    min-height: 30px;
}

.prefer-test-preview-bottom-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.prefer-thum-bg-color-wrap {
    position: relative;
    display: flex;
    align-items: center;
    font-size: 12px;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-900);
}

.prefer-thum-bg-color-wrap .form-group {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    left: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.prefer-thum-bg-color-wrap .form-group label {
    display: none;
}

.prefer-thum-bg-color-wrap .form-group .input-right-icon {
    display: none;
}

.prefer-bg-colorpiker {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-900);
}

.prefer-bg-colorpiker input {
    height: 32px;
}

.bg-color-box {
    border: 1px solid var(--gray-400);
    box-shadow: 0px 3px 4px rgb(0 0 0 / 7%);
    border-radius: 100%;
    margin-left: 12px;
    width: 32px !important;
    height: 32px !important;
    cursor: pointer;
}

.prefer-bg-colorpiker label {
    top: 0px;
    left: 0px;
    width: 100%;
    cursor: pointer;
}

.designs-preview-modal .modal-content {
    background: none;
    border-radius: 0px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.designs-preview-modal .modal-body {
    padding: 0px !important;
}

.prefer-design-wrap .form-group {
    max-width: 100%;
}

.prefer-text-designs-wrap .cardsorting-wrap-top {
    border-bottom: 0px;
}

.add-pfere-design-guide-text p {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-700);
}

.add-pfere-design-guide-text {
    margin-bottom: 28px;
    margin-top: 40px;
}

.add-pfere-design-guide-text p img,
.add-pfere-design-guide-text p svg {
    margin-right: 10px;
}

.prefe-test-name-wrap p,
.prefe-test-name-wrap .auto-width-input {
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 39px);
}

.image-edit-name-input {
    display: flex;
    align-items: center;
    max-width: 100%;
}

.prefe-test-name-wrap .auto-width-input input {
    border: 0px;
    border-bottom: 1px solid var(--gray-600);
    border-radius: 0px;
    outline: none;
    width: 100%;
}

.prefe-test-name-wrap .form-group {
    max-width: 100%;
    width: 100%;
}

.prefer-design-drag-icon {
    width: 25px;
    text-align: center;
}

.add-more-design-opton button img {
    width: 17px;
    height: 17px;
}

.inline-error-message {
    display: flex;
    margin-top: 20px;
}

.inline-error-message p {
    margin-left: 8px;
}

.text-color-red {
    color: #ff0000;
}

.prefer-design-view-img-hold {
    margin: 0;
    display: grid;
    position: relative;
    align-items: center;
}

.prefer-design-view-img-hold .secondary-btn {
    background: #fff;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}

.designs-preview-modal .modal-dialog {
    width: 100%;
    -webkit-transform: none !important;
    transform: none !important;
    max-width: 100%;
}

.prefer-design-full-view {
    margin-top: -20px;
}

.prefer-design-full-view {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 29px;
}

.close.black-bg {
    background-color: var(--gray-900) !important;
    border-radius: 100% !important;
    width: 32px !important;
    height: 32px !important;
    border: 1px solid var(--gray-50) !important;
}

/******* New Question Css *************/

.lightgraybox {
    /*background: #FCFCFC;*/
    border: 1px solid var(--gray-400);
    border-radius: 12px;
    padding: 24px 24px 24px 12px;
}

.grey-bg .lightgraybox {
    background: #fcfcfc;
}

.questionbox-top {
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

/*.question-topleftbox {
      align-items: center;
      width: calc(100% - 120px);
  }
  .question-topbuttonbox {
      width: 120px;
  }*/
.question-topbuttonbox>div {
    width: 40px;
    text-align: center;
    cursor: pointer;
}

.questiondrag {
    width: 25px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.questiondrag>img {
    height: 20px;
    width: 20px;
}

.questiondrag svg {
    width: 16px;
    height: 16px;
}

.questiondescription-s {
    padding-left: 25px;
    padding-top: 10px;
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-700);
}

.question-optionbox {
    padding-left: 25px;
    display: flex;
    width: 100%;
    margin-top: 12px;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    color: var(--gray-700);
}

.question-optionbox.logicq-view {
    justify-content: space-between;
}

.question-optionbox .radio-btn-wrap {
    min-height: 24px;
    margin-bottom: 0px;
}

.question-optionbox .checkbox-wrap {
    margin-bottom: 0px;
}

.questionreadmode-left {
    display: flex;
    align-items: center;
}

.scalquestion-outer {
    padding: 0px 25px;
    margin-top: 12px;
}

.scale-lnthbox {
    margin-bottom: 12px;
}

.question-tags {
    display: flex;
    flex-wrap: wrap;
}

.question-tags .tag {
    margin-bottom: 2px;
    margin-top: 2px;
}

.question-tags .purple-tag {
    border: 1px solid #efdcff;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    min-height: 25px;
}

.scale-typebox {
    margin-top: 12px;
}

.question-scalebox-input>div>div {
    width: 100%;
    font-size: 16px;
    line-height: 30px;
    margin-top: 12px;
    font-weight: 400;
    color: var(--gray-700);
}

.scale-lnthbox {
    color: var(--gray-700);
}

.scale-lnthbox span {
    color: #171637;
}

.padd-lr-25 {
    padding: 0px 25px;
}

.grecaptcha-badge {
    z-index: 555 !important;
}

/*********** Question input Css **************/

.question-card-wrapper {
    display: flex;
}

.question-card-inner {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 20px;
}

.question-card-inner p {
    margin-top: 15px;
    width: 100%;
    font-weight: 500;
}

.questioninputbox {
    position: relative;
}

.questioninputbox .sqa-check-top .custom-control.custom-checkbox {
    align-items: center;
}

.questioninputbox span.info-icon.info-wrap {
    width: 40px;
    text-align: center;
    cursor: pointer;
    justify-content: center;
    margin-right: 5px;
    display: flex;
}

.sqa-check-top .form-group {
    z-index: unset !important;
}

.questioninputbox .tooltip-wrapper.top-tooltip {
    margin-left: 0px;
    z-index: 9;
    left: auto;
    right: -130px;
    top: 9px;
}

.tooltip-wrapper {
    display: none;
    cursor: pointer;
}

.questioninputbox {
    padding: 10px 0px;
}

.questioninputbox .sqa-check-top .icon-small,
.questioninputbox .form-group.custom-control .icon-small {
    width: 24px;
    height: 24px;
}

.questioninputbox .bd-que-slide-left {
    display: flex;
    align-items: center;
    font-family: "Inter", sans-serif !important;
}

.questioninputbox .small-dropdown.change-questiontype-dropdown {
    margin-left: 7px;
}

.questioninputbox .create-projectmodal-form-group {
    /*    margin-top:25px;*/
}

.questioninputbox .form-group.input-field {
    width: 100%;
    max-width: 100%;
}

.questioninputbox .button-wrap {
    margin-top: 25px;
}

.questioninputbox .button-wrap button {
    padding: 10px 40px;
}

.questioninputbox .sqa-check-top.singlechoice-addlogic {
    width: 100%;
}

.questioninputbox .form-group.custom-control.d-flex {
    margin-bottom: 0px;
    align-items: center;
    width: 100%;
}

.questioninputbox .ans-list-wrap {
    margin-top: 20px;
}

.questioninputbox .ans-list-repeat.saved-ans-repeat {
    display: flex;
    align-items: center;
    margin: 0px !important;
    margin-top: 25px !important;
}

.questioninputbox .ans-list-repeat.saved-ans-repeat .ans-icon,
.questioninputbox .ans-list-repeat.saved-ans-repeat .ans-close-row {
    position: relative;
    top: -10px;
}

.statementbox .draginputbox,
.statementbox .draginput-crossicon-inner {
    position: relative;
    top: -10px;
}

.questioninputbox .ans-list-repeat.saved-ans-repeat:last-of-type {
    margin-bottom: 0px !important;
}

.questioninputbox .ans-list-repeat.saved-ans-repeat:first-of-type {
    margin-bottom: 0px !important;
}

.questioninputbox .ans-icon {
    margin-right: 10px;
}

.questioninputbox .ans-data {
    width: 100%;
}

.questioninputbox .ans-close-row {
    margin-left: 10px;
}

.add-other-survey {
    display: flex;
    align-items: center;
    padding-left: 0;
    margin-top: 5px;
    margin-bottom: 30px;
}

.questioninputbox .survey-question-dropdoen-wrap {
    margin-bottom: 20px;
}

.points-outer {
    display: flex;
    margin: 30px 0px;
    justify-content: space-between;
}

.questioninputbox .dropdown-container {
    z-index: 9;
}

.questioninputbox .dropdown-container.form-group.input-field.mb-0.focused {
    width: 300px;
}

.scalebuttonbox span {
    margin-right: 10px;
    font-weight: 600;
}

.questioninputbox span.tag.purple-tag {
    font-size: 12px;
    background: var(--gray-900);
    border-color: var(--gray-900);
    color: var(--gray-50);
    display: inline-flex;
}

.tagbox {
    margin-bottom: 20px;
}

.draginput-inner {
    width: 100%;
    display: flex;
    align-items: center;
}

.draginputbox {
    margin-right: 10px;
}

.full {
    width: 100%;
}

.draginput-main {
    width: 100%;
}

.questioninputbox button.ghost-btn.ghost-small.btn-with-icon.btn-with-icon-left {
    margin-top: 20px;
    margin-bottom: 20px;
}

.questioninputbox .ghost-btn button.btn.primary-small {
    padding: 10px 40px;
}

.add-more-question-option .stud-tiles-hold {
    display: flex;
    flex-wrap: wrap;
}

.add-more-question-option .stud-tiles-hold .question-card-wrapper {
    margin: 0px 0px 10px !important;
    width: 25%;
    /*    margin-top: 25px !important;*/
    padding: 0px 5px;
}

.sqa-check-top span.toggle-btn-wrap,
.questioninputbox span.toggle-btn-wrap {
    min-height: 24px;
}

.questioninputbox .sqa-check-top .custom-control.custom-checkbox {
    align-items: center;
    display: flex;
}

.survey-added-question-repeat {
    margin-top: 20px;
}

/****Tree test css****/
.treeScrollbar {
    background: #ffffff;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 16px;
    border-radius: 10px;
    height: 513px !important;
    overflow: hidden;
}

.build-tree-top-left {
    display: flex;
    position: relative;
}

.build-tree-top-left i {
    margin-left: 3px;
    display: none !important;
    align-items: center;
    position: absolute;
    right: 2px;
    top: 7px;
    display: flex;
}

.treeScrollbar .ans-list-repeat.selected-card-cat-repeat {
    background: #efdcff;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 8px;
    min-height: 49px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.rst__collapseButton {
    background-image: url(../img/collaps-minmum.svg) !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    width: 24px !important;
    height: 24px !important;
    background-size: 24px !important;
}

.rst__expandButton {
    background-image: url(../img/collaps-plus-icon.svg) !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    width: 24px !important;
    height: 24px !important;
    background-size: 24px !important;
}

.treeScrollbar .ans-data {
    width: calc(100% - 117px);
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.treeScrollbar .ans-close-row svg {
    width: 16px;
    height: 16px;
}

.treeScrollbar .ans-list-repeat.selected-card-cat-repeat .ghost-btn {
    position: absolute;
    right: 57px;
}

.treeScrollbar .ans-close-row {
    cursor: pointer;
}

.treeScrollbar .ans-close-row span,
.rst__toolbarButton span {
    display: flex;
}

.rst__tree.userQTree {
    height: calc(100% - 50px) !important;
}

.ReactVirtualized__Grid.ReactVirtualized__List.rst__virtualScrollOverride {
    height: 414px !important;
}

.rst__node {
    margin-bottom: 0px;
}

.rst__nodeContent {
    width: calc(100% - 44px);
    margin-top: -3px;
}

.rst__rowWrapper {
    padding: 0px 0px 0px 5px;
    height: 60px;
    display: flex;
    align-items: center;
    position: relative;
    background: var(--gray-50);
}

.rst__row {
    background: #efdcff !important;
    border-radius: 8px;
    height: 49px;
    display: flex;
    padding: 12px 16px;
    align-items: center;
    min-width: 320px !important;
}

.rst__moveHandle,
.rst__loadingHandle {
    box-shadow: none;
    outline: none;
    background-color: unset;
    border: 0px;
    height: 16px;
    width: 16px;
    background-image: url(../img/drag-icon.svg);
    border-radius: 0;
    background-size: 16px;
    margin-left: 0;
    margin-right: 0px;
}

.rst__rowContents {
    border: 0px;
    background: none;
    box-shadow: none;
    display: flex;
    align-items: center;
    padding: 0 0px 0 var(--m);
    width: calc(100% - 50px);
}

.rst__rowLabel {
    width: calc(100% - 210px);
}

.rst__rowToolbar {
    align-items: center;
    margin-right: 0px;
}

.rst__toolbarButton {
    margin-left: 16px;
    cursor: pointer;
}

.rst__toolbarButton:first-child {
    margin-left: 0px;
}

.rst__rowTitle .form-control,
.treeScrollbar .ans-data .form-control {
    display: flex !important;
    padding: 0 !important;
    align-items: center !important;
    border-radius: 0 !important;
    border: 0 !important;
    height: auto;
}

.rst__rowTitle input,
.treeScrollbar .ans-data .form-control input {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-900);
    border: 0;
    padding: 0;
    background: none;
    height: auto;
    min-height: auto;
}

.rst__rowTitle input:focus,
.treeScrollbar .ans-data .form-control input:focus {
    outline: none;
}

.rst__rowTitle input::placeholder,
.treeScrollbar .ans-data .form-control input::placeholder {
    color: var(--gray-900);
}

.rst__rowTitle input:-ms-input-placeholder,
.treeScrollbar .ans-data .form-control input:-ms-input-placeholder {
    color: var(--gray-900);
}

.rst__rowTitle input:-ms-input-placeholder,
.treeScrollbar .ans-data .form-control input:-ms-input-placeholder {
    color: var(--gray-900);
}

.rst__rowTitle span {
    font-weight: 500 !important;
    font-size: 14px;
    line-height: 22px;
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: block;
}

.rst__rowTitle span input {
    font-size: 14px !important;
    line-height: 22px !important;
}

.rst__toolbarButton svg {
    width: 16px;
    height: 16px;
}

.add-node-wrap.withoutborder {
    margin-top: 22px;
}

.tree-nodes-delete-all-count {
    margin-top: 28px;
    display: flex;
    align-items: center;
}

.tree-nodes-delete-all-count span {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: #9759cb;
    margin-right: 14px;
}

.rst__lineFullVertical::after,
.rst__lineHalfVerticalTop::after,
.rst__lineHalfVerticalBottom::after {
    width: 1.5px !important;
    background: var(--gray-700) !important;
}

.rst__lineHalfHorizontalRight::before {
    height: 1.5px !important;
    width: 50% !important;
    top: 28.7px !important;
    background: var(--gray-700) !important;
}

.rst__lineHalfVerticalTop::after,
.rst__lineHalfVerticalBottom::after {
    /* top: 0; */
    height: 46.7% !important;
}

/* .ans-list-repeat.selected-card-cat-repeat:after {
      content: "";
      width: 2px;
      height: 14px;
      bottom: -19px;
      background: var(--gray-700) !important;
      position: absolute;
      left: 22px;
  } */

.ReactVirtualized__Grid__innerScrollContainer:after {
    content: "";
    width: 1.5px;
    height: 14px;
    top: 3px;
    background: var(--gray-700) !important;
    position: absolute;
    left: 22px;
}

.rst__virtualScrollOverride {
    overflow-x: hidden !important;
}

.error_class {
    background: #ffd3d3 !important;
    border: 1px solid #ff0000 !important;
}

.error_class .rst__rowTitle span,
.error_class .rst__rowTitle input {
    color: #a60000;
}

.error_class .rst__rowTitle input::placeholder,
.error_class .rst__rowTitle input:-moz-placeholder,
.error_class .rst__rowTitle input:-ms-placeholder {
    color: #a60000;
}

.error_class .rst__rowToolbar .rst__toolbarButton:first-child {
    display: none;
}

.tree-answer-list-wrap .rst__rowLabel {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 0px;
}

.tree-answer-list-wrap .rst__rowTitle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tree-answer-list-wrap .rst__rowLabel .rst__rowTitle button {
    background: no-repeat;
    border: 0;
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    text-align: center;
    color: var(--gray-900);
    position: relative;
    display: flex;
    align-items: center;
    margin: 0;
    flex-wrap: nowrap;
    padding: 0px;
    cursor: pointer;
}

.tree-answer-list-wrap .rst__rowLabel .rst__rowTitle button:after {
    content: "";
    width: 24px;
    height: 24px;
    margin-left: 9px;
    display: inline-block;
    border-radius: 100%;
    margin-top: 0;
    background: #ffffff;
    border: 1px solid var(--gray-500);
}

.rst__rowTitle .btn:hover {
    background: none !important;
}

.tree-answer-list-wrap .correct-answer-node .correct-answer:before {
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    background: var(--gray-900);
    right: 6px;
    border-radius: 100%;
}

.tree-answer-list-wrap .correct-answer-node .rst__rowLabel .rst__rowTitle button:after {
    border-color: var(--gray-900);
}

.rst__rowSearchMatch {
    border: solid 3px #9759cb !important;
    outline: 0px !important;
}

.tree-test-sub-head p:first-child {
    margin-bottom: 22px;
}

.tree-test-top-search {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 19px;
    margin-bottom: 40px;
    position: relative;
}

.tree-test-top-search .tree-test-top-wrap,
.tree-test-top-search .build-tree-search-wrap {
    margin-bottom: 0px;
}

.tree-test-top-search .build-tree-top-left {
    margin-right: 13px;
}

.tree-test-top-wrap {
    margin-bottom: 24px;
    color: var(--gray-900);
}

.build-tree-top-right button {
    position: relative;
}

.build-tree-top-right button input {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    bottom: 0;
    opacity: 0;
}

.build-tree-search-wrap {
    margin-bottom: 20px;
}

.build-tree-search-wrap input {
    background-color: var(--gray-50) !important;
}

.build-tree-task-wrap .clear {
    display: none;
}

.build-tree-task-title-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
    color: var(--gray-900);
}

.delete-tree-task {
    display: inline-block;
    cursor: pointer;
}

.full-width-input .form-group {
    max-width: 100%;
}

.build-tree-task-wrap .project-name-guide-text {
    display: none;
}

.build-tree-task-wrap {
    margin-bottom: 32px;
}

.build-tree-task-wrap:last-child {
    margin-bottom: 0px;
}

.build-task-answer-wrap .correct-answer {
    display: flex;
    align-items: center;
    margin-top: 20px;
    color: var(--gray-900);
    flex-wrap: wrap;
    line-height: 25px;
    margin: 1px 0px;
}

.color-black,
.black-color {
    color: var(--gray-900) !important;
}

.pink-color {
    color: var(--primary-pink-200) !important;
}

.gold-color {
    color: var(--tertiary-gold-300) !important;
}

.cursor-pointer {
    cursor: pointer;
}

.purple-color {
    color: #9759cb;
}

.correct-asnwer-div {
    display: flex;
    align-items: center;
    margin-left: 2px;
    color: rgba(55, 139, 16, 1);
}

.correct-asnwer-div .edit-icon {
    margin-left: 18px;
    cursor: pointer;
    width: 30px;
}

.treetest-task-tree {
    background: #ffffff;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 15px;
    height: 500px !important;
    overflow: auto;
}

.rst__tree {
    height: 514px !important;
    overflow-y: hidden !important;
}

.treetest-task-tree .rst__tree.userQTree {
    height: 100% !important;
    overflow-y: auto !important;
}

.treetest-task-tree .rst__rowContents {
    padding: 16px 0px;
    width: 100%;
}

.correct-answer-node {
    background: #bff0a8 !important;
}

.treetest-task-tree .rst__rowToolbar {
    margin-left: 0px;
    display: none;
}

.tree-task-search-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tree-task-search-wrap .form-group,
.tree-test-top-search .form-group {
    width: 400px;
}

.button-link {
    text-decoration: none !important;
}

.share-link-story {
    border: 1px solid var(--gray-700);
    border-radius: 10px;
    max-width: 460px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    height: 55px;
    padding: 10px 20px;
    justify-content: space-between;
    margin-bottom: 32px;
}

.share-link-story .copy-link {
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    max-width: calc(100% - 30px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--gray-900);
}

/****Tree test css****/

/***Arabic view css****/

.arabic_wrapper input,
.arabic_wrapper textarea,
.arabic_wrapper,
.arabic-wrapper .loginpage .arabic_wrapper {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.loginpage .arabic_wrapper .button,
.loginpage .arabic_wrapper .create-btn,
.arabic_wrapper .login-hdr-right.taking-test-hdr-right a,
.loginpage .arabic_wrapper .selected-page-left-side h1,
.loginpage .arabic_wrapper h1,
.loginpage .arabic_wrapper .h1,
.loginpage .arabic_wrapper .test-design-name-and-option-wrap button {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.arabic_wrapper .tester-welcome-page-wrap button,
.arabic_wrapper .card-sorting-cat-view-wrap h1 {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.arabic-done-with-task-modal .heading,
.arabic-done-with-task-modal .body-text,
.arabic-done-with-task-modal .exit-button,
.arabic-done-with-task-modal .btn {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.arabic-done-with-task-modal .exit-button img {
    margin-right: 10px;
    margin-left: 0px;
}

.section-minimum-height,
.test-welcome-inner-data-hold {
    min-height: calc(100vh - 380px);
    padding-bottom: 50px;
}

.form-group .arabic_wrapper,
.textarea-form-group.arabic_wrapper,
.arabic_wrapper .add-cat-data-btn,
.survey-question-dropdoen-wrap.arabic_wrapper,
.ans-list-wrap.question-prev-wrap .arabic_wrapper .button-wrap,
.ans-list-wrap.arabic_wrapper .ans-list-repeat.saved-ans-repeat,
.arabic_wrapper .ans-list-repeat.saved-ans-repeat,
.ans-list-repeat.selected-card-cat-repeat.arabic_wrapper {
    text-align: right !important;
    direction: rtl !important;
}

.tree-search-inner.arabic_wrapper,
.arabic_wrapper_main .add-node-wrap {
    text-align: right !important;
    direction: rtl !important;
}

.arabic_wrapper_main .tree-test-section-wrap .add-new-memberbtn-option button img,
.arabic_wrapper_main .tree-test-section-wrap .add-new-memberbtn-option button svg {
    margin-left: 10px;
    margin-right: 0px;
}

.arabic_wrapper_main .tree-nodes-delete-all-count .ghost-btn img {
    margin-right: 8px;
    margin-left: 0px;
}

.tree-search-inner.arabic_wrapper .input-position-relative {
    text-align: left !important;
    direction: ltr !important;
}

.arabic_wrapper_main .rst__row {
    text-align: right !important;
    direction: rtl !important;
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.arabic_wrapper_main .tree-answer-list-wrap .rst__rowLabel .rst__rowTitle button:after {
    margin-right: 9px;
    margin-left: 0px;
}

.arabic_wrapper_main .tree-answer-list-wrap .correct-answer-node .correct-answer:before {
    left: 6px;
    right: auto;
}

.arabic_wrapper .rst__toolbarButton {
    margin-right: 10px;
    margin-left: 0px;
}

.arabic_wrapper .rst__toolbarButton button .icon-medium {
    margin-left: 8px;
    margin-right: 0px;
}

.arabic_wrapper .rst__toolbarButton button {
    font-family: "Inter", sans-serif !important;
}

.rst__toolbarButton:hover svg path,
.treeScrollbar .ans-close-row:hover svg path {
    stroke: var(--gray-900);
}

.edit-icon-disabled svg path,
.edit-home-disabled svg path {
    stroke: var(--gray-500) !important;
}

.arabic_wrapper_main .tree-nodes-delete-all-count button img {
    margin-right: 10px !important;
    margin-left: 0px !important;
}

.arabic_wrapper_main .tree-nodes-delete-all-count span {
    margin-right: 0;
    margin-left: 14px;
    text-align: left !important;
    direction: ltr !important;
}

.arabic_wrapper .rst__moveHandle,
.arabic_wrapper .rst__loadingHandle {
    margin-left: 3px;
    margin-right: 0px;
}

.arabic_wrapper .questioninputbox .add-other-survey {
    direction: inherit;
    text-align: right;
    width: 100%;
    justify-content: flex-end;
    flex-direction: row-reverse;
}

.questioninputbox.arabic_wrapper .survey-question-dropdoen-wrap {
    direction: rtl;
}

.arabic_wrapper .questioninputbox .add-survey-answer-btn {
    text-align: right;
}

.arabic_wrapper .questioninputbox .tagbox,
.arabic_wrapper .questioninputbox {
    text-align: right;
}

.form-group .arabic_wrapper .input-right-icon {
    display: none;
}

.form-group .arabic_wrapper .input-with-right-icon .form-control {
    padding-right: 15px;
}

.form-group .arabic_wrapper .control-label,
.textarea-form-group.arabic_wrapper .control-label {
    right: 15px;
    left: auto;
}

.arabic_wrapper .add-cat-data-btn button {
    text-align: left !important;
    direction: ltr !important;
    font-family: "Inter", sans-serif !important;
}

.questioninputbox.arabic_wrapper .ans-list-wrap.arabic_wrapper .small-info-heading {
    text-align: right;
    margin-bottom: 10px;
    font-family: "Inter", sans-serif !important;
}

.rst__rowLandingPad {
    background: var(--gray-200) !important;
    border: 1px dashed var(--gray-600) !important;
}

.prefer-design-action-option.arabic_wrapper {
    text-align: right !important;
    direction: rtl !important;
}

.prefer-design-action-option.arabic_wrapper p,
.arabic_wrapper_main .test-name-wrap .heading {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.prefer-design-action-option.arabic_wrapper .prefe-test-name-wrap .edit-btn {
    margin-right: 14px;
    margin-left: 3px;
}

.prefer-design-action-option.arabic_wrapper .prefer-test-preview-bottom-wrap {
    font-family: "Inter", sans-serif !important;
}

.prefer-design-action-option.arabic_wrapper .prefer-test-preview-bottom-wrap button {
    text-align: left !important;
    direction: ltr !important;
    font-family: "Inter", sans-serif !important;
}

.prefer-design-action-option.arabic_wrapper .prefer-test-preview-bottom-wrap .btn-with-icon img {
    margin-left: 0px;
    margin-right: 8px;
}

.prefer-design-action-option.arabic_wrapper .prefer-test-preview-bottom-wrap .bg-color-box {
    margin-right: 12px;
    margin-left: 0px;
}

/***Arabic view css****/

/***Footer css start here***/
.footer-left-data {
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
}

.footer {
    background: var(--gray-200);
    padding: 12px 40px;
    display: flex;
    align-items: center;
    color: var(--gray-900);
}

.footer-inner-data {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer-right-data a {
    color: var(--gray-700);
    text-decoration: none;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
}

.footer-right-data a:last-child {
    margin-left: 48px;
}

.footer .container {
    max-width: 1920px;
    padding: 0px;
}

/***Footer css end here***/

/************ New Css ***********/

.header-rhs-side .ghost-medium {
    color: var(--gray-50) !important;
}

.welcome-test-preview-area-inner {
    padding: 20px;
    text-align: center;
    margin: 12px 0 0;
    background: #ffffff;
    box-shadow: 0px 2.43006px 19.4405px rgb(0 0 0 / 7%);
    border-radius: 8.10021px;
    /* animation: slideUp 0.9s ease-in-out forwards;
      position: relative; */
}

.create-test-preview-area-inner {
    /* position: relative;
      animation: slideUp 0.9s ease-in-out forwards; */
}

@keyframes slideUp {
    from {
        transform: translateY(90%);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.add-more-question-option {
    position: relative;
}

.hide-side-preview .create-test-preview-area {
    display: none;
}

.questionpreviewinner {
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.arabic_wrapper .sqa-check-top div.position-relative,
.arabic_wrapper .bd-question-top-slide div.position-relative {
    left: -65px !important;
}

.draginput-outer {
    display: flex;
    align-items: center;
}

.statementbox>p.body-text {
    margin-bottom: 25px;
}

.draginput-outer .icon-small {
    width: 24px;
    height: 24px;
}

.draginput-crossicon-inner {
    margin-left: 10px;
}

span.input-right-icon.input-right-without-pointer-cursor {
    cursor: auto;
}

.logicbuttonbox {
    margin-left: 0px;
    margin-right: 67px;
    padding-left: 15px;
}

.logicbuttonbox .toggle-btn-wrap .slider.round {
    left: 85px;
}

.logicbuttonbox .toggle-with-label .toggle_btn_label {
    padding-left: 0px;
}

.add-logic-dropdown>.dropdown {
    display: none !important;
}

.questioninputbox .dropdown-container.form-group.input-field.mb-0.focused {
    width: 200px;
    min-width: 200px;
    margin-left: 20px;
    height: 100%;
}

.questioninputbox .dropdown-container.form-group.input-field .css-13cymwt-control {
    min-height: 55px;
    border-radius: 10px;
}

.questioninputbox {
    color: var(--gray-900);
}

.survey-add-question-wrapper.questioninputbox {
    margin-top: 20px;
}

.survey-question-dropdoen-wrap.arabic_wrapper .logicbuttonbox .toggle-with-label .toggle_btn_label {
    padding-left: 0px;
    left: 70px;
}

.survey-question-dropdoen-wrap.arabic_wrapper .logicbuttonbox {
    margin-left: 0px;
    margin-right: 80px;
}

.survey-question-dropdoen-wrap.arabic_wrapper .logicbuttonbox .toggle-btn-wrap .slider.round {
    left: auto;
}

.ans-list-wrap.arabic_wrapper .ans-close-row {
    margin-left: 0px;
    margin-right: 10px;
}

.ans-list-wrap.arabic_wrapper .ans-icon {
    margin-right: 0px;
    margin-left: 10px;
}

.survey-question-holder.questioninputbox.arabic_wrapper,
.survey-question-holder.questioninputbox {
    margin-top: 20px;
}

.add-more-question-heading {
    margin-bottom: 20px;
}

.cross-q {
    cursor: pointer;
    margin-left: 10px;
}

.cross-q svg {
    width: 24px;
}

.add-more-question-heading,
.question-card-inner {
    color: var(--gray-900);
}

img.question-card-image {
    min-height: 110px;
}

.five-second-test-img {
    position: relative;
}

.five-second-test-img .added-design-img-thm img {
    height: 300px;
    object-fit: contain;
}

.five-second-test-img .design-preview-btn-wrap img {
    height: auto;
}

.five-second-test-img .input_error {
    position: absolute;
    bottom: 20px;
    left: 20px;
}

.five-second-test-img .upload-image-inner-wrapper {
    max-width: 100%;
}

.five-second-test-img .added-design-preview-thum {
    max-width: 100%;
}

.five-second-test-img .prefer-designpreview-thum-data-wrap {
    padding: 25px;
    width: 100%;
}

.five-second-follw-up-questions .cardsorting-wrap-top,
.five-second-updesign .cardsorting-wrap-top {
    border: 0px;
    padding-bottom: 5px;
}

.five-second-updesign .cardsorting-wrap-top p {
    margin: 0px 0px 23px;
}

.sqa-check-top .toggle-btn-wrap {
    width: 45px;
}

/************* Header Menu Mobile Css ********************/

.header-login-userinfo,
.header-workspaceheading {
    font-family: "sk-modernistregular";
    padding: 10px 30px;
    font-weight: 700;
    font-size: 24px;
    line-height: 29px;
}

.header-workspaceheading {
    margin-top: 20px;
}

.workspace-dropdown .hamburger-items svg {
    width: 24px;
}

.m-nagivation-wrap.open-menu:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: -100%;
    background: rgba(0, 0, 0, 0.5);
}

.mobilemenubtn-box {
    margin-top: 21px;
}

.topnavigationlist {
    padding: 0px 30px 0px 30px;
}

.topnavigationlist li a {
    color: var(--gray-600) !important;
}

.middlenavigationlist,
.mobilemenubtn-box {
    padding: 0px 30px;
}

.supportnavigationbox {
    padding: 0px 0px !important;
}

button.btn.primary-large.mobilemenubtn {
    border: 1px solid var(--gray-50) !important;
    width: 100%;
}

.mobilemenubtn {
    margin-top: 20px;
}

.supportnavigationbox.navigation-listing {
    margin: 30px 0px 0px;
    border-top: 1px solid #2b2b2b;
    border-bottom: 1px solid #2b2b2b;
    padding: 5px 0px;
}

.supportnavigationbox.navigation-listing ul li a {
    padding: 15px 30px;
}

.bottomnavigationlist.navigation-listing {
    padding: 5px 30px;
}

@keyframes loader {
    0% {
        width: 0;
    }

    20% {
        width: 10%;
    }

    25% {
        width: 24%;
    }

    43% {
        width: 41%;
    }

    56% {
        width: 50%;
    }

    66% {
        width: 52%;
    }

    71% {
        width: 60%;
    }

    75% {
        width: 76%;
    }

    94% {
        width: 86%;
    }

    100% {
        width: 100%;
    }
}

.progress-bar {
    border-radius: 10px;
    overflow: hidden;
    width: 100%;
}

.progress-bar span {
    display: block;
}

.bar {
    background: gray;
}

.progress {
    /*animation: loader 8s ease forwards;*/
    background: #378b10;
    color: var(--gray-50);
    width: 0;
}

.progress-bar {
    left: 50%;
    max-width: 50%;
    position: absolute;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
}

.accordian-header {
    position: relative;
}

.question-count {
    background: #ffedd9;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f2c690;
    border-radius: 5px;
    color: var(--gray-900);
    font-size: 16px;
    font-weight: 500;
    position: absolute;
    right: 45px;
}

.question-count:empty {
    display: none !important;
}

.questionaddlogic-v {
    width: auto !important;
    padding-left: 0px;
    margin-right: 15px;
}

.questionaddlogic-v .toggle-btn-wrap .slider.round {
    right: 0px;
    left: auto;
}

.questionaddlogic-v .toggle-with-label .toggle_btn_label {
    left: -55px;
    padding-left: 0px;
}

.change-questiontype-dropdown .dropdown-menu {
    top: 24px !important;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    box-shadow: 0px 4px 10px rgb(0 0 0 / 5%);
    min-width: 166px;
}

.change-questiontype-dropdown .dropdown-menu .dropdown-item {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-900);
    cursor: pointer;
    padding: 12px 20px;
}

.questioninputbox .bd-que-slide-left .dropdown {
    font-size: 20px;
    font-weight: 600;
    color: var(--gray-900);
    z-index: 11 !important;
    position: relative;
}

.questioninputbox .bd-que-slide-left .dropdown svg {
    margin-left: 3px;
    position: relative;
}

.arabic_wrapper .questioninputbox .bd-que-slide-left .dropdown svg {
    margin-left: 0px;
    margin-right: 3px;
}

.arabic_wrapper .add-othrnone-survey .none-of-the-above-text {
    margin-left: 0px;
    margin-right: 24px;
}

.questioninputbox .bd-que-slide-left .dropdown button {
    display: flex;
    align-items: center;
}

.change-questiontype-dropdown svg path {
    stroke: var(--gray-900) !important;
    stroke-width: 1.5px !important;
}

span.add-other-survey-left {
    display: flex;
    align-items: center;
    margin-right: 10px;
}

.input_error.followup-question-error {
    margin-top: 0px;
    margin-left: 5px;
    display: block;
}

.five-second-updesign .input_error.followup-question-error {
    margin-left: 0;
    margin-top: 6px;
}

.arabic_wrapper .sqa-check-top .d-flex.form-group.custom-control.custom-checkbox.mb-0.dark-checkbox {
    padding-left: 0;
}

.arabic_wrapper .cross-q {
    margin-left: 0px;
    margin-right: 10px;
}

.arabic_wrapper span.info-icon.info-wrap {
    margin-right: 0px;
    margin-left: 5px;
}

.arabic_wrapper .small-dropdown.change-questiontype-dropdown {
    margin-left: 0px;
    margin-right: 7px;
}

.arabic_wrapper .custom-control {
    padding-left: 0px !important;
}

.question-edit.arabic_wrapper {
    text-align: right;
    direction: rtl;
}

.questioninputbox.arabic_wrapper .dropdown-container.form-group.input-field.mb-0.focused {
    margin-left: 0px;
}

.arabic_wrapper .scalebuttonbox span,
.arabic_wrapper .draginputbox {
    margin-right: 10px;
    margin-left: 10px;
}

.arabic_wrapper .draginput-crossicon-inner {
    margin-left: 0px;
    margin-right: 10px;
    opacity: 0.5;
}

/* .arabic_wrapper .draginputbox{
      opacity: .5; 
  } */

.card-sorting-test-wrap .input-field input:focus~label,
.card-sorting-test-wrap .input-field textarea:focus~label,
.card-sorting-test-wrap .input-field.focused label {
    background: #fcfcfc;
}

/************ Today Css **************/

.viewpart-optional {
    color: var(--gray-700);
    font-size: 18px;
    margin-left: 3px;
}

.arabic_wrapper .btn-with-icon img {
    margin-right: 0px;
    margin-left: 8px;
}

.css-1nmdiq5-menu {
    z-index: 99 !important;
}

.logic-dropdown-readmode .css-b62m3t-container {
    width: 180px;
}

.logic-dropdown-readmode .dropdown-label {
    background: var(--gray-50);
}

.css-t3ipsp-control:hover {
    border-color: var(--gray-500) ccc !important;
}

.questioninputbox .dropdown-container.form-group.input-field .css-t3ipsp-control {
    border-color: var(--gray-500) ccc !important;
    min-height: 55px !important;
    border-radius: 10px;
}

.arabic_wrapper .add-survey-answer-btn img {
    margin-right: 0px;
    margin-left: 6px;
}

.ans-list-wrap [data-rbd-drag-handle-context-id="2"],
.ans-list-repeat.saved-ans-repeat {
    cursor: pointer;
}

.questioninputbox button.btn.primary-small {
    width: 124px;
    text-align: center;
    justify-content: center;
    height: 41px;
    font-size: 14px;
    font-weight: 500;
    font-family: "Inter", sans-serif !important;
}

.survey-logic-added .small-dropdown.add-logic-dropdown .dropdown-container.form-group {
    margin-left: 10px !important;
}

.ans-list-wrap.survey-logic-added.arabic_wrapper .small-dropdown.add-logic-dropdown .dropdown-container.form-group {
    margin-right: 10px !important;
}

.bd-que-slide-left p.body-text-2 {
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
}

.sqa-check-top .body-text-3,
.sqa-check-top,
.logicbuttonbox .medium-font,
.question-topbuttonbox .medium-font {
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    color: var(--gray-900);
}

.questionaddlogic-v.custom-control.mb-0.none-for-mobile.survey-login-toggle-for-big-screen {
    margin-right: 0px;
}

.d-flex.question-topbuttonbox {
    align-items: center;
}

.small-dropdown.add-logic-dropdown {
    margin-left: 20px;
}

.arabic_wrapper .small-dropdown.add-logic-dropdown {
    margin-left: 0px !important;
    margin-right: 20px;
}

.statementbox .body-text-2,
.ans-list-wrap .small-info-heading,
.add-other-survey-left>span {
    font-weight: 500;
}

.scalebuttonbox>span {
    font-weight: 600;
}

.questioninputbox .ghost-btn {
    font-size: 14px;
    font-family: "Inter", sans-serif !important;
}

.cardsorting-wrap-mid-data.arabic_wrapper .added-cat-count-data,
.scalebuttonbox .filter-buttons-wrap,
.questioninputbox .sqa-check-top .custom-control.custom-checkbox,
.add-other-survey .secondary-btn,
.questioninputbox .form-group.custom-control.d-flex {
    font-family: "Inter", sans-serif !important;
}

.ans-list-wrap.arabic_wrapper .ans-close-row,
.ans-list-wrap.arabic_wrapper .ans-icon {
    font-family: "Inter", sans-serif !important;
    line-height: 1;
}

.arabic_wrapper .add-survey-answer-btn {
    text-align: right;
    direction: rtl;
}

.arabic_wrapper span.add-other-survey-left {
    margin-left: 0px;
    font-family: "Inter", sans-serif !important;
    direction: ltr;
    text-align: left;
}

.arabic_wrapper .add-cat-data-btn .btn-with-icon img {
    margin-right: 8px;
    margin-left: 0px;
}

.billing-plan-page-wrapper .css-26l3qy-menu {
    z-index: 5 !important;
}

.dropdown-container.input-field.focused label {
    z-index: 0;
}

.scalebuttonbox .filter-buttons-wrap {
    min-width: 100px;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px var(--gray-50) inset !important;
}

.cardsorting-wrap-mid-data input:-webkit-autofill,
.cardsorting-wrap-mid-data input:-webkit-autofill:hover,
.cardsorting-wrap-mid-data input:-webkit-autofill:focus,
.cardsorting-wrap-mid-data input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #fcfcfc inset !important;
}

.question-answer-holder .question-optionbox .radio-btn-wrap,
.question-answer-holder .question-optionbox .checkbox-wrap {
    cursor: grab;
}

.question-card-inner:hover {
    border: 1px solid var(--gray-900);
}

.question-card-inner {
    cursor: pointer;
}

label.label.upload-image-label {
    margin: 0 !important;
}

.tree-test-top-search .build-tree-top-right button {
    padding: 0;
    min-height: auto;
    line-height: 0px;
    overflow: hidden;
}

.tree-test-top-search .build-tree-top-right button .change-image-link {
    font-size: 12px;
    text-decoration: underline;
    padding: 10px 20px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    min-height: 38px;
    line-height: 17px;
    font-weight: 500;
    min-width: 105px;
    justify-content: center;
}

.tree-test-top-search .build-tree-top-right .browse-files-text {
    line-height: 0px;
}

.up-img-btn .change-image-link {
    min-width: 154px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 30px;
    padding: 14px 30px;
    text-decoration: none;
}

.singleselect-dropdown .dropdown-label {
    z-index: -1;
}

.singleselect-dropdown:hover .dropdown-label {
    color: var(--gray-900) !important;
}

.singleselect-dropdown .css-1s2u09g-control,
.singleselect-dropdown .css-1pahdxg-control {
    background: none;
    cursor: pointer;
}

.multiselect-dropdown .css-1s2u09g-control,
.multiselect-dropdown .css-1pahdxg-control {
    cursor: pointer;
}

.read-only-dropdown .singleselect-dropdown .css-1s2u09g-control,
.read-only-dropdown .singleselect-dropdown .css-1pahdxg-control {
    cursor: default;
}

.read-only-dropdown .multiselect-dropdown .css-1s2u09g-control,
.read-only-dropdown .multiselect-dropdown .css-1pahdxg-control {
    cursor: default;
}

.inc-dec-counter.readonly-counter {
    opacity: 0.5;
    cursor: not-allowed;
}

.inc-dec-counter.readonly-counter button,
.inc-dec-counter.readonly-counter input {
    cursor: not-allowed;
}

.inc-dec-counter.readonly-counter button {
    background-color: #f0f0f0 !important;
}

.skeleton-loading-estimated-panel .estimate-count-area .inc-dec-counter,
.skeleton-loading-estimated-panel .estimate-count-area {
    width: 100%;
    display: block;
}

.skeleton-loading-estimated-panel .estimate-count-area span {
    width: 100% !important;
    display: block;
    margin: 0px !important;
}

.skeleton-loading-estimated-panel span {
    margin: 0px !important;
    height: 20px !important;
}

.skeleton-loading-estimated-panel .estimate-count-area .react-loading-skeleton {
    width: 100% !important;
    display: block;
    margin: 0px;
}

.share-link .congrats-modal-text {
    padding: 32px;
    margin-top: 0;
}

.share-link .modal-header-top h2 {
    margin-bottom: 0px !important;
    color: var(--gray-900);
    text-align: left;
}

.share-link .congrats-modal-text p {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-700);
    text-align: left;
    padding: 0 !important;
}

.share-link-modal-wrap h5.test-link-head.share-link-text {
    margin-top: 0;
    margin-bottom: 12px;
}

.share-link .copy-link-subwrapper h5 {
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    text-align: left;
    margin: 20px 0;
    color: var(--gray-900);
}

.share-link .copy-share-test-wrap {
    width: 100%;
    max-width: 100%;
    margin: 0;
}

.share-link .modal-dialog {
    max-width: 515px;
    width: calc(100% - 15px);
}

.share-link .modal-header-top img {
    width: 32px;
    height: 32px;
}

.publish-test-modal-data {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
}

.publish-modal-text p {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    display: flex;
    align-items: center;
    color: var(--gray-700);
    margin-bottom: 32px;
}

.publish-modal-text p:last-child {
    margin-bottom: 0px;
}

.publish-modal-image-wrap img {
    width: 140px;
}

.publish-modal-text {
    width: calc(100% - 140px);
    padding-right: 44px;
}

.dropdown-item.active,
.dropdown-item:active {
    background: unset;
}

/***Test summary modal css***/
.mobilemenubtn-box button {
    width: 100%;
    margin: 10px 0 14px 0;
}

.test-summary-modal-wrap .modal-dialog {
    max-width: 1144px;
    width: calc(100% - 15px);
}

.row.summary-modal-data-repeat {
    border-bottom: 1px solid var(--gray-400);
    padding: 32px 0;
    margin: 0px;
}

.row.summary-modal-data-repeat:first-child {
    padding-top: 0px;
}

.row.summary-modal-data-repeat .newsingle-question {
    margin-bottom: 20px;
}

.row.summary-modal-data-repeat .newsingle-question:last-child {
    margin-bottom: 0px;
}

.row.summary-modal-data-repeat .newsingle-question .question-topbuttonbox {
    display: none !important;
}

.row.summary-modal-data-repeat .question-readmode-icon,
.row.summary-modal-data-repeat .questiondrag {
    opacity: 0;
}

.col-md-6.summary-left {
    width: 300px;
    flex: 300px;
    max-width: 300px;
    padding-right: 50px !important;
}

.col-md-6.summary-right {
    width: calc(100% - 300px);
    flex: calc(100% - 300px);
    max-width: calc(100% - 300px);
}

.col-md-6.summary-right,
.col-md-6.summary-left {
    padding: 0;
}

.cardsort-cards-view {
    margin-bottom: 32px;
}

.cardsort-cards-view p {
    margin-bottom: 12px;
}

.category-summery-text {
    margin-top: 7px;
    color: var(--gray-700);
}

.summary-left-sec-wrap,
.summary-right-sec-wrap {
    color: var(--gray-900);
}

.summary-cards-category-wrap .purple-tag {
    background: #efdcff;
    border: #efdcff;
    margin-top: 2px;
}

.summary-modal-close-btn-wrap {
    text-align: center;
    margin-top: 32px;
}

.summary-modal-close-btn-wrap button {
    padding: 14px 30px;
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
}

.review-study-small-text {
    margin-top: 20px;
}

.test-summary-modal-wrap .preference-designs-repeat {
    display: flex;
    flex-wrap: wrap;
    margin: 0px -16px;
}

.test-summary-modal-wrap .preference-test-design-wrap {
    width: 50%;
    padding: 0px 16px;
    margin-top: 32px;
}

.test-summary-modal-wrap .task_title {
    margin-top: 12px;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    color: var(--gray-900);
}

.semibold-font {
    font-weight: 600;
}

.test-summary-modal-wrap .added-design-img-thm img {
    height: 300px;
}

.info-not-available,
.no-record {
    font-size: 14px;
}

.dropdown-container .css-133v6e1-option,
.dropdown-container .css-133v6e1-option:hover {
    color: var(--gray-500) !important;
    background: var(--gray-50) !important;
    cursor: not-allowed !important;
}

.tast-prefer-sub-text {
    margin-top: 12px;
}

.test-summary-modal-data .uploaded-project-img.study-review-image-wrap {
    border-radius: 20px;
    overflow: hidden;
}

.test-summary-modal-data .review-task-data-repeat.tree-review-tasks {
    margin: 32px 0;
}

.test-summary-modal-data .review-task-data-repeat.tree-review-tasks:first-child,
.test-summary-modal-data .review-task-data-repeat.tree-review-tasks:first-child .body-text.body-text-3.semi-bold-font {
    margin-top: 0px;
}

.test-summary-modal-data .review-task-data-repeat.tree-review-tasks:last-child {
    margin-bottom: 0px;
}

.test-summary-modal-data .the-correct-answer {
    margin: 20px 0 12px 0;
}

.test-summary-modal-data .review-task-data-repeat.tree-review-tasks p {
    margin: 12px 0 0;
}

.test-summary-modal-data .selected-answer-tree {
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    color: var(--gray-900);
}

.summary-modal-data .filter-buttons-wrap {
    min-width: auto;
    margin: 0 auto;
    display: inline-flex;
}

.row.summary-modal-data-repeat.test-summary-filters {
    text-align: center;
}

.test-summary-participants .row.summary-modal-data-repeat:first-child {
    padding-top: 0px;
}

.test-summary-participants .row.summary-modal-data-repeat {
    padding: 16px 0;
}

.row.test-summary-filters {
    padding-top: 0px;
    border: 0;
}

.test-summary-participants .summary-left-sec-wrap p {
    color: var(--gray-700);
}

.test-summary-participants .col-md-6.summary-right {
    text-align: right;
    width: 268px;
    max-width: 268px;
    flex: 268px;
}

.test-summary-participants .col-md-6.summary-left {
    width: calc(100% - 268px);
    flex: calc(100% - 268px);
    max-width: calc(100% - 268px);
}

.survey-add-question-wrapper .form-control:focus,
.survey-add-question-wrapper .form-control {
    position: initial;
    z-index: 0;
}

.survey-add-question-wrapper .input-field input:focus~label,
.survey-add-question-wrapper .input-field textarea:focus~label,
.survey-add-question-wrapper .input-field.focused label {
    z-index: 0;
}

ul.nationalities-categories {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 24px !important;
    margin-top: -17px;
}

ul.nationalities-categories li label {
    position: relative !important;
    opacity: 1;
    padding: 0px !important;
    top: 0px !important;
    padding-left: 35px !important;
    margin: 0px !important;
    left: 0px;
    line-height: 26px !important;
    cursor: pointer;
}

ul.nationalities-categories li {
    margin: 17px 25px 0px 0px;
}

.nationalities-categories li label p {
    font-size: 16px;
    margin: 0px;
    position: relative;
    top: -1px;
}

.share-social-links.text-left button {
    margin-right: 20px;
}

.share-social-links.text-left button svg,
.share-social-links.text-left button img {
    width: 35px;
    height: 35px;
    min-width: 35px;
    min-height: 35px;
}

button.react-share__ShareButton.twitter__some-network__share-button {
    position: relative;
    top: -3px;
}

.modal-body .share-social-links.text-left {
    display: flex;
    align-items: center;
}

button.react-share__ShareButton.facebook__some-network__share-button svg circle {
    fill: #337fff;
}

button.react-share__ShareButton.twitter__some-network__share-button svg circle {
    fill: #33ccff;
}

button.react-share__ShareButton.whatsapp__some-network__share-button svg circle {
    fill: #00d95f;
}

h5.test-link-head.share-link-text {
    margin-top: 12px;
}

.selected-filter {
    color: #9759cb !important;
}

.selected-filter svg path {
    stroke: #9759cb !important;
}

.publish-btn-custom button {
    width: auto;
    min-width: 270px;
}

.share-participants-link {
    color: var(--gray-900);
}

.share-participants-link a {
    text-decoration: underline;
}

.d-flex.ans-list-repeat.saved-ans-repeat.other-choice-container {
    background: var(--gray-200);
    padding: 4px 4px 4px 20px;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
}

.other-choice-container .ans-close-row span {
    display: flex;
}

.summary-right-sec-wrap .logic-dropdown-readmode {
    /*visibility: hidden;
      height: auto;
      padding: 0;*/
}

.summary-right-sec-wrap .logic-dropdown-readmode {
    position: relative;
}

.summary-right-sec-wrap .logic-dropdown-readmode:after {
    position: absolute;
    content: "";
    top: 0;
    width: 100%;
    background: var(--gray-500);
    height: 100%;
    opacity: 0;
}

.questioninputbox .ans-close-row,
.questioninputbox .ans-icon {
    line-height: 1;
}

.hover-inline-svg {
    display: flex;
}

.hover-inline-svg svg path,
.hover-inline-svg svg .change-stroke {
    stroke: var(--gray-600);
}

.hover-inline-svg svg .change-fill {
    fill: var(--gray-600);
}

.hover-inline-svg:hover svg path,
.input-right-icon:hover .hover-inline-svg svg path,
.hover-inline-svg svg:hover .change-stroke {
    stroke: var(--gray-900) !important;
}

.hover-inline-svg svg:hover .change-fill {
    fill: var(--gray-900);
}

.arabic_wrapper .d-flex.ans-list-repeat.saved-ans-repeat.other-choice-container {
    padding: 4px 4px 4px 4px;
}

.survey-question-holder.questioninputbox.arabic_wrapper button.ghost-btn.ghost-small.btn-with-icon.btn-with-icon-left img,
.survey-question-holder.questioninputbox.arabic_wrapper button.ghost-btn.ghost-small.btn-with-icon.btn-with-icon-left svg {
    margin-right: 8px;
}

.share-social-links-success {
    border-top: 1px solid var(--gray-400);
    border-bottom: 1px solid var(--gray-400);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
    margin: 20px 0;
    min-width: 80%;
}

.share-social-links-success h5 {
    margin: 0 !important;
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-900);
    margin-right: 10px !important;
}

.share-social-links-success .share-social-links.text-center button {
    margin: 0 10px;
    display: flex;
}

.share-social-links-success .share-social-links.text-center button svg,
.share-social-links-success .share-social-links.text-center button img {
    width: 36px !important;
    height: 36px !important;
}

.modal-body .share-social-links-success .share-social-links.text-center button {
    top: 0px;
}

.congratulation-modal-wrap .share-social-links.text-center {
    display: flex;
    align-items: center;
}

.congratulation-modal-wrap .congrts-modal-wrap {
    margin-top: 20px;
}

.congratulation-modal-wrap .congrats-modal-text {
    padding-bottom: 32px;
}

.congratulation-modal-wrap .share-link-story.copy-share-test-wrap {
    margin: 0 auto 32px;
}

/***buy credit page css***/

.buy-credits-page-wrapper {
    max-width: 1097px;
    margin: 52px auto 0px;
}

.buy-credits-page-wrapper .accordian-wrapper .body-text {
    margin: 0 0 10px;
    color: var(--gray-700);
}

.buy-credits-page-wrapper .accordian-wrapper ul {
    padding: 3px 0 1px 15px;
}

.buy-credits-packages-wrapper {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
}

.buy-credit-option-wrap {
    border-left: 1px solid #e3e3e3;
    padding: 32px 40px;
    min-height: 100%;
}

.buy-credit-option-wrap .input-field label {
    z-index: 1;
}

.custom-package-col-wrap .buy-credit-option-wrap {
    border: 0px;
    padding: 32px 0px;
}

.buy-credits-packages-wrapper .row {
    margin: 0px;
}

.package-button-wrapper {
    border-top: 1px solid #e3e3e3;
    padding: 20px 40px 0;
    margin-top: 24px;
}

.package-button-wrapper h2 {
    margin-top: 2px;
}

.package-top-section {
    padding: 0px 40px;
}

.package-buld-amount-discount {
    padding: 24px 40px 0px;
}

.package-top-section .form-group {
    max-width: 100%;
    margin: 20px 0;
    padding-bottom: 2px;
}

.buy-credits-packages-wrapper .col-md-6 {
    padding: 0;
}

.package-buld-amount-discount span {
    color: #ff6db1;
}

.buy-credits-packages-wrapper .input-field input:focus~label,
.buy-credits-packages-wrapper .input-field textarea:focus~label,
.buy-credits-packages-wrapper .input-field.focused label {
    background: #fcfcfc;
}

.package-button-wrapper button {
    margin-top: 32px;
    width: 100%;
}

.buy-credit-option-wrap table {
    width: 100%;
    color: var(--gray-900);
    margin-bottom: 48px;
    display: block;
}

.buy-credit-option-wrap table thead,
.buy-credit-option-wrap table tbody {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.buy-credit-option-wrap table thead {
    margin-bottom: 5px;
}

.buy-credit-option-wrap table tr {
    display: flex;
    align-items: center;
    width: 100%;
}

.package-title-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    left: -3px;
}

.package-title-wrap p {
    min-width: 70px;
    text-align: center;
}

.buy-credit-option-wrap table th {
    font-weight: 600;
    font-size: 12px;
    line-height: 17px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--gray-900);
    display: flex;
    height: 100%;
    width: 33.33%;
    justify-content: center;
}

.package-title-wrap .tag {
    min-width: 75px;
}

.buy-credit-option-wrap table th:last-child,
.buy-credit-option-wrap table td:last-child {
    width: 112px;
}

.buy-credit-option-wrap table th:nth-child(2),
.buy-credit-option-wrap table td:nth-child(2) {
    width: 185px;
    padding-right: 10px;
}

.buy-credit-option-wrap table th:first-child,
.buy-credit-option-wrap table td:first-child {
    width: calc(100% - 297px);
    padding-left: 0;
    text-align: left;
}

.buy-credit-option-wrap table th:first-child {
    justify-content: flex-start;
    padding-left: 0px;
}

.buy-credit-option-wrap table td {
    padding: 16px 0px;
    text-align: center;
    display: flex;
    height: 100%;
    width: 33.33%;
    justify-content: center;
    border: 1px solid transparent;
}

.buy-credit-option-wrap tbody tr {
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 10px;
}

.buy-credit-option-wrap tbody tr:hover td,
.selected-package td {
    background: #ffd6e9;
}

.buy-credit-option-wrap tbody tr:hover {
    border-color: #ffd6e9;
}

.buy-credit-option-wrap tbody tr:hover td:first-child,
.selected-package td:first-child {
    border-radius: 10px 0px 0px 10px;
}

.buy-credit-option-wrap tbody tr:hover td:last-child,
.selected-package td:last-child {
    border-radius: 0px 10px 10px 0px;
}

.selected-package {
    border: 1px solid #a72561 !important;
    border-radius: 10px;
    overflow: hidden;
}

.checkout-modal-wrap .modal-dialog.modal-dialog-centered {
    max-width: 1097px;
}

.checkout-modal-wrap .card-last-number {
    margin-right: 0px;
}

.buy-credits-faq-wrapper {
    padding-top: 100px;
    max-width: 958px;
    margin: 0 auto;
}

.buy-credit-option-wrap {
    color: var(--gray-900);
}

.package-top-section h2+p {
    color: var(--gray-700);
    margin-top: 4px;
}

.buy-credits-faq-wrapper .heading.h1 {
    text-align: center;
    margin-bottom: 60px;
}

.buy-credits-col-wrap p.body-text {
    color: var(--gray-700);
}

.buy-credit-option-wrap table td p {
    color: var(--gray-900) !important;
}

.package-top-section .form-group .input-right-icon {
    display: none;
}

.buy-credit-option-wrap td .react-loading-skeleton,
.custom-package-col-wrap .react-loading-skeleton {
    width: 97% !important;
    min-width: 100px !important;
    display: flex !important;
    height: 25px !important;
    border-radius: 5px !important;
    margin: 0px !important;
}

.custom-package-col-wrap .package-button-wrapper h2 .react-loading-skeleton {
    width: 100px !important;
    min-width: 100px !important;
}

.custom-package-col-wrap p .react-loading-skeleton {
    width: 75% !important;
    min-width: 100px !important;
}

/***checkout modal css ***/
.checkout-modal-wrap .modal-body {
    padding: 32px;
}

.checkout-modal-wrap .pay-on-fly-payment-methods {
    margin-top: 34px;
}

.checkout-modal-wrap .pay-on-fly-payment-methods .row {
    margin: 0px;
    position: relative;
}

.checkout-modal-wrap .add-paymentmethod-wrap label:first-child {
    width: 57%;
}

.checkout-modal-wrap .row.add-paymentmethod-wrap .icon-medium {
    position: absolute;
    top: 19px;
    right: -33px;
    left: auto;
}

.checkout-modal-wrap .pay-on-fly-payment-methods .promocode-inner-form-wrap {
    padding: 0px;
    border: 0px;
}

.checkout-modal-wrap .pay-on-fly-promo-code-hdr {
    border-bottom: 1px solid var(--gray-400);
}

.checkout-modal-wrap .pay-on-fly-payment-methods .row .col-md-4,
.checkout-modal-wrap .pay-on-fly-payment-methods .row .col-md-8 {
    padding: 0px;
}

.checkout-modal-wrap .pay-on-fly-payment-methods .row .col-md-4 {
    width: 344px;
    max-width: 344px;
    flex: 344px;
    border-left: 1px solid #e3e3e3;
    padding: 32px 0;
}

.checkout-modal-wrap .pay-on-fly-promo-code-hdr+.row .col-md-8 {
    max-width: calc(100% - 344px);
    flex: calc(100% - 344px);
    padding: 32px 68px 32px 32px !important;
}

.promocode-inner-form-wrap.pubish-payment-inner-wrap+.row .col-md-12 {
    padding: 0px;
}

.checkout-modal-wrap .added-payment-method-cards-wrapper .overline {
    padding-left: 0px;
}

.checkout-modal-wrap .add-paymentmethod-wrap .sc-bcXHqe,
.checkout-modal-wrap .checkbox-wrap {
    margin-bottom: 20px;
}

.checkout-modal-wrap .publish-page-bottom-wrap .card-secure-text {
    margin: 0px 0 32px;
}

.card-right-side {
    display: flex;
}

.delete-account-btn {
    cursor: pointer;
    display: flex;
}

.checkout-modal-wrap .overline {
    color: var(--gray-700);
}

.checkout-modal-wrap .addedpayment-cards-wrap {
    margin-bottom: 20px;
}

.checkout-modal-wrap .cards-accepted-wrap {
    margin-bottom: 20px;
}

.checkout-modal-wrap .checkboxes.radio_btn_class.gender_btn.d-flex.card-radio-wrap {
    width: 100%;
    max-width: 100%;
}

.checkout-modal-wrap .addedpayment-cards-wrap {
    width: 100%;
    max-width: 100%;
}

.checkout-modal-wrap .ordersummary-table-wrap {
    margin: 0;
    padding: 20px 20px 30px;
    border-bottom: 1px solid #e3e3e3;
    margin-bottom: 0px;
    min-height: 214px;
}

.checkout-modal-wrap .pay-on-fly-payment-methods .row .col-md-4 .heading.h4 {
    padding: 0 20px;
}

.checkout-modal-wrap .pay-on-fly-payment-methods .row .col-md-4 .ordersummary-table-wrap table td,
.checkout-modal-wrap .pay-on-fly-payment-methods .row .col-md-4 .ordersummary-table-wrap table .pay-on-fly-order-summary-total td {
    font-weight: 500 !important;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-700) !important;
    padding: 8px 0px;
    font-family: "Inter", sans-serif !important;
}

.checkout-modal-wrap .pay-on-fly-payment-methods .row .col-md-4 .ordersummary-table-wrap table td:last-child {
    color: var(--gray-900) !important;
}

.green-color {
    color: #378b10;
}

.checkout-modal-wrap .pay-on-fly-payment-methods .row .col-md-4 .ordersummary-table-wrap table td:last-child .green-color {
    color: #378b10;
}

.pay-on-fly-order-summary-total {
    border: 0px;
}

.checkout-modal-wrap .promocode-field-wrap {
    flex-wrap: wrap;
    padding: 49px 20px 0px;
}

.checkout-modal-wrap .promocode-field-wrap .col-md-7 {
    width: 213px;
    max-width: 213px;
    flex: 213px;
    padding: 0;
}

.checkout-modal-wrap .promocode-field-wrap .remove-promo-code-btn,
.checkout-modal-wrap .promocode-field-wrap .apply-promo-code-btn {
    padding-left: 12px;
    width: calc(100% - 213px);
}

.checkout-modal-wrap .promocode-field-wrap button {
    width: auto;
    min-width: auto;
    margin: 0;
    position: relative;
    margin-left: 0px;
}

.checkout-modal-wrap .promocode-field-wrap button i {
    position: absolute;
    right: 2px;
}

.checkout-modal-wrap .promocode-field-wrap .coupon-code-error {
    color: #ff0000;
    margin: 9px 0px 0px 3px;
    line-height: 25px;
}

.checkout-modal-wrap .promocode-field-wrap .promocode_description {
    margin: 9px 0px 0px 3px;
}

.checkout-modal-wrap .promocode-field-wrap .promocode_description p {
    margin: 0px;
}

.checkout-modal-wrap .add-paymentmethod-wrap .credit-card-field {
    -webkit-box-flex: 0;
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
}

.checkout-modal-wrap .row .col-md-12 {
    padding: 0px;
}

.checkout-modal-wrap .col-md-7.publish-field-whidth {
    max-width: 100%;
    width: 100%;
    flex: 100%;
    padding: 0;
}

.loading-modal-wrap .loader-with-text img {
    width: 140px !important;
    margin-bottom: 60px;
}

/************* My account Page Css *******************/

.accountnaviagtion-outer a {
    font-family: "Inter";
    font-style: normal;
    font-size: 16px;
    line-height: 24px;
    color: var(--gray-600);
    text-decoration: none;
    padding: 0px 16px 12px;
    display: inline-block;
}

.rs-inner-profile-wrapper .accountnaviagtion-outer a,
.setting-page-wrapper .accountnaviagtion-outer a,
.credits-page-wrapper .accountnaviagtion-outer a {
    font-size: 18px;
    line-height: 30px;
}

.accountnaviagtion-outer .active a {
    color: var(--gray-900);
    border-bottom: 4px solid var(--gray-900);
}

.accountnaviagtion-outer {
    width: 100%;
    display: flex;
    margin-bottom: 32px;
}

.accountnaviagtion-outer span {
    display: inline-block;
    cursor: pointer;
}

.account-subtitle {
    margin-bottom: 32px;
}

.formbox {
    margin-bottom: 27px;
}

.formbox .change-email-option {
    position: relative;
}

.formbox .change-email-option .form-group {
    width: 100%;
}

.formbox .change-email-option button.secondary-btn.secondary-small {
    position: absolute;
    right: -100px;
    top: 50%;
    transform: translateY(-50%);
}

.formbox .intl-tel-input {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 400px;
}

label.focusedlabel {
    top: -9px !important;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-700) !important;
    background: var(--gray-50);
    padding: 0 8px;
    z-index: 1;
    left: 10px !important;
}

.change-email-button .primary-medium {
    padding: 14px 30px;
    font-size: 18px;
}

.change-password-section {
    margin-top: 50px;
}

.change-password-section .primary-medium {
    margin-top: 25px;
    padding: 14px 30px;
    font-size: 18px;
}

.delete-account-section {
    margin-top: 50px;
}

.delete-account-section p {
    margin-top: 20px;
    margin-bottom: 35px;
}

.delete-account-section .secondary-btn {
    border-color: #ff0000 !important;
    color: #ff0000 !important;
    font-size: 18px;
    padding: 14px 30px;
    background: transparent !important;
}

.delete-account-section .secondary-btn:hover {
    background: #ff0000 !important;
    color: var(--gray-50) !important;
}

.accountloading-box .loader_section {
    text-align: center;
}

.accountloading-box .loader_section img {
    max-width: 80px;
}

.accountloading-box .loader_section {
    min-height: calc(100vh - 300px);
    display: flex;
    align-items: center;
    justify-content: center;
}

/***credits page css***/
.all-credits-count-wrap {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--gray-500);
    border-radius: 24px;
    /* padding: 20px; */
    margin: 8px 0px 40px;
    /* new css */
    padding: var(--4XL) var(--3XL);
    background: linear-gradient(99.39deg, #ffe2c0 6.54%, #bf8ee8 95.12%);
}

.all-credits-count-wrap h3 {
    margin-right: 20px;
}

.all-credits-count-wrap h3 span {
    color: rgba(255, 109, 177, 1);
}

.credits-table-wrap .max-height-table {
    margin-top: 40px;
}

.credits-table-wrap .user-info-col .circular-name-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    font-size: 14px;
    margin-right: 4px;
}

/* New credit css */
.all-credits-count-wrap .credit-count-left .heading.h1 {
    font-size: 70px;
    font-weight: 700;
    line-height: 84px;
    display: flex;
    align-items: center;
}

.all-credits-count-wrap .credit-count-left .heading.h1 span {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    margin-left: 20px;
    font-family: "Inter";
}

.credit-count-left {
    margin-right: 50px;
}

.all-credits-count-wrap .btn.primary-medium {
    margin-bottom: 15px;
}

.table th,
.table td {
    padding: 14px 20px;
    vertical-align: middle;
    border: 0px;
    color: var(--gray-900);
}

.table td {
    vertical-align: top;
}

td.green-text {
    color: #378b10 !important;
}

td.red-text {
    color: #ff0000 !important;
}

.table tr th {
    padding: 10px 20px 0px;
    margin: 0;
    border: 0;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-700);
    white-space: nowrap;
}

.table tr th .tooltip-wrapper {
    white-space: normal;
}

.table tbody tr:hover {
    background: var(--gray-200);
}

.table tbody tr:hover td:first-child {
    border-radius: 5px 0px 0px 5px;
}

.table tbody tr:hover td:last-child {
    border-radius: 0px 5px 5px 0px;
}

.credits-table-wrap {
    max-width: 1070px;
}

.credits-table-wrap .table tr th:first-child,
.credits-table-wrap .table tr td:first-child {
    width: 130px;
}

.credits-table-wrap .table tr th:last-child,
.credits-table-wrap .table tr td:last-child {
    width: 100px;
}

.credits-table-wrap .table tr th:nth-child(3),
.credits-table-wrap .table tr td:nth-child(3) {
    width: 260px;
}

.credits-table-wrap .td-flex-wrap.body-text.bodt-text-2.medium-font a {
    display: none;
}

.load-more-data {
    display: table;
    margin: 0 auto;
    cursor: pointer;
    font-size: 16px;
}

.td-flex-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.td-icon-span {
    display: flex;
    margin-left: 5px;
}

.td-sort-wrap {
    display: flex;
    align-items: center;
}

.td-sort-wrap span {
    margin-left: 8px;
}

.td-sort-wrap span svg {
    width: 16px !important;
}

.change-email-modal.confirmation-modal-wrap .subtitle-2 {
    font-size: 14px;
    line-height: 25px;
}

.change-email-modal.confirmation-modal-wrap .modal-dialog {
    max-width: 556px;
}

/********* Change Email Page Css ****************/

.change-email-header {
    background: var(--gray-900);
    padding: 17px 20px;
}

.change-email-body {
    padding-top: 60px;
    padding-left: 150px;
    padding-right: 150px;
}

.change-email-page-wrapper {
    position: relative;
}

.change-email-page-wrapper footer {
    position: fixed;
    width: 100%;
    bottom: 0px;
}

.change-email-body-top {
    border-bottom: 1px solid #e3e3e3;
    padding-bottom: 20px;
    margin-bottom: 40px;
}

.change-email-body-top p.body-text.body-text-2.medium-font {
    color: var(--gray-700);
    margin-top: 10px;
}

.change-email-page-wrapper .change-email-form .change-email-form-field {
    margin-bottom: 25px;
}

.email-sent-modal .modal-dialog {
    max-width: 556px;
}

.email-sent-modal .modal-body {
    padding: 32px;
}

.email-sent-modal .modal-inner-text p.body-text.body-text-3.medium-font {
    color: var(--gray-700);
    margin-top: 30px;
    margin-bottom: 24px;
}

.email-sent-modal .close {
    opacity: 1;
}

.email-sent-modal .close img {
    width: 20px;
}

/*********** Change Password Modal Css *******************/

.change-pass-modal .modal-dialog {
    max-width: 542px;
    width: calc(100% - 15px);
}

.change-pass-modal .form-group {
    max-width: 100%;
}

.password-suggestion-text {
    color: var(--gray-700);
    margin: 20px 0px;
}

.newpasswordbox {
    margin-bottom: 20px;
}

.change-password-button {
    margin-top: 20px;
}

.change-password-button button {
    width: 100%;
}

/***Earn page css****/
.invite-earn-form-right {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 20px;
    padding: 60px;
}

.invite-earn-form-right .form-group,
.invite-earn-form-right .share-link-story.copy-share-test-wrap {
    max-width: 400px !important;
}

.share-pr-link-to-refer {
    min-height: 124px;
}

.invite-earn-form-right .share-social-links.text-left button {
    margin-right: 32px;
}

.invite-earn-balancebox {
    display: flex;
    align-items: center;
    margin-bottom: 60px;
}

.refer-earn-workspace-wrap .body-text-3.mb-8 {
    margin-bottom: 12px;
}

.refer-earn-workspace-wrap .dropdown-container.input-field.focused label {
    background: #fcfcfc;
    color: var(--gray-700) !important;
}

.earn-pricebox {
    display: flex;
    align-items: end;
    margin-left: 16px;
}

.earn-pricebox h1 {
    color: #9759cb;
    line-height: 35px;
}

.earn-pricebox p {
    margin-left: 6px;
    color: #9759cb;
}

.profile-info-personal-link .form-group {
    max-width: 460px;
    margin: 19px 0 12px 0px !important;
}

.profile-info-personal-link .input-field input:focus~label,
.profile-info-personal-link .input-field textarea:focus~label,
.profile-info-personal-link .input-field.focused label {
    background: #fcfcfc;
}

.profile-info-personal-link .btn {
    min-width: 105px;
    margin-bottom: 40px;
}

.share-link-story.copy-share-test-wrap {
    margin: 19px 0 20px;
}

.profile-info-personal-link p {
    color: var(--gray-900);
}

.invite-earn-data-text {
    background-image: url(../img/referal-gradient.svg);
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 20px;
    padding: 80px;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.invite-earn-data-text h1 {
    font-size: 60px;
    line-height: 72px;
    color: var(--gray-900);
    width: 100%;
}

.earn-invite-left-info-icons {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin: 40px -15px;
}

.earn-invite-left-info-icons svg,
.earn-invite-left-info-icons img {
    width: 80px;
    height: 80px;
    margin: 0px 15px;
}

.profile-earn-invite .row.align-items-center {
    align-items: unset !important;
    margin: 0px;
}

.profile-earn-invite .row.align-items-center .col-md-6 {
    min-height: 100%;
}

.earn-invite-info p,
.earn-invite-info p a {
    color: var(--gray-900);
}

span.no_payment_add {
    display: flex;
    align-items: center;
    line-height: 1;
}

.no_payment_add img,
.no_payment_add svg {
    margin-right: 10px;
}

.no_payment_add_box {
    border-bottom: 1px solid #e3e3e3;
    padding-bottom: 30px;
    margin-top: 5px;
    margin-bottom: 32px;
}

.addcard-outer .overline {
    letter-spacing: 4px;
    font-size: 12px;
    color: var(--gray-700);
    margin-top: 30px;
    display: inline-block;
}

.payment-info-modal .addcard-outer .overline {
    margin-top: 0px;
}

.payment-info-modal .cardlabel-box {
    margin-bottom: 32px;
}

.addcard-outer .add-paymentmethod-wrap {
    margin-top: 25px;
}

.addcard-outer .add-paymentmethod-wrap .credit-card-field {
    max-width: 514px;
}

.card-secure-text {
    font-size: 12px;
    color: var(--gray-700);
    display: flex;
    align-items: center;
    margin-bottom: 32px;
    font-weight: 500;
    max-width: 477px;
}

.card-secure-text span {
    font-weight: 500;
}

.card-secure-text img,
.card-secure-text svg {
    margin-right: 10px;
}

.addcardbuttonbox-inner button {
    width: 118px;
}

.addcardbuttonbox-inner .primary-large {
    margin-right: 20px;
}

span.overline.saved-card {
    margin-top: 0;
}

.payments-cards.d-flex {
    width: 100%;
    max-width: 478px;
    border: 1px solid var(--gray-400);
    height: 80px;
    border-radius: 10px;
    line-height: 80px;
    display: flex;
    align-items: center;
    margin: 20px 0px 32px;
    padding: 0px 20px;
    justify-content: space-between;
}

.card-left-side img {
    width: 40px;
}

.addnewbutton-box {
    border-bottom: 1px solid var(--gray-400);
    padding-bottom: 25px;
    max-width: 700px;
}

.card-left-side>label {
    margin-bottom: 0px;
}

.card-right-side {
    display: flex;
    align-items: center;
}

p.body-text.body-text-3.primary-card {
    margin: 0px 15px;
}

.card-right-side button.ghost-btn.ghost-small {
    margin: 0px 5px;
}

.delete-account-modal-wrap p {
    color: var(--gray-900);
}

.delete-account-modal-wrap .modal-dialog-centered {
    max-width: 549px;
}

.checkout-modal-wrap .save-card-for-future {
    margin-top: 20px;
}

.invite-input-hold .form-group {
    width: 100%;
    position: relative;
    margin: 0px !important;
}

.invite-input-hold .form-group .caption {
    position: absolute;
    bottom: -18px;
}

.invite-input-hold .btn {
    margin: 0 0 0 20px;
}

.refer-social-link button {
    margin-left: 20px !important;
    margin-right: 0px !important;
    margin-left: 20px !important;
    margin-right: 0px !important;
    border: 0;
    background: unset;
}

.refer-earn-workspace-wrap .form-group,
.invite-input-hold .form-group,
.share-pr-link-to-refer .personal-link-box {
    max-width: 460px;
}

.share-pr-link-to-refer .share-link-story {
    max-width: 100%;
}

.share-link-loader {
    opacity: 0.6;
}

.share-link-loader p {
    opacity: 0.3;
}

/***Notifications page css****/
.settings-data-wrap {
    max-width: 700px;
    color: var(--gray-900);
    padding-bottom: 20px;
}

.settings-subtitle {
    border-bottom: 1px solid #e3e3e3;
    padding: 0 0 32px;
    margin-bottom: 32px;
}

.settings-subtitle p {
    margin-top: 8px;
}

.marketing-section-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}

.marketing-section-wrap .form-info-text .body-text-1 {
    margin-bottom: 14px;
}

.marketing-section-wrap .form-info-text .body-text-3 {
    color: var(--gray-700);
}

.marketing-section-wrap .form-info-text {
    width: calc(100% - 42px);
}

.marketing-section-wrap .settings-toggle-wrap {
    width: 42px;
    position: relative;
    top: 7px;
}

.system-notification-section-wrap .body-text-3 {
    color: var(--gray-700);
    margin-top: 14px;
}

.system-notification-section-wrap .body-text-3 a {
    font-size: 14px;
    line-height: 22px;
}

.load-more-data button {
    width: 111px;
    min-height: 41px;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    padding: 10px 20px;
}

/***micro loading button****/
.micro-loading {
    position: relative;
    top: 2px;
    left: 0;
    bottom: 0;
    right: 0;
    transform: scale(0.9);
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
}

.three-balls {
    margin: 0 auto;
    width: 70px;
    text-align: center;
    left: 0;
    right: 0;
    top: 9px;
    position: relative;
}

.three-balls .ball {
    position: relative;
    width: 10px;
    height: 10px;
    margin: 0px 2px;
    border-radius: 50%;
    display: inline-block;
    -webkit-animation: bouncedelay 3s infinite cubic-bezier(0.62, 0.28, 0.23, 0.99) both;
    animation: bouncedelay 3s infinite cubic-bezier(0.62, 0.28, 0.23, 0.99) both;
}

.three-balls .ball1 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

.three-balls .ball2 {
    -webkit-animation-delay: -0.08s;
    animation-delay: -0.08s;
}

@keyframes bouncedelay {
    0% {
        bottom: 0;
        background-color: #e32f83;
    }

    16.66% {
        bottom: 23px;
        background-color: #9c9c9c;
    }

    33.33% {
        bottom: 0px;
        background-color: #9c9c9c;
    }

    50% {
        bottom: 23px;
        background-color: #793eab;
    }

    66.66% {
        bottom: 0px;
        background-color: #793eab;
    }

    83.33% {
        bottom: 23px;
        background-color: #e32f83;
    }

    100% {
        bottom: 0;
        background-color: #e32f83;
    }
}

@-webkit-keyframes bouncedelay {
    0% {
        bottom: 0;
        background-color: #e32f83;
    }

    16.66% {
        bottom: 23px;
        background-color: #9c9c9c;
    }

    33.33% {
        bottom: 0px;
        background-color: #9c9c9c;
    }

    50% {
        bottom: 23px;
        background-color: #793eab;
    }

    66.66% {
        bottom: 0px;
        background-color: #793eab;
    }

    83.33% {
        bottom: 23px;
        background-color: #e32f83;
    }

    100% {
        bottom: 0;
        background-color: #e32f83;
    }
}

.formbuttombox button {
    min-width: 118px;
}

.formbuttombox .btn.primary-large {
    margin-right: 20px;
}

.invoicetable td {
    font-weight: 500;
}

.invoicetable .paid-status {
    background: var(--gray-900);
    color: var(--gray-50) !important;
    display: inline-block;
    font-size: 12px;
    line-height: 17px;
    padding: 4px 10px;
    border: 1px solid var(--gray-900);
    border-radius: 4px;
}

.credits-link-header {
    cursor: pointer;
    font-size: 16px;
    line-height: 24px;
}

.billing-plan-page-wrapper .card-right-side .tag {
    margin-right: 12px;
}

.billing-plan-page-wrapper .card-right-side p {
    margin-right: 12px;
    color: var(--gray-900);
}

.billing-plan-page-wrapper .card-right-side {
    position: relative;
}

.billing-plan-page-wrapper .card-right-side .make-primary-card {
    position: absolute;
    right: -160px;
}

.billing-plan-page-wrapper .card-right-side .make-primary-card button {
    min-width: 124.91px;
}

/***Phone number field css***/
.phone-number-field {
    max-width: 400px;
}

.PhoneInput {
    display: flex;
    align-items: center;
    border: 1px solid var(--gray-600);
    border-radius: 10px;
    height: 55px;
    background: unset !important;
    color: var(--gray-600);
    position: relative;
    padding-left: 21px;
    z-index: 1;
    font-size: 16px;
    line-height: 33px;
    font-weight: 400;
    position: relative;
    z-index: 0;
}

.field-error .PhoneInput {
    border-color: var(--danger-red-200) !important;
}

.phone-number-available .PhoneInput,
.PhoneInput:hover {
    border: 1px solid var(--gray-700);
}

.PhoneInputInput,
.PhoneInputInput:focus {
    flex: 1;
    min-width: 0;
    border: 0px;
    outline: none;
    color: var(--gray-900);
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
}

.PhoneInputCountryIcon {
    width: calc(var(--PhoneInputCountryFlag-height) * var(--PhoneInputCountryFlag-aspectRatio));
    height: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--square {
    width: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--border {
    background-color: var(--PhoneInputCountryFlag-backgroundColor--loading);
    box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor),
        inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor);
}

.PhoneInputCountryIconImg {
    display: block;
    width: 100%;
    height: 100%;
}

.PhoneInputInternationalIconPhone {
    opacity: var(--PhoneInputInternationalIconPhone-opacity);
}

.PhoneInputInternationalIconGlobe {
    opacity: var(--PhoneInputInternationalIconGlobe-opacity);
}

.phone-number-dropdown .form-control {
    width: 100% !important;
    display: flex !important;
    align-items: center;
    border: 1px solid var(--gray-600) !important;
    border-radius: 10px !important;
    height: 55px !important;
    background: unset !important;
    color: var(--gray-600) !important;
    position: relative !important;
    padding-left: 62px !important;
    font-size: 16px !important;
    line-height: 33px !important;
    font-weight: 400 !important;
    z-index: 0 !important;
}

.phone-number-dropdown .form-control:hover {
    color: var(--gray-700) !important;
}

.phone-number-dropdown .flag-dropdown {
    background: none !important;
    border: 0 !important;
    left: 12px;
    position: absolute !important;
}

.phone-number-dropdown .flag-dropdown .selected-flag {
    top: 0;
    height: 100%;
    background: none !important;
    background-color: unset !important;
}

.phone-number-available .form-control,
.phone-number-available .form-control:hover {
    border: 1px solid var(--gray-700) !important;
    color: var(--gray-900) !important;
}

.field-error .form-control {
    border-color: var(--danger-red-200) !important;
}

.phone-number-dropdown .country-list {
    margin: 0 !important;
    width: 370px !important;
    border-radius: 5px !important;
    box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.1);
}

.phone-number-dropdown .country-list .country {
    padding: 12px 9px !important;
    font-size: 16px;
    font-weight: 500;
}

.phone-number-dropdown .selected-flag .arrow {
    background-image: url(../img/icons/chevron.svg);
    border: 0px !important;
    width: 16px !important;
    height: 16px !important;
    background-size: 16px !important;
    background-repeat: no-repeat;
    opacity: 0.4;
    top: 0px !important;
}

.phone-number-dropdown .selected-flag .arrow.up {
    background-image: url(../img/icons/chevron-up.svg);
}

/* Styling native country <select/>. */

.PhoneInputCountry {
    position: relative;
    align-self: stretch;
    display: flex;
    align-items: center;
    margin-right: var(--PhoneInputCountrySelect-marginRight);
}

.PhoneInputCountrySelect {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    border: 0;
    opacity: 0;
    cursor: pointer;
}

.PhoneInputCountrySelect[disabled],
.PhoneInputCountrySelect[readonly] {
    cursor: default;
}

.PhoneInputCountrySelectArrow {
    display: block;
    content: "";
    width: var(--PhoneInputCountrySelectArrow-width);
    height: var(--PhoneInputCountrySelectArrow-width);
    margin-left: var(--PhoneInputCountrySelectArrow-marginLeft);
    border-style: solid;
    border-color: var(--gray-700);
    border-top-width: 0;
    border-bottom-width: var(--PhoneInputCountrySelectArrow-borderWidth);
    border-left-width: 0;
    border-right-width: var(--PhoneInputCountrySelectArrow-borderWidth);
    transform: var(--PhoneInputCountrySelectArrow-transform);
    opacity: 1;
    width: 7px;
    height: 7px;
    margin-left: 8px;
}

.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon+.PhoneInputCountrySelectArrow {
    opacity: 1;
    color: var(--PhoneInputCountrySelectArrow-color--focus);
}

.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon--border {
    box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus),
        inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus);
}

.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon .PhoneInputInternationalIconGlobe {
    opacity: 1;
    color: var(--PhoneInputCountrySelectArrow-color--focus);
}

.table-wrapper {
    max-width: 1070px;
}

.table-wrapper .table-responsive {
    margin-bottom: 10px;
}

table.table.invoicetable th:last-child {
    width: 100px;
}

table.table.invoicetable th:first-child {
    min-width: 110px;
}

.test-summary-modal-data .upload-project-img img,
.test-summary-modal-data .uploaded-project-img img {
    max-height: 381px;
    height: auto;
}

/**old login page css****/

/***test result pages css****/
.test-results-navigation {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100% !important;
}

.test-results-navigation li,
.test-results-navigation li a {
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    color: var(--gray-600);
    display: flex;
    margin-bottom: 40px;
    align-items: center;
}

.test-results-navigation li a {
    margin-bottom: 0px;
}

.test-results-navigation li a:hover {
    text-decoration: none;
}

.test-results-navigation li:last-child {
    margin-bottom: 0px;
}

.test-results-navigation li span,
.test-results-navigation li span a {
    background: var(--gray-600);
    border-radius: 20px;
    display: flex;
    align-items: center;
    width: 40px;
    height: 40px;
    justify-content: center;
    margin: 0 12px 0 0;
    text-decoration: none;
}

.test-results-navigation li span span.inline-svg-small.inline-svg-- {
    width: auto !important;
    height: auto !important;
    margin: 0;
    background: unset;
}

.test-results-navigation .gray-50-svg .change-fill {
    fill: #fff;
}

.test-results-navigation li.selected-option,
.test-results-navigation li.selected-option a {
    color: var(--primary-pink-200);
}

.test-results-navigation li.selected-option span {
    background: var(--primary-pink-200);
}

.residents-summary-next-line {
    margin-bottom: 32px;
}

/**boxes css**/
.box-small {
    background: var(--gray-50);
    border: 1px solid var(--gray-400);
    border-radius: var(--l);
    max-width: 320px;
    padding: var(--2XL);
    min-height: 50px;
}

.box-medium {
    background: var(--gray-50);
    border: 1px solid var(--gray-400);
    border-radius: var(--l);
    max-width: 650px;
    padding: var(--2XL);
    min-height: 50px;
}

.box-large {
    background: var(--gray-50);
    border: 1px solid var(--gray-400);
    border-radius: var(--l);
    max-width: 100%;
    padding: var(--2XL);
    min-height: 50px;
}

/**boxes css**/
.summary-right-sec-wrap p:last-child .residents-summary-next-line {
    margin-bottom: 0;
}

.heading-with-import-btn .change-image-link {
    text-decoration: none;
    font-size: 12px;
    padding: 10px 20px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    min-height: 38px;
    line-height: 17px;
    font-weight: 500;
    min-width: 105px;
    justify-content: center;
}

.cardsorting-wrap-top .heading-with-import-btn .subtitle-2 {
    margin: 0px 16px 0px 0px;
}

.cardsorting-wrap-top .heading-with-import-btn {
    margin-bottom: 20px;
}

.heading-with-import-btn button {
    padding: 0;
    min-height: auto;
    line-height: 0px;
    overflow: hidden;
}

.live-test-header .test-header-left-data {
    width: calc(100% - 414px);
}

.test-result-header-wrapper .test-name-wrap .heading {
    min-width: 50px;
    margin: 0px 20px 0 0;
    max-width: 100%;
}

.test-result-header-wrapper .completed-date-text {
    margin-left: var(--m);
}

.test-result-header-wrapper .test-header-tags {
    margin: 0px;
}

.test-result-published button {
    margin: 0px 10px;
}

.test-result-published {
    display: flex;
    margin: 0px -10px;
}

.test-result-header-wrapper .test-name-wrap {
    max-width: calc(100% - 320px);
    width: auto;
}

.completed-test-header .test-header-left-data {
    width: calc(100% - 370px);
}

.completed-test-header .test-header-right-data button {
    margin-left: 10px;
}

.completed-test-header .test-name-wrap {
    max-width: calc(100% - 390px);
    min-width: auto;
}

.test-result-header-wrapper .caption {
    color: var(--gray-700);
    font-size: 12px;
}

.test-result-header-wrapper .caption b {
    color: var(--gray-900);
}

.tech-icon-wname span {
    display: block;
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-900);
    margin-top: var(--l);
}

.tech-icon-wname {
    text-align: center;
    margin-bottom: var(--2XL);
}

.device-option-data-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 32px 0 0px 0px;
}

.device-selected-count {
    font-size: 24px;
    font-family: "sk-modernistbold";
    line-height: 29px;
    color: var(--gray-900);
    text-align: center;
}

.device-list-repeat.active {
    background: #efdcff;
    border-radius: 10px;
    height: 100%;
}

.device-list-repeat {
    padding: 40px 40px;
}

.device-disabled {
    opacity: 0.2;
}

.circle-stats-group {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin: 4px -4px;
}

.percent {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0px 20px;
    margin: 24px 0px 0 0;
    width: 222px;
}

.nationality-modal-wrap .percent {
    width: 222px !important;
}

.circle-stats-group svg {
    position: relative;
    width: 191px;
    height: 191px;
}

.percent .tooltip-wrapper {
    display: none !important;
    min-width: 130px;
    left: calc(50% - 68px);
    bottom: 102%;
    width: auto;
    margin: 0px;
    z-index: 2;
}

.percent-inner .tooltip-wrapper p {
    text-align: center;
}

.percent-inner:hover .tooltip-wrapper {
    display: block !important;
}

.percent-inner {
    position: relative;
}

.circle-stats-group svg.circular-flag-icon circle {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: rgba(240, 240, 240, 1);
    stroke-width: 12;
    stroke-linecap: round;
}

.circle-stats-group svg.circular-flag-icon circle:last-of-type {
    stroke-dasharray: 625px;
    stroke-dashoffset: calc(625px - (625px * var(--circlepercent)) / 100);

    stroke: rgba(0, 0, 0, 1);
}

.circle-stats-group .number {
    position: absolute;
    top: 17px;
    left: 12px;
    text-align: center;
    background: transparent;
    justify-content: center;
    max-width: 100%;
    width: 160px;
    height: 160px;
    border-radius: 100%;
    display: flex;
    padding: 15px;
}

.circle-stats-group .number p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 109px;
    display: block;
    margin: 0 auto;
}

.percent.othercircle {
    cursor: pointer;
}

.othercircle .icon-medium {
    width: 40px;
    height: 40px;
}

.circle-stats-group .number .country-flag-icon {
    margin: 8px 0px;
    top: 0;
    display: inline-block;
    width: auto !important;
}

.circle-stats-group .number .country-flag-icon svg {
    margin: 0px;
    width: 40px !important;
    height: 40px !important;
}

.circle-stats-group .number h3 {
    font-weight: 200;
    font-size: 3.5rem;
}

.box-outer-heading {
    margin-bottom: 20px;
}

.chart-download-with-heading .vertical-bar-chart .download-chart-png {
    top: 93px;
    z-index: 1;
}

.box-heading-with-dropdown {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.box-heading-with-dropdown .dropdown-container .css-1pahdxg-control,
.box-heading-with-dropdown .dropdown-container .css-1pahdxg-control:focus,
.box-heading-with-dropdown .dropdown-container .css-1s2u09g-control {
    width: 180px;
}

.circle-stats-group .number h3 span {
    font-size: 2rem;
}

.circle-stats-group .title h2 {
    margin: 25px 0 0;
}

.nationality-modal-wrap .modal-dialog {
    max-width: 798px;
}

.nationality-modal-wrap .btn {
    margin: 32px auto 0px;
    display: table;
}

/***dropdown css****/
.question-dropdown-container .dropdown-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fcfcfc;
    cursor: pointer;
    padding: 16.5px 20px;
    /* min-height:112px; */
    border-bottom: 1px solid var(--gray-400);
}

.question-dropdown-container .dropdown-header span {
    white-space: normal;
}

.question-dropdown-container .dropdown-header-left {
    padding-right: 0;
    width: calc(100% - 40px);
}

.question-dropdown-container .dropdown-header-arrow-buttons {
    width: 130px;
}

.question-dropdown-container .dropdown-header-bottom {
    display: flex;
    align-items: center;
    width: 100%;
}

.question-dropdown-container .dropdown-header-right {
    min-width: 40px;
    text-align: right;
}

.question-dropdown-container .dropdown-header-right .dropdown-header-chevron {
    position: relative;
    top: 9px;
    cursor: pointer;
}

.dropdown-header-bottom {
    display: flex;
    align-items: center;
}

.dropdown-header-arrow-buttons a {
    display: inline-flex;
    width: 40px;
    height: 40px;
    background: var(--gray-900);
    border-radius: 100%;
    align-items: center;
    justify-content: center;
    margin: 0px var(--m);
}

.dropdown-header-arrow-buttons a img {
    width: 24px;
}

.dropdown-header-arrow-buttons .disabled-link {
    background: var(--gray-400);
    cursor: not-allowed;
}

.dropdown-header-top p {
    font-weight: 600;
    font-size: 12px;
    line-height: 17px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--var-gray-600);
}

.question-dropdown-container .active-question {
    color: var(--gray-900);
    margin-right: 4px;
}

.dropdown-question-item {
    display: flex;
    align-items: center;
    padding: 16px 0;
    cursor: pointer;
}

.dropdown-question-item .tag {
    margin-left: 17px;
}

.question-dropdown-container .text-lowercase {
    text-transform: uppercase !important;
}

.dropdown-active-question {
    color: #9759cb;
}

.dropdown-list-container {
    max-height: 340px;
    overflow-y: auto;
    position: absolute;
    width: 100%;
    padding: 0px 0px;
    background: var(--gray-50);
    z-index: 99;
}

.dropdown-list-container .dropdown-list-item {
    display: block;
    padding: 3px 24px;
}

.dropdown-list-container .dropdown-list-item:hover {
    background: #fcfcfc;
}

.dropdown-header-selected-question {
    box-sizing: border-box;
    word-break: break-word;
    white-space: break-spaces;
    width: calc(100% - 130px);
}

.dropdown-header-selected-question .body-text-1 {
    color: var(--gray-900);
}

.box-title p {
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.participants-overview-data-wrap {
    width: 100%;

    align-items: center;
}

.analyze-results-page-wrapper .matrix-full-view .participants-overview-data-wrap {
    margin: 75px 0 0px;
}

.participants-overview-right {
    padding-left: 20px;
}

.participants-overview-left .h2 {
    font-size: 60px;
    line-height: 72px;
    color: #9759cb;
}

.participants-overview-right p {
    color: var(--gray-900);
    margin: 2px 0;
}

.participants-overview-footer {
    margin-top: 20px;
    color: var(--gray-900);
}

.participants-overview-footer-language {
    align-items: center;
    margin-top: var(--l);
}

.participants-overview-footer-language img {
    width: 30px;
    height: 30px;
    margin-right: 12px;
}

.participants-overview-footer-language p {
    text-transform: capitalize;
}

.reported-tester-count-overview .caption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(100% - 26px);
}

.reported-tester-count-overview .caption .info-wrap {
    width: auto !important;
    margin-left: 4px;
    left: 0px !important;
}

.reported-tester-count-overview {
    padding: 8px 12px;
    margin: 8px 0px 10px;
    border-radius: 5px !important;
}

.flag-icon {
    margin-right: 8px;
}

.overview-results-test-details-data-wrap .items {
    align-items: center;
    margin: 0px 0 24px 0px;
    flex-wrap: wrap;
}

.overview-results-test-details-data-wrap {
    margin-top: 9px;
    color: var(--gray-900);
}

.overview-results-test-details-data-wrap .items:last-child {
    margin-bottom: 0px;
}

.overview-results-test-details-data-wrap .items h1 {
    color: #9759cb;
    margin: 0 15px 0 0;
    min-width: 25px;
}

.pie-chart-box {
    display: flex;
    padding-top: var(--3XL);
    position: relative;
}

.pie-chart-area svg {
    position: relative;
    left: -10px;
    top: 0;
}

.pie-chart-box .chart-info-wrap {
    padding-top: 0px;
    padding-bottom: 0px;
    width: 100%;
}

.col-sort img.icon-medium {
    width: auto;
    height: auto;
}

.chart-info-repeat span {
    width: 16px;
    height: 16px;
    border-radius: 100%;
}

.chart-info-repeat p span {
    width: auto;
    height: auto;
    border-radius: 0px;
    margin-left: 2px;
    margin-right: 0px;
}

.chart-info-repeat {
    display: flex;
    align-items: center;
    margin-bottom: var(--m);
    padding-right: 15px;
    word-wrap: break-word;
}

.chart-info-repeat:last-child {
    margin-bottom: 0;
}

.chart-info-repeat span.info-icon.info-wrap.position-relative {
    width: auto;
    align-items: center;
    margin: 0px 0px 0px 8px;
    z-index: 1;
}

.chart-info-repeat span {
    width: 16px;
    height: 16px;
    border-radius: 100%;
    margin-right: 8px;
}

.chart-info-repeat p {
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: var(--gray-900);
    width: calc(100% - 24px);
    word-break: break-word;
}

.chart-info-repeat img {
    margin-left: 0px;
}

.chart-info-wrap {
    padding-left: 120px;
}

.endTest-modal-wrap .modal-header-top {
    align-items: start;
}

/************ New Css Free Text Result *****************/

.researcher-resultwrap {
    padding: 0px !important;
    margin-top: 0;
}

.researcher-test-rightbox {
    width: 100%;
}

.researcher-test-rightbox .question-dropdown-container .dropdown-header {
    background: #fcfcfc;
    border-bottom: 1px solid var(--gray-400);
}

.researcher-resultwrap .dropdown-header-arrow-buttons a {
    padding: 7px;
}

.researcher-resultwrap .dropdown-header-arrow-buttons a svg {
    width: 16px;
    height: 16px;
}

.free-question-table-header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

.free-question-table-header-right {
    width: 50%;
    justify-content: flex-end;
    display: flex;
    align-items: end;
}

.free-question-table-header-right.tree-path-outcome-filyer {
    align-items: center;
}

.free-question-table-header-left {
    width: 50%;
    display: flex;
    align-items: center;
}

.free-question-table-header-right input.form-control.body-text.body-text-2 {
    min-width: 400px;
    max-width: 100%;
}

.free-question-table-header-right .ghost-small.btn-with-icon.btn-with-icon-left img,
.free-question-table-header-right .ghost-small.btn-with-icon.btn-with-icon-left svg {
    width: 16px;
    height: 16px;
}

.free-question-table-header-left>span {
    margin-right: 15px;
}

.free-question-table-header-left>p {
    color: var(--gray-700) !important;
    padding-top: 6px;
}

.question-result-data .table th {
    padding-left: 0px;
    padding-bottom: 10px;
}

.question-result-data .table tr td {
    padding-left: 0px;
    vertical-align: middle;
    /* border-bottom: 1px solid var(--gray-400); */
}

.question-result-data .table tr {
    border-bottom: 1px solid var(--gray-400);
}

.question-result-data .table tbody tr:hover {
    background: var(--gray-200);
}

td.tableDropdown {
    text-align: right;
    padding-right: 0;
}

td.tableDropdown .hamburger-items.dropdown-menu.show {
    right: 31px !important;
    min-width: 220px;
    top: 0px !important;
}

td.tableDropdown .hamburger-items .dropdown-item img {
    position: absolute;
    right: 20px;
}

.edu-graph-data-repeat {
    display: flex;
    align-items: center;
    margin: 0px 0px 15px 0px;
}

.edu-graph-inner-hold .edu-graph-data-repeat:first-of-type {
    margin-top: 10px;
}

.edu-graph-inner-hold .edu-graph-data-repeat:last-of-type {
    margin-bottom: 10px;
}

.edu-graph-data-repeat.questioninputbox {
    padding: 0px;
}

.edu-label-graph-bg {
    padding: 0;
}

.edulabel-width-wrap .tooltip-wrapper {
    z-index: 2;
    width: auto;
    text-align: center;
    bottom: 120%;
    left: 0px;
    margin: 0px;
}

.edulabel-width-wrap:hover .tooltip-wrapper {
    display: block !important;
}

.edu-grph-data-lhs {
    width: 220px;
    display: flex;
    align-items: center;
}

.edu-grph-data-lhs span.info-icon.info-wrap.position-relative {
    margin: 0;
    padding: 0;
    width: auto;
    margin-left: 4px;
}

.edu-grph-data-rhs {
    width: calc(100% - 220px);
    display: flex;
    align-items: center;
}

.horizontal-bar0count {
    font-size: 14px;
    padding: 0px;
    width: 51px;
    position: relative;
    margin-left: 16px;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
}

.edulabel-width-wrap {
    height: 35px;
    /*background: var(--gray-500);*/
    position: relative;
    max-width: calc(100% - 50px);
}

.edu-grph-data-lhs span {
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: var(--gray-900);
    margin-right: 5px;
    display: flex;
    align-items: center;
}

.edu-grph-data-lhs .country-flag-icon {
    display: flex;
    align-items: center;
    line-height: inherit !important;
    padding: 0px;
    top: 0px;
    margin-right: 12px;
}

.edu-grph-data-lhs .country-flag-icon svg {
    width: 32px !important;
    height: 32px !important;
}

.engagement-overview-results-data-wrap {
    margin-top: 8px;
}

.edu-grph-data-lhs .country-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 34px);
    display: inline-block;
}

.engagement-overview-results-data-wrap p {
    color: var(--gray-900);
}

.engagement-overview-results-data-wrap .live_from,
.engagement-overview-results-data-wrap .avg_time {
    color: #378b10;
}

.engagement-overview-results-data-wrap .avg_time {
    margin-top: var(--l);
}

.engagement-overview-results-left {
    width: 150px;
    padding-top: 5px;
}

.engagement-overview-results-data-wrap .participants-overview-right {
    padding-left: 20px;
    width: calc(100% - 150px);
    margin-top: -10px;
}

.engagement-overview-results-data-wrap g.recharts-layer.recharts-cartesian-axis-tick tspan {
    font-family: "Inter";
    font-style: normal;
    font-weight: 500;
    font-size: 9.61039px;
    line-height: 14px;
    display: flex;
    align-items: center;
    text-align: center;
    color: var(--gray-900);
    opacity: 1;
}

.engagement-overview-results-data-wrap .recharts-layer.recharts-cartesian-axis-tick line {
    stroke: #848282;
    stroke-width: 0.5px;
}

.engagement-overview-results-data-wrap line.recharts-cartesian-axis-line {
    height: 0px;
    stroke-width: 0.8px;
    stroke: #c7c5c5;
}

.vertical-bar-chart-inner .bar-title {
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    font-family: inherit;
}

.vertical-bar-chart-inner g.tick text {
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    color: var(--gray-900);
}

/***overview page css****/
.two-column-right-side {
    width: calc(100% - 248px);
    border-left: 1px solid #f0f0f0;
}

.test-result-inner-data {
    padding: 40px 20px;
}

.test-result-inner-data .prototype-result-space-hold {
    padding: 40px 32px;
}

.box-full-width .box-small,
.box-full-width .box-medium {
    max-width: 100%;
    width: 100%;
}

.test-result-overview-top-area .participants-overview-results,
.test-result-overview-top-area .overview-results-test-details,
.test-result-overview-top-area .engagement-overview-results {
    min-height: 100%;
    display: flex;
    width: 100%;
}

.test-result-overview-top-area .recharts-wrapper {
    width: 100% !important;
}

.test-result-overview-top-area .engagement-overview-results-data-wrap svg,
.test-result-overview-top-area .recharts-wrapper {
    max-width: 100% !important;
    margin: 0 auto;
    display: table;
    width: 100% !important;
    height: 156px !important;
}

.test-result-header-heading .ghost-btn {
    padding: 0px;
    border-radius: 0px;
    border: 0px !important;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-900);
    min-height: auto;
}

.test-result-header-heading .ghost-btn:hover {
    color: #5c208d !important;
}

.researcher-test-view-overflow {
    min-height: calc(100vh - 129px);
    margin: 0px;
}

.participants-result-responsive-section {
    display: none;
}

.result-device-wrap .box-medium {
    min-height: 100%;
    display: block;
}

.number .country-flag-icon img {
    width: 40px;
    height: 40px;
}

.vertical-bar-chart-inner {
    position: relative;
    top: 10px;
}

.full-page-loader {
    display: flex;
    min-height: calc(100vh - 120px);
    align-items: center;
    justify-content: center;
}

.full-page-loader img {
    max-width: 70px;
}

.loader_section {
    display: flex;
    /* min-height: 100vh; */
    align-items: center;
    justify-content: center;
}

.loader_section img {
    max-width: 70px;
}

/**Add logic css**/

.questiondescription-s.d-flex {
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
}

.logic-dropdown-readmode .dropdown-container.input-field.focused label {
    background: #fcfcfc;
}

.create-projectmodal-form-group.d-flex.arabic-add-logic-true.add-logic-true,
.inputpoints-outer.d-flex.arabic-add-logic-true.add-logic-true {
    text-align: right !important;
    direction: rtl !important;
}

.create-projectmodal-form-group.d-flex.arabic-add-logic-true.add-logic-true .dropdown-container,
.inputpoints-outer.d-flex.arabic-add-logic-true.add-logic-true .dropdown-container {
    margin-right: 30px;
    margin-left: 0px;
}

.create-projectmodal-form-group.d-flex.add-logic-true .dropdown-container {
    margin-right: 0px;
    margin-left: 30px;
}

/*.create-projectmodal-form-group.d-flex.arabic-add-logic-true.add-logic-true .dropdown-container.focused .css-1d8n9bt, .create-projectmodal-form-group.d-flex.arabic-add-logic-true.add-logic-true .dropdown-container.active .css-1d8n9bt, .create-projectmodal-form-group.d-flex.arabic-add-logic-true.add-logic-true .dropdown-container .css-319lph-ValueContainer, 
  .inputpoints-outer.d-flex.arabic-add-logic-true.add-logic-true .dropdown-container .css-1d8n9bt, .inputpoints-outer.d-flex.arabic-add-logic-true.add-logic-true .dropdown-container .css-319lph-ValueContainer{
      padding-left: 4px;
  }*/

/*************** Today 23 Jan New Css ********************/

.by-user-table table td,
.free-question-result-data table td {
    font-weight: 500;
}

.question-result-data .accountnaviagtion-outer.result-navigation-outer {
    border-bottom: 1px solid var(--gray-400);
    padding: 16px 20px 0px 20px;
    margin-bottom: 0;
    position: sticky;
    top: 158px;
    background: var(--gray-50);
    z-index: 2;
}

.col-sort.justify-content-between span {
    display: inline-block;
    width: 18px;
    margin-left: 2px;
}

.question-result-data .accountnaviagtion-outer.result-navigation-outer a {
    font-size: 16px;
    font-weight: 500;
    color: var(--gray-600);
    font-family: "Inter";
}

.question-result-data .accountnaviagtion-outer.result-navigation-outer .active a {
    color: var(--gray-900);
}

.question-result-data .accountnaviagtion-outer.result-navigation-outer .active {
    color: var(--gray-900);
}

.accountnaviagtion-outer a.active {
    color: var(--gray-900);
    border-bottom: 4px solid;
}

.chart-data .box-title p {
    font-weight: 500;
}

div#aggregate-data-singlechoice,
.aggregated-data-table {
    margin-top: 50px;
    padding-bottom: 25px;
}

.aggregated-data-table .free-question-table-header {
    margin-bottom: 60px;
}

.by-user-table {
    margin-top: 55px;
}

.question-dropdown-container {
    position: relative;
}

.question-result-data {
    position: relative;
    /*    overflow-x: auto;*/
}

.question-result-data.black-overlay {
    z-index: 2;
}

.question-result-data.black-overlay:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.6);
    top: 0;
    z-index: 2;
}

.likertscale-subquestion-chart {
    display: flex;
    overflow-x: auto;
}

.subquestion-chart-outer {
    height: 280px;
    background: #f0f0f0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
}

.likertscale-subquestion-chart>div {
    margin-right: 20px;
    /*min-width: stretch;*/
    width: -webkit-fill-available;
    width: -moz-available;
    width: 25%;

}

.likertscale-subquestion-chart>div:last-of-type {
    margin-right: 0px;
}

.subquestion-chart-inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.subquestion-chart-inner:hover .tooltip-wrapper {
    display: block !important;
    margin: 0px;
    width: auto;
    left: auto;
    right: auto;
    text-align: center;
    bottom: 106%;
}

.subquestion-chart-inner h4 {
    /* margin-top: -30px;*/
    position: absolute;
    top: -33px;
    bottom: auto;
}

.likertscale-subquestion-chart>div p.body-text.body-text-3.medium-font {
    text-align: center;
    padding-top: 18px;
}

.logicbuttonbox .toggle_btn_label {
    position: relative;
    left: 8px;
}

.no-page-data-wrap {
    text-align: center;
    margin: 50px auto 80px;
    max-width: 792px;
}

.no-data-icon {
    margin-bottom: 12px;
}

.no-data-icon span {
    justify-content: center;
}

.summary-right-sec-wrap .logic-dropdown-readmode .dropdown-container .css-1s2u09g-control:focus,
.summary-right-sec-wrap .logic-dropdown-readmode .dropdown-container .css-1s2u09g-control:hover,
.summary-right-sec-wrap .logic-dropdown-readmode .dropdown-container .css-1pahdxg-control:hover,
.summary-right-sec-wrap .logic-dropdown-readmode .dropdown-container .css-1pahdxg-control:focus,
.summary-right-sec-wrap .logic-dropdown-readmode .dropdown-container.focused .css-1s2u09g-control,
.summary-right-sec-wrap .logic-dropdown-readmode .dropdown-container.focused .css-1pahdxg-control {
    border-color: var(--gray-500) ccc !important;
    color: var(--gray-500) !important;
    pointer-events: none;
}

.summary-right-sec-wrap .logic-dropdown-readmode .dropdown-container label,
.summary-right-sec-wrap .logic-dropdown-readmode .css-qc6sy-singleValue {
    color: var(--gray-500) !important;
}

.summary-right-sec-wrap .logic-dropdown-readmode .css-tlfecz-indicatorContainer {
    opacity: 0.3 !important;
}

.did-you-know-slider-hold .box-large {
    border-radius: 16px;
    background-image: url(../img/referal-gradient.svg);
    background-size: cover;
    background-repeat: no-repeat;
    border: 0px;
    padding: 32px;
}

.did-you-know-slider {
    padding: 0px 100px;
    max-width: 1200px;
    margin: 0 auto 50px;
    border-top: 1px solid var(--gray-400);
    padding-top: 80px;
}

.did-you-know-slider .box-large {
    min-height: 100%;
}

.did-you-know-slide h1 {
    margin-bottom: 16px;
}

.did-you-know-slider-hold .owl-dots {
    position: absolute;
    bottom: -70px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.did-you-know-slider .owl-nav {
    position: relative;
    top: 10px;
    text-align: right !important;
}

.did-you-know-slider .owl-nav button {
    width: 40px;
    height: 40px;
    background: var(--gray-900) url(../img/forward-arrow-white.svg) !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 100% !important;
    color: var(--gray-50) !important;
    font-size: 0px !important;
    background-size: 24px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.did-you-know-slider .owl-nav button.owl-prev {
    background: var(--gray-900) url(../img/backward-arrow-white.svg) !important;
    background-size: 24px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.did-you-know-slider .owl-nav button.disabled {
    display: none !important;
}

.did-you-know-slider .owl-theme .owl-dots .owl-dot span {
    margin: 5px;
    width: 10px !important;
    height: 10px !important;
    background: var(--gray-500) !important;
}

/*.did-you-know-slider .owl-theme .owl-dots .owl-dot:nth-child(2) span{
      width: 8px !important;
      height: 8px !important;
  }
  
  .did-you-know-slider .owl-theme .owl-dots .owl-dot:last-child span{
      width: 6px !important;
      height: 6px !important;
  }*/
.did-you-know-slider .owl-theme .owl-dots .owl-dot.active span {
    background: var(--gray-900) !important;
}

.did-you-know-left-box {
    height: 100%;
}

.did-you-know-left-box .box-large {
    background: #fcfcfc url(../img/question-mark.svg);
    border-radius: 16px;
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
}

.did-you-know-left-box h1 {
    margin-bottom: 32px;
}

.detailed-analycs-data {
    display: flex;
    background: #fcfcfc;
}

.participants-detailed-analycs-wrapper .box-large {
    background: #fcfcfc;
    padding: 40px 32px;
    max-width: 1266px;
    margin: 0px auto;
}

.detailed-analy-img {
    width: 550px;
}

.detailed-analy-text {
    width: calc(100% - 550px);
}

.detailed-analy-text p {
    margin-top: 20px;
}

.detailed-analy-text .recruit-tile-bottom {
    justify-content: start;
}

.detailed-analy-text .recruit-bottom-right {
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-900);
    padding-left: 32px;
}

.disabled-row td {
    color: #c7c7c89c !important;
}

.disabled-row {
    color: #c7c7c89c;
}

.search-highlight {
    background: none;
    padding: 0;
    font-weight: bold;
    color: #ff66ad;
}

.result-pie-chart-wrap .box-medium {
    min-height: 100%;
}

.download-xlsx-report .modal-header-top {}

.download-xlsx-report .download-modal-data-wrap {
    color: var(--gray-700);
}

.download-xlsx-report .download-modal-data-wrap .email-user {
    margin: 15px 0px;
    font-weight: 500;
    color: var(--gray-900);
}

.download-xlsx-report .confirm-buttons-wrap {
    justify-content: flex-start;
}

.chart-info-repeat .tooltip-wrapper p,
.info-wrap .bottom-tooltip {
    color: var(--gray-50) !important;
    text-align: left;
}

.download-xlsx-report .confirm-buttons-wrap button {
    width: auto;
    padding: 14px 30px;
    width: auto;
}

.test-summary-modal-wrap .question-optionbox .radio-btn-wrap {
    cursor: inherit;
    pointer-events: none;
}

.test-summary-modal-wrap .question-optionbox .checkbox-label,
.test-summary-modal-wrap .option-value {
    cursor: inherit;
}

.unknown-participant-tableheader {
    position: relative;
}

.unknown-participant-tableheader img {
    cursor: pointer;
}

.unknown-participant-tableheader img:hover+.tooltip-wrapper {
    display: block !important;
    top: auto;
    margin: 0;
    bottom: 44px;
    left: auto;
    right: auto;
}

.likert-scale-aggregated-data table {
    width: 100%;
    text-align: center;
}

.likert-agg-tbl-box {
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    position: relative;
}

.likert-scale-aggregated-data table tr td {
    padding: 5px;
}

.likert-scale-aggregated-data table th {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    text-align: center;
    color: rgba(0, 0, 0, 0.87);
    padding-bottom: 10px;
}

.likert-option-th {
    width: 130px;
    margin: 0 auto;
}

.likert-scale-aggregated-data table tr .likert-statements {
    text-align: left !important;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: rgba(0, 0, 0, 0.87);
    max-width: 210px;
}

.likert-agg-tbl-box:hover .tooltip-wrapper {
    display: block;
}

.likert-agg-tbl-box .tooltip-wrapper {
    width: auto;
    left: 0;
    right: 0;
    bottom: 100%;
    margin: 0;
}

.likert-scale-aggregated-data table {
    min-width: 1070px;
}

.likert-scale-aggregated-data {
    overflow-x: auto;
}

.linear-axis-chart #linear-axis-chart {
    margin-top: 20px;
}

.linear-axis-chart h4 {
    font-family: "Inter";
    font-style: normal;
    font-weight: 500 !important;
    font-size: 18px;
    line-height: 30px;
    margin-bottom: var(--s);
}

.linear-axis-chart {
    font-family: "Inter";
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-700);
}

.accordian-body-text .table tr:last-child td {
    border: 0px !important;
}

.task-overview-bar-with-title {
    display: flex;
    align-items: center;
    margin: 0px 0px 20px;
}

.task-overview-bar-with-title:last-child {
    margin-bottom: 0;
}

.task-overview-bar-with-title span {
    display: flex;
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-700);
    width: 70px;
    cursor: pointer;
}

.task-overview-bar-with-title span:hover {
    color: var(--gray-900);
}

.task-overview-bar {
    width: calc(100% - 70px);
    height: 28px;
    display: flex;
    align-items: center;
}

.task-overview-bar>div {
    height: 28px;
}

span.task-overview-show-more {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-600);
    display: table;
    margin: 0 auto;
    cursor: pointer;
}

.task-overview-tree-chart .top-head-wrap .subtitle-2 {
    width: 100%;
    display: inline-block;
}

.task-overview-tree-chart .chart-info-wrap {
    padding-left: 0;
    display: flex;
    margin: 0px 0px;
    flex-wrap: wrap;
    width: 100%;
    justify-content: end;
    padding-top: 0px;
}

.task-overview-tree-chart .chart-info-wrap .chart-info-repeat {
    margin: 0px 0px 3px 20px;
    padding-right: 0px;
}

.task-overview-tree-chart .top-head-wrap {
    display: flex;
    margin-bottom: 18px;
    flex-wrap: wrap;
    justify-content: space-between;
}

.task-overview-tree-chart .chart-info-repeat p {
    font-size: 14px;
    line-height: 22px;
}

.linear-axis-chart strong {
    font-weight: 600;
    color: var(--gray-900);
}

.card-sorting-result-matrix_buttons {
    margin-left: -10px;
    margin-right: -10px;
}

.card-sorting-result-matrix_buttons a {
    text-decoration: none;
    margin: 0px 10px;
}

.card-sorting-result-matrix_buttons a button img {
    width: 16px;
    height: 16px;
}

.card-catname-view-td {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    min-width: 115px;
}

.card-catname-view-td img {
    margin-right: 10px;
}

.card-sort-result-table-data table tr td {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-900);
    vertical-align: top !important;
}

.table-cards-repeat p {
    margin-bottom: 20px;
}

.show-options img {
    width: 16px;
    height: 16px;
    margin-right: 8px;
}

.show-options svg {
    margin-right: 8px;
}

.show-options {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: #9759cb;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    padding: 2px;
    white-space: nowrap;
}

.show-options.less img {
    transform: rotate(180deg);
}

.card-sort-result-table-data .table tr:last-child td {
    border-bottom: 0px;
}

.matricx-top-left {
    width: 75%;
}

.chart-new-tab-data {
    padding-top: 60px;
}

.matricx-chart-top-head {
    align-items: center;
}

.matricx-table-wrap table td {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-900);
}

.matricx-table-wrap table td span {
    font-size: 12px;
    font-weight: 500;
}

.similartity-text-dat {
    padding-left: 10px;
}

.table-tooltip .tooltip-wrapper {
    z-index: 33;
    width: 260px;
    left: 103%;
    right: auto;
    bottom: -56%;
    top: auto;
    margin: 0px;
}

.matricx-top-left p {
    margin-top: 8px;
    color: var(--gray-700);
}

.matrix-full-view {
    min-height: calc(100vh - 114px);
    width: 100%;
    max-width: 100%;
    padding: 0px 40px 40px;
    overflow-x: auto;
}

.matricx-top-right .small-dropdown .secondary-btn {
    background: var(--gray-50) !important;
    border: 1px solid var(--gray-900) !important;
    border-radius: 50px !important;
    color: var(--gray-900) !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    line-height: 17px !important;
    padding: 10px 20px !important;
    min-height: 38px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.matricx-top-right .small-dropdown .secondary-btn:hover {
    color: var(--gray-50) !important;
    background-color: var(--gray-900) !important;
}

/*****/
.card-sorting-test-wrap,
.modal-content {
    z-index: 0;
}

.matricx-top-right .btn-with-icon img {
    width: 16px;
    height: 16px;
}

.matricx-top-right .dropdown.show button svg,
.matricx-top-right .dropdown.show button img {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
}

.matricx-top-right .hamburger-items {
    top: 39px !important;
    right: 0px !important;
}

.mh-100vh {
    min-height: calc(100vh - 70px) !important;
}

.table-responsive1 {
    /*overflow-x: auto;*/
    padding-bottom: 40px;
}

table .hamburger-items {
    z-index: 2;
}

.table-responsive {
    overflow: visible;
}

.cardsorting-test-result-wrap .question-dropdown-container .dropdown-header {
    cursor: default;
}

/* .table-responsive .table{
      min-width: 1024px;  
  } */

.cardsorting-test-result-wrap .question-result-data {
    overflow-x: visible;
}

.col-sort.justify-content-between {
    display: inline-flex;
    cursor: pointer;
}

/************* Tree Test Result ***************/

#tree-test-overview {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    padding: var(--l) var(--xl);
    border-radius: var(--m);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

#tree-test-overview>span {
    display: flex;
    align-items: center;
    margin-right: 5px;
    font-weight: 500;
}

#tree-test-overview span>img {
    margin-right: 7px;
}

span.correctpathlabel {
    color: #378b10;
}

.tasksuccess-outerbox {
    display: flex;
    justify-content: space-between;
}

.box-medium {
    max-width: 100%;
    width: calc(50% - 15px);
}

.tree-testing-top-graph h4 {
    margin-bottom: 15px;
}

.tree-tst-grph-data {
    border: 1px solid var(--gray-500);
    margin-top: 20px;
    border-radius: 10px;
    padding: 20px;
}

.free-question-table-header-right a {
    border: 1px solid var(--gray-900) !important;
    text-decoration: none;
}

.col-sort span {
    cursor: pointer;
}

.loadmorebtn-box {
    text-align: center;
}

.bd-que-slide-arrow.tablebottompagination {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
}

.bd-que-slide-arrow.tablebottompagination .ghost-btn {
    background: var(--gray-50) !important;
    border: 1px solid var(--gray-900) !important;
}

.bd-que-slide-arrow.tablebottompagination button.ghost-btn.ghost-medium.btn-disabled {
    border: 1px solid var(--gray-500) !important;
}

.test_outcome_td span.skipped_dot {
    width: 16px;
    height: 16px;
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px;
}

.test_outcome_td {
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.tree-path-view-table table .bd-thcol-1 {
    min-width: 120px !important;
}

.bd-qu-td-ans.tree-test-ans-col {
    min-width: 200px;
}

.bd-qu-td-ans.tree-test-ans-col>span b {
    font-weight: normal !important;
    color: #378b10 !important;
}

.tree-chart-head {
    padding: 60px 0px 30px;
    border-bottom: 1px solid var(--gray-400);
    color: var(--gray-700);
}

.confid-tech-hraph-hold .chart-info-wrap {
    padding-left: 0px;
}

.tree-chart-top-bottom {
    padding-top: 40px;
}

.tree-chart-top-bottom .filter-buttons-wrap {
    min-width: 260px;
}

.bd-que-slide-right.tree-options-right.treechartbtn {
    width: 430px;
    display: flex;
    justify-content: space-between;
}

.treew-view-graph-wrap {
    padding: 0px 50px;
}

.treechartDropdown .hamburger-items {
    top: 45px !important;
}

.page-loader.table-loader {
    opacity: 1;
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(255, 255, 255, 0.5);
}

/* .tree-overview-results-box .task-overview-tree-chart .top-head-wrap .subtitle-2{
      width: 160px !important;
  }
  
  .tree-overview-results-box .task-overview-tree-chart .chart-info-wrap{
      width: calc(100% - 160px);
      justify-content: flex-end;
  } */
.tree-overview-results-box .box-large {
    min-height: 0px;
}

.tree-overview-results-box .task-overview-bar {
    width: 100%;
}

.test_outcome_td span {
    width: 16px;
    height: 16px;
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px;
}

.direct_failure_dot {
    background: rgb(166, 0, 0);
}

.indirect_failure_dot {
    background: rgb(255, 211, 211);
}

.direct_success_dot {
    background: rgb(55, 139, 16);
}

.indirect_success_dot {
    background: rgb(191, 240, 168);
}

.ranking-page-infodata-wrap {
    background: #fcfcfc;
    padding: 30px;
    border-radius: 10px;
    margin-top: 55px;
    border: 1px solid var(--gray-400);
    max-width: 900px;
    margin-bottom: 100px;
}

.ranking-page-infodata-wrap h3 {
    font-weight: 600;
    font-size: 20px;
    line-height: 26px;
}

.ranking-page-infodata-wrap p {
    font-weight: 400;
    font-size: 16px;
    line-height: 25px;
    margin: 15px 0;
    color: var(--gray-700);
}

.barchart-ranking-scale-inner>span {
    color: #9759cb;
}

.barchart-ranking-scale-inner>h4 {
    margin-top: 40px;
    margin-bottom: 20px;
}

.mt-40 {
    margin-top: 40px;
}

.ranking-table .d-flex.table-answer-column-outer {
    align-items: center;
}

.ranking-table .table-color-box {
    border-radius: 50%;
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.mathmaticbox p {
    margin: 0px;
    border-bottom: 1px solid;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.response-text-wrap.mathmaticbox {
    max-width: 300px;
    text-align: center;
    margin: 30px 0px;
    color: var(--gray-700);
}

.ranking-wrap-info-bottom p {
    margin: 0px;
}

.ranking-wrap-info-bottom strong {
    font-weight: 500;
    color: var(--gray-900);
}

/***matric grid css***/
.matrix-grid-table-responsive table {
    width: auto;
    min-width: auto;
}

.card-sorting-matrix-category-td {
    font-weight: 300;
    font-size: 10px;
    line-height: 14px;
    color: var(--gray-900);
    max-width: 150px;
    display: flex;
    align-items: center;
}

.card-sorting-matrix-category-td img {
    margin-right: 8px;
}

.matrix-grid-table-responsive table thead tr th {
    border-bottom: 0px;
    padding-bottom: 16px;
    color: var(--gray-900);
}

.matrix-grid-table-responsive table tr td {
    border-right: 2px solid var(--gray-50);
    padding: 1px 0px;
}

.matrix-y-axis-y-td {
    max-width: 120px;
    width: 120px;
}

.card-sorting-matrix-y-axis {
    width: 120px;
    padding-right: 10px !important;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-sorting-matrix-box {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    position: relative;
    border-radius: 2px;
}

.card-matrix-count {
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
    color: var(--gray-900);
}

.card-sorting-matrix-box:hover .tooltip-wrapper {
    margin: 0px;
    bottom: 100%;
    left: auto;
    right: auto;
    width: 260px;
    display: block;
}

/*.matrix-grid-table-responsive tbody:before {
      content: "-";
      display: block;
      line-height: 1em;
      color: transparent;
  }*/
.matrix-grid-table-responsive .tooltip-wrapper,
.matrix-full-view .tooltip-wrapper {
    width: 260px !important;
}

.matrix-grid-table-responsive {
    overflow-x: auto;
    max-height: calc(100vh - 300px);
    margin: 60px 0px;
}

.card-grid-data-hold {
    padding: 0px 40px;
}

.matrix-grid-table-responsive table thead {
    position: sticky;
    top: 0px;
    z-index: 2;
    background-color: #fff;
}

.matricx-table-wrap .tooltipChart {
    width: 220px !important;
}

.matrix-grid-table-responsive table .matrix-y-axis-y-td {
    position: sticky;
    background: #fff;
    z-index: 1;
    left: 0;
}

.grid-png-download-table table thead th {
    padding-bottom: 8px;
    padding-top: 8px;
}

.grid-png-download-table td .card-sorting-matrix-y-axis {
    padding-left: 5px;
}

th.likert-chart-corner.card-sorting-matrix {
    position: sticky;
    left: 0;
    background: #ffffff;
}

.grid-png-download-table {
    z-index: -4;
}

.matrix-gird-wrapper .matrix-full-view {
    padding-left: 0px;
    padding-right: 0px;
}

.matrix-gird-wrapper .matricx-chart-top-head {
    padding: 0px 40px;
}

.treew-view-graph-wrap svg text {
    font-weight: 600 !important;
    font-size: 16px !important;
    line-height: 33px !important;
    color: #2b2b2b !important;
}

.treechartDropdown .hamburger-items .dropdown-item img {
    display: none;
}

.chart-tooltip-top-tree {
    border-bottom: 1px solid #2b2b2b;
    padding-top: 4px;
    padding-bottom: 15px;
}

.tooltip-header-top,
.chart-tooltip-left-tree span {
    color: var(--gray-600);
}

.tree-chart-tooltip-table {
    padding-top: 10px;
    padding-bottom: 10px;
}

.tree-chart-tooltip-table table {
    width: 100%;
}

.tree-chart-tooltip-table table td {
    font-weight: 500;
    font-size: 13px;
    padding: 0px 0px;
}

.circle-stats-group .tooltip-wrapper,
.edu-label-graph-bg .tooltip-wrapper {
    text-align: center;
}

.edu-label-graph-bg .info-icon .tooltip-wrapper {
    text-align: left;
}

.tech-icon-wname .tooltip-wrapper {
    width: auto;
    right: -27px;
    left: auto;
}

span.matrix-cat-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 81px;
}

.card-sorting-matrix-category-td svg {
    margin-right: 5px;
    display: flex;
}

.likert-agg-tbl-box.white-text h4 {
    color: var(--gray-50) !important;
}

.prefer-anayl-data-table .test-result-inner-data {
    padding: 40px 20px;
}

.purpletext>span,
.purpletext>h4 {
    color: #9759cb;
}

.preference-test-question-table-bottom {
    align-items: center;
}

.prefrence-aggreatedtable th,
.prefrence-aggreatedtable td {
    padding-left: 0 !important;
    padding-right: 0;
    vertical-align: top;
}

.prefrence-aggreatedtable td {
    border-bottom: 1px solid var(--gray-400);
}

.prefrence-aggreatedtable th {
    padding-bottom: 10px !important;
}

.preference-test-question-table-bottom>p {
    color: var(--gray-700) !important;
    margin-left: 10px;
}

.prefrence-aggreatedtable .col-sort img {
    width: auto !important;
    height: auto !important;
}

.prefrence-aggreatedtable .prefer-test-selected-design-view {
    border: 1px solid var(--gray-400);
    padding: 32px 10px;
    width: max-content;
    position: relative;
}

.prefrence-aggreatedtable .prefer-test-selected-design-view>img {
    object-fit: cover;
    object-position: top;
}

.design-max-screen-icon {
    text-align: right;
    position: absolute;
    right: 12px;
    cursor: pointer;
    bottom: 7px;
}

.preference-test-question-table-bottom-header {
    margin-top: 30px;
}

.preference-test-table-bottom {
    margin-top: 32px;
}

.prefer-aggregatd-data-table.table tbody tr:hover,
.preference-test-table-bottom table tr:hover {
    background: none !important;
}

.preference-test-table-bottom table th,
.preference-test-table-bottom table td {
    padding-left: 0 !important;
    padding-right: 0;
    vertical-align: top;
}

.preference-test-table-bottom table td {
    border-bottom: 1px solid var(--gray-400);
    padding-top: 15px;
    padding-bottom: 15px;
}

.preference-test-table-bottom table th {
    padding-bottom: 10px !important;
}

.preference-test-table-bottom table .col-sort img {
    width: auto !important;
    height: auto !important;
}

.preference-test-table-bottom table b {
    font-weight: normal !important;
}

.preference-test-design-modal h2 {
    font-size: 30px;
}

.confirmation-modal-wrap.preference-test-design-modal .modal-body {
    padding: 32px;
}

.preference-test-design-modal .report-answer-body {
    text-align: center;
}

.preference-test-design-modal .confirm-buttons-wrap button {
    width: 110px !important;
}

.preference-test-design-modal .confirm-buttons-wrap {
    justify-content: center !important;
}

.preference-test-design-modal .report-answer-body {
    padding: 5px;
}

.matricx-table-wrap .table-responsive1 table td {
    padding: 2px;
}

.desc.col-sort,
.asc.col-sort {
    color: #ff6db1;
    cursor: pointer;
}

.col-sort {
    cursor: pointer;
}

.desc.col-sort img,
.asc.col-sort img {
    /*margin-left: 5px;*/
}

.task-dropdown-subtitle-text.purple-text {
    color: #9759cb;
}

.ranking-scale-table.mt-40 {
    margin-top: 60px;
}

.desc.col-sort img,
.asc.col-sort img {}

.design-modal-wrap .modal-body {
    padding: 32px;
}

.design-button-wrap button {
    width: auto;
    margin: 0 auto;
}

.five-second-result-design {
    background: #fcfcfc;
    border: 1px solid var(--gray-500);
    border-radius: 10px;
    max-width: initial;
    margin: 40px 32px 0;
    display: inline-flex;
    padding: 20px;
    align-items: center;
}

.five-second-result-design .gray-50-svg .change-fill {
    fill: #fff;
}

.five-second-result-design .btn {
    margin-left: 22px;
}

.five-second-result-design .btn img {
    width: 16px;
    height: 16px;
}

.five-second-test-img .prefer-test-selected-design-view {
    border: 0;
    padding: 0px;
    width: 100%;
    position: relative;
}

.report-answer-body.design-modal-body {
    text-align: center;
}

.questions-dropdown-result-count {
    color: #9759cb;
    margin-left: 2px;
    font-weight: 600;
    font-size: 12px;
    line-height: 17px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
}

.analyze-results-page-wrapper .matrix-full-view {
    min-height: calc(100vh - 70px);
}

.analyze-results-page-wrapper .tree-chart-top-bottom .bd-question-top-slide {
    align-items: start;
}

.analyze-results-page-wrapper .tree-chart-top-bottom .bd-question-top-slide .bd-que-slide-left {
    max-width: calc(100% - 440px);
}

.analyze-results-page-wrapper .participants-result-responsive-section {
    min-height: calc(100vh - 70px);
}

.chart-info-repeat.unknown-info p {
    display: flex;
    /* align-items: center; */
}

/***register css***/
.register-progress-bar .progress-bar {
    position: static;
    transform: none;
    position: static;
    transform: none;
    background: #d9d9d9;
    border-radius: 5px;
    width: 238px;
    height: 8px;
}

.register-progress-bar .progress-bar .bar {
    background: none !important;
}

.register-progress-bar .progress-bar .progress {
    display: block;
    background-color: #ff6db1;
    border-radius: 5px;
    height: 8px;
    border: 0px;
}

.proress-step-count {
    margin-bottom: 4px;
}

.gray-font-text {
    color: #d9d9d9;
}

.proress-step-count {
    color: var(--gray-700);
}

.tester-test-cards .test-list-data {
    background: url(../img/tester-card-bg-img.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-color: var(--gray-200);
    cursor: pointer;
    height: 233px;
}

.tester-test-cards .test-list-data::after {
    display: none !important;
}

.tester-test-cards .btn {
    justify-content: center;
    position: relative;
    top: 5px;
}

.tester-test-cards .test-footer-lhs {
    width: 100%;
}

.tester-test-cards .test-footer-lhs .test-time-data-repeat:last-child {
    display: flex;
    justify-content: flex-end;
}

.tester-test-cards .test-time-data-repeat span {
    display: block;
}

.tester-test-cards .tag-wrap {
    margin: 8px -6px;
}

.calendor-input-field input {
    border: 1px solid var(--gray-600);
    border-radius: 10px;
    height: 55px;
    background: unset !important;
    color: var(--gray-900);
    position: relative;
    padding-left: 21px;
    z-index: 1;
    font-size: 16px;
    line-height: 33px;
    font-weight: 400;
    width: 100%;
}

.react-datepicker-popper {
    width: 100%;
    background: var(--gray-50);
    border-radius: 0px;
}

.react-datepicker__day-names {
    display: table;
    width: 100%;
}

.react-datepicker__day-name {
    display: table-cell;
}

.react-datepicker__week {
    display: table;
    width: 100%;
}

.react-datepicker__day {
    display: table-cell;
}

.checkbox-wrap {
    z-index: 1 !important;
}

.react-datepicker__header__dropdown.react-datepicker__header__dropdown--select {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
}

.react-datepicker__navigation {
    align-items: center;
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    overflow: hidden;
    padding: 0;
    position: absolute;
    text-align: center;
    text-indent: -999em;
    top: 2px;
    width: 32px;
    z-index: 1;
}

.logout-tester-btn {
    margin: 0px !important;
    cursor: pointer;
}

.tester-header .logout-tester-btn svg {
    margin-right: 12px;
}

.preference-test-table-bottom table tr td,
.prefer-anayl-data-table table tr td {
    padding-right: 45px;
}

/* .preference-test-table-bottom table tr td:nth-child(3){
      width: 320px;
  }
  .prefer-anayl-data-table table tr td:nth-child(2){
      width:350px;	
  } */
/* .prefer-anayl-data-table table tr td:first-child{
      width:340px;
  } */
.preference-test-table-bottom table tr td:last-child,
.prefer-anayl-data-table table tr td:last-child {
    padding-right: 0px;
}

/* 
  .preference-test-table-bottom table tr td:nth-child(2){
      width: 280px;
  }
  
  
  .preference-test-table-bottom table tr td:nth-child(1){
      width: 170px; 
  } */
.storybook-default {
    display: block !important;
}

.react-datepicker__header {
    text-align: center;
    background-color: #9759cb !important;
    border-bottom: 1px solid #9759cb !important;
    border-top-left-radius: 0.3rem;
    padding: 8px 0;
    position: relative;
}

.react-datepicker {
    border: 1px solid #9759cb !important;
    font-family: "Inter", sans-serif !important;
}

.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle::before {
    border-bottom-color: #9759cb !important;
}

.react-datepicker select {
    background: #c682ff !important;
    padding: 5px 9px !important;
    border: 0px !important;
    font-weight: 600 !important;
    color: var(--gray-50) !important;
    border-radius: 30px !important;
    width: 99px !important;
}

.react-datepicker select:focus,
.react-datepicker select:active {
    border: 0px !important;
    box-shadow: none !important;
    outline: none !important;
}

.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle::before,
.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle::after {
    border-top: none;
    border-bottom-color: #9759cb !important;
}

.react-datepicker__navigation-icon {
    top: 6px !important;
}

.react-datepicker__current-month,
.react-datepicker-time__header,
.react-datepicker-year-header {
    color: var(--gray-50) !important;
}

.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow,
.react-datepicker__navigation-icon::before {
    border-color: var(--gray-50) !important;
}

.react-datepicker__month {
    margin: 1.5px 2px 2px !important;
    background: #efdcff !important;
    border-radius: 4px;
}

.react-datepicker__day-name {
    color: var(--gray-50) !important;
    font-weight: 500;
}

.react-datepicker__day--selected:hover,
.react-datepicker__day--in-selecting-range:hover,
.react-datepicker__day--in-range:hover,
.react-datepicker__month-text--selected:hover,
.react-datepicker__month-text--in-selecting-range:hover,
.react-datepicker__month-text--in-range:hover,
.react-datepicker__quarter-text--selected:hover,
.react-datepicker__quarter-text--in-selecting-range:hover,
.react-datepicker__quarter-text--in-range:hover,
.react-datepicker__year-text--selected:hover,
.react-datepicker__year-text--in-selecting-range:hover,
.react-datepicker__year-text--in-range:hover {
    background-color: #9759cb !important;
}

.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__quarter-text--keyboard-selected,
.react-datepicker__year-text--keyboard-selected {
    background-color: #9759cb !important;
}

.react-datepicker__day--keyboard-selected:hover,
.react-datepicker__month-text--keyboard-selected:hover,
.react-datepicker__quarter-text--keyboard-selected:hover,
.react-datepicker__year-text--keyboard-selected:hover {
    background-color: #9759cb !important;
}

.react-datepicker__day--selected:hover,
.react-datepicker__day--in-selecting-range:hover,
.react-datepicker__day--in-range:hover,
.react-datepicker__month-text--selected:hover,
.react-datepicker__month-text--in-selecting-range:hover,
.react-datepicker__month-text--in-range:hover,
.react-datepicker__quarter-text--selected:hover,
.react-datepicker__quarter-text--in-selecting-range:hover,
.react-datepicker__quarter-text--in-range:hover,
.react-datepicker__year-text--selected:hover,
.react-datepicker__year-text--in-selecting-range:hover,
.react-datepicker__year-text--in-range:hover {
    background-color: #9759cb !important;
}

.react-datepicker__day--selected,
.react-datepicker__day--in-selecting-range,
.react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--selected,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--selected,
.react-datepicker__year-text--in-selecting-range,
.react-datepicker__year-text--in-range {
    background-color: #9759cb !important;
}

.react-datepicker__day:hover,
.react-datepicker__month-text:hover,
.react-datepicker__quarter-text:hover,
.react-datepicker__year-text:hover {
    background-color: var(--gray-50) !important;
}

.tester-test-cards .test-list-head .heading {
    max-width: 100%;
}

.tester-dashboard .page-heading-wrap h1 {
    margin-bottom: 12px;
}

.tester-dashboard .page-heading-wrap .body-text-1 {
    color: var(--gray-700);
}

.tester-dashboard .dashboard-filter-left span {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-900);
    padding: 0;
    margin-right: 35px;
    font-family: unset;
    border-bottom: 0px;
}

.tester-dashboard .dashboard-filter-left span .inline-svg-- {
    margin: 0;
    line-height: 0;
    font-size: 0;
}

.tester-dashboard .dashboard-filter-wrap .hamburger-items {
    top: 36px;
    position: absolute;
}

.tester-test-cards .test-time-data {
    justify-content: space-between;
    margin: 0px;
}

.tester-test-cards .test-time-data-repeat {
    width: auto !important;
    padding: 0px 10px 0px 0px;
}

.tester-test-cards .test-time-data-repeat:last-child {
    padding-right: 0px;
}

.participants-overview-results.tester-test-history .participants-overview-data-wrap {
    margin-top: 18px;
}

.participants-overview-results.tester-test-history .participants-overview-right p {
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
}

/************ Researcher Register Page ************/
.login-right-side img {
    max-height: 648px;
}

.researcher-registerheader {
    padding-top: 25px;
    padding-bottom: 40px;
}

.researcher-register-wrap p.body-text {
    color: var(--gray-700);
}

.login-hdr-left .logo {
    display: inline-block;
}

.themeclr {
    color: #ff6db1;
}

.resarcher-termcond {
    font-size: 14px;
    color: var(--gray-900);
    font-weight: 500;
}

.resarcher-termcond a {
    color: var(--secondary-purple-200) !important;
    text-decoration: underline;
}

.resarcher-termcond a:hover {
    color: var(--secondary-purple-400) !important;
}

.researcher-register-wrap .form-group,
.researcher-profilebox .form-group,
.researcher-profilebox .phone-number-field {
    max-width: 460px;
}

.createaccount-btnbox button {
    width: 100%;
    max-width: 460px;
}

.createaccount-btnbox {
    margin-top: 25px;
}

.full.ordivider {
    margin: 35px 0px;
    border: 1px solid #dedee8;
    height: 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 460px;
}

.ordivider span {
    display: block;
    background: var(--gray-50);
    padding: 0px 20px;
    font-size: 16px;
    font-weight: 400;
}

.createaccount-googlebtn button {
    border: 1px solid var(--gray-900);
    width: 100%;
    max-width: 460px;
    height: 60px;
    background: none;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 500;
}

.createaccount-googlebtn button span {
    margin-right: 10px;
}

.resarcher-btn-register {
    margin-top: 40px;
    text-align: center;
}

.resarcher-btn-register a {
    color: var(--gray-900) !important;
    font-weight: 500;
}

.researcher-register-wrap {
    padding-bottom: 80px;
    min-height: calc(100vh - 159px);
}

.researcher-verify-box-outer {
    padding: 80px 0px;
    min-height: calc(100vh - 70px);
}

.researcher-verify-box {
    max-width: 640px;
    background: #ffffff;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
    border-radius: 20px;
    margin: auto;
    padding: 50px;
    text-align: center;
}

.researcher-verify-box h3 {
    margin-top: 40px;
    margin-bottom: 30px;
}

.researcher-verify-box p.body-text.medium-font {
    color: var(--gray-700);
    line-height: 28px;
}

.researcher-verify-box p.body-text.medium-font span {
    font-weight: 600;
    color: var(--gray-900);
}

.researcher-verify-box p.body-text.semi-bold-font {
    margin-bottom: 15px;
    margin-top: 10px;
}

.stillcantsee-box {
    margin-bottom: 32px;
}

.researcher-verify-bottomlink {
    display: flex;
    margin-top: 32px;
    flex-wrap: wrap;
}

.researcher-verify-bottomlink>div {
    width: 50%;
    color: var(--gray-700);
    font-weight: 500;
}

.researcher-verify-bottom-left {
    text-align: left;
}

.researcher-verify-bottom-left a {
    color: var(--gray-900);
}

.researcher-verify-bottom-right {
    text-align: right;
}

.researcher-verify-bottom-right a {
    color: #9759cb !important;
    text-decoration: underline;
}

.graytext p.body-text {
    color: var(--gray-700);
}

.reasearcher-left-carousel {
    max-width: 460px;
}

.reasearcher-left-carousel h1 {
    font-size: 33px;
    line-height: 39px;
}

.reasearcher-left-carousel span.subtitle-1.medium-font {
    font-size: 20px;
    line-height: 28px;
}

.reasearcher-left-carousel .did-you-know-slider-hold .box-large {
    min-height: 300px;
}

.whatsupplabel {
    margin-top: 20px;
}

.researcher-profilebox .radio-btn-label {
    color: var(--gray-900);
    font-weight: 500;
}

.researcher-profilebox #r_registration {
    width: 100%;
    max-width: 460px;
}

.wallet-overview-tile .balance-row {
    display: flex;
    margin-top: 16px;
}

.wallet-overview-tile .balance-row-left {
    display: flex;
    align-items: center;
    margin-right: 18px;
}

.wallet-overview-tile .balance-row-left img,
.wallet-overview-tile .balance-row-left svg {
    margin-right: 12px;
}

.wallet-overview-tile .balance-row-right {
    display: flex;
    align-items: center;
}

.wallet-overview-tile-hold .box-small {
    min-width: 400px;
    max-width: initial;
    display: inline-flex;
    border-color: var(--gray-500);
}

.balance-row-deposited .heading {
    color: #378b10;
}

.didyou-know-slider-component .box-large {
    max-width: 457px;
}

.didyou-know-slider-component .box-large .owl-theme .owl-nav {
    text-align: right;
}

.didyou-know-slider-component {
    border: 0px;
    padding: 0;
}

.didyou-know-slider-component .owl-theme .owl-dots .owl-dot span {
    margin: 5px 0px !important;
}

/************ Welcome Popup ************/

.congrats-modal-header {
    background-image: url(../img/welcomepopbg.png);
    background-size: cover;
    background-repeat: no-repeat;
    height: 170px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.confirmation-modal-wrap.congratulation-modal-wrap .modal-dialog {
    max-width: 650px;
}

.congratulation-modal-wrap .congrats-modal-text {
    color: var(--gray-700);
}

.congratulation-modal-wrap .congrats-modal-text p {
    color: var(--gray-900);
}

.congratulation-modal-wrap .congrats-modal-text {
    padding-bottom: 32px;
    padding-top: 32px;
}

.congratulation-modal-wrap .congrats-modal-text h2 {
    margin-bottom: 32px;
}

.congrats-modal-middle-text {
    margin: 25px 0px;
    color: var(--gray-900);
}

.congrats-modal-middle-text p {
    color: var(--gray-900) !important;
    font-weight: 600 !important;
    line-height: 33px;
}

.mt-25 {
    margin-top: 25px;
}

.congratulation-modal-wrap .congrats-modal-text p a {
    color: #9759cb;
    text-decoration: underline;
}

.congratulation-modal-wrap .congrts-modal-wrap a {
    color: var(--gray-50) !important;
}

.forgot-pass-wrap h3 {
    margin-bottom: 10px;
}

.forgot-pass-wrap .login-form-inner-data {
    margin-top: 35px;
}

.forgot-pass-wrap .resarcher-btn-register {
    margin-top: 50px;
}

.login-data-wrap.researcher-register-wrap.forgot-pass-wrap {
    padding-top: 40px;
}

.researcher-forgot-pass-main {
    min-height: 100vh;
    position: relative;
}

.researcher-forgot-pass-main footer {
    position: fixed;
    width: 100%;
    bottom: 0px;
}

.resetwrap {
    max-width: 460px;
}

.reset-pass-innerwrap {
    padding-top: 60px;
    min-height: calc(100vh - 150px);
}

.resetwrap h2 {
    margin-bottom: 32px;
}

.css-26l3qy-menu {
    z-index: 5 !important;
}

.forgotpassWrap .body-text a {
    color: #9759cb !important;
    text-decoration: underline;
}

.forgotpassWrap .confirm-buttons-wrap button {
    max-width: 220px;
}

.passwordchangedsuccess .congrats-modal-text .icon-medium {
    width: 70px;
    height: auto;
    margin-bottom: 15px;
    margin-top: 10px;
}

.passwordchangedsuccess .congrts-modal-wrap button {
    text-align: center;
    min-width: 0px !important;
}

.react-datepicker-popper {
    width: auto !important;
}

.react-datepicker__triangle {
    left: 210px !important;
    transform: none !important;
    right: auto !important;
    margin: auto !important;
    top: -8px !important;
}

.react-datepicker-popper {
    width: auto !important;
    transform: unset !important;
    inset: unset !important;
    right: 0px !important;
}

/***taking test survey css***/
.taking-test-page-wrap {
    padding-bottom: 40px;
}

.taking-test-progressbar {
    margin-bottom: 20px;
}

.taking-test-page-height {
    min-height: calc(100vh - 220px);
    padding: 48px 0px;
}

.taking-test-page-wrap .medium-box-wrapper {
    /*    max-width: 650px; 
      margin: 0 auto;*/
}

.taking-test-page-height .form-group {
    max-width: 100%;
}

.mt-24 {
    margin-top: 24px;
}

.option-holder label {
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 18px;
}

.option-holder .radio-btn-wrap .checkmark,
.option-holder .checkbox-wrap .checkmark {
    position: static;
    margin-right: 12px;
}

.option-holder .radio-btn-label {
    width: calc(100% - 30px);
    color: var(--gray-900);
    font-weight: 500;
    line-height: 25px;
}

.select-option-text-guide p {
    color: var(--gray-700);
}

.likert-scale-taking-test-view .ans-list-repeat.saved-ans-repeat {
    display: flex;
    align-items: center;
}

.likert-scale-taking-test-view .likert-option-left {
    width: 295px;
    padding-right: 16px;
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
}

.likert-scale-taking-test-view .likert-option-right .radio-btn-label {
    display: none;
}

.likert-scale-taking-test-view .likert-option-right {
    display: flex;
    width: calc(100% - 295px);
}

.likert-scale-taking-test-view .likert-option-right label p {
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
}

.likert-option-right label {
    width: 20%;
    padding: 0px 10px;
    text-align: center;
    margin-bottom: 10px;
}

.likert-view-option-repeat {
    width: 20%;
    padding: 0px 10px;
    cursor: default;
    text-align: center;
}

.likert-view-option-repeat label {
    width: auto;
    padding: 0;
    text-align: center;
    justify-content: center;
    margin: 0 auto;
    display: inline-flex;
}

.ans-list-wrap.likert-scale-option-add,
.likret-scale-top-row {
    padding: 13px 22px;
}

.likret-scale-top-row {
    padding-top: 0px;
}

.ans-list-wrap.likert-scale-option-add:nth-child(odd) {
    background: var(--gray-200);
}

.survey-rating-options-wrap .ans-list-wrap.likert-scale-option-add {
    background-color: var(--gray-50);
}

.likert-view-option-repeat .radio-btn-wrap .checkmark {
    position: static;
    background-color: var(--gray-50);
}

.max-characters {
    /*color: var(--gray-900);*/
}

.optional-span {
    color: var(--gray-600);
    margin-left: 1px;
    font-size: 24px;
    position: relative;
    top: -1px;
}

.ranking-count {
    margin-right: 8px;
    width: 35px;
}

.ranking-data-wrap {
    display: flex;
    width: 100%;
    margin-top: 20px;
}

.ranking-count p {
    font-family: "sk-modernistbold";
    font-style: normal;
    font-size: 24px;
    line-height: 29px;
    display: flex;
    align-items: center;
    color: #9759cb !important;
    display: flex;
    align-items: center;
}

.singlechoice-option-wrap .option-holder .body-text-2 {
    margin-left: 0px;
}

.taking-test-page-wrap .textarea-form-group .form-control {
    min-height: 55px !important;
    padding-top: 15px;
    padding-bottom: 0px;
}

.rank-dragable-list-wrap {
    width: 100%;
}

.ranking-list-repeat {
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    background-color: var(--gray-50);
}

.ranking-scale-taking-test-view .ranking-list-repeat {
    background-color: unset;
}

.ranking-data-wrap .option-holder {
    display: flex;
    align-items: center;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 16px;
    width: calc(100% - 35px);
}

.option-holder .body-text-2 {
    font-weight: 500;
    margin-left: 8px;
}

.ranking-scale-taking-test-view {
    max-width: 685px;
    margin: 0 auto;
}

.optional-button .secondary-btn,
.optional-button .ghost-btn {
    position: relative;
    left: calc(100% - 710px);
    justify-content: center;
}

.optional-button button:first-child {
    position: relative;
    left: 64.8px;
}

.tester-dashboard .page-heading-wrap .react-loading-skeleton {
    height: 26px !important;
    margin: 0px !important;
}

.tester-test-history .participants-overview-left .h2 {
    font-weight: 700;
    font-size: 60px;
    line-height: 72px;
    color: #9759cb;
    position: relative;
    top: 3px;
}

.tester-test-history .participants-overview-right {
    padding-left: 20px;
}

.likert-view-option-repeat a {
    text-decoration: none;
    display: flex;
    width: 24px;
    margin: 0 auto;
}

.verifyresarcherbox {
    flex-flow: column;
    transform: translateY(-35px);
}

.verifyresarcherbox .loader_section {
    min-height: 0px;
}

.verifingdata-wrap {
    min-height: calc(100vh);
    display: flex;
    align-items: center;
}

.verifingdata-wrap .dashboard-filter-loader .loader_section img {
    width: 70px;
}

.verifingdata-header .researcher-registerheader.login-page-header {
    position: absolute;
    width: 100%;
    top: 0px;
}

.signremeberbox {
    display: flex;
    justify-content: space-between;
    max-width: 460px;
    color: var(--gray-700) !important;
}

.signremeberbox a {
    color: var(--gray-700) !important;
}

.sign-in-google-btn>img {
    margin-right: 10px;
}

a#r_google_sign_in {
    font-size: 18px;
    height: 60px;
    font-weight: 500;
    max-width: 460px;
}

.custom-google-signin.researcher-google-signin {
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
    max-width: 460px;
    height: 60px;
    align-items: center;
    justify-content: center;
    display: flex;
    opacity: 0;
}

.custom-google-signin.researcher-google-signin iframe {
    width: 100% !important;
}

.position-relative.google-icon-hold.researcher-google-icon-hold {
    max-width: 460px;
}

.nothaveaccount {
    font-size: 16px;
    color: var(--gray-700);
}

.login-data-wrap.error-404 {
    min-height: calc(100vh - 150px);
    position: relative;
    padding-top: 140px;
}

.error-page-footer-wrap.d-flex.text-center {
    position: absolute;
    bottom: 50px;
    width: 100%;
    align-items: center;
    justify-content: center;
    left: 0;
    color: var(--gray-700);
}

.error-page-footer-wrap .heading {
    color: var(--gray-700);
}

.error-page-footer-wrap svg {
    margin: 0px 10px;
}

.error-404 .no-page-data-wrap {
    margin: 0 auto !important;
}

.error-404 .fotter-wrap.text-center {
    margin-top: 50px;
}

.login-hdr-right a:hover {
    color: var(--gray-50) !important;
}

/***taking test welcome and thaku page css****/
.tester-welcome-page-wrap .inner-page-container {
    max-width: 1100px;
}

.tester-welcome-page-wrap .tester-selected-page-wrap {
    display: flex;
    align-items: center;
    width: 100%;
    flex-direction: row-reverse;
}

.tester-welcome-page-wrap .taking-test-page-height {
    min-height: calc(100vh - 120px);
    padding: 48px 0px;
    display: flex;
    align-items: center;
}

.invite-earn-form-right {
    position: relative;
    z-index: 0;
}

.selected-page-right-side {
    width: 435px;
}

.selected-page-left-side {
    width: calc(100% - 435px);
    padding-right: 100px;
}

.selected-page-left-side .subtitle-2 {
    margin: 40px 0px;
    display: block;
    color: var(--gray-700);
}

.selected-page-left-side .body-text-1 {
    margin: 32px 0px;
}

.selected-page-left-side .remember-text {
    padding: 32px 0px;
    border-top: 1px solid #e3e3e3;
    color: var(--gray-700);
}

.selected-test-info-img {
    background: #fcfcfc;
    border: 1.27149px solid var(--gray-400);
    border-radius: 12.7149px;
    text-align: center;
    padding: 25px;
}

.selected-test-info-img img {
    width: 100%;
}

.nda-agreement-modal .modal-body {
    padding: 32px;
}

.nda-agreement-modal .modal-dialog {
    max-width: 620px;
}

.nda-agreement-modal .confirm-buttons-wrap button {
    width: 100%;
}

.nda-agreement-modal .body-text-3 {
    color: var(--gray-700);
}

.nda-agreement-modal .terms-condition-text a {
    color: var(--gray-900);
    text-decoration: underline;
    font-weight: 500;
}

.nda-agreement-modal .checkbox-wrap .checkmark {
    top: 0px;
}

.taking-test-full-page-loader {
    min-height: 100vh;
}

.test-exit-modal .modal-body {
    color: var(--gray-700);
}

.tester-login-page-wrapper.arabic_wrapper .heading,
.tester-login-page-wrapper.arabic_wrapper .body-text,
.tester-login-page-wrapper.arabic_wrapper .subtitle-2,
.tester-login-page-wrapper.arabic_wrapper .subtitle-1,
.arabic_wrapper.modal-body p,
.arabic_wrapper.modal-body .heading {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.tester-login-page-wrapper.arabic_wrapper,
.arabic_wrapper.modal-body {
    text-align: right !important;
    direction: rtl !important;
}

.arabic_wrapper.modal-body .modal-header-top h3 {
    text-align: right;
}

.tester-login-page-wrapper.arabic_wrapper .btn-with-icon img,
.tester-login-page-wrapper.arabic_wrapper .btn-with-icon svg {
    margin-right: 8px;
    margin-left: 8px;
}

.tester-login-page-wrapper.arabic_wrapper .selected-page-left-side {
    padding-left: 100px;
    padding-right: 0px;
}

.tester-login-page-wrapper.arabic_wrapper .option-holder .radio-btn-wrap .checkmark,
.tester-login-page-wrapper.arabic_wrapper .option-holder .checkbox-wrap .checkmark {
    position: static;
    margin-right: 0;
    margin-left: 12px;
}

.defefing-question-step-data {
    background-image: url(../img/referal-gradient.svg);
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 20px;
    padding: 50px 88px;
    min-height: 491px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 auto;
    max-width: 700px;
}

.tester-defiefing-question-step .taking-test-page-height {
    min-height: calc(100vh - 150px);
    padding: 48px 0px;
    display: flex;
    align-items: center;
    width: 100%;
}

.defefing-question-step-inner-data {
    text-align: center;
    margin: 0px auto;
}

.defefing-question-step-inner-data svg {
    margin: 36px 0px;
}

.defefing-question-step-inner-data h1 {
    font-size: 50px;
    line-height: 60px;
}

.tester-screens-hold {
    width: 100%;
}

/***taking test card sorting start*****/
.card-sorting-page-data .input-field label,
.prefer-upload-opton-wrap .input-field label {
    z-index: -1;
}

.card-sort-test-img-view {
    background: linear-gradient(90deg,
            rgba(181, 255, 253, 0.1) -8.56%,
            rgba(255, 187, 219, 0.1) 154.56%);
    text-align: center;
    min-height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

.card-sorting-test-view-data-wrap {
    display: flex;
    margin: 30px 0px;
}

.card-sorting-cat-view-wrap {
    width: calc(100% - 298px);
    padding-left: 30px;
}

.card-sorting-view-wrap {
    background: #bf8ee8;
    border: 1px solid #9759cb;
    border-radius: 10px;
    width: 298px;
    min-height: calc(100vh - 460px);
    padding: 12px;
    max-height: calc(100vh - 460px);
    overflow-y: auto;
}

.card-count-top-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 0px;
    margin-bottom: 20px;
}

.card-count-top-wrap .body-text-1 {
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-50);
}

.card-count-top-wrap .body-text-3 {
    color: #5c208d;
}

.card-count-top-wrap b {
    font-weight: 600;
}

.cards-view-inner-wrap {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.cardsort-view-data-repeat {
    width: 100%;
}

.cardsort-view-data-repeat .draggable-item {
    display: flex;
    width: 100%;
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    padding: 12px;
    margin-bottom: 8px;
    color: var(--gray-900);
}

.cardsort-view-data-repeat span img,
.cardsort-view-data-repeat span svg {
    margin-right: 8px;
    width: 20px;
}

.cardsort-view-data-repeat .inline-svg-- {
    margin: 0px;
}

.cardsort-view-data-repeat span i {
    display: none;
}

.card-sorting-cat-view-wrap h1 {
    font-size: 40px;
    line-height: 48px;
}

.card-category-data-hold {
    background: #ffffff;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 16px;
    width: 100%;
    margin: 0px 0px 24px;
}

.card-sort-test-view-lhs,
.card-sort-test-view-rhs {
    width: 50%;
    padding: 12px 10px;
}

.card-sorting-selected-test-cat {
    display: flex;
    width: 102%;
    margin: 28px -10px 0px;
    flex-wrap: wrap;
}

.no-cards-data {
    font-weight: 300;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #c2c2d2;
    margin: 24px 0px 11px;
}

.card-sorting-selected-test-cat {
    min-height: calc(100vh - 540px);
    overflow-y: auto;
    max-height: calc(100vh - 540px);
}

.card-cat-top-wrp {
    margin-bottom: 0px;
    display: flex;
    justify-content: space-between;
    height: auto;
    align-items: start;
    z-index: 0;
    position: relative;
}

.card-cat-top-wrp .input-field label {
    font-size: 13px;
    top: 2px;
}

.card-cat-top-wrp .form-group {
    margin-right: 5px;
}

.card-cat-top-wrp .form-control {
    height: 34px;
}

.card-cat-top-wrp span.input_error {
    position: absolute;
    bottom: -17px;
    margin-left: 0px;
    font-size: 11px;
}

.card-cat-top-wrp .input-field input:focus~label,
.card-cat-top-wrp .input-field textarea:focus~label,
.card-cat-top-wrp .input-field.focused label {
    top: -9px;
}

.tmp-cat-hover {
    font-weight: normal;
}

.tmp-cat-hover {
    margin: 0 !important;
    width: 100% !important;
}

.cardtake-test-top button img {
    width: 16px;
    height: 16px;
}

.card-cat-top-wrp h3 {
    width: calc(100% - 60px);
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-900);
    display: flex;
    align-items: flex-start;
    margin: 0px;
    word-wrap: break-word;
}

.card-cat-top-wrp h3 strong {
    font-weight: 500;
}

.card-cat-top-wrp h3 span {
    color: #9759cb;
    margin-left: 2px;
}

.card-cat-card-data-hold .active-tiles-wrap span {
    margin: 4px 0px 4px;
    display: flex;
    width: 100%;
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    padding: 12px;
    margin-bottom: 8px;
    color: var(--gray-900);
    justify-content: space-between;
}

.card-cat-card-data-hold .active-tiles-wrap span p {
    width: calc(100% - 32px);
    padding: 0px 8px;
    word-wrap: break-word;
}

.card-test-action-option span {
    margin: 0px 6px;
    cursor: pointer;
}

.card-test-action-option {
    margin: 0px -6px;
    display: flex;
    width: 60px;
    justify-content: end;
    align-items: center;
    position: relative;
    top: 5px;
}

.card-test-action-option svg {
    width: 18px;
    height: 18px;
}

.card-test-action-option button {
    padding: 0;
    border: 0;
    background: var(--gray-50);
    box-shadow: none;
    outline: none;
    cursor: pointer;
}

.card-cat-card-data-hold .active-tiles-wrap span img {
    width: 20px;
}

.card-cat-card-data-hold .active-tiles-wrap .delete-single-card img {
    cursor: pointer;
}

.card-cat-card-data-hold .active-tiles-wrap span i {
    color: #ff66ad;
    font-size: 14px;
    margin-left: 10px;
    cursor: pointer;
    position: absolute;
    top: 8px;
    right: 9px;
}

.card-cat-card-data-hold {
    position: relative;
    margin-top: 20px;
}

.card-cat-card-data-hold .total-cards-no {
    margin-top: 10px;
}

.minimize-box-wrap {
    display: flex;
    align-items: center;
    justify-content: end;
}

.minimize-box-wrap span {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.minimize-box-wrap span img {
    margin-left: 10px;
}

.cards-info-help-wrap {
    text-align: right;
    margin-bottom: 0px;
    position: relative;
    min-height: 30px;
    top: -11px;
}

.cards-info-help-wrap span {
    cursor: pointer;
}

.card-sorting-info {
    background: linear-gradient(90deg,
            rgba(150, 255, 252, 0.2) 0%,
            rgba(150, 255, 252, 0) 100%),
        linear-gradient(0deg,
            rgba(150, 255, 252, 0.2),
            rgba(150, 255, 252, 0.2)),
        rgba(234, 246, 255, 0.6);
    background-blend-mode: multiply, normal, normal;
    mix-blend-mode: normal;
    box-shadow: 0px 8px 50px 4px rgb(19 29 45 / 8%);
    backdrop-filter: blur(30px);
    border-radius: 12px;
    margin: 0px;
    position: absolute;
    right: 0px;
    top: -19px;
    padding: 19px;
    max-width: 768px;
    width: 768px;
    z-index: 9;
}

.no-cat-added-in-card {
    display: flex;
    margin-bottom: 4px;
    align-items: center;
    margin-top: 32px;
}

.no-cat-added-in-card p {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    display: flex;
    align-items: center;
    color: var(--gray-700);
    margin-left: 9px;
}

/**today****/
.card-sorting-tests-header-wrap h2 {
    margin-bottom: 24px;
}

.card-sorting-tests-header-wrap p {
    color: var(--gray-700);
}

.card-sorting-tests-header-wrap {
    max-width: 100%;
}

.card-sorting-take-test-wrap .container {
    max-width: 1270px;
}

.guest-user-given-test-modal .modal-body {
    padding: 32px;
}

.guest-user-given-test-modal .confirm-buttons-wrap button {
    width: 100%;
}

.guest-user-given-test-modal .modal-dialog {
    max-width: 600px;
}

.guest-user-modal-data p {
    color: var(--gray-700);
    line-height: 25px;
}

.card-sorting-take-test-wrap {
    padding: 48px 0px;
}

.arabic_wrapper.modal-body .checkbox-wrap .checkmark {
    left: auto;
    right: 0px;
}

.arabic_wrapper.modal-body .checkbox-wrap {
    padding-right: 35px;
    padding-left: 0px;
}

.arabic_wrapper.modal-body p span {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.card-category-data-hold.tmp-cat-hover.tmp-category {
    border: 1px dashed var(--gray-600);
    border-radius: 10px;
}

.card-cat-top-wrp.tmp-cat-hover h3 b {
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    color: var(--gray-600);
}

.card-cat-card-data-hold.tmp-cat-hover.tmp-cat-style {
    border: 1px dashed var(--gray-600);
    border-radius: 6px;
    margin-top: 12px !important;
    background: #fcfcfc;
    height: 49px !important;
}

/***taking test card sorting css end****/

.login-data-wrap.researcher-register-wrap h3,
.col-md-6.graytext>h3 {
    margin-bottom: 12px;
}

.researcher-register-wrap .login-bottom-link.form-group.resarcher-btn-register {
    color: var(--gray-700);
}

.form-group.resarcher-termcond.custom-checkbox {
    display: flex;
    align-items: center;
}

.form-group.resarcher-termcond.custom-checkbox label {
    margin-bottom: 0px;
    line-height: 23px;
}

.login-hdr-right .icon-small {
    width: 16px;
}

.social_login_wrapper span.subtitle-2.medium-font {
    color: var(--gray-700);
    font-size: 14px;
    line-height: 25px;
    margin-bottom: 70px;
    display: inline-block;
    margin-top: 5px;
}

button.owl-dot {
    margin: 0px 4px !important;
}

.did-you-know-slider-hold .owl-dots {
    display: flex;
    align-items: center;
    justify-content: center;
}

.social_login_wrapper .resarcher-btn-register {
    margin-bottom: 60px;
}

.fullheight-minusHF {
    min-height: calc(100vh - 110px);
}

.tester-test-intro {
    min-height: calc(100vh - 110px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 30px 20px;
}

.tester-test-intro .five-sec-inner-text-data {
    max-width: 720px;
    margin: auto;
}

.tester-test-intro .five-second-show-design-button {
    margin-top: 40px;
}

.tester-test-intro .five-second-show-design-button .button-wrapper {
    margin-bottom: 40px;
}

.tester-test-intro .five-second-show-design-button .subheading {
    display: flex;
    align-items: center;
    justify-content: center;
}

.tester-test-intro .five-second-show-design-button .subheading>img {
    margin-right: 5px;
}

.tester-test-intro .five-sec-timer-design-wrap {
    position: relative;
}

.tester-test-intro .five-seconds-timer {
    position: absolute;
    right: -60px;
    display: flex;
    align-items: center;
    bottom: 10px;
}

.tester-test-intro .five-seconds-timer>img {
    margin-right: 5px;
}

.login-data-wrap.flex-wrap.already-taken-testlogin-wrap {
    min-height: calc(100vh - 150px);
    display: flex;
    align-items: center;
    padding-bottom: 20px;
    justify-content: center;
    background: var(--gray-50);
}

.already-taken-testlogin-wrap .no-page-data-wrap p {
    margin: 5px 0 40px;
}

.social_login_wrapper .resarcher-btn-register {
    margin-top: 60px;
}

.login-data-wrap.flex-wrap.already-taken-testlogin-wrap.error-404 {
    align-items: self-start !important;
    padding-bottom: 110px;
}

/***preference test css****/
.preference-taking-test-designs-wrapper {
    max-width: 908px;
    margin: 0px auto;
}

.prefer-taking-test-head p {
    margin-top: 24px;
    color: var(--gray-700);
}

.preference-taking-test-designs-wrapper .added-design-preview-thum {
    background: #ffffff;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 20px;
}

.preference-taking-test-designs-wrapper .test-design-name-and-option-wrap p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 90%;
    text-align: left;
}

.preference-taking-test-designs-wrapper .test-design-name-and-option-wrap {
    text-align: center;
}

.preference-taking-test-designs-wrapper .test-design-name-and-option-wrap button img {
    width: 16px;
    height: 16px;
}

.prefer-taking-test-full-design {
    position: relative;
}

.prefer-design-slider-hold {
    position: relative;
}

.btn.prevPage {
    position: absolute;
    top: 50%;
    left: 40px;
}

.btn.nextPage {
    position: absolute;
    top: 50%;
    right: 40px;
}

.disabled-nav {
    opacity: 0.3;
    cursor: not-allowed !important;
}

.preference-test-design-wrap.preference-taking-task-wrap {
    max-width: 693px;
    margin: 0 auto;
}

.pref-test-btns-wrap .btn {
    width: 40px;
    height: 40px;
    padding: 8px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gray-50);
}

.pref-test-btns-wrap .btn img {
    width: 18px;
}

.preference-taking-test-designs-wrapper .design-max-screen-icon svg {
    width: 18px !important;
    height: 18px !important;
}

.design-fixed-full-view {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    background: var(--gray-50);
    width: 100%;
    padding: 20px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.design-fixed-full-view .prefer-test-selected-design-view {
    padding: 20px;
    border: 1.58219px solid var(--gray-400);
    border-radius: 10px;
    display: flex;
    align-items: center;
    height: 92vh;
}

.design-fixed-full-view .btn.prevPage {
    left: 20px;
}

.design-fixed-full-view .btn.nextPage {
    right: 20px;
}

.design-fixed-full-view .test-design-name-and-option-wrap {
    margin-top: 32px;
}

.design-fixed-full-view .design-max-screen-icon {
    display: none;
}

.design-fixed-full-view .preference-test-design-wrap.preference-taking-task-wrap {
    max-width: 100%;
    margin: 0 auto;
    height: 100vh;
    padding: 33px 100px;
}

.design-fixed-full-view .prefer-test-selected-design-view img {
    max-height: 100vh;
    object-fit: contain;
}

.design-fixed-full-view .test-design-name-and-option-wrap {
    margin-top: 32px;
    position: absolute;
    bottom: 10px;
    display: flex;
    background: rgb(238 238 238 / 50%);
    width: 100%;
    border-radius: 30px;
    padding: 10px;
    align-items: center;
    justify-content: space-between;
    left: 0px;
}

.design-fixed-full-view .test-design-name-and-option-wrap h3 {
    margin: 0;
}

.close-design-modal {
    position: absolute;
    right: 0px;
    top: 10px;
    width: 40px;
    height: 40px;
    border: 1px solid #7f7f7f;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    padding: 10px;
    cursor: pointer;
    background: var(--gray-50);
    z-index: 2;
}

.single-design-wrap .preference-test-designs-repeat {
    width: 100% !important;
    max-width: 740px !important;
    margin: 0 auto !important;
}

.tester-dashboard .support-button,
.tester-dashboard .support-button:hover {
    bottom: 95px !important;
    right: 40px !important;
}

.five-seconds-task-design.small-screen>img {
    width: 100%;
}

.dropdown-list-hold-wrap .dropdown-list-container {
    position: static;
}

.dropdown-list-hold-wrap {
    position: absolute;
    width: 100%;
    padding: 0px 15px 0px 0px;
    background: var(--gray-50);
    z-index: 4;
}

.dropdown-question-item p {
    max-width: calc(100% - 200px);
}

.balance-row-inprogress h1 {
    color: #ffb800;
}

.free-question-result-data td.bd-q-ans-col {
    /* width: 55%; */
    padding-right: 25px;
}

.tester-test-cards .test-list-head .heading {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.tester-test-cards .all-test {
    margin-bottom: 0px !important;
    min-height: 146px;
}

.tester-test-cards .loading-cards .all-test {
    min-height: 122px;
    height: 122px;
}

.arabic-font {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
    letter-spacing: 0px;
}

.question-dropdown-container .arabic-font {
    direction: rtl !important;
}

/************ Tester Login Module **************/

.tester-social-loginbox .custom-google-signin.tester-google-signin {
    width: 90px;
    overflow: hidden;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0;
}

.tester-social-loginbox {
    display: flex;
    justify-content: center;
    max-width: 460px;
    margin-top: 30px;
    margin-bottom: 45px;
}

.tester-social-loginbox span a {
    width: 84px;
    text-align: center;
    border: 1px solid var(--gray-900);
    margin: 0px 10px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
}

.full.createaccount-btnbox.testerloginbtn-box {
    margin-top: 15px;
}

.form-group.resarcher-termcond.custom-checkbox.tester-termcond {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.form-group.resarcher-termcond.custom-checkbox.tester-termcond>label:first-of-type {
    margin-bottom: 20px;
}

.researcher-profilebox.tester-profilebox .whatsupplabel .radio-btn-label {
    font-weight: 400;
}

.formbox.d-flex-radiobox,
.full.d-flex-radiobox {
    display: flex !important;
    justify-content: space-between;
    max-width: 460px;
    align-items: center;
}

.formbox.d-flex-radiobox .bold,
.full.d-flex-radiobox .bold {
    font-weight: 600;
    font-size: 20px;
}

.d-flex-radiobtn {
    display: flex;
    align-items: center;
    min-width: 230px;
    justify-content: space-between;
}

.formbox.d-flex-radiobox label,
.full.d-flex-radiobox label {
    margin-bottom: 0px;
}

.formbox.d-flex-radiobox label .radio-btn-label,
.full.d-flex-radiobox label .radio-btn-label {
    font-size: 18px;
    font-weight: 500;
}

.field-error.dropdown-container .css-1s2u09g-control,
.field-error.dropdown-container .css-1pahdxg-control {
    border-color: #ff0000 !important;
}

.blue-border-dropdown.dropdown-container .css-1s2u09g-control,
.blue-border-dropdown.dropdown-container .css-1pahdxg-control {
    border-color: #9759cb !important;
}

.blue-border-dropdown .logic-drop-down-icon {
    display: inline-block;
    margin-left: 6px;
}

.tester-profilebox #people>label {
    width: 100%;
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 500;
}

.formbox.tester-step-backbox {
    position: absolute;
    bottom: 0;
    left: 0;
}

.tester-profile-step3box #people .chips-wrap {
    max-width: 460px;
}

.tester-profile-step3box #people label {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
}

a.ghost-btn {
    text-decoration: none !important;
}

.five-second-show-design-button .body-text-3 {
    color: var(--gray-700);
}

.testhistory-box h2 {
    margin-bottom: 40px;
}

.testhistory-box .table-responsive .table {
    min-width: 517px;
    width: 100%;
}

.testhistory-box .active-tiles-wrap>span {
    border: 1px solid var(--gray-900);
    font-size: 12px;
    font-weight: 500;
    border-radius: 50px;
    width: 100px;
    display: flex;
    height: 30px;
    align-items: center;
    justify-content: center;
}

.testhistory-box .active-tiles-wrap>span.abandoned {
    border-color: #ffb800;
    color: #ffb800;
}

.testhistory-box .active-tiles-wrap>span.reported {
    border-color: #ff0000;
    color: #ff0000;
}

.testhistory-box .active-tiles-wrap>span.completed {
    border-color: #378b10;
}

.testhistory-box .table-responsive .table tr th {
    padding-bottom: 10px;
}

.testhistory-box .table-responsive .table tr th:first-of-type {
    width: 380px;
}

.testhistory-box table td {
    font-weight: 500;
}

.five-second-full-view-wrap {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    background: var(--gray-50) !important;
    z-index: 999 !important;
    padding: 60px 20px !important;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

.five-second-image-hold {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0px;
    background-color: var(--gray-200);
    width: 100%;
    justify-content: center;
}

.five-second-full-view-wrap .five-seconds-task-design.small-screen {
    height: calc(100vh - 120px);
    width: 85%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.five-second-full-view-wrap .five-seconds-task-design.small-screen img {
    object-fit: contain;
    max-width: 100%;
    max-height: 100%;
}

.five-seconds-timer h4 {
    color: var(--gray-700);
}

.five-second-full-view-wrap .five-seconds-timer {
    right: -80px;
}

.preference-taking-test-designs-wrapper .added-design-img-thm {
    height: 400px;
    width: 100%;
    display: flex;
    align-items: center;
    margin-top: 6px;
}

.preference-taking-test-designs-wrapper .added-design-img-thm img {
    object-fit: contain;
    max-height: 100%;
    width: 100%;
    height: auto;
    margin: 0 auto;
}

.preview-min-icon .modal-header-top {
    display: block !important;
    background-color: unset;
}

.preview-min-icon .modal-header-top h2 {
    display: none;
}

.designs-preview-modal .modal-header-top .close {
    padding: 1px;
    position: fixed;
    right: 40px;
    top: 40px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 100%;
    width: 40px;
    height: 40px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 22;
}

.prefer-taking-test-designs-hold .design-max-screen-icon {
    right: 0px;
}

/***tree test taking test****/

.sel-chile-cat-wrap {
    padding-left: 22px;
    line-height: 0px;
}

.test-selected-main-cat-wrap a {
    text-decoration: none;
}

.test-selected-main-cat-wrap .sl-mt-link-wrp {
    margin-bottom: 12px;
    height: 53px;
    padding: 12px 20px;
    width: 100%;
    min-height: 49px;
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.test-selected-main-cat-wrap .sl-mt-link-wrp:hover {
    background: var(--gray-200);
}

.task-tree-cat-data {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-900);
    text-decoration: none;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.tree-test-preview-wrap {
    max-width: 680px;
    margin: 0 auto;
}

.sl-mt-link-wrp.test-answer-selected {
    background: #bff0a8 !important;
    border: 1px solid #378b10 !important;
    border-radius: 10px;
}

.selected-correct-answer {
    display: flex;
    align-items: center;
}

.sl-mt-link-wrp.test-answer-selected .task-tree-cat-data {
    width: calc(100% - 125px);
    padding-right: 10px;
}

.sl-mt-link-wrp.test-answer-selected .selected-correct-answer {
    width: 125px;
}

.back-tree-icon img {
    width: 27px;
}

.selected-correct-answer p {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    display: flex;
    align-items: center;
    color: #164103;
    margin-left: 8px;
}

span.error-timer-hold {
    display: flex;
    align-items: center;
    justify-self: center;
}

.profile-complete-progress-wrap.notify-info {
    padding: 10px 15px;
    background: #fcfcfc;
    align-items: start;
    text-align: left !important;
    direction: ltr !important;
    font-family: inter !important;
}

.profile-complete-progress-wrap.notify-info p {
    font-size: 14px;
    line-height: 25px;
}

.profile-complete-progress-wrap.notify-info .no-data-icon {
    margin: 0 8px 0px 0px;
    position: relative;
    top: 0;
    width: 24px;
}

.profile-complete-progress-wrap.notify-info.d-flex.justify-content-center p {
    font-family: "Inter", sans-serif !important;
    padding-left: 3px;
}

.profile-tester-wrap .whatsupplabel {
    margin-top: 27px;
}

.profile-tester-wrap .change-password-section {
    margin-top: 35px;
}

.profile-tester-wrap #spoken_language.d-flex-radiobox {
    flex-wrap: wrap;
    max-width: 400px;
}

.profile-tester-wrap .dropdown-label.d-flex-radiobox {
    flex-wrap: wrap;
    max-width: 400px;
    margin-bottom: 12px;
}

.profile-tester-wrap #spoken_language.d-flex-radiobox .bold {
    font-size: 16px;
}

.profile-tester-wrap .dropdown-label.d-flex-radiobox .bold {
    font-size: 16px;
}

.profile-tester-wrap #spoken_language.d-flex-radiobox .d-flex-radiobtn {
    width: 100%;
    margin-top: 25px;
}

.profile-tester-wrap .dropdown-label.d-flex-radiobox .d-flex-radiobtn {
    width: 100%;
    margin-top: 25px;
}

.profile-tester-wrap #apps label {
    font-weight: 500;
    margin-bottom: 20px;
    margin-top: 5px;
}

.profile-tester-wrap #people label {
    width: 100%;
}

.profile-tester-wrap .inc-dec-counter {
    margin-top: 12px;
    margin-bottom: 20px;
}

.profile-tester-wrap .form-group,
.profile-tester-wrap .employment-type-wrap .form-group .input-position-relative {
    max-width: 460px;
    margin-bottom: 0px !important;
}

.profile-tester-wrap .fullformbox .form-group {
    max-width: 100%;
}

.profile-tester-wrap .change-email-button {
    margin-top: 15px;
}

.testhistory-box .load-more-data {
    margin-top: 35px;
}

.tester-profilebox .employment-type-wrap .form-group .input-position-relative {
    max-width: 460px;
}

.react-datepicker-popper {
    z-index: 9 !important;
}

.new-tester-given-test.congratulation-modal-wrap.modal .modal-dialog {
    max-width: 572px;
    width: calc(100% - 15px);
}

.money-icon-wrap img {
    width: 70px;
    height: 70px;
}

.money-icon-wrap {
    margin-bottom: 16px;
}

.new-tester-given-test .congrats-modal-text {
    margin-top: -75px;
}

.new-tester-given-test .congrats-modal-text h2 {
    margin: 16px 0 16px !important;
    font-size: 24px;
    line-height: 29px;
}

.new-tester-given-test .congrts-modal-wrap {
    margin-top: 32px;
}

.new-tester-given-test .gray-color {
    color: var(--gray-700) !important;
}

.new-tester-given-test button.btn.primary-large {
    min-width: 260px !important;
}

.new-tester-given-test .congrats-modal-text {
    padding-bottom: 40px;
}

.arabic_wrapper .selected-correct-answer p {
    margin-left: 0px;
    margin-right: 8px;
}

.researcher-profilebox-right-outerbox .mt-32 h3 {
    margin-bottom: 10px;
}

.test-debriefingquestion-page-wrapper.arabic_wrapper {
    text-align: right !important;
    direction: rtl !important;
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.test-debriefingquestion-page-wrapper.arabic_wrapper .footer,
.tester-test-intro .five-seconds-timer {
    text-align: left !important;
    direction: ltr !important;
}

.test-debriefingquestion-page-wrapper.arabic_wrapper .heading,
.test-debriefingquestion-page-wrapper.arabic_wrapper .body-text {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.tester-test-intro .five-seconds-timer .heading {
    font-family: "sk-modernistbold" !important;
}

.test-debriefingquestion-page-wrapper.arabic_wrapper .btn-with-icon img,
.test-debriefingquestion-page-wrapper.arabic_wrapper .btn-with-icon svg {
    margin-right: 8px;
    margin-left: 8px;
}

.arabic_wrapper .navigation-listing ul li a span {
    margin-left: 0px;
    margin-right: 12px;
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.arabic_wrapper .proress-step-count span:first-child {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
    letter-spacing: 0px;
}

.arabic_wrapper .tester-test-intro .five-second-show-design-button .subheading>img {
    margin-right: 0px;
    margin-left: 5px;
}

.arabic_wrapper .preference-taking-test-designs-wrapper .test-design-name-and-option-wrap p {
    max-width: 100%;
    text-align: right;
    padding-right: 0;
    padding-left: 40px;
}

.arabic_wrapper .preference-taking-test-designs-wrapper .test-design-name-and-option-wrap .design-max-screen-icon {
    left: 0px;
    right: auto;
}

.test-welcome-inner-data-hold .control-label,
.browse-files-text,
.tree-answer-list-wrap .button-small {
    font-family: "Inter", sans-serif;
}

.scalebuttonbox {
    font-family: "Inter", sans-serif;
}

.country-dropdown:hover .input-icon {
    opacity: 1;
}

.arabic-wrapper .form-control {
    padding-right: 21px;
}

.arabic_wrapper .scalebuttonbox span {
    margin-left: 5px;
    margin-right: 10px;
}

.arabic_wrapper .likert-scale-length-wrap .scalebuttonbox span {
    margin-left: 10px !important;
    margin-right: 0px;
}

.questiondescription-s.d-flex.question-added-view-wrap.arabic_wrapper {
    padding-left: 0px;
}

.arabic_wrapper .no-cat-added-in-card p {
    margin-left: 0px;
    margin-right: 8px;
}

.arabic_wrapper .cardsort-view-data-repeat span img {
    margin-right: 0px;
    margin-left: 8px;
}

.arabic_wrapper .card-sorting-cat-view-wrap {
    padding-left: 0;
    padding-right: 30px;
}

.arabic_wrapper .textarea-form-group .form-control {
    padding-right: 21px;
}

.input-with-right-icon .arabic_wrapper .form-control {
    padding-right: 23px;
}

.arabic_wrapper .card-cat-top-wrp .input-field input:focus~label,
.arabic_wrapper .card-cat-top-wrp .input-field textarea:focus~label,
.arabic_wrapper .card-cat-top-wrp .input-field.focused label {
    right: 5px;
    left: auto;
}

.arabic_wrapper .card-cat-top-wrp .control-label {
    right: 5px;
    left: auto;
}

.arabic_wrapper .card-cat-top-wrp .form-group {
    margin-right: 0px;
    margin-left: 5px;
}

.arabic_wrapper .card-cat-top-wrp h3 span {
    margin-left: 0;
    margin-right: 2px;
}

em.delete-single-card.hover-inline-svg {
    cursor: pointer;
}

em.delete-single-card.hover-inline-svg svg {
    width: 21px !important;
    height: 21px !important;
}

.errorsociallogin {
    border: 1px solid var(--gray-900);
    background: none !important;
    color: var(--gray-900) !important;
    font-size: 18px;
    height: 58px;
    margin-top: 60px;
}

.errorsociallogin:hover {
    background: transparent !important;
}

.thembodyclr {
    color: var(--gray-700);
}

.mt-65 {
    margin-top: 60px;
}

.css-1c0arv4-placeholder {
    font-weight: 400;
}

.single-social-box {
    margin-top: 60px;
}

.test-selected-mt-rpt.slider {
    max-height: initial;
}

.header .bottomnavigationlist li a img {
    margin-right: 10px;
    opacity: 0.6;
    margin-left: 3px;
}

/***wallet page css****/
.data-container {
    max-width: 1241px;
}

.wallet-bank-detail-wrap {
    margin-top: 60px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap;
}

.payout-requesting-issue {
    color: var(--gray-700);
}

.add-bank-detail-wrap {
    max-width: 525px;
    margin-bottom: 32px;
}

.add-payments-button.d-flex {
    align-items: center;
    justify-content: space-between;
}

.payout-info-text a {
    color: #9759cb;
}

.paypal-button-wrap .secondary-btn img {
    margin: 0;
    width: 112px;
}

.paypal-button-wrap .secondary-btn:hover img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

.paypal-button-wrap p {
    margin: 0px 15px;
}

.payout-requesting-issue a {
    color: #9759cb;
    text-decoration: underline;
}

.payout-requesting-issue a:hover {
    color: #5c208d;
    text-decoration: underline;
}

.add-bank-account-modal .modal-lg {
    max-width: 690px;
}

.add-bank-account-modal .modal-header-top button {
    min-width: auto !important;
    display: flex !important;
}

.add-bank-account-modal-middle-data .form-group {
    max-width: 100%;
}

.bank-account-details-data-view .col-md-12 {
    margin: 16px 0;
}

.paypal-added-detail {
    margin-bottom: 16px;
}

.bank-account-details-data-view .col-md-6 .body-text-3,
.paypal-added-detail .body-text-3 {
    color: var(--gray-700);
    margin-bottom: 8px;
}

.paypal-image {
    margin-top: 16px;
}

.bank-account-details-data-view {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 16px 32px;
    width: 615px;
}

.delete-bank-aacounts {
    display: flex;
    align-items: center;
    margin-left: 16px;
    cursor: pointer;
}

.wallet-payout-history-table .table td,
.wallet-payout-history-table .table tr th {
    padding: 14px 0px;
    vertical-align: middle;
}

.wallet-payout-history-table .table-responsive .table {
    min-width: 100%;
}

.table-wrapper.study-history-table.wallet-payout-history-table {
    max-width: 100%;
}

.table-wrapper.study-history-table.wallet-payout-history-table.mt-40 table tr td {
    border-bottom: 1px solid var(--gray-400);
    padding: 20px 0px;
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-900);
}

.table-wrapper.study-history-table .table tbody tr:hover {
    background: var(--gray-50);
}

.in-progress {
    color: #ffb800;
}

.completed {
    color: #378b10;
}

.big-column {
    width: 79%;
}

.table-center-div {
    margin: 0 auto;
    width: 200px;
}

.email-sent-modal a {
    text-decoration: none !important;
}

/**calendar css***/
.MuiInputBase-root.MuiOutlinedInput-root.MuiInputBase-colorPrimary.MuiInputBase-formControl.MuiInputBase-adornedEnd.css-1bn53lx {
    max-width: 400px;
    width: 400px;
}

.MuiCalendarOrClockPicker-root .css-a9rw36,
.MuiCalendarOrClockPicker-root .css-epd502 {
    outline: 0px !important;
    background: var(--gray-200) !important;
    border-radius: 28px !important;
    box-shadow: unset !important;
}

.MuiCalendarOrClockPicker-root>div {
    box-shadow: unset !important;
}

.MuiButtonBase-root {
    background: var(--gray-200) !important;
}

button.MuiButtonBase-root {
    font-weight: 400 !important;
    font-size: 13px !important;
    line-height: 24px !important;
    letter-spacing: 0.5px !important;
    color: var(--gray-900);
}

.MuiButtonBase-root:hover {
    background-color: rgba(0, 0, 0, 0.04) !important;
}

.MuiButtonBase-root.css-ub1r1.Mui-selected {
    background: #793eab !important;
    border-radius: 100px !important;
    color: var(--gray-50) !important;
}

.css-wed0tz:not(.Mui-selected) {
    border: 1px solid #793eab !important;
    color: #793eab !important;
}

.css-m1gykc.Mui-selected {
    color: rgb(255, 255, 255) !important;
    background-color: #793eab !important;
}

.css-f4m3aa.Mui-selected {
    color: rgb(255, 255, 255) !important;
    background-color: #793eab !important;
}

button.MuiButtonBase-root.MuiIconButton-root.MuiIconButton-edgeEnd.MuiIconButton-sizeMedium.css-slyssw {
    background: none !important;
    width: 40px;
    height: 40px;
    padding: 8px !important;
    position: relative;
    right: 5px;
}

button.MuiButtonBase-root.MuiIconButton-root.MuiIconButton-edgeEnd.MuiIconButton-sizeMedium.css-slyssw:hover,
button.MuiButtonBase-root.MuiIconButton-root.MuiIconButton-edgeEnd.MuiIconButton-sizeMedium.css-slyssw:focus {
    background: none !important;
}

.css-mjjjrh.Mui-focused {
    color: var(--gray-900) !important;
}

button.MuiButtonBase-root.MuiIconButton-root.MuiIconButton-edgeEnd.MuiIconButton-sizeMedium.css-slyssw svg {
    width: 20px !important;
}

.MuiPaper-root.MuiPaper-elevation.MuiPaper-rounded.MuiPaper-elevation8.MuiPickersPopper-paper.css-a9rw36 {
    box-shadow: none !important;
}

.css-u9osun.Mui-focused {
    color: #793eab !important;
}

.table-wrapper.study-history-table.testhistory-box {
    padding-left: 30px;
}

.profile-tester-wrap .phone-number-field {
    max-width: 460px;
}

.add-bank-account-modal .phone-number-field {
    max-width: 100%;
}

.accountnaviagtion-outer::-webkit-scrollbar-track,
.dashboard-filter-left.inner-navigation::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
    border-radius: 10px;
    background-color: var(--gray-50);
}

.accountnaviagtion-outer::-webkit-scrollbar,
.dashboard-filter-left.inner-navigation::-webkit-scrollbar {
    width: 5px;
    background-color: var(--gray-50);
}

.accountnaviagtion-outer::-webkit-scrollbar,
.dashboard-filter-left.inner-navigation::-webkit-scrollbar {
    height: 4px;
}

.accountnaviagtion-outer::-webkit-scrollbar-thumb,
.dashboard-filter-left.inner-navigation::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
    background-color: var(--gray-50);
}

.phone-number-field {
    position: relative;
}

.rs-inner-profile-wrapper .profile-tester-wrap #spoken_language.d-flex-radiobox .d-flex-radiobtn {
    width: 100%;
    margin-top: 25px;
    justify-content: flex-start;
}

.rs-inner-profile-wrapper .profile-tester-wrap .dropdown-label.d-flex-radiobox .d-flex-radiobtn {
    width: 100%;
    margin-top: 25px;
    justify-content: flex-start;
}

.rs-inner-profile-wrapper .profile-tester-wrap #spoken_language.d-flex-radiobox .d-flex-radiobtn label {
    margin-right: 40px;
}

.rs-inner-profile-wrapper .profile-tester-wrap .dropdown-label.d-flex-radiobox .d-flex-radiobtn label {
    margin-right: 40px;
}

.bank-account-details-data-view p {
    word-wrap: break-word;
    word-break: break-word;
}

.rs-inner-profile-wrapper .profile-tester-wrap #gender .d-flex-radiobtn {
    margin-left: 20px;
}

.flag-value-container {
    display: flex;
    align-items: center;
}

.flag-value-container svg {
    margin-right: 6px;
    width: 16px !important;
    height: 16px !important;
}

.row.change-email-row {
    align-items: center;
}

.survey-added-question-repeat .css-tlfecz-indicatorContainer,
.survey-added-question-repeat .css-1gtu0rj-indicatorContainer ,.survey-logic-added .css-1gtu0rj-indicatorContainer,.survey-logic-added .css-tlfecz-indicatorContainer{
    position: absolute;
    right: 0;
    width: fit-content;
    display: flex;
    justify-content: flex-end;
}

.css-1nf2ro8 .MuiDialog-paper,
.css-1t1j96h-MuiPaper-root-MuiDialog-paper {
    outline: 0px;
    min-width: 320px;
    background: var(--gray-200) !important;
    border-radius: 28px !important;
}

.css-1t1j96h-MuiPaper-root-MuiDialog-paper {
    background: var(--gray-200) !important;
}

.MuiDialogActions-root button {
    color: #793eab !important;
}

.MuiDialogActions-root button {
    color: #793eab !important;
    font-weight: 500 !important;
    font-size: 14px !important;
}

.MuiPickersToolbar-root.MuiDatePickerToolbar-root.css-xzqsgo {
    border-bottom: 1px solid #dadada;
}

.MuiGrid-root.MuiGrid-container.MuiPickersToolbar-content.css-1bqwt78 {
    margin-top: 20px;
    margin-bottom: 7px;
}

.css-1u3bzj6-MuiFormControl-root-MuiTextField-root {
    width: 100% !important;
}

.css-gztimk-MuiPaper-root-MuiPickersPopper-paper {
    box-shadow: none !important;
}

.css-1yllih9-MuiPaper-root-MuiPickersPopper-paper {
    box-shadow: none !important;
}

.css-15fehp8-MuiTypography-root-PrivatePickersMonth-root.Mui-selected,
.css-3eghsz-PrivatePickersYear-button.Mui-selected {
    color: var(--gray-50);
    background-color: #793eab !important;
}

.search-dropdown-component .dropdown-label {
    left: 21px !important;
}

.search-dropdown-component .flag-value-container {
    padding-left: 0px;
}

.search-dropdown-component.focused .css-1d8n9bt,
.search-dropdown-component.active .css-1d8n9bt,
.search-dropdown-component .css-319lph-ValueContainer {
    padding-left: 16px;
}

.search-dropdown-component .css-ackcql {
    padding-left: 0px !important;
}

.search-dropdown-component .input-icon {
    left: 17px !important;
    top: 31px !important;
    z-index: 9;
    background: var(--gray-50);
    padding: 0px 4px 0px 5px;
}

.search-dropdown-component .css-1d8n9bt {
    padding-left: 12px !important;
}

.search-dropdown-component.focused .css-1d8n9bt {
    padding-left: 16px !important;
}

.search-dropdown-component.input-field.focused label {
    z-index: 0;
    left: 10px !important;
}

.field-error fieldset.MuiOutlinedInput-notchedOutline.css-igs3ac {
    border-color: #ff0000;
}

.MuiPaper-root.MuiPaper-elevation.MuiPaper-rounded.MuiPaper-elevation8.MuiPickersPopper-paper.css-1xo7hb2 {
    box-shadow: none;
}

.date-picker-field fieldset {
    border-radius: 10px;
    border-color: #9c9c9c;
}

.date-picker-field.active-field fieldset {
    border-color: var(--gray-700);
}

.css-1jiiioa {
    font-family: "Inter" !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    color: var(--gray-900) !important;
}

.date-picker-field button.MuiButtonBase-root {
    font-weight: 400 !important;
    font-size: 13px !important;
    line-height: 24px !important;
    letter-spacing: 0.5px !important;
    color: var(--gray-600);
    right: 5px;
}

.date-picker-field button.MuiButtonBase-root:hover {
    color: var(--gray-900);
}

.MuiPickersToolbar-root.MuiDatePickerToolbar-root.css-1eurbeq-MuiPickersToolbar-root-MuiDatePickerToolbar-root {
    border-bottom: 1px solid #dadada;
}

.MuiGrid-root.MuiGrid-container.MuiPickersToolbar-content.css-jhsfre-MuiGrid-root-MuiPickersToolbar-content {
    margin-top: 20px;
}

.css-3jvy96-MuiTypography-root-MuiDatePickerToolbar-title {
    font-size: 32px;
}

button.MuiButtonBase-root.MuiPickersDay-root.Mui-selected.MuiPickersDay-dayWithMargin.css-bkrceb-MuiButtonBase-root-MuiPickersDay-root {
    background: #793eab !important;
}

.date-picker-field .css-i44wyl {
    width: 100% !important;
    max-width: 400px;
}

.MuiPickersPopper-root {
    z-index: 22 !important;
}

.add-bank-account-modal .modal-body button {
    margin: 0 auto;
}

.welcom-userq-modal .modal-body {
    padding: 20px 20px 0px !important;
    overflow: hidden !important;
}

.welcom-userq-modal .modal-content {
    overflow: hidden;
}

.welcom-userq-modal .congrats-modal-header {
    text-align: center;
    padding: 0px 12px;
    border-radius: 20px;
    min-height: 168px;
}

.designs-preview-modal video {
    max-width: 100%;
    width: 100%;
    display: block !important;
}

.average-time-wrap .dropdown-chips.chips-without-flag {
    margin-top: 20px;
}

.MuiInputBase-input {
    padding: 0px 21px !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 25px !important;
    height: 55px !important;
    color: var(--gray-900) !important;
}

.date-picker-field .css-1nl0svv {
    font-size: 16px !important;
    line-height: 24px !important;
    font-weight: 400 !important;
    color: var(--gray-600) !important;
    transition: 0.2s all !important;
}

.date-picker-field .css-18g6x4i {
    font-weight: 500 !important;
    font-size: 12px !important;
    line-height: 17px !important;
    color: var(--gray-700) !important;
    background: var(--gray-50) !important;
    padding: 0 8px !important;
    z-index: 1 !important;
    font-family: "Inter" !important;
    transform: translate(11px, -9px) scale(1);
    -webkit-transform: translate(11px, -9px) scale(1);
}

.profile-form-wrap.profile-tester-wrap .date-picker-field .css-i44wyl {
    width: 100% !important;
    max-width: 460px;
}

.profile-form-wrap.profile-tester-wrap .fullformbox .form-group {
    max-width: 460px;
}

.css-18g6x4i.Mui-focused {
    color: rgb(156, 39, 176) !important;
}

.formbox .date-picker-field .css-i44wyl {
    max-width: 460px;
}

.prefer-follow-up-section {
    border: 0;
    border-radius: 0;
}

.preference-test-followup-questions {
    display: flex;
    max-width: 100%;
}

.preference-test-followup-questions-wrap {
    padding: 20px 50px;
    max-width: 1600px;
}

.preference-test-followup-questions .selected-design {
    width: 693px;
}

.preference-test-followup-questions .preference-test-designs-repeat,
.preference-test-followup-questions .added-design-img-thm {
    width: 100%;
}

.preference-test-followup-questions .taking-test-page-wrap {
    width: calc(100% - 693px);
    padding-left: 20px;
}

.preference-test-followup-questions .prefer-design-image-view-hold {
    width: 100%;
    padding: 22px;
}

.preference-test-followup-questions .added-design-preview-thum {
    padding: 0px;
    border-width: 1.5px;
}

.preference-test-followup-questions .taking-test-page-height {
    min-height: 500px;
    padding: 0px 0px 20px;
    display: flex;
    width: 100%;
    align-items: self-start;
}

.preference-test-followup-questions .taking-test-page-height>div {
    width: 100%;
}

.preference-test-followup-questions .taking-test-page-height>div:empty {
    display: none;
}

.preference-test-followup-questions .medium-box-wrapper {
    max-width: 100%;
    margin: 0 auto;
}

.preference-test-followup-questions .container {
    max-width: 100%;
}

.preference-test-followup-questions .likert-scale-taking-test-view .likert-option-left {
    width: 160px;
    padding-right: 10px;
}

.preference-test-followup-questions .likert-scale-taking-test-view .likert-option-right {
    display: flex;
    width: calc(100% - 160px);
}

.preference-test-followup-questions .optional-button .secondary-btn,
.preference-test-followup-questions .optional-button .ghost-btn {
    position: relative;
    left: 0;
}

.preference-test-followup-questions .optional-button button:first-child {
    position: relative;
    left: 0;
    margin-right: 16px;
}

.preference-taking-test-designs-wrapper .selected-btn img {
    width: 16px !important;
    height: 16px !important;
}

.MuiGrid-root.MuiGrid-container.MuiPickersToolbar-content button {
    background: none !important;
}

.MuiGrid-root.MuiGrid-container.MuiPickersToolbar-content button svg {
    color: var(--gray-700) !important;
}

.css-1bzq5ag {
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: 0.1px !important;
    color: var(--gray-700) !important;
}

.page-not-find {
    background: url(../img/404-background-img.png);
    background-size: cover;
    background-position: center;
}

.page-not-find .welcome-modal-loader {
    background: #fff;
    min-height: calc(100vh - 70px);
}

.page-not-find .login-data-wrap.flex-wrap.already-taken-testlogin-wrap {
    background-color: unset;
}

.MuiPaper-root .MuiInputBase-root .MuiSvgIcon-root {
    opacity: 0;
}

.not-found-page-text .icon-large-icon {
    width: auto;
    height: auto;
    display: table;
    margin: 0 auto;
}

.not-found-page-text .subtitle-1 {
    display: block;
    margin: 40px 0;
    color: var(--gray-50);
    padding: 0;
}

.not-found-page-text {
    text-align: center;
    padding-bottom: 40px;
    min-height: calc(100vh - 330px);
}

.page-not-find .error-page-footer-wrap.d-flex.text-center {
    position: static;
}

.not-found-page-text button.btn.primary-large.btn-with-icon.btn-with-icon-right {
    background: var(--gray-50);
    border-color: var(--gray-50);
    color: var(--gray-900);
}

.not-found-page-text button.btn.primary-large.btn-with-icon.btn-with-icon-right:hover {
    color: var(--gray-50);
}

.not-found-page-text button.btn.primary-large.btn-with-icon.btn-with-icon-right:hover img {
    -webkit-filter: invert(100%);
    filter: invert(100%);
}

.page-not-find p {
    color: var(--gray-900);
}

.page-not-find .error-page-footer-wrap .heading {
    color: var(--gray-900);
}

.page-not-find span.error-timer-hold svg path {
    stroke: var(--gray-900);
}

.page-not-find a.logo {
    display: table;
    margin: 0 auto 90px;
}

.page-not-find .login-data-wrap.flex-wrap.already-taken-testlogin-wrap {
    min-height: calc(100vh - 70px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 0px;
}

.follow-up-question-header {
    padding: 0px !important;
    border: 0px !important;
}

.follow-up-data-nav {
    padding: 18px 25px 0px 25px;
    border-bottom: 1px solid var(--gray-400);
}

.result-follow-up-heading {
    padding: 40px 25px 27px;
}

.preference-test-followup-questions-wrap .design-max-screen-icon {
    right: 0px;
}

.preference-test-followup-questions-wrap .test-design-name-and-option-wrap p {
    margin: 0px;
}

.preference-test-followup-questions-wrap .test-design-name-and-option-wrap {
    margin-bottom: 15px;
    margin-top: -4px;
}

.preference-test-followup-questions-wrap .added-design-img-thm {
    margin: 0px;
}

.taking-test-progressbar span.overline.medium-font {
    font-weight: 600;
}

.card-cat-top-wrp .project-name-guide-text {
    display: none !important;
}

.preference-test-followup-questions .test-design-name-and-option-wrap:empty {
    display: none;
}

.unknown-participant-tableheader .span:hover .tooltip-wrapper {
    display: block;
}

.prefer-follow-up-section .create-test-preview-area {
    display: none !important;
}

.arabic_wrapper_main .prefer-follow-up-section .logicbuttonbox {
    margin-left: 0;
    margin-right: 61px;
    position: relative;
    left: -11px;
}

.arabic_wrapper_main .prefer-follow-up-section .logicbuttonbox {
    position: relative;
    left: -13px;
}

.arabic_wrapper_main .prefer-follow-up-section .logicbuttonbox .toggle_btn_label {
    position: relative;
    left: 71px;
}

.arabic_wrapper_main .prefer-follow-up-section .input-field label {
    left: auto;
    right: 15px;
}

.arabic_wrapper_main .prefer-follow-up-section .questioninputbox .ans-icon {
    margin-right: 0px;
    margin-left: 10px;
}

.arabic_wrapper_main .prefer-follow-up-section .questioninputbox .ans-close-row {
    margin-left: 0px;
    margin-right: 10px;
}

.arabic_wrapper .survey-question-holder.questioninputbox {
    text-align: right;
    direction: rtl;
}

.create-prefer-text-wrapper .arabic_wrapper .survey-add-question-wrapper {
    text-align: right;
    direction: rtl;
}

.create-prefer-text-wrapper .survey-question-holder .dropdown-container.form-group {
    text-align: left;
    direction: ltr;
}

.faqs-section {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.faqs-section-left {
    width: 341px;
}

.faqs-section-right {
    width: calc(100% - 341px);
    padding-left: 70px;
}

.faqs-section-left .stepper-wrap.test-result-nav-wrap {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    padding: 32px;
    width: 100%;
}

.arabic_wrapper_main .prefer-follow-up-section .input-field label {
    right: 15px;
    left: auto;
}

.faqs-section-left .stepper-wrap.test-result-nav-wrap li {
    cursor: pointer;
}

.faqs-section-left .stepper-wrap.test-result-nav-wrap li .inline-svg-- {
    width: auto;
    height: auto;
    justify-content: center;
    padding: 0;
    margin: 0;
}

.faqs-section-right h4.heading.h4 {
    margin-bottom: 32px;
}

.faqs-section-right .accordian-header .subtitle-1 {
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
}

.contact-section {
    max-width: 660px;
}

.contact-section .form-group {
    max-width: 100%;
    margin: 38px 0;
}

.contact-section label.checkbox-wrap.checkbox-label {
    margin: 32px 0px;
}

.contact-section label.checkbox-wrap.checkbox-label p {
    font-weight: 500;
    font-family: "Inter", sans-serif !important;
}

.contact-section .textarea-form-group .form-control {
    min-height: 223px !important;
}

.faqs-section .faq-accordion-data a {
    text-decoration: underline;
}

.faqs-section .faq-accordion-data ul {
    padding: 0 0 0 16px;
    margin: 20px 0 0;
}

.create-prefer-text-wrapper .arabic_wrapper .dropdown-container.form-group.input-field label {
    left: 15px;
    right: auto;
}

.create-prefer-text-wrapper .arabic_wrapper .css-tlfecz-indicatorContainer {
    width: auto !important;
}

.create-prefer-text-wrapper .arabic_wrapper .survey-question-added-info {
    padding-right: 10;
    padding-right: 10px;
}

.survey-question-added-info {
    word-break: break-word;
}

.create-prefer-text-wrapper .arabic_wrapper .input-position-relative.dropdown-field.singleselect-dropdown {
    margin-left: 0px !important;
    margin-right: 20px;
    text-align: left;
    direction: ltr;
    min-width: 180px;
}

/*.create-prefer-text-wrapper .arabic_wrapper .add-logic-true .input-position-relative.dropdown-field.singleselect-dropdown .css-1s2u09g-control, 
  .create-prefer-text-wrapper .arabic_wrapper .add-logic-true .input-position-relative.dropdown-field.singleselect-dropdown .css-1pahdxg-control{
    padding-left: 16px;  
  }*/

.card-sorting-creating-test-wrap .arabic_wrapper .input-position-relative.dropdown-field.singleselect-dropdown,
.arabic_wrapper .survey-question-holder .input-position-relative.dropdown-field.singleselect-dropdown {
    margin-left: 0px !important;
    margin-right: 20px;
    text-align: left;
    direction: ltr;
    min-width: 180px;
}

/*.create-prefer-text-wrapper .arabic_wrapper .add-logic-true .input-position-relative.dropdown-field.singleselect-dropdown .css-1s2u09g-control, 
  .create-prefer-text-wrapper .arabic_wrapper .add-logic-true .input-position-relative.dropdown-field.singleselect-dropdown .css-1pahdxg-control{
    padding-left: 16px;   
  }*/

/*.arabic_wrapper .survey-question-holder .input-position-relative.dropdown-field.singleselect-dropdown .css-1s2u09g-control,
  .arabic_wrapper .survey-question-holder .input-position-relative.dropdown-field.singleselect-dropdown .css-1pahdxg-control{
      padding-left: 16px;  
  }*/

.main-page-download-report {
    overflow-x: hidden;
}

.read-only-dropdown .css-1s2u09g-control {
    border: 1px solid var(--gray-500) !important;
}

.dropdown-container.read-only-dropdown .css-1s2u09g-control {
    border: 1px solid var(--gray-500) !important;
}

.read-only-dropdown .flag-value-container,
.read-only-dropdown .control-label {
    color: var(--gray-500) !important;
}

.read-only-dropdown:hover .control-label {
    color: var(--gray-500) !important;
}

.multiselectlist-dropdown-box-container:hover .hover-inline-svg svg path,
.multiselectlist-dropdown-box-container:hover .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-900) !important;
}

.read-only-dropdown.dropdown-container .hover-inline-svg svg path,
.read-only-dropdown.dropdown-container .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-600) !important;
}

.read-only-dropdown .hover-inline-svg svg path,
.read-only-dropdown .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-600) !important;
}

.preference-test-question-table-header.preference-test-question-table-bottom-header.pt-40 {
    margin-top: 0;
    padding-top: 40px;
}

.pt-40 {
    padding-top: 40px;
}

.video-design-icon {
    display: none;
}

.prefer-anayl-data-table .test-result-inner-data.preference-test-results-container {
    padding-top: 0px;
}

.questioninputbox span.tag.purple-tag span img,
.questioninputbox span.tag.purple-tag span svg {
    width: 19px;
    margin-left: 4px !important;
    cursor: pointer;
    height: 19px !important;
}

span.tag span {
    display: flex;
}

span.tag.purple-tag.not-applicable-notselected .hover-inline-svg {
    width: 19px;
    margin-left: 4px;
    cursor: pointer;
    height: 19px !important;
    position: relative;
    top: 3px;
}

.arabic_wrapper span.tag.purple-tag .hover-inline-svg,
.arabic_wrapper .questioninputbox span {
    margin-left: 0px;
}

.tag.purple-tag span svg {
    margin-left: 0px !important;
    margin-right: 0;
    position: relative;
    left: -2px;
}

span.tag.purple-tag.not-applicable-notselected .hover-inline-svg svg path,
span.tag.purple-tag.not-applicable-notselected .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-600) !important;
}

span.tag.purple-tag.not-applicable-notselected {
    background: #e9e9e9;
    border-color: #e9e9e9;
    color: #9c9c9c;
}

.sign-up-btn-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.register-page-min-hegiht {
    padding-bottom: 40px;
    min-height: calc(100vh - 310px);
}

.read-only-dropdown .css-1pahdxg-control:hover,
.read-only-dropdown .css-1pahdxg-control:hover,
.read-only-dropdown .css-1pahdxg-control:focus,
.read-only-dropdown .css-1pahdxg-control:focus,
.read-only-dropdown .css-1pahdxg-control:active,
.read-only-dropdown .css-1pahdxg-control:active {
    border-color: var(--gray-500) !important;
}

.dropdown-container.read-only-dropdown .css-1pahdxg-control,
.dropdown-container.read-only-dropdown .css-1pahdxg-control:focus {
    border-color: var(--gray-500) !important;
}

.dropdown-container.read-only-dropdown .css-1wy0on6 {
    right: 0px !important;
}

.main-page-download-report .download-report-wrapper.page-min-height {
    min-height: calc(100vh - 157px) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 10px;
}

.pt-32 {
    padding-top: 32px;
}

.arabic_wrapper_main .added-question-wrap {
    text-align: right !important;
    direction: rtl !important;
}

.arabic_wrapper_main .added-question-wrap .questionaddlogic-v {
    width: auto !important;
    margin-left: 0px !important;
    margin-right: 0px;
}

.arabic_wrapper_main .added-question-wrap .questionaddlogic-v .toggle-with-label .toggle_btn_label {
    left: 78px;
    padding-left: 0px;
}

.arabic_wrapper_main .added-question-wrap .questiondescription-s {
    padding-left: 21px;
}

.arabic_wrapper_main .added-question-wrap .question-optionbox .arabic_wrapper {
    margin-right: 10px;
}

.arabic_wrapper_main .added-question-wrap .padd-lr-25.question-scalebox-input.arabic_wrapper {
    padding: 0 7px;
}

.col-md-8 .flex-buttons-wrap {
    display: flex;
    align-items: center;
}

.col-md-8 .flex-buttons-wrap .secondary-btn {
    position: relative;
    top: 1px;
}

.survey-add-question-wrapper.questioninputbox.arabic_wrapper .button-wrap.d-flex.justify-content-start {
    text-align: right !important;
    direction: rtl !important;
}

.survey-question-holder.questioninputbox.arabic_wrapper .logicbuttonbox {
    margin-left: 0px;
    margin-right: 80px;
    padding-left: 15px;
}

.survey-question-holder.questioninputbox.arabic_wrapper .logicbuttonbox .toggle-with-label .toggle_btn_label {
    padding-left: 0px;
    left: 70px;
}

.figma-flow-top-head {
    margin: 0px 0px 23px 0;
}

.figma-define-row-wrap {
    display: flex;
    align-items: center;
}

.define-start-design-box {
    width: 225px;
    background: #ffffff;
    border: 1px solid var(--gray-400);
    border-radius: 12px;
    padding: 16px 20px;
}

.define-design-box-head {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
    width: 100%;
    color: var(--gray-900);
}

.defined-design-edit-left {
    display: flex;
    align-items: center;
    width: 100%;
}

.define-design-box-head img,
.define-design-box-head svg {
    margin-right: 8px;
}

.define_flow_container.arabic-wrapper .define-design-box-head svg {
    margin-right: 0px;
    margin-left: 8px;
}

.set-goal-modal-wrap.arabic-wrapper .btn-with-icon img,
.set-goal-modal-wrap.arabic-wrapper .btn-with-icon svg {
    margin-right: 0px;
    margin-left: 8px;
}

.define-box-image-preview {
    background: var(--gray-50);
    margin-bottom: 32px;
}

.define-box-prew-inner {
    height: 120px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gray-400);
}

.define-box-prew-inner img {
    width: 100%;
    height: auto;
    max-height: 100%;
    object-fit: cover;
    object-position: top;
}

.define-box-btn-wrap {
    width: auto;
    justify-content: center;
    display: flex;
    align-items: center;
    margin: 0 auto;
}

.define-design-arrow {
    margin: 0px 40px;
}

.dropdown-container.read-only-dropdown .css-1s2u09g-control .css-1c0arv4-placeholder,
.dropdown-container.read-only-dropdown .css-1pahdxg-control .css-1c0arv4-placeholder {
    color: var(--gray-500) !important;
}

.dropdown-container.read-only-dropdown .css-1s2u09g-control:hover .css-1c0arv4-placeholder,
.dropdown-container.read-only-dropdown .css-1pahdxg-control:hover .css-1c0arv4-placeholder {
    color: var(--gray-500) !important;
}

.terms-checkbox-label a {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    text-decoration: underline;
    color: #9759cb;
    cursor: pointer;
}

.terms-checkbox-label {
    cursor: default;
}

.terms-checkbox-label a:hover {
    color: #5c208d;
}

.added-card-cat-repeat-sub-items {
    width: 100%;
    /* background: #EFDCFF; */
    /* border: 1px solid #9759CB; */
    /*border: 1px solid;*/
    border-radius: 10px;
    padding: 12px 16px;
    /*margin: 10px 0px 10px;*/
    display: flex;
    align-items: center;
    min-height: 50px;
    /*transition: 0s;*/
}

.added-card-cat-repeat-sub-items .drag-area-top {
    height: 25px;
}

.added-card-cat-repeat-sub-items .ans-icon svg {
    width: 24px;
    height: 24px;
}

.added-card-cat-repeat-sub-items .ans-icon svg path {
    stroke: #9c9c9c;
}

.added-card-cat-repeat-sub-items .ans-icon:hover svg path {
    stroke: #000;
}

.draggable-inner-element-start {
    background-color: #efdcff !important;
    border: 1px solid #9759cb;
    border-radius: 10px;
    transform: rotate(-2deg);
    transition: 0.1s;
}

.draggable-element-start {
    /*background: var(--gray-500);*/
    border: none;
}

.draggable-element-move {
    background: #fcfcfc;
    border: 1px dashed var(--gray-600);
    border-radius: 10px;
}

.test-environment-header {
    background: #9759cb;
    text-align: center;
    padding: 5px;
    color: var(--gray-50);
    font-size: 12px;
}

.define-design-edit {
    width: 25px;
    cursor: pointer;
    padding: 0px;
}

.figma-flow-top-head p {
    color: var(--gray-700);
    margin-top: 8px;
}

/***Result header****/
.header.researcher-header.result-header {
    position: static;
}

.result-body .three-column-layout-left .stepper-wrap {
    top: 20px;
}

.result-body .three-column-layout-top-header {
    top: 0px !important;
    position: static;
}

.result-body .bd-question-view-wrap .question-result-header {
    position: sticky !important;
    top: -1px;
    z-index: 3;
}

.result-body .question-result-data .accountnaviagtion-outer.result-navigation-outer {
    top: 112px;
}

.result-body .accountnaviagtion-outer.result-navigation-outer.d-block.follow-up-question-header {
    top: 0;
}

.taking-test-header .header-credits-wrap a {
    text-decoration: none;
}

.modal-dialog .report-answer-body .form-group {
    max-width: 100%;
    margin-top: 20px;
}

.box-medium.two-row-legends-box {
    width: 100% !important;
}

.two-row-legends {
    display: flex;
    flex-wrap: wrap;
}

.two-row-legends .chart-info-repeat {
    max-width: 50%;
    width: 50%;
    padding-right: 10px;
}

.purple-bg-fill {
    background: #9759cb;
    border-color: #9759cb;
}

.first-click-box .card-placeholder-img {
    position: relative;
}

.test-coming-soon {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.5);
    font-weight: 500;
    opacity: 0;
}

.first-click-box:hover .test-coming-soon {
    opacity: 1;
}

.create-prototype-test .radio-btn-labels-wrap .radio-btn-label.semi-bold-font {
    font-size: 18px;
    color: #2b2b2b;
    font-weight: 500;
    margin-bottom: 6px;
    line-height: 30px;
}

.prototype-test-task-btns-list {
    margin: 20px -10px 0px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.color-purple {
    color: #9759cb;
}

.prototype-test-task-btns-list button {
    margin: 6px 10px 0px;
}

.task-prototype-test-sync-right .body-text-2 {
    display: block;
    margin-bottom: 8px;
}

.task-prototype-test-sync-left {
    width: 185px;
    height: 120px;
}

.task-prototype-test-sync-right {
    width: calc(100% - 185px);
    padding-left: 32px;
}

.mobile-preview-device .task-prototype-test-sync-left {
    width: 157px;
    height: 233px;
}

.mobile-preview-device .task-prototype-test-sync-left .define-box-image-preview {
    background: unset;
    height: 100%;
}

.mobile-preview-device .define-box-prew-inner img {
    object-fit: contain;
}

.mobile-preview-device .define-box-prew-inner {
    height: 100%;
    background: unset;
}

.mobile-preview-device .task-prototype-test-sync-right {
    width: calc(100% - 157px);
    padding-left: 40px;
}

.mobile-preview-define-flow .define-start-design-box {
    width: auto;
    background: unset;
}

.mobile-preview-define-flow span.define-design-edit svg {
    margin: 0;
    width: 16px;
    height: 16px;
}

.mobile-preview-define-flow .define-box-image-preview {
    width: 157px;
    height: 233px;
    background: unset;
}

.mobile-preview-define-flow .skeleton-icon-wrapper-loading .react-loading-skeleton {
    height: 232px !important;
}

.border-one-px-gray .define-box-prew-inner {
    background-color: #f9f9f9;
}

.mobile-preview-define-flow .define-box-prew-inner {
    height: 100%;
}

.mobile-preview-define-flow .define-box-prew-inner img {
    object-fit: contain;
}

.separator {
    border-top: 1px solid var(--gray-400);
}

.prototype-test-title .subtitle-2 {
    margin: 0px;
}

.cardsorting-wrap-mid-data .form-group {
    z-index: 0;
    position: relative;
}

.task-prototype-test-sync-row {
    padding: 11px 0 0;
}

.prototype-task-description .formbox {
    margin-bottom: 0;
}

.cardsorting-wrap-mid-data.prototype-task-description {
    padding: 32px;
}

.task-prototype-test-sync-row .define-box-image-preview {
    margin-bottom: 0px;
}

.prototype-task-description span.subtitle-2.medium-font {
    margin-bottom: 5px;
    display: block;
}

.prototype-task-followup-questions {
    padding: 21px 32px 0;
}

.prototype-task-followup-questions .create-test-preview-area,
.prefer-follow-up-section-1 .create-test-preview-area {
    right: -473px;
}

.card-sorting-test-wrap .survey-add-question-wrapper .input-field label,
.card-sorting-test-wrap .survey-add-question-wrapper .form-control {
    z-index: 0;
}

.card-sorting-test-wrap .survey-add-question-wrapper .input-field label {
    z-index: -1;
}

.prototype-task-followup-questions .survey-add-question-wrapper .input-field label {
    z-index: 0;
}

.card-sorting-test-wrap .survey-add-question-wrapper .input-field.focused label {
    z-index: 0;
}

.prototype-task-followup-questions .ans-list-wrap {
    position: relative;
    z-index: 0;
}

.prototype-task-followup-questions .ans-list-wrap .input-position-relative input {
    position: relative;
    z-index: 0;
}

.prototype-task-followup-questions .ans-list-wrap .form-group label {
    z-index: -1;
}

.goal-screen-modal-wrap iframe {
    width: 100% !important;
    max-width: 100% !important;
    border: 0px;
    background: none;
    padding: 5px;
    height: 100% !important;
    position: absolute;
    left: 0px;
    right: 0px;
    margin: 0 auto;
    top: 0px;
}

.prototype-text-heading img {
    margin-right: 10px;
}

.goal-screen-modal-wrap .modal-dialog {
    max-width: 968px;
    width: calc(100% - 30px);
}

.mobile-iframe-wrapper .modal-dialog {
    max-width: 787px;
    width: 96%;
    width: calc(100% - 30px);
}

.mobile-iframe-wrapper iframe {
    width: auto !important;
    /* zoom:0.6; */
}

.figma-prototype-control-maximize {
    position: absolute;
    right: 12px;
    top: 12px;
    background: #fff;
    padding: 6px;
    border-radius: 6px;
    cursor: pointer;
}

.iframewrap-max-height {
    height: calc(100vh - 195px);
    overflow: hidden;
    position: relative;
    background: #e9e9e9;
}

.set-goal-screen-with-buttons .iframewrap-max-height {
    height: calc(100vh - 350px);
}

.task-order-modal .modal-dialog {
    max-width: 837px;
    width: calc(100% - 15px);
}

.figma_prototype_footer {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 10px 20px;
    height: 61px;
    z-index: 222;
    background: var(--gray-50);
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25);
    -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25);
}

.prototype-test-wrap.five-second-full-view-wrap.prototype-test-fullscreen {
    padding: 0 !important;
    align-items: start;
}

.figma_prototype_design_screen iframe {
    height: calc(100vh - 61px);
    width: 100% !important;
    border: 0px;
}

.figma_prototype_design_screen_container {
    width: 100%;
}

.figma_prototype_sidebar {
    position: fixed;
    background: var(--gray-50);
    height: calc(100vh - 80px);
    width: 503px;
    z-index: 22;
    overflow-y: auto;
    top: 0px;
}

.figma_prototype_sidebar .sidebar-header {
    cursor: pointer;
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

.exit-test-button {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-900);
    display: flex;
    align-items: center;
    cursor: pointer;
}

.exit-test-button img,
.exit-test-button svg {
    margin-right: 8px;
}

.contact-support-button,
.contact-support-button a {
    color: var(--gray-900);
    cursor: pointer;
    text-decoration: none !important;
}

.figma_prototype_sidebar_body .loading-prototype-button .btn {
    min-width: 192px;
}

.change-order-button-wrap {
    display: flex;
    align-items: center;
}

.change-order-btn {
    margin-left: 12px;
}

.set-goal-sub-heading {
    color: var(--gray-700);
    margin-bottom: 12px;
}

.set-goal-btn {
    margin-top: 32px;
}

.modal-set-goal-top .btn {
    margin-right: 32px;
    position: relative;
}

.modal-set-goal-top .btn img {
    width: auto;
}

.modal .close svg {
    width: 24px;
    height: 24px;
}

.task-order-modal .preference-test-designs-repeat {
    display: block;
    width: 100%;
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    margin: 0px 0 20px;
    padding: 32px;
}

.task-order-item-hold {
    display: flex;
}

.task-item-data h3 {
    color: var(--gray-900) !important;
    margin: 0px;
}

.task-drag-img {
    margin-right: 12px;
    padding-top: 6px;
}

.task-item-data p {
    color: var(--gray-700);
}

.prototype-task-followup-questions .formbox p.body-text.body-text-2.medium-font {
    margin-top: 8px;
}

.task-order-modal p.body-text.body-text-2 {
    color: var(--gray-700);
}

.prototype-text-heading {
    display: flex;
    justify-content: space-between;
}

.protolink-head-left {
    padding-right: 10px;
}

.protolink-head-left p {
    margin-top: 8px;
}

.protolink-head-right.purple-color a {
    font-size: 12px;
    line-height: 17px;
    text-decoration-line: underline;
    color: #9759cb;
}

.purple-color {
    color: #9759cb !important;
}

.protolink-head-right.purple-color a:hover {
    color: #5c208d;
}

.create-new-test-modal .card-placeholder-img svg {
    height: 120px;
}

.figma_prototype_sidebar_body {
    padding: 0px 40px;
    width: 100%;
    text-align: left;
    min-height: calc(100vh - 100px);
    display: flex;
    align-items: center;
}

.figma-prototype-sidebar-body-inner>p {
    margin: 24px 0;
}

.figma-prototype-sidebar-body-inner {
    width: 100%;
}

.figma_prototype_sidebar:after {
    position: fixed;
    content: "";
    background: var(--gray-900) 5c;
    width: calc(100% - 503px);
    height: 100%;
    left: 503px;
    z-index: -1;
    bottom: 0;
}

.questions-sidebar.figma_prototype_sidebar:after {
    content: none;
}

.prototype-task-description .body-text.body-text-2.medium-font.mb-32 {
    margin-bottom: 20px;
}

.prototype-task-define-flow .formbox {
    margin-bottom: 0;
}

.create-prototype-test .cardsorting-wrap-mid-data {
    /*   padding: 20px 32px 25px; */
    padding: 24px;
}

.optional {
    color: var(--gray-700);
    font-size: 18px;
}

.task-order-modal .added-card-cat-repeat-sub-items {
    align-items: self-start;
}

.order-actions-row button {
    margin: 0px 12px;
}

.prototype-criteria-modal-data ul {
    padding: 10px 0px 10px 15px;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-700);
}

.prototype-criteria-modal-data ul li span {
    color: var(--gray-900);
}

.define_flow_container.arabic-wrapper .define-start-design-box {
    text-align: right !important;
    direction: rtl !important;
}

.define_flow_container.arabic-wrapper .define-design-box-head img,
.define_flow_container.arabic-wrapper .btn-with-icon img,
.define_flow_container.arabic-wrapper .btn-with-icon svg {
    margin-left: 8px;
    margin-right: 0px;
}

.define_flow_container.arabic-wrapper .define-design-arrow {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
}

.define_flow_container.arabic-wrapper .figma-define-row-wrap .body-text,
.define_flow_container.arabic-wrapper .figma-define-row-wrap button {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

/******** Prototype Test Css ************/

.figma_prototype_sidebar.prototypesidebar {
    padding: 30px 35px;
    text-align: left;
    min-height: calc(100dvh);
    height: -webkit-fill-available;
}

.figma_prototype_sidebar.prototypesidebar h3 {
    margin-bottom: 20px;
}

.prototypesidebar .figma_prototype_sidebar_body button {
    margin-top: 10px;
}

.prototypesidebar .minimie-screen-icon {
    cursor: pointer;
}

.prototypesidebar .minimie-screen-icon svg,
.prototype-take-test-top-hdr .minimie-screen-icon svg {
    width: 24px;
    height: 24px;
}

/*.prototypesidebar .minimie-screen-icon .hover-inline-svg svg path{
      stroke:var(--gray-900) !important;
  }*/

.figma_prototype_sidebar.questions-sidebar {
    width: calc(100% - 200px);
    height: 100vh;
    right: 0;
    padding-left: 160px;
    text-align: left;
    padding-right: 160px;
}

.figma_prototype_sidebar_body {
    width: 100%;
}

.figma_prototype_sidebar.questions-sidebar .figma_prototype_sidebar_body {
    padding: 0px;
}

.figma_prototype_sidebar.questions-sidebar .taking-test-page-wrap {
    padding-bottom: 40px;
    width: 100%;
}

.figma_prototype_sidebar.questions-sidebar .taking-test-page-wrap .medium-box-wrapper {
    margin: 0px;
    max-width: 650px;
}

div#buttons {
    position: relative;
}

.figma_prototype_sidebar_body .taking-test-page-height {
    padding: 15px 0px;
}

.figma_prototype_sidebar_body p {
    color: var(--gray-700);
}

.tester-welcome-page-wrap .prototype-test-wrap .taking-test-page-height {
    display: flex;
    align-items: flex-start;
    padding-top: 64px;
    min-height: calc(100vh - 200px);
}

.taking-test-page-wrap .medium-box-wrapper,
.taking-test-page-wrap .ranking-scale-taking-test-view {
    max-width: 650px;
    margin: 0 auto;
}

.figma_prototype_sidebar_body .taking-test-page-wrap .medium-box-wrapper,
.figma_prototype_sidebar_body .taking-test-page-wrap .ranking-scale-taking-test-view {
    max-width: inherit;
    /*    margin: 0 auto;*/
}

.done-with-task-modal-body p {
    color: var(--gray-700);
}

.done-with-task-modal.buttons {
    text-align: center;
    margin-bottom: 0px;
}

.done-with-task-modal .buttons button {
    margin-top: 32px;
    margin-bottom: 20px;
}

.done-with-task-modal {
    margin-bottom: 10px;
}

.done-with-task-modal-body .exit-button {
    margin: 0 auto;
    justify-content: center;
    display: table !important;
    padding: 14px 20px;
    font-weight: 500;
    cursor: pointer;
}

.prototype-test-wrap .full-page-loader {
    display: flex;
    min-height: 100vh;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.arabic_wrapper .prototypesidebar {
    right: 0;
    text-align: right;
}

.arabic_wrapper .figma_prototype_sidebar:after {
    right: 503px;
    left: auto;
}

.exit-button img {
    margin-right: 10px;
}

.prototype-result-overview-wrap {
    padding: 40px 32px;
}

.prototype-overview-inner-data {
    background: #ffffff;
    border: 1px solid var(--gray-400);
    border-radius: var(--l);
    padding: var(--2XL);
    min-height: 100%;
}

.prototype-result-overview-wrap .col-lg-3.col-md-6 {
    padding: 0px 10px;
}

.prototype-result-overview-wrap .row {
    margin: 0px -10px;
}

.prototype-result-overview-wrap .data-percent {
    align-items: center;
    width: 100%;
    margin-top: var(--m);
    margin-bottom: var(--s);
}

.green-text {
    color: #378b10;
}

.red-text {
    color: #ff0000;
}

.gray-color-500 {
    color: var(--gray-500);
}

.light-dark-text {
    color: var(--gray-700);
}

.secondary-purple-200 {
    color: var(--secondary-purple-200);
}

.skip-rate img,
.skip-rate svg {
    opacity: 0.8;
}

.data-percent img,
.data-percent svg {
    margin-right: var(--m);
}

.pb-40 {
    padding-bottom: 40px;
}

.pb-20 {
    padding-bottom: 20px;
}

.prototype-commont-path-repeat {
    border: 1px solid var(--gray-400);
    border-radius: 20px;
    padding: 20px 0px;
    margin: 20px 0;
    overflow: hidden;
}

.proto-common-path-row .common-path-content {
    width: 209px;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 12px;
}

.proto-common-path-row {
    margin: 0px -6px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: unset;
    overflow-x: auto;
    position: relative;
    padding: 20px 20px 5px 20px;
    scroll-behavior: smooth;
}

.proto-common-path-row::-webkit-scrollbar-track,
.accountnaviagtion-outer.result-navigation-outer::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
    border-radius: 10px;
    background-color: unset;
}

.proto-common-path-row::-webkit-scrollbar,
.accountnaviagtion-outer.result-navigation-outer::-webkit-scrollbar {
    width: 5px;
    background-color: unset;
}

.proto-common-path-row::-webkit-scrollbar,
.accountnaviagtion-outer.result-navigation-outer::-webkit-scrollbar {
    height: 4px;
}

.proto-common-path-row::-webkit-scrollbar-thumb,
.accountnaviagtion-outer.result-navigation-outer::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: none;
    background-color: unset;
}

.accountnaviagtion-outer.result-navigation-outer::-webkit-scrollbar {
    height: 0px !important;
}

.proto-common-path-row .common-path-repeat {
    padding: 0px 6px;
}

.proto-common-path-img-preview {
    width: 100%;
    height: 120px;
    left: 0px;
    top: 0px;
    background: var(--gray-400);
    text-align: center;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.proto-common-path-img-preview img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
    width: 100%;
    object-position: top;
}

.path-preview-not-available img {
    display: block;
    margin: 0 auto 7px;
}

.path-preview-not-available span {
    display: block;
    width: 100%;
    text-align: center;
}

.behavior-main-slider-content .path-preview-not-available {
    background: #f0f0f0;
    height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
}

.common-path-content-footer .caption {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    margin-bottom: 7px;
}

.data-time {
    align-items: center;
}

.data-time img {
    margin-right: 4px;
}

.data-time .caption {
    margin-bottom: 0px;
}

.is_selected_screen .common-path-content {
    background: #bff0a8;
    border: 1px solid #378b10;
}

.common-path-info-data-repeat {
    padding-right: 35px;
}

.common-path-info-data-repeat img,
.common-path-info-data-repeat svg {
    margin-right: 8px;
}

.prototype-behavior-content {
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 32px;
}

.behavior-top-left-content .radio-btn-wrap .checkmark {
    position: relative;
}

.behavior-top-left-content .radio-btn-wrap {
    padding-right: 32px;
    padding-left: 0px;
}

.behavior-top-left-content .radio-btn-wrap .body-text-2 {
    color: var(--gray-700);
    margin-left: 12px;
    margin-left: var(--s);
}

.behavior-top-left-content .radio-btn-wrap input:checked~.checkmark~p span {
    color: #000;
}

.behavior-top-left-content .radio-btn-wrap input:checked~.checkmark~p span .gray-700-svg path {
    stroke: #000 !important;
}

.radio-tab-icon svg {
    margin-right: var(--xs);
}

.behavior-main-slider-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 40px 0px 32px;
}

.prototype-map-slider-wrap {
    max-width: 100%;
    max-height: 600px;
    overflow-y: auto;
    overflow-x: auto;
    margin: 0 auto;
}

.prototype-map-slider-wrap img {
    max-width: inherit;
    min-height: 70px;
}

.slider-time-bottom {
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0 auto;
}

.slide-count-info {
    margin-right: 32px;
    display: flex;
    align-items: center;
}

.slide-count-info img {
    margin-right: 8px;
}

.slide-count-info span {
    color: var(--gray-900);
    margin-left: 5px;
}

.arabic-wrapper .figma-define-row-wrap {
    flex-direction: row-reverse;
    justify-content: flex-end;
}

.arabic-wrapper.set-goal-modal-wrap .btn {
    text-align: right !important;
    direction: rtl !important;
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.arabic-wrapper.set-goal-modal-wrap .btn-with-icon img {
    margin-right: 0;
    margin-left: 8px;
}

.create-prototype-test .arabic_wrapper .questioninputbox .input-field input:focus~label,
.create-prototype-test .arabic_wrapper .questioninputbox .input-field textarea:focus~label,
.create-prototype-test .arabic_wrapper .questioninputbox .input-field.focused label,
.create-prototype-test .arabic_wrapper .questioninputbox .control-label {
    right: 15px;
    left: auto;
}

.create-prototype-test .arabic_wrapper .questioninputbox .ans-close-row {
    margin-left: 0;
    margin-right: 10px;
}

.create-prototype-test .arabic_wrapper .questioninputbox .ans-icon {
    margin-right: 0;
    margin-left: 10px;
}

.create-prototype-test .arabic_wrapper .questioninputbox .dropdown-container.input-field input:focus~label,
.create-prototype-test .arabic_wrapper .questioninputbox .dropdown-container.input-field textarea:focus~label,
.create-prototype-test .arabic_wrapper .questioninputbox .dropdown-container.input-field.focused label,
.create-prototype-test .arabic_wrapper .questioninputbox .dropdown-container .control-label {
    left: 15px;
    right: auto;
}

.prototypesidebar .figma_prototype_sidebar_body .free-flow-task-flow>button:nth-child(2) {
    margin-top: 35px;
}

.arabic_wrapper_main .cardsorting-wrap-mid-data.prototype-task-description .form-group .captionÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€¦Ã‚Â¡ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â {
    text-align: right;
}

.prototype-task-define-flow .error.red-text {
    display: block;
    font-size: 12px;
    margin-top: 3px;
}

.prototype-task-define-flow.goal_screen_error span.error.red-text {
    display: block;
    font-size: 12px;
    font-weight: 500;
    line-height: 17px;
    margin-top: 6px;
}

.sync-confirmation-modal .radio-btn-label {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-700);
}

.sync-confirmation-modal .formbox.mt-20 {
    margin-bottom: 32px !important;
}

.sync-confirmation-modal .formbox.mt-20 .checkbox-wrap {
    margin-bottom: 0px;
}

.sync-confirmation-modal .subtitle-2,
.unsync-confirmation-modal .subtitle-2 {
    color: var(--gray-900);
}

.prototype-test-task-btns-list .react-loading-skeleton {
    width: 150px !important;
    height: 42px !important;
}

.prototype-test-task-btns-list button.btn.primary-medium.btn-with-icon.btn-with-icon-left.no-hover-state {
    width: 150px !important;
    justify-content: center;
    position: relative;
    top: 2px;
}

.prototype-test-task-figma-filename span:nth-child(2) .react-loading-skeleton {
    width: 200px !important;
}

.embed_documentation_footer--documentationFooterLeft--wXQbu {
    display: none !important;
}

.summary-left.prototype-summary-left .body-text-3 {
    margin-top: 20px;
    color: var(--gray-700);
}

.proto-type-summery-info-top .body-text-2 {
    margin: 8px 0px;
}

.proto-type-summery-info-top {
    margin-bottom: 22px;
}

.proto-type-summery-repeat {
    margin-bottom: 22px;
}

.proto-type-summery-repeat:last-child {
    margin-bottom: 0px;
}

.prototype-summery-test-questions {
    margin-top: 22px;
}

.prototype-question-heading {
    margin-bottom: 24px;
    display: block;
}

.allow-tester-label {
    margin-bottom: 20px;
    margin-top: 24px;
}

.device-selection-radio.d-flex {
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0px -12px;
}

.device-test-icon-wrap {
    display: flex;
    align-items: center;
}

.tooltip-deviceinfo {
    margin-right: 8px;
    position: relative;
    z-index: 1;
}

.tooltip-deviceinfo:hover .tooltip-wrapper {
    display: block;
    width: 288px;
    color: var(--gray-50);
    white-space: normal;
    bottom: 27px;
    right: -131px;
}

.tooltip-deviceinfo:hover .tooltip-wrapper a {
    color: #9759cb;
}

.device-desktop-view.hide-for-mobile {
    min-height: calc(100vh - 147px);
    display: flex;
    align-items: center;
    padding: 20px 28px;
    text-align: center;
    justify-content: center;
}

.device-desktop-view.hide-for-mobile .cardsorting-mobile-text img {
    display: table;
    width: 114px;
    height: 114px;
    margin: 0 auto 18px;
}

.device-desktop-view.hide-for-mobile .cardsorting-mobile-text span {
    margin-bottom: 32px;
    display: block;
}

.tooltip-deviceinfo .tooltip-wrapper p {
    color: var(--gray-50);
}

.prototype-task-followup-questions .input-field label {
    z-index: 0;
}

.prototype-task-followup-questions .input-field.focused label {
    z-index: 1;
}

.test-setting-read-mode .test-setting-label,
.test-setting-read-mode .language-selection-radio,
.test-setting-read-mode .test-setting-label,
.test-setting-read-mode .test-setting-hint,
.test-setting-read-mode .form-group .caption {
    opacity: 0.3;
}

.test-setting-read-mode .select-create-dropdown {
    opacity: 0.3;
    pointer-events: none;
}

.behavior-top-right-content .form-group,
.behavior-top-right-content .searchdropdown-box {
    max-width: 300px;
    min-width: 300px;
    margin-left: 0px;
}

.prototype-behavior-screen-size-content {
    margin-right: var(--s);
}

.behavior-top-right-content .searchdropdown-box-container {
    width: 100%;
}

.prototype-followup-section .heading.h4 {
    padding: 0 0 32px 32px;
}

.protolink-head-left {
    padding-right: 10px;
    width: calc(100% - 244px);
}

.no-hover-state,
.no-hover-state:hover {
    background-color: var(--gray-900) !important;
    border-color: var(--gray-900) !important;
}

.prefer-bg-colorpiker .form-group {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 100% !important;
}

.prefer-bg-colorpiker .form-group input {
    position: absolute;
    top: 0;
    height: 30px;
    cursor: pointer;
}

.taking-test-page-height>.full:empty {
    display: none !important;
}

.figma-screens .test-environment-header {
    display: none !important;
}

.figma-screens .test-environment-header,
.figma-screens .taking-test-header {
    display: none;
}

.figma_prototype_sidebar.questions-sidebar:after {
    position: fixed;
    content: "";
    background: var(--gray-900) 5c;
    width: 100%;
    height: 100%;
    left: auto;
    z-index: -1;
    bottom: 0;
    right: calc(100% - 200px);
}

.proto-type-take-test-btn {
    justify-content: space-between;
    margin: 20px -10px 0px;
}

.proto-type-take-test-btn button {
    left: auto !important;
    margin: 0px 12px;
    position: static !important;
}

.prototype-take-test-top-hdr {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 100%;
    margin: 24px 0px;
}

.prototype-take-test-top-hdr .exit-test-button {
    margin-right: 100px;
}

.prototype-take-test-top-hdr .minimie-screen-icon {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.arabic_wrapper .figma_prototype_sidebar_body {
    text-align: right !important;
    direction: rtl !important;
}

.arabic_wrapper .figma_prototype_footer .caption {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.arabic_wrapper .prototype-take-test-top-hdr .exit-test-button {
    margin-left: 100px;
    margin-right: 0px;
}

.arabic_wrapper .exit-test-button img,
.arabic_wrapper .exit-test-button svg {
    margin-right: 0;
    margin-left: 8px;
}

.arabic_wrapper .prototype-take-test-top-hdr .minimie-screen-icon {
    right: auto;
    left: 25px;
}

.prototype-task-define-flow .skeleton-icon-wrapper {
    margin-right: 8px;
    position: relative;
    top: -2px;
}

.prototype-task-define-flow .skeleton-icon-wrapper.ar-icon-wrapper {
    margin-left: 8px;
    margin-right: 0px;
}

.behavior-main-slider-content.dropdown-header-arrow-buttons a {
    display: none !important;
}

.mt-60 {
    margin-top: 60px;
}

.disabled-arrow .dropdown-header-chevron {
    opacity: 0.2;
    cursor: not-allowed;
}

.maintenance-wrap .row {
    flex-direction: row-reverse;
}

.login-data-wrap.flex-wrap.already-taken-testlogin-wrap.maintenance-wrap {
    min-height: calc(100vh - 185px);
    padding-bottom: 40px;
}

.question-result-data .prototype-followup-section .h4.heading.h4.bold-font {
    padding: 0px;
}

.date-picker-field.inactive-field .MuiInputBase-input {
    padding-left: 16px !important;
}

.date-picker-field .MuiInputBase-input {
    padding-left: 16px !important;
    font-family: "Inter";
}

.prototype-question-dropdown .dropdown-question-item p {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.behavior-top-right-content.d-flex button {
    margin-left: var(--s);
}

.task-prototype-test-sync-left .react-loading-skeleton {
    height: 116px !important;
    border-radius: 0px !important;
}

.mobile-preview-device .task-prototype-test-sync-left .react-loading-skeleton {
    height: 232px !important;
    border-radius: 0px !important;
    position: relative;
    top: -5px !important;
}

.mobile-preview-define-flow .skeleton-height .react-loading-skeleton {
    height: 232px !important;
    border-radius: 0px !important;
}

.subquestion-chart-inner h4 {
    padding: 0px !important;
}

.two-row-legends-box .pie-chart-box {
    align-items: center;
}

.heatmap-clickmap-canvas-wrapper {
    max-height: 600px;
    overflow-y: auto;
}

.new-feature-modal .modal-header-top {
    justify-content: end;
    margin-bottom: 0px;
}

.new-feature-icon-row img {
    width: 230px !important;
    height: 230px !important;
}

.new-feature-icon-row {
    text-align: center;
    margin-top: -40px;
}

.new-feature-title-row {
    text-align: center;
    margin-top: -40px;
}

.new-feature-body-row {
    background: var(--gray-900);
    border: 1px solid var(--gray-900);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    flex-direction: row-reverse;
    margin: 20px 0;
}

.new-feature-body-right p {
    line-height: 25px;
    color: #f0f0f0;
}

.new-feature-body-right p a {
    color: #9759cb;
    display: table;
    text-decoration: underline;
}

.new-feature-body-right {
    width: calc(100% - 253px);
    padding-right: 15px;
}

.new-feature-body-left {
    width: 253px;
}

.new-feature-body-right .subtitle-2 {
    color: #ffffff;
    margin-bottom: 14px;
    display: block;
}

.new-feature-btn-row {
    text-align: center;
}

.designs-preview-modal .modal-dialog-centered {
    max-width: 95%;
}

.cardsorting-wrap-mid-data.prototype-task-define-flow span.subtitle-2.medium-font {
    margin-bottom: 2px;
    display: block;
}

.figma_prototype_design_screen .first-click-image {
    height: calc(100vh - 61px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.figma_prototype_design_screen .first-click-image img {
    max-height: 100%;
}

.confirm-click-modal .modal-inner-text .h2 {
    font-size: 28px;
    line-height: 34px;
}

.confirm-click-modal .modal-header-top {
    margin-bottom: 24px;
}

.confirm-click-modal-buttons .exit-button {
    display: table !important;
    margin: 0 auto;
    font-weight: 500;
    font-size: 18px;
    line-height: 30px;
    cursor: pointer;
}

.confirm-click-modal-buttons .exit-button .cursor-pointer {
    display: flex;
    align-items: center;
}

.confirm-click-modal-buttons .buttons button {
    margin-top: 32px;
    margin-bottom: 46px;
}

.preference-test-followup-questions.mt-40.first-click-followup-questions {
    padding: 20px 50px 90px;
    max-width: 1600px;
    margin: 0 auto 40px;
    align-items: center;
    position: relative;
    min-height: calc(100vh - 200px);
}

.preference-test-followup-questions.mt-40.first-click-followup-questions .taking-test-button-wrap {
    position: static !important;
}

.preference-test-followup-questions.mt-40.first-click-followup-questions .taking-test-button-wrap .primary-large {
    position: absolute;
    bottom: 0;
}

.first-click-followup-questions .medium-box-wrapper {
    width: 100%;
    padding-left: 0px;
    max-width: 100%;
}

.first-click-followup-questions .preference-test-designs-repeat {
    padding: 0px;
}

.first-click-followup-questions .taking-test-page-wrap {
    padding-bottom: 0px;
}

.first-click-followup-questions .added-design-img-thm {
    margin: 0px !important;
}

.first-click-followup-questions .taking-test-page-height {
    min-height: unset;
    align-items: center;
    padding: 20px 0px;
}

.first-click-followup-questions .free-take-test-wrap.medium-box-wrapper {
    max-width: 692px;
}

.first-click-followup-questions .test-design-name-and-option-wrap {
    margin-bottom: 15px;
    margin-top: -4px;
}

.first-click-followup-questions .test-design-name-and-option-wrap .design-max-screen-icon svg {
    width: 18px !important;
    width: 18px !important;
}

.maintenance-wrap .subtitle-2 a {
    font-size: 20px;
    line-height: 33px;
}

.arabic_wrapper .first-click-followup-questions {
    text-align: left !important;
    direction: ltr !important;
}

.arabic_wrapper .first-click-followup-questions .single-choice-take-test.medium-box-wrapper {
    text-align: right !important;
    direction: rtl !important;
}

.arabic_wrapper .first-click-followup-questions .taking-test-progressbar {
    text-align: right !important;
    direction: rtl !important;
}

.arabic_wrapper .first-click-followup-questions .take-test-heading-wrap h2 {
    text-align: right;
}

.first-click-design-screen .figma_prototype_footer .caption {
    width: 100%;
    text-align: center;
    max-width: 100%;
}

.first-click-followup-questions .taking-test-button-wrap.optional-button .primary-large {
    left: auto;
}

.first-click-followup-questions .taking-test-button-wrap.optional-button .secondary-large {
    position: absolute;
    right: 62px;
    left: auto;
    bottom: 0;
}

.first-click-followup-questions .design-max-screen-icon {
    right: 0px;
}

.first-click-followup-questions .test-design-name-and-option-wrap p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 90%;
    text-align: left;
}

.first-click-followup-questions .selected-design {
    padding-right: 40px;
}

.form-group.textarea-form-group.input-field.mb-0.arabic_wrapper .caption {
    text-align: right;
    width: 100%;
}

.arabic_wrapper_main .form-group .caption,
.arabic_wrapper .form-group .caption {
    text-align: right;
}

.arabic_wrapper .add-other-survey {
    direction: inherit;
    text-align: right;
    width: 100%;
    justify-content: flex-end;
    flex-direction: row-reverse;
}

.first-click-design-screen .figma_prototype_footer {
    height: 61px;
}

.first-click-design-screen .figma_prototype_footer button {
    position: absolute;
}

.arabic_wrapper .sidebar-header .exit-test-button img,
.arabic_wrapper .sidebar-header .exit-test-button svg {
    margin-right: 8px;
}

.arabic_wrapper .tester-welcome-page-wrap .btn-with-icon img,
.arabic_wrapper .tester-welcome-page-wrap .btn-with-icon svg {
    margin-right: 8px;
    margin-left: 0px !important;
}

.arabic_wrapper .tester-welcome-page-wrap .figma_prototype_footer button img,
.arabic_wrapper .tester-welcome-page-wrap .figma_prototype_footer button svg {
    margin-right: 0px !important;
    margin-left: 8px !important;
}

.arabic_wrapper .first-click-followup-questions button img,
.arabic_wrapper .first-click-followup-questions button svg,
.arabic_wrapper .taking-test-button-wrap button img,
.arabic_wrapper .taking-test-button-wrap button svg {
    margin-left: 0px !important;
}

.arabic_wrapper.first-click-design-screen .figma_prototype_footer button,
.tester-login-page-wrapper.arabic_wrapper.figma-screens.first-click-design-screen.fixed-cards-sec.fixed-tree-sec {
    text-align: right !important;
    direction: rtl !important;
}

.likert-scale-aggregated-data table td .likert-agg-tbl-box h4 {
    padding: 0px !important;
}

.create-test-data-wrapper .prefer-text-designs-wrap .upload-image-hold {
    padding: 0px 10px 32px;
}

.create-test-data-wrapper .prefer-text-designs-wrap .add-more-design-opton {
    margin-top: 28px;
}

.first-click-design-screen .figma_prototype_design_screen_container {
    min-height: 100vh;
}

.fit-to-screen img,
.fit-to-screen canvas {
    max-height: 600px !important;
}

.fit-to-screen .prototype-map-slider-wrap img {
    max-height: 600px !important;
}

.test-list-repeat-wrap .tag-wrap {
    display: inline-flex;
    align-items: center;
    margin: var(--m) -4px;
}

.test-list-repeat-wrap .tag-wrap.d-flex .react-loading-skeleton {
    margin: 0px 6px;
}

.tree-path-view-table {
    position: relative;
}

.prototype-behavior-screen-size-content .form-group {
    max-width: 180px;
    min-width: 180px;
}

.heatmap-clickmap-data-none .prototype-map-slider-wrap {
    overflow-x: hidden;
}

.tree-chart-tooltip-top-header {
    white-space: break-spaces !important;
}

.chart-tooltip-left-tree .d-flex.justify-content-between p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 190px;
}

.enable-edit-category-input input,
.enable-edit-category-input input:focus {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    color: var(--gray-900);
    outline: none;
    border: 0 !important;
    background: unset;
}

.nda-modal-list-items ul {
    padding: 0 0px 0 20px;
    list-style: none;
}

.nda-modal-list-items ul li p {
    line-height: 25px;
    color: var(--gray-900) !important;
    margin: 20px 0;
}

.nda-modal-list-items li p a {
    color: #9759cb;
}

.nda-modal-text p {
    color: var(--gray-900) !important;
}

.nda-modal-text .form-group {
    max-width: 100%;
    margin-top: 18px;
}

.nda-modal-text .form-group .caption {
    display: none;
}

.nda-modal-list-items ul li {
    position: relative;
}

.nda-modal-list-items ul li:before {
    position: relative;
    content: "";
    width: 8px;
    height: 8px;
    background: var(--gray-900);
    display: inline-block;
    position: absolute;
    left: -20px;
    border-radius: 100%;
    top: 8px;
}

.nda-target-info span {
    display: block;
    width: calc(100% - 34px);
    color: var(--gray-700);
}

.nda-target-info {
    background: var(--gray-200);
    border: 1px solid var(--gray-400);
    border-radius: 5px;
    margin-top: 20px;
    display: flex;
    align-items: center;
    padding: 10px 13px;
    justify-content: space-between;
}

.arabic_wrapper.modal-body .heading {
    font-weight: 700;
}

.arabic_wrapper.modal-body .nda-modal-list-items ul li:before {
    right: -20px;
    left: auto;
}

.arabic_wrapper.modal-body .nda-modal-list-items ul {
    padding: 0 20px 0 0px;
    list-style: none;
}

.questioninputbox .draggable-element-start .ans-close-row,
.questioninputbox .draggable-element-start .draginput-crossicon-outer {
    position: relative;
    top: -15px;
    display: none !important;
}

.questioninputbox .draggable-element-start .ans-icon,
.questioninputbox .draggable-element-start .draginputbox {
    position: relative;
    top: 15px;
    display: none !important;
}

.draggable-element-start .caption {
    display: none !important;
}

.draggable-element-start .ranking-count {
    position: relative;
    top: 12px;
    display: none !important;
}

.arabic_wrapper .questioninputbox .draggable-element-start .ans-close-row,
.arabic_wrapper .questioninputbox .draggable-element-start .draginput-crossicon-outer {
    position: relative;
    top: 15px;
    display: none !important;
}

.arabic_wrapper .questioninputbox .draggable-element-start .ans-icon,
.arabic_wrapper .questioninputbox .draggable-element-start .draginputbox {
    position: relative;
    top: -15px;
    display: none !important;
}

.arabic_wrapper .rank-dragable-list-wrap .draggable-element-start .ranking-count {
    position: relative;
    top: -12px;
    display: none !important;
}

.arabic_wrapper .first-click-followup-questions .ranking-scale-taking-test-view {
    text-align: right !important;
    direction: rtl !important;
}

.faq-support-link {
    text-decoration: underline;
    color: #9759cb !important;
}

.faq-support-link:hover {
    text-decoration: underline;
    color: #5c208d !important;
}

.dropdown-container.form-group {
    z-index: 2;
}

.arabic_wrapper.modal-body .nda-target-info .caption {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.cairo-font {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.report-tester-instruction .report-tester-instruction-modal-data-wrap p {
    color: var(--gray-700);
    line-height: 25px;
}

.report-tester-instruction .report-tester-instruction-modal-data-wrap p ol {
    padding: 0px 0px 0px 15px;
}

.report-tester-instruction .confirm-buttons-wrap {
    display: inline-flex;
    margin-top: 0px;
}

.report-tester-instruction .confirm-buttons-wrap button {
    width: auto;
}

.report-tester-instruction-modal-data-wrap ul {
    padding-left: 23px;
    margin: 0px;
}

.report-tester-instruction .modal-dialog {
    max-width: 656px;
}

.report-tester-instruction .guide-report-link .link-text {
    font-size: 14px;
    line-height: 25px;
}

.report-tester-instruction-checkbox {
    color: var(--gray-700);
    margin-top: 20px;
}

.tester-disbled-account-notice {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 20px;
    text-align: center;
    padding: 10px;
    padding: 40px 25px;
    margin-bottom: 32px;
}

.tester-disbled-account-notice span.inline-svg-large {
    justify-content: center;
    margin-bottom: 12px;
}

.tester-disbled-account-notice span.inline-svg-large svg {
    width: 40px;
    height: 40px;
}

.tester-disbled-account-body {
    max-width: 960px;
    margin: 0 auto;
    padding: 0px 15px;
}

.tester-disbled-account-notice .icon-large {
    width: 80px;
    height: 80px;
}

.tester-disbled-account-notice h2 {
    margin: 0px 0 20px;
    color: #ff0000;
}

.tester-disbled-account-notice .subtitle-1 {
    color: #ff0000;
    display: block;
    margin-bottom: 12px;
}

.score-link-header {
    margin-right: 52px;
    position: relative;
    min-height: 64px;
}

.score-link-header::after {
    position: absolute;
    content: "";
    width: 210%;
    height: 100%;
    background: #fff;
    bottom: -50px;
    opacity: 0;
    left: -40px;
}

.taking-test-header button.ghost-btn.ghost-small.btn-with-icon.btn-with-icon-right {
    margin-left: 8px;
}

.score-link-header:hover .tooltip-wrapper {
    display: block;
    top: 79px;
    margin: 0px;
    right: -121px;
    z-index: 222;
}

.score-link-header .tooltip-wrapper a {
    color: #9759cb !important;
    text-decoration: underline;
    display: inline-block;
    margin: 0px;
    padding: 0;
}

.score-link-header .tooltip-wrapper a:hover {
    color: #5c208d !important;
}

.score-link-header svg {
    margin-right: 11px;
}

.score-link-header.green-star {
    color: #bff0a8;
}

.score-link-header.red-star {
    color: #ff0000;
}

.score-link-header.red-star svg path {
    stroke: #ff0000;
}

.score-link-header.yellow-star {
    color: #ffb800;
}

.score-link-header.yellow-star svg path {
    stroke: #ffb800;
}

.score-link-header.purple-star {
    color: #9759cb;
}

.score-link-header.purple-star svg path {
    stroke: #9759cb;
}

.score-link-header.white-star {
    color: var(--gray-50);
}

.score-link-header.white-star svg path {
    stroke: var(--gray-50);
}

.page-heading-wrap.accounts-page--heading {
    display: flex;
    align-items: center;
}

.accounts-score-chip {
    margin-left: 20px;
}

.scorechip {
    display: flex;
    align-items: center;
    padding: 17px 16px;
    background: #f2f2f2;
    border-radius: 10px;
    color: var(--gray-50);
    justify-content: center;
}

.scorechip h4 {
    margin-left: 18px;
    color: var(--gray-50);
}

.scorechip.green-chip {
    background-image: url(../img/score-rating-1.png);
    background-size: cover;
}

.scorechip.green-chip h4 {
    color: #bff0a8;
}

.scorechip.red-chip {
    background-image: url(../img/score-rating-2.png);
    background-size: cover;
}

.scorechip.red-chip h4 {
    color: #ffd3d3;
}

.scorechip.yellow-chip {
    background-image: url(../img/score-rating-3.png);
    background-size: cover;
}

.scorechip.yellow-chip h4 {
    color: #ffe8c6;
}

.scorechip.purple-chip {
    background-image: url(../img/score-rating-4.png);
    background-size: cover;
}

.scorechip.purple-chip h4 {
    color: #efdcff;
}

button.secondary-btn.secondary-large.btn-disabled.btn-with-icon.btn-with-icon-left.blocked-paypal-button img {
    opacity: 1 !important;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

.tester-disbled-account-notice p {
    color: var(--gray-700);
    font-weight: 500;
}

.dashboard-data-wrapper.tester-dashboard .toast-message-wrap {
    margin-bottom: 32px;
}

.read-only-field-phone .PhoneInput {
    border: 1px solid var(--gray-500) !important;
    color: var(--gray-500) !important;
    pointer-events: none;
}

.read-only-field-phone .PhoneInputInput {
    opacity: 0.2;
}

.read-only-field-phone label {
    color: var(--gray-500) !important;
}

.read-only-field-date-picker {
    pointer-events: none;
}

.read-only-field-date-picker fieldset {
    border: 1px solid var(--gray-500) !important;
    color: var(--gray-500) !important;
}

.read-only-field-date-picker .css-mjjjrh {
    color: var(--gray-500) !important;
}

.read-only-field-date-picker .MuiInputBase-input {
    color: var(--gray-500) !important;
}

.read-only-field-date-picker .css-1nvf7g0 {
    opacity: 0.2;
}

.account-blocked-message {
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    display: flex;
    padding: 20px;
    margin-bottom: 38px;
    align-items: center;
}

.account-blocked-message>div img {
    width: 45px;
    height: 45px;
    margin-right: 25px;
}

.account-blocked-message span {
    color: #ff0000;
    display: block;
    margin-bottom: 8px;
}

.account-blocked-message p {
    color: var(--gray-700);
    font-weight: 500;
}

.account-blocked-message>div:nth-child(2) {
    width: calc(100% - 45px);
}

.blocked-profile .checkbox-wrap input:checked~.checkmark {
    background-color: var(--gray-500);
    border-color: var(--gray-500);
}

.blocked-profile .radio-btn-wrap .checkmark:after {
    background-color: var(--gray-500);
}

.blocked-profile .radio-btn-label,
.blocked-profile .css-qc6sy-singleValue,
.blocked-profile .css-1s2u09g-control input {
    color: var(--gray-500) !important;
}

.blocked-profile .radio-btn-wrap input:checked~.checkmark {
    border-color: var(--gray-500);
}

.blocked-profile .dropdown-container .css-1s2u09g-control:focus,
.blocked-profile .dropdown-container .css-1s2u09g-control:hover,
.blocked-profile .dropdown-container .css-1pahdxg-control:hover,
.blocked-profile .dropdown-container .css-1pahdxg-control:focus,
.blocked-profile .dropdown-container.focused .css-1s2u09g-control,
.blocked-profile .dropdown-container.focused .css-1pahdxg-control {
    border: 1px solid var(--gray-500) !important;
}

.blocked-profile .input-field input:focus~span,
.blocked-profile .focused span,
.blocked-profile .focused .input-right-icon {
    /*opacity: 0.5 !important;*/
}

.blocked-profile .css-1s2u09g-control {
    pointer-events: none !important;
}

.blocked-profile .dropdown-chips .chip {
    border-color: var(--gray-900);
    color: var(--gray-900);
    background: var(--gray-500) !important;
}

.blocked-profile .chip-selected {
    border-color: var(--gray-900);
    background: var(--gray-500) !important;
    cursor: not-allowed;
}

.blocked-profile .chip:hover {
    background: #f0f0f0;
    cursor: not-allowed;
}

.blocked-profile .d-flex-radiobtn label,
.blocked-profile label.checkbox-wrap.checkbox-label {
    cursor: not-allowed;
}

.blocked-profile .dropdown-container.focused .css-1c0arv4-placeholder {
    color: var(--gray-500) !important;
}

.blocked-profile .input-field input:focus~label,
.blocked-profile .input-field textarea:focus~label,
.blocked-profile .input-field.focused label {
    color: var(--gray-500) !important;
}

.first-click-design-screen .five-second-full-view-wrap {
    position: static !important;
}

.first-click-design-screen .first-click-image {
    overflow-y: auto;
    min-height: calc(100vh - 61px);
    height: auto;
}

.first-click-design-screen .figma_prototype_design_screen_container {
    filter: unset !important;
}

.first-click-design-screen .figma_prototype_design_screen_container.prototype-overlay-class {
    filter: blur(25px) !important;
    -webkit-filter: blur(25px) !important;
    position: relative;
    z-index: -1;
}

.first-click-design-screen .first-click-image img {
    max-height: unset;
}

.first-click-design-screen footer.footer {
    display: none !important;
}

.first-click-design-screen .profile-complete-progress-wrap.notify-info.d-flex.justify-content-center {
    display: none !important;
}

.first-click-design-screen .tester-test-intro {
    padding: 0px !important;
}

.no-tests-rating-information {
    display: flex;
    align-items: center;
    /* border-top: 1px solid #E3E3E3;
      border-bottom: 1px solid #E3E3E3; */
    padding: 34px 0;
    margin: 0 auto;
}

.no-tests-rating-information .rating-info-right {
    width: 60%;
    padding-left: 40px;
}

.no-tests-rating-information .rating-info-left {
    display: flex;
    width: 40%;
    justify-content: end;
    border-right: 1px solid #e3e3e3;
    padding-right: 40px;
    padding-top: 14px;
    padding-bottom: 14px;
}

.no-tests-rating-information .rating-info-left .notests-tester-score {
    min-height: auto;
    margin: 0;
}

.no-tests-rating-information .score-star-icon {
    display: flex;
    align-items: center;
}

.no-tests-rating-information .score-star-icon span>.notests-tester-score {
    display: inline-block;
    margin-right: 12px;
}

.no-tests-rating-information .score-link-header.green-star {
    color: #378b10;
}

.no-tests-rating-information .score-link-header.green-star svg path {
    stroke: #378b10;
}

.no-tests-rating-information .score-link-header svg {
    margin-right: 21px;
    width: 40px;
    height: 40px;
    position: relative;
    top: -1px;
}

.gray-text,
.gray-color,
.grey-color {
    color: var(--gray-700);
}

.report-testers-modal .modal-dialog {
    max-width: 1300px;
    width: 100%;
}

.report-tester-search-modal-data-wrap {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.report-tester-search-modal-data-wrap .form-group {
    width: 400px;
}

.report-testers-modal .table tbody tr:hover {
    background: unset;
}

.report-testers-modal .table th,
.report-testers-modal .table td {
    padding: 9px 15px;
    vertical-align: middle;
}

.report-testers-modal .table td {
    padding-bottom: 23px !important;
}

.report-tester-participant tbody {
    display: block;
    padding-bottom: 100px;
    /* min-height: 48vh;
      max-height: 48vh; */
    /* overflow: auto; */
}

.report-tester-participant.max-height-table.responsive-table-scroll {
    max-height: 48vh;
    min-height: 48vh;
    margin: 0px 0px 32px;
}

.small-link {
    font-size: 14px;
}

.report-tester-participant.max-height-table table thead {
    z-index: 2;
}

.report-tester-participant thead,
.report-tester-participant tbody tr {
    display: table;
    table-layout: fixed;
    width: 100%;
}

.report-tester-participant thead {
    position: relative;
}

.report-tester-participant table th:last-child,
.report-tester-participant table td:last-child {
    width: 420px;
}

.report-tester-participant table th:nth-child(2),
.report-tester-participant table td:nth-child(2) {
    width: 140px;
}

.report-tester-participant table th:nth-child(1),
.report-tester-participant table td:nth-child(1) {
    width: 170px;
}

.report-tester-participant table th:nth-child(3),
.report-tester-participant table td:nth-child(3) {
    width: 365px;
}

.report-tester-participant table .form-group {
    max-width: 100%;
}

.report-tester-participant .dropdown-container.form-group.input-field.mb-0.field-error {
    position: relative;
    top: -3px;
    z-index: unset;
}

.report-tester-participant .field-error .caption {
    position: absolute;
    margin: 0;
    bottom: -21px;
}

.report-tester-participant table td:last-child .form-group {
    position: relative;
}

.report-testers-modal .confirm-buttons.d-flex {
    width: 100%;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    bottom: 0px;
    background: var(--gray-50);
    z-index: 1;
    padding: 2px 0px;
}

.clear-selection-btn-wrap {
    cursor: pointer;
}

.report-testers-modal .confirm-buttons-wrap {
    margin: 0px -10px 0px;
}

.clear-selection-btn-wrap.disabled {
    opacity: 0.2;
    cursor: not-allowed;
}

.clear-selection-btn-wrap img {
    margin-right: 6px;
}

.multiselectgroup-dropdown .css-11unzgr>div,
.multiselectgroup-dropdown .css-4ljt47-MenuList>div,
.css-26l3qy-menu>div>div {
    display: block !important;
}

/*.multiselectgroup-dropdown .css-11unzgr, .multiselectgroup-dropdown .css-kx9uo6, .multiselectgroup-dropdown .css-9m4ugm{
   max-height: unset !important;
  }*/
.multiselectgroup-dropdown .css-11unzgr>div:hover,
.multiselectgroup-dropdown .css-4ljt47-MenuList>div:hover,
.css-26l3qy-menu>div:hover {
    background: var(--gray-50) !important;
}

.multiselectgroup-dropdown .css-11unzgr>div {
    padding: 0px 5px !important;
}

.multiselectgroup-dropdown .option-label-heading {
    font-weight: 600;
    font-size: 16px;
    line-height: 33px;
    color: var(--gray-900);
    text-transform: capitalize;
}

.multiselectgroup-dropdown .group-checkbox-label {
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-900);
}

.multiselectgroup-dropdown .css-9gakcf-option,
.multiselectgroup-dropdown .css-yt9ioa-option,
.multiselectgroup-dropdown .css-1n7v3ny-option {
    padding: 14px 12px;
}

.multiselectgroup-dropdown .checkbox-wrap {
    display: flex;
    position: relative;
    padding-left: 0;
    margin-bottom: 0px;
    margin-right: 6px;
}

.multiselectgroup-dropdown .checkbox-wrap .checkmark {
    position: relative !important;
    top: -1px;
    left: 0;
}

.multiselectgroup-dropdown .css-1hwfws3,
.multiselectgroup-dropdown .css-g1d714-ValueContainer {
    padding-left: 22px;
    padding-top: 0px;
}

.multiselectgroup-dropdown .css-1pahdxg-control,
.multiselectgroup-dropdown .css-1pahdxg-control:focus,
.multiselectgroup-dropdown .css-1s2u09g-control {
    min-height: 55px !important;
    height: auto !important;
}

.multiselectgroup-dropdown .css-1hwfws3 {
    flex-wrap: unset !important;
}

.multiselectgroup-dropdown .css-26l3qy-menu {
    z-index: 5 !important;
    margin: 0px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.multiselectgroup-dropdown .css-11unzgr {
    max-height: 170px !important;
}

.multiselectgroup-dropdown .css-18ng2q5-group {
    display: none;
}

.report-tester-participant .radio-btn-label {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    display: flex;
    align-items: center;
    color: var(--gray-700);
}

.report-tester-participant {
    margin: 0px -15px;
}

.time-spent-data-wrap {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    align-items: center;
    color: var(--gray-700);
    margin-left: 3px;
}

.pt-5 {
    padding-top: 5px !important;
}

.submitted_date img {
    margin-right: 10px;
}

.submitted_date {
    color: var(--gray-700);
    align-items: center;
}

.reported-description-data {
    display: block;
    margin: 20px 0px;
}

.report-tester-submitted-participant {
    margin: 0px -15px;
    overflow-x: auto;
}

.report-tester-submitted-participant table {
    min-width: 768px;
}

.report-tester-submitted-participant table td {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: var(--gray-900);
}

.violation-list {
    padding-left: 15px;
    margin: 0;
}

.violation-list li {
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    color: var(--gray-900);
}

.pending,
.Declined,
.Pending,
.Approved {
    background: #ffe8c6;
    border: 1px solid #ffb800;
    border-radius: 5px;
    text-align: center;
    display: inline-block;
    padding: 3px 12px;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-900);
}

.Approved {
    background: #bff0a8;
    border: 1px solid #378b10;
}

.Declined {
    background: #ffd3d3;
    border: 1px solid #ff0000;
}

.report-tester-submitted-participant table tbody tr {
    border-bottom: 1px solid var(--gray-400);
}

.report-tester-submitted-participant .table th,
.report-tester-submitted-participant .table td {
    padding: 23px 15px;
    vertical-align: top;
}

.report-tester-submitted-participant table thead th {
    padding-top: 2px !important;
    padding-bottom: 0px !important;
}

.participant-id-data-wrap img {
    margin-right: 10px;
}

.participant-id-data-wrap {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
}

.five-second-follw-up-questions .logic-dropdown-readmode .dropdown-container.form-group {
    z-index: unset;
}

.survey-add-question-wrapper .sqa-check-top {
    position: relative;
    z-index: 2;
}

.report-tester-submitted-participant .table td:last-child {
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    padding-top: 32px;
}

.accounts-score-chip {
    display: flex;
    align-items: center;
}

.accounts-score-chip .account-guidelines-link {
    margin-left: 12px;
}

.participant-data-checkbox label {
    margin: 0;
}

.tester-guidelines-wrap .section-1 h1 {
    text-align: center;
    margin-bottom: 54px;
}

.tester-guidelines-wrap .section-1 {
    margin-bottom: 60px;
}

.tester-guidelines-wrap .section-1 p {
    color: var(--gray-900);
}

.tester-guidelines-wrap {
    max-width: 1124px;
    margin: 0 auto;
}

.tester-guidelines-wrap .section-2 h1 {
    text-align: center;
}

.tester-guidelines-wrap .section-2-intro {
    display: flex;
    margin: 60px 0 40px;
    flex-wrap: wrap;
    align-items: center;
}

.tester-guidelines-wrap .section-2-intro p {
    width: 50%;
    padding-right: 22px;
    font-weight: 500;
    line-height: 25px;
    color: var(--gray-700);
}

.tester-guidelines-wrap p {
    color: var(--gray-700);
    font-weight: 500;
}

.tester-guidelines-wrap .section-2-intro svg {
    width: 50%;
    height: 221px;
}

.review-process .subtitle-1 {
    color: #9759cb;
    display: block;
    margin-bottom: 20px;
}

.review-process p {
    margin: 0px 0px 10px;
    color: var(--gray-700);
    font-weight: 500;
}

.review-process-instructions ul {
    padding: 20px 0px 20px 30px;
    margin: 0px;
}

.access-to-tests-body {
    background: #fcfcfc;
    border-radius: 20px;
    padding: 25px 35px;
    margin: 20px 0 40px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.access-to-tests-body p {
    width: 539px;
}

.access-to-tests-body svg {
    width: calc(100% - 539px);
    padding-left: 70px;
}

.text-success {
    color: #378b10 !important;
}

.disabled.dropdown-item {
    opacity: 0.2;
}

.report-tester-confirmation-modal .tester-selected-data {
    color: #ff6db1;
    display: block;
    margin-bottom: 20px;
}

.report-tester-confirmation-modal .tester-selected-message {
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    display: flex;
    align-items: center;
    color: var(--gray-700);
}

.access-to-tests {
    margin: 40px 0 0px;
}

.access-to-tests .subtitle-1,
.profile-review .subtitle-1 {
    color: #9759cb;
    display: block;
    margin-bottom: 20px;
}

.profile-review {
    margin-bottom: 60px;
}

.section-3 h1 {
    text-align: center;
}

.section-3-intro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 60px 0px 40px;
}

.sec3-intro-left span {
    display: block;
    margin-bottom: 20px;
}

.sec3-intro-left {
    max-width: 568px;
    padding-right: 30px;
}

.payouts-instructions ul {
    padding: 20px 0px 32px 25px;
    margin: 0;
}

.orange-gradient-box {
    background-image: url(../img/referal-gradient-1.png);
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 20px;
    padding: 40px;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-weight: 500;
    font-size: 24px;
    line-height: 40px;
    text-align: center;
    margin: 60px 0 40px;
}

.guidelines-support-text {
    text-align: center;
}

.tester-guidelines-wrap {
    padding: 0px 0px 20px;
}

.report-tester-participant .row-checked .radio-btn-label,
.row-checked .time-spent-data-wrap {
    color: var(--gray-900);
}

.time-spent svg {
    width: 21px;
    height: 21px;
    margin-right: 3px;
}

.time-spent .hover-inline-svg svg path,
.time-spent .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-700) !important;
}

.row-checked .time-spent .hover-inline-svg svg path,
.row-checked .time-spent .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-900) !important;
}

.hamburger-menu .active.dropdown-item {
    color: var(--gray-900) !important;
}

.report-tester-participant .input-right-icon {
    z-index: 1;
}

.add-overlay-background {
    background: rgba(0, 0, 0, 0.6);
}

.review-process p:nth-child(3) {
    margin-top: 20px;
    margin-bottom: 5px;
}

.review-process-instructions p {
    margin-bottom: 5px;
}

.report-testers-modal .confirm-buttons-wrap .secondary-large {
    min-width: 152px;
}

.report-testers-modal .confirm-buttons-wrap .btn.primary-large {
    min-width: 244px;
}

ol.download-xlsx-report-data-wrap {
    padding-left: 28px !important;
}

.blocked-reason-div {
    background: #ffd3d3;
    border: 1px solid #ff0000;
    border-radius: 10px;
    margin: 20px 0;
    padding: 24px;
}

.blocked-reason-div .body-text-2 {
    font-weight: 600;
    line-height: 33px;
    color: #a60000;
    margin-bottom: 7px;
}

.blocked-reason-div .body-text-3 {
    line-height: 25px;
    text-align: center;
    color: var(--gray-900);
    margin-top: 5px;
}

.blocked-reason-div .chips-wrap .chip {
    cursor: default;
    background: #f0f0f0 !important;
}

.shared-link-overview-participants-box {
    margin: 20px 0px 40px;
}

.shared-link-overview-participants button.btn.primary-large {
    margin-bottom: 10px !important;
}

.shared-link-overview-participants button.btn.primary-large {
    margin: 0 auto;
    display: block;
}

/*** prototype preview css****/
/*.figma_prototype_sidebar.prototypesidebar{
      display: none;
  }
  .figma_prototype_design_screen {
      width: 400px;
      margin: 0 auto;
      padding: 10px; 
  }*/

.sign-up-btn-wrap.sign-up-single-btn {
    justify-content: start;
    max-width: 460px;
}

.sign-up-btn-wrap.sign-up-single-btn .tester-signin-step1 {
    max-width: 460px;
    margin-top: 20px;
}

.reported-description-data-reviewed {
    margin: 1px 0px;
}

.welcome_tester_userq_modal .modal-body {
    padding: 20px !important;
    overflow: hidden !important;
}

.welcome_tester_userq_modal .congrats-modal-text {
    margin-top: 0;
    padding: 20px 0px 12px;
}

.welcome_tester_userq_modal .congrats-modal-text h3 {
    margin-bottom: 16px;
}

.welcome_tester_userq_modal .congrats-modal-text p {
    padding: 0px;
    margin-bottom: 16px;
}

.welcome_tester_userq_modal .congrts-modal-wrap {
    margin-top: 32px;
}

.welcome_tester_userq_modal .congrats-modal-text p a {
    font-weight: 500;
}

.welcome_tester_userq_modal .modal-dialog {
    max-width: 586px !important;
}

.welcome_tester_userq_modal .congrts-modal-wrap.is_tester_score_btn button {
    min-width: auto !important;
}

.welcome_tester_userq_modal .congrats-modal-header {
    border-radius: 20px;
    height: 168px;
}

.welcome-userq-text {
    margin-top: 12px;
}

.welcome_tester_userq_modal .welcome-userq-text {
    /*min-height:127px;*/
}

.welcome-userq-text p {
    margin: 0 !important;
    padding: 0px !important;
}

.congrts-modal-wrap.is_welcome_btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.congrts-modal-wrap.is_welcome_btn button {
    min-width: auto !important;
}

.next-pre-btn.d-flex {
    margin-left: 90px;
}

.next-pre-btn.d-flex svg {
    width: 7px;
    height: 7px;
    margin: 0px 5px;
}

.storybook-default .added-card-cat-repeat {
    width: 100%;
    background: #efdcff;
    border: 1px solid #9759cb;
    /* border: 1px solid; */
    border-radius: 10px;
    padding: 12px 16px;
    margin: 10px 0px 10px;
    display: flex;
    align-items: center;
    min-height: 50px;
}

.toast-info {
    background: #efdcff;
    color: var(--gray-900);
}

.info-message-wrapper .toast-left-icon svg {
    width: 24px;
    height: 24px;
}

.taking-test-page-height.blocked-tester-taking-test-screen {
    min-height: calc(100vh - 190px);
}

.report-tester-participant .read-only-field .input-right-icon {
    display: none;
}

.report-tester-participant .read-only-field input:focus~label,
.report-tester-participant .read-only-field textarea:focus~label,
.report-tester-participant .read-only-field.focused label {
    top: 16px;
    background: var(--gray-50);
    padding: unset;
    z-index: 1;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    left: 15px;
}

.report-tester-participant .form-group p.caption {
    position: absolute;
}

.profile-menu-btn {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100px;
    min-width: 30px;
    display: inline-block;
    text-align: left;
}

.header .profile-menu-btn {
    font-size: 16px;
    line-height: 25px;
}

.read-only-field-phone,
.read-only-field-date-picker,
.blocked-profile .input-position-relative.dropdown-field.singleselect-dropdown {
    cursor: not-allowed;
}

.blocked-profile div#date_of_birth,
.blocked-profile .country-dropdown {
    cursor: not-allowed;
}

.tester-disbled-account-notice .icon-large {
    margin-bottom: 20px;
}

.blocked-profile .country-dropdown:hover .input-icon {
    opacity: 0.6 !important;
}

.blocked-profile .dropdown-field.country-dropdown .input-icon .hover-inline-svg:hover svg path,
.blocked-profile .dropdown-field.country-dropdown .input-icon .hover-inline-svg:hover .change-stroke {
    stroke: var(--gray-600) !important;
}

.blocked-profile .singleselect-dropdown:hover .dropdown-label,
.blocked-profile .dropdown-container .css-1s2u09g-control,
.blocked-profile .css-1c0arv4-placeholder {
    color: var(--gray-500) !important;
    border-color: var(--gray-500) !important;
}

.date-picker-field.active-field.read-only-field-date-picker label {
    cursor: text !important;
}

.account-blocked-message p a {
    display: inline-block;
    margin-left: 3px;
}

.r-guide-se-1 h1 {
    border-bottom: 1px solid #e3e3e3;
    padding-bottom: 45px;
    margin-bottom: 45px;
}

.guide-flag-wrap {
    background: #fcfcfc;
    border: 1px solid #e9e9e9;
    border-radius: 10px;
    display: flex;
    padding: 20px;
    align-items: center;
}

.guide-flag-data {
    width: calc(100% - 90px);
    margin-left: 20px;
}

.researcher-guide-line-wrap .semi-bold-font {
    font-weight: 600;
}

.fixed-toast-wrapper {
    position: fixed;
    bottom: 70px;
    right: 33px;
    width: calc(100% - 315px);
    z-index: 55;
}

.fixed-toast-wrapper .link-text {
    color: #9759cb;
    margin-left: 0px;
}

.fixed-toast-wrapper .link-text:hover {
    color: #5c208d;
}

.path-preview-not-available-inner img {
    width: 40px;
    height: 40px;
    margin-bottom: 12px;
}

.quality-guide-top-hd {
    margin: 0px 0px 4px 0px;
}

.quality-guide-top-hd svg {
    margin-right: 10px;
}

.guide-criteria-text-repeat .color-black {
    margin-bottom: 4px;
}

.toast-logic {
    background: var(--success-green-200);
}

.caption.updated-logic-caption {
    color: #9759cb !important;
}

em.tests-counter {
    font-style: normal;
    font-size: 14px;
    display: inline-block;
    margin-left: var(--s);
    font-weight: 600;
    position: relative;
    font-family: "Inter", sans-serif;
    min-width: 0px;
}

.search-no-data-found {
    display: flex;
    min-height: 35vh;
    align-items: center;
    justify-content: center;
    padding: 30px 10px 0;
    position: relative;
    top: 30px;
}

.search-no-data-inner img {
    display: table;
    margin: 0 auto;
    width: 60px;
    height: 60px;
    margin-bottom: 12px;
}

.search-no-data-inner {
    text-align: center;
}

.search-no-data-inner span {
    color: #000000 !important;
    display: block;
    margin-bottom: 4px;
}

.search-no-data-inner p {
    margin-bottom: 12px;
    color: #676767;
    font-weight: 500;
}

.no-page-data-wrap.popup-blocked-wrap .subtitle-2 {
    font-weight: 500;
    line-height: 26px;
    color: #000000;
    margin: 8px 0 12px;
    display: block;
}

.no-page-data-wrap.popup-blocked-wrap p.body-text.body-text-2.semi-bold-font {
    color: #676767;
    margin-bottom: 32px;
    font-weight: 500;
}

.no-page-data-wrap.popup-blocked-wrap p.body-text.body-text-2.semi-bold-font b {
    color: #000;
    font-weight: 600;
}

.no-page-data-wrap.popup-blocked-wrap .icon-large {
    width: 40px;
    height: 40px;
}

.report-guide-section-2 p b {
    font-weight: 500;
    color: unset !important;
}

/*th.unknown-participant-tableheader span:hover .tooltip-wrapper {
      display: block;
      cursor: pointer;
      margin: 0px 0px 0px 9px;
      top: 34px;
  
  }
  th.unknown-participant-tableheader .tooltip-wrapper:before{
      content: '';
      position: absolute;
      display: block;
      width: 0px;
      left: 50%;
      top: 6px;
      border: 11px solid transparent;
      border-top: 0;
      border-bottom: 12px solid var(--gray-900);
      transform: translate(-50%, calc(-100% - 5px));
  }*/
.box-medium.single-choice-pie-chart {
    width: auto;
    display: inline-block;
}

.box-medium.single-choice-pie-chart .chart-info-repeat {
    min-width: 120px;
}

.box-medium.single-choice-pie-chart .chart-info-repeat p {
    width: calc(100% - 20px);
}

.box-medium.single-choice-pie-chart .chart-info-repeat p .body-text {
    width: 100%;
}

.bd-question-bottom-pagination-arrow.prev-next-button-bottom {
    padding: 0 20px 40px;
}

.pref-test-btns-wrap.preview-modal-nav-arrows {
    position: sticky;
    top: 50%;
    z-index: 22;
}

.buy-credits-price-wrap-class {
    margin-top: 0px;
}

.buy-credits-price-wrap-class h2 {
    margin-top: 0px;
}

.buy-credits-price-wrap-class span {
    margin-left: 7px;
    margin-right: 0;
}

.form-group .password-validition-ul {
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin: 6px 0 0 0;
    position: relative;
    left: 3px;
}

.form-group.input-field div .password-validition-ul li {
    padding: 0px 15px;
    font-size: 12px;
    line-height: 17px;
    display: flex;
    align-items: center;
    font-weight: 500;
    color: #676767;
    margin-top: 2px;
    position: relative;
}

.form-group.input-field div .password-validition-ul li:after {
    position: absolute;
    content: "";
    background-image: url(../img/close.svg);
    width: 16px;
    height: 16px;
    left: -5px;
    background-repeat: no-repeat;
    background-size: 16px;
    top: 0px;
}

.red-color-txt {
    color: var(--danger-red-200) !important;
}

.form-group.input-field div .password-validition-ul li.red-color-txt:after {
    background-image: url(../img/cross-red-border.svg);
}

.form-group.input-field div .password-validition-ul li.green-color-txt:after {
    background-image: url(../img/green-check-border.svg);
}

.publish-modal-wrap .modal-dialog {
    max-width: 556px;
}

.preference-design-error .upload-image-inner-wrapper {
    border-color: #ff0000;
}

.img-upload-design-error {
    font-size: 12px;
    margin-top: 6px;
    font-weight: 500;
    line-height: 17px;
    color: #ff0000 !important;
}

.guide-link-container {
    border-radius: 10px;
    border: 1px solid var(--light-dark-400, #e9e9e9);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    margin: 32px 0px;
    text-decoration: none !important;
}

.guide-link-container p {
    width: calc(100% - 24px);
    color: #000000;
}

.external-link-icon {
    margin-left: 10px;
    width: 24px;
    display: flex;
    align-items: center;
    height: 24px;
    cursor: pointer;
}

.external-link-icon a {
    display: flex;
}

.guide-link-container:hover {
    border-color: #000000;
}

.guide-link-container:hover .external-link-icon svg path {
    stroke: #000000;
}

.guide-link-container.clicked-guideline {
    border-color: #000;
    background: #000;
}

.guide-link-container.clicked-guideline p {
    color: #fff;
}

.guide-link-container.clicked-guideline .external-link-icon svg path {
    stroke: #fff;
}

.order-summary-publishing-fees {
    text-align: right;
    white-space: nowrap;
}

.order-summary-publishing-fees .pink-text {
    color: #ff6db1;
    display: inline-block;
    margin-right: 6px;
    font-weight: 500;
}

.order-summary-publishing-fees strong {
    font-weight: 500;
    color: #000;
}

.strike-text {
    text-decoration: line-through;
}

.ordersummary-table-wrap table strong {
    font-weight: 500;
}

tr.order-credits-required-row td,
tr.order-total-row td {
    padding-top: 16px;
}

tr.order-total-row td {
    padding-top: 24px;
    padding-bottom: 8px;
}

tr.order-credits-required-row td strong,
tr.order-total-row td strong {
    font-weight: 600 !important;
}

tr.order-promocode-row td:last-child {
    color: #378b10 !important;
}

.statementbox .form-group.input-field label.control-label.body-text-2,
.survey-question-holder .form-group.input-field label.control-label.body-text-2 {
    font-weight: 400 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 30px);
    display: inline-block;
}

.test-publish-fee-header-left .tag.pink-tag.tag-icon-left {
    margin-left: 20px;
    display: inline-flex;
    align-items: center;
    margin-top: 5px;
}

/* .test-publish-fee-header-left span.tag.pink-tag.tag-icon-left img,
  .test-publish-fee-header-left span.tag.pink-tag.tag-icon-left svg, 
  .test-publish-fee-header-left .tag.purple-tag.tag-icon-left img,
  .test-publish-fee-header-left .tag.purple-tag.tag-icon-left svg
  {
      margin-right: 3px;
  } */

.test-publish-fee-header-left p {
    color: #676767;
    margin: 0px 12px 0px 16px;
    position: relative;
    top: 0px;
}

.test-publish-fee-header-left .tag.purple-tag.tag-icon-left {
    color: #5c208d;
    display: inline-flex;
    align-items: center;
    margin-left: 0px;
}

.nda-modal-text a {
    text-decoration: underline;
    color: #9759cb;
}

.nda-modal-text a:hover {
    color: #5c208d;
    text-decoration: underline;
}

.remember-text.grey-border-top {
    padding: 24px 0px;
    border-top: 1px solid #e3e3e3;
    color: var(--gray-700);
}

.create-test-data-wrapper .three-column-layout-left .stepper-wrap {
    z-index: 2;
}

.input-password-storybook .form-group {
    max-width: 460px;
}

.nda-agreement-modal .modal-header-top {
    margin-bottom: 20px;
}

.heading.h1.semi-bold-font.h3 {
    font-weight: unset;
}

.text-decoration-underline {
    text-decoration: underline;
}

.newsingle-question .checkbox-wrap {
    pointer-events: none;
}

.newsingle-question .radio-btn-wrap {
    pointer-events: none;
}

.prototype-questions-error .error.red-text {
    font-size: 12px;
    font-weight: 500;
    line-height: 17px;
    display: block;
    margin-bottom: 32px;
}

.tree-test-section-wrap .error.red-text,
.tree-test-task-wrap .error.red-text {
    margin-top: 6px;
    display: block;
    font-size: 12px;
    line-height: 17px;
    font-weight: 500;
}

.goal_screen_error .goal-screen-design-box {
    border-color: #ff0000;
}

.byuser-table thead tr .bd-thcol-2 {
    /* width: 55%; */
    padding-right: 25px;
}

.byuser-table thead tr th:last-child {
    width: 50px;
}

.byuser-table thead tr th:first-child,
.byuser-table tbody tr td:first-child {
    max-width: 160px;
    min-width: 120px;
}

.byuser-table thead tr th:nth-child(4) {
    min-width: 120px;
    max-width: 130px;
}

.ranking-table-holder {
    overflow-x: auto;
}

.ranking-table-holder td .d-flex.table-answer-column-outer span.table-answer-column {
    width: calc(100% - 20px);
}

.heading {
    font-weight: unset !important;
}

.animation-tree-wrapper {
    overflow: hidden;
    transition: height 200ms;
}

.tester-login-page-wrapper.tester-test-preview.figma-screens.first-click-design-screen {
    padding-bottom: 100px;
}

.nda-modal-text .score-info {
    display: flex;
    align-items: center;
    color: #378b10;
    margin-bottom: 20px;
}

.nda-modal-text .score-info p {
    color: #378b10 !important;
    margin: 0px 6px;
    font-family: "Inter", sans-serif !important;
}

.nda-modal-text .score-info svg {
    width: 24px;
    height: 24px;
}

.nda-modal-text .score-info svg path {
    stroke: #378b10 !important;
}

.arabic_wrapper.modal-body .score-info.green-star {
    text-align: right !important;
    direction: ltr !important;
    justify-content: end;
}

.nda-agreement-modal .arabic_wrapper.modal-body .heading {
    font-weight: 700 !important;
}

.screen-question-radio p.toggle_btn_label.toggle-btn-label-right {
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 33px;
    margin-right: 8px;
}

.screen-question-radio .info-wrap {
    top: 1px;
}

.screen-question-radio .toggle-btn-wrap .slider {
    top: 4px;
}

.screen-question-radio label {
    align-items: center;
}

.seceening-info-text p {
    color: var(--gray-700);
}

.screening_options_group .survey-added-question-repeat {
    margin-top: 0px;
    margin-bottom: 20px;
}

.screening_options_group .survey-added-question-repeat .question-optionbox {
    justify-content: space-between;
}

.screening_options_group .logic-dropdown-readmode .css-b62m3t-container {
    width: 257px;
}

.screening_options_group .questioninputbox .dropdown-container.form-group.input-field.mb-0.focused {
    width: 257px;
    min-width: 257px;
    margin-left: 0px;
}

.screening_options_group .css-13cymwt-control {
    background: unset !important;
}

.screening_options_group .question-optionbox {
    margin-top: 12px;
}

.screening_options_group .survey-added-question-repeat:last-child {
    margin-bottom: 0px;
}

.screening_options_group .questioninputbox .bd-que-slide-left {
    justify-content: space-between;
    width: 100%;
}

.screening_options_group .questioninputbox .ans-close-row {
    margin-left: 16px;
}

.seceening-info-text {
    margin-bottom: 32px;
}

span.error.red-text {
    margin-left: 0;
    margin-top: 20px;
    display: block;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
}

.test-summary-participants.test-summary-screening-questions.screening_options_group {
    max-width: 960px;
}

.test-summary-participants.test-summary-screening-questions.screening_options_group .questiondrag {
    visibility: hidden;
}

.test-summary-participants.test-summary-screening-questions.screening_options_group .d-flex.question-topbuttonbox {
    display: none !important;
}

.test-summary-participants.test-summary-screening-questions.screening_options_group .question-optionbox {
    justify-content: space-between;
}

.test-summary-participants.test-summary-screening-questions.screening_options_group .css-1hb7zxy-IndicatorsContainer,
.test-summary-participants.test-summary-screening-questions.screening_options_group .css-tlfecz-indicatorContainer {
    display: none !important;
}

.test-summary-participants.test-summary-screening-questions.screening_options_group .css-1wy0on6 {
    display: none;
}

.test-summary-participants.test-summary-screening-questions.screening_options_group .lightgraybox.questionbox-s.newsingle-question {
    margin: 32px 0 0 0;
}

.screening_options_group .newsingle-question .d-flex.questionbox-top {
    flex-wrap: unset !important;
}

.screening_options_group .db-que-list-wrap.survey-question-drop-down {
    width: 100%;
}

.screening_options_group .bd-que-slide-arrow.add-logic-survey-option.addlogic-singlelogicbox {
    width: auto !important;
}

.screening_options_group .sqa-check-top .cross-q {
    display: block !important;
}

.screening_options_group .survey-added-question-repeat .css-tlfecz-indicatorContainer,
.screening_options_group .survey-added-question-repeat .css-1gtu0rj-indicatorContainer {
    min-width: 257px !important;
    width: 100% !important;
}

.test-summary-participants.test-summary-screening-questions .logic-dropdown-readmode {
    cursor: no-drop;
    pointer-events: none;
    opacity: 0.4;
}

.dropdown-alert-text .css-qc6sy-singleValue,
.dropdown-alert-text .css-1s2u09g-control input {
    color: #ff0000 !important;
}

.screening-questions-body {
    margin: 20px 0 0;
}

.screening-checkbox-body {
    margin: 20px 0 0;
}

.grey-text {
    color: #676767;
}

.screening-checkbox-body p {
    margin-bottom: 20px;
}

.screening-checkbox-body .radio-btn-label {
    font-weight: 500;
    color: #676767;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    margin: 0px !important;
}

.screening-modal-body .tag {
    margin: 0 !important;
}

.screening-modal-body button.btn.primary-large {
    width: 100%;
}

.screening-failed-modal p {
    margin: 32px 0;
}

.screening-questions-modal-wrap .modal-dialog {
    max-width: 617px;
}

.mt-12 {
    margin-top: 12px;
}

.take-test-heading-wrap .subtitle-2 {
    color: #000;
}

.screening-questions-modal-wrap .option-holder label {
    margin-bottom: 20px;
}

.screening-questions-modal-wrap .screening-questions-body .test-form-hold.mt-32 {
    margin-top: 20px;
}

.screening-questions-modal-wrap .modal-header-top .heading {
    padding-right: 30px;
}

.screening_options_group .ans-list-wrap .dropdown-container .css-1wy0on6 {
    position: absolute;
    width: 100%;
    text-align: right;
    height: 100%;
    justify-content: end;
    display: flex;
}

.screening_options_group .ans-list-wrap .dropdown-container .css-1wy0on6 .css-tlfecz-indicatorContainer,
.screening_options_group .css-1gtu0rj-indicatorContainer {
    width: 100%;
    left: 0;
    right: 0;
    text-align: right;
    justify-content: end;
}

.summary-modal-data-repeat.only-screening-summary {
    margin: 0 auto;
}

span.info-icon.info-wrap.position-relative.screening-failed-info-tooltip {
    left: 4px;
    top: -1px;
    z-index: 2;
    cursor: pointer;
    width: 33px;
}

span.info-icon.info-wrap.position-relative.screening-failed-info-tooltip p {
    color: #fff !important;
}

.screening-failed-info-tooltip .bottom-tooltip {
    margin: 0px;
    bottom: 29px;
    left: -141px;
}

.screening-failed-info-tooltip .icon-small {
    width: 22px;
    height: 22px;
}

.arabic_toast {
    text-align: right !important;
    direction: rtl !important;
}

.researcher-contact-section .btn.primary-large {
    margin-top: 32px;
}

.tree-import-modal .modal-dialog {
    max-width: 664px;
}

.modal-ol-list li {
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    color: #676767;
    margin: 2px 0 0px;
}

.modal-ol-list {
    padding: 0 0 0 15px;
}

.tree-import-modal .formbox .radio-btn-label {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    color: #676767;
}

.tree-import-modal .change-image-link {
    text-decoration: none;
}

.tree-import-modal .browse-files-text {
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 30px;
    text-decoration: none;
}

.tree-import-modal .modal-header-top,
.duplicate-test-modal .modal-header-top {
    margin-bottom: 20px !important;
}

.tree-import-modal .formbox {
    margin-bottom: 20px;
}

.duplicate-test-modal .modal-dialog {
    max-width: 645px;
}

.duplicate-test-options p.radio-btn-label.semi-bold-font {
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    color: #000;
}

.duplicate-test-options p.radio-btn-label {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    color: #676767;
}

.duplicate-test-options label.radio-btn-wrap {
    margin: 0px;
}

.screening-questions-modal-wrap .arabic_wrapper .btn-with-icon img,
.screening-questions-modal-wrap .arabic_wrapper .btn-with-icon svg {
    margin-right: 8px;
    margin-left: 0;
}

.screening-questions-modal-wrap .arabic_wrapper .option-holder .radio-btn-wrap .checkmark,
.screening-questions-modal-wrap .arabic_wrapper.option-holder .checkbox-wrap .checkmark {
    position: static;
    margin-right: 0;
    margin-left: 11px;
}

.screening-questions-modal-wrap .arabic_wrapper .modal-header-top .heading {
    padding-right: 0;
}

.duplicate-test-options .box-large.active-box {
    border-color: var(--gray-900);
}

.prototype-test-fullscreen .figma_prototype_design_screen_container.prototype-overlay-class:after {
    position: absolute;
    content: "";
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
}

.prototype-test-fullscreen .figma_prototype_design_screen_container.prototype-overlay-class {
    filter: blur(25px) !important;
    -webkit-filter: blur(25px) !important;
    min-height: 100vh;
    background-color: #000;
}

.recruitment-slider-holder {
    min-height: 45px;
}

.estimate-count-area.inc-dec-holder {
    justify-content: flex-start;
}

.estimate-count-area.inc-dec-holder span {
    margin-left: 18px;
    font-size: 14px;
    line-height: 25px;
}

/****range slider***/
.recruitmentSlider .rc-slider-track {
    background-color: #9759cb !important;
    height: 12px;
}

.recruitmentSlider .rc-slider-step {
    display: none !important;
}

.recruitmentSlider .rc-slider-rail {
    position: absolute;
    width: 100%;
    height: 12px;
    background-color: #e9e9e9;
    border-radius: 20px;
}

.recruitmentSlider .rc-slider-mark {
    left: 4px;
    width: 98.5%;
    font-size: 12px;
}

.recruitmentSlider .rc-slider-mark-text {
    color: #676767 !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 17px;
    margin-top: 8px;
}

.recruitmentSlider .rc-slider-mark-text-active {
    color: #9759cb !important;
}

.recruitmentSlider {
    max-width: 530px;
}

.recruitmentSlider .rc-slider-handle {
    background-color: var(--gray-50) !important;
    border: none !important;
    background-image: none;
    background-size: 10px !important;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50% !important;
    border: 1px solid #e9e9e9 !important;
    box-shadow: 0px 4px 6px rgb(0 0 0 / 8%) !important;
    cursor: pointer !important;
    height: 24px !important;
    width: 24px !important;
    margin-top: 0 !important;
    pointer-events: all;
    top: -3px;
    opacity: 1 !important;
}

input#email:autofill~label {
    top: -9px;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-700);
    background: var(--gray-50);
    padding: 0 8px;
    z-index: 1;
}

input#email:autofill,
input#password:autofill {
    border-color: var(--gray-700) !important;
    color: var(--gray-900) !important;
    font-size: 16px !important;
    line-height: 33px !important;
    font-weight: 400 !important;
}

input:-webkit-autofill::first-line {
    font-size: 16px !important;
    line-height: 33px !important;
}

input#password:autofill~label {
    top: -9px;
    font-weight: 500;
    font-size: 12px;
    line-height: 17px;
    color: var(--gray-700);
    background: var(--gray-50);
    padding: 0 8px;
    z-index: 1;
}

.taking-test-body .grecaptcha-badge {
    display: none !important;
}

.square-tile-wrap {
    width: 230px;
    min-height: 213px;
    border: 1px solid #e9e9e9;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 20px;
    word-wrap: break-word;
    word-break: break-all;
    transition: 0.5s;
    -webkit-transition: 0.5s;
}

.square-icon-wrap span svg {
    width: 40px;
    height: 40px;
}

.square-icon-wrap span {
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.square-icon-wrap {
    text-align: center;
}

.square-time-heading {
    margin: 12px 0px;
    text-align: center;
}

.square-tile-wrap.pink-hover-bg .hover-inline-svg svg path,
.square-tile-wrap.pink-hover-bg .hover-inline-svg svg .change-stroke {
    stroke: #ff6db1;
}

.square-tile-wrap.purple-hover-bg .hover-inline-svg svg path,
.square-tile-wrap.purple-hover-bg .hover-inline-svg svg .change-stroke {
    stroke: #9759cb;
}

.square-tile-wrap.pink-hover-bg:hover {
    background: #ff6db1;
    border-color: #ff6db1;
}

.square-tile-wrap.purple-hover-bg:hover {
    background: #9759cb;
    border-color: #9759cb;
}

.square-tile-wrap:hover .tag {
    background-color: #fff;
    border-color: #fff;
    color: #000;
}

.square-tile-wrap:hover span {
    color: #fff;
}

.square-tile-wrap:hover .hover-inline-svg svg path,
.square-tile-wrap:hover .hover-inline-svg svg .change-stroke {
    stroke: #fff;
}

.square-tile-wrap .hover-inline-svg:hover svg path,
.square-tile-wrap .hover-inline-svg svg:hover .change-stroke {
    stroke: #fff !important;
}

/***ofcanvas css***/

.offcanvas-backdrop.fade {
    opacity: 0;
}

.offcanvas-backdrop.show {
    opacity: 0.5;
}

.offcanvas-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: #000;
}

.fade {
    transition: opacity 0.15s linear;
}

.offcanvas.show {
    transform: none;
}

.offcanvas-end {
    top: 0;
    right: 0;
    width: 400px;
    border-left: 1px solid rgba(0, 0, 0, 0.2);
    transform: translateX(100%);
}

.offcanvas {
    position: fixed;
    bottom: 0;
    z-index: 1045;
    display: flex;
    flex-direction: column;
    max-width: 100%;
    visibility: hidden;
    background-color: #fff;
    background-clip: padding-box;
    outline: 0;
    transition: transform 0.3s ease-in-out;
}

.square-tile-inner {
    position: relative;
    width: 100%;
}

.square-tile-inner .tag {
    margin: 0 auto;
    display: table;
    position: absolute;
    bottom: -20px;
    left: 0;
    right: 0;
    width: -webkit-fit-content;
    display: none;
}

.offcanvas.offcanvas-end {
    max-width: 550px;
    width: 100%;
    padding: 32px 0px 0;
}

/***NPS CSS***/
.emoticon-icon {
    border: 1px solid #e9e9e9;
    border-radius: 10px;
    padding: 16px;
    cursor: pointer;
    margin: 3px 15px;
    height: 72px;
    width: 72px;
    transition: 0.3s;
}

.emoticon-icon:hover {
    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.07);
    border-color: #ccc;
}

.tester-rating-scale-holder.d-flex {
    flex-wrap: wrap;
    margin: 0px -16px;
    justify-content: center;
}

.emoticon-icon.selected-icon {
    border-color: #000;
    background: #f5f5f5;
}

.close-sidebar svg {
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.nps-slide-nav-wrap {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.nps-slide-nav-wrap li {
    margin-bottom: 40px;
}

.nps-slide-nav-wrap li a {
    text-decoration: none;
    color: var(--gray-900);
}

.squaretile-wrapper {
    margin: 0px -12px;
    justify-content: space-between;
}

.squaretile-wrapper .square-tile-wrap {
    margin: 0px 12px;
}

.nps-nav-left svg {
    margin-right: 12px;
}

.nps-link-hold {
    cursor: pointer;
}

.nps-nav-left .hover-inline-svg svg path,
.nps-nav-left .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-900);
}

.nps-slide-nav-wrap li .nps-link-hold:hover {
    color: #9759cb;
}

.nps-slide-nav-wrap li .nps-link-hold:hover .hover-inline-svg svg path,
.nps-slide-nav-wrap li .nps-link-hold:hover .hover-inline-svg svg .change-stroke {
    stroke: #000 !important;
}

.nps-slide-nav-wrap li .nps-link-hold:hover .nps-nav-left .hover-inline-svg svg path,
.nps-slide-nav-wrap li .nps-link-hold:hover .nps-nav-left .hover-inline-svg svg .change-stroke {
    stroke: #9759cb !important;
}

.share-feedback-btn {
    border-radius: 10px;
    border: 1px solid #e9e9e9;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 26px 0 0;
    cursor: pointer;
    transition: 0.5s;
    -webkit-transition: 0.5s;
}

.share-feedback-btn img {
    width: auto;
    margin-left: 10px;
    height: auto;
}

.share-feedback-btn:hover {
    background-color: #2b2b2b;
    border-color: #000;
    color: #fff;
}

.nps-back-btn {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    color: #676767;
    display: inline-flex;
    cursor: pointer;
    position: relative;
    left: -2px;
}

.nps-back-btn:hover {
    color: #000;
}

.nps-back-btn svg {
    width: 16px;
    height: 16px;
    margin-right: 7px;
}

.nps-back-btn:hover .hover-inline-svg svg path,
.nps-back-btn:hover .hover-inline-svg svg .change-stroke {
    stroke: #000 !important;
}

.nps-feedback-btn button {
    width: 100%;
}

.nps-selected-option .rating-scale-icon {
    margin: 0 auto;
    display: table;
}

.nps-selected-option .rating-scale-icon .emoticon-icon {
    margin: 0px;
    border-color: #000;
    background: #f5f5f5;
    cursor: unset;
}

.nps-section .form-group {
    max-width: 100%;
}

.nps-section .chips-wrap {
    text-align: center;
}

.offcanvas-body {
    max-height: calc(100vh - 100px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 32px 32px;
}

.offcanvas-header {
    padding: 0px 32px;
}

.nps-feedback-thanks-info h3 {
    margin-bottom: 14px;
}

.nps-contact-form button {
    width: 100%;
}

.guideline-iframe-wrap iframe {
    width: 100%;
}

.nps-guideline-link .guide-link-container {
    margin: 20px 0px;
}

.nps-modal .modal-dialog {
    max-width: 552px;
}

.nps-modal .modal-body {
    padding: 32px;
}

.nps-modal .nps-feedback-heading {
    display: none;
}

.nps-modal .modal-body .nps-feedback-info-text {
    text-align: center;
}

.nps-modal .modal-body .nps-feedback-info-text .heading {
    font-size: 30px;
    line-height: normal;
}

.nps-modal .modal-body .nps-feedback-info-text .mb-16 {
    margin-bottom: 20px;
}

.tester-welcome-page-wrap .selected-page-left-side .subtitle-2 {
    white-space: pre-wrap;
}

.share-feedback-btn.feedback-shared .emoticon-icon {
    width: auto;
    height: auto;
    padding: 0;
    border: 0;
    margin: 0;
}

.share-feedback-btn.feedback-shared .emoticon-icon img {
    width: 40px;
    border: 2px solid #fff;
    border-radius: 100%;
}

.nps-contact-form .contact-section .form-group {
    margin: 20px 0px;
}

.nps-contact-form .researcher-contact-section .btn.primary-large {
    margin-top: 20px;
}

.nps-selected-option.mb-32 {
    margin-bottom: 20px;
}

.nps-selected-chips.mb-32 {
    margin-bottom: 20px;
}

.nps-modal .nps-textarea .textarea-form-group .form-control {
    min-height: 147px;
}

.nps-feedback-btn.mt-32 {
    margin-top: 20px;
}

.no-demographics-selected p {
    font-weight: 500;
    color: var(--gray-700);
}

.gray-box {
    border-radius: 10px;
    border: 1px solid #e9e9e9;
    background: #fcfcfc;
}

.p-32 {
    padding: 32px;
}

.signofinformational-wrap {
    max-width: 457px;
    border-radius: 20px;
}

.signup-info-content p {
    margin-top: 10px;
}

.signup_info_icon svg {
    width: 40px;
    height: 40px;
}

/***id verification css***/
.sign-identity-top-head {
    margin-bottom: 4px;
}

.sign-identity-top-head img {
    margin-right: 4px;
}

.identity_tile_wrap {
    background-image: url(../img/purple-bg.png);
    padding: 18.5px 20px;
    background-size: cover;
    border-radius: 10px;
    background-color: #f5f5f5;
    max-width: 460px;
}

.sign-up-verified-info {
    max-width: 460px;
}

.p-20 {
    padding: 20px;
}

.signup_user_inforepeat {
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.signup_user_inforepeat:last-child {
    margin-bottom: 0px;
}

.user_info_label {
    margin-right: 8px;
}

.signup_veri_infotop img,
.signup_veri_infotop svg {
    margin-right: 8px;
}

.tester_signup_btns,
.tester-apps-select {
    max-width: 460px;
}

/***Add rating scale css****/
.rating-scale-label {
    padding: 0px 10px;
    width: 33.33%;
}

.rating-scale-labels-container.d-flex {
    margin: 0px -10px;
}

.rating-scale-option-wrap {
    display: flex;
    align-items: center;
}

.question-topbuttonbox .question-readmode-icon {
    display: inline-flex;
    justify-content: center;
    width: auto;
    margin-left: var(--xl);
}

.question-topbuttonbox .question-readmode-icon svg {
    width: 24px;
    height: 24px;
}

.rating-scale-dropdown-wrap .dropdown-container.form-group.input-field.mb-0.focused {
    width: 300px !important;
    z-index: 2;
}

.rating-scale-dropdown-wrap .dropdown-icon img {
    width: 20px !important;
    height: 20px !important;
    margin-right: 4px;
    position: relative;
    top: -2px;
}

.rating-scale-dropdown-wrap .flag-value-container .icon-small {
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.tester-idv-doctype {
    padding: 0px 10px;
}

.tester-doctype-repeat {
    padding: 0px 5px;
}

.tester-doctype-repeat svg {
    width: 40px;
    height: 40px;
}

.tester-doctype-repeat p {
    padding-left: 12px !important;
}

.tester-id-verified-modal-data {
    margin-top: 12px;
}

.addadas {
    cursor: pointer;
}

.toast-info p {
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    color: #000;
}

.toast-info p a,
.toast-info p .link-text {
    color: #9759cb;
    cursor: pointer;
}

.toast-info p .link-text:hover {
    color: #5c208d !important;
}

.tester-user-head {
    margin-bottom: 14px;
}

.tester-user-head .tooltip-hold {
    margin-left: 10px;
    z-index: 2;
}

.tester-user-head .tooltip-hold:hover .tooltip-wrapper {
    display: block;
    left: -140px;
    margin: 0;
    top: 149%;
}

.scale-typebox,
.scale-lnthbox {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 22px;
    font-family: "Inter", sans-serif !important;
    color: #676767;
}

.scale-typebox span,
.scale-lnthbox span {
    font-weight: 600;
    color: #000;
}

.lightgraybox .questiondescription-s.d-flex {
    padding-top: 0px;
}

p.body-text.body-text-3.medium-font.screen-tooltip-info-wrap {
    display: flex;
    align-items: self-start;
}

.tester_verified_profile_box .signup_user_inforepeat p img,
.tester_verified_profile_box .signup_user_inforepeat p svg {
    margin-left: 6px;
}

/***Document not match css***/
.document_not_match_modal .modal-dialog {
    max-width: 768px;
    width: calc(100% - 15px);
}

.document_not_match_modal .modal-header-top {
    justify-content: center;
}

.document_not_match_modal .modal-header-top button {
    display: none;
}

.document_table_data tr td,
.document_table_data tr th {
    padding: 18px 30px;
    border-left: 1px solid #e9e9e9;
}

.info-not-match {
    text-decoration: line-through;
}

.document_table_data tr td:first-child,
.document_table_data tr th:first-child {
    border: 0px;
}

.doc_icon_info {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.document_table_data .table-responsive {
    overflow-x: auto;
}

.document_table_data tbody tr:nth-child(odd) {
    background: #f5f5f5;
}

.document_table_data tbody tr:nth-child(odd) td {
    border-bottom: 1px solid #e9e9e9;
}

.document_table_data tr th p {
    display: flex;
    align-items: center;
}

.document_table_data tr th p img {
    margin-right: 5px;
}

.document_table_data table {
    min-width: 700px;
}

.survey-question-holder .dropdown-container.form-group {
    z-index: 5;
}

.document-match-modal-buttons-wrap {
    justify-content: center;
    margin: 0px -16px;
}

.document-match-modal-buttons-wrap button {
    width: auto;
    margin: 0px 16px;
    padding: 14px 30px !important;
    font-size: 18px !important;
}

.modal-header-top.mb-40 {
    margin-bottom: 40px;
}

/***rating scale take test***/

.rating-scale-take-test {
    max-width: 1038px !important;
}

.test-form-hold.mt-32.rating-options {
    text-align: center;
}

.number-icon,
.star-icon {
    border: 1px solid #e9e9e9;
    border-radius: 10px;
    padding: 16px;
    cursor: pointer;
    margin: 3px 15px;
    height: 57px;
    width: 77px;
    transition: 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    color: #000;
}

.star-icon {
    height: auto;
    border: 0px;
}

.ratingscale-option-wrap {
    display: inline-block;
    margin: 0 auto;
    /* max-width: 910px; */
}

.ratingscale-option-wrap .tester-rating-scale-holder {
    justify-content: space-between;
}

.number-icon:hover {
    border-color: #e9e9e9;
    background-color: #f5f5f5;
}

.number-icon.selected-icon {
    border-color: #000;
}

.rating-scale-labels {
    margin-top: 20px;
}

.scale-label {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    color: #676767;
    width: 33.33%;
    text-align: left;
    font-family: inter !important;
}

.scale-label:nth-child(2) {
    text-align: center;
    padding: 0 14px;
}

.scale-label:nth-child(3) {
    text-align: right;
}

.ratingscale-option-wrap .emoticon-icon,
.ratingscale-option-wrap .star-icon,
.ratingscale-option-wrap .number-icon {
    margin: 3px 14px;
    font-family: inter;
}

.likertscale-subquestion-chart .emoticon-icon,
.byuser-table .emoticon-icon,
.likertscale-subquestion-chart .star-icon,
.byuser-table .star-icon,
.likertscale-subquestion-chart .number-icon,
.byuser-table .number-icon {
    border: 0;
    border-radius: 0;
    padding: 0;
    margin: 0 auto;
    height: auto;
    width: auto;
    display: table;
    box-shadow: none !important;
    margin-bottom: 12px;
    font-size: 24px;
    font-weight: 700;
    color: #676767;
    background-color: unset;
    cursor: default;
}

.likertscale-subquestion-chart .star-icon img {
    margin: 0 2px;
    max-width: unset;
}

.likertscale-subquestion-chart .star-icon {
    display: flex;
    justify-content: center;
}

.byuser-table .emoticon-icon,
.byuser-table .star-icon,
.byuser-table .number-icon {
    margin: 0px;
    cursor: default;
    font-size: 16px;
    font-weight: 500;
    color: #000;
}

.rating_scale_calculation {
    margin: 32px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.rating_scale_calculation_repeat {
    display: flex;
    padding: 16px 20px;
    margin: 5px 0;
    width: 48%;
    justify-content: space-between;
}

.byuser-table .emoticon-icon img,
.byuser-table .star-icon img {
    width: 24px;
}

.byuser-table .star-icon img {
    margin: 0px 2px;
}

.rating_scale_calculation_icon {
    margin-right: 8px;
    position: relative;
}

.rating_scale_calculation-left .tooltip-hold-wrap {
    margin-left: 8px;
}

.tooltip-hold-wrap:hover .tooltip-wrapper {
    margin: 0;
    display: block;
    right: -138px;
    bottom: 100%;
    z-index: 999;
}

.rating_scale_calculation_icon img {
    position: relative;
}

.rating_scale_calculation_icon img:nth-child(2) {
    margin-left: -14px;
}

.rating_scale_calculation_icon img:nth-child(3) {
    margin-left: -11px;
}

.rating_scale_calculation_icon img:nth-child(3) {
    margin-left: -15px;
}

.rating-scale-labels span {
    color: #000;
    margin-right: 8px;
}

.question-tags .rating-scale-labels {
    margin-top: 0;
    margin-right: 32px;
}

.question-tags .rating-scale-labels:last-child {
    margin-right: 0px;
}

.cardsorting-wrap-mid-data .rating-scale-dropdown-wrap .dropdown-container.form-group.input-field.mb-0.focused,
.prototype-task-followup-questions .rating-scale-dropdown-wrap .dropdown-container.form-group.input-field.mb-0.focused {
    width: 220px !important;
}

.five-second-mid-data-wrap .question-edit .create-test-preview-area,
.five-second-mid-data-wrap .survey-add-question-wrapper .create-test-preview-area,
.five-second-mid-data-wrap .survey-question-holder .create-test-preview-area {
    display: none !important;
}

.aggregated-data-table td b,
.aggregated-data-table td strong {
    font-weight: 500;
}

.aggregated-data-table .table-responsive table {
    min-width: 100%;
}

.aggregated-data-table .table-responsive table thead th.unknown-participant-tableheader span .bottom-tooltip::before {
    content: "";
    position: absolute;
    display: block;
    width: 0px;
    right: 6px;
    top: 50%;
    border: 11px solid transparent;
    border-right: 0;
    border-left: 12px solid var(--gray-900);
    transform: translate(calc(100% + 5px), -50%);
    left: auto;
    bottom: auto;
}

.aggregated-data-table .table-responsive table thead th.unknown-participant-tableheader span .tooltip-wrapper {
    right: 141%;
    top: -50px;
    margin: 0;
}

.aggregated-data-table .table-responsive table thead th.unknown-participant-tableheader span:hover .tooltip-wrapper {
    display: flex !important;
    bottom: auto !important;
    left: auto !important;
}

.rating_scale_calculation-right .emoticon-icon,
.rating_scale_calculation-right .star-icon {
    padding: 0;
    height: auto;
    width: auto;
    border: 0;
    background: no-repeat;
    margin: 0px;
    box-shadow: none !important;
    position: relative;
}

.rating_scale_calculation-right .emoticon-icon img,
.rating_scale_calculation-right .star-icon img {
    width: 24px;
    height: 24px;
    margin: 0px 8px 0px 0px;
}

.likert-scale-chart .tooltip-wrapper {
    z-index: 99 !important;
}

.rating-scale-take-test .rating-options {
    text-align: left !important;
    direction: ltr !important;
}

.question-tags.arabic_wrapper .rating-scale-labels {
    margin-right: 0;
    margin-left: 32px;
}

.rating-chart-vip-label h4 {
    top: 0px;
}

.prototype-followup-section h4.heading.h4.bold-font {
    padding: 0px;
}

.question-tags .rating-scale-labels .tag {
    margin-left: 0;
    margin-right: 0;
    line-height: 16px !important;
}

.rating-scale-labels.d-flex.justify-content-between.resule-rating-scale-labels .scale-label {
    width: 33.33%;
}

.rating-scale-labels.d-flex.justify-content-between.resule-rating-scale-labels .scale-label:nth-child(2) {
    padding: 0px 10px;
}

.rating-scale-labels.d-flex.justify-content-between.resule-rating-scale-labels {
    align-items: self-start;
}

.star-icon.grey-star img {
    opacity: 0.5;
    transition: 0.3s;
}

.star-icon.grey-star:hover img {
    opacity: 1;
}

.onfido-sdk-ui-Theme-modalOverlay {
    z-index: 9999 !important;
}

.date-picker-field fieldset legend span {
    display: none;
}

.date-picker-field .css-mjjjrh {
    left: 15px;
    background: #fff;
    padding: 0px 8px;
    font-weight: 500;
    font-family: inherit;
    font-size: 12px !important;
    line-height: 17px;
    transform: none;
    top: -9px;
    color: var(--gray-700);
}

.tester_profole_guide_info p {
    margin-bottom: 8px;
}

.signup_user_left_info {
    width: 50%;
    margin-bottom: 14px;
}

.signup_user_left_info .color-black {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 113px;
}

.sign-up-verified-info {
    padding-bottom: 6px;
}

.signup_user_left_info:nth-child(even) {
    width: auto;
}

.tester_verified_profile_box .signup_user_left_info {
    width: 100%;
}

.tester_verified_profile_box .signup_user_left_info .color-black {
    white-space: unset !important;
    overflow: visible !important;
    text-overflow: unset !important;
    max-width: unset !important;
    display: flex;
    align-items: center;
}

.ml-16 {
    margin-left: 16px;
}

.limit-reached-modal .modal-dialog {
    max-width: 768px;
}

.limit-reached-modal .duplicate-test-modal-action {
    margin: 0px -10px;
}

.limit-reached-modal .duplicate-test-modal-action button {
    margin: 0px 10px;
}

.wallet-unverified-section {
    margin-right: 60px;
}

.result-body .test-header-right-data .secondary-btn {
    font-size: 0px;
    width: 40px !important;
    height: 40px !important;
    border-radius: 100%;
    padding: 0;
    justify-content: center;
    margin-left: var(--xl);
    margin-right: 0px;
    min-height: auto;
    line-height: 0px;
    position: relative;
}

.result-body .test-header-right-data .secondary-btn .tooltip-wrapper {
    width: auto;
    margin: 0;
    top: 53px;
    min-width: 130px;
    white-space: nowrap;
    z-index: 22;
    transform: translateX(0);
    display: block;
    opacity: 0;
    pointer-events: none;
}

.result-body .test-header-right-data .secondary-btn:hover .tooltip-wrapper {
    opacity: 1;
    transform: translateX(0);
}

.result-body .completed-test-header .test-header-right-data .secondary-btn:last-child:hover .tooltip-wrapper {
    opacity: 1;
    transform: translateX(-40%);
}

.result-body .completed-test-header .test-header-right-data .secondary-btn:last-child:hover .top-tooltip::before {
    left: 89%;
}

.result-body .test-header-right-data .react-loading-skeleton {
    width: 40px !important;
    height: 40px !important;
    border-radius: 100% !important;
    margin: 0px !important;
    margin-left: 20px !important;
    position: relative;
    top: -3px;
}

.result-body .test-header-right-data .btn {
    margin-left: var(--xl);
}

.result-body .test-header-right-data .secondary-btn:first-child {
    margin-left: 0px;
}

.result-body .test-header-right-data .secondary-btn img {
    margin: 0;
    width: 16px;
    height: 16px;
}

/***share link result css*****/
.share-link .row.summary-modal-data-repeat.test-summary-filters {
    text-align: left;
}

.share-link .row.summary-modal-data-repeat.test-summary-filters .col-md-12 {
    padding: 0px;
}

.share-link .filter-buttons-wrap {
    min-width: auto;
    width: auto;
}

.share-link .row.summary-modal-data-repeat {
    padding: 0px 0px 20px 0px;
}

.share-link .share-social-links .switch {
    padding-left: 53px;
}

.share-link .share-social-links .switch span {
    color: #000;
    font-size: 18px;
    line-height: 30px;
}

.result-link-wrapper .toggle_btn_label {
    position: relative;
    top: -3px;
}

.share-link .form-group {
    max-width: 100%;
}

.share-link .primary-large {
    margin-top: 20px;
}

.share-link .toast-success {
    margin-top: 20px;
}

.copy-link-subwrapper.result-link-wrapper h5 {
    margin: 0 0 20px;
}

.share-link-password-wrapper,
.share-link-password-wrapper .form-group {
    margin-top: 12px;
}

.share-link-modal-wrap span.slider.round {
    top: 3px;
}

.share-link-modal-wrap .result-link-wrapper .toggle_btn_label {
    top: 0px;
}

.test-result-password {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 165px);
    padding: 15px;
}

.test-result-password .bold-font {
    font-weight: 600;
}

.test-result-password-inner {
    border-radius: 20px;
    border: 1px solid var(--gray-400);
    background: var(--gray-50);
    padding: 40px;
    text-align: center;
    max-width: 465px;
}

.test-result-password-inner .form-group {
    max-width: 100%;
    margin: 32px 0 20px !important;
    text-align: left;
}

.test-result-password-inner .input-field label {
    z-index: 0;
}

.test-result-password-inner .input-field input:focus~label,
.test-result-password-inner .input-field textarea:focus~label,
.test-result-password-inner .input-field.focused label {
    z-index: 1;
}

.share-link-password-wrapper .form-group .caption:empty {
    display: none;
}

.limit-reached-modal .modal-lg {
    max-width: 600px;
}

.time-space-between img {
    margin-right: 16px;
}

.time-space-between span {
    min-width: 79px;
    font-display: inline-block;
}

.time-space-between p {
    min-width: 83px;
}

.share-link .modal-dialog {
    margin-top: 150px;
}

.share-link .modal-dialog-centered {
    min-height: unset !important;
}

.row.green-flow-tester-profile {
    display: block !important;
}

.row.green-flow-tester-profile .col-md-6 {
    width: 100%;
    max-width: 100%;
    flex: 100%;
}

.row.green-flow-tester-profile .formbox.d-flex-radiobox {
    display: flex !important;
    justify-content: space-between;
    max-width: 435px;
    align-items: center;
}

.mobile-id-verification-modal .modal-body {
    padding: 0px;
}

.mobile-id-verification-modal .modal-content {
    background: none;
    box-shadow: none;
}

.mobile-id-verification-modal .modal-header-top {
    display: none;
}

.mobile-id-verification-modal .box-small.signofinformational-wrap.gray-box.p-32.mb-20 {
    margin: 0 auto;
}

.mobile-id-verification-modal .id-verification-inner-wrap.graytext {
    margin: 0 auto !important;
}

.mobile-id-verification-modal span.subtitle-2.semi-bold-font {
    color: #000;
}

.disabled-share-link,
.disabled-toggle {
    opacity: 0.3;
    pointer-events: none;
}

.share-social-links.text-left.active-toggle-state.mb-12.mt-20 {
    margin-bottom: 20px !important;
}

.result-not-available {
    min-height: calc(100vh - 150px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px;
}

.result-not-available .not-found-page-text {
    padding-bottom: 0;
    min-height: auto;
    max-width: 540px;
}

.result-not-available .not-found-page-text span {
    display: block;
    margin: 20px 0px 12px 0;
}

.result-link-wrapper .share-link-story.copy-share-test-wrap {
    margin: 0px 0 32px;
}

.seesion-timeout-time-take-test.d-flex {
    position: fixed;
    z-index: 99;
    bottom: 118px;
    right: 50px;
    background: #f00;
    border-radius: 50px;
    padding: 10px;
    color: #fff;
    min-width: 96px;
    min-height: 52px;
    align-items: center;
}

.seesion-timeout-time-take-test p {
    margin-left: 4px;
    min-width: 53px;
}

.tester-profile .profile-sec-wrap.mb-60 .whatsupplabel {
    margin-top: 0;
    position: absolute;
    bottom: -65px;
}

.tester-profile .profile-sec-wrap.mb-60 .row.change-email-row {
    align-items: center;
    /* margin-bottom: 47px; */
}

.row.phoneno-field-row {
    margin-bottom: 47px;
}

.tester-profile .radio-btn-label {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 30px;
    position: relative;
    top: -1px;
}

.navigation-listing ul .active-menu a svg path,
.header .hamburger-items .active-menu svg path {
    stroke: #ff6db1 !important;
}

.navigation-listing ul .active-menu a,
.header .hamburger-items .active-menu {
    color: #ff6db1 !important;
}

.preference-test-user-table .byuser-table tr .bd-q-ans-col,
.preference-test-user-table .byuser-table thead tr .bd-thcol-2 {
    min-width: 100px;
    max-width: 620px;
}

.tooltip-deviceinfo.tooltip-estimatedpanel {
    display: flex;
    margin-right: 0px;
}

.tooltip-deviceinfo.tooltip-estimatedpanel:hover .tooltip-wrapper {
    display: none;
}

.tooltip-deviceinfo.tooltip-estimatedpanel span {
    position: relative;
    margin-left: 8px;
    top: 2px;
}

.tooltip-deviceinfo.tooltip-estimatedpanel span span {
    margin-left: 0px;
}

.tooltip-deviceinfo.tooltip-estimatedpanel span:hover .tooltip-wrapper {
    display: block;
    width: 190px !important;
    right: -33px !important;
    top: 37px !important;
    margin: 0;
    white-space: pre-line;
    height: auto;
    min-height: 100px;
    bottom: auto;
}

.tooltip-deviceinfo.tooltip-estimatedpanel .bottom-tooltip::before {
    left: 50%;
    top: 6px;
    border: 11px solid transparent;
    border-top: 0;
    border-bottom: 12px solid var(--gray-900);
    transform: translate(-50%, calc(-100% - 5px));
}

.card-sorting-create-test-title label.control-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 96.5%;
    display: inline-block;
}

.participants_info-tooltip .tooltip-wrapper {
    white-space: break-spaces;
    left: -104px;
    width: 230px;
    bottom: 36px;
    top: auto;
}

.participants_info-tooltip .info-wrap {
    padding-top: 0;
    position: relative;
    margin-left: 2px;
    display: inline-block;
}

.participants_info-tooltip {
    display: flex !important;
    white-space: nowrap;
}

.publish-panel-sidebar .participants_info-tooltip .tooltip-wrapper {
    bottom: auto !important;
    top: 28px;
}

.publish-panel-sidebar .participants_info-tooltip .bottom-tooltip::before {
    content: "";
    position: absolute;
    display: block;
    width: 0px;
    left: 51.5%;
    top: 6px;
    border: 11px solid transparent;
    border-top: 0;
    border-bottom: 12px solid var(--gray-900);
    transform: translate(-50%, calc(-100% - 5px));
}

.cardsort-task-title-data {
    margin-top: 7px;
}

.formbox.sanctioned-info.mb-32 {
    margin-bottom: 32px;
}

.profile-form-group.sanctioned-info {
    max-width: 460px;
}

.sanctioned-info .toast-data.toast-warning-data {
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
}

.sanctioned-info .toast-data.toast-warning-data {
    padding-right: 0;
}

.good-to-go-data-repeat img {
    margin-right: 10px;
}

.good-to-go-data-hold {
    padding: 0px 20px;
}

.good-to-go-data-repeat {
    text-align: left;
}

.question-dropdown-container.screen-question-wrap .dropdown-header {
    cursor: default;
    padding: 19.5px 20px;
}

.screen-user-table .search-no-data-found {
    top: 0px;
}

.screen-user-table .info-wrap {
    top: -1px;
}

.dashboard-search-data-wrap {
    width: 0px;
    transition: 0.3s;
    overflow: hidden;
    margin-top: 2px;
    display: inline-block;
}

span.dashboard-search-data-wrap.active-search-1 {
    width: 400px;
    transition: 0.3s;
    margin-top: 2px;
}

.dashboard-search-icon {
    display: flex;
    cursor: not-allowed;
    opacity: 0.3;
    align-items: center;
    width: 42px;
    height: 42px;
    justify-content: center;
}

span.dashboard-search-icon.disabled-search {
    cursor: pointer;
    opacity: 1;
}

span.dashboard-search-icon.skeleton-search {
    opacity: 1;
    position: relative;
    top: 4px;
}

.search-functionlity-data {
    position: relative;
    top: 0px;
    margin-right: 20px;
    width: 400px;
    display: flex;
    justify-content: end;
}

.dashboard-search-no-data-found .primary-small img {
    width: 16px;
    height: 16px;
    margin: 0;
    margin-right: 6px;
}

.dashboard-search-no-data-found .search-no-data-found {
    padding: 30px 0px;
    top: 10px;
}

.dashboard-search-no-data-found {
    min-height: calc(100vh - 600px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.publish-fees-required-wrap .tag {
    margin-left: 20px;
    position: relative;
    top: 1px;
    display: flex;
    align-items: center;
}

.publish-fees-required-wrap .tag img {
    margin-right: 4px;
}

.publish-fees-required-wrap h3 {
    font-size: 28px !important;
    line-height: 34px !important;
}

.screen-user-table tr th .tooltip-wrapper {
    bottom: 40px;
    left: -105px;
    width: 234px;
    right: auto;
}

.filter-skelton {
    margin-right: 20px !important;
    display: inline-block;
    padding: 0px !important;
    margin-bottom: 0px !important;
}

.filter-skelton span {
    padding: 0px !important;
    margin-bottom: 0px !important;
}

.filter-menu-wrap .react-loading-skeleton {
    margin-left: 40px !important;
    margin-bottom: 0px !important;
    margin-top: 0px;
}

.dashboard-filter-right .react-loading-skeleton {
    position: relative;
    top: -6px;
}

.search-functionlity-data .react-loading-skeleton {
    top: -3px;
}

.search-icon-mobile {
    display: none;
}

.search-field-form-mobile {
    display: none;
}

.filter-skelton span,
.filter-skelton .react-loading-skeleton {
    margin: 0px !important;
}

.confirmation-modal-wrap.welcom-userq-modal .modal-dialog {
    max-width: 580px;
    width: calc(100% -15px);
}

.page-head-right .react-loading-skeleton {
    height: 42px !important;
}

.sidentity_tile_inner-footer {
    margin-top: 10px;
}

.sidentity_tile_inner-footer img,
.sidentity_tile_inner-footer svg {
    margin-right: 4px;
}

.sidentity_tile_inner-footer .right-content,
.sidentity_tile_inner-footer .left-content {
    display: flex;
    align-items: center;
}

.onfido-detail-summary-modal .modal-dialog {
    max-width: 532px;
}

.onfido-detail-summary-modal .signofinformational-wrap {
    max-width: 100%;
    margin-bottom: 32px !important;
}

.onfido-detail-summary-modal .header-data {
    margin-bottom: 32px;
}

.onfido-detail-summary-modal .header-data .d-flex img {
    margin-right: 20px;
}

.onfido-detail-summary-modal .header-data .d-flex {
    align-items: center;
}

.onfido-detail-summary-modal .time-sec.d-flex {
    margin-top: 14px;
}

.unknown-info span.inline-svg-- {
    margin: 0;
    height: auto;
    width: auto;
}

.unknown-th-info span {
    margin-left: 2px;
    cursor: pointer;
}

svg.gray-900-svg.hamburger-menu-img {
    width: 20px;
}

.gray-900-svg path {
    stroke: #000;
}

.max-height-table {
    margin-bottom: 20px;
}

.responsive-table-scroll {
    max-height: 470px;
    overflow-y: auto;
    padding-top: 0px;
}

.responsive-table-scroll .table th {
    padding-left: 5px;
    padding-bottom: 7px;
}

.responsive-table-scroll .table td {
    padding-left: 5px !important;
}

.responsive-table-scroll .hamburger-menu {
    padding-right: 10px;
    display: inline-block;
}

.responsive-table-scroll table thead {
    position: sticky;
    top: 0px;
    background: #fff;
}

.aggregated-data-table thead th .tooltip-wrapper {
    left: -310px;
    right: 30px;
    margin: 0;
    top: -13px;
    width: 300px !important;
}

.aggregated-data-table thead th .tooltip-wrapper.bottom-tooltip::before {
    content: "";
    position: absolute;
    display: block;
    width: 0px;
    right: 6px;
    top: 22%;
    border: 11px solid transparent;
    border-right: 0;
    border-left: 12px solid var(--gray-900);
    transform: translate(calc(100% + 5px), -50%);
    bottom: auto;
    top: 22px;
    left: 94%;
}

.aggregated-data-table .unknown-participant-tableheader .position-relative:hover .tooltip-wrapper {
    display: block;
}

.no-page-data-wrap.tester-dashboard-no-test-available-data {
    width: 100%;
    max-width: 100%;
    margin: 40px 0px 40px;
}

.tester-dashboard-no-test-available-data-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.tester-dashboard-no-test-available-data-inner {
    margin-top: 32px;
}

.tester-dashboard-no-test-available-data-inner .test-card-info.d-flex.align-items-end {
    align-items: center !important;
    justify-content: space-between;
}

.tester-dashboard-no-test-available-data .practice-using-test-demos-text {
    margin-bottom: 20px;
}

.tester-dashboard-no-test-available-data .practice-using-test-demos-desc {
    color: var(--gray-700);
    max-width: 890px;
    margin: 0 auto;
}

.tree-path-outcome-filyer .multiselectlist-dropdown-box {
    margin-right: 29px;
    max-width: 270px;
    min-width: 270px;
}

.tree-path-outcome-filyer .multiselectlist-dropdown-box .multiselectlist-dropdown-box-container {
    width: 100%;
}

.tree-path-outcome-filyer .secondary-btn {
    min-width: 170px;
}

.multiselectlist-dropdown-selected-values-container {
    color: var(--gray-900);
}

/***Horizonatal chart css***/
.horizonatal-chart-left-side {
    width: 350px;
    padding: 12px 16px;
    border: 1px solid #ccc;
    border-radius: 10px;
}

.horizonatal-chart-right-side {
    max-width: calc(100% - 350px);
    padding-left: 20px;
    padding-right: 15px;
}

.horiz-chart-hold-bg {
    background: #e9e9e9;
    border-radius: 10px;
    overflow: hidden;
}

.horiz-chart-wrap {
    height: 8px;
    position: relative;
    border-radius: 10px;
}

.horiz-chart-top-info {
    margin-bottom: 10px;
}

.horiz-chart-top-info .h3 {
    line-height: 30px;
}

.horiz-chart-inner-hold .horiz-chart-data-repeat:first-of-type {
    margin-top: 10px;
}

.horiz-chart-data-repeat {
    display: flex;
    align-items: center;
    margin: 0px 0px 12px 0px;
}

.horiz-chart-data-repeat:last-child {
    margin-bottom: 0px;
}

.horiz-chart-text-wrap .country-flag-icon {
    display: flex;
    top: 0px;
}

/***sub residancy css***/
.sub-res-chart-area {
    width: 183px;
    margin: 0px 20px 0px 10px;
}

.sub-res-info-area .caption {
    width: 93px;
    display: inline-block;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.single-participant {
    position: relative;
    left: -7.3px;
}

.sub-residency-repeat:first-child {
    margin-top: 0px;
}

.sub-residency-wrap {
    margin-bottom: 30px;
}

.sub-residency-repeat {
    margin: 9px 0;
}

.sub-res-info-hold p {
    margin-left: 10px;
    margin-right: 10px;
}

.sub-res-info-area p {
    width: 63px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}

/***sub residancy css***/

.add-othrnone-survey .add-other-survey-left {
    margin-right: 20px;
}

.add-othrnone-survey-btn {
    display: flex;
    min-width: 350px;
}

.add-othrnone-survey .none-of-the-above-text {
    margin-left: 24px;
}

.add-othrnone-survey-btn button {
    margin: 3px 0px;
    position: relative;
}

.add-othrnone-survey-btn button .tooltip-wrapper {
    left: -89px;
    bottom: 140%;
    margin: 0;
    top: auto !important;
}

.add-othrnone-survey-btn button.none-of-the-above-text .tooltip-wrapper {
    left: -54px;
}

.other-choice-container .ans-close-row {
    top: 0px !important;
}

.zoom-controls {
    position: fixed;
    z-index: 222;
    background: #fff;
    bottom: 40px;
    left: 40px;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.zoom-controls span {
    cursor: pointer;
    padding: 10px;
    display: block;
}

.zoom-controls span:hover {
    background: #f5f5f5;
}

.zoom-controls span span {
    padding: 0px;
}

.zoom-controls span .gray-900-svg path {
    stroke: #676767;
}

.zoom-controls span:hover .gray-900-svg path {
    stroke: #000;
}

.zoom-controls .zoom-in {
    border-bottom: 1px solid #e9e9e9;
}

.zoom-percentage {
    position: fixed;
    bottom: 72px;
    left: 96px;
    background: #676767;
    height: auto;
    z-index: 99;
    border-radius: 3px;
    padding: 4px 6px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    line-height: 17px;
    min-width: 44px;
}

.designs-preview-modal .modal-dialog.modal-dialog-centered {
    margin: 0px;
    max-width: 100%;
    width: 100%;
}

.designs-preview-modal .modal-header-top {
    position: fixed;
    z-index: 2;
    padding: 10px;
    width: 100%;
}

.designs-preview-modal {
    padding: 0px !important;
}

.profile-social-login-btn {
    padding: 20px;
    min-width: 320px;
    max-width: max-content;
    border: 1px solid #ccc;
    border-radius: 10px;
}

.social-btn-icon {
    margin-right: 16px;
}

.profile-social-login-btn.facebook-login {
    border: 1px solid #0e8cf1 !important;
}

.profile-social-login-btn.google-login {
    border: none !important;
    outline: none !important;
    position: relative;
    z-index: 1;
    background: linear-gradient(to right, #4285f4, #34a853, #fbbc05, #ea4335);
}

.profile-social-login-btn.google-login::before {
    content: "";
    position: absolute;
    left: 1px;
    right: 1px;
    top: 1px;
    bottom: 1px;
    border-radius: 9px;
    background-color: white;
    z-index: -1;
    transition: 200ms;
}

.question-duplicate-animation {
    margin-top: 30px;
    -webkit-animation-delay: 0.3s;
    -moz-animation-delay: 0.3s;
    animation-delay: 0.3s;
    animation-name: fadeIn;
    animation: drift 3s;
    /* animation: drift 0.5s linear infinite; */
}

@-webkit-keyframes drift {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes drift {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes drift {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.responsive-table-scroll table thead:after {
    position: absolute;
    content: "";
    background: #ffffff;
    width: 100%;
    height: 8px;
    top: -8px;
    z-index: -5;
    /* box-shadow: -3px 0px 5px 1px #f4f4f4f5; */
}

.scrolled thead {
    position: sticky;
    top: 0px;
    background: #fff;
    z-index: 1;
    box-shadow: -1px 5px 10px 1px #dfdfdf;
}

td.tableDropdown .hamburger-items.dropdown-menu.show {
    z-index: 0;
}

.change-password-section.profile-details span.subtitle-2 {
    display: block;
}

.survey-added-question-repeat .logic-dropdown-readmode {
    margin-left: 15px;
}

.zoom-container img {
    user-select: none;
    background-color: #fff;
}

.zoom-container {
    margin: 0 auto;
    width: auto !important;
}

.active-zoom img {
    max-width: unset !important;
}

.cache-profile-login-btn .profile-social-login-btn {
    max-width: 460px;
    width: 100%;
}

.cache-profile-login-btn .profile-social-login-btn .social-btn-info p {
    color: #000;
}

.cache_login_wrapper .row.align-items-center {
    align-items: start !important;
}

.cache_login_wrapper .row.align-items-center .col-md-6 {
    margin-top: 60px;
}

.cache_login_wrapper .row.align-items-center .col-md-6.login-right-side.text-right {
    margin-top: 0px;
}

.cache-login.btn.primary-large {
    width: 100%;
    padding: 0;
    background-color: #000 !important;
}

.cache-login.btn.primary-large:hover {
    background: #2b2b2b !important;
    border-color: #2b2b2b !important;
}

.cache-login a#r_google_sign_in {
    color: #fff;
    border: 0;
}

.cache_login_wrapper .nothaveaccount.resarcher-btn-register {
    margin: 0px;
}

.full.ordivider.mt-32 {
    margin-top: 32px !important;
}

.full.ordivider.mb-32 {
    margin-bottom: 32px !important;
}

.full.tester-social-loginbox.cache-login-single-btn.single-social-box-2 {
    display: block;
}

p.cat-data.by-user-data-cat {
    display: flex;
    align-items: self-start;
    min-height: 60px;
}

p.cat-data.by-user-data-cat img {
    margin-right: 8px;
}

.table-responsive.by-user-table-card table td {
    border-top: 1px solid var(--gray-400);
    border-bottom: 0px;
}

.table-responsive.by-user-table-card table tr:first-child td {
    border-top: 0px;
}

tr.old-added-by-user-row td:first-child,
tr.old-added-by-user-row td:nth-child(2),
tr.old-added-by-user-row td:nth-child(3) {
    border: 0px !important;
}

.cache_login_tester_wrapper .btn-block {
    margin: 0;
    color: #fff !important;
    border: 0px !important;
}

.cache_login_tester_wrapper .tester-social-loginbox {
    margin-bottom: 32px;
}

.by-user-table-card .table-cards-repeat:last-child p:last-child {
    margin-bottom: 0;
}

.by-user-table-card .show-options {
    width: max-content;
}

.by-user-category-td {
    position: relative;
}

.by-user-category-td-more,
.by-user-category-td-less {
    position: absolute;
    bottom: 21px;
    width: max-content;
}

.by-user-category-td {
    min-width: 230px;
}

table td.tableDropdown .menu-item {
    width: 30px;
    text-align: center;
    display: flex;
    justify-content: center;
    height: 30px;
    border-radius: 100%;
}

table td .dropdown.show.dropdown .menu-item {
    background: #ff6db1;
}

.tableDropdown .hamburger-menu-img {
    width: 16px !important;
}

table td .menu-item .gray-900-svg circle {
    fill: var(--gray-700);
}

table td .dropdown.show.dropdown .menu-item .gray-900-svg circle {
    fill: var(--gray-50);
}

table td.tableDropdown .menu-item:hover {
    background-color: var(--gray-300);
}

table td.tableDropdown .menu-item:hover svg circle {
    fill: var(--gray-900);
}

.multiselectlist-dropdown-option label {
    margin: 0px !important;
}

.responsive-table-scroll .screen-user-table .info-wrap:hover .tooltip-wrapper {
    margin: 0;
    top: 42px;
    bottom: auto;
    left: -105px;
    width: 234px;
    right: auto;
}

.responsive-table-scroll .screen-user-table .info-wrap:hover .tooltip-wrapper.bottom-tooltip:before {
    width: 0px;
    left: 50%;
    top: 6px;
    border: 11px solid transparent;
    border-top: 0;
    border-bottom: 12px solid var(--gray-900);
    transform: translate(-50%, calc(-100% - 5px));
}

button.close.black-bg svg {
    width: 24px;
    height: 24px;
}

/* .singleselect-dropdown .css-ackcql{
   position: absolute;
   right: 0px;
  }
  .singleselect-dropdown .flag-value-container {
      display: inline-flex !important;
      align-items: center !important;
      width: fit-content !important;
  } */

.login-data-wrap.screening-question-innerwrap {
    min-height: calc(100vh - 110px);
    display: flex;
    align-items: center;
    justify-content: center;
    align-items: center;
    background: #f5f5f5;
    padding: 15px;
}

.modal-dialog.modal-dialog-centered.screening-questions-modal-wrap {
    min-height: auto;
    max-width: 658px;
    border-bottom: 20px;
    width: 100%;
}

.modal-dialog.modal-dialog-centered.screening-questions-modal-wrap .modal-content {
    box-shadow: 0px 6px 24px 0px rgba(23, 22, 55, 0.12);
}

.modal.screening-questions-modal-wrap {
    transition: none !important;
}

.screening-questions-modal-wrap .modal-dialog {
    transition: none !important;
}

.screen-byuser-filter-wrap .dropdown-container.form-group {
    z-index: unset;
}

.question-result-data.max-height-table {
    padding: 0 !important;
}

.study-history-table table thead tr th:nth-child(3) {
    min-width: 120px;
}

.MuiPickersPopper-paper.css-1xo7hb2 {
    background-color: unset !important;
}

.survey-question-holder .points-outer .dropdown-container.form-group {
    z-index: 2;
}

.add-logic-true .dropdown-container.form-group {
    position: relative;
}

.add-logic-enabled {
    position: absolute;
    right: 200px;
    height: 100%;
    display: flex;
    align-items: center;
    padding-top: 15px;
}

.add-logic-enabled span {
    color: var(--secondary-purple-200);
    text-align: center;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 17px;
    text-decoration-line: underline;
    cursor: pointer;
}

.add-logic-enabled span:hover {
    color: #5c208d;
    text-decoration: underline;
}

.add-logic-modal-wrap .modal-dialog {
    max-width: 787px;
}

.add-logic-modal-wrap .total-users {
    border-radius: 10px;
    border: 1px solid var(--gray-400);
    background: #fcfcfc;
    display: inline-flex;
    padding: 10px 20px;
    color: var(--secondary-purple-200);
    margin-bottom: 32px;
}

.add-logic-modal-wrap .modal-body {
    padding: 32px;
}

.add-logic-modal-wrap .total-users span {
    margin-right: 12px;
}

.purple-200-svg path {
    stroke: var(--secondary-purple-200);
}

.add-logic-modal-wrap .jump-to-question-data {
    display: inline-flex;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.add-logic-modal-wrap .jump-to-question-left {
    color: var(--gray-700);
    margin-right: 3px;
}

.add-logic-modal-wrap .row .col-md-12 {
    padding: 0;
    margin-bottom: 32px;
}

.add-logic-modal-wrap .row.summary-modal-data-repeat {
    border: 0;
    padding: 0px;
}

.add-logic-modal-wrap .row .col-md-12:last-child {
    margin-bottom: 0px;
}

.add-logic-modal-wrap .summary-right-sec-wrap .logic-dropdown-readmode {
    margin-left: 10px;
}

.nextquestion-text {
    margin-bottom: 12px;
}

.users-navigate-from {
    display: inline-flex;
    flex-wrap: wrap;
    margin-bottom: 32px;
}

.users-navigate-from .navigate-text {
    color: #676767;
    margin-right: 4px;
}

.users-navigate-from .navigate-text-question {
    display: inline-flex;
    align-items: center;
    font-weight: 600;
    margin-right: 4px;
}

.users-navigate-from .navigate-text-question .info-wrap {
    margin-left: 4px;
    z-index: 2;
    cursor: pointer;
}

.users-navigate-from .navigate-text-question .info-wrap .tooltip-wrapper {
    margin: 0;
    right: -139px;
    top: 36px;
    bottom: auto;
}

.users-navigate-from .navigate-text-question .info-wrap .tooltip-wrapper .participant {
    display: block;
    color: #bf8ee8;
}

.taking-test-page-wrap .other-input-field {
    margin-bottom: 18px;
}

.logic-enabled .dropdown-header-selected-question {
    padding-right: 105px;
}

.dt-question-wrap {
    display: flex;
    white-space: nowrap;
}

.navigate-text-question {
    margin-left: 4px;
}

.dt-question-wrap .navigate-text-question {
    display: flex;
    white-space: nowrap;
}

.dt-question-wrap .navigate-text-question .tooltip-wrapper {
    margin: 0;
    white-space: initial !important;
    left: -104px !important;
    right: auto !important;
    top: 35px;
    z-index: 2;
    width: 230px !important;
}

.dt-question-wrap .info-wrap {
    margin-left: 3px;
    cursor: pointer;
}

.tree-test-task-information {
    margin-bottom: 32px;
}

.tree-test-task-information .cardsorting-wrap-top {
    padding: 0;
    border: 0;
}

.tree-test-task-information p.body-text.body-text-2.medium-font strong {
    font-weight: 500;
    color: #000;
}

.build-treetask-top-left p {
    font-weight: 500;
}

.tester-count-hold {
    display: flex;
    align-items: center;
}

.total-users-skip {
    margin-bottom: 32px;
    border-radius: 10px;
    border: 1px solid var(--light-dark-400, #e9e9e9);
    background: var(--light-dark-100, #fcfcfc);
    display: flex;
    padding: 10px 12px;
    margin-left: 20px;
}

.total-users-skip p {
    color: #676767;
    margin-left: 12px;
}

.tree-test-task-followup-questions {
    padding: 0px !important;
}

.change-order-btn-wrap {
    margin-bottom: 8px;
}

.change-order-btn-wrap span {
    margin: 0 !important;
}

.define-task-answer-wrap {
    margin-top: 12px !important;
}

.define-task-answer.secondary-btn {
    margin-top: 8px !important;
}

.tree-test-task-followup-questions .followup-questions-container .formbox:last-child {
    margin-bottom: 0;
}

span.error.red-text:empty {
    display: none;
}

.other-answer-added .small-dropdown.add-logic-dropdown {
    display: none;
}

.searchdropdown-option.searchdropdown-option-disabled {
    cursor: not-allowed;
    color: #ccc;
}

.searchdropdown-option {
    cursor: pointer;
    font-weight: 500;
    margin-bottom: 0px !important;
    padding: 16px 20px;
}

.searchdropdown-option:hover {
    background-color: #f5f5f5;
}

.searchdropdown-box-container.focussed .body-text {
    cursor: text;
}

.searchdropdown-box-container:hover .body-text {
    color: var(--gray-900) !important;
}

.searchdropdown-selected-values-container {
    width: 100%;
}

.searchdropdown-options {
    padding: 0px !important;
}

.searchdropdown-dropdown-icon-container {
    right: 11px !important;
}

.searchdropdown-selected-values-container>div {
    width: 100%;
    display: flex;
    align-items: center;
}

.searchdropdown-selected-values-container>div span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 93%;
}

.arabic_wrapper .likert-scale-length-wrap .dropdown-field {
    margin-left: 0px !important;
    margin-right: 20px !important;
    text-align: left !important;
    direction: rtl !important;
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500 !important;
}

.arabic_wrapper .likert-scale-length-wrap .dropdown-field .flag-value-container {
    white-space: nowrap;
    justify-content: flex-start;
    display: block;
}

.arabic_wrapper .likert-scale-length-wrap .dropdown-field .flag-value-container input {
    position: absolute;
    top: 0;
    left: 0;
}

.arabic_wrapper .likert-scale-length-wrap .css-qc6sy-singleValue,
.arabic_wrapper .likert-scale-length-wrap .css-26l3qy-menu {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500 !important;
}

.arabic_wrapper .likert-scale-length-wrap .dropdown-field .css-1fdsijx-ValueContainer {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.arabic_wrapper .likert-scale-length-wrap .dropdown-field label.control-label.body-text.body-text-2.dropdown-label {
    right: 9px;
    left: auto;
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500 !important;
}

.arabic_wrapper .likert-scale-length-wrap .css-11unzgr>div {
    font-family: "Tajawal", sans-serif !important;
    text-align: right;
}

.arabic_wrapper .likert-scale-length-wrap .css-tlfecz-indicatorContainer {
    width: auto !important;
    position: static !important;
}

.arabic_wrapper .likert-scale-length-wrap .css-qc6sy-singleValue {
    display: flow !important;
    max-width: 87%;
    text-align: center;
}

.arabic_wrapper .likert-scale-length-wrap .dropdown-container.focused .css-1d8n9bt,
.arabic_wrapper .likert-scale-length-wrap .dropdown-container.active .css-1d8n9bt,
.arabic_wrapper .likert-scale-length-wrap .dropdown-container .css-319lph-ValueContainer {
    padding-left: 0px;
}

.arabic_wrapper .likert-scale-length-wrap .css-tlfecz-indicatorContainer,
.arabic_wrapper .likert-scale-length-wrap .css-1gtu0rj-indicatorContainer {
    width: 100% !important;
}

.tester-thankyou-page-wrap .button-wrapper .primary-large img {
    -webkit-filter: invert(100%);
    filter: invert(100%);
}

.draginput-crossicon-inner span svg {
    width: 24px;
    height: 24px;
}

.task-order-tree-modal .modal-header-top {
    margin-bottom: 20px;
}

/* .css-26l3qy-menu{
      z-index:999 !important;
  } */
.estimate-progress-wrap h1 {
    font-size: 40px !important;
    line-height: 48px !important;
}

/* .task-order-tree-modal .added-card-cat-repeat {
      background: #FCFCFC;
      border: 1px solid #e9e9e9;
  }
   */
.task-order-modal .added-card-cat-repeat .subtitle-2 {
    font-size: 16px;
    line-height: 24px;
}

.task-order-modal .added-card-cat-repeat .task-item-data p {
    margin-top: 12px;
}

.task-order-modal .added-card-cat-repeat .task-item-data p:empty {
    display: none;
}

.task-order-modal .added-card-cat-repeat-sub-items {
    padding: 20px;
}

.task-order-modal .task-drag-img svg {
    width: 16px;
    height: 16px;
}

.task-order-modal .task-drag-img {
    padding-top: 3px;
}

.task-order-modal .tree-task-path span {
    color: #378b10;
    font-size: 12px;
    font-weight: 500;
    line-height: 17px;
}

.task-order-modal .body-text.body-text-2.medium-font:empty {
    display: none;
}

/***today css****/
.task-order-modal .body-text.body-text-2.medium-font:empty {
    display: none;
}

.tree-test-follow-up-questions .test-result-inner-data {
    padding: 0 0 40px;
}

.tree-test-follow-up-questions .question-result-data {
    padding: 0;
}

.tree-test-follow-up-questions .bd-que-slide-arrow.tablebottompagination {
    padding: 0px 30px;
}

.tree-test-follow-up-questions .bd-question-view-wrap .question-result-data {
    padding: 30px 30px 0;
}

.tree-test-follow-up-questions .question-result-header.question-result-data {
    padding: 0 !important;
}

.tree-test-follow-up-questions .question-result-header.question-result-data {
    z-index: 1;
}

span.define-design-edit svg {
    margin: 0;
}

.publish-layout-center .pay-on-fly-coupon-code-wrap {
    margin-bottom: 32px;
}

.recruit-footer-info {
    margin-top: 32px !important;
}

/*tree test css*/
.task-order-tree-modal .added-cardsorting-category-wrap {
    max-height: 500px;
    overflow-y: auto;
    padding-right: 3px;
}

.task-order-modal .added-card-cat-repeat {
    background: #fcfcfc;
    border: 1px solid #e9e9e9;
    margin-top: 12px;
    margin-bottom: 0px;
}

.task-order-modal .added-card-cat-repeat.draggable-element-start {
    background: none !important;
    border: 0px !important;
}

.treeScrollbar .ans-list-repeat.selected-card-cat-repeat.arabic_wrapper .ghost-btn {
    right: auto;
    left: 47px;
    font-family: "Inter";
}

.tester-login-page-wrapper.arabic_wrapper.fixed-tree-sec .btn-with-icon.btn-with-icon-left {
    text-align: right !important;
    direction: ltr !important;
}

.arabic_wrapper .rating-scale-labels span {
    margin-right: 0;
    margin-left: 8px;
}

.estimated-panel-side-bar {
    padding: 47px 20px;
}

/***input with image css***/
.input-with-image {
    justify-content: space-between;
}

.input-with-image .form-group,
.answer-input-with-image .form-group {
    max-width: calc(100% - 66px) !important;
}

.prefer-follow-up-section-1 .input-with-image .form-group,
.prefer-follow-up-section-1 .answer-input-with-image .form-group {
    max-width: calc(100%) !important;
}

.answer-input-with-image {
    display: flex;
    justify-content: space-between;
}

.input-image-answer-hold-wrap .move-item {
    top: -15px !important;
}

.question-added-view-wrap .added-question-left .question-image-wrap,
.question-option-value-with-image .question-image-wrap {
    min-width: 50px;
    margin-right: 16px;
}

.arabic_wrapper .question-image-wrap {
    margin-right: 0px !important;
    margin-left: 16px !important;
}

.arabic_wrapper .input-with-image {
    text-align: right !important;
    direction: rtl !important;
}

.question-added-view-wrap .added-question-left {
    align-items: center;
}

.question-option-value-with-image {
    display: flex;
    align-items: center;
}

.multiquestion-read-more .checkbox-wrap .checkmark {
    position: static;
}

.multiquestion-read-more .checkbox-wrap {
    padding-left: 0px;
    padding-right: 12px;
}

.test-answer-with-image {
    border-radius: 10px;
    border: 1px solid var(--light-dark-400, #e9e9e9);
    padding: 16px;
}

.test-answer-with-image label {
    border: 0;
    border-radius: 0;
    padding: 0;
    margin-bottom: 12px;
}

.question-result-with-img img {
    width: 50px;
    min-width: 50px;
    height: 50px;
    background: #f5f5f5;
    object-fit: contain;
    border-radius: 5px;
}

.question-result-img {
    position: relative;
    width: 50px;
    height: 50px;
    margin-right: 12px;
    border-radius: 5px;
}

.question-result-img .view-full-view {
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    cursor: pointer;
}

.question-result-img .view-full-view .eye-icon .change-fill {
    fill: #fff;
}

.question-result-img:hover .view-full-view {
    display: flex;
}

.by-user-que-wimg {
    margin: 10px 0px;
}

.test-header-with-ans-img {
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left !important;
    direction: ltr !important;
}

.test-header-with-ans-img .question-result-img {
    min-width: 150px;
    text-align: right;
    display: flex;
    align-items: center;
    margin-right: 12px;
    justify-content: end;
    width: auto;
}

.prefer-design-wrap .questionreadmode-left {
    max-width: max-content !important;
    word-wrap: normal;
}

.first-click-test-question .question-dropdown-container .dropdown-header-left,
.tree-test-question .question-dropdown-container .dropdown-header-left {
    width: 100%;
}

.first-click-test-question .dropdown-header-selected-question,
.tree-test-question .dropdown-header-selected-question {
    width: 100%;
}

.by-user-que-wimg:first-child {
    margin-top: 0;
}

.by-user-que-wimg:last-child {
    margin-bottom: 0px;
}

.question-image-wrap .hamburger-items .dropdown-item {
    text-align: left !important;
    direction: ltr !important;
    font-family: "Inter", sans-serif;
}

.question-result-with-img {
    min-width: 180px;
}

.dropdown-header-arrow-buttons:empty {
    display: none;
}

.dropdown-header-right.disabled-arrow:empty {
    display: none;
}

.question-result-img {
    cursor: pointer;
}

.question-setting-action .hamburger-menu {
    line-height: 0px;
}

.no-question-image {
    width: 50px;
    min-width: 50px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
}

.no-question-image-td {
    display: flex;
    align-items: center;
}

.dropdown-header-selected-question .left-data {
    display: block;
}

.arabic_wrapper .likert-scale-length-wrap .dropdown-field .css-1wy0on6 {
    width: 40px;
}

.question-input-img-preview .inline-svg-large:hover .gray-600-svg path {
    stroke: #000;
}

.arabic-summary .col-md-6.summary-right .body-text-2,
.arabic-summary .col-md-6.summary-right p,
.arabic-summary .option-value,
.arabic-summary .tag,
.arabic-summary .question-scalebox-input,
.arabic-summary .task_title,
.ratingscale-option-arabic-wrap .scale-label {
    font-family: "Tajawal", sans-serif !important;
}

.test-summary-participants .col-md-6.summary-right .body-text-2,
.test-summary-participants .col-md-6.summary-right p,
.test-summary-participants .option-value,
.test-summary-participants {
    font-family: "Inter", sans-serif !important;
}

.arabic-font .test-header-with-ans-img .secondary-btn {
    font-family: inter;
}

/**estimate panel for small screen css****/
.panel-info-left .tooltip-estimatedpanel span {
    position: relative;
    margin-left: 3px;
    top: 0;
}

.panel-info-left .estimate-responses-wrap,
.panel-info-left .estimate-progress-bar {
    display: none;
}

.panel-info-left .estimate-progress-wrap {
    display: flex;
    align-items: end;
}

.panel-info-left .estimate-progress-wrap h1 {
    font-size: 24px !important;
    line-height: 29px !important;
    margin-right: 10px;
    margin-left: 0px;
}

.estimatepanel-top-info {
    padding: 16px 32px;
    border-bottom: 1px solid #e9e9e9;
}

.estimatepanel-top-info .tooltip-deviceinfo.tooltip-estimatedpanel {
    display: none;
}

.order-summary-link p {
    margin-right: 8px;
}

.insufficient-responses-wrap svg {
    margin-right: 4px;
}

.estimatepanel-top-info {
    position: relative;
}

.clickable-wrap {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

/* .order-summary-link{
      position: relative;
      padding-right: 32px;
  }
  .order-summary-link .hover-inline-svg{
      position: absolute;
      right: 0;
      width: 100%;
      text-align: right;
      justify-content: end;
  } */
.order-summary-link {
    min-width: 137px;
}

.pricepnl-small .create-test-preview-area.estimated-panel-size {
    display: block;
    background: #fff;
    border-radius: 8.10021px;
}

.pricepnl-small {
    position: absolute;
    top: 57px;
    padding: 0;
    width: 390px;
    right: 15px;
}

.responsesinfo-forsmallscreen {
    display: none;
}

.estimatepanel-top-info .responsesinfo-forsmallscreen {
    display: block;
}

.estimatepanel-top-info .estimate-error-wrap {
    display: none;
}

.mobile-panel-hold {
    display: none;
}

.order-summary-link.active p {
    color: #000;
}

.order-summary-link.active svg path {
    stroke: #000;
}

.panel-total-price {
    margin-left: 20px;
}

.screening_options_group .questioninputbox .ans-list-repeat.saved-ans-repeat {
    margin-bottom: 44px !important;
}

.screening_options_group .ans-list-wrap .ans-list-repeat .form-group .caption {
    position: absolute;
}

.screening_options_group .ans-list-repeat.saved-ans-repeat .ans-close-row,
.screening_options_group .ans-list-repeat.saved-ans-repeat .ans-icon {
    top: 0px;
}

/*prototype result css*/
.prototype-preview-btn {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.prototype-preview-btn .white-bg-btn:hover svg path {
    stroke: #000;
}

.prototype-preview-btn .white-bg-btn:hover svg .change-fill {
    fill: #000 !important;
}

.proto-common-path-img-preview:hover .prototype-preview-btn {
    display: flex;
}

.prototype-results-mobile-device .proto-common-path-img-preview {
    height: 328px;
}

.white-bg-btn {
    background: #fff;
    border-color: #fff;
    color: #000;
    font-weight: 500;
}

.white-bg-btn:hover {
    background-color: var(--gray-900) !important;
}

.white-bg-btn:hover svg path {
    stroke: #ffffff;
}

.white-bg-btn:hover {
    color: #fff;
}

.white-bg-btn:hover svg .change-fill {
    fill: #fff !important;
}

.prototype-arrow a {
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.prototype-arrow a svg {
    width: 16px;
    height: 16px;
}

.prototype-arrow a:last-child {
    margin-right: 0px;
}

.prototype-arrow-hold {
    padding: 0px 20px;
}

.path-preview-not-available .icon-medium {
    width: 24px;
    height: 24px;
}

.dropdown-header-arrow-buttons.mobile-nav-arrows.prototype-arrow {
    width: 132px;
    display: flex;
    justify-content: end;
}

.horiz-chart-text-wrap.d-flex.align-items-center .info-icon.info-wrap {
    margin-left: 0.5rem;
}

.welcom-userq-modal .congrats-modal-text {
    margin-top: 0;
    padding-top: 20px;
}

.welcome-userq-text.mt-20.good-togo-wrap {
    margin-top: 0 !important;
}

.welcom-userq-modal .congrts-modal-wrap {
    margin-top: 32px;
}

.auto-width-input.arabic_wrapper input,
.auto-width-input.arabic_wrapper {
    font-weight: unset !important;
}

.optional-text-hold {
    direction: ltr;
}

.arabic_wrapper .optional-text-hold {
    margin-left: 12px;
}

.arabic_wrapper .optional-text-hold span.info-icon.info-wrap {
    margin-left: 0px;
}

.passwordchangedsuccess .congrats-modal-text {
    margin-top: 0px;
}

.invoice-plan-page-wrapper .table-wrapper {
    max-width: 100%;
}

.invoice-plan-page-wrapper .table-wrapper .invoicetable tr td:first-child {
    min-width: 115px;
}

.invoice-plan-page-wrapper .table-wrapper .invoicetable tr td:nth-child(6) {
    font-weight: bold;
}

.failed-status {
    background: #981e13;
    color: #fff;
    display: inline-block;
    font-size: 12px;
    line-height: 17px;
    padding: 4px 10px;
    border: 1px solid #981e13;
    border-radius: 4px;
}

.create-new-test-modal .modal-header-top .h3 {
    width: auto;
    max-width: unset;
}

.device-selection-radio.d-flex label {
    border-radius: 10px;
    border: 1px solid #e9e9e9;
    background: #fff;
    padding: 18px 22px;
    margin: 0px 11px 12px;
}

.device-selection-radio.d-flex label p {
    color: #676767;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
}

.device-selection-radio.d-flex label span.checkmark {
    display: none !important;
}

.device-selection-radio label.radio-btn-wrap.active {
    border: 1px solid #9759cb;
    background: #efdcff;
}

.device-selection-radio label.radio-btn-wrap.active p {
    color: #000;
}

.device-selection-radio label.radio-btn-wrap.active .gray-700-svg path {
    stroke: #000 !important;
}

.device-selection-radio label.radio-btn-wrap.active .gray-700-svg rect {
    fill: #efdcff;
}

.radio-img {
    margin-right: 10px;
}

.welcome_tester_userq_modal .gray-text,
.welcome_tester_userq_modal .welcome-userq-text p {
    color: var(--gray-700) !important;
    color: var();
}

.document_not_match_modal .modal-body {
    padding: 28px;
}

.draggable-inner-element-start .added-design-preview-thum {
    background-color: #efdcff !important;
}

.question-image-wrap {
    min-width: 50px;
}

/*** Download chart img css***/
.download-chart-png {
    position: absolute;
    top: 19px;
    right: 20px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

.donwload-chart-ref {
    width: 100%;
}

.chart-hold-wrap {
    min-height: 100%;
    display: flex;
    width: 100%;
}

.download-chart-png .tooltip-wrapper {
    width: auto;
    right: -38px;
    margin: 0;
    top: 32px;
    padding: 12px 12px;
}

.download-chart-png:hover .tooltip-wrapper {
    display: block;
}

.chart-download-with-heading .download-chart-png {
    top: 69px;
    z-index: 1;
}

.single-choice-chart {
    width: auto;
    max-width: max-content;
}

.single-choice-chart .download-chart-png {
    z-index: 1;
}

.multichoice-chart-hold .download-chart-png {
    top: 19px;
}

.rating-scale-chart-hold .download-chart-png {
    top: -50px;
    right: 0;
    z-index: 1;
}

.rating-scale-chart-hold .download-chart-png .tooltip-wrapper,
.likret-scale-chart-wrap .download-chart-png .tooltip-wrapper {
    right: -5px;
    min-width: auto;
}

.rating-scale-chart-hold .download-chart-png .tooltip-wrapper::before,
.likret-scale-chart-wrap .download-chart-png .tooltip-wrapper::before {
    left: 85%;
}

.two-row-legends-box-wrap {
    width: 100%;
    max-width: 100%;
}

.linear-axis-chart .download-chart-png,
.tree-by-tak-wrap .download-chart-png {
    top: 19px;
}

.download-chart-png .hover-inline-svg svg path,
.download-chart-png .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-700);
}

.tasksuccess-outerbox .box-medium,
.screening-chart .box-medium {
    width: 100%;
}

.likret-scale-chart-wrap .download-chart-png {
    top: -34px;
    right: 0;
}

.donwload-chard-ref {
    width: 100%;
}

/***css only for storybook***/
.sb-show-main .multiselectgroup-dropdown label {
    display: none;
}

.sb-show-main .insufficient-responses-wrap {
    display: none !important;
}

.storybook-table {
    max-height: 400px;
}

.sb-show-main .donwload-chart-ref .box-medium {
    max-width: 100%;
    width: 100%;
}

.sb-show-main .test-header-right-data .secondary-btn {
    font-size: 0px;
    width: 40px !important;
    height: 40px !important;
    border-radius: 100%;
    padding: 0;
    justify-content: center;
    margin-left: 20px;
    margin-right: 0px;
    min-height: auto;
    line-height: 0px;
    position: relative;
}

.sb-show-main .test-header-right-data .secondary-btn img {
    margin: 0;
    width: 24px;
    height: 24px;
}

.sb-show-main .test-result-published .primary-medium {
    margin-left: 12px !important;
}

.sb-show-main .app-box.position-relative.chart-download-with-heading .heading {
    min-height: 29px;
}

.sb-show-main .download-chart-png .tooltip-wrapper {
    right: -39px;
}

.tester-login-page-wrapper.arabic_wrapper.fixed-tree-sec.first-click-design-screen .btn-with-icon.btn-with-icon-left {
    text-align: right !important;
    direction: rtl !important;
}

/*** Fixed header layout css***/
.fixed-header-table-layout tbody {
    display: block;
    max-height: 400px;
    overflow-y: auto;
    margin-top: 5px !important;
}

.fixed-header-table-layout {
    overflow: hidden;
}

.fixed-header-table-layout thead,
.fixed-header-table-layout tbody tr {
    display: table;
    table-layout: fixed;
    width: 100%;
}

thead.fixed-thead-shadow.scrolled th {
    padding-bottom: 7px;
}

thead.fixed-thead-shadow.scrolled {
    position: sticky;
    top: 0px;
    background: #fff;
    z-index: 1;
    box-shadow: -1px 5px 10px 1px #dfdfdf;
}

.transaction-history-table {
    overflow: auto;
}

.transaction-history-table table {
    min-width: 610px;
}

.done-with-task-modal .arabic-done-with-task-modal.modal-body {
    text-align: right !important;
    direction: rtl !important;
}

.done-with-task-modal .arabic-done-with-task-modal.modal-body .btn-with-icon-right img,
.done-with-task-modal .arabic-done-with-task-modal.modal-body .btn-with-icon-right svg {
    margin-left: 0;
    margin-right: 8px;
}

.prototype-done-with-task .arabic-done-with-task-modal .secondary-btn,
.prototype-done-with-task .arabic-done-with-task-modal .link-text {
    font-family: "Tajawal", sans-serif !important;
    text-decoration: none;
}

.prototype-done-with-task .arabic-done-with-task-modal .modal-header-top .h3 {
    font-weight: 700 !important;
}

.prototype-done-with-task .modal-dialog {
    max-width: 555px;
    width: calc(100% - 15px);
}

.giveup-link-wrap .link-text {
    font-size: 14px;
}

.done-with-task-buttons {
    margin: 0px -10px;
}

.done-with-task-buttons button {
    margin: 0px 10px;
}

.sb-show-main .add-paymentmethod-wrap .credit-card-field {
    max-width: 460px;
}

.taking-test-button-wrap {
    align-items: center;
}

.first-click-followup-questions .taking-test-button-wrap .primary-large {
    position: static !important;
}

/****Workspace css start****/

.modal-workspace-welcom-info .link-text {
    font-size: 14px;
}

.teamplan-team-list span {
    border: 1px solid #fff;
    position: relative;
    z-index: 2;
    margin-left: -5px;
}

.modal-body .teamplan-team-list .circular-name-icon .top-tooltip::before {
    content: "";
    position: absolute;
    display: block;
    width: 0px;
    left: 50%;
    bottom: 6px;
    border: 11px solid transparent;
    border-bottom: 0;
    border-top: 12px solid var(--gray-900);
    transform: translate(-50%, calc(100% + 5px));
}

.modal-body .teamplan-team-list .circular-name-icon:hover .tooltip-wrapper {
    top: -65px;
    white-space: nowrap;
}

.teamplan-team-list span:first-child {
    margin-left: 0px;
}

.workspace-form-head-wrap {
    display: flex;
    align-items: end;
}

.workspace-form-head-wrap .link-text {
    font-size: 12px;
    margin-left: 12px;
}

.add-workspace-role {
    margin-left: 20px;
    position: absolute;
    right: -72px;
    top: 16px;
    width: 58px;
    margin-left: 20px;
}

.team-workspace-form-info {
    padding: 60px;
    padding-bottom: 150px;
    max-width: calc(100% - 615px);
    position: relative;
}

.pay-as-you-go-link {
    margin-bottom: 45px;
    margin-top: 45px;
}

.team-setting-min-height {
    min-height: calc(100vh - 330px);
}

.invite-mamber-to-workspace .toast-message-wrap.toast-info {
    width: 814px;
    bottom: 86px;
    max-width: 814px;
    margin-top: 32px;
}

.invite-mamber-to-workspace .toast-data a {
    color: #9759cb;
}

.invite-mamber-to-workspace .toast-data a:hover {
    color: #5c208d;
}

.workspace-email-wrap,
.create-workspace-name {
    width: 503px;
}

.workspace-email-wrap .form-group,
.create-workspace-name .form-group {
    width: 503px;
    position: relative;
    max-width: 503px;
}

.workspace-email-wrap .form-group.field-error .caption {
    /* position: absolute;
      bottom: -19px; */
}

.seats-available-count span {
    margin-left: 4px;
}

.teamplan-team-list {
    display: flex;
    align-items: center;
    justify-content: center;
}

.add-member-link span {
    background: #fff;
    border: 0px !important;
    margin-left: -4px !important;
}

.header-team-member-list span {
    border: 1px solid #000;
    position: relative;
    z-index: 2;
    margin-left: -7px;
}

.create_team_workspace-page_wrap {
    display: flex;
    justify-content: space-between;
}

.create-workspace-page-hold {
    padding: 0px !important;
    margin: 0px auto !important;
}

.workspace-payment-section {
    border-left: 1px solid #e9e9e9;
    padding: 60px 45px 60px 45px;
    min-height: calc(100vh - 151px);
    width: 615px;
    background: #fcfcfc;
}

.workspace-payment-section .added-payment-method-cards-wrapper .addedpayment-cards-wrap {
    width: 100%;
}

.workspace-payment-section .added-payment-method-cards-wrapper .checkboxes.radio_btn_class.gender_btn.d-flex.card-radio-wrap {
    width: 100% !important;
}

.workspace-add-card-wrap .added-payment-method-cards-wrapper {
    margin: 0px;
}

/***need to remove css****/
.userworkspace-name-wrap {
    background: #f5f5f5;
    border-radius: 10px;
    padding: 12px 16px;
    display: inline-flex;
    text-align: left;
    margin-bottom: 16px;
    align-items: center;
}

.user-workspace-icon {
    padding: 18px 12px;
    background: #000;
    border-radius: 10px;
    margin-right: 16px;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.user-workspace-info {
    text-align: left !important;
    width: calc(100% - 60px);
}

.modal-workspace-welcom-info .gray-color {
    color: #676767 !important;
}

.user-workspace-info p {
    text-align: left;
    padding: 0px;
}

.researcher-welcome-modal .congrats-modal-text {
    padding-bottom: 0px !important;
}

.researcher-welcome-modal .congrats-modal-text p {
    padding: 0px 0px;
}

.welcome-modal-loader,
.mid-page-loader {
    z-index: 999;
    top: 0px;
    left: 0px;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 20px;
    text-align: center;
    height: calc(100vh - 270px);
}

.welcome-modal-loader .loader_section img,
.mid-page-inner-loader img {
    width: 70px;
}

.monthly-plan {
    margin-right: 8px;
}

.plan-type-wrap .toggle-with-label .toggle_btn_label {
    padding-left: 50px;
}

.plan-offer-wrap {
    margin-left: 4px;
}

.plan-offer-wrap .tag {
    margin-right: 0px;
}

.seats-count-wrap svg {
    margin-right: 3px;
}

.seats-count-wrap {
    margin-top: 4px;
}

.build-team-amount p sub {
    position: relative;
    top: -0px;
}

.workspace-promocode-wrap .accordian-header p {
    color: #9759cb;
}

.workspace-promocode-wrap .accordian-header {
    justify-content: flex-start;
}

.workspace-promocode-wrap .accordion-action {
    margin-left: 4px;
}

.workspace-promocode-wrap .accordion-action svg path {
    stroke: #9759cb;
}

.workspace-promocode-wrap .accordian-small {
    padding-bottom: 32px;
    margin-bottom: 32px;
}

.workspace-promocode-wrap .accordian-small .accordian-body-text {
    margin-top: 20px;
}

.workspace-add-card-wrap .row.add-paymentmethod-wrap {
    margin: 16px 0 0;
    flex-wrap: nowrap;
    align-items: center;
    position: relative;
}

.workspace-add-card-wrap .row.add-paymentmethod-wrap .icon-medium {
    margin-left: 10px;
    top: 20px;
    margin-top: 0px;
    padding-top: 0px;
    position: absolute;
    right: -35px;
    left: auto;
}

.workspace-add-card-wrap .add-paymentmethod-wrap .credit-card-field {
    -webkit-box-flex: 100%;
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
}

.workspace-add-card-wrap .sc-aXZVg.brVAre {
    width: 100%;
}

.workspace-card-info-text svg {
    margin-right: 2px;
}

.emailinput-wrap .user-icon {
    position: absolute;
    top: 16px;
    left: 20px;
    z-index: 1;
}

.workspace-member-repeat.mb-16 {
    margin-bottom: 20px;
    position: relative;
}

.emailinput-wrap .control-label {
    left: 49px;
}

.emailinput-wrap .form-control {
    padding-left: 50px;
}

.emailinput-wrap .circular-name-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    font-size: 14px;
    line-height: 0px;
}

.emailinput-wrap input:focus~label,
.emailinput-wrap textarea:focus~label,
.emailinput-wrap.focused label {
    left: 15px;
}

.emailinput-wrap.read-only-field .user-icon {
    opacity: 0.4;
}

.workspace-promocode-wrap .promocode-field-wrap .input-field label {
    z-index: 1;
}

.workspace-promocode-wrap .promocode-field-wrap {
    margin-top: 12px;
    justify-content: space-between;
    display: flex;
    position: relative;
    margin-left: 0px;
    margin-right: 0px;
}

.workspace-promocode-wrap .promocode-field-wrap .col-md-7 {
    width: calc(100% - 75px);
    max-width: calc(100% - 75px);
    flex: calc(100% - 75px);
    padding-right: 15px;
    padding-left: 0px;
}

.workspace-promocode-wrap .promocode-field-wrap .coupon-code-error {
    margin: 8px 0px 0px;
    font-family: "Inter", sans-serif;
    font-size: 12px;
    line-height: 17px;
    font-weight: 500;
    letter-spacing: 0;
}

.workspace-promocode-wrap .promocode-field-wrap .clear {
    display: none;
}

.workspace-promocode-wrap .promocode-field-wrap .apply-promo-code {
    width: auto !important;
    min-width: 60px !important;
    margin-left: 12px !important;
}

.workspace-page-loader {
    width: 100%;
    text-align: center;
    min-height: calc(100vh - 150px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.form-group.focused .hover-inline-svg svg path,
.form-group.focused .hover-inline-svg svg .change-stroke {
    stroke: var(--gray-700);
}

.password-svg .hover-inline-svg svg path {
    stroke: var(--gray-600) !important;
}

.password-svg .hover-inline-svg .change-stroke {
    stroke: var(--gray-600) !important;
}

.create_team_workspace-page_wrap .invite-mamber-to-workspace {
    max-width: 503px;
    position: relative;
}

.invite-member-top-info.mb-16 {
    margin-bottom: 20px;
}

.workspace-form-head-wrap .link-text {
    width: 100px;
}

.workspace-promocode-wrap .promocode-applied-text p {
    padding: 0px 8px;
    color: #000;
    font-size: 14px;
}

.workspace-promocode-wrap .promocode_description {
    margin: 0px 0px 0px 0px;
}

.workspace-promocode-wrap .promocode_description p {
    margin-top: 8px;
    font-family: "Inter", sans-serif;
    font-size: 12px;
    line-height: 17px;
    font-weight: 500;
    letter-spacing: 0;
}

.plan-type-wrap p {
    color: #ccc;
}

.plan-type-wrap .active-plan {
    color: #000 !important;
}

.workspace-promocode-wrap .promocode-field-wrap button {
    min-width: auto;
    width: 75px;
    justify-content: center;
    margin-left: 0px;
    margin-top: 0px;
    position: absolute;
    right: 0;
    top: 8px;
}

.workspace-promocode-wrap .promocode-field-wrap .field-error .caption {
    position: static;
}

.workspace-promocode-wrap .pay-on-fly-coupon-code-checkout-wrap.mb-32 {
    margin-bottom: 0px;
}

.crad-saved-for-future svg {
    margin-right: 16px;
}

.seats-available-count.d-flex.align-items-center {
    left: calc(100% - 46px);
    width: 200px;
    position: absolute;
}

.compare-plan-heading h2 {
    margin-bottom: 50px;
}

.plan-options-data {
    border: 1px solid #e9e9e9;
    background-color: #fcfcfc;
    border-radius: 20px;
}

.plan-row-hold {
    min-height: 123px;
}

.plan-pricing-row {
    min-height: 46px;
}

.plan-icon span {
    margin: 0 auto;
    display: table !important;
}

.plan-icon span svg {
    width: 40px;
    height: 40px;
}

.plan-options-hold {
    justify-content: center;
}

.plan-options-repeat {
    width: 530px;
    max-width: 530px;
    flex: 530px;
}

.plan-top-area {
    border-bottom: 1px solid #e9e9e9;
    margin-bottom: 32px;
}

.max-seat-col svg {
    margin-right: 4px;
}

.plan-row-right {
    text-align: right;
}

.per-response-text {
    display: block;
    margin-top: -2px;
}

.plan-switch-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
    min-height: 26px;
}

.plan-pricing-row h4 sub {
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 17px;
    position: relative;
    top: -1px;
}

.workspace-add-card-wrap .overline {
    /* display: none; */
    padding-left: 0;
    color: #676767;
}

.workspace-add-card-wrap .card-last-number {
    margin-right: 0;
}

.added-payment-method-cards-wrapper.row:empty {
    display: none;
}

.workspace-billing-sycle-top {
    margin-bottom: 32px;
}

.workspace-payment-section .sc-bcXHqe.NcSfy {
    margin-bottom: 0;
}

/***active plan modal css***/
.active-plan-icon-wrap {
    background: #000;
    display: inline-block;
    width: 60px;
    height: 60px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.new-workspace-active-modal .congrats-modal-text {
    padding-bottom: 32px;
}

.active-plan-modal-btn button {
    width: 260px;
}

.billing-workspace-wrapper table td:first-child {
    min-width: 100px;
    white-space: nowrap;
}

/***team setting css***/
.team-setting-left-sec {
    max-width: 626px;
}

.team-setting-left-sec .tableDropdown {
    padding-right: 0px !important;
}

.member-email-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.team-setting-left-sec .toast-message-wrap .toast-data a {
    color: #9759cb;
}

.team-setting-left-sec .toast-message-wrap .toast-data a:hover {
    color: #5c208d !important;
}

.team-setting-addmoremember-wrap .toast-message-wrap {
    margin-top: 32px;
}

.teamplan-team-list.mt-20:empty {
    display: none;
}

.invite-team-link a {
    font-size: 14px;
    line-height: 25px;
}

.team-setting-left-sec .seats-available-count {
    position: static !important;
    width: auto !important;
}

.workspace-role-col .dropdown {
    margin-left: 42px;
}

.workspace-role-col {
    min-width: 150px;
    justify-content: space-between;
}

.member-table .workspace-role-col {
    min-width: 76px !important;
}

.team-setting-page-text .semibold-font {
    margin-bottom: 8px;
}

.team-setting-table-wrap td {
    font-weight: 500;
    vertical-align: middle;
    padding: 14px 14px 14px 0px;
}

.team-setting-table-wrap .table tbody tr:hover {
    background: unset;
}

.team-setting-table-wrap th {
    padding: 10px 14px 0px 0px !important;
}

.team-setting-workspace-name {
    justify-content: space-between;
    align-items: self-start !important;
}

.team-setting-workspace-name button {
    margin-top: 7px;
}

.team-setting-left-sec table td:nth-child(2) {
    min-width: 138px;
}

.team-setting-left-sec table td:nth-child(2) div.text-center {
    text-align: left !important;
}

.team-setting-workspace-name .form-group {
    width: calc(100% - 93px);
    max-width: calc(100% - 93px);
}

.delete-leave-workspace-wrap.delete-account-section {
    margin-top: 60px;
}

.delete-leave-workspace-wrap.delete-account-section p {
    margin-top: 0;
    margin-bottom: 0;
}

.delete-leave-workspace-wrap.delete-account-section .body-text-2 {
    margin-bottom: 8px;
}

.delete-leave-workspace-wrap.delete-account-section button {
    margin-top: 32px;
}

.delete-leave-workspace-wrap.delete-account-section button.btn-disabled:hover {
    color: var(--gray-500) !important;
    border: 1px solid var(--gray-500) !important;
    background: unset !important;
    cursor: not-allowed;
}

.delete-leave-workspace-wrap.delete-account-section button.btn-disabled svg path {
    stroke: var(--gray-500) !important;
    opacity: 1 !important;
}

.delete-leave-workspace-wrap.delete-account-section button.btn-disabled svg {
    opacity: 1;
}

.delete-leave-workspace-wrap.delete-account-section button:hover svg path {
    stroke: #ffffff;
}

.team-setting-section-hold {
    display: flex;
    justify-content: space-between;
}

.team-setting-right-sec .gray-box {
    max-width: 457px;
    margin-right: 100px;
    margin-top: 0px;
}

.team-setting-right-sec .gray-box.mt-32 {
    margin-top: 0px;
}

.none-for-big-screen {
    display: none;
}

.team-setting-info-repeat .semibold-font {
    margin-bottom: 4px;
}

.page-data-wrapper.team-setting-page-wrapper {
    min-height: calc(100vh - 246px);
}

.page-data-wrapper.team-setting-page-wrapper .workspace-page-loader {
    min-height: calc(100vh - 310px);
}

.plan-pricing-row h4,
.workspace-teampay-rht p {
    text-align: right;
}

.plan-pricing-row h4 sub br,
.workspace-teampay-rht p sub br {
    display: none;
}

.plan-pricing-row sub,
.workspace-teampay-rht p sub {
    line-height: 17px;
}

.plan-pricing-row h4 sub span,
.workspace-teampay-rht p sub span {
    display: block;
}

.workspace-member-email-col {
    align-items: center;
}

.workspace-member-email-col .circular-name-icon {
    margin-right: 12px;
}

.workspace-member-email-col .tooltip-hold .tooltip-wrapper {
    margin: 0;
    z-index: 99;
    left: -39px !important;
    right: auto !important;
    top: 40px;
    white-space: normal;
    max-width: max-content;
    width: auto;
}

.pending-invitation-label {
    color: #9c9c9c;
}

.pending-invitation-label .icon-gray-900-svg- {
    margin-left: 10px;
    min-width: 24px;
    min-height: 24px;
}

.pending-invitation-label .tooltip-wrapper {
    margin: 0;
    width: 266px;
    right: -121px;
    left: auto;
    text-align: center;
}

.accept-workspace-modal .modal-dialog {
    max-width: 586px;
}

.accept-workspace-modal .active-plan-modal-btn button {
    width: auto;
}

.accepet-modal-text {
    text-align: center;
}

.add-member-modal-btn .btn.primary-large {
    min-width: 190.2px !important;
}

.pay-as-you-go-link {
    margin-bottom: 45px;
    margin-top: 45px;
    position: absolute;
    bottom: 0px;
}

.pay-as-you-go-link a {
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
}

/***No access page css***/
.team-setting-workspace-name button {
    width: 74.59px;
}

.team-setting-workspace-name button .micro-loading {
    transform: scale(0.8);
    left: -17px;
    top: -3px;
}

.creating-workspace-loader {
    padding-top: 100px;
    width: 100%;
}

.creating-workspace-loader img,
.creating-workspace-loader-inner img {
    width: 140px !important;
}

.create-workspace-page-hold .creating-workspace-loader-inner {
    min-height: calc(100vh - 250px);
}

.pointer-event-none {
    pointer-events: none;
}

.upgrade-current-workspace .ghost-btn {
    border-radius: 0px;
    border: 0px !important;
    cursor: text;
}

.upgrade-current-workspace .ghost-btn:hover {
    border: 0px !important;
}

.add-member-modal .seats-available-count.d-flex.align-items-center {
    width: auto;
}

.member-team-workspace-info.mt-32 {
    margin-top: 0px;
}

.total-amount-hold .body-text-3 {
    margin-right: 8px;
    text-decoration: line-through #000;
    color: #9c9c9c;
    position: relative;
    bottom: -2px;
}

.total-amount-hold {
    align-items: end !important;
}

.create-workspace-page-hold .accountloading-box .loader_section {
    min-height: calc(100vh - 150px);
}

.nodata-wrap.text-center {
    margin: 32px auto 0;
}

.primary-card-item .delete-account-btn {
    pointer-events: none;
    opacity: 0.5;
}

.card-info-top-space {
    margin-top: -22px;
}

.payment-info-modal .addedpayment-cards-wrap .card-left-side img {
    width: 40px;
}

.payment-info-modal .addedpayment-cards-wrap .card-left-side label .checkmark {
    top: -11px;
}

.frozen-account .dashboard-filter-wrap,
.frozen-account .creat-test-cards-wrapper,
.frozen-account .page-head-right,
.frozen-account .all-test-listing-wrapper,
.frozen-account .publish-fees-required-wrap,
.frozen-account .pricing-info-text,
.frozen-account .test-publish-fee-header-left .body-text,
.frozen-account .test-publish-fee-header-left .tag {
    opacity: 0.3;
    pointer-events: none;
}

.frozen-account .create-test-btn {
    background-color: #ccc;
    border-color: #ccc;
}

.frozen-account-modal .modal-header-top {
    display: none !important;
}

.frozen-icon-wrap svg {
    margin: 0 auto;
    width: 64px;
    height: 64px;
}

.frozen-account-modal .modal-dialog-centered {
    max-width: 477px;
}

.frozen-account .team-setting-left-sec .team-setting-workspace-name,
.frozen-account .team-setting-left-sec .team-setting-page-text,
.frozen-account .team-setting-left-sec .team-setting-table-wrap,
.frozen-account .team-setting-addmoremember-wrap,
.frozen-account .work-space-billing-info-repat,
.frozen-account .workspace-billing-section .selected-payment-card,
.frozen-account .saved-payment-link,
.frozen-account .billing-info-heading,
.frozen-account .mb-40 .body-text-3 {
    opacity: 0.3;
    pointer-events: none;
}

.freez-toast-wrap {
    justify-content: space-between;
}

.disabled-offer .tag {
    background: #cccccc;
    border-color: #cccccc;
}

.leave-workspace-modal-wrap .form-group {
    max-width: 100%;
}

.leave-workspace-modal-wrap .confirm-buttons-wrap .primary-large {
    min-width: 211.94px;
}

.checkout-modal-wrap .addnewbutton-box {
    margin-top: 20px;
}

.remove-invite-member-modal .secondary-large {
    min-width: 166.64px;
}

.setting-button-wrap button {
    margin: 0px 15px;
}

.setting-button-wrap {
    margin: 0px -15px;
}

.p-card-right-footer {
    min-width: 155px;
}

.select-create-dropdown .select-member-dropdown p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ans-list-repeat:focus {
    outline: none;
    box-shadow: unset;
}

.confetti-explosion-screen-0-2-259 {
    width: 100% !important;
}

.moving-animation-hold {
    overflow: hidden !important;
    border-radius: 20px !important;
}

.result-link-wrapper .share-social-links.text-left.d-flex.align-items-center {
    display: block !important;
}

.button-wrap.d-flex.justify-content-center.mt-40.card-sorting-test-buttons {
    margin-top: 32px;
    margin-bottom: 40px;
}

.external-link-icon .gray-50-svg path {
    stroke: #000;
}

.card-middle-link {
    height: 107px !important;
}

.session-loged-out-data {
    min-height: calc(100vh - 119px) !important;
}

.p-card-footer {
    padding-top: 74px !important;
}

.bg-error {
    background: #f5f5f5 !important;
}

.bg-error .ghost-btn {
    display: none;
}

.bg-error .rst__rowToolbar .rst__toolbarButton:nth-child(2) {
    display: none;
}

.bg-error .rst__rowTitle span,
.bg-error * {
    color: #cccccc !important;
}

.bg-error ::placeholder {
    color: #cccccc !important;
    opacity: 1;
}

.bg-error ::-ms-input-placeholder {
    color: #cccccc !important;
}

.arabic_wrapper .tree-test-preview-hold .optional-button .secondary-btn,
.arabic_wrapper .tree-test-preview-hold .optional-button .ghost-btn {
    left: 0px !important;
}

.arabic_wrapper .tree-test-preview-hold .optional-button .ghost-btn {
    margin: 0px 10px;
}

.tree-test-preview-hold .optional-button button:first-child {
    left: 64.8px;
}

.subquestion-chart-inner.large-height .h4 {
    top: 2px;
}

.arabic-summary .col-md-6.summary-right p.info-not-available {
    font-family: "Inter", sans-serif !important;
}

.bd-que-slide-arrow a svg {
    width: 16px;
    height: 16px;
}

.passwordchangedsuccess .congrats-modal-text svg {
    margin: 0 auto 12px;
    width: 60px;
    height: 60px;
}

.tester-test-cards .test-time-data-repeat:last-child .react-loading-skeleton {
    top: 37px !important;
    position: relative !important;
}

.question-dropdown-container .arabic-font .none-for-arabic {
    display: none;
}

.correct-path-repeat.w-100 {
    margin: 1px 0;
}

/***Tree test checkbox****/
.tree-answer-list-wrap .rst__rowLabel .rst__rowTitle button:after {
    display: flex;
    align-items: center;
    height: 24px;
    justify-content: center;
    width: 24px;
    border: 1px solid var(--gray-500);
    border-radius: 5px;
}

.tree-answer-list-wrap .correct-answer-node .correct-answer:before {
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    background: var(--gray-900);
    right: 6px;
    border-radius: 100%;
}

.tree-answer-list-wrap .correct-answer-node .rst__rowLabel .rst__rowTitle button:after {
    border-color: #ff6db1;
    background: #ff6db1;
}

.tree-answer-list-wrap .correct-answer-node .correct-answer:before {
    top: 7px;
    width: 13px;
    height: 10px;
    background-image: url(../img/white-check-mark.svg);
    background-repeat: no-repeat;
    right: 5px;
    background-color: unset;
    position: absolute;
    content: "";
    border-radius: 0;
}

.correct-path-repeat.w-100 {
    margin: 1px 0;
}

.build-tree-task-search-hold.mt-20 {
    margin-top: 12px !important;
}

.result-device-wrap .pie-chart-area svg {
    zoom: 0.9;
}

.arabic_wrapper .rst__rowContents {
    margin: 0;
    padding: 0;
}

.tree-test-task-follow-wrapper .added-question-wrap.mb-32 {
    margin-bottom: 0px !important;
}

.page-data-wrapper.invoice-no-data-wrapper {
    padding: 0;
    margin: 0;
    min-height: calc(100vh - 118px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-data-wrapper.invoice-no-data-wrapper .no-access-page-wrap {
    margin: 0;
    width: 100%;
}

.onfido-modal {
    position: fixed !important;
    top: 0 !important;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 99999 !important;
    max-width: 600px !important;
    margin: 0 auto;
}

.onfido-modal .close-button-onfido {
    position: absolute;
    top: 7px;
    z-index: 9999999;
    background: #fff;
    border-radius: 2px;
    cursor: pointer;
    right: 10px;
    border-radius: 100%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.onfido-modal .close-button-onfido svg {
    width: 24px;
    height: 24px;
}

.onfido-modal-body {
    background-color: #fff;
    border-radius: 10px;
}

.onfido-backdrop-shadow {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: #000;
    opacity: 0.2;
    z-index: -1;
    pointer-events: none;
}

.image_lib_hold.active {
    border-color: #000;
}

.no-img-bg {
    background-color: #f5f5f5;
    border-radius: 20px;
    height: 446px;
}

.onfido-modal:after {
    position: fixed;
    background: rgba(0, 0, 0, 0.5);
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
}

/***only for storybook**/
.sb-show-main .device-list-repeat {
    padding: 40px 40px;
}

.sb-show-main .questioninputbox .tooltip-wrapper.top-tooltip {
    right: -90px;
}

.sb-show-main .questioninputbox .top-tooltip::before {
    left: 63%;
}

.sb-show-main .scalebuttonbox .filter-button-option {
    padding: 4px 35px;
    font-size: 14px;
}

.arabic_wrapper .survey-question-added-info {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 500;
}

.tester-page-selected-img-wrap img {
    max-height: 600px;
    border-radius: 20px;
}

.expired-modal h3 {
    color: var(--danger-red-200);
}

.arabic_wrapper_main .ar-textarea-wrap.ai-radio-wrap .textarea-form-group {
    text-align: right !important;
    direction: rtl !important;
}

.arabic_wrapper_main .ar-textarea-wrap.ai-radio-wrap .textarea-form-group textarea {
    padding-right: 16px;
}

.arabic_wrapper_main .ar-textarea-wrap.ai-radio-wrap .textarea-form-group label {
    left: auto;
    right: 16px;
}

.radio-img svg {
    width: 32px !important;
    height: 32px !important;
}

.radio-img svg path {
    stroke: #000 !important;
}

.box-popup .box-small {
    padding: var(--xl) var(--m);
    background-color: var(--gray-100);
}

.box-popup .box-title {
    display: none;
}

.box-popup .tester-doctype-repeat p {
    padding-left: 0px !important;
    margin-top: 15px;
}

.form-group .caption.green-color {
    margin-top: 0px;
    color: #378b10;
}

.box-popup .tester-doctype-repeat svg {
    width: 32px;
    height: 32px;
}

#date_of_birth.formbox.w-460 {
    max-width: 460px;
}

.sm-label.full.d-flex-radiobox label .radio-btn-label,
.sm-label .radio-btn-label {
    font-size: 16px !important;
    font-weight: 400 !important;
}

.bd-label.full.d-flex-radiobox label .radio-btn-label,
.bd-label .radio-btn-label {
    font-size: 16px !important;
    font-weight: 500 !important;
}

.icon-bg svg,
img.icon-bg {
    width: 60px;
    height: 60px;
}

.progress-max .progress-bar {
    width: 100%;
    max-width: 460px;
}

.w-fix .multiselectlist-dropdown-box.members-multiselect-dropdown,
.w-fix .MuiFormControl-root.MuiTextField-root {
    max-width: 460px;
}

.w-fix .MuiInputLabel-root.MuiInputLabel-formControl {
    background-color: #fff;
    padding: 0px 8px;
}

.modal-center-list {
    text-align: left;
    max-width: 90%;
    display: block;
    margin: 0px auto;
}

.tester-id-verified-modal-data.width-md {
    max-width: 90%;
    display: block;
    margin: auto;
}

.select-create-dropdown .multiselectlist-dropdown-selected-values-container .chip {
    padding-left: 16px !important;
}

.select-member-dropdown input::placeholder {
    color: var(--gray-600);
}

.multiselectlist-dropdown-readonly .multiselectlist-dropdown-box-container .select-member-dropdown p.body-text {
    color: var(--gray-500);
}

.profile-completion-steps {
    display: flex;

    padding-bottom: 14px;
    position: relative;
    justify-content: space-between;
}

.border-bottom-gray {
    border-bottom: 1px solid var(--gray-400);
    margin-bottom: 12px;
}

.overflow-scroller .pink-bg::before,
.overflow-scroller .gray-bg::before {
    content: "";
    position: absolute;
    width: 160px;
    height: 2px;
    border-top: 1px solid var(--gray-400);
    top: 20px;
    left: 0px;
    z-index: 1;
}

.profile-completion-steps.overflow-scroller .steps-link:nth-child(1) div::before {
    content: "";
    position: absolute;
    width: 80px;
    height: 2px;
    border-top: 1px solid var(--gray-400);
    top: 20px;
    left: 80px;
    z-index: 1;
}

.profile-completion-steps.overflow-scroller .steps-link:nth-child(1) div {
    margin-left: 0px;
}

.profile-completion-steps.overflow-scroller .steps-link:nth-child(8) div::before {
    content: "";
    position: absolute;
    width: 40px;
    height: 2px;
    border-top: 1px solid var(--gray-400);
    top: 20px;
    left: 0px;
    z-index: 1;
}

.profile-completion-steps.overflow-scroller .steps-link:nth-child(8) div {
    margin-right: 0px;
}

.form-group .caption.green-color {
    color: #378b10;
    margin-top: 0px;
}

.overflow-scroller .pink-bg,
.overflow-scroller .gray-bg {
    max-width: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 2;
    cursor: pointer;
    position: relative;
    width: 120px;
    height: 82px;
}

.overflow-scroller .pink-bg .caption,
.overflow-scroller .gray-bg .caption {
    text-align: center;
    margin-top: 10px;
}

.overflow-scroller .pink-bg .caption {
    color: var(--primary-pink-200);
}

.overflow-scroller .pink-bg .inline-svg-small {
    width: 38px;
    height: 38px;
    padding: 10px;
    background-color: var(--primary-pink-200);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--primary-pink-200);
}

.overflow-scroller .gray-bg .inline-svg-small {
    width: 38px;
    height: 38px;
    padding: 10px;
    background-color: var(--gray-200);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    transform: translate(1px, 1px);
}

.overflow-scroller .gray-bg .gray-50-svg path {
    stroke: var(--gray-700) !important;
}

.profile-completion-steps .active-step::after {
    content: "";
    position: absolute;
    border-bottom: 10px solid #000000;
    border-left: 10px solid transparent;
    border-top: 10px solid transparent;
    border-right: 10px solid transparent;
    bottom: -15px;
    background-color: transparent;
}

.active-step .caption {
    font-weight: 700;
}

.page-data-wrapper:has(.border-bottom-gray) {
    padding: 0px !important;
}

.overflow-scroller {
    overflow-x: auto;
    scrollbar-width: none;
    position: relative;
    overflow-y: hidden;
}

.overflow-scroller::-webkit-scrollbar {
    width: 0;
    height: 0;
    background: transparent;
}

.overflow-scroller::-webkit-scrollbar-thumb {
    background: transparent;
}

#apps.formbox.tester-apps-select {
    max-width: 460px;
}

.border-bg {
    width: 40px;
    height: 40px;
    display: block;
    background: conic-gradient(var(--primary-pink-200) var(--progress),
            transparent 0deg);
    border-radius: 50%;
    z-index: 2;
}

a.steps-link:hover {
    text-decoration: none;
    color: initial;
}

a.steps-link {
    color: var(--gray-900);
}

.sub.disable-dec-btn,
.add.disable-max-btn {
    background-color: var(--gray-100);
    cursor: not-allowed;
}

.sub.disable-dec-btn img,
.add.disable-max-btn img {
    opacity: 0.3;
}

svg.danger-red-200 path {
    stroke: var(--danger-red-200);
}

.formbox .multiselectlist-dropdown-box-container {
    border: 1px solid var(--gray-600);
}

.formbox .multiselectlist-dropdown-readonly .multiselectlist-dropdown-box-container {
    border: 1px solid var(--gray-500) !important;
}

.formbox .multiselectlist-dropdown-readonly .multiselectlist-dropdown-box-container.project-selected .multiselectlist-dropdown-dropdown-icon-container .hover-inline-svg svg path {
    stroke: var(--gray-500);
}

.formbox .multiselectlist-dropdown-readonly .multiselectlist-dropdown-box-container .multiselectlist-dropdown-dropdown-icon-container .hover-inline-svg svg path {
    stroke: var(--gray-500);
}

.multiselectlist-dropdown-readonly:hover {
    cursor: not-allowed;
}

.formbox.d-flex-radiobox .bold label .radio-btn-label {
    font-weight: 500 !important;
}

.profile-form-group .checkbox-wrap.checkbox-label {
    width: fit-content;
}

.profile-form-group .multiselectlist-dropdown-box-container .body-text {
    color: var(--gray-900);
}

.width-180.d-flex-radiobtn {
    min-width: 180px;
}

#date_of_birth label.MuiFormLabel-root {
    background: var(--gray-50);
    padding: 0 8px;
    left: -2px;
}

/* Uat special */
#date_of_birth .date-picker-field.active-field label.MuiFormLabel-root {
    left: 10px;
}

#date_of_birth label.MuiFormLabel-root {
    background: var(--gray-50);
    padding: 0 8px;
    left: -6px;
}

.label-gray label {
    color: var(--gray-700) !important;
}

/* .tester_sign_up_step_row .progress-max .login-form-inner-data {
    min-height: calc(100vh - 470px);
} */
.mb-27 {
    margin-bottom: 27px;
}

.inc-dec-counter .sub.disable-dec-btn:hover,
.inc-dec-counter .add.disable-max-btn:hover {
    background-color: var(--gray-100);
}

.dark-text {
    color: #000000 !important;
}

.progress-max #spoken_language.full.d-flex-radiobox,
.progress-max .d-flex-radiobox.mb-12 {
    margin-bottom: 16px !important;
}

.progress-max #pet_ownership,
.progress-max #banks {
    margin-top: 4px;
}

.full-width {
    width: 100%;
}

.pl-30 {
    padding-left: 30px;
}

.MuiPickersPopper-root.MuiPopper-root {
    border-radius: 25px;
    overflow: hidden;
}

.box-popup .box-small .caption {
    display: inline-block;
    line-height: 22px;
    margin-top: var(--m);
}

.sign-up-btn-wrap .empty-span {
    display: none;
}

/* Recruitment Modal UI */
#recruitment-modal .form-group {
    max-width: 100%;
}

.project-card-hold.create-project-box .project-card-wrap {
    cursor: pointer;
    background-color: #d9d9d9;
}

.recruit-only-tab {
    background-color: var(--gray-100);
    border-radius: var(--m);
    border: 1px solid var(--gray-400);
    padding: var(--2XL);
}

.ml-40 {
    margin-left: 40px;
}

.mb-4x {
    margin-bottom: 4px;
}

.mr-20 {
    margin-right: 20px !important;
}

.small-search-field .form-control {
    max-height: 42px;
    min-height: 42px;
    height: 42px;
}

.tab-recruitment-container {
    display: flex;
    justify-content: end;
    align-items: center;
}

.recruit-radio .radio-btn-label {
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
}

.tableDropdown .d-flex {
    margin-right: 25px;
}

.tableDropdown .d-flex .caption.medium-font {
    text-wrap: nowrap;
    white-space: pre;
}

.tableDropdown.d-flex.align-items-center {
    justify-content: flex-end;
}

#recruitment-modal .radio-btn-wrap,
#recruitment-modal .checkbox-wrap {
    margin-bottom: 4px;
}

#recruitment-modal .label-gray.d-flex .radio-btn-label,
#recruitment-modal .label-gray.d-flex .radio-btn-label a.link-text {
    font-size: 12px;
    font-weight: 500;
}

.terms-wrapper {
    max-width: 887px;
    margin: 0 auto;
}

.terms-wrapper .body-text-3 {
    line-height: 22px;
}

.text-list {
    padding-left: 14px;
}

.text-list li {
    color: var(--gray-700);
    font-size: 14px;
    line-height: 22px;
    font-weight: 500;
}

.create-test-card:hover .card-placeholder-img .recruitment-placeholder .change-hover-pink {
    fill: #FF6DB1;
    stroke: black;

}

.create-test-card:hover .card-placeholder-img .recruitment-placeholder .change-hover-yellow {
    fill: #F2C690;
    stroke: black;

}

#date_of_birth .date-picker-field input::placeholder {
    font-family: "Inter";
}

.page-head-right.dashbaord-header-right-with-search.create-pro-btn .react-loading-skeleton {
    margin-right: 10px !important;
}

.read-only-dropdown .css-tlfecz-indicatorContainer {
    cursor: default;
}

.multichoice-chart-dropdown-download-hold .download-chart-png {
    top: 90px;
}

.full-height-loader {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* multiselect cap css */
.multiselect-cap-dropdowns {
    width: 122px;
    margin-left: 12px;
}

.column-dropdown.ml-64 {
    margin-left: 64px;
}

.questioninputbox .multiselect-cap-dropdowns .dropdown-container.form-group.input-field.mb-0.focused {
    min-width: 122px;
    margin-left: 0px;
}

.multiselect-cap-dropdowns:has(.read-only-dropdown) {
    cursor: not-allowed;
}

.read-only-dropdown .css-1wy0on6 {
    cursor: not-allowed;
}

.questioninputbox .multiselect-cap-dropdowns .dropdown-container.form-group.input-field.mb-0 {
    min-width: 122px;
    width: 122px;
}

.arabic_wrapper .multiselect-cap-dropdowns .dropdown-container .dropdown-field {
    min-width: 122px !important;
    width: 122px;
}

.font-14 p {
    font-size: 14px;
}

.line-22 p {
    line-height: 22px;
}

.toggle-btn-relative {
    display: flex;
    align-items: center;
}

.toggle-btn-relative .toggle-btn-wrap .slider {
    position: relative;
}

.ml-12 {
    margin-left: 12px;
}

.radio-btn-relative {
    display: flex;
    align-items: start;
}

.radio-btn-relative .radio-btn-wrap {
    padding-left: 0px;
}

.radio-btn-relative .radio-btn-wrap .checkmark {
    position: relative;
}

.disable-sub-mc-intruction-heading p {
    color: var(--gray-500) !important;
}

.read-only-dropdown .singleselect-dropdown .css-1s2u09g-control,
.read-only-dropdown .singleselect-dropdown .css-1pahdxg-control {
    cursor: not-allowed !important;
}

.read-only-dropdown .css-tlfecz-indicatorContainer {
    cursor: not-allowed !important;
}

.toggle-btn-wrap.disabled-toggle .slider {
    cursor: not-allowed;
    pointer-events: none;
}

.select-create-dropdown .item-selected-icon p.body-text {
    padding-left: 30px;
    padding-right: 30px;
    max-width: calc(100% - 65px);
}

.arabic_wrapper .ml-12 {
    margin-right: 12px;
    margin-left: 0px;
}

.arabic_wrapper .column-dropdown.ml-64 {
    margin-left: 0px;
    margin-right: 64px;
}

.arabic_wrapper .multiselect-cap-dropdowns {
    margin-left: 0px;
    margin-right: 12px;
}

.column-dropdown.align-items-center {

    justify-content: space-between;
}

.custom-google-signin.tester-google-signin iframe {
    max-width: 100px;
}

.multiselectlist-dropdown-box.members-multiselect-dropdown {
    width: 100% !important;
}

/* Screen Recording css */
.ml-12 {
    margin-left: 12px;
}

.white-tag {
    background-color: #fff;
    border: 1px solid #e9e9e9;
    color: var(--gray-900);
}

.tag.white-tag svg path {
    stroke: var(--gray-900);
}

.recording-option .slider.round {
    position: relative;
}

.not-available .body-text {
    color: #cccccc;
}

.not-available {
    pointer-events: none;
}

.tag.purple-200-tag {
    background-color: var(--secondary-purple-200);
    color: var(--gray-50);
    padding: 3px 12px;
    border-color: var(--secondary-purple-200);
}

.mr-8 {
    margin-right: 8px;
}

.min-w-100 {
    min-width: 100px;
}

.min-w-120 {
    min-width: 120px;
}

.min-w-150 {
    min-width: 150px;
}

.min-w-240 {
    min-width: 240px;
}

.min-w-150 p.body-text-3 {
    white-space: pre;
}

.overflow-x-auto {
    overflow-x: auto;
}

.mr-32 {
    margin-right: 32px;
}

.mr-24 {
    margin-right: 24px;
}

.full-modal .modal-dialog {
    max-width: 992px;
}

.px-16 {
    padding-left: 16px;
    padding-right: 16px;
}

.py-12 {
    padding-top: 12px;
    padding-bottom: 12px;
}

.filter-box {
    background-color: #fcfcfc;
    border: 1px solid var(--gray-400);
    border-radius: var(--m);
}

.mr-4x {
    margin-right: 4px;
}

.w-180 {
    width: 180px;
}

.full-height-loader {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nda-modal-text .text-pink {
    color: #ff6db1 !important;
}

.text-pink {
    color: #ff6db1;
}

.nda-agreement-modal .modal-body.p-28 {
    padding: 28px !important;
}

.full-screen {
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-animation span svg {
    animation: rotate 3s linear infinite;
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.gray-900-fill-svg path {
    fill: #000;
}

#video-modal-loader {
    height: 420px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn.active-play-btn {
    background: #676767 !important;
    border-color: #676767 !important;
}

.members-multiselect-dropdown .multiselectlist-dropdown-selected-values-container .chip.chip-icon-right:has(.circular-name-icon) {
    padding-left: 8px;
}

.payment-method-box {
    width: 354px;
    border: 1px solid #E9E9E9;
    border-radius: 16px;

}

.payment-methods-wrapper {
    display: flex;
    max-width: 1110px;
    justify-content: space-between;
}

.payment-box-img {
    border-bottom: 1px solid #E9E9E9;
}

.card-amount-text {
    font-size: 64px;
    line-height: 77px;
}

.px-20 {
    padding-left: 20px;
    padding-right: 20px;
}

.prefilled-box {
    background-color: var(--gray-100);
    border: 1px solid var(--gray-400);
    border-radius: 10px;

}

.warning-yellow-200-text {
    color: #ffb800;
}

.dashboard-filter .dropdown-container {
    min-width: 278px;
}

.warning-yellow-200-text {
    color: #ffb800;
}

.answer-error .correct-asnwer-div {
    color: var(--danger-red-200) !important;
}

.ml-8 {
    margin-left: 8px;
}

.correct-asnwer-div .tooltip-hold.ml-8 .tooltip-wrapper.top-tooltip {
    z-index: 3;
    left: -189px;
    margin-top: 12px;
}

.prototype-task-followup-questions .ans-list-wrap .form-group label:has(input) {
    z-index: 1;
}

.dashboard-filter .multiselectgroup-dropdown .css-11unzgr>div,
.dashboard-filter .multiselectgroup-dropdown .css-4ljt47-MenuList>div,
.dashboard-filter .css-26l3qy-menu>div>div {
    display: flex !important;
    align-items: center;

}

.dashboard-filter .multiselectgroup-dropdown .checkbox-wrap {
    display: inline-flex !important;
}

.accountnaviagtion-outer .active a {
    display: flex;
    align-items: center;
}

.tests-counter span {
    line-height: 1;
}

.dashboard-filter {
    display: flex;
    width: 100%;
    justify-content: end;
}

.list-unstyled {
    list-style: none;
}

.custom-scale-modal.full-modal .modal-dialog {
    max-width: 515px;
}

.text-black {
    color: #000 !important;
}

.gray-500-svg path {
    stroke: #ccc !important;
}

.heading-row {
    width: 95%;
}

.card-sorting-test-wrap .radio-btn-wrap {
    margin-bottom: 0px;
}

.cardsorting-wrap-mid-data .device-selection-radio.d-flex label {
    margin-bottom: 0px;
}

.custom-likert-scale-form .form-group {
    max-width: 100%;
}

.ml-32 {
    margin-left: 32px;
}

.cardsorting-wrap-mid-data .device-selection-radio.justify-content-start.d-flex.mt-20 {
    width: 100%;
}

.publish-modal-wrap .body-text-3 .body-text-3 {

    padding-bottom: 1px;
    border-bottom: 1px solid;
    text-decoration: none;
    margin-left: 0px;
}

.ai-modal-btns .btn.primary-large:not(.navy-btn) {
    margin-left: 20px;
}

.overflow-hidden {
    overflow: hidden;
    width: 100%;
}

.searchboxIcons {
    margin-left: 6px;
    display: flex;
    width: auto;
    align-items: start;
    color: var(--primary-pink-200);
    font-size: 14px !important;
    line-height: 24px;
    justify-content: flex-end;
}

.searchboxIcons svg {
    margin-right: 6px;
    max-width: 16px;
}

.searchboxIcons svg path {
    stroke: var(--primary-pink-200) !important;
}

.searchboxIcons:has(span) {
    width: 25%;
}

.searchboxText {
    font-size: 14px !important;
}

.mr-16 {
    margin-right: 16px;
}

.ml-20 {
    margin-left: 20px;
}

.scalebuttonbox.rtldirection {
    direction: rtl;
    text-align: right;
}

.scalebuttonbox.rtldirection>span {
    margin-right: 10px;
    margin-left: 0px;
}

.ltrdirection {
    direction: ltr;
}

.arabic_wrapper .likert-scale-length-wrap.ltrdirection {
    flex-direction: row-reverse;
}

.arabic_wrapper .likert-scale-length-wrap.ltrdirection .scalebuttonbox span {
    margin-right: 10px;
}

.scalebuttonbox.rtldirection {
    direction: ltr;
}

.custom-likert-scale-form .input-position-relative.arabic_wrapper+.caption {
    text-align: right;
}

.toast-message-wrap.gray {
    background-color: var(--gray-200);
}

.toast-message-wrap.gray .caption {
    color: var(--gray-700);
}

.toast-message-wrap.gray svg path {
    stroke: var(--gray-900);
}

.points-outer.likert-scale-length-wrap.ltrdirection {
    align-items: center;
}

.custom-likert-scale-form .input-position-relative.arabic_wrapper+.caption {
    text-align: right;
}

.likert-scale-taking-test-view .likert-option-right.likert-option-right-single {

    width: 100% !important;
}

.create-test-preview-area-inner img {
    min-height: 162px;
}

.guide-link-container .external-link-icon svg path {
    stroke: var(--gray-700) !important;
}

.likertscale_single_results_question .accordion-action {
    display: none !important;
}

.likertscale_single_results_question .accordian-header {
    pointer-events: none;
}

.likertscale_single_results_question .accordian-wrapper {
    border-bottom: none;
}

.logic-dropdown-readmode .dropdown-container .css-tlfecz-indicatorContainer {
    width: 180px;
    z-index: 2;
    height: 55px;

}

.logic-dropdown-readmode .dropdown-container.focused .css-1gtu0rj-indicatorContainer {
    width: 180px;
    z-index: 2;
    height: 55px;

}

.small-dropdown.add-logic-dropdown .dropdown-container .css-tlfecz-indicatorContainer {
    width: 180px;
    z-index: 2;
    height: 55px;
}

.question-result-data .accordian-body-text .table tr:last-child {
    border-bottom: none;
}

.question-result-data .card-sort-result-table-data .by-user-table-card .table .new-added-by-user-row {
    border-bottom: none;
}

.question-result-data .card-sort-result-table-data .by-user-table-card .table .new-added-by-user-row td:nth-child(4) {
    border-bottom: 1px solid var(--gray-400);
}

.question-result-data .card-sort-result-table-data .by-user-table-card .table .new-added-by-user-row td:nth-child(5) {
    border-bottom: 1px solid var(--gray-400);
}

.question-result-data .card-sort-result-table-data .by-user-table-card .table .new-added-by-user-row td:nth-child(6) {
    border-bottom: 1px solid var(--gray-400);
}

.question-result-data .card-sort-result-table-data .by-user-table-card .table .new-added-by-user-row td:nth-child(7) {
    border-bottom: 1px solid var(--gray-400);
}

.likert-agg-tbl-box.white-text .caption {
    color: #fff;
}
.toast-data p{
    font-size: 14px;
    line-height: 22px;
    font-weight: 500;
}
.chart-info-repeat p.arabic-font span{
    display: inline-flex;
    margin-right: 2px;
}
.chart-info-repeat p.arabic-font{
    direction: rtl;
    text-align: right;
}
.arabic-chart .download-chart-png {
    left: 20px;
    right: auto;
}
.arabic-chart .chart-info-repeat{
    flex-direction: row-reverse;
}
.arabic-chart .chart-info-repeat span{
    margin-right: 0px;
    margin-left: 8px;
} 
.add-othrnone-survey-btn button.add-other-btn .tooltip-wrapper{
    max-width: 210px;
    left: -40px;

}
.result-navigation{
    border-bottom: 1px solid var(--gray-400);
    padding: 16px 20px 0px 20px;
    margin-bottom: 0;
    position: sticky;

    background: var(--gray-50);
    z-index: 2;
}
.tree-testing-correct-ans-wrap .curt-ans-left-side{
    background: #fcfcfc;
    border: 1px solid var(--gray-400);
    padding: var(--l) var(--xl);
    border-radius: var(--m);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.test-summary-modal-wrap.modal .logic-dropdown-readmode .css-1hb7zxy-IndicatorsContainer{
    position: absolute;
}
.test-summary-modal-wrap.modal .logic-dropdown-readmode .dropdown-container .css-tlfecz-indicatorContainer{
    display: flex;
    justify-content: end;

}
.test-summary-modal-wrap.modal .logic-dropdown-readmode .css-1wy0on6{
    position: absolute;
    top: 0px;
}
.test-summary-modal-wrap.modal .logic-dropdown-readmode .dropdown-container .css-tlfecz-indicatorContainer{
    display: flex;
    justify-content: end;

}
#free-flow-wrapper .prototype-methodology .medium-box-wrapper{
    width: 100%;
  
}
#free-flow-wrapper .likert-scale-taking-test-view.prototype-methodology{
    width: 100%;
}
#free-flow-wrapper .ranking-scale-taking-test-view.prototype-methodology:has(.rank-dragable-list-wrap){
    width: 100%;
    max-width: 650px;
    margin: 0px ;
}
.first-click-followup-questions .taking-test-page-height:has(.likert-scale-taking-test-view){
    min-height: 600px;
}
.report-type-modal{
    z-index: 1051;
}
.report-type-modal .modal-body{
   
    border-radius: 20px;
    
}
.report-recruit-modal-wrapper {
z-index: 1051;
}
.mr-12{
margin-right: 12px;
}
.arabic_wrapper .min-max-option-container .css-b62m3t-container{
    direction: ltr;
}
.p-24{
    padding: 24px;
}
.recruit-participants-modal .modal-dialog {
    max-width: 976px;
}
.summary-box.participants-selection-holder{
    height: 100%;
    margin-bottom: 0px;
}
.demographics-row{
    display: flex;
    justify-content: space-between;
    padding: 12px 0px;
    margin-top: 14px;
    border-bottom: 1px solid #E9E9E9;
}
.demographics-row:first-child{
    margin-top: 0px;
}
.demographics-row .body-text-3{
    max-width: 280px;
    padding-left: 20px;
    text-align: right;
}
.gray-text,
.gray-color,
.grey-color {
    color: var(--gray-700) !important;
}
.pay-on-fly-promo-code-hdr.demographics-box{
    border-bottom: none;
}
.confirmation-modal-wrap.full-modal.recruitment-success-modal .modal-dialog{
max-width: 600px;
}
.recruitment-success-modal .modal-header-top{
    display: none;
}
.icon-80 svg{
    height: 80px;
    width:80px;
}
.request-history-box{
    padding-left: 20px;
    border-left: 2px solid #E9E9E9;
    margin-top: 20px;
}
.history-wrapper > .request-history-box:first-child {
    margin-top: 0px;
}
.request-history-row .summary-right-sec-wrap{
margin-top: 0px;
text-align: right;
}
.mr-4x{
    margin-right: 4px;
}
.confirmation-modal-wrap.full-modal.medium-modal .modal-dialog{
max-width: 600px;
}
.p-12{
    padding: var(--m);
}

.confirmation-modal-wrap.full-modal .d-flex.tab-column{
    width: 100%;
}