pigallery2/frontend/app/gallery/grid/photo/photo.grid.gallery.component.css

img {
    width: inherit;
    height: inherit;
}

.info {
    background-color: transparent;
    color: white;
    font-size: medium;
    position: relative;
    padding: 5px;
    margin-top: -50px;

    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.photo-container {
    width: inherit;
    height: inherit;
    overflow: hidden;
}

.photo-name {
    display: inline-block;
}

.photo-position {
    display: inline-block;
    float: right;
}

a {
    color: white;

}

.photo-keywords {
    margin-top: 5px;
    font-size: small;
    text-align: right;
    display: inline-block;
    width: 100%;
}

.sk-cube-grid {
    width: 100%;
    height: 100%;
}

.sk-cube-grid .sk-cube {
    width: 33%;
    height: 33%;
    background-color: rgba(0, 0, 0, 0.1);
    float: left;
    -webkit-animation: sk-cubeGridScaleDelay 4.6s infinite ease-in-out;
    animation: sk-cubeGridScaleDelay 4.6s infinite ease-in-out;
}

.sk-cube-grid .sk-cube1 {
    -webkit-animation-delay: 2.4s;
    animation-delay: 2.4s;
}

.sk-cube-grid .sk-cube2 {
    -webkit-animation-delay: 2.6s;
    animation-delay: 2.6s;
}

.sk-cube-grid .sk-cube3 {
    -webkit-animation-delay: 2.8s;
    animation-delay: 2.8s;
}

.sk-cube-grid .sk-cube4 {
    -webkit-animation-delay: 2.2s;
    animation-delay: 2.2s;
}

.sk-cube-grid .sk-cube5 {
    -webkit-animation-delay: 2.4s;
    animation-delay: 2.4s;
}

.sk-cube-grid .sk-cube6 {
    -webkit-animation-delay: 2.6s;
    animation-delay: 2.6s;
}

.sk-cube-grid .sk-cube7 {
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
}

.sk-cube-grid .sk-cube8 {
    -webkit-animation-delay: 2.2s;
    animation-delay: 2.2s;
}

.sk-cube-grid .sk-cube9 {
    -webkit-animation-delay: 2.4s;
    animation-delay: 2.4s;
}

@-webkit-keyframes sk-cubeGridScaleDelay {
    0%, 70%, 100% {
        -webkit-transform: scale3D(1, 1, 1);
        transform: scale3D(1, 1, 1);
    }
    35% {
        -webkit-transform: scale3D(0, 0, 1);
        transform: scale3D(0, 0, 1);
    }
}

@keyframes sk-cubeGridScaleDelay {
    0%, 70%, 100% {
        -webkit-transform: scale3D(1, 1, 1);
        transform: scale3D(1, 1, 1);
    }
    35% {
        -webkit-transform: scale3D(0, 0, 1);
        transform: scale3D(0, 0, 1);
    }
}