/* Index page css */
/* Box sizing */
*,
*::before,
*::after {
    box-sizing: border-box;
}

body{
   
}
h1{
    font-family: "Cormorant", serif !important;
  font-optical-sizing: auto;
  font-weight: 700 !important;
  font-style: italic !important;
  text-transform: capitalize !important;   
  font-size: 35px !important;
}
h2{
   font-family: "Cormorant", serif !important;
  font-optical-sizing: auto !important;
  font-weight: 700 !important;
  font-style: italic !important;
text-transform: capitalize !important;
   font-size: 35px !important;
}
h3{
   font-family: "Cormorant", serif !important;
  font-optical-sizing: auto;
  font-weight: 700 !important;
  font-style: italic !important;
text-transform: capitalize !important;
   font-size: 35px !important;
}
h4{
    font-family: "Cormorant", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: italic;
text-transform: capitalize !importants;
}
p{
     font-family: "Rubik", serif !important;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}
.qodef-m-title{
   font-family: "Cormorant", serif !important;
  font-optical-sizing: auto;
  font-weight: 700 !important;
  font-style: italic !important;
text-transform: capitalize !important;
   font-size: 35px !important;
    
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
  /*font-family: 'Montserrat', sans-serif;*/
}

.loader_bg{
  position: fixed;
  z-index: 9999999;
  background-color: #fff;
  width: 100%;
  height: 100%;
}

.loader{
  border: 0 solid transparent;
  border-radius: 50%;
  width: 150px;
  height: 150px;
  position: absolute;
  top: calc(50vh - 75px);
  left: calc(50vw - 75px);
}

.loader:before, .loader:after{
  content: '';
  border: 1rem solid #180a07;
  border-radius: 50%;
  width: inherit;
  height: inherit;
  position: absolute;
  top: 0;
  left: 0;
  animation: loader 2s linear infinite;
  opacity: 0;
}
.loader:before{
  animation-delay: .5s;
}
@keyframes loader{
  0%{
    transform: scale(0);
    opacity: 0;
  }
  50%{
    opacity: 1;
  }
  100%{
    transform: scale(1);
    opacity: 0;
  }
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
.nav-head{
  position: fixed;
  z-index: 1;
  width: 100%;
}

form {
  margin: 0;
}

.nav-link.active::after {
  width: 100%; /* Expand the underline on the active link */
}
.nav-link{
    text-decoration: none;
}

.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0; 
  height: 2px; 
  background-color: #000; 
  transition: width 0.3s ease;
  /*border: 1px dotted;*/
}

.nav-link:hover::after {
  width: 100%; 
}

.navbar-brand{
  margin-left: 174px;
}

.logo-set{
  width: 50px;
  margin-right: 20px;
}
.astro-set{
  font-size: 30px !important;
  font-weight: 600;
}

.msv{
  justify-content: flex-start !important;
}
.navbar-nav{
  gap: 45px;
  margin-left: 70px;
}

.nav-item .nav-link{
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  position: relative; 
}

button,
input,
select,
textarea {
    font-size: 100%; /* 1 */
    margin: 0; /* 2 */
    vertical-align: baseline; /* 3 */
    vertical-align: middle; /* 3 */
}

button,
input {
    line-height: normal;
}

button,
select {
    text-transform: none;
}

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button; 
    cursor: pointer; /* 3 */
    overflow: visible;  /* 4 */
}

body {
  font-family: 'Montserrat', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1;
}

.home-page-bg-image{
  background-image: url('/../assets/img/astrowebsiteimg1.png');
  background-size: cover;
}
.mental-health-bg-image{
  background: rgb(31 28 28); ;
}




