:root{
    --theme-color:#523a78;
    --yellow:#ffcb04;
}
   html {font-size: 16px;}
.color_yellow { color: var(--yellow);}
.fw600 {font-weight: 600;}

.container{max-width:1051px;margin:0 auto}
body{background-color:#523a78;font-family:Roboto,sans-serif;color:#000; position: relative;}
.container_xl{max-width:1366px;margin:0 auto;position:relative;overflow:hidden; z-index: 2; padding-bottom: 16%;}
.bg_all_graph_top{position:absolute;top:0;left:50%;transform:translateX(-50%);width:1366px;height:auto;pointer-events:none; }
.bg_all_graph_bottom{position:absolute;   bottom: -11rem;   left:50%;transform:translateX(-50%);width:1366px;height:auto;pointer-events:none;}
/* .footer_sec {display: none;} */
.cs_logo{padding-top:5rem}
.cs_logo img{height:10.75rem}
.bg_white{background-color:#fff;padding:1rem 5rem;border-radius:52px;border-left:22px solid transparent;border-image-source:url(../firstperiodstory/images/form-img.png);border-image-repeat:round;border-image-slice:18; 
    padding-bottom: 3rem;}
.common_text p{color:#fff}
.testimonial_box{position:relative}
.testimonial_data{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;gap:1rem;padding:2.5rem}
.testimonial_grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:0rem;grid-gap:2rem;list-style:none;padding-left:0}
.profile_img{width:60px;height:60px; border-radius: 50%;}
.comma_img{width:35px;height:25px}
.right_info .text{font-size:.8rem;line-height:1.25;font-weight:500;overflow:hidden;display:-webkit-box;-webkit-line-clamp:8;line-clamp:8;-webkit-box-orient:vertical}
.user_info{padding-top:0.5rem;margin-top:auto}
.user_info .name{font-weight:800;font-size:1.1rem;line-height:1}
.user_info .name_info{font-weight:600;font-size:13px}
.left_info{display:flex;flex-direction:column;justify-content:space-around;align-items:center}
.box_type_2 .left_info{padding-bottom:0rem;justify-content:space-between}
.box_type_2 .testimonial_data{padding-left:1.5rem;padding-bottom:3rem}
.box_type_2 .user_info{margin-left:0rem}
.right_info{display:flex;flex-direction:column}

.no_image .box_type_2 .user_info { margin-left: 0;}
.box_type_1 .testimonial_data {    padding-block: 1.5rem;}

.box_type_3 .left_info {    flex-direction: row;}
.box_type_3 .left_info:has(img:nth-of-type(2)) img:first-of-type {
    display: none;
}

.box_type_4 .left_info{padding-bottom:0rem;justify-content:space-between}
.box_type_4 .testimonial_data{padding-left:1.5rem;padding-bottom:3rem}
.box_type_4 .user_info{margin-left:-3rem}

.box_type_5 .left_info {padding-bottom:0rem;justify-content:space-between}
.box_type_5 .user_info{margin-left:0rem}
.box_type_5 .testimonial_data {    padding-right: 3rem;}
.box_type_5 .right_info .text {text-align: center;}
.no_image .box_type_5 .testimonial_data {flex-direction: column;}
.no_image  .box_type_5 .left_info { padding-bottom: 0;}
.no_image  .box_type_5 .user_info { margin-inline: auto;}
.box_type_4 .user_info { margin-inline: auto;}

.box_type_6 {    padding-inline: 1rem;}
.box_type_6 .left_info {padding-bottom:0rem;justify-content:space-between}
.box_type_6 .user_info{margin-left:0rem}
.box_type_6 .testimonial_data {padding-top: 1.5rem;}


.testimonial_grid li:nth-child(6n + 2) {  transform: translateX(1.1rem);}

input:focus, select:focus, input:focus, textarea:focus{border:none;border-bottom:solid 2px #523a78;outline:0}
.theme_form label { font-weight: 600; font-size: 1.625rem; color: var(--theme-color); white-space: nowrap; }
small.text-danger {
    position: absolute;
    bottom: -25px;
    width: 100%;
    left: 0;
}

.theme_form input, .theme_form select, .theme_form textarea{width:100%; padding-left: 1rem; color: var(--theme-color); font-weight: 600;}
.theme_form .form_group{display:flex;      position: relative;   margin-bottom: 3rem;;}
.theme_form .form_group input, .theme_form .form_group select{border:none;border-bottom:solid 2px #523a78}
.theme_form .form_group select, .theme_form .form_group input[type="number"]  { background: transparent; appearance: none}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}

.theme_form textarea {  resize: none;}

.form_group_comment label {display: block;}
.form_group_comment textarea {background-image: url(../images/line.png);  width: 100%;
    background-image: repeating-linear-gradient(0deg, rgb(82, 58, 120), rgb(82, 58, 120) 1.8px, rgb(255, 255, 255) 1.8px, rgb(255, 255, 255));
    background-size: 36px 36px;
    border: none; line-height: 37px; overflow: hidden;}

.form_group_inline {     align-items: center;
    gap: 1rem;}
.state_field {width: 70%;   position: relative; display: flex;}
.age_field { width: 30%; position: relative; display: flex;}
.form_group_comment.form_group {display: block;}

.optional_text {    color: #777; font-weight: 400;font-size: 1rem;}


.upload_images_filed {display: flex;}
.upload-box{width: 100%;border:3px dashed #ccc;background:#ffe6ff;
    margin-left: 1rem;     padding-top: 0.8rem; border-radius:30px;display:flex;justify-content:center;align-items:center}
.upload-content{text-align:center;font-family:Arial,sans-serif}
.upload-icon img{    height: 3rem;}
.upload-text{font-size:18px;margin:8px 0}
.or{margin:5px 0;font-weight:700}
.browse-btn{background: #3577ff; padding: 3px 12px; color: #fff !important; border-radius: 20px; cursor: pointer; display: inline-block; font-size: 0.875rem !important;}
.browse-btn input{display:none}
.file-name{font-size:13px;margin-top:10px;color:#444}
.supported{margin-top:8px;font-size:11px;color:#777}
.submit_btn { all: unset;}
.submit_btn { font-weight: 600; background-color:#da1b6e; display: inline-block; color: #fff; text-decoration: none; border-radius: 15px; font-size: 2.188rem;
    padding: 0.4rem 5rem 0.3rem;}
    .form_btn {text-align: center; margin-top: 3rem;}


.common_text{text-align:center;padding:5rem 0}
.common_text p{font-size:1.625rem;font-weight:300;     margin-bottom: 2rem;}
.testimonial_bg {
    width: 100%;
}
.box_type_3 .testimonial_data {
    flex-direction: column;
    text-align: center;
    padding-inline: 4rem;
    padding-top: 1.2rem;
        gap: 0.2rem;
}

.load_more_btn { text-align: center; font-weight: 600;
    font-size: 1.25rem;
    color: #fff; cursor: pointer;}
   .load_more_btn .prev_arrow {    transform: rotate(180deg);     transform-origin: right;}
      .load_more_btn span.text { padding: 0 1rem;     font-size: 1.625rem;}
.footer_sec {position: absolute; bottom: 0;}

.show_lg {display: block;}
.show_sm {display: none;}
.preview-img {
    
  
        width: 60px;
    height: 60px;
        margin: 0 auto;
    border-radius: 50%;
}
.preview-img img {}

.testimonial_data {     justify-content: center;     align-items: center;  flex-direction: column;}
.right_info{ text-align: center;}
.pop_btn {color: #da1b6e;     text-decoration: underline;
    font-style: italic; cursor: pointer;}
    .btn-close {      top: 1rem;  position: absolute;
    right: 1rem;}
    .modal-content {    border: solid 3px #da1b6e;}
    .modal-title {display: flex; gap:1rem}
 #modalName {font-size: 1.625rem;
    color: var(--theme-color);}


    /* width */
.modal-body::-webkit-scrollbar {
  width: 5px;
}

/* Track */
.modal-body::-webkit-scrollbar-track {
  background: #888; 
}
 
/* Handle */
.modal-body::-webkit-scrollbar-thumb {

   background: var(--theme-color); 
}

/* Handle on hover */
.modal-body::-webkit-scrollbar-thumb:hover {
  background: #555; 
}


@media(max-width:767px){
    html {font-size: 15px;}
.right_info .text{margin-top:auto}
.user_info{margin-bottom:auto}
.testimonial_grid{grid-template-columns:repeat(1,1fr)}
.bg_white {padding: 3rem 1rem;}
.cs_logo {padding-top: 2rem;}
.cs_logo img {    height: 5.75rem;}
.show_lg {display: none;}
.show_sm {display: block;}

.bg_all_graph_top {     width: 125%;}
.bg_all_graph_bottom{              bottom: -6rem;  width: 125%;}
.no_image .box_type_5 .testimonial_data { justify-content: center;}
.theme_form .form_group {flex-wrap: wrap;}
.state_field , .age_field{width: 100%; flex-wrap: wrap;}
.state_field {margin-bottom: 3rem; }
.form_group_inline { gap: 0;}
.upload_images_filed{flex-wrap: wrap;}
.theme_form textarea {    height: 8.188rem;}

.testimonial_grid li:nth-child(6n + 2) { transform: translateX(0rem);}
.box_type_2 .user_info {    margin-left: 0;}
.box_type_3 .testimonial_data { justify-content: center;padding-inline: 5rem;}
.box_type_5 .user_info { margin-left: 0;}

.box_type_1  .testimonial_data{    text-align: center;}
/* .box_type_1  .comma_img {left: 5rem;top: 2rem; position: absolute;} */
.box_type_1 .testimonial_data {flex-direction: column;        justify-content: center;}
.right_info .text {    font-size: 1rem;}

.box_type_2 .testimonial_data {flex-direction: column; text-align: center; justify-content: center;}
.box_type_2 .left_info { padding-bottom: 0;}
/* .box_type_2  .comma_img {left: 5rem;top: 2rem; position: absolute;} */


.box_type_4 .testimonial_data {flex-direction: column; text-align: center; justify-content: center;}
.box_type_4 .left_info { padding-bottom: 0;}
/* .box_type_4  .comma_img {left: 5rem;top: 2rem; position: absolute;} */

.box_type_5 .testimonial_data {flex-direction: column; text-align: center; justify-content: center;}
.box_type_5 .left_info { padding-bottom: 0;}
/* .box_type_5  .comma_img {left: 5rem;top: 2rem; position: absolute;} */

.box_type_6 .testimonial_data {flex-direction: column; text-align: center; justify-content: center;}
.box_type_6 .left_info { padding-bottom: 0;}
/* .box_type_6  .comma_img {left: 5rem;top: 2rem; position: absolute;} */

.load_more_btn .prev_arrow{    transform-origin: center;}
.load_more_btn span.text{    padding: 0 0.5rem; font-size: 1.375rem;}
.load_more_btn {display: flex; justify-content: center; align-items: center;}

.supported span {display: block;}
.upload-box { margin-left: 0; margin-top: 0.5rem;}
.common_text {    padding: 5rem 0 1rem;}
.common_text p {font-size: 1.125rem;    margin-bottom: 1rem;}
}