body{
	font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
	
	--tw-bg-opacity: 1;
    background: rgb(242 242 242/var(--tw-bg-opacity));
	/*font-family: brandon-grotesque, sans-serif;*/
	background: #ffffffb0;
	color:rgb(187, 115, 255);
}

.loading {
	width: 100%;
	position: fixed;
	text-align: center;
	z-index: 1001;
	display: none;
	background: #34404c96;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	padding-top: 10%;
}

.loading>img {
	width: 50px;
	height: 50px;
}

.section {
	padding-bottom: 10px;
}


table th {
	height: 1.5rem !important;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.5;
}

table tbody td input {
	padding: 2px !important;
	border: 0.5px !important;
}

.master_info_section .categoryid {
	width: 100% !important;
}

button {
	/*border-radius: 10px !important;*/
}

.save_row {
	margin-right: 10px !important;
}

.mustsave {
	background-color: #004A7F;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	border: none;
	color: #FFFFFF;
	cursor: pointer;
	display: inline-block;
	font-family: Arial;
	font-size: 14px;
	padding: 5px 10px;
	height: 30px;
	text-align: center;
	text-decoration: none;
	-webkit-animation: glowing 1500ms infinite;
	-moz-animation: glowing 1500ms infinite;
	-o-animation: glowing 1500ms infinite;
	animation: glowing 1500ms infinite;
}

@-webkit-keyframes glowing {
	0% {
		background-color: #B20000;
		-webkit-box-shadow: 0 0 3px #B20000;
	}

	50% {
		background-color: #FF0000;
		-webkit-box-shadow: 0 0 40px #FF0000;
	}

	100% {
		background-color: #B20000;
		-webkit-box-shadow: 0 0 3px #B20000;
	}
}

@-moz-keyframes glowing {
	0% {
		background-color: #B20000;
		-moz-box-shadow: 0 0 3px #B20000;
	}

	50% {
		background-color: #FF0000;
		-moz-box-shadow: 0 0 40px #FF0000;
	}

	100% {
		background-color: #B20000;
		-moz-box-shadow: 0 0 3px #B20000;
	}
}

@-o-keyframes glowing {
	0% {
		background-color: #B20000;
		box-shadow: 0 0 3px #B20000;
	}

	50% {
		background-color: #FF0000;
		box-shadow: 0 0 40px #FF0000;
	}

	100% {
		background-color: #B20000;
		box-shadow: 0 0 3px #B20000;
	}
}

@keyframes glowing {
	0% {
		background-color: #1453f5;
		box-shadow: 0 0 3px #3b6fdf;
	}

	50% {
		background-color: #3f8af1;
		box-shadow: 0 0 40px #3d6cab;
	}

	100% {
		background-color: #0310ff;
		box-shadow: 0 0 3px #062bab;
	}
}

.verticalmiddle {
	vertical-align: middle !important;
}

.matchline {
	height: 2px;
	background:
		darkseagreen;
	top: 49%;
	margin-left: 0px;
	margin-right: 0px;
}

.modal {
	overflow-y: auto;
}

.main_containerbox {
	min-height: 70vh;
	display: flex;
	justify-content: center;
	flex-direction: column;
}

.select_option_checkbox,
.multiselect_option_checkbox {
	/*height: calc(1.5em + 0.7rem + 2px);*/
}

.welcome_text {
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.5;
	text-align:center;
	width:100%;   
/*	align-items: center;*/
}
.result_head .welcome_text {
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.5;
	text-align:center;
	width:100%;   
	display:flex;
	/*align-items: center;*/
}

.welcome_subtext {
	font-size: 1.3rem;
	font-weight: 500;
	line-height: 1.3;
}




.chk_row {
	padding: 0;
	margin: 0px;
	border-bottom: 1px #00000014 solid
}

.chk_row .tfgroup_option {
	font-weight: 500;
}