/* About page css */
.aboutus-section {
  background-color: #ffffff;
  width: 100%;
  color: #ffffff;
  background-color: rgba(0, 0, 0, 0.5);
  padding-top: 2rem;
  padding-bottom: 2rem;
  }
  
  .aboutus-section-container {
  width: 90%;
  border: 1px solid #ccc;
  background-color:rgba(0, 0, 0, 0.9);
  border-radius: 10px; 
  padding: 2rem;
  margin: auto;
    
  }
  .aboutus-section_heading{
    width: 850px;
    margin: auto;
    text-align: center;
  }
  .aboutus-section-content{
    width: 70%;
    margin: auto;
  }
  .aboutus-section_heading h2{
    font-weight: 700;
    color: white;
    font-size: 30px;
  }
 
  
  /* Media query for medium-sized screens */
  @media (min-width: 38.1rem) and (max-width: 70rem) {
    .aboutus-section {
      height: auto; /* Set height to auto for dynamic content */
    }
    .aboutus-section-container {
      height: auto; /* Set height to auto for dynamic content */
    }
    .aboutus-section_heading {
      font-size: 2rem;
      padding: 0; /* Adjust padding for better spacing */
    }
  }
  
  /* Media query for small screens */
  @media (max-width: 38rem) {
    .aboutus-section {
      background-color: #0e0101;
      flex-direction: column;
      align-items: center;
    }
    .aboutus-section-container {
      margin-top: 1rem;
      height: auto; /* Set height to auto for dynamic content */
    }
    .aboutus-section_heading,
    .aboutus-section_heading-sub {
      font-size: 1rem;
    }
    .aboutus-section_details {
      font-size: 1.1rem;
      padding: 1rem 0; /* Adjust padding for better spacing */
    }
  }
 
  /* Astrologer chat talk page css */
  .astrologer-chat-talk-section {
    background: url("../../assest/astrowebsiteimg2.png");
    background-size: cover;
    background-color: rgba(0, 0, 0, 0.6);
  }
  
  .astrologer-chat-talk-heading-container {
    color: #fff;
    width: 100%;
  }
  
  .astrologer-chat-talk-heading-box {
    border: 1px solid #ccc;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    place-items: center;
    justify-content: center;
    height: 7rem;
    font-size: 2.8rem;
    letter-spacing: 0.2rem;
    font-weight: 800;
    border-left: none;
    border-right: none;
  }
  
  
 


  
  .user-info-section {
    border: 1px solid #ccc;
    border-inline: none;
    background-color: rgba(0, 0, 0, 0.6);
    height: 5rem;
    display: flex;
    color: #fff;
    align-items: center;
    justify-content: space-between;
  }
  
  .user-info-section p {
    padding-left: 2rem;
    padding-right: 40rem;
  }
  
  .recharge-btn {
    border: 2px solid;
    border-color: #fdfdfd;
    border-radius: 5px;
    background: none;
    border-color: #fdfdfd;
    border-radius: 5px;
    color: #fff;
    padding-inline: 1rem;
    margin-right: 2rem;
    height: 2rem;
  }
  
  .astrologers-card-wrapper-box {
    padding-block: 2rem;
    background: url("../../assest/astrowebsiteimg2.png");
    background-size: cover;
    background-color: rgba(0, 0, 0, 0.6);
  }
  
  .astrologers-card-wrapper-box-container {
    margin-inline: auto;
    max-width: 75rem;
    display: flex;
    flex-wrap: wrap;
    row-gap: 1rem;
    justify-content: space-evenly;
  }
  
  .astrologers-details-card-container {
   
    background-color: #ffffff;
    border: 2px solid;
    border-color: #d7d7d7;
    border-radius: 10px;
    display: flex;
  }
  
  .details-card-rightside {
    display: flex;
    flex-direction: column;
  }
  
  .details-card-rightside :nth-child(1) {
    width: 6rem;
    margin-left: 0.5rem;
    margin-top: 0.5rem;
  }
  
  .details-card-rightside :nth-child(2) {
    padding-top: 1rem;
    padding-left: .8rem;
    width: 6rem;
  }
  
  .details-card-leftside {
    display: flex;
    flex-direction: column;
    padding: 1.5rem 2rem;
    gap: 0.6rem;
    justify-content: center;
  }
  
  .details-card-leftside_name_verify {
    display: flex;
    gap: 2rem;
  }
  
  .details-card-leftside_name_verify img {
    width: 1.2rem;
  }
  
  .details-card-leftside_bottom {
    width: 10rem;
    display: flex;
    justify-content: space-between;
  }
  
  .details-card-leftside_bottom h5{
    font-weight: 600;
  }
  
  
  .btngreen,
  .btngray {
    color: #ffffff;
    padding: 0.2rem;
    width: 4rem;
    font-size: 1.5rem;
  }
  
  .btngreen {
    background-color: #47d65e;
  }
  
  .btngray {
    background-color: #767676;
  }
  
  .contact-section {
    margin-top: 3rem;
    color: #ffffff;
  }
  
  .contact-section-container {
    width: 60%;
    margin-inline: auto;
    height: 20rem;
    background-color: rgba(0, 0, 0, 0.6);
    padding: 1.5rem 2rem;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
  }
  
  .contact-section-container h2 {
    font-size: 1.5rem;
    font-weight: 800;
  }
  
  .contact-section-container input {
    background-color: #d7d7d7;
    border-radius: 5px;
    width: 14rem;
    height: 2.5rem;
    color: rgba(141, 141, 141, 1);
    padding: 1rem 1rem;
    font-size: 0.95rem;
  }
  
  .top-right-side-inputs input {
    width: 3.5rem;
    height: 2.5rem;
    padding: 0.8rem;
    margin-right: 0.4rem;
  }
  .top-right-side-inputs input:nth-child(3) {
    width: 7rem;
    text-align: start;
  }
  
  .contact-form-top,
  .contact-form-bottom {
    display: flex;
    gap: 2rem;
  }
  
  .contact-form-top {
    padding-bottom: 1rem;
  }
  
  .contact-form-bottom {
    padding-top: 1rem;
  }
  
  .send-btn {
    text-align: center;
    padding-block: 2rem 1.5rem;
  }
  
  .send-btn button {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 10px;
    color: rgba(0, 0, 0, 1);
    width: 12em;
    height: 2.2em;
    font-weight: 700;
    font-size: 1.4rem;
  }
  
  @media (min-width: 30.1rem) and (max-width: 75rem) {
    .astrologer-chat-talk-section {
      overflow: hidden;
    }
  
    .astrologer-chat-talk-heading-box {
      height: 5.5rem;
      font-size: 2.1rem;
    }

  

  
  
    .user-info-section p {
      padding: 0;
      padding-inline: 1rem;
    }
    .astrologers-card-wrapper-box-container {
      max-width: 50rem;
      margin-inline: auto;
    }
  
    .astrologers-details-card-container {
      width: 16rem;
      margin-inline: auto;
      height: 10rem;
    }
  
    .details-card-rightside {
      width: 50%;
    }
  
    .details-card-leftside {
      padding: 0.5rem 0.4rem;
      width: 50%;
    }
  
    .details-card-leftside_name_verify {
      font-size: 0.8rem;
      gap: .5rem;
    }
  
    .details-card-leftside_name_verify img {
      width: 0.8rem;
    }
  
    .details-card-leftside {
      font-size: 0.6rem;
    }
  
    .details-card-rightside :nth-child(1) {
      width: 5rem;
      height: 8rem;
    }
  
    .details-card-rightside :nth-child(2) {
      width: 4rem;
      padding-left: 1rem;
      padding-bottom: 2rem;
    }
  
    .details-card-leftside_bottom {
      width: 4rem;
      flex-direction: column;
      height: 3rem;
    }
  
    .details-card-leftside_bottom button {
      width: 4rem;
      font-size: 1.1rem;
    }
    .contact-section-container {
      width: 95%;
    }
  
    .contact-section-container input {
      width: 10rem;
    }
    .top-right-side-inputs input {
      width: 3.5rem;
      height: 2.5rem;
      padding: 0.8rem;
      margin-right: 0.4rem;
    }
    .top-right-side-inputs input:nth-child(3) {
      width: 5rem;
    }
  }
  
  @media (max-width: 30rem) {
    .astrologer-chat-talk-heading-box {
      display: block;
      font-size: 1.4rem;
      padding-inline: 1rem;
      height: 5rem;
      text-align: center;
      padding-block: 1.6rem;
    }

  
 
    .user-info-section {
      margin-top: 1rem;
    }
  
    .user-info-section p {
      padding-right: 0;
    }
  
    .astrologers-card-wrapper-box {
      padding: 1rem 0;
    }
  
    .astrologers-details-card-container {
      width: 11.5rem;
      margin-inline: auto;
      height: 10rem;
    }
  
    .details-card-rightside {
      width: 50%;
    }
  
    .details-card-leftside {
      padding: 0.5rem 0.4rem;
      width: 50%;
    }
  
    .details-card-leftside_name_verify {
      font-size: 0.5rem;
      gap: .5rem;
    }
  
    .details-card-leftside_name_verify img {
      width: 0.8rem;
    }
  
    .details-card-leftside {
      font-size: 0.6rem;
    }
    
    .details-card-leftside p{
      font-size: .59rem;
    }
  
    .details-card-rightside :nth-child(1) {
      width: 5rem;
      height: 6rem;
      margin-top: 0;
      margin-left: 0.2rem;
    }
  
    .details-card-rightside :nth-child(2) {
      width: 4rem;
      padding-left: 1rem;
    }
  
    .details-card-leftside_bottom {
      width: 4rem;
      flex-direction: column;
      height: 3rem;
    }
  
    .details-card-leftside_bottom button {
      width: 4rem;
      font-size: 1rem;
    }
    .contact-section-container {
      padding: 0.5rem;
      width: 95%;
      height: 24rem;
      gap: 4rem;
    }
    .contact-section-container label {
      font-size: .9rem;
    }
    .contact-section-container input {
      width: 10rem;
      padding: 0.3rem;
      font-size: .7rem;
    }
    .top-right-side-inputs input {
      text-align: center;
      width: 2.5rem;
      height: 2.5rem;
      padding: 0.3rem;
      margin-right: 0.4rem;
    }
    .top-right-side-inputs input:nth-child(3) {
      width: 3.5rem;
      text-align: center;
      margin: 0;
    }
  }
  
  @media (min-width: 1500px) {
    .astrologers-card-wrapper-box-container {
      width: 80rem;
      margin-inline: auto;
      gap: 3rem;
    }
    .contact-section-container {
      max-width: 50rem;
    }


  .user-info-section {
    justify-content: center;
  }
  }

  /* Constellation Box Page css */

