@import url('https://fonts.googleapis.com/css2?family=Zen+Dots&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
@font-face {
  font-family: 'boston';
  src: url("./src/Boston-Light.ttf") format('woff2');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'ParalucentExtralight';
  src: url('./font/ParalucentExtraLight.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}


*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Lobster", sans-serif;
    font-weight:500 ;
}
html{
    font-size: 10px;
}

.parent{
    width: 100%;
    height:100vh;
    background: url("https://cdn.shopify.com/s/files/1/0912/8788/0064/files/MainBack.png?v=1744143367") center no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

.loader{
    position: absolute;
    width: 100%;
    height: 100vh;
    background-color: rgb(0, 0, 0);
    z-index: 9999999999;
}
.container {
    display: flex;
    justify-content: center;
    padding: 1em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .container span {
    color: #ffF;
    padding: 0 0.4em;
    font-size: 1.5em;
    animation: anim 2s infinite ease-in-out;
    filter: blur(6px);
  }
  
  @keyframes anim {
    0% {filter: blur(6px);}
    50% {filter: blur(0px);}
    100% {filter: blur(6px);}
  }
  
  .container span:nth-child(1) {
    animation-delay: -0.7s;
  }
  .container span:nth-child(2) {
    animation-delay: -0.6s;
  }
  .container span:nth-child(3) {
    animation-delay: -0.5s;
  }
  .container span:nth-child(4) {
    animation-delay: -0.4s;
  }
  .container span:nth-child(5) {
    animation-delay: -0.3s;
  }
  .container span:nth-child(6) {
    animation-delay: -0.2s;
  }
  .container span:nth-child(7) {
    animation-delay: -0.1s;
  }
  
  #link {
    bottom: 20px;
    color: #fff;
    opacity: 0.6;
    display: flex;
    align-items: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  #link p {font-size: 20px; margin: 0; margin-left: 5px;}
  #link:hover {opacity: 1;}







#right-stone{
    position: absolute;
    right: 0;
    width: 12rem;
    filter: brightness(0.6);
    z-index: 1;
    transition: 3s cubic-bezier(0.85, 0, 0.15, 1);
}

#left-stone{
    position: absolute;
    left: 0;
    top: 50px;
    width: 14rem;
    filter: brightness(0.6);
    z-index: 1;
    transition: 3s cubic-bezier(0.85, 0, 0.15, 1);
}

#bg-txt{
    color: rgb(255, 255, 255);
    position: absolute;
    top: 23%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 8vw;
    text-wrap: nowrap;
    letter-spacing: 2px;
    font-weight: 800;
    opacity: 0.7;
}

#down-right-stone{
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 2;
    width: 26vw;
    transition: 3s cubic-bezier(0.85, 0, 0.15, 1);
}

#left-right-stone{
    position: absolute;
    bottom: -25px;
    left: 0;
    transform: rotateZ(90deg);
    z-index: 2;
    width: 22vw;
    transition: 3s cubic-bezier(0.85, 0, 0.15, 1);
}

#center-stone{
    position: absolute;
    left: 50%;
    bottom: -0px;
    width: 80rem;
    z-index: 9999;
    transform: rotateZ(-8DEG) translateX(-50%);
}
#product{
    position: absolute;
    left: 48%;
    bottom: -50px;
    width: 55rem;
    z-index: 999;
    animation: NONE;
    transform: translateX(-50%);
/*     animation: intro 8s ease-in-out forwards; */
}

@keyframes intro {
  0% {
      transform: translateY(8px) translateX(-50%) rotateZ(0deg);
  }
  
  10% {
      transform: translateY(8px) translateX(-50%) rotateZ(-9deg);
      opacity: 1;
      animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);
  }
  50% {
      transform: translateY(-30vh) translateX(-50.5%) rotateZ(1deg);
      animation-timing-function: cubic-bezier(0.34, 1.2, 0.64, 1);
  }
  100% {
      transform: translateY(-26vh) translateX(-50%) rotateZ(0deg);
  }
}



.enter{
  position: absolute;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.717);
  backdrop-filter: blur(10px);
  z-index: 3;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.5s ease-in-out;
  z-index: 99999999;
 
}

.enterbtn{
  width: 27rem;
  height: 80px;
  background-color: rgba(255, 0, 0, 0);
  border-radius: 20px 0px;
  border: 1px solid white;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.5s ease-in-out;
  color: white;
}

