/* Seite, Standard
*********************************/
.page-standard {
  padding-top:4.3636rem;
  padding-bottom:4.3636rem;
  background:var(--gray-lightest);
}
.page-header {
  margin-bottom:1.5rem;
}
.page-header > * {
  margin-bottom: 0;
}

/* Seite, Profil
*********************************/
.page-profile .page-content {
  flex:0 0 100%;
}
.page-profile .page-aside {
  flex:0 0 100%;
}
.page-profile .page-aside-inner {
  background:var(--gray-lighter);
  padding:var(--gutter-x);
}
.page-profile .page-aside h2 {
  margin-bottom:.25rem;
}
.page-profile .page-aside-inner > :last-child {
  margin-bottom:0;
}
@media only screen and (min-width : 992px) {
  .page-profile .page-content,
  .page-profile .page-aside {
    flex:0 0 50%;
    max-width: 50%;
  }
}

/* Seite, Kontakt
*********************************/
.page-contact .page-content,
.page-contact .page-form {
  flex:0 0 100%;
  max-width: 100%;
}
@media only screen and (min-width : 768px) {
  .page-contact .page-content {
    flex:0 0 40%;
    max-width: 40%;
  }
  .page-contact .page-form {
    flex:0 0 60%;
    max-width: 60%;
  }
}

/* Seite, Galerie, Fullscreen
*********************************/
.page-gallery {
  height:calc(100vh - var(--header-height));
}
.splide-fullscreen .splide__slide img {
  height:calc(100vh - var(--header-height));
  width:100%;
  object-fit: cover;
}
.splide-fullscreen .splide__pagination {
  bottom:2rem;
  background:rgba(0,0,0,.5);
  padding:.25rem;
  width:auto;
}
.splide-fullscreen .splide__pagination__page {
  background:#fff;
  width:2.9090rem;
  height:.5rem;
  border-radius: 0;
  opacity:1;
  min-width: 0;
  margin:.25rem;
  display:block;
}
.splide-fullscreen .splide__pagination__page.is-active {
  background:var(--green);
  transform: none;
}
@media only screen and (min-width : 1200px) {
  .splide-fullscreen .splide__pagination {
    bottom:3.5rem;
  }
}

/* Artikel, Referenzen
*********************************/
.articles-references {}
.article-reference {}
.article-reference-inner {
  position: relative;
}
.article-reference-detaillink {
  display:block;
  position: absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
}
.article-reference-header {
  font-size:2.1818rem;
  font-size:1.25rem;
  line-height:1.3;
  font-weight: 300;
  color:#000;
  text-align: center;
  position: absolute;
  top: 1.6363rem;
  right: 1.6363rem;
  bottom: 1.6363rem;
  left: 1.6363rem;
  display:flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background:rgba(255,255,255,.75);
  opacity:0;
  transition:opacity .2s ease;
}
.article-reference-detaillink:hover .article-reference-header {
  opacity: 1;
}
.article-reference-header h2 {
  font-size:2.9090rem;
  font-size:1.5rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin:0;
}
.article-reference-header p {
  margin:0;
}
.article-reference-image {}
.article-reference-image img {
  display:block;
  width:100%;
  height:auto;
}

@media only screen and (min-width : 768px) {
  .article-reference {
    flex:0 0 50%;
    max-width: 50%;
  }
}
@media only screen and (min-width : 580px) {
  .article-reference-header h2 {
    font-size:2rem;
  }
  .article-reference-header {
    font-size:1.5rem;
  }
}
@media only screen and (min-width : 768px) {
  .article-reference-header h2 {
    font-size:1.25rem;
  }
  .article-reference-header {
    font-size:1rem;
  }
}
@media only screen and (min-width : 992px) {
  .article-reference-header h2 {
    font-size:1.75rem;
  }
  .article-reference-header {
    font-size:1.25rem;
  }
}
@media only screen and (min-width : 1200px) {
  .article-reference-header h2 {
    font-size:2rem;
  }
  .article-reference-header {
    font-size:1.5rem;
  }
}
@media only screen and (min-width : 1600px) {
  .article-reference-header h2 {
    font-size:2.5rem;
  }
  .article-reference-header {
    font-size:2rem;
  }
}

.article-reference-detail .page-content {
  font-size:1.4545rem;
  line-height:1.5;
  text-align: center;
  margin-bottom:2rem;
}
.article-reference-nv {
  display:flex;
  justify-content: center;
  font-size:.7272rem;
  margin-top:.375rem;
}
.article-reference-nv a {
  display:block;
}
.article-reference-nv a span {
  color:var(--green-light);
}
.article-reference-nv a:hover {
  color:#000;
}
.article-reference-nv a:hover span {
  color:var(--green);
}
.article-reference-nv svg {
  display:inline-block;
  vertical-align: middle;
  height:1.25rem;
  width:auto;
}
.article-reference-nv a:nth-child(1) span {
  margin-right:.5em;
}
.article-reference-nv a:nth-child(2) {
  margin:0 1.25rem;
}
.article-reference-nv a:nth-child(3) span {
  margin-left:.5em;
}
.article-reference-nv path {
  transition:fill .2s ease;
}
.article-reference-nv a:hover path {
  fill:var(--green);
}

@media only screen and (min-width : 992px) {
  .article-reference-detail .page-grid {
    display: grid;
    grid-template-areas: 'heading nv'
                        'gallery gallery'
                        'content content';
  }
  .article-reference-detail .page-header {
    grid-area: heading;
    margin-bottom:3.5rem;
  }
  .article-reference-detail .splide-gallery {
    grid-area: gallery;
  }
  .article-reference-detail .page-content {
    grid-area: content;
  }
  .article-reference-detail .article-reference-nv {
    grid-area: nv;
    justify-self: flex-end;
    align-self: flex-start;
  }
}

