reward-widget

reward.css

#reward-list > div.container .rewards .reward {
    display: inline-block;
    margin:0;
    width: calc(33% - 10px);

    padding: 15px;
    
}

#reward-list > div.container .rewards .reward:nth-child(2) {
    margin: 0 20px;
}
#reward-list .rewards .reward .content {
    position:relative;
}
#reward-list .rewards .reward .content .title {
    text-align: center;
    padding: 10px;
    color: #252525!important;
    font-size: 16px;
    font-weight:400;
}

#reward-list .rewards .reward {
    border: none;
}

#reward-list .rewards .reward img {
    width:50%;
    margin:auto;
    display:block;
    border-radius:100%;
    position:relative;
}


#reward-list .rewards .reward:hover img {
    box-shadow: 0 0 0 10px rgba(0,0,0,.05);
}

#reward-list .rewards .reward .content .row .points {
    position:absolute;
    top: -172px;
    left: 0;
    padding: 15px;
    background-color: #FFD200 ;
    color: black!important;
}

#reward-list .rewards .reward .content .row .points p {
    color: black!important;
}


#reward-list .rewards .reward .content .row .ends, #reward-list .rewards .reward .content .row .quantity {
    float:none;
    text-align: center;
}

#reward-list > div.header.ct-header-color {
    background-color: transparent!important;
    border-bottom-color: #DE1F26;
    padding:0;
}

#reward-list > div.header.ct-header-color h3 {
    background-color: #DE1F26;
    width: 200px;
    padding: 0;
    margin:0;
    display: block;
    padding: 10px;
}