/* -------------------- MISC -------------------- */



html{
  font-size:14px;
}
body {
  background: white;
  color:#141414;
  font-family: neue-haas-unica, sans-serif;
  font-weight: 600;
  /*font-weight: 400;*/
  font-style: normal;
  --tile-width: 347px;
  --tile-height: 347px;
}

a, a:focus, a:hover {
  color:black;
  text-decoration:none;
}
p{
  line-height:1.2rem;
}
h1,h2,h3,h4,h5,p,a{
  font-weight:600;
}
h1,h2,h3{
  font-size:1.4rem;
  line-height:1.4rem;
}
h3{
  margin-bottom:0;
}
.project-item h3 {
  font-weight: 400;
  margin-top: 4px;
}

h5{
  font-size:1rem;
  line-height:1.2rem;
}
.hidden-xs{
  display:inherit;  
}
.visible-xs{
  display:none;
}
/* -------------------- HEADER -------------------- */

header{
  background:#FFFFFF;
  padding-top: 12px;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index:555;
}
.logo {
  padding: 15px;
  padding-left: 0px;
  display: inline-block;
}

.logo img{
  height: 60px;
}


/* --- NAVIGATION --- */
.main-nav{
  float: left;
  display: inline-block;
}

.main-nav ul{  
  padding: 0;
  display: inline-block;
}

.main-nav ul li,
.filter-nav li{  
  list-style: none;
  //line-height:1.55rem;
}

.main-nav ul li:last-child{ 
  margin-right: 0px;
} 

.main-nav ul li a,
.filter-nav li a,
.go-back{  
  font-size: 1.4rem;
  line-height:1.4rem;
  font-weight: 600;
  color:#AAAAAA;
  display: inline-block;
}

.main-nav ul li a.active,
.main-nav ul li a:hover,
.filter-nav li a:hover{
  color:black;
}

/* --- SLIDE NAV --- */
#slide_nav{
  display: none;
}

#slide_content{
  background-color: white;
}

.filter-nav{
  padding-left:0;
  margin-left:-9px;
}

.filter-nav li a.active{
  color:black;  
}
/* --- HAMBURGER ANIMATION --- */

.burger-wrapper{
  display: none;
}

.hamburger {
  font: inherit;
  display: inline-block;
  overflow: visible;
  margin: 0;
  cursor: pointer;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
  -webkit-transition-duration: .15s;
  transition-duration: .15s;
  -webkit-transition-property: opacity,-webkit-filter;
  transition-property: opacity,-webkit-filter;
  transition-property: opacity,filter;
  transition-property: opacity,filter,-webkit-filter;
  text-transform: none;
  color: inherit;
  border: 0;
  background-color: transparent;
}

.hamburger-box {
  position: relative;
  display: inline-block;
  width: 35px;
  height: 24px;
}

.hamburger .hamburger-inner, .hamburger .hamburger-inner:after, .hamburger .hamburger-inner:before {
  background-color: #AAAAAA;
}

.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before {
  position: absolute;
  width: 35px;
  height: 2px;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transition-duration: .15s;
  transition-duration: .15s;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  background-color: #AAAAAA;;
}

.hamburger-inner {
  top: 50%;
  display: block;
  margin-top: -2px;
}

.hamburger-inner:before {
  top: -6px;
}

.hamburger-inner:after {
  bottom: -6px;
}

.hamburger-inner:after, .hamburger-inner:before {
  display: block;
  content: "";
}

.hamburger--arrow .hamburger-inner:before{
  background-color: black !important;
}
/*
.hamburger--arrow .hamburger-inner:before {
-webkit-transform: translate3d(-8px,2px,0) rotate(-40deg) scaleX(.7);
transform: translate3d(-22px,2px,0) rotate(-40deg) scaleX(.7);
}

.hamburger--arrow .hamburger-inner:after {
-webkit-transform: translate3d(-8px,-2px,0) rotate(40deg) scaleX(.7);
transform: translate3d(-2px,-18px,0) rotate(40deg) scaleX(.7);
}*/