.constellation-box-section {
    width: 80%; /* Make the component fluid */
    max-width: 300px; /* Limit maximum width */
    margin: auto; /* Center the component horizontally */
    border: 1px solid #cbcbcb;
    border-radius: 10px;
    background-color: rgba(0, 0, 0, 1.0);
    color: rgba(255, 255, 255, 1);
    overflow: hidden; /* Ensure content doesn't overflow */
  }
  
  .constellation-box-image {
    position: inherit /* Ensure positioning context for image */
  }
  
  .constellation-box-image img {
    width: 100%; /* Make the image fluid */
    display: block; /* Ensure proper rendering */
  }
  
  .constellation-box-section span {
    display: block; /* Ensure proper rendering */
    font-weight: 600;
    padding: 10px; /* Add padding for text */
    font-size: 17px;
  }
  
  /* Adjustments for smaller screens */
  @media (max-width: 576px) {
    .constellation-box-section {
      max-width: 100%; /* Remove maximum width constraint */
    }
  
    .constellation-box-section span {
      text-align: center; /* Center text */
    }
  }


  /* Contact Us Page css */

  .contacts-wrapper {
    background-color: #ffffff;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
  }
  
  .contacts-wrapper .overlap-wrapper {
    background-color: #ffffff;
    height: 30rem;
    width: 100%;
  }
  
  .overlap-image {
    background-color: #a2a2a2;
    height: 30rem;
    position: relative;
    width: 100%;
  }
  
  .overlap-image img {
    height: 30rem;
    mix-blend-mode: luminosity;
    position: absolute;
    width: 100%;
    object-fit: cover;
    opacity: 0.75;
  }
  
  .overlap-group-wrapper {
    position: absolute;
    height: 25rem;
    width: 90%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -55%);
  }
  
  .overlap-group_container {
    background-color: #00000099;
    border: 1px solid;
    border-color: #cbcbcb;
    border-radius: 10px;
    position: relative;
    height: 26rem;
  }
  
  .overlap-group_container_heading {
    width: inherit;
  }
  
  .overlap-group_container_heading h4 {
    padding: 2.1rem 0;
    text-align: center;
    color: #ffffff;
    font-size: 2.5rem;
    letter-spacing: 0;
    line-height: normal;
  }
  
  .overlap-group_container_details {
    display: flex;
    color: rgba(255, 255, 255, 1);
  }
  
  .overlap-group_container_details_left,
  .overlap-group_container_details_right {
    width: 45%;
    height: 13rem;
  }
  
  .overlap-group_container_details_right {
    padding: 1rem;
    padding-bottom: 0;
  }
  
  .overlap-group_container_details_left {
    padding-inline: 2rem;
  }
  
  .overlap-group_container_details_left p {
    padding: 2rem 3rem;
    line-height: normal;
    font-size: 1.5rem;
    font-weight: 500;
  }
  
  .form-top-side,
  .form-bottom-side {
    display: flex;
    gap: 1.2rem;
    margin-top: 1rem;
  }
  
  .flex-coloum {
    display: flex;
    flex-direction: column;
  }
  
  .input-box-left-side,
  .input-box-right-side {
    display: flex;
  }
  
  .from-top-left-side,
  .from-top-right-side,
  .from-bottom-left-side,
  .from-bottom-right-side {
    color: #ffffff;
    font-weight: 600;
  }
  
  .from-top-left-side label,
  .from-top-right-side label,
  .from-bottom-left-side label,
  .from-bottom-right-side label {
    font-size: 0.8rem;
    padding-left: 0.2rem;
  }
  
  .overlap-group_container_details_right input {
    background-color: #d7d7d7;
    border-radius: 5px;
    width: 14rem;
    height: 2.5rem;
    color: rgba(141, 141, 141, 1);
    padding: 1rem 1rem;
    font-size: 0.95rem;
  }
  
  .input-box-right-side.dob :nth-child(1),
  .input-box-right-side.dob :nth-child(2) {
    width: 3.5rem;
    height: 2.5rem;
    padding: 0.8rem;
    margin-right: 0.4rem;
  }
  
  .input-box-right-side.dob :nth-child(3) {
    width: 7rem;
    text-align: center;
  }
  
  .signup-btn-section {
    text-align: center;
  }
  
  .signup-btn-section .signup-btn {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 10px;
    color: rgba(0, 0, 0, 1);
    width: 16em;
    height: 2.2em;
    font-weight: 700;
    font-size: 1.4rem;
  }
  
  @media (min-width: 38.1rem) and (max-width: 70rem) {
    .contacts-wrapper .overlap-wrapper {
      height: 38rem;
    }
    .overlap-image {
      height: inherit;
    }
    .overlap-image img {
      height: inherit;
    }
    .overlap-group-wrapper {
      height: 30rem;
    }
    .overlap-group_container {
      height: 33rem;
    }
  
    .overlap-group_container_details {
      flex-direction: column;
    }
    .overlap-group_container_details_left {
      width: 100%;
    }
    .overlap-group_container_heading h4 {
      padding-bottom: 0.8rem;
    }
    .overlap-group_container_details_left {
      margin-inline: auto;
      height: 8rem;
    }
    .overlap-group_container_details_left p {
      font-size: 1.2rem !important;
    }
  
    .overlap-group_container_details_right {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
    }
  }
  
  @media (max-width: 38rem) {
    .contacts-wrapper .overlap-wrapper {
      height: 33rem;
    }
  
    .overlap-image {
      height: 33rem;
    }
  
    .overlap-image img {
      height: 33rem;
    }
  
    .overlap-group-wrapper {
      height: 28rem;
    }
  
    .overlap-group_container {
      height: 31rem;
    }
  
    .overlap-group_container_heading {
      margin-top: 1.5rem;
    }
  
    .overlap-group_container_heading h4 {
      font-size: 1.5rem;
      padding: 1.1rem 0 0 0;
    }
  
    .overlap-group_container_details {
      flex-direction: column;
    }
  
    .overlap-group_container_details_left {
      height: 8rem;
      width: 100%;
      padding-inline: 0;
      text-align: center;
    }
  
    .overlap-group_container_details_left p {
      padding: 1rem;
      font-size: 1.1rem;
    }
  
    .overlap-group_container_details_right {
      width: 100%;
      display: flex;
      flex-direction: column;
      padding: 0;
      padding-inline: 1.5rem;
    }
  
    .overlap-group_container_details_right input {
      width: 8rem;
      font-size: 0.7rem;
      padding: 0.3rem;
    }
  
    .input-box-right-side.dob :nth-child(1),
    .input-box-right-side.dob :nth-child(2) {
      width: 3rem;
    }
  
    .input-box-right-side.dob :nth-child(3) {
      width: 3rem;
    }
    .signup-btn-section .signup-btn {
      width: 10em;
    }
  }
  
  @media (min-width: 1500px) {
    .overlap-group-wrapper {
      max-width: 85rem;
    }
    .overlap-group_container_details_left {
      max-width: 36rem;
    }
    .overlap-group_container_details {
      justify-content: center;
    }
  }

  
  /* Footer Page Css */

  .footer-container {
    width: 100%;
    background-color: black;
    color: rgba(255, 255, 255, 1);
    padding-top: 2.5rem;
    padding-bottom: 1rem;
  }
  
  .footer_sec {
    width: 90%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    padding-right: 15px;
    padding-left: 15px;
  }
  
  .footer_right_sec {
    width: 30%;
  }
  
  .footer-contact_sec {
    width: 30%;
  }
  
  .footer-important_sec {
    width: 25%;
  }
  
  .footer_right_sec h2,
  .footer-important_sec h2,
  .footer-contact_sec h2 {
    font-size: 1.5rem;
    font-weight: 600;
  }
  
  .footer_right_sec p {
    padding-top: 0.5rem;
    padding-right: 0.5rem;
    text-align: justify;
    line-height: 1.3;
  }
  
  .footer-important_sec h3 {
    padding-top: 0.8rem;
  }
  
  .footer-important_sec  a {
    font-size:1.1rem;
    font-weight:600;
    color: rgba(255, 255, 255, 1);
  }
  
  .footer-contact_sec p {
    padding-top: 0.7rem;
  }
  
  .footer-social-icon i {
    font-size: 2.1rem;
    margin-top: 0.9rem;
    margin-right: 1rem;
    transition: 0.3s ease-in;
  }
  
  .footer-social-icon i:hover,
  .footer-social-icon i:active,
  .footer-social-icon i:focus {
    color: white;
    transform: scale(1.4);
  }
  
  @media (max-width: 38rem) {
    .footer_sec {
      flex-wrap: wrap;
      gap: 1rem;
    }
  
    .footer_right_sec {
      width: 100%;
    }
    .footer-important_sec {
      width: 100%;
    }
    .footer-contact_sec {
      width: 100%;
    }
    .footer-social-icon {
      margin-top: 1rem;
    }
  
    .footer-social-icon i {
      font-size: 2.5rem;
      margin-right: 2rem;
    }
  }
  
  @media (min-width: 1500px) {
    .footer_sec {
      max-width: 85rem;
      
    }
    .footer_right_sec {
      max-width: 20rem;
    }
    .footer-important_sec {
      max-width: 12rem;
    }
    .footer-contact_sec {
      max-width: 12rem;
    }
  }

  
  /* Hero Page Css */

