.div-gradient-blue{
    width:100%;height:230px;margin-top:30px;margin-left:16px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);border-radius:10px;
    background-image: linear-gradient(-20deg, #b721ff 0%, #21d4fd 100%);
}

.div-gradient-crystaline{
    width:100%;height:230px;margin-top:30px;margin-left:16px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);border-radius:10px;
    background-image: linear-gradient(-20deg, #00cdac 0%, #8ddad5 100%);
}

.div-gradient-blueocean{
    width:100%;height:230px;margin-top:30px;margin-left:16px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);border-radius:10px;
    background-image: linear-gradient(-20deg, #177cc1 0%, #3498db 100%);
}

.div-gradient-jungle{
    width:100%;height:230px;margin-top:30px;margin-left:16px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);border-radius:10px;
    background-image: linear-gradient(45deg, #8baaaa 0%, #ae8b9c 100%);
}

.div-gradient-red{
    width:100%;height:230px;margin-top:30px;margin-left:16px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);border-radius:10px;
    background-image: linear-gradient(to top, #ff0844 0%, #ffb199 100%);
}

.div-gradient-azure {
    width:100%;height:230px;margin-top:30px;margin-left:16px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);border-radius:10px;
    background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
}

.div-gradient-saints {
    width:100%;height:230px;margin-top:30px;margin-left:16px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);border-radius:10px;
    background-image: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
}