/*------------------------------------*\
    #instagram 
\*------------------------------------*/

.instagram{
    .heading {
        .heading--icon {
            margin-bottom: 28px;
            line-height: 30px;
            display: inline-block;

            a {
                font-size: 15px;
                font-style: italic;
                color: $color-body;
            }

            i {
                color: $color-black;
                font-size: 30px;
                margin-right: 24px;
                float: left;
            }
        }

        .heading--desc {
            color: $color-body;
            font-size: 12px;
            font-weight: 400;
            line-height: 22px;
            letter-spacing: 5px;
            text-transform: uppercase;
            padding: 0 40px;
        }
        
    }

    .instagram--img {
        position: relative;
        overflow: hidden;
        margin: auto;

        .img--hover {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            width: 100%;
            height: 100%;
            background-color: rgba($color-theme, 0.7);
            @include transition(.3s ease);
            @include prefix(transform,scale(0), moz webkit);
        }

        &:Hover{
            .img--hover {
                @include prefix(transform,scale(1), moz webkit);
           }   
        }   
    }    
}

/* Custom, iPhone Retina */

@media only screen and (min-width: 320px) and (max-width: 767px) {
    .instagram {
        .instagram--img {
            max-width: 340px;
        }
        .heading {
            .heading--desc{
                padding: 0;
            }
        }
    }
}