@charset "UTF-8";
/* CSS Document */
.atk-overlay {
    border-radius: 6px;
    padding: 15px!important;
}
.atk-project-intro a:hover {
    text-decoration: none!important;
    color: #20283D!important;
}
.project-intro-wrap {
    padding: 0 0 0 98px;
    box-sizing: border-box;
    position: absolute;
    bottom: 100px;
    left: 50px;
}
.atk-type {
    text-transform: uppercase;
    letter-spacing: .15em;
    margin: 20px 0 5px 0;
    font-weight: 700;
}
.atk-type span::after {
    content: '~';
    margin: 0 10px;
}
.atk-type span:last-of-type::after {
    content: '';

}
.atk-project-intro {
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: 0.03em;
}
.atk-intro-img {
    position: absolute;
    left: 50px;
    top: 10px;
    z-index: 1;
}
.projclient-logo { 
    width: 100%;
}
.project-page {
    padding-top:90px;
}
.three-tall {
    height: 690px;
}
.two-tall {
    height: 590px;
}
.one-tall {
    height: 590px;
}
.anim-img-back {
    position: absolute;
    top:90px;
}
.anim-img-mid {
    position: absolute;
    top:182px;
    margin-left: 108px;
}
.anim-img-front {
    position: absolute;
    top: 330px;
    margin-left: 216px;
}
.three-tall .anim-img-back {
    width: 20%;
}
.three-tall .anim-img-mid {
    width: 25%;
}
.three-tall .anim-img-front {
    width: 30%;
}
.two-tall .anim-img-back {
    width: 35%;
}
.two-tall .anim-img-mid {
    width: 40%;
    top: 128px;
}
.one-tall .anim-img-front {
    width: 40%;
}
.uk-list-divider>:nth-child(n+2) {
    border-top: 1px solid #A8A8A8!important;
    margin-top: 8px!important;
    padding-top: 8px!important;
}

.delay1s {
    animation-delay: 1s;
}
.delay1hs {
    animation-delay: 1.5s;
}
.delay2s {
    animation-delay: 2s;
}
.delay2hs {
    animation-delay: 2.5s;
}
.delay3s {
    animation-delay: 3s;
}
#line-container {
    width: 1px;
    height: 60px;
    position: relative;
    margin: 0 auto 30px;
  
  }
  #line {
    position: absolute;
    width: 2px;
    height: 0px;
    background-color: #000;
    top: 0;
    bottom: initial;
    animation: line-animation 2.5s ease-in-out 0s infinite normal; 
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  #line::before {
    content: ' ';
    width: 16px;
    height: 16px;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    transform: rotate(45deg);
    display: block;
    position: absolute;
    bottom: 0;
    animation: arrow-animation 2.5s ease-in-out 0s infinite normal; 
    opacity: 0;
  }
  @keyframes line-animation {
    0% {height: 0px; top: 0px; opacity: 0;}
    50% {height: 60px; top: 0px; opacity: 1;}
    100% {height: 0px; top: 60px; opacity: 1;}
  }
  
  @keyframes arrow-animation {
    0% {opacity: 0}
    50% {opacity: 1}
    100% {opacity: 1}
  }


  .next-line {
    display: block;
    width: 20%;
    height: 1px;
    background: rgba(0,0,0, 0.2);
    margin: 0 auto;
  }
  .meta-nav span:hover {
    display: block;
    width: 20%;
    height: 1px;
    background: #ADB2C1!important;
    margin: 0 auto;
  }
  .meta-nav {
      text-align: center;
      font-weight: 700;
  }
  .meta-nav-nxt {
    text-align: right;
  }

/*.mason { background: #BD6F88; position: relative; }*/

.mason img, .proj-thumb img {
    padding: 0;
    -webkit-transition: all 1.5s ease;
	-moz-transition: all 1.5s ease;
	-o-transition: all 1.5s ease;
	-ms-transition: all 1.5s ease;
	transition: all 1.5s ease;
}
.mason:hover img {
    border: none;
    padding: 0;
    opacity: .5; 
    transform: scale(1.15);
    filter: blur(7px);
  -webkit-filter: blur(7px);
}
a > .proj-thumb:hover img {
    border: none;
    padding: 0;
    opacity: .5; 
    filter: blur(7px);
  -webkit-filter: blur(7px);
}
.proj-name-hover { 
    display: none; 
    z-index: 1;
    font-size: 1.8rem;
    text-transform: uppercase;
}
.mason:hover .proj-name-hover { 
    display: block; 
    position: absolute; 
    bottom:10px; 
    left: 40px;  
    color: #3C3D44; 
    animation-delay: .6s;
}
#more-proj.uk-accordion {margin: 0 0 1.5em 0; border: none; }
#more-proj .uk-open .uk-accordion-title { display: none; }
#more-proj .uk-accordion-title { font-size: 1.8rem; text-align: center; text-transform: uppercase; padding-bottom: 2px; margin-top:120px; }
#more-proj .uk-accordion-title:hover { border: none; color: #90556C; }
#more-proj .uk-accordion-title::before { display: none; }