@import url('../icons/style.css');

@font-face{
  font-family:"Mark Pro";
  src:url("../fonts/67260a48-c64a-4c8a-9317-5fd0a3468953.woff2") format("woff2"),
  url("../fonts/ab45fe39-2036-4dba-b878-a74d8140e8e7.woff") format("woff");
  }

.editor-styles-wrapper {
  font-family: "Mark Pro";
  line-height: 1.4;
  color: #3E494C;
  padding-bottom: 50px !important;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  --wp--preset--font-size--medium: 18px !important;
  --wp--preset--font-size--large: 25px !important;
  --yellow: #FECC35;
  --grey: #3E494C;
  --dark: #3E494C;
  }
  
.editor-styles-wrapper MAIN A,
.editor-styles-wrapper .content A {
  color: #3E494C;
  } 
  
.editor-styles-wrapper MAIN A:hover,
.editor-styles-wrapper .content A:hover {
  color: var(--yellow);
  }     
  
.editor-styles-wrapper P {
  margin-top: 0;
  margin-bottom: 1.5em;
  }
  
.editor-styles-wrapper P:last-child {
  margin-bottom: 0;
  }
  
.editor-styles-wrapper IMG {
  max-width: 100%;
  height: auto;
  }  
  
.editor-styles-wrapper ::selection {
  background: var(--yellow); 
  color: #fff;
  }
  
.editor-styles-wrapper ::-moz-selection {
  background: #3E494C; 
  color: #fff;
  }   
  
/* HEADLINES
------------------------------------------------------------------------ */  

.editor-styles-wrapper H2 {
  font-size: 25px;
  font-weight: normal !important;
  margin-top: 0;
  margin-bottom: 1.5em !important;
  -webkit-font-smoothing: antialiased !important;
  }
  
.editor-styles-wrapper H3 {
  font-size: 18px;
  line-height: 1.6;
  font-weight: normal !important;
  margin-top: 0;
  margin-bottom: 0 !important;
  text-decoration: underline;
  -webkit-font-smoothing: antialiased !important;
  }  
  
.editor-styles-wrapper H2:first-child,
.editor-styles-wrapper H3:first-child {
  margin-top: 0;
  }  
  
/* GRID BLOCK
------------------------------------------------------------------------ */    
  
.ghostkit-grid {
  padding: 0 40px;
  max-width: 1360px;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box-box;
  }
  
.ghostkit-col-with-bg .nk-awb-rendered {
  margin-right: -40px !important;
  }
  
/* BLOCK COVER
------------------------------------------------------------------------ */     

.wp-block-cover {
  z-index: 10;
  display: block;
  }
  
.wp-block-cover:after {
  content: " ";
  position: absolute;
  width: 100px;
  height: 100px;
  min-height: 100px;
  bottom: 0px;
  left: 50%;
  margin-left: -50px;
  background: url('../img/arrow-down.svg') no-repeat center center;
  animation: upanddown 1s ease-in-out 0s;
  animation-iteration-count: infinite;   
  }  
  
@keyframes upanddown {0%{transform: translateY(0px);} 50%{transform: translateY(-15px);} 100%{top: transform: translateY(0px);}}    

.wp-block-cover .wp-block-paragraph {
  display: none;
  }
  
/* TEXT MEDIA BLOCK
------------------------------------------------------------------------ */    
  
.has-media-on-the-right .wp-block-media-text__content {
  padding-left: 0;
  }
  
/* BLOCK IMAGE
------------------------------------------------------------------------ */    

.wp-block-image.aligncenter {
  margin-left: auto !important;
  margin-right: auto !important;
  }
  
.wp-block-image FIGCAPTION {
  display: none;
  }  
  
/* BLOCK IMAGE
------------------------------------------------------------------------ */  
  
.editor-styles-wrapper UL, 
.wp-block-list {
  margin-bottom: 2em;
  padding-left: 0;
  margin-left: 1em;
  }
  
.editor-styles-wrapper UL:last-child {
  margin-bottom: 0;
  }  
  
/* AKTUELLES 
------------------------------------------------------------------------ */   

MAIN #posts {
  padding: 50px 0;
  }

#posts .swiper {
  overflow: visible;
  }

#posts .swiper-slide {
  height: auto;
  }

#posts .post {
  display: block;
  background: #F5F5F5;
  border-radius: 15px;
  padding: 40px;
  width: 740px;
  font-size: 18px;
  }
  
#posts .post .gallery {
  margin-bottom: 20px;
  overflow: hidden;
  text-align: center;
  }
  
#posts .post .gallery.i1 .swiper-button-next,
#posts .post .gallery.i1 .swiper-button-prev {  
  display: none !important;
  }
  
