/* ===================================================   Visual representation of Problem CSS  Begins ===================================================  */
.pf-chanConf-visRep {
  margin-bottom: 120px;
}
.pf-chanConf-visRep-title-cont {
  max-width: 968px;
  width: 90%;
  margin: 0 auto;
}
.pf-chanConf-visRep-note {
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  color: #000000;
}
.pf-before-after-wrap {
  margin-top: 120px;
}
.pf-before-after-cont {
  max-width: 1150px;
  width: 90%;
  margin: 0 auto;
  display: flex;
}
.pf-before-wrap {
  width: 50%;
}
.pf-after-wrap {
  width: 50%;
}
.pf-befAft-btn span {
  padding: 12px;
  color: #913e2c;
  font-size: 20px;
  line-height: 30px;
  font-weight: 500;
  background-color: #ffded7;
  border-radius: 6px;
  margin-left: 62px;
}
.pf-after-wrap .pf-befAft-btn span {
  background-color: #b0ffb8;
  color: #00820d;
  margin-left: 163px;
}
.pf-before-content,
.pf-after-content {
  margin-top: 80px;
}
.pf-before-content {
  margin-right: 53px;
}
.pf-after-content {
  /* border-left: 1px solid #000000; */
  padding-left: 80px;
}
.pf-befAft-cont1 {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
}
.pf-before-content span,
.pf-after-content span {
  font-size: 11px;
  line-height: 21px;
  font-weight: 400;
  color: #000000;
}
.pf-befAft-cont2 {
  display: flex;
  align-items: center;
  flex-direction: column;
  float: right;
  gap: 18px;
}
.pf-before-content .pf-befAft-cont2 span {
  max-width: 436px;
}
.pf-after-content .pf-befAft-cont2 span {
  max-width: 356px;
  text-align: center;
}
.pf-befAft-cont3 {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  float: left;
  margin-top: 70px;
  gap: 18px;
}
.pf-before-content .pf-befAft-cont3 span {
  max-width: 210px;
  display: block;
}
.pf-after-content .pf-befAft-cont3 span {
  max-width: 267px;
  display: block;
  text-align: center;
}
.pf-visRep-sep {
  border: 1px solid #000000;
  width: 1px;
  height: 30rem;
  margin: 14% 0 0%;
}
@media only screen and (min-width: 1520px) {
  .pf-before-content span,
  .pf-after-content span {
    font-size: 13px;
  }
}
@media only screen and (max-width: 998px) {
  .pf-chanConf-visRep {
    margin-bottom: 62px;
  }
  .pf-befAft-btn {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .pf-befAft-btn span {
    margin-left: 0;
  }
  .pf-after-wrap .pf-befAft-btn span {
    margin-left: 0;
  }
  .pf-before-content,
  .pf-after-content {
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  .pf-befAft-cont2 {
    margin-top: 70px;
  }
}
@media only screen and (max-width: 580px) {
  .pf-before-after-wrap {
    margin-top: 60px;
  }
  .pf-before-after-cont {
    flex-direction: column;
    align-items: center;
  }
  .pf-before-wrap,
  .pf-after-wrap {
    width: 100%;
  }
  .pf-before-content {
    margin-right: 0;
  }
  .pf-visRep-sep {
    display: none;
  }
  .pf-befAft-cont2,
  .pf-befAft-cont3 {
    margin-top: 40px;
  }
  .pf-after-wrap {
    margin-top: 40px;
  }
  .pf-after-content {
    padding: 0;
  }
  .pf-before-content,
  .pf-after-content {
    margin-top: 50px;
  }
}
/* ===================================================   Visual representation of Problem CSS  Ends ===================================================  */
/* =================================================== Approval post method 1 css Begins ===================================================  */
.pf-chanconf-linkedin .pf-approval-post-wrap {
 flex-direction: row-reverse;
}
@media only screen and (max-width: 768px) {
  .pf-chanconf-linkedin .pf-approval-post-wrap {
    flex-direction: column-reverse;
   }
}
/* =================================================== Approval post method 1 css Ends ===================================================  */
/* =================================================== Approval post method 2 css Begins ===================================================  */
.pf-chanConf-m2 .pf-approvalPost-m2-img-cont {
  padding: 40px 128px 40px 106px;
  align-items: center;
  justify-content: center;
}
.pf-chanconf-imganddesc {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.pf-chanconf-imganddesc span{
  color: #00000080;
  font-weight: 500;
  line-height: 18px;
  font-size: 12px;
}
.pf-chanConf-brand-set {
  width: 100%;
  height: auto;
}
@media only screen and (max-width: 998px) {
  .pf-chanConf-m2 .pf-approvalPost-m2-img-cont {
    padding: 40px;
  }
}
/* =================================================== Approval post method 2 css Begins ===================================================  */