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

h1, .h1 { font-size: 46px; line-height: 42px; }
h1 strong { font-size: 46px; line-height: 42px; }

    }

#page-body { 
    margin-top:  110px !important;
}



div.thin {
    border-top: 1px dotted;
    color: rgba(255,255,255,0.2);
    margin-top:20px;
    
  }



  #menu.classic nav#main-nav > ul > li > a {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color:#ffffff!important;
}


  #menu.classic nav#main-nav > ul > li > a:hover {
    
    color:#d4ff55!important;
    text-decoration: none;
}

/* Menu line */
nav#main-nav ul > li > a::after, #menu ~ #header-actions-overlay .action-overlay .category-list li a::after { 
    background: #d4ff55 !important; 
}




#hero.hero-fullscreen #page-title {
    margin-top: 0px;
    position: absolute;
    top: 80% !important;
   
   
   
}

#hero.hero-fullscreen #page-title h1 {
   
    font-size: 50px !important;
    line-height: .9em !important;
    font-weight: 400 !important;
    letter-spacing: -3px !important;
   
   
}

#hero.hero-fullscreen #page-title h1 span {
   

color: rgba(255,255,255,0.6) !important;   
   
}




h1, h2, h3
.h1, .h2, .h3, {
    font-family: 'Work Sans'; 
    font-weight: 500;
    letter-spacing: -3px;
    
    }

 


h4, h5, h6,
.h4, .h5, .h6 {
    font-family: 'Work Sans'; 
    font-weight: 300;
    letter-spacing: 0px;
    }

    a:hover {
    color: #d4ff55!important;
}



h1.thumb-hover .overlay-caption .caption-sub, .thumb-hover .overlay-caption .caption-name {
    line-height: .9em !important;
    text-align: left !important;
    font-size: 50px !important;
    font-weight: 400 !important;
    letter-spacing: -3px !important;

}





h3.caption-name.portfolio-name {
    line-height: .9em !important;
    text-align: left !important;
    font-size: 30px !important;
    font-weight: 400 !important;
    letter-spacing: -3px !important;

}

h1.project-title {
    line-height: .9em !important;
    text-align: left !important;
    font-size: 50px !important;
    font-weight: 400 !important;
    letter-spacing: -3px !important;
    color: rgba(255,255,255,0.6) !important; 

}

h2.project-title {
    line-height: 1em !important;
    text-align: left !important;
    font-size: 40px !important;
    font-weight: 400 !important;
    letter-spacing: -2px !important;
    color: rgba(255,255,255,0.6) !important; 

}

h5.small-title {
    line-height: 1em !important;
    text-align: left !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    letter-spacing: -1px !important;
    color: rgba(255,255,255,0.6) !important; 

}


h4.portfolio-name a:hover {
    color: #d4ff55!important;
    text-decoration: none;
}

.lazy-wrapper.loaded .lazy-img img {
    height: auto;
    border-radius: 8px;
}

img {
    height: auto;
    border-radius: 8px;
}



#logo {
    font-size: 20px!important;
    font-weight: 500;
    
    letter-spacing: 8px;
}

h4.introduction {
color: #bbb;
}


#header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
   
}

#header .header-inner {
    width: calc(100% - 200px);
    margin: 0 auto;
    padding: 40px 0 10px 0;
}


ul {

    list-style: none;
}

li.list-heading {
    font-size: 48px; line-height: 48px;
    font-weight: 400;
    color: #bbb;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-title-large {
    font-size: 68px; line-height: 58px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-title-large a {
    font-size: 68px; line-height: 58px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-title-large a:hover {
    font-size: 68px; line-height: 58px;
    font-weight: 400;
    color: #d4ff55;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-see-more-large {
    font-size: 88px; line-height: 77px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-see-more-large a {
    font-size: 88px; line-height: 77px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-see-more-large a:hover {
    font-size: 88px; line-height: 77px;
    font-weight: 400;
    color: #d4ff55;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-heading-medium {
    font-size: 36px; line-height: 26px;
    font-weight: 400;
    color: #6f6f6f;
    list-style-type: none;
    letter-spacing: -1px;

}


li.list-title-medium {
    font-size: 46px; line-height: 36px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-title-medium a {
    font-size: 46px; line-height: 36px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-title-medium a:hover {
    font-size: 46px; line-height: 36px;
    font-weight: 400;
    color: #d4ff55;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-heading-small {
    font-size: 28px; line-height: 24px;
    font-weight: 400;
    color: #6f6f6f;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-heading-tiny {
    font-size: 20px; line-height: 20px;
    font-weight: 400;
    color: #6f6f6f;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-title-tiny a {
    font-size: 20px; line-height: 20px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;
    text-decoration: none;

}


li.list-title-small {
    font-size: 28px; line-height: 24px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;

}

li.list-title-small a {
    font-size: 28px; line-height: 28px;
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;


}


h4.caption-sub.service-description {


    
    font-weight: 400;
    color: #979797;
    list-style-type: none;
    letter-spacing: -1px;
}














.honeypot {

position: absolute; top: 3px; left: -3000px;

}




ul.prevNext {

list-style: none;

    }


ul.footerList {

list-style: none;

    }

ul.footerList li {
text-align:center;

border-bottom: 1px #ccc dotted;
padding: 5px 0px 10px 0;

    }





.divide1 {

height: 1.0em;

    }

.divide2 {

height: 2.0em;

    }

.divide3 {

height: 3.0em;

    }

.divide4 {

height: 4.0em;

}
    
.divide5 {

height: 5.0em;

    }

    .image-caption {

        font-style: italic;
        font-size: 14px;
        color: #8a9197;
    }

        .image-caption-indent {

        font-style: italic;
        font-size: 14px;
        padding-left: 30px;
        color: #8a9197;
    }


.lines {
    position: relative;
}

.line {
    display: block;
    width: 1px;
    height: 0;
    position: fixed;
    background: hsla(0, 0%, 48.6%, .2);
    z-index: -1;
    top: 0;
    pointer-events: none;

}

.line.page-change {
    z-index: 9999
}


.line-1 {
    left: 25%;
}

.line-2 {
    left: 50%;
    bottom: 0;
    top: unset;
}

.line-arange {
    z-index: 4
}

body.layout-dark .line-2::after {
    background: #121212
}

.line-after-out::after {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translate(-50%, -100%);
    -ms-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%)
}

.line-3 {
    left: 75%;
}

.overlay {
    display: block;
    position: fixed;
    background: #0f0f0f;
    height: 0;
    width: 0;
    z-index: -2;
    top: 0;
    -webkit-transition: height .6s cubic-bezier(.645, .045, .355, 1);
    -o-transition: height .6s cubic-bezier(.645, .045, .355, 1);
    transition: height .6s cubic-bezier(.645, .045, .355, 1);
    border-right: 1px solid hsla(0, 0%, 48.6%, .2);
}

body.layout-dark .overlay {
    background: #e1e1e1
}

.overlay-1 {
    left: 0;
}

.overlay-2 {
    left: 25%;
    -webkit-transition-delay: .03333s;
    -o-transition-delay: .03333s;
    transition-delay: .03333s
}

.overlay-3 {
    left: 50%;
    -webkit-transition-delay: .06667s;
    -o-transition-delay: .06667s;
    transition-delay: .06667s
}

.overlay-4 {
    left: 75%;
    -webkit-transition-delay: .1s;
    -o-transition-delay: .1s;
    transition-delay: .1s
}

.overlay-out {
    height: 0;
}

.overlay-ch-out {
    width: 0;
}