/* Layout Pages Design additional to Startpage */

/* Produkte */

.placeit-products-page-header {
  margin-top: -70px;
  margin-bottom: 0px;
  text-align: center;
}


/* placeit on Tour */

.placeit-on-tour-page-header {
  text-align: center;
  padding-bottom: 80px;
  padding-top: 40px;
}

.placeit-on-tour-page-content .views-field-field-datum,
.placeit-on-tour-page-content .views-field-field-dachzeile {
  font-family: var(--font-regular);
  font-size: var(--font-size-roofline);
  padding-bottom: 16px;
}       

.placeit-on-tour-page-content .views-field-field-datum .field-content::after {
  content: "\00a0|\00a0\00a0";
}

.placeit-on-tour-page-content .views-field-field-ueberschrift {
  font-family: var(--font-medium);
  font-size: 18pt;
}

.placeit-on-tour-page-content .view .view-content .views-row {
  margin-left: 95px;
  margin-right: 95px;
  margin-bottom: 50px;
  display: grid;
  grid-template-columns:  60% 40%;
  grid-template-areas: "ontour-datum_dachzeile ontour-image"
                       "ontour-ueberschrift ontour-image"
                       "ontour-body ontour-image"
                       ". ontour-image";
  background-color: var(--color-orange-op);
  grid-row-gap: 0px;
}

.placeit-on-tour-page-content .view .view-content .views-row .views-field-field-bild-on-tour {
  grid-area: ontour-image;
}

.placeit-on-tour-page-content .view .view-content .views-row .views-field-field-bild-on-tour img {
  width: 100%;
  height: 100%;
}

.placeit-on-tour-page-content .views-field-field-datum {
  float: left;
}

.placeit-on-tour-page-content .placeit-on-tour-datum-dachzeile .views-field {
  grid-area: ontour-datum_dachzeile;
  padding-top: 10px;
  padding-left: 10px;
}

.placeit-on-tour-page-content .views-field-field-ueberschrift {
  grid-area: ontour-ueberschrift;
  padding: 10px;
}

.placeit-on-tour-page-content .views-field-body {
  grid-area: ontour-body;
  padding-left: 10px;
  padding-right: 14px;
}

.placeit-on-tour-page-content .views-field-body p {
  font-size: var(--font-size-text-small);
  line-height: 14pt;
}

@media (min-width: 641px) and (max-width: 1024px) {
  .placeit-on-tour-page-content .view .view-content .views-row {
    margin-left: 25px;
    margin-right: 25px;
  }
}
@media (min-width: 0px) and (max-width: 640px) {
  .placeit-on-tour-page {
    padding-right: 30px;
  }	
  .placeit-on-tour-page-header {
    padding: unset;
  }
  .placeit-on-tour-page-content .view .view-content .views-row {
    grid-template-columns: 100%;
    grid-template-areas: "ontour-datum_dachzeile" "ontour-image" "ontour-ueberschrift" "ontour-body";
    margin-left: unset;
    margin-right: unset;
    margin-bottom: 30px;
    padding-bottom: 20px;
  }
}

/* Referenzen / Use Cases */

.placeit-references-page {
  padding-top: 75px;
}

.placeit-references-page h1 {
  padding-left: 100px;
  padding-right: 100px;
}

.placeit-references-page-header {
  text-align: center;
}

.placeit-references-page-header p {
  font-size: var(--font-size-roofline);
}

.placeit-references-page-content {
  --color-references-tag: var(--color-green);
}

.placeit-references-page-content .view .view-content .views-row {
  margin-left: 95px;
  margin-right: 95px;
  margin-bottom: 50px;
  display: grid;
  grid-template-columns:  40% 60%;
  grid-template-areas: "referenz-image referenz-title" 
                       "referenz-image referenz-teaser-header"
		       "referenz-image referenz-teaser"
		       "referenz-image referenz-link"; 
  background-color: var(--color-orange-op);
  grid-row-gap: 0px;
}
.placeit-references-page-content .view .view-content .views-row div {
  margin: 0px;
  padding: 0px;
}

.placeit-references-page-content .view .view-content .views-row .views-field-field-bild-referenz {
  grid-area: referenz-image;
  padding-right: 15px;
}

.placeit-references-page-content .view .view-content .views-row .views-field-title {
  grid-area: referenz-title;
  padding-top: 20px;
  font-family: var(--font-regular);
  font-size: var(--font-size-roofline);
}

.placeit-references-page-content .view .view-content .views-row .views-field-field-teaser-ueberschrift {
  grid-area: referenz-teaser-header;
}