.hero-section-container {
    background-color: rgba(0, 0, 0, 0.6);
    width: 100%;
    padding-bottom: 2.8rem;
    padding-top: 1rem;
  }
  
  .main-section-details {
    text-align: center;
  }
  
  .banner-pc {
    width: 90%;
    max-width: 85rem; /* Limit maximum width for larger screens */
    border-radius: 10px;
    margin: auto; /* Center the banner */
  }
  
  .banner-mobile {
    display: none;
  }
  
  .constellation-section {
    text-align: center;
    padding-top: 5.5rem;
  }
  
  .constellation-section-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); /* Responsive grid layout */
    gap: 1rem;
    width: 80%; /* Adjust width for responsiveness */
    max-width: 85rem; /* Limit maximum width for larger screens */
    margin: auto; /* Center the grid */
  }
  
  /* Media query for smaller screens */
  @media (max-width: 38rem) {
    .banner-pc {
      display: none;
    }
  
    .banner-mobile {
      display: block;
      width: 90%;
      border-radius: 10px;
      margin: auto; /* Center the banner */
    }
  
    .constellation-section {
      padding-top: 3rem;
    }
  
    .constellation-section-container {
      width: 90%; /* Adjust width for smaller screens */
    }
  }

  /* InsightStore Page css */
  .insight-store-main-section {
    background: url("../../assest/astrowebsiteimg2.png");
    background-size: cover;
    overflow: hidden;
  }
  
  .insight-store-heading-container {
    color: #fff;
    width: 100%;
  }
  
  .insight-store-heading_box {
    border: 1px solid #ccc;
    background-color: rgba(0, 0, 0, 0.6);
    display: grid;
    justify-content: center;
    height: 8rem;
    border-left: none;
    border-right: none;
  }
  
  .insight-store-heading_box_details {
    display: grid;
    justify-items: center;
    padding: 1rem;
  }
  
  .insight-store-heading_box_details h1 {
    font-size: 2.4rem;
    letter-spacing: 0.2rem;
    font-weight: 800;
  }
  
  .insight-store-heading_box_details p {
    font-size: 1.5rem;
  }
  
  .insight-store-card-section {
    background: url("../../assest/astrowebsiteimg2.png");
    background-size: cover;
  }
  .insight-store-card-section-container {
    margin-inline: auto;
    max-width: 70rem;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: center;
    row-gap: 3rem;
    padding: 2rem 5rem;
  }
  
  .insight-store-card-box {
    height: 16.5rem;
    width: 13.5rem;
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 2px 3px 4.8px #00000040;
  }
  
  .insight-store-card-box img {
    border-radius: 10px 10px 0 0;
    height: 12rem;
    width: 100%;
  }
  
  .insight-store-card-box_details {
    display: flex;
    justify-content: space-around;
  }
  
  .insight-store-card-box_name {
    padding-block: 0.4rem;
    width: 9.5rem;
    font-size: 0.8rem;
  }
  
  .insight-store-card-box_name .bold {
    font-weight: 800;
  }
  .insight-store-card-box_price {
    padding-top: 0.5rem;
    font-size: 0.8rem;
    color: #fe0000;
  }
  
  .whatsapp-send-btn {
    padding-inline: 0.5rem;
    text-decoration: none;
    color: black;
    font-size: 1rem;
    background-color: #bfb4b4;
    padding: 0.5rem;
    display: block;
    text-align: center;
    border-radius: 0 0px 10px 10px;
  }
  
  @media (min-width: 38.1rem) and (max-width: 60rem) {
    .insight-store-card-section-container {
      gap: 1rem;
      justify-content: space-evenly;
      padding: 1rem 3rem;
      margin-inline: auto;
    }
  }
  
  @media (max-width: 38rem) {
    .insight-store-heading_box_details {
      justify-items: normal;
    }
    .insight-store-heading_box_details h1 {
      font-size: 2rem;
    }
  
    .insight-store-card-section {
      flex-wrap: wrap;
      gap: 1.5rem;
      justify-content: space-evenly;
      padding: 0.5rem;
    }
  
    .insight-store-card-section-container {
      gap: 1rem;
      justify-content: space-evenly;
      row-gap: 2rem;
      padding: 0;
      padding-block: 1rem;
      margin-inline: auto;
    }
    .insight-store-card-box {
      width: 10.5rem;
    }
  
    .insight-store-card-box_name {
      width: 7.5rem;
      padding-inline: 0.4rem;
      font-size: 0.7rem;
    }
  
    .insight-store-card-box_price {
      padding-right: 0.5rem;
      font-size: 0.7rem;
    }
    .whatsapp-send-btn {
      padding: 0.5rem;
    }
  }
  
  @media (min-width: 1500px) {
    .insight-store-card-section-container {
      width: 82rem;
      margin-inline: auto;
    }
  }

  
  /* MentalHealth Page css */

  .mental-health-section {
    height: 30rem;
    display: flex;
    justify-content: center;
  }
  
  .mental-health-section img {
    width: 100%;
    height: inherit;
  }
  
  @media (max-width: 38rem) {
    .mental-health-section img {
      object-fit: fill;
      width: 100vw;
    }
  }
  
  @media (min-width: 1500px) {
    .mental-health-section {
      height: 40rem;
    }
  
    .mental-health-section img {
      max-width: 85rem;
    }
  }


  


  

 


  
 
  
  


  
  
 
  
  input[type="number"]::-webkit-inner-spin-button,
  input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
  }
  
  .login-popup-container button {
    margin-top: 0.3rem;
    background-color: rgba(0, 0, 0, 1);
    height: 3rem;
    border-radius: 10px;
    color: rgba(255, 255, 255, 1);
  }

  .login-btn{
    background-color: black;
    color: white;
    /* padding: 5px; */
    border-radius: 19px;
    padding: 5px 26px;
    border: none;
  }
  .login-btn:hover{
    background-color: #3E3E3E;
    transition: all 1s;
  }
  
  .no-scroll {
    overflow: hidden;
  }
  

  /* Media query for mobiles */
  .astro-bg{
    background-color: #000;
    width: 90%;
    margin: auto;
    padding: 30px;
    margin-top: 60px;
    border-radius: 15px;
    border: 1px solid white;
    text-align: center;
  }
 
  .astro-head{
    width: 55%;
    margin: auto;
    margin-bottom: 40px;
  }

