assets/js/microgallery/style.css
.extmicrogallery {
text-align: center;
margin: 70px 50px 50px 50px;
}
.extmicrogalleryblock {
margin: 30px 10px 10px 10px;
}
.microGallery {
position: relative;
}
.microGallery img {
margin-left: auto;
margin-right: auto;
border: none;
-moz-box-shadow: 0 2px 4px #777;
-webkit-box-shadow: 0 2px 4px #777;
box-shadow: 0 2px 4px #777;
display: none;
}
.nav {
background-color: #f9f9f9;
position: absolute;
border: 1px solid #fff;
height: 25px;
top: -30px;
left: 5px;
padding: 3px;
-moz-box-shadow: 1px 1px 5px #aaa;
-webkit-box-shadow: 1px 1px 5px #aaa;
box-shadow: 1px 1px 5px #aaa;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.smallGallery .nav {
width: 105px;
}
.mediumGallery .nav {
width: 165px;
}
.largeGallery .nav {
width: 225px;
}
a.thumbview {
opacity: 0.6;
width: 20px;
height: 21px;
float: left;
cursor: pointer;
}
a.grid {
background: transparent url(modules/extgallery/assets/images/microgallery/thumbs.png) no-repeat top left;
}
a.single {
background: transparent url(modules/extgallery/assets/images/microgallery/single.png) no-repeat top left;
}
a.thumbview:hover {
opacity: 1.0;
}
button.prev, button.next {
float: right;
width: 22px;
height: 20px;
cursor: pointer;
opacity: 0.6;
outline: none;
border: none;
}
button::-moz-focus-inner {
border: 0;
}
button.prev:hover, button.next:hover {
opacity: 1.0;
}
.nav button.disabled {
opacity: 0.2;
}
.nav button.disabled:hover {
opacity: 0.2;
}
button.next {
background: transparent url(modules/extgallery/assets/images/microgallery/arrows.png) no-repeat top left;
}
button.prev {
background: transparent url(modules/extgallery/assets/images/microgallery/arrows.png) no-repeat 0 -20px;
}
.images div {
display: table-cell;
vertical-align: middle;
text-align: center;
position: relative;
}
.smallGallery .images,
.mediumGallery .images,
.largeGallery .images {
padding: 10px;
background-color: #f9f9f9;
border: 1px solid #fff;
position: relative;
-moz-box-shadow: 1px 1px 5px #aaa;
-webkit-box-shadow: 1px 1px 5px #aaa;
box-shadow: 1px 1px 5px #aaa;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.smallGallery .images,
.smallGallery .singleImg div {
width: 160px;
height: 160px;
}
.mediumGallery .images,
.mediumGallery .singleImg div {
width: 300px;
height: 300px;
}
.largeGallery .images,
.largeGallery .singleImg div {
width: 600px;
height: 600px;
}
.smallGallery .thumbs div,
.mediumGallery .thumbs div,
.largeGallery .thumbs div {
float: left;
margin: 2px;
cursor: pointer;
}
.smallGallery .thumbs div {
width: 45px;
height: 45px;
}
.mediumGallery .thumbs div {
width: 90px;
height: 90px;
}
.largeGallery .thumbs div {
width: 190px;
height: 190px;
}