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, .3);
    background-color:var(--gray-700);
}
.modal-open .support-button, .modal-open .support-button:hover{
    margin-right:5px;  
  }

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;

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

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:33px;
    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-2{
    font-size:16px;
    line-height:24px;
    font-weight:400;	
}

.body-text-3{
    font-size:14px;
    line-height:25px;
    font-weight:400;	
}

.caption{
    font-family: 'Inter', sans-serif;	
    font-size:12px;
    line-height:17px;
    font-weight:500;
    letter-spacing:0; 	
}

.overline{
    font-family: 'Inter', sans-serif;	
    font-weight: 600;
    font-size: 12px;
    line-height: 17px;	
    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:0px !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: 19px;
    height: 19px;
}

.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);  
}
.secondary-btn:hover .gray-50-svg path, .secondary-btn:hover .gray-900-svg path{
    stroke:var(--gray-50); 
}
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; 
}

.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: .4s;
    transition: .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: .4s;
    transition: .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:hover input ~ .checkmark {
    /*background-color: var(--gray-500);*/ 
}

.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:hover input ~ .checkmark {
    /*background-color: var(--gray-500);*/
}


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

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

.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.focused .css-tlfecz-indicatorContainer svg path{
    /**fill: var(--gray-700) !important;**/
}



.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{
    padding:0px !important;	
}

.css-11unzgr > div, .css-4ljt47-MenuList > div{
    font-weight: 500 !important;
    font-size: 16px !important;
    line-height: 25px !important;
    color: var(--gray-900) !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{
    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: 22px;	
}  

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

.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;
}
.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: 6px;
    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;
}
.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 {
    background: var(--danger-red-200);
}
.toast-data a {
    color: var(--gray-50);
    text-decoration: underline;
    margin-left: 2px;
}
.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***/ 



/***Header css start here ***/
.hdr-workspace-data .dropdown.dropdown{
  display: flex;
  align-items: center;
}
.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;
}

.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-600);
}
.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;
    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: 80px;
    display: flex;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 99;
}

.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;
}
.header .container {
    max-width:1920px;
    padding: 0;
}
.hdr-workspace-data {
    display: flex;
    align-items: center;
    padding-left: 32px;
    padding-right: 0;
    border-left: 1px solid var(--gray-700);
    margin-left: 32px;
}
.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:52px;	
}
.header-link img, .header-link svg{
    margin-right: 12px;
}

.workspace-dropdown {
    padding-right: 19px;
    display: flex;
    align-items: center;
}
.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;
} 
.header .dropdown-menu{
    top: 54px !important; 
    left: -40px !important;
    padding: 0 !important;
    box-shadow: none !important;
    width: auto;
    transform: unset !important;
    white-space: nowrap;
    background-color: unset;
}

.header .dropdown.show button {
    color:var(--gray-50) !important;
    background: unset !important;
    border-radius: 0px !important;
}

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



.header .hamburger-items .dropdown-item:hover svg path{
    stroke:var(--gray-50) !important;	
}

.header .hamburger-items .dropdown-item svg{
    margin-right:15px;	
}
.header .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: 57px !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-right: 47px;
    margin-left: 0;
}

.logged-in-user-info{
 margin-right: 27px;
 align-items: center; 
}
/***Header css end here ***/




/****Dashboard components css***/
.dashboard-sub-head-wrap {
    margin-bottom: 32px;
}

.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:40px auto 80px;
    width: 100%;
    padding:0px 120px;
    min-height: calc(100vh - 270px);
}

.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);
}
.creat-test-cards-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin:0px -9px;
}
.creat-test-card-repeat {
    padding: 9.5px; 
    width: 25%;
}

.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;
}
.page-heading-wrap{
    padding-bottom: 40px;
    margin-bottom: 35px;
    border-bottom: 1px solid #E3E3E3;
}


.all-test-listing-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 5px -9px 0;
}

.test-list-repeat-wrap {
    width: 25%;
    padding: 9.5px;
}

.test-list-data {
    background: var(--gray-200);
    border-radius: 20px;
    padding: 20px; 
    height: 247px;
    position:relative; 
    overflow:hidden;
    min-width: 300px;
}

.test-list-data a{
    text-decoration:none !important;	
}

