.page-node-type-referenz .placeit-header {
  background: var(--color-orange-op);
}

main div.block-page-title-block {
  background: var(--color-orange-op);
}

h1.page-title {
  font-family: var(--font-medium);
/*  font-size: 15pt; */
  padding-top: 70px;
  margin: 0px;
  padding-left: 139px;
}

section.placeit-main {
  padding-top: 79px;
}
 
.node__content ul {
  list-style: none;
}

.node__content li:before {
  font: var(--fa-font-solid);
  content: "\f058"; 
  display: inline-block;
  margin-left: -25px;
  margin-right: 15px;
  color: var(--color-orange);
}

.node__content li {
  font-family: var(--font-regular);
  font-size: 10.5pt;
  padding-bottom: 10px;
}

.node__content {
  display: grid;
  grid-template-columns:  17% 16% 17% 17% 16% 17%;
  grid-template-areas: "referenz-tag referenz-tag referenz-tag referenz-intro-bild referenz-intro-bild referenz-intro-bild" 
                       "referenz-intro referenz-intro referenz-intro referenz-intro-bild referenz-intro-bild referenz-intro-bild" 
                       "referenz-haupttext referenz-haupttext referenz-haupttext referenz-haupttext referenz-haupttext referenz-haupttext";
	       } 

.node__content p {
/*  font-family: var(--font-light); */
/*  font-size: 12pt; */
/*  line-height: 16pt; */
  padding-bottom: 10px;
}


@media (min-width: 0px) and (max-width: 640px) {
  .placeit-body h1 {
    font-size: 18pt;
  }
  h1.page-title {
    font-size: 22pt;
    padding-top: 20px;
    padding-bottom: 20px;
/*    width: 88%; */
    padding-left: 40px;
  }
  .node__content {
    grid-template-columns:  33% 34% 33%;
    grid-row-gap: 0px;
    grid-template-areas: "referenz-tag referenz-tag referenz-tag"
                         "referenz-intro-bild referenz-intro-bild referenz-intro-bild"
                         "referenz-intro referenz-intro referenz-intro"
			 "referenz-haupttext referenz-haupttext referenz-haupttext"; 
  }
  .node__content li:before {
    margin-left: -30px;
    margin-right: 12px;
  }
  .field--name-field-bild-referenz img {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

/* TAG */

.page-node-type-referenz .field--name-field-referenztag {
  grid-area: referenz-tag;
  background-color: var(--color-orange-op);
  padding-left: 139px;
  padding-top: 20px;
}

.page-node-type-referenz .field--name-field-referenztag a {
  width: fit-content;
  font-size: 10.5pt;
  display: flex;
  align-items: center;
  height: 30px;
  border-radius: 20px;
  padding: 0 20px;
  background-color: var(--color-orange);
  cursor: pointer;
  text-decoration: none;
  color: var(--color-text);
}

@media (min-width: 0px) and (max-width: 640px) {
  .placeit-body section.placeit-main .field.field--name-field-referenztag {
    padding-left: 40px;
    padding-right: 25px;
    padding-top: 5px;
    padding-bottom: 10px;
    }
}

/* INTRO */

main .field--name-body {
  grid-area: referenz-intro;
  background: var(--color-orange-op);
}
main .field--name-body li {
  font-family: var(--font-medium);
  font-size: 15pt;
}

.placeit-body section.placeit-main .field.field--name-body {
  padding-left: 139px;
}

.field--name-field-bild-referenz {
  grid-area: referenz-intro-bild;
  background: var(--color-orange-op);
}

.field--name-field-bild-referenz img {
  width: 100%;
  height: 100%;
}

.field--name-field-bild-referenz article {
  padding-left: unset;
}

.placeit-body section.placeit-main .field.field--name-field-bild-referenz {
  padding-left: 40px;
  padding-right: 40px;
}

@media (min-width: 0px) and (max-width: 640px) {
  .placeit-body section.placeit-main .field.field--name-body {
    padding-left: 40px;
    padding-right: 25px;
  }
  .placeit-body section.placeit-main .field.field--name-field-bild-referenz {
    padding-left: 40px;
/*    width: 74%; */
  }
  .field--name-body li {
    font-size: 13pt;
  }
}

/* HAUPTTEXT */

.field--name-field-haupttext {
  grid-area: referenz-haupttext;
}

.placeit-body section.placeit-main .field.field--name-field-haupttext {
  padding-left: 139px;
  padding-top: 100px;
  padding-bottom: 100px;
  padding-right: 40px;
}

.field--name-field-haupttext h1 {
  font-family: var(--font-medium);
  font-size: 18pt;
}	

@media (min-width: 0px) and (max-width: 640px) {
  .placeit-body section.placeit-main .field.field--name-field-haupttext {
    padding-left: 40px;
    padding-right: 25px;
  }
  .field--name-field-haupttext p {
    font-size: 13pt;
  }
  .placeit-body section.placeit-main .field.field--name-field-haupttext {
    padding-top: 10px;
  }
}

@media (min-width: 0px) and (max-width: 640px) {
  .field--name-field-text-testimonial {
    border-radius: 0 35% 35% 0 / 0 55% 55% 0;
    padding: 5px 30px 15px 20px;
    width: 75%;
    height: 150px;
    font-size: 12pt;
    margin-left: 10px;
  }
  .node__content::after {
    margin-left: 10px;
  }
  .field--name-field-bild-testimonial {
    margin-right: 10px;
    margin-left: 10px;
  }
  .field--name-field-bild-testimonial img {
    width: 100%;
    height: 100%;
  }
  .field--name-field-name-person {
    font-size: 10.5pt;
    line-height: 1.2em;
    margin-top: 10px;
    margin-left: 10px;
  }
  .field--name-field-rolle-person {
    font-size: 9pt;
    line-height: 0em;
    margin-left: 10px;
  }
  .field--name-field-organisation {
    font-size: 9pt;
    line-height: 0em;
    margin-left: 10px;
  }
}