.placeit-references-page-content .view .view-content .views-row .views-field-field-teaser-ueberschrift p {
  font-family: var(--font-medium);
  font-size: 18pt;
}

.placeit-references-page-content .view .view-content .views-row .views-field-field-teaser-te {
  grid-area: referenz-teaser;
}

.placeit-references-page-content .view .view-content .views-row .views-field-field-teaser-te p {
/*  font-family: var(--font-regular); */
/*  font-size: 12pt; */
}

.placeit-references-page-content .view .view-content .views-row .views-field-view-node {
  grid-area: referenz-link;
  padding-bottom: 20px;
}

.placeit-references-page-content .view .view-content .views-row .views-field-view-node a {
  text-decoration: none;
  font-family: var(--font-medium);
  font-size: 10.5pt;
  color: var(--color-text);
}

.placeit-references-page-content .view .view-content .views-row .views-field-view-node a::after {
  content: "\00a0\00a0>";
}

.placeit-references-page-content label.option {
  display: flex;
  align-items: center;
  height: 33px;
  border-radius: 20px;
  padding: 0 20px;
  background-color: var(--color-references-tag);
  cursor: pointer;
}

.placeit-references-page-content .form-item {
  padding-right: 20px;
}

.placeit-references-page-content .form-item:nth-child(5n+1) {
  --color-references-tag: var(--color-yellow-op);
} 

.placeit-references-page-content .form-item:nth-child(5n+2) {
  --color-references-tag: var(--color-red-op);
}

.placeit-references-page-content .form-item:nth-child(5n+3) {
  --color-references-tag: var(--color-green-op);
}

.placeit-references-page-content .form-item:nth-child(5n+4) {
  --color-references-tag: var(--color-purple-op);
}

.placeit-references-page-content .form-item:nth-child(5n+5) {
  --color-references-tag: var(--color-orange-op);
}

.placeit-references-page-content input[type="radio"] {
  display: none;
}

.placeit-references-page-content .view-filters {
	display: none;
}

@media (min-width: 641px) and (max-width: 1024px) {
  .placeit-references-page-content .view .view-content .views-row {
    margin-left: unset;
    margin-right: unset;
    padding-right: 15px;
  }
}

@media (min-width: 0px) and (max-width: 640px) {
  .placeit-references-page-header{
    padding-top: 10px;
    text-align: left;
  }
  .placeit-references-page {
    padding-top: 10px;
    text-align: left;
  }
  .placeit-references-page h1 {
    padding-left: unset;
    padding-right: unset;
    font-size: 1em;
    text-align: left;
 }
  .placeit-references-page-content .view .view-content .views-row {
    margin-left: unset;
    margin-right: unset;
    display: grid;
    grid-template-columns:  100%;
    grid-template-areas: "referenz-title" 
                         "referenz-image" "referenz-teaser-header"
       	                 "referenz-teaser"
                         "referenz-link"; 
  }
  .placeit-references-page-content .view .view-content .views-row .views-field-field-bild-referenz {
    padding:unset;
  }
  .views-field-field-bild-referenz img {
    width: 100%;
    height: 100%;
  }
  .placeit-references-page-content .view .view-content .views-row .views-field-title {
    margin: 10px;
    padding-top: unset;
  }
  .placeit-references-page-content .view .view-content .views-row .views-field-field-teaser-ueberschrift {
    margin: 10px;
    padding-top: unset;
  }
  .placeit-references-page-content .view .view-content .views-row .views-field-field-teaser-te {
    margin: 10px;
    padding-top: unset;
  }
  .placeit-references-page-content .view .view-content .views-row .views-field-view-node {
    margin: 10px;
    padding-top: unset;
  }
}

/* Blickwinkel / Loesungen */

/*
.placeit-blickwinkel-page-header {
  padding-top: 60px;
  text-align: center;
}

.placeit-blickwinkel-page-header h1 {
  padding-left: 100px;
  padding-right: 100px;
}
*/
.placeit-blickwinkel-page-teaser h1 {
  padding-top: 60px;
  text-align: center;
  padding-left: 100px;
  padding-right: 100px;
}

.placeit-blickwinkel-page-teaser {
  padding-right: 60px;
}

.placeit-blickwinkel-page-teaser p {
  text-align: center;
  font-family: var(--font-text);
  font-size: var(--font-size-text-normal);
}

.placeit-blickwinkel-page-teaser p a {
  color: var(--color-green);
}