.test-list-data .position-relative{
    z-index:1;	
}
.test-list-data:after {
    content: "";
    position: absolute;
    width: 200px;
    height: 130px;
    background: #FFE2C0;
    opacity: 0.85;
    filter: blur(37.3397px);
    -webkit-backdrop-filter: blur(37.3397px);
    border-radius: 20px;
    left: -13.83%;
    right: 53.41%;
    top: 47.44%;
    bottom: 0px;
    transition:0.3s;
}
.test-list-data:hover:after{
    width: 282px;
    height:240px;	
    background: #FFE2C0;
    filter: blur(37.3397px);
    -webkit-backdrop-filter: blur(37.3397px);
    border-radius: 20px;
    left: -17.84%;
    right: 35.38%;
    top: 24.89%;
    bottom: -27.9%;	
}

.live-test:after {
    content: "";
    position: absolute;
    width: 200px;
    height: 130px;
    background: #FF9BCA;
    opacity: 0.85;
    filter: blur(37.3397px);
    border-radius: 20px;
    left: -13.83%;
    right: 53.41%;
    top: 47.44%;
    bottom: 0px;
}

.live-test:hover:after{
    width: 282px;
    height:240px;	
    background: #FF9BCA;
    filter: blur(37.3397px);
    border-radius: 20px;
    left: -17.84%;
    right: 35.38%;
    top: 24.89%;
    bottom: -27.9%;	
}

.completed-test:after{
    content: "";
    position: absolute;
    width: 200px;
    height: 130px;
    background: #BF8EE8;
    opacity: 0.85;
    filter: blur(37.3397px);
    left: -13.83%;
    right: 53.41%;
    top: 47.44%;
    bottom: 0px;	
}

.completed-test:hover:after{
    width: 282px;
    height:240px;	
    background: #BF8EE8;
    filter: blur(37.3397px);
    border-radius: 20px;
    left: -17.84%;
    right: 35.38%;
    top: 24.89%;
    bottom: -27.9%;	
}

.test-footer-data {
    padding-top:0px;
}
.test-list-repeat-wrap .all-test a {
    display: inline-block;
    width: 100%;
    position:relative; 
    z-index:1;
}
.card-middle-link {
    padding-top: 34px;
    padding-bottom: 20px;
    min-height:57px;
}
.card-load-mid{
    margin-top:34px;
    margin-bottom:10px;
    min-height:40px;  
}
.card-load-mid span{
    margin:0px !important;
}
.card-load-mid .react-loading-skeleton{
    margin-top:0px !important;
}
.test-list-head .subtitle-2 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width:100%; 
}

.test-list-head .heading .react-loading-skeleton{
  /* width:100% !important;
  display: block;
  background:black;    */
}
.researcher-test-card .tag-wrap{
    display: inline-flex;
    align-items: center;
    width: 100%;
}
.researcher-test-card .tag-wrap .tag{
    margin: 0px 4px;
    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;
} 
.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 .caption{
    font-size: 12px;
    line-height: 17px;
}
.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-family: 'sk-modernistbold';
    font-size: 24px;
    line-height: 29px;
    color:var(--gray-600);
    padding: 0px 10px;
    margin-right: 40px;
    cursor: pointer;
    border-bottom: 4px solid transparent;
    padding-bottom: 18px;
    display: inline-flex;
}
.dashboard-filter-left span:last-child{
    margin-left:0px;	
}

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

.test-footer-lhs{
    width: calc(100% - 45px);
}
.test-card-footer-lhs-data .status-tag{
    margin-right:10px;
}
.test-footer-rhs {
    width: 50px;
}
.test-footer-rhs .menu-item svg {
    width: 16px;
}
.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: -59px;
    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%; 
}

.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-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; 
}
.header-credit-skeleton{ 
    margin-right: 10px;
    background-color:var(--gray-800); 
}
/***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:37px;
    left: -139px;
    opacity:0;
    transition:0.3s;
    display: none;
}

.info-wrap:hover .tooltip-wrapper{
    opacity:1; 	
    display: block;
} 


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


.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: 8px 16px 8px 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: 8px 8px 8px 16px;
    background:#EFDCFF;
    border:0px;
    color:var(--gray-900);
}

/***Accordian css***/
.accordian-wrapper {
    border-bottom: 1px solid var(--gray-400);
    padding-bottom: 32px;
    margin-bottom: 32px;
}
.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;
}
.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;
    padding: 4px 10px;
    min-height: 25px;
    background: var(--gray-50);
}
.test-list-repeat-wrap .status-tag{
    padding: 4px 10px;
    min-height: 25px;		
}
/*.test-list-repeat-wrap .status-tag a{
    padding: 4px 10px;
    min-height: 25px;	
    text-decoration:none;
}*/