/* Galerie, Referenzen
*********************************/
.splide-gallery {
  --gutter-x: 1rem;
  --gutter-y: 1rem;
  margin-bottom:2rem;
}
.splide-gallery .splide {
  flex: 100%;
  max-width: 100%;
}
.splide-gallery .splide-thumbs {
  flex: 100%;
  max-width: 100%;
}
.splide-gallery .splide-thumbs .row {
  /*--gutter-x: 6.25%;*/
  /*--gutter-y: 6.25%;*/
  justify-content: center;
}
.splide-gallery .splide-thumb {
  flex:0 0 20%;
  max-width: 20%;
}
.splide-gallery .splide-thumb button {
  display:block;
  width:100%;
  min-width: 0;
  margin:0;
  padding:0;
  overflow:hidden;
}
.splide-gallery .splide-thumb button:hover {
  /*outline:solid var(--gray) 2px;*/
}
.splide-gallery .splide-thumb button:hover img {
  transform:scale(1.05);
}
.splide-gallery .splide-thumb button.active {
  outline:solid var(--gray) 2px;
}
.splide-gallery .splide-thumb img {
  display:block;
  width:100%;
  height:auto;
  transition:transform .2s ease;
}

.splide-gallery .splide__slide {

}
.splide-gallery .splide__image {
  position: relative;
  height:0;
  padding-bottom:67%;
  margin-bottom:.5rem;
  /*
  display:flex;
  justify-content: center;
  align-items: center;
*/
}
.splide-gallery .splide__image img {
  position: absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  object-fit: contain;
  object-position: 50% 0;
  /*
  max-width: 100%;
  max-height: 100%;
  width:auto;
  height:auto;
*/
}
.splide-gallery .splide__title {
  text-align:center;
}

@media only screen and (min-width : 992px) {
  .article-reference-detail .page-content {
    flex:0 0 80%;
    max-width:80%;
  }
  .splide-gallery {
    --gutter-x: 3rem;
    --gutter-y: 1rem;
  }
  .splide-gallery .splide-thumbs .row {
    --gutter-x: 1rem;
    --gutter-y: 1rem;
    justify-content: flex-start;
  }

  .splide-gallery .splide {
    flex: 80%;
    max-width: 80%;
  }
  .splide-gallery .splide-thumbs {
    flex: 20%;
    max-width: 20%;
  }
  .splide-gallery .splide-thumb {
    flex: 50%;
    max-width: 50%;
  }
}

/* Artikel, Projekte
*********************************/
.articles-projects {
  line-height: 1.6363;
}
.articles-projects-category {
  flex:0 0 100%;
  max-width: 100%;
}
.articles-projects-list {
  margin:0;
  padding: 0;
  list-style: none;
}
.articles-projects-list li {
  margin:0 0 .5rem 0;
  padding: 0;
}
.articles-projects-list li p {
  margin-bottom:0;
}
.article-project-type {
  font-weight:300;
}
.article-project-type::before {
  content:'';
  display:inline-block;
  background:var(--green-light);
  width:.5rem;
  height:.75em;
  margin-right:.375em;
}
.article-project-location {
  white-space: nowrap;
}
.article-project-hint {
  color:var(--green);
  font-style: italic;
  font-weight:500;
}
@media only screen and (min-width : 992px) {
  .articles-projects-category {
    flex:0 0 33.3333%;
    max-width: 33.3333%;
  }
}

/* Formulare
*********************************/
form p {
  clear:both;
  margin:0 0 .75em 0;
}

fieldset {
  margin:0 0 15px 0;
  padding:0;
  border:0;
}
fieldset legend {
}

.required label:after,
.required-span span.label:after,
.required-span span.label-indent:after,
.required-span span.label-block:after {
  content:'*';
}
input[type=text],
input[type=password],
input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=search],
input[type=tel],
input[type=time],
input[type=url],
input[type=week],
textarea {
  -webkit-appearance: none;
  -webkit-border-radius:0px;
  width:100%;
  margin:0;
  padding:.6363rem 1rem;
  border:0;
  background:var(--gray-lighter);
  line-height:1.4;
}
input[type=text]:focus,
input[type=password]:focus,
input[type=date]:focus,
input[type=datetime]:focus,
input[type=datetime-local]:focus,
input[type=email]:focus,
input[type=month]:focus,
input[type=number]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=time]:focus,
input[type=url]:focus,
input[type=week]:focus,
textarea:focus {
  margin:0;
  border:0;
}
textarea {
  height:12rem;
}
a.btn,
button,
input[type=submit] {
  -webkit-appearance: none;
  -webkit-border-radius:0px;
  display:inline-block;
  min-width:15rem;
  max-width: 100%;
  margin:0;
  padding:.6363rem 1rem;
  border:0;
  border-radius: 0;
  cursor:pointer;
  background:var(--gray);
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.05em;
  text-decoration:none;
  text-align: left;
  line-height:1.4;
  transition:background .2s ease;
}
input[type=submit]::-moz-focus-inner {
  border: 0;
}
::placeholder {
  /*text-transform: uppercase;*/
  font-weight: 300;
}
a.btn:hover,
button:hover,
input[type=submit]:hover {
  background-color:var(--gray-dark);
}
.sendmail_emptyfield1 label,
label.sendmail_emptyfield1 {
  color:#f00;
}
.sendmail_emptyfield1 input.text,
input.sendmail_emptyfield1,
.sendmail_emptyfield1 textarea {
  border-color:#f00;
}
.message {
  border:solid #f6e468 1px;
  background:#ffffdb;
  padding:5px;
  margin:0 0 .8em 0;
}