/*::-webkit-scrollbar {
    width: 3px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 3px rgb(0 0 0 / 30%);
}

::-webkit-scrollbar-thumb {
     background-color: #a9a9a900;
    outline: 1px solid #70809057;
}*/
/*.option_stl{
	border: 1px #0000000d solid;
    border-radius: 5px;
    box-shadow: 0px 3px 15px 1px #00000014;
	margin-top: 0.5rem !important;
	margin-bottom: 0.8rem !important;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem!important;
}*/
.option_stl{
	border: 1px #0000003d solid;
    border-radius: 5px;
    box-shadow: 0px 3px 15px 1px #00000014;
	margin-top: 0.5rem !important;
	margin-bottom: 0.8rem !important;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem!important;
}
.margin-option{
	margin: 10px!important;
}
.matchcolumn_a_sortable, .matchcolumn_b_sortable, .matchcolumn_c_sortable{
	width:30%;
}

.result_ques  .matchcolumn_option_rst{
	overflow-y:auto;
	max-height:200px;
	scrollbar-width: thin;
	width:30%;
}
.result_ques .matchcolumn_option_rst {
    overflow-y: auto;
    max-height: 500px !important;
    text-align: center;
}
.matchcolumn_option_a, .matchcolumn_option_b, .matchcolumn_option_c{
	overflow-y:auto;
	max-height:200px;
	scrollbar-width: thin;
	width:93%;
}
.move_icon{
	width:5%;
	text-decoration: none !important;
}
.matchcolumn_line{
	width:5px;
}
.result_ques .matchcolumn_linerst{
	width:10px;
}

.result_ques .one_word_html{
	width:40%;
}
.result_ques .select_opt{
	width:80%;
}
.result_ques .select_opt_q_ans{
	width:15%;
}

.hr_line{

}
.result_head{    
	background: #fff;
    line-height: 1.5;
    font-weight: 500;
    padding: 5px 0px;
    border-left: 1px #0000000f solid;
    border-right: 1px #0000000f solid;
    border-bottom: 1px #0000000f solid;
    border: 1px #0000000f solid;
    box-shadow: 0px 1px 1px 1px #0000000f;
}
.result_head .vqr_title{	
    /*color: #333;*/
	color: #3c6f9b;
}
.result_head .vqr_value{	
    color: #333;
}
.result_ques .option_stl {
    margin-top: 0.2rem !important;
    margin-bottom: 0.2rem !important;
    box-shadow: 0px 1px 1px 1px #00000014 !important;
    border-radius: 20px !important;
    padding-left: 15px !important;
    padding-right: 10px !important;
	min-height:20px;
	
	
}
.result_ques .question_div{	
    border: 1px #0000000f solid;
    box-shadow: 0px 1px 2px 1px #0000000f;
	background: #fff;
}
.result_ques .chk_row {
    border-bottom: 0px !important;
}

.result_ques .question_marks_info {
	font-size:9px;
	margin-top:3px;
}
.result_ques .question_marks {
	font-size: 13px;
    border: 0.5px #00000024 solid;
    border-radius: 20px;
    padding: 4px 10px;
    font-weight: 500;
    box-shadow: 0px 1px 10px 2px #00000024;
}
.result_ques .question_marks_posi {	
    background: #9acd3214;
}
.result_ques .question_marks_neg {	
    background: #db70931c;
}
.result_ques .correct_ans, .correct_ans {
	background:#9acd3273;
	border:1px #9acd3273 solid;
}
.result_ques .wrong_ans, .wrong_ans {  
	background:#db709314;
	border:1px #db709338 solid;
}

