IMPORTANT
Due to a BUG with the gallery element, DO NOT add several galleries in the SAME page with Oxygen 2.0.
This page is just an example but it's buggy and you can't have different layout or settings for each gallery.
#_gallery-6-86.oxy-gallery .oxy-gallery-item:hover {
transform:scale(1.2,1.2);
border-radius:10px;
z-index:100;
box-shadow: 0px 10px 30px -6px rgba(0,0,0,0.36);
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(0); /* Google Chrome, Safari 6+ & Opera 15+ */
filter: grayscale(0); /* Microsoft Edge and Firefox 35+ */
}
#_gallery-6-86.oxy-gallery .oxy-gallery-item {
z-index:50;
transition:0.3s ease all!important;
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
}#_gallery-14-86.oxy-gallery .oxy-gallery-item {
opacity:1;
}
#_gallery-14-86.oxy-gallery .oxy-gallery-item:hover figure {
transform:scale(1.5,1.5) rotate(-10deg);
opacity:0.1;
}
#_gallery-14-86.oxy-gallery .oxy-gallery-item figure {
transition:0.3s ease all;
}#_gallery-22-86.oxy-gallery-captions .oxy-gallery-item .oxy-gallery-item-contents figcaption:not(:empty) {
display:flex!important;
justify-content:center;
align-items:center;
height:100%;
background-color:rgba(255,82,82,0.90);
transform:rotate(-10deg);
}
#_gallery-22-86.oxy-gallery .oxy-gallery-item figure {
transition:0.3s ease all;
}
#_gallery-22-86.oxy-gallery .oxy-gallery-item:hover figure {
transform:scale(1.5,1.5) rotate(10deg);
}#_gallery-25-86.oxy-gallery .oxy-gallery-item .oxy-gallery-item-contents figcaption:not(:empty) {
display:flex!important;
justify-content:center;
align-items:center;
height:100%;
background-color:rgba(0,0,0,0.90);
transform:translateY(100%);
transition:0.5s ease all;
}
#_gallery-25-86.oxy-gallery .oxy-gallery-item:hover .oxy-gallery-item-contents figcaption:not(:empty) {
transform:translateY(0);
}