.astro-head h1{
      color: white;
        font-weight: 700;
        font-size: 40px;
        font-family: sans-serif;
}
 
.astro-head p{
  color: #d1cbcb;
    font-family: sans-serif;
}
.astro-head h3{
  color: white;
    
    font-family: sans-serif;
}

.astro-card-bg{
  width: 70%;
  margin: auto;
}
.astro-card{
  background-color: white;
    padding: 20px;
  align-items: center;
    border-radius: 12px;
    width: 80%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}

.astro-Img{
  width: 100px;
  
}
  
  .astro-profile-detail{
    text-decoration: none;
    position: absolute;
    top: 99px;
    color: white;
    background: #808080b5;
    padding: 5px;
    font-size: 10px;
  }
  .astro-card h5{
    font-weight: 600;
        margin-top: 10px;
  }
.star-astro{
  width: 80px;
}
.astro-talk{
  color: white;
    margin-top: 10px;
    background-color: #7bf77b;
    border: none;
    width: 81px;
    text-transform: capitalize;
    font-weight: 700;
}

.cls{
  text-align: -webkit-center;
}
  /* Share Icons Page css */

  .share-buttons {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
    position: fixed;
    left: 100vw;
    top: 95vh;
    transform: translate(-4vw, -55vh);
    z-index: 1000;
}
/* .login{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    position: absolute;
    left: 87.7rem;
    top: 68vh;
    transform: translate(-4vw, -55vh);
    background-color: white;
    border-top-left-radius: 20px; 
    border-bottom-left-radius: 20px;
    height: 40px;
    width:176px;
    
} */









@media (max-width: 38rem) {
    .share-buttons {
        transform: translate(-8vw, -55vh);
    }
}

/* HOW IT WORKS SECTION */
.how_it_works{
  background-color: #000000;
  padding: 2rem;
}

.create_account,.payment_information,.advisor,.start_chat{
  display: inline-block;
  background-color: white;
  border-radius: 7px;
  padding: 22px;
  height: 251px;  
}
.how_it_works_heading {
   text-align: center;
   color: white;
   
}
.how_it_works_heading h2{
  font-weight: 700;
  font-size: 40px;
}

.create_account p{
  text-align: justify;
  margin-right: 10px;
  font-size: 13px;
}
.payment_information{
  background-color: #E4F5FF;
}
.payment_information p{
  text-align: justify;
  margin-right: 10px;
  font-size: 13px;
}
.advisor{
  background-color: #D0EBFA;
}
.advisor p{
  text-align: justify;
  margin-right: 10px;
  font-size: 13px;
}
.start_chat{
  background-color: #BEE8FF;
}
.start_chat p{
  text-align: justify;
  margin-right: 10px;
  font-size: 13px;
}
.get_started{
  
  text-align: center;
  margin-top: 20px;
  font-size: 20px;
}
.get_started a{
  color: #BEE8FF;
}

/* WHY CHOOSE ASTROSUMI */

.why-choose-astrosumi-section{
    background-color: #ffffff;
    display: flex;
    justify-content: space-evenly;
    /* align-items: center; */
    width: 100%;
    color: #ffffff;
    height: auto; /* Set height to auto for dynamic content */
    background-color: rgba(0, 0, 0, 0.6);
}

.why-choose-astrosumi-container{
  
  width: 90%;
  border: 1px solid #ccc;
  background-color:rgba(0, 0, 0, 0.9);
  border-radius: 10px;
  padding: 2rem; 
  margin: auto;
  margin-top: 50px;
  margin-bottom: 30px;
}
.why-choose-astrosumi-left-part{
  width: 538px;
  height: 334px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  
}
.why-choose-astrosumi-left-part h2{
  font-weight: 700;
  font-size: 40px;
}
.why-choose-astrosumi-left-part p{
  font-weight: 200;

}
.why-choose-astrosumi-right-part{
  display: inline-block;
  width: 730px;
  /* height: 643px; */
}
.why-choose-astrosumi-sub-points{
  display: flex;
  gap: 16px;
  margin-top: 15px;
  /* justify-content: center; */
}
.why-choose-astrosumi-sub-points img{
  width:50px;
  height: 50px;
  
}