@media (min-width: 641px) and (max-width: 1024px) {
  .placeit-blickwinkel-page-teaser {
    padding-right: 20px;
    padding-left: 20px;
  }
}
@media (min-width: 0px) and (max-width: 640px) {
  .placeit-products-page-header {
    padding-top: 0px;
    margin-top: -90px;
    width: 88%;
  }
  .placeit-blickwinkel-page-header {
    padding-top: 20px;
    width: 95%;
  }
  .placeit-products-page-header h1,
  .placeit-blickwinkel-page-header h1 {
    padding-left: unset;
    padding-right: unset;
  }
  .placeit-blickwinkel-page-teaser {
    width: 95%;
  }
  .placeit-blickwinkel-page-teaser p {
    /* font-family: var(--font-light); */
    /* font-size: 11.25pt; */
    font-size: var(--font-size-text-small);
  }
}


.placeit-pricing-testimonials,.placeit-pricing-faq {
  display: none;
}

.placeit-pricing .view-content {
  display: flex;
  column-gap: 80px;
}

.placeit-pricing .view-content .views-row {
  border: 2px solid lightgreen;
  padding: 15px;
  box-shadow: 4px 4px 8px gray;
}

.placeit-pricing .views-element-container {
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
}

/* Shop */

.placeit-product {
  --color-product-list: red;
}

/*
.placeit-product-title {
  margin-left: 22px;
  margin-right: 22px;
  padding-top: 30px;
  border-bottom: 1px solid var(--color-product-list);
}

.placeit-product-title h1 {
}

.placeit-product-title p {
  font-size: 16pt;
  line-height: 19pt;
}
*/


.placeit-product-description {
  margin-top: 10px;
  margin-left: 22px;
  margin-right: 22px;
}

.placeit-product-description h2 {
  padding-top: 30px;
  border-bottom: 1px solid var(--color-product-list);
  margin-bottom: 10px;
}

.placeit-product p {
/*  font-family: var(--font-light); */
/*  font-size: 12pt; */
  font-size: var(--font-size-text-small);
/*  line-height: 15pt; */
  line-height: 1.4;
}

.placeit-product .view-content {
  display: grid;
  grid-template-columns:  20% 20% 20% 20% 20%;
}

.placeit-product .views-row {
  margin: 20px;
  display: grid;
  grid-template-rows: 70px 200px 52px;
  grid-template-areas: "title title" "content content" "link link";
  border: 2px solid var(--color-product-list);
}

.placeit-product .views-field-view-commerce-product span a, .placeit-product .views-field-view-node span a {
  font-family: var(--font-medium);
  font-size: 10.5pt;
  color: var(--color-text);
  text-decoration: unset;
  border-radius: 22px;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 20px;
  padding-right: 20px;
  margin: 0;
  line-height: 0;
  background-color: var(--color-product-list);
}

.placeit-product .views-field-field-produkt-ueberschrift, .placeit-product .views-field-field-ueberschrift {
  grid-area: title;
  font-family: var(--font-medium);
  font-size: 16pt;
  background-color: var(--color-product-list);
  padding: 10px;
  padding-left: 14px;
  padding-right: 14px;
  display: flex;
  align-items: center;
}

.placeit-product .views-row .views-field-field-titel-shopuebersicht-flagg div {
  border-radius: 0 20px 20px 0 / 0 50% 50% 0;
  padding: 4px 10px 4px 8px;
  font-family: var(--font-medium);
  font-size: 17pt;
  background-color: var(--color-product-list-title);
}

.placeit-product .views-field-field-produktbild {
}

.placeit-product .views-field-field-placeit-produktbeschreibun, .placeit-product .views-field-field-kurzbeschreibung {
  grid-area: content;
  padding: 10px;
  height: calc(100% - 20px);
  overflow-y: hidden;
}

.placeit-product .views-field-field-placeit-produktbeschreibun h2 {
  display: none;
}