.test-list-repeat-wrap .status-live:before{
    margin-right: 0;
    position: relative;
    left: -3px;
    top: 1px;
}

.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: 5px;
    color: var(--gray-900);
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
    min-height: 31px;
}


.purple-tag{
    background: #EFDCFF;
    border: 1px solid #9759CB;	
}

.gold-tag{
    background:#FFEDD9;
    border: 1px solid #F2C690;	
}

.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: 4px;
}
.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:0px;
    font-size: 30px;
    line-height:36px;
    border-radius:0px;
}

.three-column-layout-top-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 40px;
    border-bottom: 1px solid var(--gray-400);
    background: #FCFCFC;
    min-height: 78px;
    position: sticky;
    top: 80px;
    z-index:22;
}

.autosave-icon {
    display: flex;
    align-items: center;
}
.test-header-left-data {
    display: flex;
    align-items: center;
    width: calc(100% - 360px);
}
.test-header-right-data {
    display: flex;
    align-items: center;
}
.test-header-right-data button img{
    width: 16px;
    height: 16px; 
}


.header-autosave-icon {
    margin: 0px 12px;
    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: 0 6px;
}
.test-name-wrap {
    display: flex;
    align-items: center;
    max-width: calc(100% - 336px);
}
.length-icon {
    margin-right:8px;
    position: relative;
    top: -1px;
}

.test-name-wrap .heading {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 64px);
}
.edit-test-name {
    margin: 0px 20px;
    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 - 230px);
}
.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-right{
    width:442px;
    background: #FCFCFC;
    padding:47px 40px;	
}

.three-column-layout-left .stepper-wrap{
    display: table;
    margin: 47px 0px 40px;
    position: sticky;
    top: 205px;
    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;
    margin: 0;
    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: 24px;
    left: -176px;
    z-index: 2;
    width:367px;
}
.recruit-footer-info .user-response-wrap .info-wrap:hover .tooltip-wrapper{
    bottom: 20px;
}

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

.mt-32{
    margin-top: 32px;
} 
.mb-32{ 
    margin-bottom: 32px; 
}
.mt-16 {
    margin-top: 16px;
}
.mb-16 {
    margin-bottom: 16px;
}

.fav-device-wrap  p{
    color: var(--gray-900); 
    margin-bottom: 20px;
}

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

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

.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;
    margin-top:54px;
}
.test-welcome-image-wrap .project-modal-img {
    position: relative;
    overflow:hidden;
    border-radius:20px;
    margin-bottom: 10px;
    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: cover !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;
}


.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);	
}
.completed-step .stepper-count{
    background-color:var(--primary-pink-200);	
}

.active-step, .active-step a{
    color:var(--gray-900);
}

.active-step .stepper-count{
    background-color:var(--gray-900);	
} 
.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: 10px;
    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;
    border-bottom: 1px solid var(--gray-400);
}
.first-click-design-loop .cardsorting-wrap-top{
    border-bottom: 0px;
}
.cardsorting-wrap-mid-data{
    padding: 21px 32px 32px;
}
.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: -11px 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: 2px;
}

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

.support-button, .support-button:hover{
    border-radius: 100%;
    width: 64px;
    display: inline-flex;
    align-items: center;
    padding: 0;
    position: fixed;
    bottom: 110px;
    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: 11px; 
}
#hours_spend_online.focused .css-319lph-ValueContainer, #education_level.focused .css-319lph-ValueContainer{
    padding-left: 22px; 
}

/***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: 42px;
    margin: 0 1px 0 0; 
} 

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

.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.10);
}
.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: 10px; 
    padding: 30px 25px 30px 15px;
}
.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;
}
.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: 15px;
    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: 15px;

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



/****Tree test css****/
.treeScrollbar {
    background: #FFFFFF;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding:16px;
    border-radius: 10px;
    height:500px !important;
}

