/* lato-300 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/lato-v23-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/lato-v23-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/lato-v23-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/lato-v23-latin-300.woff') format('woff'), /* Modern Browsers */
       url('./fonts/lato-v23-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/lato-v23-latin-300.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-300italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 300;
  src: url('./fonts/lato-v23-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/lato-v23-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/lato-v23-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/lato-v23-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('./fonts/lato-v23-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/lato-v23-latin-300italic.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/lato-v23-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/lato-v23-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/lato-v23-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/lato-v23-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('./fonts/lato-v23-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/lato-v23-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
}

 a[x-apple-data-detectors=true]{
  color: inherit !important;
  text-decoration: inherit !important;
	font-weight:inherit !important;
  }



html, body{
	font-family: 'Lato';
	font-size: 16px;
	margin: 0;
    background-color:#EDEBE7;
	padding: 0;
	position: relative;
	line-height: 1.4em;
    overflow-x: hidden;
    width: 100vw;
	color: #707070;
	letter-spacing:0em;
	font-weight: 300;
	font-style: normal;
-webkit-tap-highlight-color:  rgba(255, 255, 255, 0); 
}



::selection {
    color: #ffffff;
    background: #707070;
}

a{color:#1d1d1b;text-decoration: none;font-weight: 400;transition: color .2s}
header a:hover, footer a:hover{color:#707070}

img{max-width: 100%}
.dark a{color:#ffffff}
.dark a:hover{color: #707070}

header, footer{z-index: 1;padding: 2em 0;position: relative}

.desktop{display:block !important}
.mobile{display:none !important}
#navigation{float: left}
#navigation a{margin-right: 3em}
#logo{float: right}
#logo img{height: 2.7em}
.logo-white{display:none;}
.logo-dark{display:inline-block;}
.dark .logo-white{display: inline-block;}
.dark .logo-dark{display:none;}

.container{margin: auto;display: inline-block;width: 1440px;margin-left: calc(50vw - 720px)}

header .container, footer .container{width:calc(100% - 6em);margin-left:3em}

.full{width: 100%;overflow: scroll;position: realtive;display: inline-block;}
#content{min-height: calc(100vh - 14em);}
/*start*/
#start-slideshow{width: 100vw;height: 100vh;position:relative;top: 0;left: 0;z-index: 0;margin-top: -7.6em;
    margin-bottom: -5.8em;;}

.start-slideshow-space{height:calc(100vh - 4em);width: 100%;float: left;}
.start-slideshow-images{width: 100%;height: 100%;position: absolute;top: 0;left: 0}
#start-slideshow .start-slideshow-img{position: absolute;top: 0;line-height:0;left: 0;width: 100%;height: 100%;object-fit: cover;object-position: center;opacity: 0;pointer-events:none;transition: opacity .5s ease-in-out}
#start-slideshow .start-slideshow-img:first-of-type{opacity: 1;pointer-events:auto;}

#start-slideshow .start-slideshow-img img{width: 100%;height: 100%;object-fit: cover;object-position: center;}


/*work*/
#work-overview{display: inline-block;}

.work-overview-row{width: 30%;display: inline-block;float: left;}
.work-overview-row-1, .work-overview-row-3{margin-top: 1em}
.work-overview-row-2{margin-left: 5%;margin-right: 5%;margin-top: 1em}

.work-overview-row a, .cat-overview-row a{margin-bottom:3em;display:inline-block;}
.work-overview-cat{width: 100%;margin-bottom: 1em;position: relative;overflow: hidden;line-height:0;}
.work-overview-cat img{transition: transform .3s}
.work-overview-cat:hover img{transform: scale(1.05)}

.work-overview-cat-overlay{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;background-color: rgba(255, 255, 255, 0.3);transition: opacity .3s;}
.work-overview-cat-overlay:hover{opacity: 1}
.work-overview-cat-overlay-title {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* height: 100%; */
    vertical-align: center;
    text-align: center;
    display: inline-block;
	line-height:1.2em;
    text-transform: uppercase;
    top: calc(50% - 0.7em);
}

.work-overview-under-title{
	width:100%;
	text-align:center;
	margin-top:0em;
	margin-bottom:0em;
	font-style: italic;
	font-weight:300;
}

.work-overview-under-title-inactive{
	font-style:normal;
}

.cat-name{}
.cat-other{opacity:0.5}
.cat-other:after{content:" | "}
.cat-other:hover{opacity:1}
/*.cat-revitalisierung{color:#fdc800}*/

/*cat*/
#cat-overview{display: inline-block;width:100%}

.cat-overview-row{width: 30%;display: inline-block;float: left;}
.cat-overview-row-1{margin-top: -3em}
.cat-overview-row-2{margin-left: 5%;margin-right: 5%;margin-top: 0em}
.cat-overview-row-3{margin-top: -3em}
.cat-overview-cat{width: 100%;margin-bottom: 3em;position: relative;overflow: hidden;}
.cat-overview-cat img{transition: transform .3s}
.cat-overview-cat:hover img{transform: scale(1.03)}

.cat-head{width: 100%;font-weight: 400;text-align: center;margin-top: 2em;text-transform: uppercase;color:#1d1d1d}
.cat-sub{width: 100%;font-weight: 300;font-style: italic;margin-bottom: 3em;text-align: center}



/*single*/

.overlay-box{opacity: 0;display:none;pointer-events: none;background-color: rgba(237, 235, 231, 0.9);z-index: 4;width: 100vw;height: 100vh;position: fixed;top: 0;left: 0;transition: opacity .3s}
.overlay-box-active{opacity: 1;pointer-events: auto}

.overlay-box-arrow{position: absolute;top: calc(50% - 1em);border-left:2px #707070 solid;width: 1.4em;height: 1.4em;border-top:2px #707070 solid;cursor: pointer}
.overlay-box-arrow-left{left: 5em;transform: rotate(-45deg);}
.overlay-box-arrow-right{right: 5em;transform: rotate(135deg);}

.overlay-box-close{position: absolute;top:5em;;cursor: pointer;right: 5em;width: 2em;height: 2em;}
.overlay-box-close-inner {
    position: absolute;
    transform: rotate(
45deg);
    border-left: 2px #707070 solid;
    width: 0.8em;
    height: 0.8em;
    top: 1em;
    border-top: 2px #707070 solid;
    cursor: pointer;
    left: 0.5em;
}
.overlay-box-close-inner:before{position: absolute;content: "";top:calc(-0.8em - 2px);left:calc(-0.8em - 2px);border-right:2px #707070 solid;width: 0.8em;height: 0.8em;border-bottom:2px #707070 solid;cursor: pointer}

.overlay-box-image {
    position: absolute;
    width: calc(100% - 18em);
    left: 9em;
    top: 3em;
    height: calc(100% - 9em);
    transition: opacity .2s;
	cursor:pointer;
}
.overlay-box-image img{width: 100%;height: 100%;object-fit: contain;}
.overlay-box-bu {
    width: calc(100% - 20em);
    margin-left: 10em;
    top: calc(100% - 5em);
    position: absolute;
    text-align: center;
    transition: opacity .2s
}

.single-content{width: 50%;margin: 2em 25%}
.single-head{width: 100%;text-align: center;font-weight: 400;text-transform: uppercase;color:#1d1d1d;margin-top:1em;margin-bottom:1em;display:inline-block;}
.single-sub{width: 100%;text-align: center;font-style: italic;margin-bottom: 4em;}

.single-desc{text-align: center;margin-bottom: 4em;}
.single-desc a {
    font-weight: 300;
    font-style: italic;
    margin-bottom: -2em;
    position: relative;
    display: block;
}
.single-desc a:after{content:" >"}
.single-cat-sub {
    font-style: italic;
    position: absolute;
	    left: 3em;
    top: 4em;
    z-index: 3;
}
.read-more{cursor: pointer;padding-top: 0em;overflow: hidden;font-weight: 300;font-style:italic;height: 1.4em;transition: height .2s;margin-top:1em;}
.single-desc-more{height: 0;overflow: hidden;transition: height .2s;margin-bottom:1em;}

.single-tags{width: 100%;margin-bottom: 2em;margin-top:1em;display: inline-block}
.single-tags-center-text{font-weight:300 !important;}

.single-tags-read-more{width:100%;text-align:center;cursor: pointer;padding-top: 0em;overflow: hidden;font-weight: 300;font-style:italic;height: 1.4em;transition: height .2s;}
.single-tags-bottom{height: 0;margin-bottom:2em;overflow: hidden;transition: height .2s;display:inline-block;}

.single-tags-left-row{width: 100%;display: inline-block;}
.single-tags-left{max-width: 10%;float: left;}
.single-tags-left-title{width: 100%;font-weight: 400;color:#1d1d1d}
.single-tags-left-text{width: 100%;}

.single-tags-center{max-width:calc(40% - 3em);float:left;display:inline-block;margin-left:3em;width:auto;}
.single-tags-right{max-width:calc(50% - 3em);float:left;display:inline-block;margin-left:3em;width:auto;}
.single-tags-right-title{width:100%;font-weight:300;}


.single-images{width: 100%;display: inline-block;}
.single-images-row{width: calc(25% - 0.4em);float: left}
.single-images-row-1{margin-right: 0.5em}
.single-images-row-2{margin-right: 0.5em}
.single-images-row-3{margin-right: 0.5em}
.single-images-row-full {
    width: 50%;
    margin-left: 25%;
}
.single-images-row-half{width:calc(25% - 0.25em)}
.single-images-row-third:first-of-type{margin-left:12.5%}
.single-images-row-third {
    width: calc(25% - 0.5em);
    margin: 0 0.25em;
}
.single-images-row-half:first-of-type{margin-right:0.5em;margin-left:25%}
.single-images-row-full img, .single-images-row-half img{width:100%;}
.single-images-row-image, .single-images-row-image-mobile{display: block;cursor: pointer;overflow: hidden;margin-bottom: 0.5em;line-height: 0;}
.single-images-row img{transition: transform .3s}
.single-images-row img:hover{transform: scale(1.03);}

.single-images-bu{display: none;height: 0;overflow: hidden;transition: all .2s}

.single-related{margin-top: 5em;margin-bottom: 1em;font-weight:400;color:#1d1d1d;text-align:center;font-style:italic;font-weight:400}

.more-projects-projekte{display:none}

/*.revitalisierung .more-projects-projekte{display:inline-block;}*/

.single-related-container {
    width: max-content;
    min-width: 100vw;
    height: 9em;
    overflow: hidden;
    text-align: center;
}

.single-related-image{height: 9em;width: unset;
    margin-bottom: 0;display:inline-block;margin-right: 0.5em}

.single-related-image:last-of-type{margin-right:0;}

.single-related-image img{height: 100%;}

.single-overview-cat-overlay-title {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* height: 100%; */
    vertical-align: center;
    text-align: center;
    display: inline-block;
    text-transform: uppercase;
	font-size:0.7em;
	line-height:1.3em;
    top: calc(50% - 0.7em);
}

.industriebauten .more-projects-projekte{display:none}

/*bio*/
#bio{padding-top:3em}

.bio-vita-text{}
.bio-vita{width: 66.6%;margin-left: 16.67%;margin-bottom: 8em;text-align: center;}
.bio-vita-head{font-weight: 400;margin-top:0em;margin-bottom: 1em;color:#1d1d1d}

.bio-zitat{text-align:center;margin-bottom: 8em;display:inline-block;width:100%;}
.bio-zitat-head{display:inline-block;width:100%;font-size:1em;line-height:1.4em;color:#1d1d1d}
.bio-zitat-text{font-style:italic;width:100%;margin-top:0em;color:#1d1d1d;font-size:1em;line-height:1.4em}

.bio-statement-image{margin-left: 8.33%;margin-top: 0em;width: 25%;margin-right: 8.33%;display: inline-block;vertical-align: top;}
.bio-statement{width: 50%;display: inline-block;}
.bio-statement-head{font-weight: 400;margin-bottom: 2em;color:#1d1d1d}

/*kontakt*/

.kontakt-text{margin-top: 5em;width: 50%;margin-left: 25%;min-height: calc(100vh - 19em)}
.kontakt-text-head{font-weight: 400;color:#1d1d1d}
.kontakt-text-sub{font-style: italic}

.kontakt-text a{font-weight:300;font-style:italic;}

/*imprint*/

.imprint-text{margin-top: 3em;width: 83.33%;margin-left: 8.33%}
.imprint-head{font-weight: 400;margin-bottom:1em}

/*footer*/
#footer-links{float: left}
#footer-links a{vertical-align: top}



.footer-icon{height: 1.1rem;padding-top: 0.1em;margin-right: 0.2em}

.back-to-top {
    display: inline-block;
    position: fixed;
    cursor: pointer;
    float: right;
    bottom: 2.3em;
    right: 2em;
}

.back-to-work {
    display: inline-block;
    position: fixed;
    cursor: pointer;
    float: right;
    bottom: 2.3em;
    right: 4em;
	display:none;
}

.back-to-top .footer-icon, .back-to-work .footer-icon{
	height:1.6em;
}






/*media querys*/
@media (max-width: 1600px){

    .container{margin: auto;display: inline-block;width: 1140px;margin-left: calc(50vw - 570px)}
/*header .container{width:calc(100% - (50vw - 570px) - 3em);margin-left:calc(50vw - 570px)}*/
    .single-content {
    width: 60%;
    margin: 2em 20%;
}
	
	
}


@media (max-width: 1280px){
        html, body{
    font-size: 16px;
    line-height: 1.4em;
}

.single-content {
    width: 70%;
    margin: 2em 15%;
}

    .container{margin: auto;display: inline-block;width: 960px;margin-left: calc(50vw - 480px)}
	/*header .container{width:calc(100% - (50vw - 480px) - 3em);margin-left:calc(50vw - 480px)}*/

	
}

@media (max-width: 1024px){
            html, body{
    font-size: 15px;
    line-height: 1.4em;
}


    .container{margin: auto;display: inline-block;width: 720px;margin-left: calc(50vw - 360px)}
	header .container{width:calc(100% - (50vw - 360px) - 3em);margin-left:calc(50vw - 360px)}
	

}

@media (max-width: 768px){
            html, body{
    font-size: 15px;
    line-height: 1.4em;
				min-height:100vh;
}
	
	.desktop{display:none !important}
.mobile{display:inherit !important;width:100%;}
	.work-overview-cat img, .mobile img{width:auto}
	
	.work-overview-row a, .cat-overview-row a {

		width: 100%;}
		
		
   header .container, .container{margin: auto;display: inline-block;width: 90%;margin-left: 5%}

    #navigation{float: right;margin-top: 2em;width: 100%;text-align: center}
    #logo{float: left;
    width: calc(84% + 1.7em);
    text-align: right;}
    #logo img{height: 2.6em}
   #navigation a {
    margin-right: 1.5em;
    margin-left: 1.5em;
    display: inline-block;
    width: 33.3%;
    position: relative;
    margin: 0;
    padding: 0;
    float: left;
}

    #start-slideshow {
    margin-top: -10em;
    margin-bottom: -4.8em;
}


.work-overview-row, .cat-overview-row{width: 100%;margin: 0}
.work-overview-cat-overlay{opacity: 1;    line-height: 1.4em;}
.work-overview-cat:hover img{transform: scale(1)}
.work-overview-cat-overlay {
    position: relative;
    background-color: rgba(237, 235, 231, 0);
}

.work-overview-cat-overlay-title {
    position: relative;
    margin-top: 0.8em;
	line-height:1.3em;
}
	
	.single-desc a {
    font-weight: 300;
    font-style: italic;
    margin-bottom: -2em;
    margin-top: 2.5em;
    position: relative;
    display: block;
}

.single-content {
    width: 100%;
    margin: 4em 0 2em 0%;
}

.single-tags-left {
    width: 40%;
	max-width:40%;
    float: left;
}
	
	.single-desc br {
  display: none;
}
	.single-tags-center{max-width:60%;width:60%;margin-left:0}
	
	.single-tags-right{width:100%;margin-left:0;max-width:100%;}

.single-tags-right {
    width: 100%;
    margin-top: 1em;
    text-align: left;
}

.single-images-row {
    width: 100%;
    float: left;
}
	
	.single-desc{text-align:left;width:80%;margin-left:10%}
	
.single-images-row img:hover{transform: scale(1);}
.single-images-bu {
    display: inline-block;
    height: auto;
    overflow: unset;
	width:100%;
	font-weight:300 !important;
	text-align:center;
    line-height: 1.4em;
    margin-top: 0.3em;
}
	
	
	.single-images-row-image, .single-images-row-image-mobile {
    margin-bottom: 0.8em;
}

.overlay-box-active{display: none;opacity: 0;pointer-events: none;}

.single-cat-sub {
    font-style: italic;
    position: relative;
    top: 0;
    z-index: 3;
    text-align: center;
    display: block;
	left:0;
    margin-top: -2em;
    margin-left: 0;
    width: 33.3%;

}
	.cat-other{display:block}
	.cat-other:after{content:""}

	#bio{padding-top:3em;}
.bio-vita{margin: 4em 0 6em  0;width: 100%;}

.bio-statement-image{margin:0 0 2em 0;width: 100%;}
.bio-statement{margin:0;width: 100%;}

.kontakt-text, .imprint{margin-left: 0;width: 100%}
	
	.footer-icon {
    height: 1.5rem;
    padding-top: 0.1em;
    margin-right: 0.2em;
}
	#footer-links a {
    vertical-align: middle;
}
.back-to-top {
    margin-bottom: 0;

    vertical-align: middle;
    position: fixed;
    bottom: 0.8em;
    right: 1.5em;
}
	
	
	.back-to-work {
		margin-bottom: 0;
    display:inline-block;
    vertical-align: middle;
    position: fixed;
    bottom: 0.8em;
    right: 3.5em;
	}
		
		
		
	footer {
    z-index: 1;
    padding: 2em 0 0.5em 0;
    position: relative;
}
	
	#footer-links {
    float: left;
    margin-left: -1.2em;
}
	.dark #footer-links {
    float: left;
    position: fixed;
    bottom: 0.8em;
		margin-left:0;
    left: 1.7em;
}



}