/*******************************************************
 *
 * General
 *
 *******************************************************/

 /* FEATURED COMMUNITIES */
#hp-communities {
padding: 85px 0 105px;
font-size: 0;
}
#hp-communities .section-title {
    text-align: center;
    margin-bottom: 78px;
}
    .fc-list {
        font-size: 0;
    }
        a.fc {
            display: inline-block;
            vertical-align: top;
            position: relative;
            width: 33.333333%;
        }

            a.fc:before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: #111111;
                opacity: .35;
                -webkit-transition: background .3s, opacity .3s;
                -o-transition: background .3s, opacity .3s;
                transition: background .3s, opacity .3s;
            }
                a.fc:hover:before {
                    background: #111111;
                    opacity: .7;
                }
            .fc canvas {
                display: block;
                width: 100%;
                background-size: cover;
                background-position: center;
            }
            a.fc .fc-details {
                position: absolute;
                left: 0;
                right: 0;
                top: 50%;
                transform: translateY(-50%);
                font-size: 29px;
                font-weight: 600;
                letter-spacing: .02em;
                color: #fff;
                text-transform: uppercase;
                text-align: center;
                z-index: 2;
                text-shadow: -2px 2px 3px #000;
                -webkit-transition: 0.3s all ease-in-out;
                -o-transition: 0.3s all ease-in-out;
                transition: 0.3s all ease-in-out;
            }
            a.fc:hover .fc-details{
                text-shadow: 0 0 0 rgba(0,0,0,0);
            }
    #hp-communities .site-button {
        margin: 80px auto 0;
    }


#ip-communities {
    padding: 30px 0;
}

#content .page-links {
    margin-top: 30px;
    margin-bottom: 30px;
}
    #content .page-links a:hover{
        color: var(--primary-color)
    }

/*******************************************************
 *
 * Mobile styles and other media queries
 *
 *******************************************************/

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

@media only screen and (max-width: 1366px) {
    
}
 
@media only screen and (max-width: 1199px) {
    
}

@media only screen and (max-width: 991px) {
    a.fc {
        width: 50%;
    }

    .fc-list {
        padding: 0 15px;
    }
    
    a.fc {
        display: block;
        width: 550px;
        max-width: 100%;
        margin: 0 auto;
    }
    
    a.fc + a.fc {
        margin-top: 15px;
    }
} 

@media only screen and (max-width: 767px) {
    a.fc {
        width: 100%;
    }
}

@media only screen and (max-width: 480px) {
    #content .archive-title{
        letter-spacing: normal;
    }
} 