.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 {
    margin: 0 0 1px;
    background: #EFDCFF;
    border-radius: 10px;
    padding: 15px 23px;
    margin-bottom:5px;
    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;	
}

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

.treeScrollbar .ans-data {
    width: calc(100% - 117px);
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.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: 5px 0px 0px 5px;
    position: relative;
    background: var(--gray-50); 
} 

.rst__row {
    background: #EFDCFF !important;
    border-radius: 10px;
    height: 56px; 
    display: flex;
    align-items: center;
    min-width: 320px !important;
}
.rst__moveHandle, .rst__loadingHandle {
    box-shadow: none;
    outline: none;
    background-color: unset;
    border: 0px;
    width: 32px;
    background-image: url(../img/drag-icon.svg);
    border-radius: 12px; 
    margin-left: 10px;
    margin-right: 3px;
}

.rst__rowContents {
    border: 0px;
    background: none;
    box-shadow: none;
    display: flex;
    align-items: center;
    width: calc(100% - 50px);
}
.rst__rowLabel {
    width: calc(100% - 210px);
}

.rst__rowToolbar{
    align-items:center;
    margin-right:12px; 
} 
.rst__toolbarButton {
    margin-left: 10px;
    cursor: pointer;
}
.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: 16px;
    line-height: 25px;
    color: var(--gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: block;
}
.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: 2px !important;
    background: var(--gray-700) !important;
}
.rst__lineHalfHorizontalRight::before {
    height: 2px !important;
    width: 50% !important;
    background: var(--gray-700) !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;
}
.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: 16px;
    line-height: 25px;
    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;
}

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

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

.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;
}
.mt-20{ 
    margin-top: 20px !important; 
}
.mb-12{ 
    margin-bottom: 12px !important; 
}
.treetest-task-tree{
    background: #FFFFFF;
    border: 1px solid var(--gray-400);
    border-radius: 10px;
    padding: 15px;
    height: 500px !important;
    overflow: auto;   
}

.rst__tree {
    height: 414px !important;
    overflow-y:hidden !important;
}
.treetest-task-tree .rst__tree.userQTree {
    height: 100% !important;
    overflow-y:auto !important;
}

.treetest-task-tree .rst__rowContents{
    padding: 15px;
    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{ 
    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;
    padding:0px 3px;
}

.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 {
    min-height: 70px;
    background:var(--gray-200);
    padding: 22px 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-900);
    text-decoration:none;	
}

.footer-right-data a:last-child {
    margin-left: 50px;
} 

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

.add-more-question-option {
    position: relative;
}

.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;
}
.mb-20{
    margin-bottom: 20px;  
}
.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: 33px;
    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: .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: 10px;
}

.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;
}
.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:2 !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;	
}
.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: 158px;
}

.publish-modal-text{
    width: calc(100% - 158px);
    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{
    width:35px;
    height:35px; 
}

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{
    width:36px !important;
    height:36px !important; 
}

.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: 'sk-modernistbold';
    font-style: normal;
    font-size: 24px;
    line-height: 29px;
    color: var(--gray-600);
    text-decoration: none;
    padding: 0px 23px 15px;
    display: inline-block;
}
.accountnaviagtion-outer .active a{
    color: var(--gray-900);
    border-bottom: 4px solid var(--gray-900);
}

.accountnaviagtion-outer {
    width: 100%;
    display: flex;
    margin-bottom:40px;
}
.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: 15px !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: 10px;
    padding: 20px;
    margin:8px 0px 40px;
}
.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;
}

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

.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 .share-social-links.text-left button{
    margin-right:32px;	
}

.invite-earn-balancebox {
    display: flex;
    align-items: center;
    margin-bottom:60px;
}
.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;
}
.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: 35px;
    font-weight: 500; 
}
.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 30px;
    padding: 0px 20px;
    justify-content: space-between;
}

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

