/*==================================================
COMMUNITIES WE SPECIALIZE IN
==================================================*/

.communities-specialize{
    padding:90px 0;
    background:#F9F6F1;
    border-top:1px solid #EFE7DC;
    border-bottom:1px solid #EFE7DC;
}

.communities-specialize .container{
    width:min(1500px,92%);
    margin:auto;
}

/*==================================================
HEADING
==================================================*/

.communities-specialize .section-heading{
    margin-bottom:40px;
}

.communities-specialize .section-subtitle{

    display:inline-block;

    color:#333;

    font-size:14px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

}

/*==================================================
GRID
==================================================*/

.communities-grid{

    display:grid;

    grid-template-columns:repeat(8,1fr);

    border:1px solid #ECE3D8;

    background:#fff;

}

/*==================================================
BOX
==================================================*/

.community-box{

    text-align:center;

    padding:35px 15px;

    border-right:1px solid #ECE3D8;

    transition:.35s ease;

    cursor:pointer;

}

.community-box:last-child{

    border-right:none;

}

.community-box:hover{

    background:#FCF8F3;

}

/*==================================================
ICON
==================================================*/

.community-icon{

    width:65px;

    height:65px;

    margin:0 auto 18px;

    display:flex;

    align-items:center;

    justify-content:center;

}

.community-icon i{

    font-size:42px;

    color:#C79658;

    transition:.3s;

}

.community-box:hover .community-icon i{

    transform:translateY(-5px);

}

/*==================================================
TEXT
==================================================*/

.community-box h3{

    font-size:15px;

    font-weight:600;

    color:#222;

    line-height:1.5;

    min-height:44px;

}

/*==================================================
LINE
==================================================*/

.community-box span{

    display:block;

    width:28px;

    height:2px;

    background:#C79658;

    margin:18px auto 0;

    transition:.3s;

}

.community-box:hover span{

    width:50px;

}

/*==================================================
TABLET
==================================================*/

@media(max-width:1200px){

    .communities-grid{

        grid-template-columns:repeat(4,1fr);

    }

    .community-box{

        border-bottom:1px solid #ECE3D8;

    }

}

@media(max-width:768px){

    .communities-grid{

        grid-template-columns:repeat(2,1fr);

    }

    .community-box{

        padding:28px 12px;

    }

    .community-icon i{

        font-size:34px;

    }

}

@media(max-width:480px){

    .communities-specialize{

        padding:70px 0;

    }

    .community-box h3{

        font-size:13px;

    }

}

/*==================================================
ANIMATION
==================================================*/

.hidden{
    opacity:0;
    transform:translateY(40px);
    transition:.7s ease;
}

.show{
    opacity:1;
    transform:translateY(0);
}