.actionables-wrapper {
    margin-bottom: 19px;
}

.actionables-wrapper tr:first-of-type td {
    padding-bottom: 37px;
}

.actionables-wrapper tr:first-of-type td:nth-of-type(2) {
    text-align: left;
    width: 750px;
}

.actionables-wrapper tr:first-of-type td:nth-of-type(3) {
    text-align: right;
    width: 750px;
}

.actionables-wrapper tr:last-of-type td:nth-of-type(2) {
    text-align: left;
}

.actionables-wrapper tr:last-of-type td:nth-of-type(3) {
    text-align: center;
}

.actionables-wrapper tr:last-of-type td:nth-of-type(4) {
    text-align: right;
}

.actionables-wrapper td > a {
    background: rgb(0, 0, 0);
    display: inline-block;
    position: relative;
}

.actionables-wrapper td > a::after {
    background: rgba(0, 0, 0, .7);
    border-radius: 50px;
    content: "Learn More  \f054";
    color: rgb(255, 255, 255);
    font-family: "FontAwesome", "opensans";
    height: 50px;
    left: calc((100% - 170px) / 2);
    line-height: 50px;
    opacity: 0;
    position: absolute;
    text-align: center;
    top: calc((100% - 50px) / 2);
    transition: opacity .3s ease 0s;
    width: 170px;
    z-index: 999;
}

.actionables-wrapper td > a img {
    border: 0;
    margin: 0 -1px -8px;
    opacity: 1;
    padding: 0;
    transition: opacity .3s ease 0s;
}

.actionables-wrapper td > a:hover img {
    opacity: .4;   
}

.actionables-wrapper td > a:hover::after {
    opacity: 1;
}

.facebook-wrapper,
.facebook-wrapper > div {
    height: 298px;
    overflow: hidden;
    width: 501px;
}

@media screen and (max-width: 1500px) {
    .actionables-wrapper tr:first-of-type td:nth-of-type(2),
    .actionables-wrapper tr:first-of-type td:nth-of-type(3) {
        width: 50%;
    }

    .actionables-wrapper td {
        padding: 0 15px;
    }

    .actionables-wrapper td > a img {
        margin: 0 0 -5px;
        max-width: 100%;
    }

    .facebook-wrapper,
    .facebook-wrapper > div {
        height: calc(((100vw - 90px) / 3) * .5662);
        width: calc((100vw - 90px) / 3 - 53px);
    }

    .actionables-wrapper {
        margin: 0 auto 19px;
        width: 90%;
    }
}

/*START CHANGES FOR MOBILE SITE*/
@media screen and (max-width: 1000px) {
    
    .actionables-wrapper tr:first-of-type td, .actionables-wrapper tr:nth-of-type(2) td {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 30px;
    }

    .actionables-wrapper tr:last-of-type td:first-of-type, .actionables-wrapper tr:last-of-type td:last-of-type {
        display: none;
    }

    .actionables-wrapper tr:last-of-type td:nth-of-type(2) {
        display: block;
    }

    .actionables-wrapper tr:first-of-type td:nth-of-type(2), .actionables-wrapper tr:first-of-type td:nth-of-type(3) {
        width: 100%;
        padding: 0;
        text-align: center;
    }

    .actionables-wrapper tr:first-of-type td:first-of-type, .actionables-wrapper tr:first-of-type td:last-of-type {
        display: none;
    }
    
    .facebook-wrapper, .facebook-wrapper > div {
        width: 100%;
        height: auto;
    }
    
    .popular-categories {
        margin: 40px 0;
    }
}

@media screen and (max-width: 900px) {
    
    .banner-cycle .cycle-slide > div {
        width: 100%;
        left: 0;
        text-align: center;
    }
    
    .banner-cycle .cycle-slide > div h3,
    .banner-cycle .cycle-slide > div p    {
        display: none;
    }
    
    .banner-cycle .cycle-slide > div a {
        text-align: center;
    }
}

@media screen and (max-width: 767px) {
    
    h2 {
        line-height: 50px;
    }
}

@media screen and (max-width: 600px) {
    
    .banner-cycle .cycle-slide > div {
        top: 0;
    }
}
/*END CHANGES FOR MOBILE SITE*/