@import url("https://use.typekit.net/sxh8tpt.css");

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: heebo, sans-serif;
  background-color: #0b0b0b;
  color: white;
  font-weight: 400;
  letter-spacing: 0.01em;
}



h3{padding: 16px 0px 8px 0px; font-size: 1.6em;}



a {
    cursor: pointer;
    font-size: 18px;
    position: relative;
    white-space: nowrap;
    text-decoration: none;
    color: var(--color-text);
}
a::before,
a::after {
    position: absolute;
    width: 100%;
    height: 1px;
    background: currentColor;
    top: 100%;
    left: 0;
    pointer-events: none;
}

a::before {
    content: '';
    transform-origin: 100% 50%;
    transform: scale3d(0, 1, 1);
    transition: transform 0.3s;
}

a:hover::before {
    transform-origin: 0% 50%;
    transform: scale3d(1, 1, 1);
}

.card:hover .textcard a::before,.section:hover .link a::before {
    transform-origin: 0% 50%;
    transform: scale3d(1, 1, 1);
}

a.noanim::before,
a.noanim::after {height: 0px;top: 0%;}


.homeimage {
  
  height: 100%;
  object-fit: cover;max-width: 100%;
}
.projectimage {
  width: 100%;
  height: 100%;
  object-fit: cover;
  max-height: 200px;
}




.nav-container{display: flex;display:-webkit-flex; justify-content: space-between; align-items: center;  height: 50px;position: relative;margin: 32px 8px 32px 16px;z-index: 20;}
.home .nav-container{position: fixed;width:calc(100% - 16px);}
.nav-container .bm-container {justify-content: right;}
.nav-container .logo {justify-content:left;}

#mu {width: 100%;height: 100%;align-items: center;jujstify-content: center;background-color: #0b0b0b;opacity:0;position: fixed;top: 0;display: none;z-index: 10;}
.mu-inner {margin: auto; text-align: center;}
.mu-inner li{display: block;padding: 16px;}
.mu-inner a {text-decoration: none; color: white; font-size: 1.5em; padding: 8px;text-transform: uppercase;}

#mu.mu-active{opacity: 1; display: flex;}

.home-sticky{position: sticky;margin: 32px 8px -80px 16px}

.bm {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform 400ms;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.bmRotate.active {
  transform: rotate(45deg);
}
.bmRotate180.active {
  transform: rotate(180deg);
}
.line {
  fill:none;
  transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
  stroke:#fff;
  stroke-width:4;
  stroke-linecap:round;
}
.bm1 .top {
  stroke-dasharray: 40 139;
}
.bm1 .bottom {
  stroke-dasharray: 40 180;
}
.bm1.active .top {
  stroke-dashoffset: -98px;
}
.bm1.active .bottom {
  stroke-dashoffset: -138px;
}




.col-6 {display: flex;display:-webkit-flex;flex-wrap: wrap;column-gap: 16px;}
.col-6 .row{flex: 48%;}



.link{margin-bottom: 5%;padding: 36px;background-color: #0000008c;position: absolute;}

.link a {font-size: 2.5vh;font-weight: 900;}


.project{
    display: flex;display:-webkit-flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.card {
    width: 33%;
    margin-bottom: -50px;
}
.textcard {
    padding: 26px;
    position: relative;
    top: -80px;
}

main {
display: flex;display:-webkit-flex;
flex-direction: column;
}

.section {
width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    display: flex;display:-webkit-flex;
    justify-content: center;
    align-items: end;
}
.section:last-of-type {
  height: calc(100vh - 100px);
  align-items: center;
}
/*
section:last-of-type {
  height: calc(100vh - 100px);
  align-items: center;
}*/

main:hover >.btn {opacity: 1;}

main .btn {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  height: 30px;
  width: 30px;
  border-radius: 2px;
  background-color: rgba(0,0,0,0.5);
  background-position: 50% 50%;
  background-repeat: no-repeat;
  z-index: 2;
  opacity: 0;
   transition: opacity 0.4s;
}

main .btn.next {
  background-image: url('data:image/svg+xml;charset=utf-8,<svg width="18" height="18" viewBox="0 0 34 34" xmlns="http://www.w3.org/2000/svg"><title>Shape</title><path d="M25.557 14.7L13.818 2.961 16.8 0l16.8 16.8-16.8 16.8-2.961-2.961L25.557 18.9H0v-4.2z" fill="%23FFF" fill-rule="evenodd"/></svg>');
  right: 16px;
  margin-top: 20px;
  transform: rotate(90deg);
}

main .btn.prev {
  background-image: url('data:image/svg+xml;charset=utf-8,<svg width="18" height="18" viewBox="0 0 34 34" xmlns="http://www.w3.org/2000/svg"><title>Shape</title><path d="M33.6 14.7H8.043L19.782 2.961 16.8 0 0 16.8l16.8 16.8 2.961-2.961L8.043 18.9H33.6z" fill="%23FFF" fill-rule="evenodd"/></svg>');
  right: 16px;
  margin-top: -20px;
  transform: rotate(90deg);
}
main .btn:hover {background-color: rgba(0,0,0,1);}

.boxed {max-width: 1050px;margin: auto;height: 70vh;align-items: center;}

.footer-container, .container {display: flex;display:-webkit-flex;flex-direction: row}

.footer-container {justify-content:space-between;align-items: center;}

.half-col{flex: 50%;}
.container img {width: 100%;height: 90vh;object-fit: cover;}
.container .gallery img {width: 100%;height: auto;margin-bottom:32px;}
.h_iframe iframe {width: 100%;height: 40vh;margin-bottom:32px;}
.content{padding: 16px 48px 16px 48px;}

.content-section{
    max-width: 
    680px;margin: auto;
}
.content-section-full{
    max-width: 1050px;margin: auto;padding-bottom: 40px;
}

.fixed{ overflow: auto;  top: 48px;z-index: -1;
  position: -webkit-sticky;
  position: sticky;}

.contactcenter{   
    align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    min-height: 70vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    position: relative;
    max-width: fit-content;}

h1{font-size: 3em;font-family: heebo, sans-serif;font-weight: 500;line-height: 1.05;padding: 24px 0px;}
p{padding-bottom: 24px;line-height: 1.54;font-size: 15px;}
blockquote{font-size: 3em;font-family: heebo, sans-serif;font-weight: 500;padding: 24px 0px;line-height: 1.05;}


footer {margin: 16px 32px 24px 48px}




  .icon-social{padding: 8px;}
  .icon-social:hover{opacity: 0.8;}


.linetext {  border-bottom: solid 3px #ffffff;  }


@media (max-width: 600px){
.container {flex-direction: column-reverse;;}
.container.boxed {flex-direction: row;}
.fixed{position: initial;}
.half-col{flex: 100%;}
.card{ width: 49%;}
.link{margin-bottom: 20%;}

}

@media only screen and (max-width: 1170px){

  .footer-container{flex-direction: column;}
  .footer-container div:nth-child(2n) {padding:8px 0 40px 0;}
  .boxed {height: 40vh;}
  .col-6 .row{flex: 100%;}
  .section{eight: -webkit-fill-available;}
  .section:last-of-type {height: calc(100vh - 295px);}
.content-section-full {
    max-width: 100%;
    padding: 16px 26px;
}
.content {
    padding: 16px 26px;
}
}


@media only screen and (min-width: 1701px) and (max-width: 2400px) {

.boxed {height: 75vh;}}
@media only screen and (min-width: 2401px) {

.boxed {height: 85vh;}}