#ydelser-content-section {
  margin-top: 60px;
}

.key-area-container {
  position: relative;
  border-radius: 20px;

  & .key-area-container-header {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    position: relative;
    background-color: var(--container-header-bg-color);
    opacity: .85;
    border-radius: 20px 20px 0 0;
    padding: 10px 20px;
    z-index: 1;
  }

  & .key-area-container-main {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: white;
    border-radius: 20px;
    background-image: linear-gradient(135deg, var(--primary-color1), var(--secondary-color1) 60%);
    opacity: .9;
  }
  
  & .key-area-container-footer {
    width: 100%;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: var(--container-header-bg-color);
    opacity: .85;
    border-radius: 0 0 20px 20px;
    gap: 2em;

    & span {
      font-size: .6rem;
      font-weight: 500;
      color: var(--light-color);
      text-shadow: 0 0 5px rgba(0, 0, 0);
      z-index: 2;
    }
  }
}


.article-content-section {
  position: relative;  
  height: calc(100% - 70px);
  margin-top: 50px;
  padding: 0 20px;
  overflow-y: scroll;
}

.article-content-paragraf::first-letter {
  font-family: UniSans;
  font-size: 1.5rem;
  letter-spacing: .03em;
}

.article-content-ul-wrapper span {
  font-size: 1rem;
  font-weight: 600;
}

.article-content-section ul {
  padding-inline-start: 20px;
  margin: 5px 0 20px;
}

.article-content-section-link {
  position: absolute;
  bottom: 20px;
  right: 20px;
  border: 1px solid var(--light-color);
  padding: 5px 10px;
  border-radius: 10px;
  transition: .3s;
}

.article-content-section-link:hover {
  border: 1px solid var(--light-color);
  background-color: var(--light-bg-color);
  color: var(--primary-color1);
}

.article-content-img-wrapper {
  width: 667px;
  height: 450px;
}


.key-area-container-main:hover img {
  z-index: -1;
  opacity: .07;
}


/** Left Column **/
.key-area-container-main:hover .information-card-left-column {
  /* z-index: 10; */
  opacity: .9;
}

.key-area-container-main:hover .information-card-left-column img {
  z-index: 1;
  opacity: 1;
}