.ys-csr__main {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--60);
}

.ys-csr__activities {
  .ys-title {
    font-size: var(--wp--preset--font-size--x-large);
   
  }
}

.ys-csr__activities-content {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--60);
}
@media screen and (max-width: 1039px) {
  .ys-csr__activities-content {
    gap: var(--wp--preset--spacing--40);
  }
}

.ys-csr__block {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--30);
}

.ys-csr__activities-title {
  font-size: var(--wp--preset--font-size--large);
  color: var(--wp--preset--color--custom-black);
}

.ys-csr__activities-text {
  color: var(--wp--preset--color--custom-black);
}
.ys-csr__image {
  &[src*="csr-image1"] {
    width: 169px;
    height: auto;
  }
  &[src*="csr-image2"] {
    width: 180px;
    height: auto;
  }
  &[src*="csr-image3"] {
    width: 97px;
    height: auto;
  }
}

.ys-csr__extlink {
  background-color: var(--wp--preset--color--custom-bg-black);
  .ys-title {
    font-size: var(--wp--preset--font-size--large);
    color: var(--wp--preset--color--custom-white);
    margin-block-end: var(--wp--preset--spacing--40);
  }
  ul {
    display: flex;
    justify-content: flex-start;
    gap: var(--wp--preset--spacing--30);
    overflow-x: auto;
    li {
      padding: 0;
      &::before {
        content: none;
      }
      a {
        display: flex;
        justify-content: flex-start;
        align-items: flex-end;
        padding: 0px;
        gap: var(--wp--preset--spacing--10);
        width: 294px;
        height: 147px;
        background-color: var(--wp--preset--color--custom-white);

        &[href*="cocolo-project"] {
          background-image: url(../images/cocolo_rogo.png);
          background-size: cover;
          background-position: center;
        }
        &[href*="dydo"] {
          background-image: url(../images/dydo_rogo.png);
          background-size: cover;
          background-position: center;
        }

        span {
          font-size: var(--wp--preset--font-size--x-small);
          color: var(--wp--preset--color--custom-black);
          background-color: var(--wp--preset--color--custom-white);
          padding: 2px 4px;
        }
      }
    }
  }
}

