.startseite-intro p { 
  font-size: 29px !important;
}


.paragraph--type--image {
  position: relative;
}

.paragraph--type--image .field--name-field-copyright {
  font-size: 12px;
  color: #fff;
  bottom: 25px;
  left: calc(100% - 25px);
  transform: rotate(-90deg);
  transform-origin: left bottom;
  position: absolute;
  white-space: nowrap;
  letter-spacing: 0.01em;
}

.field--name-field-slider {
	position: relative;
}

.field--name-field-slider .field--name-field-copyright {
	position: absolute;
	right: 18px;
	bottom: 60px;
}


 .confirmation-text {
    padding: 50px 36px -10px 36px;
    max-width: 640px;
  }

.webform-confirmation__message {
	padding-bottom: 50px;
}
.webform-confirmation__message p {
	margin-bottom: 0px;

}

.webform-confirmation__message .back {
	max-width: 200px;
	margin: 50px auto;
	display: flex;
	justify-content: center;
}


.webform-confirmation__message .back {
  text-decoration: none;
  background: url(/sites/default/files/button_gold.jpg);
  background-size: cover;
  padding: 5px;
  color: #354b56 !important;
  width: 320px;
  height: 55px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  position: relative;
  font-size: 18px;
  font-weight: 500;
  padding-bottom: 12px;
}

.webform-confirmation__message .back:before { 
  content: "";
  border-bottom: 1px solid #fff;
  position: absolute;
  bottom: 8px;
  left: 0px;
  right: 8px;
}

.webform-confirmation__message .back:after { 
  content: "";
  border-right: 1px solid #fff;
  position: absolute;
  right: 8px;
  bottom: 8px;
  top: 0px;
}

@media (max-width: 1180px) {
	.startseite-intro p { 
  font-size: 22px !important;
}

}

@media (max-width: 1400px) {
 
  
}

@media (max-width: 990px) {
.startseite-intro p { 
  font-size: 19px !important;
}
	
}

@media (max-width: 800px) {
	
	.startseite-intro p { 
  font-size: 17px !important;
}
	
	
  .confirmation-text td{
    width: 100% !important;
    float: left;
  }
  
  .confirmation-text h2 {
    white-space: normal;
  }
  
  .confirmation-text td:nth-child(1) {
    margin-bottom: -10px;
    font-weight: 400;
  }
  
  .confirmation-text td:nth-child(2) {
    display: none;
  }
  
  .webform-confirmation__back {
    max-width: 100% !important;
    margin-left: 36px !important;
  }
  
}

video {
  width: 100% !important;
  height: auto !important;
  margin-bottom: -8px;
  pointer-events: none;
}


.villa1 .layout__region--second .paragraph--type--image,
.villa2 .layout__region--first .paragraph--type--image,
.villa3 .layout__region--second .paragraph--type--image {
	margin-top: 25px;
	margin-bottom: 50px;
	width: 100%;
	max-width: 700px;
}

.villa1 .layout__region--second img,
.villa3 .layout__region--second img {
	max-width: 400px;
}

.villa2 .layout__region--first img {
	max-width: 400px;
	margin-right: 75px;
}

.villa1 .layout__region--second img,
.villa3 .layout__region--second img {
	margin-left: 75px;
	max-width: 400px;
}

.villa1 .layout__region--second .in-sight:after, 
.villa2 .layout__region--first .in-sight:after, 
.villa3 .layout__region--second .in-sight:after {
  display: none;
}

.villa1 .layout__region--second .in-sight:before, 
.villa2 .layout__region--first .in-sight:before, 
.villa3 .layout__region--second .in-sight:before {
  display: none;
}

