
.block-views-blockrelated-content-related,
.block#block-specialeventsrelated {
  margin: 7rem -1rem 2rem -1rem;
  padding: 0;
  width: auto;
  max-width: none;
  position: relative;
}

body:not(.page-article) .block-views-blockrelated-content-related .views-field-field-ref-pages-related > .field-content:not(:empty)::before {
  content: 'Related pages';
  font-size: 22px;
  font-weight: 500;
  position: absolute;
  top: -3rem;
  left: 2rem;
  color: var(--text_color);
}

.block-views-blockrelated-content-related > h2,
.block#block-specialeventsrelated > h2 {
  padding: 0 2rem;
}

@media (min-width: 1024px){
  .block-views-blockrelated-content-related,
  .block#block-specialeventsrelated {
    margin: 7rem auto 2rem auto;
  }

  .block-views-blockrelated-content-related > h2,
  .block#block-specialeventsrelated > h2 {
    padding: 0 1rem;
  }

  
  body:not(.page-article) .block-views-blockrelated-content-related .views-field-field-ref-pages-related > .field-content:not(:empty)::before { 
    left: 0;
    top: -3.5rem;
    font-size: 26px;
  }

  body:not(.highlight-first-related):not(.page-article) .block-views-blockrelated-content-related .views-field-field-ref-pages-related 
    > .field-content:not(:empty)::before {
    top: -1rem;
  }

  .block-views-blockrelated-content-related .field-content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}


@media (min-width: 1200px) {
  .block-views-blockrelated-content-related .field-content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .block-views-blockrelated-content-related,
  .block#block-specialeventsrelated {
    margin: 10rem auto 3rem auto;
    width: 960px;
  }

  .highlight-first-related .block-views-blockrelated-content-related .field-content article:first-child {
    grid-column: span 2;
  }

  .block-views-blockrelated-content-related > h2,
  .block#block-specialeventsrelated > h2 {
    font-weight: 500;
    display: block;
    font-size: 30px;
    color: var(--text_color);
    margin: 2rem 0;
    padding: 0;
  }

  .field--name-field-ref-pages-related >.field__label{
    max-width: 745px;
    margin-left: auto;
    margin-right: auto;
  }
}


@media (min-width: 1400px) {
  .field--name-field-ref-pages-related { width: 1024px; }
  .block-views-blockrelated-content-related,
  .block#block-specialeventsrelated { width: 1236px; }
}

@media (min-width: 1700px) {
  .field--name-field-ref-pages-related { width: 1150px; }
}


/* RELATED TITLE */

.field--name-field-ref-pages-related .field__label {
  margin: 4rem 0px 2rem 0px ;
  font-size: 16px;
}

@media (min-width:1200px) {

  /*related news title*/
  .field--name-field-ref-pages-related .field__label {
    font-weight: 500;
    max-width: 745px;
    display: block;
    font-size: 30px;
    color: var(--text_color);
    margin: 5rem auto 2rem 7rem ;
  }

  /*related news container */
  .field--name-field-ref-pages-related .field__items {
    display: flex;
  }
}


.field--name-field-ref-pages-related .field__items {
  margin-bottom: 5rem;
}