.placeit-product .views-field-field-placeit-produktbeschreibun article p {
  --max-lines: 6;
  /* --font-size: 16px; */
  --line-height: 1.2;
  /* font-size: var(--font-size); */
  font-size: 12pt;
  line-height: var(--line-height);
  position: relative;
  height: 154px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.placeit-product .views-field-field-placeit-produktbeschreibun article p::after {
  white-space: pre-wrap;
  position: absolute;
  content: " ...";
  height: 20px;
}
	

.placeit-product .views-field-view-commerce-product, .placeit-product .views-field-view-node {
  padding: 10px 0px 20px 10px;
}

/*
.placeit-product[data-producttype=communication] .view-content .views-row {
  --color-product-list: var(--color-lightgreen-op5);
  --color-product-list-title: var(--color-lightgreen);
}

.placeit-product[data-producttype=plan] .view-content .views-row {
  --color-product-list: var(--color-yellow-op5);
  --color-product-list-title: var(--color-yellow);
}

.placeit-product[data-producttype=all_in_one] .view-content .views-row {
  --color-product-list: var(--color-blue-op5);
  --color-product-list-title: var(--color-blue);
}
*/

.placeit-product[data-producttype=bundle] .view-content .views-row {
  --color-product-list: var(--color-purple-op5);
  --color-product-list-title: var(--color-purple);
}

.placeit-product .views-field-field-produkt-unique-identifier {
  grid-area: link;
}

.views-field-field-preisab, .views-field-field-non-profit-preis-ab, .views-field-field-preis {
  font-family: var(--font-medium);
  font-size: 9pt;
  padding-right: 5px;
  align-items: center;
  display: flex;
  justify-content: end;
}

.placeit-price {
  font-family: var(--font-medium);
  font-size: 9pt;
  padding-right: 25px;
  /* padding-top: 7px; */
}

.placeit-price::before {
  content: "ab ";
}

[lang=en] .placeit-price::before  {
  content: "from ";
}

.placeit-price::after {
  white-space: pre;
  content: " €\Ainkl. MwSt.";
}
[lang=en] .placeit-price::after {
  white-space: pre;
  content: " €\Aincl. VAT";
}

.views-field-field-produkt-unique-identifier .field-content {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

@media (min-width: 641px) and (max-width: 1024px) {
  .placeit-product .view-content {
    grid-template-columns:  33% 33% 33%;
  }
  .placeit-product .views-field-view-commerce-product span a {
     padding-left: 10px;
     padding-right: 10px;
  }
}

@media (min-width: 0px) and (max-width: 640px) {
  .placeit-product .view-content {
    grid-template-columns:  100%;
  }
}

/* SHOP EVAL */

.placeit-shop-tab .layout__region {
  border: 1px solid var(--color-lightgreen);
  border-radius: 20px;
}

.placeit-shop-tab .views-row .views-field-field-produkt-unique-identifier {
  width: 100%;
}

.placeit-shop-intro {
  padding: 24px;
}

.views-field-field-preis .field-content::before {
  content: "ab ";
}
[lang=en] .views-field-field-preis .field-content::before {
  content: "from ";
}

.views-field-field-preis .field-content::after {
  content: " €\Ainkl. MwSt.";
}
[lang=en] .views-field-field-preis .field-content::after {
  content: " €\Aincl. VAT.";
}

/* Pressemitteilungen / in den Medien */
.placei-pm {}
.placeit-pm-intro {
  text-align: center;
}

.placeit-pm-inhalt .view-content {
  display: grid;
  grid-template-columns: 33% 33% 33%;
}

.placeit-pm-inhalt time {
  font-size: var(--font-size-roofline);
  font-family: var(--font-medium);
}

.placeit-pm-inhalt .view-content .views-row {
  max-width: 90%;
}

.placeit-pm-inhalt .view-content .views-row div {
  padding-bottom: 10px;
}

.placeit-pm-inhalt .view-content .views-row .field-content .file--application-pdf {
  background-image: unset;
  padding-left: unset;
}

.placeit-pm-inhalt .view-content .views-row .field-content .file--application-pdf a {
  visibility: hidden;
  text-decoration: none;
}

.placeit-pm-inhalt .view-content .views-row .field-content .file--application-pdf a::before {
  text-decoration: none;
  visibility: visible;
  content: "Zum PDF";
  display: inline-block;
  background-color: var(--color-lightgreen);
  border-radius: 20px;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 20px;
  padding-right: 20px;
  font-size: 10.5pt;
  margin: 0;
  color: var(--color-text);
}
[data-lang=de] .placeit-pm-inhalt .view-content .views-row .field-content .file--application-pdf a::before {
  content: "Zum PDF";
}
[data-lang=en] .placeit-pm-inhalt .view-content .views-row .field-content .file--application-pdf a::before {
  content: "To the PDF";
}

.placeit-pm-inhalt .view-content .views-field-field-voransicht img {
  border: 1px solid lightgrey;
}

@media (min-width: 0px) and (max-width: 640px) {
  .placeit-pm-inhalt .view-content {
    grid-template-columns: 100%;
  }
}