/* PEOPLE WHO LOVE US */

.people-love-us{
  background-color: #000000;
  color: white;
  padding: 2rem;
}
.people-love-us-heading{
  text-align: center;
}
.people-love-us-heading h2{
  font-weight: 700;
  font-size: 40px;
}
.people-love-us-heading p{
  font-weight: 200;
}
.people-love-us-card-1,.people-love-us-card-2,.people-love-us-card-3{
  background-color: white;
  color: #000000;
  border-radius: 10px;

}
.love-container{
  width: 60%;
  margin: auto;
}
.people-love-us-card-header{
  margin-top: 10px;
  display: flex;
  gap: 10px;
  padding: 10px;
}
.people-love-us-card-1 p{
  font-size: 15px;
 padding: 10px;
}
.people-love-us-card-2 p{
padding: 10px;
  font-size: 15px;
}
.people-love-us-card-3 p{
 padding: 10px;
  font-size: 15px;
}

/* READING WORKS SECTION */
.reading-works-section{
  background-color:#3E3E3E;
  color: white;
  text-align: center;
  display: flex;
  justify-content: space-evenly;
}
.reading-works-container{
  width:75%;
  text-align: center;
  align-items: center;
  padding: 2rem; /* Add padding for better spacing */
  margin-top: 30px;
  margin-bottom: 30px;
  height: auto;
}
.reading-works-heading h2{
  font-weight: 700;
  font-size: 30px;
}
.reading-works-content {
  margin-top: 35px;
  font-weight: 200;
  width: 80%;
  margin-left: 80px;
}




/* Astrologer chat talk page css */

.connect-with-astrologer-section{
  width: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  color: #ffffff;
  padding: 2rem;
  display: flex;
  justify-content: space-evenly;
}
.connect-with-astrologer-container{
width: 80%;
margin-top: 80px;
/* display: flex;
justify-content: space-evenly; */
background-color: rgba(0, 0, 0, 0.6);
border-radius: 10px;
border: 1px solid #ccc;
/* align-items: center; */
padding: 2rem;
}

.connect-with-astrologer-container-left h2{
font-weight: 700;
font-size: 38px;
}
.connect-with-astrologer-container-left h5{
font-weight: 600;
}
.connect-with-astrologer-container-left p{
font-weight: 100;
}

.astrologer-chat-talk-section {
  background-color: rgba(0, 0, 0, 0.6);
  padding-bottom: 1rem;
}

.astrologer-chat-talk-heading-container {
  color: #fff;
  width: 100%;
}

.astrologer-chat-talk-heading-box {
  border: 1px solid #ccc;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  place-items: center;
  justify-content: center;
  height: 7rem;
  font-size: 2.8rem;
  letter-spacing: 0.2rem;
  font-weight: 800;
  border-left: none;
  border-right: none;
}

.nav-list-item {
  width: 100%;
  height: 6rem;
  padding: 1rem;
}

.nav-list-item ul {
  display: flex;
  height: inherit;
  gap: 1rem;
}


.nav-list-item ul li {
  margin: auto 0;
  background-color: white;
  box-shadow: 1px 1px 5.7px rgba(0, 0, 0, 0.4);
  border: 1px solid #a4a4a4;
  height: 3rem;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: .9rem;
}

.nav-list-item ul li img {
  width: 20px;
  height: 20px;
}

.user-info-section {
  background-color: rgba(0, 0, 0, 0.6);
  height: 5rem;
  display: flex;
  color: #fff;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  
}
.user-info-balance p{
  text-align: center;
}
.user-info-buttons{
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}
.recharge-btn {
  border: 2px solid;
  border-radius: 5px;
  background: none;
  border-color: #fdfdfd;
  border-radius: 5px;
  color: #fff;
  padding-inline: 1rem;
  height: 2rem;
}
.filter-btn{
  background-color: rgba(207, 207, 207, 1);
  border: 2px solid;
  border-radius: 5px;
  display: flex;
  gap: 5px;
  font-weight: 500;
  height: 2.2rem;
  padding-inline: 1rem;
}
.search-btn{
  background-color: rgba(207, 207, 207, 1);
  border: 2px solid;
  border-radius: 5px;
  display: flex;
  font-weight: 300;
  height: 2.2rem;
  padding-inline: 1rem;
  gap: 5px;

}
.view-cart-btn{
  background-color: white;
  border: 2px solid;
  border-radius: 5px;
  display: flex;
  font-weight: 300;
  height: 2.2rem;
  gap: 5px;
  margin-left: 20px;
}

.astrologers-card-wrapper-box {
  background-size: cover;
  background-color: rgba(0, 0, 0, 0.9);
  padding: 2rem;
}

.astrologers-card-wrapper-box-container {
  display: flex;
  justify-content:center;
  gap: 15px;
}
.astrologer-card{
  background-color: #ffffff;
  border: 2px solid;
  border-color: #d7d7d7;
  border-radius: 10px;
  box-shadow: 2px 3px 4.8px #00000040;
  gap: 20px;
}

.astrologers-details-card-container {
  display: flex;
  gap: 20px;
  padding-top: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
}
.details-card-leftside{
  align-items: center;
}
.details-card-leftside_name_verify h5{
  font-weight: 600;
}

.details-card-leftside-reviews{
  display: flex;
  gap: 8px;
  padding: 0px;
  margin: 0px;
}

.details-card-leftside-reviews p{
  font-size: 12px;
}
.details-card-leftside-status button{
  background-color: white;
  border-radius: 20px;
  border-color: rgba(72, 215, 94, 1);
  border-width: 1.5px;
  border-style: solid;
  color: rgba(72, 215, 94, 1);
  padding-top: 1px;
  font-weight: 500;
  font-size: 13px;
  width: 50%;
}
.astrologer-card-lower-part-detail{
  display: flex;
  gap: 7px;
  /* padding: 0; */
}
.astrologer-card-lower-part-detail p{
  font-size: 14px;
}
.astrologer-card-lower-part-call{
  display: flex;
  background-color: rgba(217, 217, 217, 1);
  justify-content: space-evenly;
  padding: 0.5rem;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;

}
.astrologer-card-lower-part-call button{
  background-color: rgba(0, 71, 255, 1);
  color: white;
  border-radius: 25px;
  border-color: rgba(0, 71, 255, 1);
  font-size: 13px;
  border-style: solid;
  width: 27%;
  font-weight: 500;
  height: 40px;
}