.result_ques .q_ans{
	color: gray;
    font-weight: 400;
    font-style: italic;
    box-shadow: none !important;
    /*background: #adff2f24;*/
    background: #adff2f0d;
	
	
	text-align: center;  
	display: flex;  
	align-items: center;
	-ms-flex-pack: center!important;
    justify-content: center!important;
}
.dflex{
	display: flex !important;
    flex-wrap: wrap !important;
}
.align-items-center {
    -ms-flex-align: center!important;
    align-items: center!important;
}
.justify-content-end {
    -ms-flex-pack: end!important;
    justify-content: flex-end!important;
}
.rs_marks{
	background: darkorange;
    padding: 5px 10px;
    border-radius: 10px;
}
.question_mark_bgd{
	position:absolute; 
	display: flex; 
	justify-content: flex-end;
	padding-right: 20px;
	top: -15px;
}
.question_mark_bgd span{
	text-align: center;  
	background-color: #fff;     
	color: gray;
	padding: 3px; 
	min-width: 80px;
	min-height: 30px;
	border-radius: 15px;
	border:1px #00000014  solid;
	display: flex;  
	align-items: center;
	font-weight:400;
	font-size:13px;
	
	-ms-flex-pack: center!important;
    justify-content: center!important;
}
.question_mark_bgd .bg_posi, .bg_posi{
	border-color: yellowgreen;
}
.question_mark_bgd .bg_negi, .bg_negi{
	border-color: #cd5c5c57 ;
}
.result_ques .main_box{
	position:relative;
	margin-top:20px !important;
}
.matchcolumn_row  .row{
	margin-right:0px;
	margin-left:0px;
}
.result_ques .response_header{
	font-weight: 600;
    font-size: 18px;
    border-top: 1px #00000012 solid;
    border-bottom: 1px #00000012 solid;
    margin-top: 5px !important;
    margin-bottom: 5px !important;    
	text-align: center;
	padding-bottom:4px;
	padding-top:4px;
}
.chk_row  label{
	padding: 5px 10px !important;
    border-radius: 25px;
    border: 1px #00000017 solid !important;
}
.boldtext{
	font-weight:600;
}

@media print {
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6,
      .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
           float: left;               
      }

      .col-sm-12 {
           width: 100%;
      }

      .col-sm-11 {
           width: 91.66666666666666%;
      }

      .col-sm-10 {
           width: 83.33333333333334%;
      }

      .col-sm-9 {
            width: 75%;
      }

      .col-sm-8 {
            width: 66.66666666666666%;
      }

       .col-sm-7 {
            width: 58.333333333333336%;
       }

       .col-sm-6 {
            width: 50%;
       }

       .col-sm-5 {
            width: 41.66666666666667%;
       }

       .col-sm-4 {
            width: 33.33333333333333%;
       }

       .col-sm-3 {
            width: 25%;
       }

       .col-sm-2 {
              width: 16.666666666666664%;
       }

       .col-sm-1 {
              width: 8.333333333333332%;
        } 

.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
}
}


.border-bottom{
	border-bottom: 1px #00000024 solid!important;
}
.welcome_text{
text-align: right!important;
}
.result_ques .question_div{	
	border-bottom: 1px hsl(0deg 0% 0% / 37%) solid!important;
	box-shadow: 0px 0px 0px 0px #0000000f!important;
   
}
.result_ques .wrong_ans {
    border: 1px #bb4d71cf solid!important;
}
.welcome_text_start{
	font-size: 1.6rem;
    line-height: 1.5;
    text-align: center;
    width: 100%;
    align-items: center;
	font-weight: 700!important;
    color: rgb(187, 115, 255);
}

.survayname_text{
	font-size: 1.6rem;
    line-height: 1.5;
    text-align: center;
    width: 100%;
    align-items: center;
    font-weight: 500 !important;
    color: white;
    background: rgb(187, 115, 255);
    padding: 0.4rem 0px;
}
.main_containerbox{
	margin-bottom: 100px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0px rgb(0 0 0 / 30%)!important;
}
.btn-success {
    padding: 6px 20px;
    border-radius: 50px;
    color: #fff;
}
.question_img{
	/*max-width:100%;
	*/
}