.villa1 .layout__region--second,
.villa2 .layout__region--first,
.villa3 .layout__region--second{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.villa2 .layout__region--first {
	align-items: flex-end;
}

.villa1-grundrisse,
.villa2-grundrisse,
.villa3-grundrisse{
  max-width: 1400px;
  margin: 50px auto 50px auto;
}

.villa1-grundrisse .layout__region--second,
.villa2-grundrisse .layout__region--second,
.villa3-grundrisse .layout__region--second{
	flex: 0 1 33%;
}

.villa1-grundrisse img,
.villa2-grundrisse img,
.villa3-grundrisse img{
  padding: 0px 50px;
	
}

.villa1-grundrisse .text-formatted,
.villa2-grundrisse .text-formatted ,
.villa3-grundrisse .text-formatted {
	padding-left: 25px;
}

.field--name-field-media-image.in-sight{
  position: relative;
}

.img-left .field--name-field-media-image.in-sight:after {
content: '';
	position: absolute;
	left: 0px;
	width: 0;
	bottom: 15px;
	animation: border_slide 1.5s linear forwards;
}


.img-left .field--name-field-media-image.in-sight:before {
content: '';
	position: absolute;
	right: 15px;
	height: 0;
	bottom: 15px;
	animation: border_up 1.5s linear forwards;
	animation-delay:1.5s;
}

.villen-entspannung .in-sight:before,
.villen-entspannung .in-sight:after{
	display: none;
}


.img-right .field--name-field-media-image.in-sight:after {
content: '';
	position: absolute;
	right: 0px;
	width: 0;
	bottom: 15px;
	animation: border_slide 1.5s linear forwards;
}


.img-right .field--name-field-media-image.in-sight:before {
content: '';
	position: absolute;
	left: 15px;
	height: 0;
	bottom: 15px;
	animation: border_up 1.5s linear forwards;
	animation-delay: 1.5s;
}

.field--name-field-slider.in-sight,
.extra-field--video {
	position: relative;
}

.field--name-field-slider.in-sight:after,
.extra-field--video:after{
content: '';
	position: absolute;
	left: 0px;
	width: 0;
	bottom: 30px;
	animation: border_slide_hero 1.5s linear forwards;
	z-index: 999;

}


.field--name-field-slider.in-sight:before,
.extra-field--video:before {
content: '';
	position: absolute;
	right: 30px;
	height: 0;
	bottom: 30px;
	animation: border_up_hero 1.5s linear forwards;
	animation-delay:1.5s;
		z-index: 999;

}

.extra-field--video:after{
	animation-delay: 18s;
}


.extra-field--video:before{
	animation-delay: 19.5s;
}


.bautraeger-aehnlicheprojekte .field--name-field-media-image {
	position: relative;
}

.bautraeger-aehnlicheprojekte .field--name-field-media-image.in-sight:after {
content: '';
	position: absolute;
	left: 0px;
	width: 0;
	bottom: 15px;
	animation: border_slide 1.5s linear forwards;
}


.bautraeger-aehnlicheprojekte .field--name-field-media-image.in-sight:before {
content: '';
	position: absolute;
	right: 15px;
	height: 0;
	bottom: 15px;
	animation: border_up 1.5s linear forwards;
	animation-delay:1.5s;
}

.bautraeger-aehnlicheprojekte .layout__region--first,
.bautraeger-aehnlicheprojekte .layout__region--second {
	position: relative;
}

.bautraeger-aehnlicheprojekte .paragraph--type--button  {
	position: absolute;
	left: 0px;
	top: 0px !important;
	right: 0px;
	bottom: 0px;
	height: 100%;
	width: 100%;
}

.bautraeger-aehnlicheprojekte .paragraph--type--button a {
	left: 0px;
	position: absolute;
	top: 0px;
	bottom: 0px;
	right: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	background: none;
	text-indent: -9999px;
	font-size: 0px;
}

.bautraeger-aehnlicheprojekte .paragraph--type--button a:before {
	height: 40px;
	width: 160px;
	font-weight: 300;
	font-size: 18px;
	display: flex;
	justify-content: center;
	align-items: center;
	content: "zur Projektseite";
	border-bottom: 0px;
	border-right: 0px;
	right: 15px;
	left: auto;
	top: 50px;
	position: absolute;
	content: "zur Projektseite";
	text-indent: 0px !important;
	pointer-events: none;
	background: url(/sites/default/files/button_gold.jpg);
	background-size: cover;
}

.bautraeger-aehnlicheprojekte .paragraph--type--button a:after {
	display: none;
}

@keyframes border_slide {
	0%{
		width: 0%;
			border-bottom: solid 2px #cea82c;

	}
	100%{
		width: calc(100% - 15px);
			border-bottom: solid 2px #cea82c;

	}
}

@keyframes border_up {
	0%{
			border-right: solid 2px #cea82c;

	}
	100%{
			border-right: solid 2px #cea82c;
		  height: calc(100% - 15px);
	}
}


@keyframes border_slide_hero {
	0%{
		width: 0%;
			border-bottom: solid 2px #cea82c;

	}
	100%{
		width: calc(100% - 30px);
			border-bottom: solid 2px #cea82c;

	}
}

@keyframes border_up_hero {
	0%{
			border-right: solid 2px #cea82c;

	}
	100%{
			border-right: solid 2px #cea82c;
		  height: calc(100% - 30px);
	}
}



.image-style-hero {
  width: 100%;
  animation: move 10s ease-in-out infinite;
animation-direction: alternate;  
	animation-delay: 1.5s ;
	
}

@-webkit-keyframes move {
  0% {

    transform-origin: bottom left;
    transform: scale(1.0);


  }
  100% {
    transform: scale(1.15);
        transform-origin: bottom left;

  }
}