1/*! Swipebox v1.3.0 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */
2html.swipebox-html.swipebox-touch {
3  overflow: hidden !important;
4}
5
6#swipebox-overlay img {
7  border: none !important;
8}
9
10#swipebox-overlay {
11  width: 100%;
12  height: 100%;
13  position: fixed;
14  top: 0;
15  left: 0;
16  z-index: 99999 !important;
17  overflow: hidden;
18  -webkit-user-select: none;
19     -moz-user-select: none;
20      -ms-user-select: none;
21          user-select: none;
22}
23
24#swipebox-container {
25  position: relative;
26  width: 100%;
27  height: 100%;
28}
29
30#swipebox-slider {
31  -webkit-transition: -webkit-transform 0.4s ease;
32          transition: transform 0.4s ease;
33  height: 100%;
34  left: 0;
35  top: 0;
36  width: 100%;
37  white-space: nowrap;
38  position: absolute;
39  display: none;
40  cursor: pointer;
41}
42#swipebox-slider .slide {
43  height: 100%;
44  width: 100%;
45  line-height: 1px;
46  text-align: center;
47  display: inline-block;
48}
49#swipebox-slider .slide:before {
50  content: "";
51  display: inline-block;
52  height: 50%;
53  width: 1px;
54  margin-right: -1px;
55}
56#swipebox-slider .slide img,
57#swipebox-slider .slide .swipebox-video-container,
58#swipebox-slider .slide .swipebox-inline-container {
59  display: inline-block;
60  max-height: 100%;
61  max-width: 100%;
62  margin: 0;
63  padding: 0;
64  width: auto;
65  height: auto;
66  vertical-align: middle;
67}
68#swipebox-slider .slide .swipebox-video-container {
69  background: none;
70  max-width: 1140px;
71  max-height: 100%;
72  width: 100%;
73  padding: 5%;
74  -webkit-box-sizing: border-box;
75          box-sizing: border-box;
76}
77#swipebox-slider .slide .swipebox-video-container .swipebox-video {
78  width: 100%;
79  height: 0;
80  padding-bottom: 56.25%;
81  overflow: hidden;
82  position: relative;
83}
84#swipebox-slider .slide .swipebox-video-container .swipebox-video iframe {
85  width: 100% !important;
86  height: 100% !important;
87  position: absolute;
88  top: 0;
89  left: 0;
90}
91#swipebox-slider .slide-loading {
92  background: url(../img/loader.gif) no-repeat center center;
93}
94
95#swipebox-bottom-bar,
96#swipebox-top-bar {
97  -webkit-transition: 0.5s;
98          transition: 0.5s;
99  position: absolute;
100  left: 0;
101  z-index: 999;
102  min-height: 50px;
103  width: 100%;
104}
105
106#swipebox-bottom-bar {
107  bottom: -50px;
108}
109#swipebox-bottom-bar.visible-bars {
110  -webkit-transform: translate3d(0, -50px, 0);
111          transform: translate3d(0, -50px, 0);
112}
113
114#swipebox-top-bar {
115  bottom: 100%;
116}
117#swipebox-top-bar.visible-bars {
118  -webkit-transform: translate3d(0, 100%, 0);
119          transform: translate3d(0, 100%, 0);
120}
121
122#swipebox-title {
123  display: block;
124  width: 100%;
125  text-align: center;
126}
127
128#swipebox-prev,
129#swipebox-next,
130#swipebox-close {
131  background-image: url(../img/icons.png);
132  background-repeat: no-repeat;
133  border: none !important;
134  text-decoration: none !important;
135  cursor: pointer;
136  width: 50px;
137  height: 50px;
138  top: 0;
139}
140
141#swipebox-arrows {
142  display: block;
143  margin: 0 auto;
144  width: 100%;
145  height: 50px;
146}
147
148#swipebox-prev {
149  background-position: -32px 13px;
150  float: left;
151}
152
153#swipebox-next {
154  background-position: -78px 13px;
155  float: right;
156}
157
158#swipebox-close {
159  top: 0;
160  right: 0;
161  position: absolute;
162  z-index: 9999;
163  background-position: 15px 12px;
164}
165
166.swipebox-no-close-button #swipebox-close {
167  display: none;
168}
169
170#swipebox-prev.disabled,
171#swipebox-next.disabled {
172  opacity: 0.3;
173}
174
175.swipebox-no-touch #swipebox-overlay.rightSpring #swipebox-slider {
176  -webkit-animation: rightSpring 0.3s;
177          animation: rightSpring 0.3s;
178}
179.swipebox-no-touch #swipebox-overlay.leftSpring #swipebox-slider {
180  -webkit-animation: leftSpring 0.3s;
181          animation: leftSpring 0.3s;
182}
183
184.swipebox-touch #swipebox-container:before, .swipebox-touch #swipebox-container:after {
185  -webkit-backface-visibility: hidden;
186          backface-visibility: hidden;
187  -webkit-transition: all .3s ease;
188          transition: all .3s ease;
189  content: ' ';
190  position: absolute;
191  z-index: 999;
192  top: 0;
193  height: 100%;
194  width: 20px;
195  opacity: 0;
196}
197.swipebox-touch #swipebox-container:before {
198  left: 0;
199  -webkit-box-shadow: inset 10px 0px 10px -8px #656565;
200          box-shadow: inset 10px 0px 10px -8px #656565;
201}
202.swipebox-touch #swipebox-container:after {
203  right: 0;
204  -webkit-box-shadow: inset -10px 0px 10px -8px #656565;
205          box-shadow: inset -10px 0px 10px -8px #656565;
206}
207.swipebox-touch #swipebox-overlay.leftSpringTouch #swipebox-container:before {
208  opacity: 1;
209}
210.swipebox-touch #swipebox-overlay.rightSpringTouch #swipebox-container:after {
211  opacity: 1;
212}
213
214@-webkit-keyframes rightSpring {
215  0% {
216    left: 0;
217  }
218  50% {
219    left: -30px;
220  }
221  100% {
222    left: 0;
223  }
224}
225
226@keyframes rightSpring {
227  0% {
228    left: 0;
229  }
230  50% {
231    left: -30px;
232  }
233  100% {
234    left: 0;
235  }
236}
237@-webkit-keyframes leftSpring {
238  0% {
239    left: 0;
240  }
241  50% {
242    left: 30px;
243  }
244  100% {
245    left: 0;
246  }
247}
248@keyframes leftSpring {
249  0% {
250    left: 0;
251  }
252  50% {
253    left: 30px;
254  }
255  100% {
256    left: 0;
257  }
258}
259@media screen and (min-width: 800px) {
260  #swipebox-close {
261    right: 10px;
262  }
263
264  #swipebox-arrows {
265    width: 92%;
266    max-width: 800px;
267  }
268}
269/* Skin
270--------------------------*/
271#swipebox-overlay {
272  background: #0d0d0d;
273}
274
275#swipebox-bottom-bar,
276#swipebox-top-bar {
277  text-shadow: 1px 1px 1px black;
278  background: #000;
279  opacity: 0.95;
280}
281
282#swipebox-top-bar {
283  color: white !important;
284  font-size: 15px;
285  line-height: 43px;
286  font-family: Helvetica, Arial, sans-serif;
287}
288#swipebox-top-bar div.caption {
289  font-size: 13px;
290  line-height: 20px;
291}
292