SmartGallery-omeka-module/asset/css/style.css

89 lines
1.6 KiB
CSS

wrapper{
max-width: 100%;
margin: 0 auto;
}
.masonry {
-moz-transition: all .5s ease-in-out;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
-moz-column-gap: 30px;
-webkit-column-gap: 30px;
column-gap: 30px;
-moz-column-fill: initial;
-webkit-column-fill: initial;
column-fill: initial;
}
.masonry .brick {
margin-bottom: 30px;
overflow: hidden;
}
.masonry .brick img {
-moz-transition: all .5s ease-in-out;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
.masonry .brick:hover img {
opacity: .75;
}
.masonry.bordered {
-moz-column-rule: 1px solid #eee;
-webkit-column-rule: 1px solid #eee;
column-rule: 1px solid #eee;
-moz-column-gap: 50px;
-webkit-column-gap: 50px;
column-gap: 50px;
}
.masonry.bordered .brick {
padding-bottom: 25px;
margin-bottom: 25px;
border-bottom: 1px solid #eee;
}
.masonry.gutterless {
-moz-column-gap: 0;
-webkit-column-gap: 0;
column-gap: 0;
}
.masonry.gutterless .brick {
margin-bottom: 0;
}
.span {
-moz-column-span: all;
-webkit-column-span: all;
column-span: all;
*margin: 30px 0;
}
@media only screen and (min-width: 1024px) {
.desc {
font-size: 1.25em;
}
.intro {
letter-spacing: 1px;
}
.wrapper {
width: 80%;
padding: 2em;
}
.masonry {
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
}
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
.wrapper {
width: 85%;
padding: 1.5em;
}
.masonry {
-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;
}
}