.enterbtn span{

  font-size: 3rem
}

.enterbtn:hover{
  background-color: white;
  color: black;
  cursor: pointer;
  transform: scale(0.9);
}

.bg-blur{
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.51);
 position: absolute;
 z-index: 99;
 backdrop-filter: blur(8px);
 display: none;
 opacity: 0;
 transition: 0.5s ease-in-out;
}

#s11{
  position: absolute;
  width: 48rem;
  z-index: 999;
  filter: brightness(0.6) contrast(1.3) blur(2px);
  left: -250px;
  top:1000px; 
  rotate: 90deg;
  animation: none;
}
#s21{
  position: absolute;
  width: 40rem;
  z-index: 999;
  filter: brightness(0.6) contrast(1.3) blur(1.2px);
  right: -200px;
  bottom:-500px;
  rotate: 70deg;
  animation:none;
}
#s23{
  position: absolute;
  width: 40rem;
  z-index: 999;
  filter: brightness(0.6) contrast(1.3) blur(1.2px);
  right: 500px;
  bottom:-500px;
  rotate: 180deg;
  animation:none;
}

#s24{
  position: absolute;
  width: 14rem;
  z-index: 999;
  filter: brightness(0.6) contrast(1.3);
  left: 300px;
  bottom:-200px;
  rotate: 180deg;
  animation: none;
}

#s25{
  position: absolute;
  width: 14rem;
  z-index: 999;
  filter: brightness(0.6) contrast(1.3) blur(2px);
  left: 800px;
  bottom:-280px;
  rotate: 90deg;
  animation:none;
}

#s26{
  position: absolute;
  width: 14rem;
  z-index: 999;
  filter: brightness(0.6) contrast(1.3) blur(1px);
  left: 200px;
  bottom:-500px;
  rotate: 90deg;
  animation: none;
}

#s27{
  position: absolute;
  width: 14rem;
  z-index: 99;
  filter: brightness(0.6) contrast(1.3) ;
  right: 200px;
  bottom:-500px;
  rotate: 200deg;
  animation: none;
}

.stones{

  transition: 5s ease-in-out;
}

@keyframes rotate{
  50%{
    transform: rotateZ(360deg);
  }
}

@keyframes rmove{
  50%{
    transform: translateX(120rem) translateY(-120rem) rotateZ(-3520deg);
  }
}
@keyframes rmove2{
  50%{
    transform: translateY(120rem) translateX(-120rem) rotateZ(-5220deg);
  }
}


.navbar{
  position: fixed;
  top: 0;
  width: 0%;
  height:60px;
  background-color: rgba(0, 0, 0, 0);
  backdrop-filter: blur(1px);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  transition: 0.5s ease-in;
 
}
/* .options{
  color: white;
  width: 40%;
  display: flex;
  justify-content: space-evenly;
  font-weight: 400;
  opacity: 0;
  font-size: 1.8rem;
  transition: 1s ease-in;
  font-family:'Boston', serif;
}
.options > a{
  color: white;
}
.options > span{
  color: white;
&:hover{
  cursor: pointer;
}
} */

.logo{
  position: absolute;
  left: 10px;
  color: rgb(255, 255, 255);
  font-size: 3rem;
  font-family:'Boston', serif;

  font-weight: 900;
  top: 1%;
  z-index: 9999;
  left: 2%;
}


.next{
  position: absolute;
  right: 10px;
  z-index:9999;
  width:7rem;
  top: 50%;
  transform: translateY(-50%);
}


.productDesc{
  position: absolute;
  width: 45rem;
  height: auto;
   background-color: rgba(0, 0, 0, 35%);
  z-index: 9999;
  right: 70px;
  bottom: 10px;
  backdrop-filter: blur(6px);
  border-radius:25px;
  border: 0.01px solid rgba(255, 255, 255, 0.153);
  display: flex;
  justify-content: space-evenly;
  padding: 10px;
  align-items:start;
  flex-direction: column;
  overflow: hidden;
  padding-top: 10px;
  overflow: hidden;
  opacity: 0;
  transition: 1s ease-in-out;
}

.productDesc:hover .description-div{
height:14rem;
padding-block: 10px;
}




.productDesc h1{
  color: white;
  font-size: 4rem;
  font-weight: 400;
  font-style: normal;
  text-wrap: nowrap;
  
}

