/*
Theme Name: UV collection
Theme URI: http://ultimaverba.com/collection
Author: Olivier Truong
Author URI: http://ultimaverba.com
Description: Simple wordpress theme for preferred albums collection
Text Domain: bsimple
Version: 1.0.0
License: GNU General Public License v2 or later
*/

* {
    margin:0px;
    padding:0px;
}

body {
    font-family:sans-serif;
    color:#fff;
    background-color:#000000;
}
a:link, a:active, a:hover, a:visited {
    color:#fff;
    text-decoration:none;
}

img {
  display: block;
  max-height:200px;
  width: auto;
  height: auto;
}

.mosaic-item {
    position:relative;
    width:10vw;
    height:10vw;
    float:left;
    cursor:pointer;
}

.mosaic-item:hover .mosaic-overlay { display:block; }
.mosaic-item:hover .mosaic-text { display:table; }

.mosaic-image img {
    width:100%;
    height:100%;
    object-fit:cover;
    max-height:unset;
}

.mosaic-image {
    position:absolute;
    width:100%;
    height:100%;
}

.mosaic-overlay {
    display:none;
    position:absolute;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,.75);
}
.mosaic-text {
    display:none;
    position:absolute;
    width:100%;
    height:100%;
}
.mosaic-text span {
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    font-size:.75vw;
    text-transform:uppercase;
    padding:2vw;
}

@media screen and (max-width:1280px) {
    .mosaic-item {
        width:12.5vw;
        height:12.5vw;
    }
    .mosaic-text span {
        font-size:1vw;
    }
}
@media screen and (max-width:960px) {
    .mosaic-item {
        width:25vw;
        height:25vw;
    }
    .mosaic-text span {
        font-size:2vw;
    }
}
@media screen and (max-width:480px) {
    .mosaic-item {
        width:50vw;
        height:50vw;
    }
    .mosaic-text span {
        font-size:4vw;
    }
}