.custom-bg {
  background-color: #fdfbfbff; /* Replace with your desired background color */
}
.arrow {
  width: 1.625rem;
  height: 1.625rem;
  flex-shrink: 0;
  margin-top: 1.3rem;
  margin-left: 0.5rem;
}
a.arrowbutton {
  text-decoration: none; /* Remove underline */
  background-color: transparent; /* Remove any background color */
  border: none; /* Remove any border */
  outline: none; /* Remove the outline when clicked */
  -webkit-tap-highlight-color: transparent; /* Remove tap highlight on mobile devices */
}
.logo {
  position: absolute;
  margin-top: 1.5rem;
  margin-left: -2rem;
  width: 8.125rem;
  height: 2.6875rem;
  border-radius: 0.7rem;
}
.start {
  margin-top: 3rem;
  margin-left: 1.2rem;
  font-weight: 700;
  display: inline-block;
  width: 19.5rem;
  height: 1.5rem;
  flex-shrink: 0;
  font-family: "Montserrat";
  font-size: 1rem;
  color: #139cdd;
}
.progress-bar-child,
.progress-bar-item {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: 1rem;
  margin-top: -1rem;
  background-color: gainsboro;
}
.progress-bar-item {
  width: 16.67%;
  right: 83.33%;
  background-color: #139cdd;
}
.progres-bar {
  position: absolute;
  margin-top: 20px;
  margin-left: 16px;
  width: 314px;
  height: 15px;
}
.your-child-age {
  cursor: pointer;
  position: absolute;
  margin-top: 2rem;
  margin-left: 1.2rem;
  font-weight: 700;
  color: #0c5394;
  display: inline-block;
  width: 17rem;
  height: 1.5rem;
  font-family: "Montserrat";
  font-size: 1rem;
}
.frame-child1 {
  position: absolute;
  top: 15px;
  left: 0;
  border-radius: 1rem;
  /* background-color: white; */
  border: 1px solid dimgray;
  color: #000;
  box-sizing: border-box;
  width: 113px;
  height: 35px;
}
.span {
  /* color:deepskyblue; */
  font-size: large;
}
.span1 {
  /* color:deepskyblue; */
  font-size: x-small;
}
.span2 {
  /* color:deepskyblue; */
  font-size: smaller;
}
.yrs {
  /* color:deepskyblue; */
  font-size: smaller;
}
.lt-4-yrs-container {
  position: absolute;
  top: 3px;
  left: 25px;
  display: inline-block;
  /* width: 73px; */
  height: 20px;
}
.frame-child2 {
  position: absolute;
  top: 172px;
  left: 144px;
  border-radius: 1rem;
  /* background-color: white; */
  border: 1px solid dimgray;
  color: #000;
  box-sizing: border-box;
  width: 113px;
  height: 30px;
}
.yrs2 {
  /* color:deepskyblue; */
  font-size: smaller;
}
.yrs1 {
  /* color:deepskyblue; */
  position: absolute;
  top: 3px;
  left: 25px;
  display: inline-block;
  width: 82px;
  height: 20px;
  font-size: large;
}
.frame-child3 {
  position: absolute;
  top: 172px;
  left: 0;
  border-radius: 1rem;
  /* background-color: white; */
  border: 1px solid dimgray;
  color: #000;
  box-sizing: border-box;
  width: 113px;
  height: 35px;
}
.yrs3 {
  /* color:deepskyblue; */
  position: absolute;
  top: 3px;
  left: 18px;
  display: inline-block;
  /* width: 90px; */
  height: 20px;
}
.frame-child4 {
  position: absolute;
  top: 93px;
  left: 201px;
  border-radius: 1rem;
  /* background-color: white; */
  border: 1px solid dimgray;
  color: #000;
  box-sizing: border-box;
  width: 113px;
  height: 30px;
}
.yrs5 {
  /* color:deepskyblue; */
  position: absolute;
  top: 3px;
  left: 22px;
  display: inline-block;
  width: 82px;
  height: 20px;
}
.frame-child5 {
  position: absolute;
  top: 93px;
  left: 65px;
  border-radius: 1rem;
  /* background-color: white; */
  border: 1px solid dimgray;
  color: #000;
  box-sizing: border-box;
  width: 113px;
  height: 35px;
}
.yrs7 {
  /* color:deepskyblue; */
  position: absolute;
  top: 3px;
  left: 23px;
  display: inline-block;
  /* width: 73px; */
  height: 20px;
}
.frame-child6 {
  position: absolute;
  top: 15px;
  left: 144px;
  border-radius: 1rem;
  /* background-color: white; */
  border: 1px solid dimgray;
  color: #000;
  box-sizing: border-box;
  width: 113px;
  height: 30px;
}
.yrs9 {
  /* color:deepskyblue; */
  position: absolute;
  top: 3px;
  left: 22px;
  display: inline-block;
  width: 73px;
  height: 20px;
}
.rectangle-parent1 {
  position: absolute;
  top: 99px;
  left: 23px;
  width: 314px;
  height: 232px;
  font-size: large;
  font-family: "Montserrat";
}
.continue-parent {
  cursor: pointer;
  border: 0;
  padding: 0;
  border-radius: 0.3125rem;
  position: absolute;
  width: 4rem;
  height: 4rem;
  margin-top: 28rem;
  margin-left: 17rem;
  background: none;
}
.mask-group-icon {
  position: absolute;
  top: -2.5rem;
  left: 0rem;
  width: 2.9rem;
  height: 2.9rem;
  background: none;
  object-fit: cover;
}
button.continue-parent {
  text-decoration: none; /* Remove underline */
  background-color: transparent; /* Remove any background color */
  border: none; /* Remove any border */
  outline: none; /* Remove the outline when clicked */
  -webkit-tap-highlight-color: transparent; /* Remove tap highlight on mobile devices */
}
/* Define styles for the selected outline color */
.frame.selected {
  /* border-color: #139CDD ;
    border-width: 3px; */
  border: 3px solid #139cdd;
  color: #000;
  /* background-color:deepskyblue; */
  /* color:white;
    border-color: deepskyblue;
    background:  #2FBBF7;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25) inset, 0px 4px 4px 0px rgba(0, 0, 0, 0.25); */
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .arrowbutton {
    display: none;
  }
  .logo {
    margin-top: 2rem;
    margin-left: -36rem;
    width: 12rem;
    height: auto;
  }
  .for-desktop {
    width: 25rem;
    height: 35rem;
    flex-shrink: 0;
    border-radius: 0.625rem;
    border: 3px solid #2fbbf7;
    background: #fff;
    margin-left: 20rem;
    margin-top: 12rem;
    align-items: center;
    margin-bottom: 10rem;
  }
  .rectangle-parent1 {
    margin-left: 2rem;
    margin-top: -1rem;
  }
  .mask-group-icon {
    margin-top: 0rem;
    margin-left: 3rem;
  }
  .start {
    margin-left: 3.2rem;
  }
  .your-child-age {
    margin-left: 3.2rem;
  }
  .progres-bar {
    margin-left: 3rem;
  }
}

@media (min-width: 1280px) {
  .arrowbutton {
    display: none;
  }
  .logo {
    margin-top: 2rem;
    margin-left: -36rem;
    width: 12rem;
    height: auto;
  }
  .for-desktop {
    width: 25rem;
    height: 35rem;
    flex-shrink: 0;
    border-radius: 0.625rem;
    border: 3px solid #2fbbf7;
    background: #fff;
    margin-left: 30rem;
    margin-top: 16rem;
    align-items: center;
    margin-bottom: 10rem;
  }
  .rectangle-parent1 {
    margin-left: 2rem;
    margin-top: -1rem;
  }
  .mask-group-icon {
    margin-top: 0rem;
    margin-left: 3rem;
  }
  .start {
    margin-left: 3.2rem;
  }
  .your-child-age {
    margin-left: 3.2rem;
  }
  .progres-bar {
    margin-left: 3rem;
  }
}

@media (min-width: 1920px) {
  .for-desktop {
    margin-left: 51rem;
    margin-top: 16rem;
  }
}