.productDesc p{
  color: rgba(255, 255, 255, 0.635);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 21px;
  font-size: 1.7rem;
}

.buy{
  width: 100%;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color:#76673f;
  
  border-radius: 50px;
  transition: 0.5s ease-in-out;
}

.buy span{
  color: white;
  font-size: 2rem;
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 300;
}

/* .review{
  position: absolute;
  width: 27rem;
  height: 100px;
  background-color: rgba(255, 0, 0, 0);
  z-index:9999;
  bottom: 50px;
  left: 60px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: center;
  align-items: center;
  color: white;
  opacity: 0;
} */

/* .contactUs{
  width: 100%;
  height: 40px;
  background-color: rgba(255, 255, 255, 0);
  border-radius: 40px;
 border: 1px solid white;
 display: flex;
 justify-content: center;
 align-items: center;
 transition: 0.5s ease-in-out;


}
.contactUs span{
  font-size: 2rem;
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 300;
}
.contactUs:hover{
  background-color: rgba(255, 255, 255, 0.451);
  color: black;
  border: none;
  cursor: pointer;
} */

.buy:hover{
  background-color: #b09551;
  cursor: pointer;
}



.contact-menu{
  width: 80px;
  height: 370px;
  top: 50%;
  left: -80px;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.303);
  position: absolute;
  border-radius: 0px 30px 30px 0px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 4px;
  gap: 5px;
  overflow: hidden;
  transition: 0.5s ease-in-out;
}
.contact-menu img{
  width: 6rem;
  transition: 0.3s ease-in-out;
}
.contact-menu img:hover{
  transform: scale(1.1);
  cursor: pointer;
}

.size-price{
  width: 100%;
height: 19rem;
/* background-color: red; */
display: flex;
}
.price,.size{
  width: auto;
  height: 100%;
/*   background-color: pink; */
}
.price{
  width: 50%;
}
.size{
  /* background-color: rgba(210, 17, 17, 0.406); */
 
  border-radius: 10px;
 padding-inline: 10px;
  padding-block: 10px;
  display: flex;
  flex-direction: column;
height: 100%;
  justify-content: space-between;
  width: 45%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.side-bg{
  width: 100%;
  height: 90%;
  background: url("https://cdn.shopify.com/s/files/1/0912/8788/0064/files/pImg.jpg?v=1744143344") center no-repeat;
  background-size: cover;
  border-radius: 10px;
}
.price{
  
  display: flex;
  flex-direction: column;
  padding-bottom: 20px;
  justify-content: space-between;
}
.price > span{
  font-size: 6rem;
  font-weight: bolder;
  font-family: 'boston';
  font-weight: bolder;
  color: white;
}
.currency{
  width: 9.5rem;
  border-radius: 21px;
  height: auto;
  background-color: rgba(0, 0, 0, 0.218);
  padding-block: 3px;
  padding-inline: 2px;
  display: flex;
  gap: 10PX;
  padding-left: 2px;
  color: white;
}
.dollar,.euro,.size1{
  width: 4rem;
  height: 4rem;
  border-radius: 100%;
  background-color: rgba(133, 133, 133, 0.208);
  display: flex;
  justify-content: center;
  align-items: center;
  
  font-size: 2.5rem;
  &:hover{
    cursor: pointer;
  }
}
/* .size1{
  width: 5rem;
  height: 5rem;
} */
.dollar > span{
  font-family:Arial, Helvetica, sans-serif;
 
}
.euro > span{
  font-family:Arial, Helvetica, sans-serif;
}
#selectedPrice,#selectSize{
  background-color: white;
  color: black;
}

.size > p{
  font-size: 1.5rem;
  color: white;
  font-weight: lighter;
}
.allSizes{
  width: auto;
  height: auto;
  /* background-color: red; */
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: white;
}
.size1 > span{
  font-size: 1.2rem;
  

  font-family: Arial, Helvetica, sans-serif;

}
.c-s{
  width: 100%;
  height: auto;
  display: flex;
  gap: 10px;
}






.description-div{
 
 /*  background-color: pink; */
  overflow: hidden;
  
  height: 0;
  transition:  0.6s cubic-bezier(0.87, 0, 0.13, 1);
}



















