/** * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * http://cssreset.com */html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.gallery {
font-size: 0;
text-align: center;
margin: auto;
max-width: 960px;
min-width: 420px;
}
.gallery__item {
position: relative;
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
zoom: 1;
 *display:inline;
width: 30%;
max-width: 300px;
min-width: 200px;
margin: 0 3% 3% 0;
-webkit-box-shadow: 0 10px 10px -10px #333;
box-shadow: 0 10px 10px -10px #333;
}
.gallery__item:hover {
-webkit-box-shadow: 0 0;
box-shadow: 0 0;
}
.gallery__item-cover {
display: none;
}
.gallery__item:hover .gallery__item-cover {
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: url(../img/zoom.png) 50% no-repeat;
background: rgba(255, 255, 255, 0.2) url(../img/zoom.png) 50% no-repeat;
}
.gallery__item-img, .slider__cur-img {
width: 100%;
height: auto !important;
max-width: 100%;
}
.slider {
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: #000;
background: rgba(0, 0, 0, 0.8);
text-align: center;
}
.slider__table {
width: 100%;
height: 100%;
border: 0;
}
.slider__table-td {
text-align: center;
vertical-align: middle;
}
.slider__table-td-inner {
margin: auto;
width: 100%;
max-width: 700px;
}
.slider__table-td-item-number {
font: 700 20px Georgia;
text-align: center;
color: #fff;
margin: -5px 0 5px;
}
.slider__table-td-item-title {
width: 100%;
max-width: 680px;
margin: 5px auto 0;
padding: 0 10px;
font: 16px/1.2 Georgia;
color: #fff;
text-align: left;
}
.slider__btn {
position: absolute;
top: 0;
bottom: 0;
opacity: 0.2;
text-decoration: none;
}
.slider__btn:hover {
text-decoration: none;
opacity: 1;
}
.slider__btn_prev {
left: 0;
width: 50%;
z-index: 10;
border-left: 40px solid transparent;
background: url("../img/arr-left.png") 0 50% no-repeat;
outline: 0;
}
.slider__btn_next {
left: 50%;
right: 0;
z-index: 10;
border-right: 40px solid transparent;
background: url("../img/arr-right.png") 100% 50% no-repeat;
outline: 0;
}
.slider__btn_close {
position: absolute;
top: 0;
right: 0;
padding: 35px;
width: 32px;
height: 32px;
cursor: pointer;
opacity: 0.2;
background: url("../img/close.png") 50% no-repeat;
z-index: 11;
}
.slider__btn_close:hover {
opacity: 1;
}
