/**
 * @file
 * Article styles
 *
 */


.block-actu-list {
  list-style: none;
  padding: 0;
  margin: 0 0 3rem;
}
@media screen and (min-width: 900px) {
  .block-actu-list {
    margin: 0;
  }
}

/**
 * Article teaser
 */

.article-teaser__wrapper {
  position: relative;
  background: linear-gradient(#fff 15%, var(--color-primary--1) 0%);
  border-radius: 3px;
  padding-bottom: 4rem;
  transition: 0.3s;
  color: var(--color-primary--5);
  margin-left: -2rem;
  margin-right: -2rem;
}
.article-teaser__image img{
  margin: 0 auto;
}
.article-teaser__before-title{
  color: var(--color-secondary--gradiant-1);
  font-weight: 700;
}
.article-teaser__before-title {
  background-color: white;
  background-image: var(--color-secondary--gradiant-1);
  background-size: 100%;
  background-repeat: repeat;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
}
.article-teaser__content{
  margin: 0 1.87rem;
}
.article-teaser__title,
.article-teaser__text {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;

}
.article-teaser__title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 0;
  margin-top: 0.5rem;
}
.article-teaser__more-wrapper {
  display: flex;
  justify-content: end;
  margin-right: 40px;
}
.article-teaser__more {
  color: var(--color-primary--2);
  margin: 0;
  font-weight: 700;
  position: relative;
  text-decoration: underline;
}
.article-teaser__more:after {
  content: url("../../images/icons/arrow-blue.svg");
  position: absolute;
  right: -20px;
}
.article-teaser__more:hover {
  transition: 0.3s;
}
@media screen and (min-width: 700px) {
  .article-teaser__wrapper{
    margin-left: -3rem;
    margin-right: -3rem;
  }
}
@media screen and (min-width: 900px) {
  .article-teaser{
    max-width: 700px;
    margin-left: inherit;
    margin-right: inherit;
  }
  .article-teaser__wrapper{
    margin-left: inherit;
    margin-right: inherit;
  }
  .article-teaser__content{
    margin: 0 3rem;
  }
}
@media screen and (min-width: 1200px) {
  .article-teaser__content{
    margin: 0 8rem;
  }
}