@media (pointer:none), (pointer:coarse) {
	.container{
		    max-width: 100%;
			width: 100%;
			padding: 0px !important;
			margin: 0px !important;
	}
	.matchcolumn_row{
		margin:0px !important;
	}


.matchcolumn_row{
	 margin: 0px !important;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    align-content: center;
}
.matchcolumn_row .option_stl, .opt1,.opt2{
	width: 48%; 
	
}
.matchcolumn_row .opt2{
	width: 48%; 
	padding: 0px !important;
}
.matchcolumn_row .opt2 select{
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	/*border: none !important;   */
	background:#f0f2f57a !important;
	border: 1px #00000003 solid !important;
}
.matchcolumn_row .option_stl_g{
	width: 2%;    
}
}
option {
  /* wrap text in compatible browsers */
  -moz-white-space: pre-wrap;
  -o-white-space: pre-wrap;
  white-space: pre-wrap;
  /* hide text that can't wrap with an ellipsis */
  overflow: hidden;
  text-overflow: ellipsis;
  /* add border after every option */
  border-bottom: 1px solid #DDD;
}
footer{
	display:none;
}

.sororder_div{
	display: flex;
    width: 100%;
    flex-flow: row wrap;
    align-items: flex-start;
    place-content: flex-start;
    padding: 5px 0px !important;
    margin: 0px !important;
    margin-bottom: 10px !important;
    border: 1px #0000003d solid;
    border-radius: 5px;
    box-shadow: 0px 3px 15px 1px #00000014;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-content: flex-start;
}
.sororder_div .sortorder_option{  
	
}
.sororder_div .btn-link{  
	background:#fff !important;
	background-color:#fff !important;
}
.sororder_div .icon{
	min-width:40px;	
}
.draggable {
    touch-action: none
}
.survey_btn_group{
	display:flex;
}
.survey_btn_group .btn{
	color:#fff;
}
.d-flex{
	display: flex!important;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.btn-success {
	color: #fff;
	background-color: #28a745;
	border-color: #28a745;
}

.btn-success:hover {
	color: #fff;
	background-color: #218838;
	border-color: #1e7e34;
}

.btn-success:focus,
.btn-success.focus {
	color: #fff;
	background-color: #218838;
	border-color: #1e7e34;
	box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

.btn-success.disabled,
.btn-success:disabled {
	color: #fff;
	background-color: #28a745;
	border-color: #28a745;
}

.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.show>.btn-success.dropdown-toggle {
	color: #fff;
	background-color: #1e7e34;
	border-color: #1c7430;
}

.btn-success:not(:disabled):not(.disabled):active:focus,
.btn-success:not(:disabled):not(.disabled).active:focus,
.show>.btn-success.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

.btn-danger{
		font-size: 10px;
}
	.btn:focus, .btn.focus {
		outline: 0;
		box-shadow: 0 0 0 0.0rem rgb(0 123 255 / 25%);
	}
	button.close:focus{
		outline: 0px dotted!important;
    outline: 0px auto -webkit-focus-ring-color!important;
	}
	
	.btn-secondary {
		font-size: 10px;
	}

.btn-primary:focus,
.btn-primary.active,
.btn-primary.hover {
    color: #fff;
    background-color: #0069d9;
    border-color: #0062cc;
    box-shadow: 0 0 0 0rem rgb(38 143 255 / 50%);
}
.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show>.btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.0rem rgb(38 143 255 / 50%)!important;
}
.btn-info, .btn-success{
	font-size: 10px;
}
.btn-info:focus,
.btn-info.active,
.btn-info.hover {
    color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8;
    box-shadow: 0 0 0 0rem rgb(38 143 255 / 50%);
}
.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, .show>.btn-info.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.0rem rgb(58 176 195 / 50%);
}
	
.dt-buttons{
	margin: 10px 0px;
}

.multiselect_option_div, .select_option_div, .oneword_option_div, .matchcolumn_option_div, .sortorder_option_div, .tfgroup_option_div, .manual_response_div{
	margin:auto;
}
	
	
.hide_div {
    display:none;
}
.single_select_option_label{
    display: flex !important;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
}
.single_select_option_label .single_select_checkbox{
   margin-right:5px;
}
.survey_content, .no_consent_msg_div{
    font-size: 0.80rem;
    font-weight: 500;
    color: #333;
}

.footer_div{
    font-size: 0.80rem;
    font-weight: 500;
    color: #333;
}

.privay_policy_link, .terms_condition_link{
    font-size: 0.75rem;
    font-weight: 500;
    color: #a5a2a2 !important;
    font-style: italic;
}