#posts .post .gallery FIGURE {
  position: relative;
  padding-bottom: 64%;
  background: #d9d9d9;
  margin-bottom: 0;
  }  
  
#posts .post .gallery FIGURE IMG {    
  object-fit: contain;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  }
  
#posts .post .gallery FIGURE.landscape IMG {
  object-fit: cover;
  }
  
#posts .post .date {
  font-size: 14px;
  }  
  
#posts .post .title {
  margin-bottom: 1em;
  text-decoration: underline;
  }    
  
/* SWIPER
------------------------------------------------------------------------ */   
  
.swiper-initialized {
  position: relative;
  }

.swiper-wrapper {
  position: relative;
  }

.swiper-pagination {
  display: block;
  position: relative;
  padding: 50px 0 0 0;
  color: var(--yellow);
  }
  
.swiper-pagination-current {
  color: #3E494C;
  }  
  
.gallery-pagination {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  gap: 10px;
  }  
  
.gallery-pagination.swiper-pagination-bullets .swiper-pagination-bullet {
  border-radius: 0;
  margin: 0;
  background: var(--yellow);
  opacity: 1;
  width: 100%;
  transition: 0.2s;
  }  
  
.gallery-pagination.swiper-pagination-bullets .swiper-pagination-bullet-active {  
  background: #3E494C;
  }
  
.swiper-button-next, 
.swiper-button-prev {
  margin-top: -50px;
  padding: 40px;
  z-index: 2;
  opacity: 0;
  transition: 0.2s;
  }
  
.gallery:hover .swiper-button-next, 
.gallery:hover .swiper-button-prev {  
  opacity: 1;
  }
  
.swiper-button-next:after, 
.swiper-button-prev:after {
  font-family: icomoon !important;
  font-size: 30px;
  content: "\e900";
  color: #fff;
  transition: 0.2s;
  } 
  
.swiper-button-prev:after { 
  transform: scaleX(-1);
  }  
  
.swiper-button-next:hover:after, 
.swiper-button-prev:hover:after {
  color: var(--yellow) !important;
  }
  
.slider-button-next, 
.slider-button-prev {
  position: absolute;
  bottom: -30px;
  left: 50%;
  opacity: 1;
  z-index: 10;
  margin-left: -40px;
  margin-top: -30px;
  padding: 40px;
  z-index: 10;
  transition: 0.2s;
  cursor: pointer;
  } 
  
.slider-button-prev {
  transform: translateX(-320px);
  }
  
.slider-button-next {
  transform: translateX(320px);
  }  
  
.slider-button-next:after, 
.slider-button-prev:after {
  display: block;
  font-family: icomoon !important;
  color: #000;
  content: "\e901";
  font-size: 16px;
  transition: 0.2s;
  }  
  
.slider-button-prev:after { 
  transform: scaleX(-1) !important;
  }   
  
.slider-button-next:hover:after, 
.slider-button-prev:hover:after {
  color: var(--yellow) !important;
  }  

.swiper-button-disabled {
  opacity: 0 !important;
  } 
  
/* ÜBER UNS 
------------------------------------------------------------------------ */       

#ueber-uns FIGURE {
  margin-right: -40px !important;
  margin-bottom: 0 !important;
  }

#ueber-uns IMG {
  display: block;
  }

/* REFERENZEN 
------------------------------------------------------------------------ */    

#references {
  margin: -20px;
  position: relative;
  }
  
#references:after {
  display: table;
  content: " ";
  clear: both;
  }

#references .reference {
  font-size: 18px;
  padding: 20px;
  box-sizing: border-box;
  }
  
#references .reference .title {
  margin-bottom: 1em;
  text-decoration: underline;
  }   
  
#references .reference .gallery {
  margin-bottom: 20px;
  overflow: hidden;
  text-align: center;
  }  
  
#references .reference .swiper-initialized .swiper-wrapper {    
  min-height: 190px;
  background: #d9d9d9;  
  }
  
#references .reference .gallery IMG {  
  display: block;
  }
  
#references .reference .gallery FIGURE {
  position: relative;
  margin-bottom: 0;
  }    
  
#references .reference .gallery FIGCAPTION {
  position: absolute;
  bottom: 0;
  left: 0;
  font-size: 13px;
  background: #3E494C;
  color: #fff;
  padding: 4px 10px 5px 10px;
  opacity: 0;
  transition: 0.2s;
  }  
  
#references .reference .gallery:hover FIGCAPTION {
  opacity: 1;
  }   
  
#references .reference.small {
  width: 25%;
  }  
  
#references .reference.large {
  width: 50%;
  }
  
#references .reference.large + .reference.large {
  margin-top: 374px;
  margin-bottom: 170px;
  }
  
/* IMPRESSUM
------------------------------------------------------------------------ */