.matched-face-component-container01 {
    gap: var(--dl-space-space-unit);
    flex: 0 0 auto;
    width: auto;
    display: flex;
    position: relative;
    box-shadow: 5px 5px 10px 0px #d4d4d4;
    align-items: flex-start;
  }
  .matched-face-component-image-container {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
  }
  .matched-face-component-image {
    width: 256px;
    height: 256px;
    object-fit: cover;
  }
  .matched-face-component-info-container {
    gap: var(--dl-space-space-unit);
    flex: 0 0 auto;
    width: 200px;
    height: auto;
    display: flex;
    align-self: center;
    align-items: flex-start;
    flex-direction: column;
  }
  .matched-face-component-name-div {
    gap: var(--dl-space-space-halfunit);
    flex: 0 0 auto;
    width: 100%;
    height: auto;
    display: flex;
    align-items: flex-start;
  }
  .matched-face-component-text {
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
  }
  .matched-face-component-text1 {
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
  }
  .matched-face-component-confidence-div {
    gap: var(--dl-space-space-halfunit);
    flex: 0 0 auto;
    width: 100%;
    height: auto;
    display: flex;
    align-items: flex-start;
  }
  .matched-face-component-text2 {
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
  }
  .matched-face-component-text3 {
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
  }
  @media(max-width: 1200px) {
    .matched-face-component-container01 {
      flex-direction: column;
    }
  }
  @media(max-width: 767px) {
    .matched-face-component-container01 {
      flex-direction: column;
    }
  }