.question_loader_div{
    text-align: center;
    max-height: 800px;
    overflow-y: auto;
    padding: 1rem;
    min-height: 420px;
    padding: 150px;
}
.div_border_label{
	    display: flex;
    border: 1px;
    border-radius: 0.5rem;
    margin: 0.5rem;
    padding: 0.5rem 0.5rem 0 0.5rem;
    align-items: center;
    justify-content: space-between;
	min-width: 150px;
    text-align: center;
    justify-content: center;
}
  
.option_group_emreging {
	border: 2px #ed1c24 solid;
}
.option_group_emreging .option_group_label{
	color:#ed1c24;
}
.option_group_developing {
	border: 2px #ff7f27 solid;	
}

.option_group_developing .option_group_label{
	color:#ff7f27;
}
.option_group_performing {
	border: 2px #b5e61d  solid;	
}
.option_group_performing .option_group_label{
	color:#b5e61d ;
}
.option_group_transforming {
	border: 2px #22b14c solid;	
}
.option_group_transforming .option_group_label{
	color:#22b14c;
}
.option_group_label{
	font-size: 0.95rem;
    font-weight: 500;
    width: auto !important;
    padding-left: 5px;
    padding-right: 5px;
	text-align: center;
}

.select_option_checkbox {
    --disabled-color: blue !important;
}
/* ------------------------------------------------------------------------------ */

.headerlogo {
	padding: 2rem 0rem 0rem 1rem;
	height: 40px;
    position: fixed;
    z-index: 999;
}
.headerlogo img {
	height: 40px;    
}
.page_section, .page_section_welcome{
	display: flex ;
    flex-wrap: wrap !important;
	position:absolute;
	top:0px;
	
    height: 100%;
}

