.project-section h1 {
    margin-bottom: 0.5em;
}

.retro-dg {
    /*background: url(../img/retro-dg.png) no-repeat;*/
    background-size: contain;
    /*min-height: 20em;*/
    position: relative;
    margin-top: 8em;
}
    .retro-dg img {
        width:100%;
    }

.inline-box {
    display: inline-block!important;
}


/*.fixed-frames {
    background: url(../img/fixed-frames.png) no-repeat;
    background-size: contain;
    min-height: 80vh;
    position: relative;
}

.sash-frames {
    background: url(../img/sash-frames.png) no-repeat;
    background-size: contain;
    min-height: 80vh;
    position: relative;
}

.sliding-doors {
    background: url(../img/sliding-doors.png) no-repeat;
    background-size: contain;
    min-height: 80vh;
    position: relative;
}*/

.project-section1 {
    /*height: 100vh;*/
    min-height: calc(90vh - 100px);
    min-height: -o-calc(90vh - 100px); /* opera */
    min-height: -webkit-calc(90vh - 100px); /* google, safari */
    min-height: -moz-calc(90vh - 100px); /* firefox */
    display: flex;
    display: -ms-flexbox;
    flex-direction: column;
    justify-content: center;     
}

.is-vertical-center {
    display: flex;
    display: -ms-flexbox;
    flex-direction: column;
    justify-content: center;
}


.btn-wrap-style2 {
    border: 2px solid #4e4e4e;
    /*height: 50px;*/
    /*line-height: 45px;*/
    font-size: 1.5em;
    padding:4px 0px 0px 0px;
    margin: 30px 20px;
    position: relative;
    /*-webkit-transition: border 1s cubic-bezier(0.19, 1, 0.22, 1), color 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    transition: border 1s cubic-bezier(0.19, 1, 0.22, 1), color 0.6s cubic-bezier(0.19, 1, 0.22, 1);*/
    overflow: hidden;
    cursor: pointer;
    text-align: center;
    
}

    .btn-wrap-style2 a {
        color: #4e4e4e;
        text-decoration: none;
        display: inline-block;
        /*-webkit-transition: border 1s cubic-bezier(0.19, 1, 0.22, 1), color 0.6s cubic-bezier(0.19, 1, 0.22, 1);
        transition: border 1s cubic-bezier(0.19, 1, 0.22, 1), color 0.6s cubic-bezier(0.19, 1, 0.22, 1);*/
        overflow: hidden;
        position: relative;
        z-index: 15;
        text-transform: uppercase;
        font-weight:100;
        width:100%;
    }

    .btn-wrap-style2:hover, .btn-wrap-style2:hover a {
        background-color:white;
        border-color: #b3b3b3;
    }

    /*.btn-wrap-style2 .btn-mask {
        position: absolute;
        display: block;
        width: 61%;
        height: 100px;
        background: #b3b3b3;
        -webkit-transform: translate3d(-120%, -50px, 0) rotate3d(0, 0, 1, 45deg);
        transform: translate3d(-160%, -50px, 0) rotate3d(0, 0, 1, 45deg);
        -webkit-transition: all 1.1s cubic-bezier(0.19, 1, 0.22, 1);
        transition: all 1.1s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .btn-wrap-style2:hover .btn-mask {
        -webkit-transform: translate3d(120%, -100px, 0) rotate3d(0, 0, 1, 90deg);
        transform: translate3d(120%, -100px, 0) rotate3d(0, 0, 1, 90deg);
    }*/

.fixed-frame-before {
    position: relative;
}

    .fixed-frame-before:after {
        content: 'Before';
        position: absolute;
        right: 50%;
        top: 0px;
        font-family:  serif;
        font-size: 3em;
        font-style: italic;
        color: #4e4e4e;
        font-weight: 400;
        margin: 0px;
        margin-bottom: 0.5em;
        padding-bottom: 10px;
        text-shadow: 1.5px 2.598px 3.84px rgba(0, 0, 0, 0.15);
        line-height: 1em;
    }

.fixed-frame-after {
    position: relative;
}

    .fixed-frame-after:before {
        content: 'After';
        position: absolute;
        left: -10%;
        top: 20px;
        font-family:  serif;
        font-size: 3em;
        font-style: italic;
        color: #4e4e4e;
        font-weight: 400;
        margin: 0px;
        margin-bottom: 0.5em;
        padding-bottom: 10px;
        text-shadow: 1.5px 2.598px 3.84px rgba(0, 0, 0, 0.15);
        line-height: 1em;
    }

.sliding-door {
    position: relative;
}

    .sliding-door:before {
        content: 'Before';
        position: absolute;
        left: -10%;
        top: 20px;
        font-family:  serif;
        font-size: 3em;
        font-style: italic;
        color: #4e4e4e;
        font-weight: 400;
        margin: 0px;
        margin-bottom: 0.5em;
        padding-bottom: 10px;
        text-shadow: 1.5px 2.598px 3.84px rgba(0, 0, 0, 0.15);
        line-height: 1em;
    }

    .sliding-door:after {
        content: 'After';
        position: absolute;
        right: 45%;
        bottom: 20px;
        font-family:  serif;
        font-size: 3em;
        font-style: italic;
        color: #4e4e4e;
        font-weight: 400;
        margin: 0px;
        margin-bottom: 0.5em;
        padding-bottom: 10px;
        text-shadow: 1.5px 2.598px 3.84px rgba(0, 0, 0, 0.15);
        line-height: 1em;
    }

.sash-frames {
    position: relative;
}

    .sash-frames:before {
        content: 'Before';
        position: absolute;
        left: -10%;
        top: 20px;
        font-family:  serif;
        font-size: 3em;
        font-style: italic;
        color: #4e4e4e;
        font-weight: 400;
        margin: 0px;
        margin-bottom: 0.5em;
        padding-bottom: 10px;
        text-shadow: 1.5px 2.598px 3.84px rgba(0, 0, 0, 0.15);
        line-height: 1em;
    }

    .sash-frames:after {
        content: 'After';
        position: absolute;
        right: 45%;
        bottom: 20px;
        font-family:  serif;
        font-size: 3em;
        font-style: italic;
        color: #4e4e4e;
        font-weight: 400;
        margin: 0px;
        margin-bottom: 0.5em;
        padding-bottom: 10px;
        text-shadow: 1.5px 2.598px 3.84px rgba(0, 0, 0, 0.15);
        line-height: 1em;
    }
.fixed-frame-animate.animated{
-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.fixed-frame-img.animated{
    animation-delay: 0.3s;
}

.sash-frames-img.animated{
    animation-delay: 0.3s;
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0);
    transform: translate3d(0, 50%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}