/* floating navbar */
.floatingNav{
  position: fixed;
  width: 4vw;
  height: 15vw;
  top: 50%;
  left: 2%;
  transform: translate(0,-50%);
  background-color: rgba(0, 0, 0, 0.321);
  z-index: 999999;
  border-radius: 20px;
  backdrop-filter: blur(10px);
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
}
.floatingNav > img{
  width: 3vw;
  
}

.floatHome{
  width: 95%;
  height: auto;
  padding-block: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  /* background-color: red; */
  font-size: 1.05vw;
  color: white;
  /* border: 1px solid rgb(255, 255, 255); */
}
.floatHome > img{
  width: 2.8vw;
  transition: 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: 100%;
 opacity: 0.5;
  overflow: hidden;
  &:hover{
      scale:1.1;
      cursor: pointer;
   }
}
#presentPage{
background: var(
  --gold,
  radial-gradient(43.45% 568.27% at 57.19% 50%, #ffd18d 0%, #997e55 100%)
);
  mix-blend-mode: difference;
  opacity: 1;
}







/* rating */
.star{
  width: 20px;
  height: 30px;
}





@media (max-width:1030px) {

  html{
    font-size: 8px;
  }
  .productDesc h1 {

    font-size: 3rem;
  }


.productDesc p {
   
    line-height: 16px;
}


.buy {
    width: 100%;
    height: 42px;
}

.productDesc {

  height:auto;
}

.star-ratings{
  font-size: 33px;
}
/* #product {

  bottom: 87px;
} */
#center-stone {
  position: absolute;
  left: 50%;
  bottom: 28px;
  width: 80rem;
  z-index: 9999;
  transform: rotateZ(-15DEG) translateX(-50%);
}

/* .size{
  width: 0;
  display: none;
} */
.price {
  width: 59%;
}

.floatingNav {
  position: fixed;
  width: 7rem;
  height: 27rem;
}

.floatHome > img {
  width: 5rem;
}
.floatingNav > img {
  width: 6rem;
}
}





@media (max-width:800px) {
  .review {
  
    width: 27rem;
    height: 100px;
  
    top: 85px;
    left: 30px;
  }


.productDesc {
   
    width: 39rem;
    height: auto;
  
    left: 050%;
    transform: translateX(-50%);
}
}


@media (max-width:700px) {
  .floatingNav{
    height: 20rem;
    top: 30px;
    left: 50%;
    transform: translate(-50%, -50%) rotateZ(-90deg);
  }
  .floatHome > img {
    width: 4rem;
    transform: rotateZ(90deg);
}
.floatingNav > img{
  display: none;
}
}




@media (max-width:550px){
  
#left-stone {
  
  left: -61px;
}


#right-stone {
  
  right: -47px;
}

}




@media (max-width:500px) {
    #bg-txt {
    color: rgb(255, 255, 255);
    position: absolute;
    top: 17%;
    left: 50%;
   
    font-size: 11vw;
    
    letter-spacing: 2px;
    font-weight: 100;

    z-index: 99999;
}
  #product{
    width: 51rem;
 
  }
  .contact-menu{
    width: 60px;
    gap: 15px;
    height: 320px;
  }
.review {

  width: 23rem;
  height: 100px;


  top: 85px;
  left: 3px;
 
  font-size: 0.8rem;
}


.options{
  display: none;
}

.contactUs {
  width: 100%;
  height: 32px;
}
.productDesc{
 width: 90%;
}
.lanChanger {
  left: 5%;
  top: 14.5%;
}
/* #center-stone{
  
} */

@keyframes intro{
 
  10%{
    transform:translateY(8px) translateX(-50%) rotateZ(-9DEG); 
    animation-timing-function: ease-in-out;
  }
  50%{
    transform: translateY(-35vh) translateX(-50%)  rotateZ(1DEG); 
    animation-timing-function: ease-in-out;
  }
  60%{
    transform: translateY(-30vh) translateX(-50%) rotateZ(1DEG);
    animation-timing-function: ease-in-out;
  }
  100%{
    transform:translateY(-30vh) translateX(-50%)  rotateZ(1DEG);
    animation-timing-function: ease-out; 
  }
}
}

/* .try-parent{
  position: relative;
  width: 100%;
  height: 100vh;
  background: url("https://cdn.shopify.com/s/files/1/0912/8788/0064/files/try.png?v=1744143339") center no-repeat;
  background-size: cover;
  
}
 */


























.Main-Product-Page-Parent{
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0);
  backdrop-filter: blur(0px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  z-index: 999999;
  opacity: 1;
  transition: 1s ease-in-out;
  display:none;
}