.left_screen_section{
	position: relative;
    width: 50%;
    height: 100vh;
    overflow: hidden;
}  
.left_screen_section .welcomeVideo,  {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.side_media video, .side_media img,   {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.right_screen_section{
	position: relative;
    width: 50%;
    /*height: 100vh;*/
    overflow: hidden;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: center;
	padding-left:1rem;
	padding-right:0.5rem;    
	overflow: auto;
	margin:auto;
} 

.sew_input {
    display: block;
    width: 100%;
    font-family: inherit;
    color: rgb(187, 115, 255);
    padding-block-start: 0px;
    padding-block-end: var(--spacing-100);
    padding-inline: 0px;
    border: none;
    outline: none;
    border-radius: 0px;
    appearance: none;
    background-image: none;
    background-position: initial;
    background-size: initial;
    background-repeat: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    transform: translateZ(0px);
    font-size: 1.9rem;
    -webkit-font-smoothing: antialiased;
    line-height: unset;
    animation: 1ms ease 0s 1 normal none running native-autofill-in;
    transition: background-color 1e+08s ease 0s, box-shadow 0.1s ease-out 0s;
    box-shadow: rgba(187, 115, 255, 0.3) 0px 1px;
    background-color: transparent !important;
	
}
 input::placeholder {
    color: rgb(235, 213, 255); /* Change the color to your desired value */
}
.sew_input:focus {
		box-shadow: rgb(187, 115, 255) 0px 2px;
}
.sew_input-label {
    margin: 0px;
    max-width: 100%;
    width: inherit;
    font-weight: unset;
    font-size: 20px;
    line-height: 28px;
    color: rgba(187, 115, 255, 0.7);
    text-align: start;
    overflow-wrap: break-word;
   
}

.question_title{
	   margin: 0px;
    max-width: 100%;
    width: inherit;
    font-weight: unset;
    font-size: 1.5rem;
    line-height: 2rem;
	
}
.question_description{
	margin: 0px;
    max-width: 100%;
    width: inherit;
    font-weight: unset;
    font-size: 1.25rem;
    line-height: 1.8rem;
	color: rgba(187, 115, 255, 0.7);    
	text-align: start;
    overflow-wrap: break-word;	
}
.question_option{
	margin-block-start: 1rem;
    margin-block-end: 2rem;
}
.save_survey_form{
	width:100%;
}

.question_content,.question_content_welcome{	
    min-height: 420px;
	overflow-y:auto;
	padding: 1rem 2rem;	
}
.right_screen_section{	
	transition: top 0.5s ease-in-out;
	/*transition: top 1.5s linear(-0.4 37.5%, 1.25 37.5%);	*/
}

.btn_ok_next, .btn_submit_survey, .btn_submit_start_survey{	
    position: relative;
    font-family: inherit;
    line-height: initial;
    font-weight: 700;
    cursor: pointer;
    transition-duration: 0.1s;
    transition-property: background-color, color, border-color, opacity, box-shadow;
    transition-timing-function: ease-out;
    outline: none;
    border: 1px solid transparent;
    margin: 0px;
    padding: 0px;
    min-width: 36px;
    height: 32px;
    -webkit-box-pack: center;
    justify-content: center;
    background-color: rgb(187, 115, 255);
    color: rgb(255, 255, 255);
    border-start-start-radius: 4px;
    border-start-end-radius: 4px;
    border-end-end-radius: 4px;
    border-end-start-radius: 4px;    
	padding: 0px 10px;	
}

.next_btn_div, .next_btn_div_welcome{	
    position: relative;
    font-family: inherit;
    line-height: initial;
    font-weight: 700;
    cursor: pointer;
    transition-duration: 0.1s;
    transition-property: background-color, color, border-color, opacity, box-shadow;
    transition-timing-function: ease-out;
    outline: none;
    border: 1px solid transparent;
    margin: 0px;
    padding: 0px;
    width: 36px;
    min-width: 36px;
    height: 32px;
    -webkit-box-pack: center;
    justify-content: center;
    background-color: rgb(187, 115, 255);
    color: rgb(255, 255, 255);
    border-start-start-radius: 0px;
    border-start-end-radius: 4px;
    border-end-end-radius: 4px;
    border-end-start-radius: 0px;    
	border-left: 1px #33333396 solid;
	
}
.prev_btn_div{
	position: relative;
    font-family: inherit;
    line-height: initial;
    font-weight: 700;
    cursor: pointer;
    transition-duration: 0.1s;
    transition-property: background-color, color, border-color, opacity, box-shadow;
    transition-timing-function: ease-out;
    outline: none;
    border: 1px solid transparent;
    margin: 0px;
    padding: 0px;
    width: 36px;
    min-width: 36px;
    height: 32px;
    -webkit-box-pack: center;
    justify-content: center;
    background-color: rgb(187, 115, 255);
    color: rgb(255, 255, 255);
    border-start-start-radius: 4px;
    border-start-end-radius: 0px;
    border-end-end-radius: 0px;
    border-end-start-radius: 4px;
	
}
.next_btn_div_welcome:hover,
.next_btn_div_welcome:focus,
.next_btn_div_welcome:active,
.next_btn_div:hover,
.next_btn_div:focus,
.next_btn_div:active{
	color: #fff;
   	background-color:rgba(187, 115, 255, 0.85);
   	border-color: rgb(187, 115, 255);
	border-left: 1px #33333396 solid;
}

.btn_submit_survey:hover,
.btn_submit_survey:focus,
.btn_submit_survey:active, 
.btn_submit_start_survey:hover,
.btn_submit_start_survey:focus,
.btn_submit_start_survey:active, 
.btn_ok_next:hover,
.btn_ok_next:focus,
.btn_ok_next:active, 

.prev_btn_div:hover,
.prev_btn_div:focus,
.prev_btn_div:active{
	color: #fff;
   	background-color:rgba(187, 115, 255, 0.85);
   	border-color: rgb(187, 115, 255);
}
.next_btn_div svg, .next_btn_div_welcome svg, .prev_btn_div svg {
    display: block;
    fill: rgb(255, 255, 255);
    transition: fill 0.2s ease 0s;
	margin: auto;
}

.nav_btn_group{
	display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    align-content: center;
    flex-direction: row;
	position: fixed;
    bottom: 5px;
    right: 5px;
}
form{
	width:100%;
}


.select_option_div{
    justify-content: flex-start;
    display: flex !important;
    /* flex-wrap: nowrap; */
    align-items: flex-start;
    flex-direction: column;
	
}
.select_option_div label{
	max-width: 340px;
	position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    border-radius: 5px;
    background-color: rgba(187, 115, 255, 0.1);
    box-shadow: rgba(187, 115, 255, 0.6) 0px 0px 0px 1px inset;
    color: rgb(187, 115, 255);
   
    height: inherit;
    min-height: 40px;
    outline: 0px;
    padding-block: 4px;
    transition-duration: 0.1s;
    transition-property: rgba(187, 115, 255, 0.1), rgb(187, 115, 255), border-color, opacity, box-shadow;
    transition-timing-function: ease-out;
    width: 100%;
    word-break: break-word;
    cursor: pointer;
    opacity: 1;
	    font-weight: 500;
 }
 .select_option_div label:focus{
    box-shadow: rgba(187, 115, 255, 0.8) 0px 0px 0px 2px inset;
    background-color: rgba(187, 115, 255, 0.1);
 }
 
 .side_img{
	 display: block;
	 width: 100%;
	 height: 100%;
	 object-fit: cover;	
    object-position: 50% 50%;
	
 }

/* Media query for mobile screens */
@media screen and (max-width: 767px) {
	.page_section_welcome{
		height: auto;
	}
	.page_section{
		height: auto;
	}
    .left_screen_section {
        width: 100%; /* Set the width to 100% on mobile screens */
		height: 50%;    
		margin-top: 3.5rem;
    }
    .right_screen_section {
        width: 100%; /* Set the width to 100% on mobile screens */
		/*height: 50%;*/
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-content: flex-start;
		flex-wrap: wrap;
		padding-left:1rem;
		padding-right:0.5rem;
		margin-top: 3rem !important;
    }
	.headerlogo {
		padding: 4rem 0rem 0rem 0.5rem;
		position: relative;
	}
	
	.question_title{
		font-size: 1.25rem;
		line-height: 1.5rem;
		
	}
	
	.question_content, .question_content_welcome{	
		padding: 0.5rem 0.2rem;
		min-height: 330px;
	}
	
	 .side_img{
		object-position: 50% 50%;
		height:240px;
	 }
	 
	.sew_input {
		font-size: 1.5rem;
		
	}
		
}
.error_msg, .error_msg svg{
	color:#dd6868;
	fill:#dd6868;
}

.question_loader_welcome{
	text-align: center;
    position: fixed;
    z-index: 999;
    width: 100%;
    height: 100%;
    padding-top: 20%;
    background: #33333347;
}

.question_loader_celebration{
	    text-align: center;
    position: fixed;
    z-index: 999;
    width: 100%;
    height: 100%;
        padding: 10%;
    background: #33333347;
    transition: top 1.5slinear(-0.4 37.5%, 1.25 37.5%);
}
.question_loader_celebration img{
	    width: auto;
    height: auto;
    max-width: 90%;
}

.hightlight_selected_option{
	background: rgba(187, 115, 255, 0.3) !important;
	border: 1.5px #0000003d solid;
}
.single_select_option_label:hover{
	background-color: rgba(187, 115, 255, 0.3);	
}    

.progressbar_section {
	align-items: center;
    position: fixed;
    z-index: 999;
	top:0;
	padding: 10px;
}
.progressbar {
	height: 15px !important;    
	border-radius: 15px !important;
}

.progressbar>div {
	background: rgb(187 115 255 / 1) !important;
	border: 0px !important;
}

.progressbar_percentage{
	color: rgb(187 115 255) !important;
    max-width: 100%;
	font-size: 1rem;
    font-weight: 600;
}

.ui-widget-content {
    border: 0px solid #dddddd !important;
    background: none !important;
	background: rgb(187 115 255 / 25%) !important;
}

.ui-widget-header {
    border: 0px solid #dddddd !important;
    /*background: rgb(187 115 255 / 56%) !important;*/
    background: rgb(187 115 255) !important;
    color: rgb(187, 115, 255) !important;
}