/***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 3.0s infinite cubic-bezier(.62, .28, .23, .99) both;
    animation: bouncedelay 3.0s infinite cubic-bezier(.62, .28, .23, .99) both;
}

.three-balls .ball1 {
    -webkit-animation-delay: -.16s;
    animation-delay: -.16s;
}

.three-balls .ball2 {
    -webkit-animation-delay: -.08s;
    animation-delay: -.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: 25px;
}

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

/***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: 64px !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: 16px;
    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,.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: 20px;
    line-height: 33px;
    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: 34px;
    height: 34px;
    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-500);
    border-radius: 10px;
    max-width: 320px;
    padding: 20px 24px;
    min-height:50px;
}

.box-medium {
    background:var(--gray-50);
    border: 1px solid var(--gray-500);
    border-radius: 10px;
    max-width: 650px;
    padding: 20px 24px;
    min-height:50px;
}

.box-large {
    background:var(--gray-50);
    border: 1px solid var(--gray-500);
    border-radius: 10px;
    max-width:100%;
    padding: 20px 24px;
    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 .test-header-tags .tag{
    margin:0px 12px 0 0px;	
}
.test-result-header-wrapper .completed-date-text{
    margin-left: 12px;
}
.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% - 251px);  
    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;
    line-height: 17px;
}
.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:24px;
} 

.tech-icon-wname {
    text-align: center;
    margin-bottom: 24px;
}
.device-option-data-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding:32px 0 10px 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:16px 0px;
    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: 12px;
    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;	   
}

.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: 23px 24px;
    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: 14px;
    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 8px;
}
.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: 0.25em;
    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 .bd-que-slide-arrow{
    margin-left:24px;	
}
.dropdown-header-top {
    margin-bottom:8px; 
}

.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);
}
.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: 5px 0;
}
.participants-overview-footer {
    margin-top:35px;
    color:var(--gray-900);
}
.participants-overview-footer-language {
    align-items: center;
    margin-top: 8px;
}
.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: 6px 0;
    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: 2px;
    position: relative;
}

.pie-chart-area svg {
    position: relative;
    left: -10px;
    top: 0;
}
.pie-chart-box .chart-info-wrap{
    padding-top:8px;
    padding-bottom:10px;
    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 {
    display: flex;
    align-items: center;
    margin-bottom:20px;
    padding-right: 15px;
    word-wrap: break-word;
}

.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: 25px;
    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; 
}
.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-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; 
    border-bottom: 1px solid var(--gray-400);
}

.question-result-data .table tbody tr:hover {
    background: transparent;
}

td.tableDropdown {
    text-align: right;
    padding-right: 0;
}
td.tableDropdown .hamburger-items.dropdown-menu.show {
    right: 40px !important;
    min-width: 220px; 
    top: -14px !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:10px;	
}


.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: 600;
    font-size: 16px;
    line-height: 33px;
    font-family: inherit;
}

.vertical-bar-chart-inner g.tick text {
    font-weight: 600;
    font-size: 16px;
    line-height: 33px;
    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;
} 
.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%;
}
.mb-60{
    margin-bottom: 60px;
}

.mb-40{
    margin-bottom: 40px;   
} 

.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:170px !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 - 140px);
    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: 80px;
}
/**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: 18px 25px 0px 25px;
    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: 18px;
    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{
    padding-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,.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;
}

.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;
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 8px;
}
.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 span {
    display: flex;
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    color: var(--gray-900);
    width: 70px;
}
.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: 132px;
    display:inline-block;
}
.task-overview-tree-chart .chart-info-wrap {
    padding-left: 0;
    display: flex;
    margin: 0px -13px;
    flex-wrap: wrap;
    width: calc(100% - 132px);
    justify-content:end;
    padding-top:10px;
}
.task-overview-tree-chart .chart-info-wrap .chart-info-repeat {
    margin: 0px 10px 3px;
}

.task-overview-tree-chart .top-head-wrap {
    display: flex;
    margin-bottom:32px;
    justify-content: space-between;
}

.task-overview-tree-chart .chart-info-repeat p {
    font-size: 14px;
    line-height: 25px;
}

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

.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 - 130px);
    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: 12px 15px;
    border-radius: 7px;
    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 25px;
}

.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;
}
.tester-test-cards .test-list-data::after{
    display: none !important; 
}
.tester-test-cards .btn {
    justify-content: center;
    position: relative;
    top:5px;
    padding: 10px 13px;
}

.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{
    line-height: 18px;
    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; 
}
.tester-test-cards .test-time-data-repeat{
    width: auto !important; 
}

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

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


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

.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: 2 !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 - 250px);
    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 - 150px);
    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 - 150px);
}

.tester-test-intro {
    min-height: calc(100vh - 150px);
    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: 162px; 
}
.loading-cards .all-test{
    min-height:120px;   
}

.tester-test-cards .loading-cards .all-test{
    min-height: 147px;
}

.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: 18px 15px;
    background: #FCFCFC;
    align-items:start;
    text-align: left !important;
    direction: ltr !important;
    font-family: inter !important;
}


.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 #spoken_language.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 #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: 650px;
}
.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: 37px;
}
.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 .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 {
    -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 {
    width: 5px;
    background-color: var(--gray-50);
}
.accountnaviagtion-outer::-webkit-scrollbar {
    height: 4px;
}
.accountnaviagtion-outer::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, .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 #spoken_language.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 {
    position: absolute;
    right: 0;
    width: 180px;
    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: 14px !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: 23px;
}
.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:22px !important; 
}

.search-dropdown-component.input-field.focused label {
    z-index: 0;
    left: 15px !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 .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;  
}

.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 - 182px) !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  .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: 10px;
    color: var(--gray-50);
    font-size: 16px;
} 
.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; 
}
.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;
}
.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(100vh);
}

.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: 10px;
    padding: 32px;
    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: 16px;
    margin-bottom: 8px;
}
.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: 16px;
}
.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 {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 33px;
    color: var(--gray-900);
    margin-left: 12px;
}

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

.behavior-top-right-content .form-group, .behavior-top-right-content .searchdropdown-box{
    max-width:300px;
    min-width: 300px;
    margin-left: 12px;
}
.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:15px !important;
}
.date-picker-field .MuiInputBase-input{ 
    padding-left:21px !important;
}


.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-right: 12px;
}
.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:12px -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-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: 80px;
}

.score-link-header:hover .tooltip-wrapper{
    display: block;
    top:91px;
    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{
   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 {
    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: 3 !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;
}
.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: 7px;
    font-weight: 600;
    position: relative;
    top: 2px;
    font-family: 'Inter', sans-serif;
    min-width: 38px;
}

.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 40px 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: 36px;
}
.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: 17px;
}

.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 {
        margin-bottom: 60px;
    }
    .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: .5;
        }
        .offcanvas-backdrop {
            position: fixed;
            top: 0;
            left: 0;
            z-index: 1040;
            width: 100vw;
            height: 100vh;
            background-color: #000;
        }
        .fade {
            transition: opacity .15s linear;
        }
        .offcanvas.show {
            transform: none;
        }
        .offcanvas-end {
            top: 0;
            right: 0;
            width: 400px;
            border-left: 1px solid rgba(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 .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;
        }
        .signup-info-content p {
            margin-top: 14px;
        } 
        .signup_info_icon svg{ 
            width: 60px;
            height: 60px;
        } 
        /***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: 467px;
        }
        /***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;
        }

        .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: 25px;
        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;
}
.modal-header-top.mb-20 {
    margin-bottom: 20px;
}
.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;
}

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


.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: 24px;
    height: 24px;
}
/***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;
    min-height: 100px;
    padding: 3px 24px;
}
.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;
    display: inline-block;
}

span.dashboard-search-data-wrap.active-search-1 {
    width: 400px;
    transition: 0.3s;
}
.dashboard-search-icon {
    display: flex;
    cursor: not-allowed;
    opacity: 0.3;
    align-items: center;
    width: 58px;
    height: 58px;
    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: 56px !important;
   margin: 0px !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;
}
.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;
 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:195px;
    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: 52px;
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;
}
.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;
}
.mb-8 {
    margin-bottom: 8px;
}
.zoom-container img{
    user-select: none;
}
.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 - 150px);
    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: 30px;
}
.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, .css-4ljt47-MenuList > 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: 59px;
    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:16px;
  }
  .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:0px;
    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;
    
}

.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);
}
.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 24px;
    margin:0px 12px 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;
}
.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:15px;
    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);
}
.tree-by-tak-wrap .box-large{
 padding-top: 27px;
}
.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: -18px;
  }
  .sb-show-main .top-tooltip::before{
      left: 71% !important;
  }
  .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:480px; 
} 
.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: 543px;
    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; 
}