scroll-text-color-animator { display: block; }

scroll-text-color-animator .page-section{
    overflow: hidden;
    background-color: #2c2c2c;
}

scroll-text-color-animator .page-content{
    /*min-width: 360px;*/

    background: linear-gradient(to right,
        rgba(15,15,15,1) calc(100% * 0 / 6),
        rgba(15,15,15,1) calc(100% * 0 / 6 + 1px),
        rgba(0,0,0,0)    calc(100% * 0 / 6 + 1.1px),

        rgba(0,0,0,0)    calc(100% * 1 / 6 - 1px),
        rgba(15,15,15,1) calc(100% * 1 / 6),
        rgba(0,0,0,0)    calc(100% * 1 / 6 + 1px),

        rgba(0,0,0,0)    calc(100% * 2 / 6 - 1px),
        rgba(15,15,15,1) calc(100% * 2 / 6),
        rgba(0,0,0,0)    calc(100% * 2 / 6 + 1px),

        rgba(0,0,0,0)    calc(100% * 3 / 6 - 1.1px),
        rgba(15,15,15,1) calc(100% * 3 / 6),
        rgba(0,0,0,0)    calc(100% * 3 / 6 + 1px),

        rgba(0,0,0,0)    calc(100% * 4 / 6 - 1px),
        rgba(15,15,15,1) calc(100% * 4 / 6),
        rgba(0,0,0,0)    calc(100% * 4 / 6 + 1px),

        rgba(0,0,0,0)    calc(100% * 5 / 6 - 1px),
        rgba(15,15,15,1) calc(100% * 5 / 6),
        rgba(0,0,0,0)    calc(100% * 5 / 6 + 1px),

        rgba(0,0,0,0)    calc(100% * 6 / 6 - 1.1px),
        rgba(15,15,15,1) calc(100% * 0 / 6 - 1px),
        rgba(15,15,15,1) calc(100% * 6 / 6)
    );
}

scroll-text-color-animator h1,
scroll-text-color-animator h2,
scroll-text-color-animator h3,
scroll-text-color-animator p
{
    color:rgba(15,14,14,0.2);
    background:url('../../img/gold.jpg');
    background-repeat: repeat-x;
    background-size: 750px 750px;
    -webkit-background-clip:text;
    -moz-background-clip:text;
    background-position-y:-750px;
    padding-right: 100px;
    margin-right: -100px;
}

scroll-text-color-animator  h1{
    font-size:120px;
    line-height: 1;
}

scroll-text-color-animator span{
    display: block;
}

scroll-text-color-animator .quote{
    position: relative;
    right: -20px;
}

scroll-text-color-animator .small-quote{
    display: none;
}

scroll-text-color-animator .sub-title{
    font-size:40px;
    margin: 60px 0;
}

scroll-text-color-animator  .scroll-line{
    position: absolute;
    top: 0px;
    left: 0; right: 0;
    border-top: 2px solid #FFD449;
}

@media only screen and (max-width: 980px) {
    scroll-text-color-animator .quote{
        display: none;
    }

    scroll-text-color-animator .small-quote{
        display: inline;
    }
}

@media only screen and (max-width: 768px) {
    scroll-text-color-animator  h1{
        font-size:60px;
    }

    scroll-text-color-animator  h2{
        font-size:30px;
    }
}

@media only screen and (max-width: 430px) {
    scroll-text-color-animator  h1{
        font-size:40px;
    }

    scroll-text-color-animator  h2{
        font-size:20px;
    }

    scroll-text-color-animator .row{
        margin: 0;
    }
}