.banner {
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  width:100%;
  height:40vh;
}





/* -------------------- CONTENT -------------------- */

main {
  margin-top:200px;
  min-height: 20vh;
}

.line{
  margin-top:8rem!important;
  position:relative;
}
.line::before{
  content:'';
  background:black;
  height:4px;
  position:absolute;
  top:-1.5rem;
  left:0;
  width:118px;
}
.grid-row{
  margin-left:-6px;
  margin-right:-6px;
}


.logos-kontakt img {
  max-height: 45px;
}


.dynamic-padding-landing {
  padding-bottom: 40vh;

}

/* -------------------- IMMO -------------------- */
.project-wrapper {
  margin-bottom: 50px;
  cursor: pointer;
}

.project-img {
  position: relative;
  height: 230px;
}

.project-img img {
  height: 230px;
  width: 100%;
  object-fit: cover;
}

.project-img:hover .project-overlay {
  opacity: 1;
  z-index: 10;
}

.project-overlay {
  opacity: 0;
  position: absolute;
  top: 0; 
  right: 0;
  background: rgba(255,255,255,0.8);
  width: 100%;
  height: 100%;
}

.project-overlay .fa-arrow-right {
  transform: rotate(-45deg);
  position: absolute;
  right: 0;
  font-size: 60px;
}

.swiper-button-next, .swiper-button-prev {
  color: black;
}

.swiper-button-next:after, .swiper-button-prev:after {
  font-size: 2rem;
}

.project-item-text {
  display: flex;
  justify-content: space-between;
  cursor: auto;
}

.project-item-text h3 {
  font-size: 1.3rem;
  margin-top: 0.5rem;
  line-height: 1.3rem;
  font-weight: initial;
}

.project-item-text h4 {
  margin: 0.3rem 0 3rem 0;
  font-size: 1.3rem;
  line-height: 1.3rem;
  font-weight: 600;
}

/* -------------------- FOOTER -------------------- */

footer{
  //height:4rem;
}



/* -------------------- BOOTSTRAP 4 MEDIAQUERIES -------------------- */

/* This is the top-down version of bootstrap mediaquery where large desktop is the default (no mediaquery) version */


/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
main {
  margin-top:0px;
}
.hidden-xs{
  display:none;
}
.visible-xs{
  display:inherit;
}


/* --- SLIDE NAV --- */
#slide_nav{
  height: 100%;
  width: 100%;
  display: block;
  background: white;
  position: fixed;
  top: 0;
  right: 0;
}

#slide_content{
  Background: white;
  min-height: 100vh;
  -webkit-transform: translateX(0px);
  transform: translateX(0px);
  -webkit-transition: 0.4s -webkit-transform;
  transition: 0.4s -webkit-transform;
  transition: 0.4s transform;
  transition: 0.4s transform, 0.4s -webkit-transform;
}

#slide_content.open{
  -webkit-transform: translateX(40vw);
  transform: translateY(40vw);
}

#slide_nav.open .side-nav-content{
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";  
}

.side-nav-content{
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  margin: 15px;
  margin-top: 3rem!important;
  font-size: 20px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.side-nav-content .active{
  color: black;
}

.side-nav-content ul{
  color:#AAAAAA;
  font-size:1.55rem;
  padding: 0;
  list-style: none;
}
.side-nav-content a {
  color:#AAAAAA;
}
.side-nav-content a:hover {
  color: white !important;
}

.burger-wrapper{
  display: inline-block;
  position:absolute;
  top:1rem;
  right:1rem;
}

.logo{
  float: right;
}



}


/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
h1,h2,h3{
  font-size:1.3rem;
  line-height:1.3rem;
}


.logo img{
  height: 50px;
}

#slide_content.open{
  -webkit-transform: translateX(70vw);
  transform: translateY(70vw);
}

}



/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {}
@media (min-width: 1200px)
.container {
  max-width: 1190px;
}
@media (min-width: 2000px){
.container {
  max-width: 1300px;
}
}