.sales-partner-steps-master-container {
  margin: 100px 0; 
}

.two-col-steps-wrapper{
  display:flex;
  align-items: start;
  justify-content: start;
  background-color: #FFFFFF; 
  border-radius: 50px;
  z-index: 99;
}
.snd-col-steps {
  background-color: #FFF7D6;
  padding-left: 50px;
  padding-right: 40px;
  padding-top: 45px;
  padding-bottom: 25px;
  border-top-right-radius: 50px;
  border-bottom-right-radius: 50px;
  height: 537px;
}

@media only screen and (min-width: 701px) and (max-width: 1199px) {
  .snd-col-steps {
    max-width:500px;
  }
}

.snd-col-steps p {
  color: #021153;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal; 
  margin: 0 !important;
  padding: 0 !important;
}
.snd-col-steps h1 {
  color: #021153;
  font-size: 50px;
  font-style: normal;
  font-weight: 700;
  line-height: normal; 
  margin: 0 !important;
  padding: 0 !important;
}



.snd-col-steps h2 {
  color: #021153;
  font-size: 35px !important;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin: 0 !important;
  padding: 0 !important;
}

.snd-col-steps h3 {
  color: #021153;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: normal; 
}

.first-col-girl-image{
  width:50%;
  background-color: #FCD116;
  border-top-left-radius: 50px;
  border-bottom-left-radius: 50px;
  height: 537px;
}

.first-col-girl-image img {
  border-radius: 50px;
  max-width: 528px;
  max-height: 540px;
  height: 536px;
}
.steps-wrapper{
  margin-top: 20px; 
}
.steps-wrapper .steps-tabs {
  display: flex;
  flex-direction: column;
  gap: 15px;
  
}
.steps-wrapper .steps-tabs .circle-text-wrapper {
  display: flex;
  justify-content: start;
  align-items: start;
  gap: 10px;
}
.steps-wrapper .steps-tabs .circle {
  border: 1px solid #FCD116; 
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 19px;
}

.steps-tabs .circle {
  color: rgba(2, 17, 83, 0.80);
  text-align: center;
  font-size: 22px !important;
  font-style: normal;
  font-weight: 700;
  line-height: normal; 
  cursor: pointer;
}

.circle-text-wrapper .content {
  padding-top: 12px; 
}

.circle-text-wrapper .content span {
  color: #021153;
  text-align: center;
  font-size: 22px;
  font-style: normal;
  font-weight: 600;
  line-height: normal; 
}

.circle.active {
  background-color: #021153;
  color: #FFFFFF !important;
}


.contents{
  display: none; 
}
.contents p {
  color: #3E3E3E;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 30px; /* 187.5% */
}

.contents ul {
    padding: 0;
    padding-left: 22px;
    padding-top: 10px;
}
.contents ol {
  padding: 16px !important;
  margin: 0 !important;
}
.contents.active {
  display: block;
  
}

.qr-code {
  display: flex;
  justify-content: center;
  gap: 40px;
}

.divider{
  width: 2px;
  height: 120px;
  background-color: #FCD116;
}
.code-one{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
}
@media only screen and (max-width: 1200px) {
  .snd-col-steps {
    max-width:none;
    height: 500px;
  }
  .first-col-girl-image img {
    border-radius: 50px;
    max-width: 465px;
    max-height: 607px;
    height: 500px;
}


.first-col-girl-image {
    width: 50%;
    background-color: #FCD116;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    height: 500px;
}
  .snd-col-steps {
    border-top-right-radius: 0;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;0;
    padding: 20px;
  }
  
  .snd-col-steps p {
  font-size: 16px;
}
.snd-col-steps h1 {
  font-size: 36px;
}

.snd-col-steps h2 {
  font-size: 19px !important;
}
  
  }

@media only screen and (max-width: 900px) {
  
    .first-col-girl-image {
    width: 315px;
    height: 550px;
    border-top-left-radius: 20px;
    border-top-right-radius: 0;
    border-bottom-left-radius: 20px;
  }
  .first-col-girl-image img {
    width: 315px;
    height: 550px;
  }
  .snd-col-steps {
    border-bottom-left-radius: 0;
        border-top-right-radius: 20px;
   height: 550px; 
  }
}

@media only screen and (max-width: 700px) {
  .two-col-steps-wrapper {
   flex-direction: column; 
  }
  
  
  .first-col-girl-image {
    width: 100%;
    height: 100%;
    border-bottom-left-radius: 0;
    border-top-right-radius: 20px;
  }
  .first-col-girl-image img {
   width: 100%;
   height: 100%;
  }
  
   .snd-col-steps {
    border-bottom-left-radius: 0;
   border-top-right-radius: 0;
   height: 550px; 
  }
   
  .qr-code {
    flex-direction: column;
  }
  .divider {
    width: 250px;
    height: 2px; 
  } 
}