.btn-astro{
  background-color: #47d65e !important;
  border: none !important; 
}
.astrologer-card-lower-part-call p{
  font-size: 13px;
  margin-top:10px;
  font-weight: 550;
}
.astrologer-card-lower-part{
  padding-left: 1rem;
  padding-right: 1rem;
}
.why-choose-online-astrologer-section{
  background-color: rgba(0, 0, 0, 0.9);
  color: white;
  padding: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  margin-top: 40px;
  margin-bottom: 30px;
}
.why-choose-online-astrologer-heading{
  text-align: center;
  width: 60%;
}
.why-choose-online-astrologer-heading h2{
  font-weight: 700;
  /* text-align: center; */
}
.why-choose-online-astrologer-container{
  background-color: rgba(62, 62, 62, 0.6);
  width: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  gap: 15px;
  text-align: center;
  border-radius: 13px;
  margin-top: 20px;
  /* margin-bottom: 20px; */
  
}
.why-choose-online-astrologer-card{
  width: 25%;
}
.why-choose-online-astrologer-card p{
  font-size: 13px;
}
.why-choose-online-astrologer-card h5{
  font-size: 15px;
  font-weight: 600;
  margin-top: 10px;
}
.why-choose-online-astrologer-link a{
  font-weight: 400;
  font-size: 20px;
  
}
.get-online-phsychic-reading-section{
  background-color: rgba(62, 62, 62, 1);
  color: white;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 3rem;
}
.get-online-phsychic-reading-heading{
  width: 70%;
}
.get-online-phsychic-reading-heading h2{
  font-size: 36px;
  font-weight: 600;
  
}
.get-online-phsychic-reading-detail p{
  font-size: 13px;
  text-align: center;
}


/* Adjustments for smaller screens */
@media only screen and (max-width: 768px) {

.astrologers-card-wrapper-box-container {
  flex-direction: column;
  align-items: center;
}

.astrologer-card {
  margin-bottom: 1rem;
}

.astrologers-details-card-container {
  gap: 15px;
}
.connect-with-astrologer-section {
  padding: 1rem;
}

.connect-with-astrologer-container {
  width: 100%;
  flex-direction: column;
  align-items: center;
  /* height: 490px; */
}

.connect-with-astrologer-container-left,
.connect-with-astrologer-container-right {
  width: 100%;
  text-align: center;
}

.connect-with-astrologer-container-left h2 {
  font-size: 25px;
}
.connect-with-astrologer-container-left h5{
  font-size: 15px;
}

.nav-list-item ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  row-gap: 1rem;
  justify-content: center;
  align-items: center;
  margin-right: 30px;
}

.nav-list-item ul li {
  align-items: center;
  justify-content: space-evenly;
  width: 8rem;
  font-size: 0.9rem;
  gap: 0px;
}
.user-info-section {
  height: auto;
  padding: 30px;
  flex-direction: column; /* Change to column layout on smaller screens */
  align-items: flex-start; /* Align items to the start */
}

.user-info-buttons {
  width: 100%; /* Make buttons full width */
  justify-content: flex-start; /* Align buttons to the start */
}

.recharge-btn,
.filter-btn,
.search-btn {
  width: calc(50% - 10px); /* Make buttons half width minus gap */
}

.why-choose-online-astrologer-section {
  padding: 1.5rem;
}
.why-choose-online-astrologer-heading {
  width: 80%;
}
.why-choose-online-astrologer-heading h2{
font-size: 23px;
}
.why-choose-online-astrologer-container {
  width: 100%;
  flex-wrap: wrap;
}
.why-choose-online-astrologer-card {
  width: 100%;
  padding: 0;
}
.third-card{
margin-top: -40px;
}
.get-online-phsychic-reading-heading {
width: 100%;
margin-top: 0px;
margin-bottom: 0px;
}
.get-online-phsychic-reading-heading h2{
font-size: 25px;
padding: 0px;
}
.get-online-phsychic-reading-detail p {
font-size: 12px; /* Decrease font size for smaller screens */
text-align: justify;
}

}

/* Adjustments for larger screens */
@media only screen and (min-width: 1024px) {
.astrologers-card-wrapper-box-container {
  justify-content: space-evenly;
}

.astrologer-card {
  width: calc(33.33% - 30px); 
  max-width: none;
  margin-bottom: 0;
}

.astrologers-details-card-container {
  padding: 1rem;
}
.nav-list-item ul li {
  width: calc(33.33% - 0.5rem); /* Three items per row with a small gap */
  max-width: none;
  margin: 0.25rem;
}
}


/* InsightStore Page css */
  
.insight-store-card-section {
  background-color: rgba(0, 0, 0, 0.6);
  margin-top: 30px;
  height: auto;
}
.insight-store-card-section-container {
  margin-inline: auto;
  max-width: 1000rem;
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: center;
  row-gap: 3rem;
  padding: 2rem 5rem;
  height: auto;
  padding: 70px;
}

.insight-store-card-box {
  height: 16.5rem;
  width: 13.5rem;
  background-color: #ffffff;
  box-shadow: 2px 3px 4.8px #00000040;
  margin: 1px;
  border-radius: 10px;
}

.insight-store-card-box img {
  border-radius: 10px 10px 0 0;
  height: 12rem;
  width: 100%;
}

.insight-store-card-box_details {
  display: flex;
  justify-content: space-evenly;
}

.insight-store-card-box_name {
  padding-block: 0.4rem;
  width: 9.5rem;
  font-size: 0.6rem;
}

.insight-store-card-box_name span {
  font-size: 12.5px;
}
.insight-store-card-box_price {
  padding-top: 0.5rem;
  font-size: 0.8rem;
  color: #fe0000;
  font-weight: 600;
}

.whatsapp-send-btn {
  padding-inline: 0.5rem;
  text-decoration: none;
  color: white;
  font-size: 1rem;
  background-color: rgba(72, 215, 94, 1);
  padding: 0.5rem;
  display: block;
  text-align: center;
  border-radius: 0 0px 10px 10px;
}

@media only screen and (max-width: 768px) {
  .insight-store-card-section-container{
    padding: -1px;
  }
  .insight-store-card-box {
      flex-basis: calc(50% - 1rem); 
      max-width: calc(60% - 3rem); 
      height: 13rem;
      border-bottom-left-radius: 0px; 
      border-bottom-right-radius: 0px;
      margin-bottom: 10px;
  }
  .insight-store-card-box img{
    height: 8rem;
  }
  .insight-store-card-box_details{
    flex-wrap: wrap;
    justify-content: center;
  }
  .insight-store-card-box_name span{
    font-size: 9px;
  }
  .insight-store-card-box_name{
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 1px;
  }
  .insight-store-card-box_price{
    margin-bottom: 5px;
  }
}

