/* 
    Created on : May 22, 2019, 9:14:35 PM
    Author     : djoluc
*/

djoluc-flexible-grid-layout, [djoluc-flexible-grid-layout]{
    display: flex;
    flex-direction: row;
    flex-flow: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    width: 100%;
    height: auto;
    min-height: calc(80vh - 100px);
    background: transparent;
}


djoluc-flexible-grid-layout > djoluc-item, [djoluc-flexible-grid-layout] > djoluc-item{
    display: inline-block;
    width: 220px;
    height: 220px;
    margin: 20px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    background: rgba(255, 255, 255, 1);
    text-align: center;
}


@media all and (max-width: 400px){
    djoluc-flexible-grid-layout > djoluc-item, [djoluc-flexible-grid-layout] > djoluc-item{
        width: 100%;
    }
}


djoluc-flexible-grid-layout > djoluc-item:hover, [djoluc-flexible-grid-layout] > djoluc-item:hover{
    background: rgba(0, 0, 0, 0.2);
}


djoluc-flexible-grid-layout > djoluc-item > djoluc-icon, [djoluc-flexible-grid-layout] > djoluc-item > djoluc-icon{
    display: block;
    font-size: 120px;
    padding: 0px;
    color: cadetblue;
}


djoluc-flexible-grid-layout > djoluc-item > djoluc-title, [djoluc-flexible-grid-layout] > djoluc-item > djoluc-title{
    color: rgba(0, 0, 0, 0.7);
    font-size: 15px;;
}