.mainProduct_focus{
  position: absolute;
  width: 75%;
  left: -25%;
  top: 50%;
  transform: translateY(-50%) translateX(-818px);
  z-index: 9999;
  pointer-events: none;
  transition: 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.Product-1st-child{
  position: relative;
  width: 70%;
  height: 95%;
  min-height: 67rem;
  max-height: 80rem;
  background-color: rgb(0, 0, 0);
  border-radius: 60px;
  margin-left: 10vw;
  border: 1px solid rgba(154, 118, 25, 0.678);
  overflow: hidden;
  backdrop-filter: blur(10px);
  transition: 2s ease-in-out;
  opacity: 0;
}
.product-main-content{
  position: absolute;
  width: 70%;
  height: 100%;
 padding-top: 2%;
  right: 0;
  top: 50%;
 transform: translateY(-50%);
 color: white;
/*  background-color: red; */
 display: flex;
 flex-direction: column;
 justify-content: space-evenly;
}

.branding-name{
  width: auto;
  height:auto;
  padding-block: 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.branding-name h1{
  font-size: max(3vw,30px);
  /* font-family: "Zen Dots", sans-serif; */
  font-weight: 400;
}
.branding-name span{
  font-size: 1.2rem;
  color: rgba(255, 255, 255, 0.466);
  font-weight: 200;
  font-family:  "Lobster", sans-serif;
letter-spacing: 2px;
  
}

.product-main-pricing{
  width: 100%;
  height: auto;
  /* background-color: black; */
  display: flex;
  align-items: end;
  gap: 15px;
}
.product-main-pricing > p:first-of-type{
  font-size: 10rem;
  font-family: 'ParalucentExtralight';
}
.product-main-pricing > p span{
  font-family: 'ParalucentExtralight';
  font-size: 6rem;
  line-height: 0;
}
del {
  text-decoration: line-through;
  text-decoration-thickness: 2px; /* Adjust thickness */
}
.product-main-pricing > p:not(:first-of-type) del{
  font-family: 'ParalucentExtralight';
  font-size:4rem;
  font-weight: 100;
  color: rgba(255, 255, 255, 0.17);
  line-height: 8rem;
}

.product-select-size{
  width: 100%;
  height: auto;
  padding-block: 10px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.product-select-size > span:first-of-type{
  font-family: 'ParalucentExtralight';
  font-size: 2rem;
  font-weight: 100;
  letter-spacing: 2px;
}
.product-select-option{
  width: 100%;
  height: auto;
  padding-block: 5px;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.product-select-circle{
  width:clamp(5rem,3.2vw,3.5vw) ;
  height:clamp(5rem,3.2vw,3.5vw);
  border-radius: 100%;
  border: 1px solid rgba(255, 255, 255, 0.44);
  display: flex;
  justify-content: center;
  align-items: center;
}
.product-select-circle:hover{
  cursor: pointer;
}

.product-select-circle span{
  font-size: max(0.7vw,10px);
  color: rgba(255, 255, 255, 0.44);
  font-family: 'ParalucentExtralight';
  letter-spacing: 1.5px;
}

#product-select-circle-active{
  background-color: rgba(232, 183, 89, 0.17);
  border: 1px solid #CAB886;
}
#product-select-circle-active > span{
  color: white;
}

.product-benifit{
  width: 100%;
  height: auto;
  padding-block: 10px;
 /*  background-color: rgba(255, 255, 255, 0.104); */
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.product-benifit > span:first-of-type{
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(0.8rem,2rem,3vw);
  font-family: 'ParalucentExtralight';
  letter-spacing: 2px;
}
.product-benifit ul {
  display: flex;
  flex-direction: column;
  gap:5px;
}
.product-benifit ul li{
  font-family: 'ParalucentExtralight';
  letter-spacing: 2px;
  font-size: 1.3rem;
  color: rgba(255, 255, 255, 0.896);
}

.Add-to-cart{
  width: auto;
  height: auto;
  padding-block: 10px;
  margin-top: 29px;
  margin-left: 20px;
 /*  background-color: red; */
}
.Add-to-cart button
{
  width: max(12vw,190px);
  height: max(3vw,40px);
  border-radius: 20px;
  outline: none;
  border: 1px solid #AE975D;
  background-color: #af985d30;
  color: #AE975D;
  font-family: 'ParalucentExtralight';
  letter-spacing: 2px;
  font-size: max(0.9vw,10px);
}
.paymentOption{
  position: absolute;
  width: max(17vw,20rem);
  right: 50px;
  bottom:12px;
  opacity: 1;
}
.mobile-responsive-card{
  position: relative;
  width: 70%;
  min-height: 50rem;
  background-color: rgba(0, 0, 0, 0);
  overflow: hidden;
  display: none;
  opacity: 0;
}

.mobile-responsive-card > img{
position: absolute;
width: 100%;
height: auto;
top: 70%;
left: 50%;
transform: translate(-50%,-50%);
pointer-events: none;
}
.Main-Product-Page-Parent > a{
position: absolute;
left: 0;
bottom: 0;
color: #ae975d90;
font-size: max(13px,1vw);
text-decoration: none;
}

.Close-Product-Section{
  position: absolute;
  right: 2%;
  top: 2%;
  color: rgba(255, 0, 0, 0.433);
  z-index: 999;
  outline: none;
  border: none;
  background-color: transparent;
  font-size: 2.6rem;
  font-family: 'ParalucentExtralight';
  transition: 0.3s ease-in-out;
}
.Close-Product-Section:hover{
  cursor: pointer;
  color: red;
}

.allCertificateOption{
  display: flex;
  flex-direction: column;
  height: auto;
  gap: 10px;
}

#AllCertificateMap{
  font-size: 1.5rem;
  font-family: 'ParalucentExtralight';
  letter-spacing: 1.2px;
}


.downloadCertificate{
  width: 40rem;
  height: 5rem;
  /* background-color: red; */
z-index: 9999;
right: 5%;
bottom: 0;
display: flex;
/* justify-content: center; */
align-items: center;
gap: 10px;
}

.certi{
width: auto;
height: 6rem;
  z-index: 9999999;
}

.downloadCertificate a{
  width: auto;
height: 6rem;
  z-index: 9999999;
}

@media (max-width:712px) {
  .product-main-pricing > p:first-of-type{
    font-size: 8rem;
  }
  .product-main-content {
    width: 86%;
  }
  .mainProduct_focus{
    display: none;
  }
  .mobile-responsive-card{
    display: block;
  }
  .Main-Product-Page-Parent > a{
    left: 50%;
    transform: translateX(-50%);
    bottom: 12px;
  }
  .Product-1st-child {
    margin-left: 0;
    min-height:70rem;
    border-radius: 20px;
    width: 54rem;
  }
  .Main-Product-Page-Parent{
    overflow-y: auto;
    justify-content:none;

    padding-bottom: 20px;

  }
  .paymentOption{
    right: 14px;
  }
}




@media (max-width:442px) {

 
  .product-main-content {
    width: 94%;
    height: 90%;
  
}
.Product-1st-child {
  width: 45rem;
  height: 40rem;
  min-height: 72rem;
}
.mobile-responsive-card > img {
  position: absolute;
  width: 42rem;
}
.product-main-content{
  top: 50%;
}
.paymentOption {
  right: 14px;
}
.mobile-responsive-card {
  height: 2rem;
  min-height: 30rem;
  /* background-color: red; */
  z-index: 999;

}
.mobile-responsive-card > img{
  top: 45%;
}
}

@media (max-width:442px) and (max-height:668px) {
  .mobile-responsive-card > img {
    top: 65%;
}
.Main-Product-Page-Parent{
  padding-top: 10px;
}
}

.shopify-btn-fetch{
  height: auto;
  width: 50%;
  background-color: red;
  display: flex;
  justify-content: center;
  align-items: center;
}
.shopify-Main-Btn-Position{
  position: relative;
  background-color: rgba(255, 0, 0, 0);
  height: 6REM;
  margin-bottom: 40px;
  width: 17.5rem;
  border-radius:10px;
  margin-left: -0.  7vw;
  /* border: 2px solid rgba(0, 0, 0, 0.113); */
}

.shopify-org-Btn{
position: absolute;
  width: 200px;
 /*  background-color: rebeccapurple; */
  height: 5vw;
  border-radius: 8px;
  /* background-color: rgba(255, 0, 0, 0); */
 /*  text-align: left; */
 /*  border: 2px solid rgba(0, 0, 0, 0.113); */

margin-top: -40px;
left: -30px;

  
}