/* MentalHealth Page css */

.mental-health-section {
  height: 30rem;
  display: flex;
  justify-content: center;
}

.mental-health-section img {
  width: 100%;
  height: inherit;
}

@media (max-width: 38rem) {
  .mental-health-section img {
    object-fit: fill;
    width: 100vw;
  }
}

@media (min-width: 1500px) {
  .mental-health-section {
    height: 40rem;
  }

  .mental-health-section img {
    max-width: 85rem;
}
}

.story{
    padding:100px;
    background-color: #222252;
    line-height: 2;
}
.our-story{
   display: flex;
    flex-direction: column;
    height: 100%;
    align-items: center;
    justify-content: center;
    color: white;
}
.our-story h2{
    font-weight: 300;
}
.our-story p{
    font-size: 22px;
}
.story img{
    height: 400px !important;
    width: 100%;
}

@media(max-width: 992px){
    .story{
        padding: 10px 0;
    }
    .texting-h2{
      font-size: 24px !important;
    line-height: 34px !important;
    }
}
.texting-h2{
       color: #ffffff;
       font-family: Bona Nova;
       font-size: 37px;
       line-height: 45px;
       font-weight: 700;
}
.abt{
    background-image: url("{{static_asset('assets/img/about us banner.png')}}");
    height: 600px;
    width: 100%;
    background-size: cover;
   
    display: flex;
    align-items: center;
    justify-content: center;
}
.aboutt h2{
     font-weight: 500;
     text-align: center;
}
.about2{
    margin: 100px 0;
    background-image: url('../img/whitebg-image.png');
    height: 100%;
    width: 100%;
    padding: 40px;
    
}
.aboutt2 h2{
     font-weight: 500;
     
}
.aboutt2 p{
     line-height: 2;
     font-size: 20px;
}

.img-round-set{
    border-radius: 50%;
    height: 500px;
    width: 500px;
}

@media only screen and (max-width: 600px) {
  .img-round-set{
    border-radius: 50%;
    height: 331px;
    width: 500px;
}
}
@media only screen and (max-width: 600px) {
  .abt{
        background-position-x: center;
}
}

.aboutt2{
    height: 100%;
    display: flex;
    flex-direction: column;
    /* align-items: end; */
    justify-content: center;
}
.avout4{
    background-color: #222252;
   padding: 100px 0;
   margin: 100px 0;
}
.about-ring{
    height: 451px;
    width: 100%;
    object-fit: cover;
}
.aboutt4{
    display: flex;
    align-items: center;
    color: white;
    height: 100%;
    width: 638px;
    margin: auto;
    flex-direction: column;
}
.aboutt4 h2{
    font-family: "Bona Nova",serif;
       font-weight: 700;
}
.qodef-content-grid-1400 div[data-element_type=container].qodef-elementor-content-grid{
    margin-bottom: 70px;
}
.mymargin{
    margin-top: 29% !important;
}
@media (max-width: 992px){
    .mymargin{
    margin-top: unset  !important;
}
.qodef-content-grid-1400 div[data-element_type=container].qodef-elementor-content-grid{
    margin-bottom: unset;
}

.elementor-21 .elementor-element.elementor-element-208c7cc{
    padding-bottom: 28px !important;
}
.pdofile{
    padding: 0 30px !important;
}
}
.navbar-expand-lg{
    padding-bottom: 30px;
}

.aiz-card-box{
    height: 389px !important;
    margin-bottom: 20px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
    border-radius: 7px;
}
a{
    text-decoration: none !important;
}

.city{
    background-image: url('../img/home exquisite jewellery section.png');
   background-size:cover; 
    background-attachment: fixed;
}


.fugiat{  
  display: flex;

  align-items: center;

  padding-left:100px ;
    height: 500px;
    color: white;;

}
.fugiat h3{
   width: 900px;
    font-family: Bona Nova;
    font-weight: 600;
}

.but{
    padding: 15px 74px;
    background: transparent;
    color: white;
    border: 1px solid white;
    margin-top: 21px;
}

.logoimage1{
    margin: auto;
}



  /* Fixed position for share icons */
  .share-icons {
    position: fixed;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    z-index: 999;
}

/* Style for the share icon buttons */
.share-icons a {
    display: block;
    margin-bottom: 5px;
    font-size: 25px;
    color: #fff;
    text-align: center;
    background-color: black;
    padding: 10px;
    border-radius: 15%;
    transition: background-color 0.3s;
    text-decoration: none;
}

/* Hover effect for the buttons */
.share-icons a:hover {
    background-color: silver;
    color: white;
}
.btn.share-button{
    line-height: 0;
}
.bridal-image{

    background-image: url('../img/1500x500.png');
   background-size:cover; 
    background-attachment: fixed;
    height: 600px;
    width: 100%;
    background-position-x: center;
}


@media(max-width: 992px){
    .bridal-image{

  
    background-attachment: fixed;
    height: 600px;
    background-repeat: no-repeat;
    width: 100%;
}
.city{
  background-position-x: center;
}
}

.about-img-div{
    display: flex;
    justify-content: center;
   align-items: center;
    height: 100%;
}
.owl-next{
        right: -27px;
    position: absolute;
    top: 43%;
    font-size: 50px;
}

.owl-prev{
        left: -27px;
    position: absolute;
    top: 43%;
    font-size: 50px;
}
.owl-prev span{
     
    font-size: 50px !important;
}
.owl-next span{
    font-size: 50px !important;
}


.product-cd-design{
    width: 100%;
    height: 400px;
    /*border: 1px solid black;*/
      box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
    /*border-radius: 20px;*/
    margin-bottom: 40px;
}
.product-cd-img{
    width: 100%;
    height: 320px !important;
    object-fit: cover;
}

.product-cd-design a{
 text-decoration: none;
 color: black;
}


.pd-card-section{
    margin-top: 60px;
    color: black;
}
.vt-align{
    display: flex;
    align-items: center;
}

.btn-buynow{
    background-color: rgba(142, 116, 87, 1);
    color: white;
    padding: 7px 4px;
    border: none;
}
.btn-addtoacrt{
    background-color: white;
    border: 1px solid rgba(142, 116, 87, 1);
    color: rgba(142, 116, 87, 1);
     padding: 7px 0;
}

.detail-price-text{
    color: rgba(142, 116, 87, 1);
}
@media(max-width: 992px){
    
.mobile-text{
   padding-left: 51px !important;
}
}

.review-bg-color{
    background-color: rgba(142, 116, 87, 0.15);
    border: 1px solid rgba(142, 116, 87, 1);
}


        #instagram-feed {
            width: 100%;
            margin: auto;
        }

        .swiper-container {
            width: 100%;
            height: auto;
        }

        .swiper-slide {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .swiper-slide img {
            width: 100%;
            height: auto;
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }