@livetiles/reach-components-react 0.4.0-preview.43 → 0.4.0-preview.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.umd.css ADDED
@@ -0,0 +1,1103 @@
1
+ .Toastify__toast-container{z-index:9999;-webkit-transform:translateZ(9999px);position:fixed;padding:4px;width:320px;box-sizing:border-box;color:#fff}.Toastify__toast-container--top-left{top:1em;left:1em}.Toastify__toast-container--top-center{top:1em;left:50%;margin-left:-160px}.Toastify__toast-container--top-right{top:1em;right:1em}.Toastify__toast-container--bottom-left{bottom:1em;left:1em}.Toastify__toast-container--bottom-center{bottom:1em;left:50%;margin-left:-160px}.Toastify__toast-container--bottom-right{bottom:1em;right:1em}@media only screen and (max-width:480px){.Toastify__toast-container{width:100vw;padding:0;left:0;margin:0}.Toastify__toast-container--top-center,.Toastify__toast-container--top-left,.Toastify__toast-container--top-right{top:0}.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-right{bottom:0}.Toastify__toast-container--rtl{right:0;left:auto}}.Toastify__toast{position:relative;min-height:64px;box-sizing:border-box;margin-bottom:1rem;padding:8px;border-radius:1px;box-shadow:0 1px 10px 0 rgba(0,0,0,.1),0 2px 15px 0 rgba(0,0,0,.05);display:flex;justify-content:space-between;max-height:800px;overflow:hidden;font-family:sans-serif;cursor:pointer;direction:ltr}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--default{background:#fff;color:#aaa}.Toastify__toast--info{background:#3498db}.Toastify__toast--success{background:#07bc0c}.Toastify__toast--warning{background:#f1c40f}.Toastify__toast--error{background:#e74c3c}.Toastify__toast-body{margin:auto 0;flex:1}@media only screen and (max-width:480px){.Toastify__toast{margin-bottom:0}}.Toastify__close-button{color:#fff;font-weight:700;font-size:14px;background:transparent;outline:none;border:none;padding:0;cursor:pointer;opacity:.7;transition:.3s ease;align-self:flex-start}.Toastify__close-button--default{color:#000;opacity:.3}.Toastify__close-button:focus,.Toastify__close-button:hover{opacity:1}@-webkit-keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{position:absolute;bottom:0;left:0;width:100%;height:5px;z-index:9999;opacity:.7;background-color:hsla(0,0%,100%,.7);transform-origin:left}.Toastify__progress-bar--animated{-webkit-animation:Toastify__trackProgress linear 1 forwards;animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{right:0;left:auto;transform-origin:right}.Toastify__progress-bar--default{background:linear-gradient(90deg,#4cd964,#5ac8fa,#007aff,#34aadc,#5856d6,#ff2d55)}@-webkit-keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@-webkit-keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@-webkit-keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@-webkit-keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@-webkit-keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@-webkit-keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@-webkit-keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@-webkit-keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--bottom-left,.Toastify__bounce-enter--top-left{-webkit-animation-name:Toastify__bounceInLeft;animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--bottom-right,.Toastify__bounce-enter--top-right{-webkit-animation-name:Toastify__bounceInRight;animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{-webkit-animation-name:Toastify__bounceInDown;animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{-webkit-animation-name:Toastify__bounceInUp;animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--bottom-left,.Toastify__bounce-exit--top-left{-webkit-animation-name:Toastify__bounceOutLeft;animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--bottom-right,.Toastify__bounce-exit--top-right{-webkit-animation-name:Toastify__bounceOutRight;animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{-webkit-animation-name:Toastify__bounceOutUp;animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{-webkit-animation-name:Toastify__bounceOutDown;animation-name:Toastify__bounceOutDown}@-webkit-keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@-webkit-keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{-webkit-animation-name:Toastify__zoomIn;animation-name:Toastify__zoomIn}.Toastify__zoom-exit{-webkit-animation-name:Toastify__zoomOut;animation-name:Toastify__zoomOut}@-webkit-keyframes Toastify__flipIn{0%{transform:perspective(400px) rotateX(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateX(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{transform:perspective(400px) rotateX(10deg);opacity:1}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipIn{0%{transform:perspective(400px) rotateX(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateX(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{transform:perspective(400px) rotateX(10deg);opacity:1}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@-webkit-keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{transform:perspective(400px) rotateX(-20deg);opacity:1}to{transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{transform:perspective(400px) rotateX(-20deg);opacity:1}to{transform:perspective(400px) rotateX(90deg);opacity:0}}.Toastify__flip-enter{-webkit-animation-name:Toastify__flipIn;animation-name:Toastify__flipIn}.Toastify__flip-exit{-webkit-animation-name:Toastify__flipOut;animation-name:Toastify__flipOut}@-webkit-keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@-webkit-keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@-webkit-keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@-webkit-keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@-webkit-keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(110%,0,0)}}@keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(110%,0,0)}}@-webkit-keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(-110%,0,0)}}@keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(-110%,0,0)}}@-webkit-keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,500px,0)}}@keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,500px,0)}}@-webkit-keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,-500px,0)}}@keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,-500px,0)}}.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--top-left{-webkit-animation-name:Toastify__slideInLeft;animation-name:Toastify__slideInLeft}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--top-right{-webkit-animation-name:Toastify__slideInRight;animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{-webkit-animation-name:Toastify__slideInDown;animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{-webkit-animation-name:Toastify__slideInUp;animation-name:Toastify__slideInUp}.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--top-left{-webkit-animation-name:Toastify__slideOutLeft;animation-name:Toastify__slideOutLeft}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--top-right{-webkit-animation-name:Toastify__slideOutRight;animation-name:Toastify__slideOutRight}.Toastify__slide-exit--top-center{-webkit-animation-name:Toastify__slideOutUp;animation-name:Toastify__slideOutUp}.Toastify__slide-exit--bottom-center{-webkit-animation-name:Toastify__slideOutDown;animation-name:Toastify__slideOutDown}
2
+ /*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
3
+ /*
4
+ Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
5
+ */
6
+ /* pswp = photoswipe */
7
+ .pswp {
8
+ display: none;
9
+ position: absolute;
10
+ width: 100%;
11
+ height: 100%;
12
+ left: 0;
13
+ top: 0;
14
+ overflow: hidden;
15
+ touch-action: none;
16
+ z-index: 1500;
17
+ -webkit-text-size-adjust: 100%;
18
+ /* create separate layer, to avoid paint on window.onscroll in webkit/blink */
19
+ -webkit-backface-visibility: hidden;
20
+ outline: none; }
21
+ .pswp * {
22
+ box-sizing: border-box; }
23
+ .pswp img {
24
+ max-width: none; }
25
+
26
+ /* style is added when JS option showHideOpacity is set to true */
27
+ .pswp--animate_opacity {
28
+ /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
29
+ opacity: 0.001;
30
+ will-change: opacity;
31
+ /* for open/close transition */
32
+ transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
33
+
34
+ .pswp--open {
35
+ display: block; }
36
+
37
+ .pswp--zoom-allowed .pswp__img {
38
+ /* autoprefixer: off */
39
+ cursor: -webkit-zoom-in;
40
+ cursor: -moz-zoom-in;
41
+ cursor: zoom-in; }
42
+
43
+ .pswp--zoomed-in .pswp__img {
44
+ /* autoprefixer: off */
45
+ cursor: -webkit-grab;
46
+ cursor: -moz-grab;
47
+ cursor: grab; }
48
+
49
+ .pswp--dragging .pswp__img {
50
+ /* autoprefixer: off */
51
+ cursor: -webkit-grabbing;
52
+ cursor: -moz-grabbing;
53
+ cursor: grabbing; }
54
+
55
+ /*
56
+ Background is added as a separate element.
57
+ As animating opacity is much faster than animating rgba() background-color.
58
+ */
59
+ .pswp__bg {
60
+ position: absolute;
61
+ left: 0;
62
+ top: 0;
63
+ width: 100%;
64
+ height: 100%;
65
+ background: #000;
66
+ opacity: 0;
67
+ transform: translateZ(0);
68
+ -webkit-backface-visibility: hidden;
69
+ will-change: opacity; }
70
+
71
+ .pswp__scroll-wrap {
72
+ position: absolute;
73
+ left: 0;
74
+ top: 0;
75
+ width: 100%;
76
+ height: 100%;
77
+ overflow: hidden; }
78
+
79
+ .pswp__container,
80
+ .pswp__zoom-wrap {
81
+ touch-action: none;
82
+ position: absolute;
83
+ left: 0;
84
+ right: 0;
85
+ top: 0;
86
+ bottom: 0; }
87
+
88
+ /* Prevent selection and tap highlights */
89
+ .pswp__container,
90
+ .pswp__img {
91
+ -webkit-user-select: none;
92
+ -moz-user-select: none;
93
+ -ms-user-select: none;
94
+ user-select: none;
95
+ -webkit-tap-highlight-color: transparent;
96
+ -webkit-touch-callout: none; }
97
+
98
+ .pswp__zoom-wrap {
99
+ position: absolute;
100
+ width: 100%;
101
+ transform-origin: left top;
102
+ /* for open/close transition */
103
+ transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); }
104
+
105
+ .pswp__bg {
106
+ will-change: opacity;
107
+ /* for open/close transition */
108
+ transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
109
+
110
+ .pswp--animated-in .pswp__bg,
111
+ .pswp--animated-in .pswp__zoom-wrap {
112
+ transition: none; }
113
+
114
+ .pswp__container,
115
+ .pswp__zoom-wrap {
116
+ -webkit-backface-visibility: hidden; }
117
+
118
+ .pswp__item {
119
+ position: absolute;
120
+ left: 0;
121
+ right: 0;
122
+ top: 0;
123
+ bottom: 0;
124
+ overflow: hidden; }
125
+
126
+ .pswp__img {
127
+ position: absolute;
128
+ width: auto;
129
+ height: auto;
130
+ top: 0;
131
+ left: 0; }
132
+
133
+ /*
134
+ stretched thumbnail or div placeholder element (see below)
135
+ style is added to avoid flickering in webkit/blink when layers overlap
136
+ */
137
+ .pswp__img--placeholder {
138
+ -webkit-backface-visibility: hidden; }
139
+
140
+ /*
141
+ div element that matches size of large image
142
+ large image loads on top of it
143
+ */
144
+ .pswp__img--placeholder--blank {
145
+ background: #222; }
146
+
147
+ .pswp--ie .pswp__img {
148
+ width: 100% !important;
149
+ height: auto !important;
150
+ left: 0;
151
+ top: 0; }
152
+
153
+ /*
154
+ Error message appears when image is not loaded
155
+ (JS option errorMsg controls markup)
156
+ */
157
+ .pswp__error-msg {
158
+ position: absolute;
159
+ left: 0;
160
+ top: 50%;
161
+ width: 100%;
162
+ text-align: center;
163
+ font-size: 14px;
164
+ line-height: 16px;
165
+ margin-top: -8px;
166
+ color: #CCC; }
167
+
168
+ .pswp__error-msg a {
169
+ color: #CCC;
170
+ text-decoration: underline; }
171
+
172
+ /*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
173
+ /*
174
+
175
+ Contents:
176
+
177
+ 1. Buttons
178
+ 2. Share modal and links
179
+ 3. Index indicator ("1 of X" counter)
180
+ 4. Caption
181
+ 5. Loading indicator
182
+ 6. Additional styles (root element, top bar, idle state, hidden state, etc.)
183
+
184
+ */
185
+ /*
186
+
187
+ 1. Buttons
188
+
189
+ */
190
+ /* <button> css reset */
191
+ .pswp__button {
192
+ width: 44px;
193
+ height: 44px;
194
+ position: relative;
195
+ background: none;
196
+ cursor: pointer;
197
+ overflow: visible;
198
+ -webkit-appearance: none;
199
+ display: block;
200
+ border: 0;
201
+ padding: 0;
202
+ margin: 0;
203
+ float: right;
204
+ opacity: 0.75;
205
+ transition: opacity 0.2s;
206
+ box-shadow: none; }
207
+ .pswp__button:focus, .pswp__button:hover {
208
+ opacity: 1; }
209
+ .pswp__button:active {
210
+ outline: none;
211
+ opacity: 0.9; }
212
+ .pswp__button::-moz-focus-inner {
213
+ padding: 0;
214
+ border: 0; }
215
+
216
+ /* pswp__ui--over-close class it added when mouse is over element that should close gallery */
217
+ .pswp__ui--over-close .pswp__button--close {
218
+ opacity: 1; }
219
+
220
+ .pswp__button,
221
+ .pswp__button--arrow--left:before,
222
+ .pswp__button--arrow--right:before {
223
+ background: url(default-skin.png) 0 0 no-repeat;
224
+ background-size: 264px 88px;
225
+ width: 44px;
226
+ height: 44px; }
227
+
228
+ @media (-webkit-min-device-pixel-ratio: 1.1), (-webkit-min-device-pixel-ratio: 1.09375), (min-resolution: 105dpi), (min-resolution: 1.1dppx) {
229
+ /* Serve SVG sprite if browser supports SVG and resolution is more than 105dpi */
230
+ .pswp--svg .pswp__button,
231
+ .pswp--svg .pswp__button--arrow--left:before,
232
+ .pswp--svg .pswp__button--arrow--right:before {
233
+ background-image: url(default-skin.svg); }
234
+ .pswp--svg .pswp__button--arrow--left,
235
+ .pswp--svg .pswp__button--arrow--right {
236
+ background: none; } }
237
+
238
+ .pswp__button--close {
239
+ background-position: 0 -44px; }
240
+
241
+ .pswp__button--share {
242
+ background-position: -44px -44px; }
243
+
244
+ .pswp__button--fs {
245
+ display: none; }
246
+
247
+ .pswp--supports-fs .pswp__button--fs {
248
+ display: block; }
249
+
250
+ .pswp--fs .pswp__button--fs {
251
+ background-position: -44px 0; }
252
+
253
+ .pswp__button--zoom {
254
+ display: none;
255
+ background-position: -88px 0; }
256
+
257
+ .pswp--zoom-allowed .pswp__button--zoom {
258
+ display: block; }
259
+
260
+ .pswp--zoomed-in .pswp__button--zoom {
261
+ background-position: -132px 0; }
262
+
263
+ /* no arrows on touch screens */
264
+ .pswp--touch .pswp__button--arrow--left,
265
+ .pswp--touch .pswp__button--arrow--right {
266
+ visibility: hidden; }
267
+
268
+ /*
269
+ Arrow buttons hit area
270
+ (icon is added to :before pseudo-element)
271
+ */
272
+ .pswp__button--arrow--left,
273
+ .pswp__button--arrow--right {
274
+ background: none;
275
+ top: 50%;
276
+ margin-top: -50px;
277
+ width: 70px;
278
+ height: 100px;
279
+ position: absolute; }
280
+
281
+ .pswp__button--arrow--left {
282
+ left: 0; }
283
+
284
+ .pswp__button--arrow--right {
285
+ right: 0; }
286
+
287
+ .pswp__button--arrow--left:before,
288
+ .pswp__button--arrow--right:before {
289
+ content: '';
290
+ top: 35px;
291
+ background-color: rgba(0, 0, 0, 0.3);
292
+ height: 30px;
293
+ width: 32px;
294
+ position: absolute; }
295
+
296
+ .pswp__button--arrow--left:before {
297
+ left: 6px;
298
+ background-position: -138px -44px; }
299
+
300
+ .pswp__button--arrow--right:before {
301
+ right: 6px;
302
+ background-position: -94px -44px; }
303
+
304
+ /*
305
+
306
+ 2. Share modal/popup and links
307
+
308
+ */
309
+ .pswp__counter,
310
+ .pswp__share-modal {
311
+ -webkit-user-select: none;
312
+ -moz-user-select: none;
313
+ -ms-user-select: none;
314
+ user-select: none; }
315
+
316
+ .pswp__share-modal {
317
+ display: block;
318
+ background: rgba(0, 0, 0, 0.5);
319
+ width: 100%;
320
+ height: 100%;
321
+ top: 0;
322
+ left: 0;
323
+ padding: 10px;
324
+ position: absolute;
325
+ z-index: 1600;
326
+ opacity: 0;
327
+ transition: opacity 0.25s ease-out;
328
+ -webkit-backface-visibility: hidden;
329
+ will-change: opacity; }
330
+
331
+ .pswp__share-modal--hidden {
332
+ display: none; }
333
+
334
+ .pswp__share-tooltip {
335
+ z-index: 1620;
336
+ position: absolute;
337
+ background: #FFF;
338
+ top: 56px;
339
+ border-radius: 2px;
340
+ display: block;
341
+ width: auto;
342
+ right: 44px;
343
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
344
+ transform: translateY(6px);
345
+ transition: transform 0.25s;
346
+ -webkit-backface-visibility: hidden;
347
+ will-change: transform; }
348
+ .pswp__share-tooltip a {
349
+ display: block;
350
+ padding: 8px 12px;
351
+ color: #000;
352
+ text-decoration: none;
353
+ font-size: 14px;
354
+ line-height: 18px; }
355
+ .pswp__share-tooltip a:hover {
356
+ text-decoration: none;
357
+ color: #000; }
358
+ .pswp__share-tooltip a:first-child {
359
+ /* round corners on the first/last list item */
360
+ border-radius: 2px 2px 0 0; }
361
+ .pswp__share-tooltip a:last-child {
362
+ border-radius: 0 0 2px 2px; }
363
+
364
+ .pswp__share-modal--fade-in {
365
+ opacity: 1; }
366
+ .pswp__share-modal--fade-in .pswp__share-tooltip {
367
+ transform: translateY(0); }
368
+
369
+ /* increase size of share links on touch devices */
370
+ .pswp--touch .pswp__share-tooltip a {
371
+ padding: 16px 12px; }
372
+
373
+ a.pswp__share--facebook:before {
374
+ content: '';
375
+ display: block;
376
+ width: 0;
377
+ height: 0;
378
+ position: absolute;
379
+ top: -12px;
380
+ right: 15px;
381
+ border: 6px solid transparent;
382
+ border-bottom-color: #FFF;
383
+ -webkit-pointer-events: none;
384
+ -moz-pointer-events: none;
385
+ pointer-events: none; }
386
+
387
+ a.pswp__share--facebook:hover {
388
+ background: #3E5C9A;
389
+ color: #FFF; }
390
+ a.pswp__share--facebook:hover:before {
391
+ border-bottom-color: #3E5C9A; }
392
+
393
+ a.pswp__share--twitter:hover {
394
+ background: #55ACEE;
395
+ color: #FFF; }
396
+
397
+ a.pswp__share--pinterest:hover {
398
+ background: #CCC;
399
+ color: #CE272D; }
400
+
401
+ a.pswp__share--download:hover {
402
+ background: #DDD; }
403
+
404
+ /*
405
+
406
+ 3. Index indicator ("1 of X" counter)
407
+
408
+ */
409
+ .pswp__counter {
410
+ position: absolute;
411
+ left: 0;
412
+ top: 0;
413
+ height: 44px;
414
+ font-size: 13px;
415
+ line-height: 44px;
416
+ color: #FFF;
417
+ opacity: 0.75;
418
+ padding: 0 10px; }
419
+
420
+ /*
421
+
422
+ 4. Caption
423
+
424
+ */
425
+ .pswp__caption {
426
+ position: absolute;
427
+ left: 0;
428
+ bottom: 0;
429
+ width: 100%;
430
+ min-height: 44px; }
431
+ .pswp__caption small {
432
+ font-size: 11px;
433
+ color: #BBB; }
434
+
435
+ .pswp__caption__center {
436
+ text-align: left;
437
+ max-width: 420px;
438
+ margin: 0 auto;
439
+ font-size: 13px;
440
+ padding: 10px;
441
+ line-height: 20px;
442
+ color: #CCC; }
443
+
444
+ .pswp__caption--empty {
445
+ display: none; }
446
+
447
+ /* Fake caption element, used to calculate height of next/prev image */
448
+ .pswp__caption--fake {
449
+ visibility: hidden; }
450
+
451
+ /*
452
+
453
+ 5. Loading indicator (preloader)
454
+
455
+ You can play with it here - http://codepen.io/dimsemenov/pen/yyBWoR
456
+
457
+ */
458
+ .pswp__preloader {
459
+ width: 44px;
460
+ height: 44px;
461
+ position: absolute;
462
+ top: 0;
463
+ left: 50%;
464
+ margin-left: -22px;
465
+ opacity: 0;
466
+ transition: opacity 0.25s ease-out;
467
+ will-change: opacity;
468
+ direction: ltr; }
469
+
470
+ .pswp__preloader__icn {
471
+ width: 20px;
472
+ height: 20px;
473
+ margin: 12px; }
474
+
475
+ .pswp__preloader--active {
476
+ opacity: 1; }
477
+ .pswp__preloader--active .pswp__preloader__icn {
478
+ /* We use .gif in browsers that don't support CSS animation */
479
+ background: url(preloader.gif) 0 0 no-repeat; }
480
+
481
+ .pswp--css_animation .pswp__preloader--active {
482
+ opacity: 1; }
483
+ .pswp--css_animation .pswp__preloader--active .pswp__preloader__icn {
484
+ -webkit-animation: clockwise 500ms linear infinite;
485
+ animation: clockwise 500ms linear infinite; }
486
+ .pswp--css_animation .pswp__preloader--active .pswp__preloader__donut {
487
+ -webkit-animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite;
488
+ animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite; }
489
+
490
+ .pswp--css_animation .pswp__preloader__icn {
491
+ background: none;
492
+ opacity: 0.75;
493
+ width: 14px;
494
+ height: 14px;
495
+ position: absolute;
496
+ left: 15px;
497
+ top: 15px;
498
+ margin: 0; }
499
+
500
+ .pswp--css_animation .pswp__preloader__cut {
501
+ /*
502
+ The idea of animating inner circle is based on Polymer ("material") loading indicator
503
+ by Keanu Lee https://blog.keanulee.com/2014/10/20/the-tale-of-three-spinners.html
504
+ */
505
+ position: relative;
506
+ width: 7px;
507
+ height: 14px;
508
+ overflow: hidden; }
509
+
510
+ .pswp--css_animation .pswp__preloader__donut {
511
+ box-sizing: border-box;
512
+ width: 14px;
513
+ height: 14px;
514
+ border: 2px solid #FFF;
515
+ border-radius: 50%;
516
+ border-left-color: transparent;
517
+ border-bottom-color: transparent;
518
+ position: absolute;
519
+ top: 0;
520
+ left: 0;
521
+ background: none;
522
+ margin: 0; }
523
+
524
+ @media screen and (max-width: 1024px) {
525
+ .pswp__preloader {
526
+ position: relative;
527
+ left: auto;
528
+ top: auto;
529
+ margin: 0;
530
+ float: right; } }
531
+
532
+ @-webkit-keyframes clockwise {
533
+ 0% {
534
+ transform: rotate(0deg); }
535
+ 100% {
536
+ transform: rotate(360deg); } }
537
+
538
+ @keyframes clockwise {
539
+ 0% {
540
+ transform: rotate(0deg); }
541
+ 100% {
542
+ transform: rotate(360deg); } }
543
+
544
+ @-webkit-keyframes donut-rotate {
545
+ 0% {
546
+ transform: rotate(0); }
547
+ 50% {
548
+ transform: rotate(-140deg); }
549
+ 100% {
550
+ transform: rotate(0); } }
551
+
552
+ @keyframes donut-rotate {
553
+ 0% {
554
+ transform: rotate(0); }
555
+ 50% {
556
+ transform: rotate(-140deg); }
557
+ 100% {
558
+ transform: rotate(0); } }
559
+
560
+ /*
561
+
562
+ 6. Additional styles
563
+
564
+ */
565
+ /* root element of UI */
566
+ .pswp__ui {
567
+ -webkit-font-smoothing: auto;
568
+ visibility: visible;
569
+ opacity: 1;
570
+ z-index: 1550; }
571
+
572
+ /* top black bar with buttons and "1 of X" indicator */
573
+ .pswp__top-bar {
574
+ position: absolute;
575
+ left: 0;
576
+ top: 0;
577
+ height: 44px;
578
+ width: 100%; }
579
+
580
+ .pswp__caption,
581
+ .pswp__top-bar,
582
+ .pswp--has_mouse .pswp__button--arrow--left,
583
+ .pswp--has_mouse .pswp__button--arrow--right {
584
+ -webkit-backface-visibility: hidden;
585
+ will-change: opacity;
586
+ transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
587
+
588
+ /* pswp--has_mouse class is added only when two subsequent mousemove events occur */
589
+ .pswp--has_mouse .pswp__button--arrow--left,
590
+ .pswp--has_mouse .pswp__button--arrow--right {
591
+ visibility: visible; }
592
+
593
+ .pswp__top-bar,
594
+ .pswp__caption {
595
+ background-color: rgba(0, 0, 0, 0.5); }
596
+
597
+ /* pswp__ui--fit class is added when main image "fits" between top bar and bottom bar (caption) */
598
+ .pswp__ui--fit .pswp__top-bar,
599
+ .pswp__ui--fit .pswp__caption {
600
+ background-color: rgba(0, 0, 0, 0.3); }
601
+
602
+ /* pswp__ui--idle class is added when mouse isn't moving for several seconds (JS option timeToIdle) */
603
+ .pswp__ui--idle .pswp__top-bar {
604
+ opacity: 0; }
605
+
606
+ .pswp__ui--idle .pswp__button--arrow--left,
607
+ .pswp__ui--idle .pswp__button--arrow--right {
608
+ opacity: 0; }
609
+
610
+ /*
611
+ pswp__ui--hidden class is added when controls are hidden
612
+ e.g. when user taps to toggle visibility of controls
613
+ */
614
+ .pswp__ui--hidden .pswp__top-bar,
615
+ .pswp__ui--hidden .pswp__caption,
616
+ .pswp__ui--hidden .pswp__button--arrow--left,
617
+ .pswp__ui--hidden .pswp__button--arrow--right {
618
+ /* Force paint & create composition layer for controls. */
619
+ opacity: 0.001; }
620
+
621
+ /* pswp__ui--one-slide class is added when there is just one item in gallery */
622
+ .pswp__ui--one-slide .pswp__button--arrow--left,
623
+ .pswp__ui--one-slide .pswp__button--arrow--right,
624
+ .pswp__ui--one-slide .pswp__counter {
625
+ display: none; }
626
+
627
+ .pswp__element--disabled {
628
+ display: none !important; }
629
+
630
+ .pswp--minimal--dark .pswp__top-bar {
631
+ background: none; }
632
+
633
+ .emoji-mart,
634
+ .emoji-mart * {
635
+ box-sizing: border-box;
636
+ line-height: 1.15;
637
+ }
638
+
639
+ .emoji-mart {
640
+ font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
641
+ font-size: 16px;
642
+ display: inline-block;
643
+ color: #222427;
644
+ border: 1px solid #d9d9d9;
645
+ border-radius: 5px;
646
+ background: #fff;
647
+ }
648
+
649
+ .emoji-mart .emoji-mart-emoji {
650
+ padding: 6px;
651
+ }
652
+
653
+ .emoji-mart-bar {
654
+ border: 0 solid #d9d9d9;
655
+ }
656
+ .emoji-mart-bar:first-child {
657
+ border-bottom-width: 1px;
658
+ border-top-left-radius: 5px;
659
+ border-top-right-radius: 5px;
660
+ }
661
+ .emoji-mart-bar:last-child {
662
+ border-top-width: 1px;
663
+ border-bottom-left-radius: 5px;
664
+ border-bottom-right-radius: 5px;
665
+ }
666
+
667
+ .emoji-mart-anchors {
668
+ display: flex;
669
+ flex-direction: row;
670
+ justify-content: space-between;
671
+ padding: 0 6px;
672
+ line-height: 0;
673
+ }
674
+
675
+ .emoji-mart-anchor {
676
+ position: relative;
677
+ display: block;
678
+ flex: 1 1 auto;
679
+ color: #858585;
680
+ text-align: center;
681
+ padding: 12px 4px;
682
+ overflow: hidden;
683
+ transition: color .1s ease-out;
684
+ margin: 0;
685
+ box-shadow: none;
686
+ background: none;
687
+ border: none;
688
+ }
689
+ .emoji-mart-anchor:focus { outline: 0 }
690
+ .emoji-mart-anchor:hover,
691
+ .emoji-mart-anchor:focus,
692
+ .emoji-mart-anchor-selected {
693
+ color: #464646;
694
+ }
695
+
696
+ .emoji-mart-anchor-selected .emoji-mart-anchor-bar {
697
+ bottom: 0;
698
+ }
699
+
700
+ .emoji-mart-anchor-bar {
701
+ position: absolute;
702
+ bottom: -3px; left: 0;
703
+ width: 100%; height: 3px;
704
+ background-color: #464646;
705
+ }
706
+
707
+ .emoji-mart-anchors i {
708
+ display: inline-block;
709
+ width: 100%;
710
+ max-width: 22px;
711
+ }
712
+
713
+ .emoji-mart-anchors svg,
714
+ .emoji-mart-anchors img {
715
+ fill: currentColor;
716
+ height: 18px;
717
+ width: 18px;
718
+ }
719
+
720
+ .emoji-mart-scroll {
721
+ overflow-y: scroll;
722
+ overflow-x: hidden;
723
+ height: 270px;
724
+ padding: 0 6px 6px 6px;
725
+ will-change: transform; /* avoids "repaints on scroll" in mobile Chrome */
726
+ }
727
+
728
+ .emoji-mart-search {
729
+ margin-top: 6px;
730
+ padding: 0 6px;
731
+ position: relative;
732
+ }
733
+
734
+ .emoji-mart-search input {
735
+ font-size: 16px;
736
+ display: block;
737
+ width: 100%;
738
+ padding: 5px 25px 6px 10px;
739
+ border-radius: 5px;
740
+ border: 1px solid #d9d9d9;
741
+ outline: 0;
742
+ }
743
+
744
+ .emoji-mart-search input,
745
+ .emoji-mart-search input::-webkit-search-decoration,
746
+ .emoji-mart-search input::-webkit-search-cancel-button,
747
+ .emoji-mart-search input::-webkit-search-results-button,
748
+ .emoji-mart-search input::-webkit-search-results-decoration {
749
+ /* remove webkit/blink styles for <input type="search">
750
+ * via https://stackoverflow.com/a/9422689 */
751
+ -webkit-appearance: none;
752
+ }
753
+
754
+ .emoji-mart-search-icon {
755
+ position: absolute;
756
+ top: 7px;
757
+ right: 11px;
758
+ z-index: 2;
759
+ padding: 2px 5px 1px;
760
+ border: none;
761
+ background: none;
762
+ }
763
+
764
+ .emoji-mart-category .emoji-mart-emoji span {
765
+ z-index: 1;
766
+ position: relative;
767
+ text-align: center;
768
+ cursor: default;
769
+ }
770
+
771
+ .emoji-mart-category .emoji-mart-emoji:hover:before {
772
+ z-index: 0;
773
+ content: "";
774
+ position: absolute;
775
+ top: 0; left: 0;
776
+ width: 100%; height: 100%;
777
+ background-color: #f4f4f4;
778
+ border-radius: 100%;
779
+ }
780
+
781
+ .emoji-mart-category-label {
782
+ z-index: 2;
783
+ position: relative;
784
+ position: -webkit-sticky;
785
+ position: sticky;
786
+ top: 0;
787
+ }
788
+
789
+ .emoji-mart-category-label span {
790
+ display: block;
791
+ width: 100%;
792
+ font-weight: 500;
793
+ padding: 5px 6px;
794
+ background-color: #fff;
795
+ background-color: rgba(255, 255, 255, .95);
796
+ }
797
+
798
+ .emoji-mart-category-list {
799
+ margin: 0;
800
+ padding: 0;
801
+ }
802
+
803
+ .emoji-mart-category-list li {
804
+ list-style: none;
805
+ margin: 0;
806
+ padding: 0;
807
+ display: inline-block;
808
+ }
809
+
810
+ .emoji-mart-emoji {
811
+ position: relative;
812
+ display: inline-block;
813
+ font-size: 0;
814
+ margin: 0;
815
+ padding: 0;
816
+ border: none;
817
+ background: none;
818
+ box-shadow: none;
819
+ }
820
+
821
+ .emoji-mart-emoji-native {
822
+ font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Segoe UI", "Apple Color Emoji", "Twemoji Mozilla", "Noto Color Emoji", "Android Emoji";
823
+ }
824
+
825
+ .emoji-mart-no-results {
826
+ font-size: 14px;
827
+ text-align: center;
828
+ padding-top: 70px;
829
+ color: #858585;
830
+ }
831
+ .emoji-mart-no-results-img {
832
+ display: block;
833
+ margin-left: auto;
834
+ margin-right: auto;
835
+ width: 50%;
836
+ }
837
+ .emoji-mart-no-results .emoji-mart-category-label {
838
+ display: none;
839
+ }
840
+ .emoji-mart-no-results .emoji-mart-no-results-label {
841
+ margin-top: .2em;
842
+ }
843
+ .emoji-mart-no-results .emoji-mart-emoji:hover:before {
844
+ content: none;
845
+ }
846
+
847
+ .emoji-mart-preview {
848
+ position: relative;
849
+ height: 70px;
850
+ }
851
+
852
+ .emoji-mart-preview-emoji,
853
+ .emoji-mart-preview-data,
854
+ .emoji-mart-preview-skins {
855
+ position: absolute;
856
+ top: 50%;
857
+ transform: translateY(-50%);
858
+ }
859
+
860
+ .emoji-mart-preview-emoji {
861
+ left: 12px;
862
+ }
863
+
864
+ .emoji-mart-preview-data {
865
+ left: 68px; right: 12px;
866
+ word-break: break-all;
867
+ }
868
+
869
+ .emoji-mart-preview-skins {
870
+ right: 30px;
871
+ text-align: right;
872
+ }
873
+
874
+ .emoji-mart-preview-skins.custom {
875
+ right: 10px;
876
+ text-align: right;
877
+ }
878
+
879
+ .emoji-mart-preview-name {
880
+ font-size: 14px;
881
+ }
882
+
883
+ .emoji-mart-preview-shortname {
884
+ font-size: 12px;
885
+ color: #888;
886
+ }
887
+ .emoji-mart-preview-shortname + .emoji-mart-preview-shortname,
888
+ .emoji-mart-preview-shortname + .emoji-mart-preview-emoticon,
889
+ .emoji-mart-preview-emoticon + .emoji-mart-preview-emoticon {
890
+ margin-left: .5em;
891
+ }
892
+
893
+ .emoji-mart-preview-emoticon {
894
+ font-size: 11px;
895
+ color: #bbb;
896
+ }
897
+
898
+ .emoji-mart-title span {
899
+ display: inline-block;
900
+ vertical-align: middle;
901
+ }
902
+
903
+ .emoji-mart-title .emoji-mart-emoji {
904
+ padding: 0;
905
+ }
906
+
907
+ .emoji-mart-title-label {
908
+ color: #999A9C;
909
+ font-size: 26px;
910
+ font-weight: 300;
911
+ }
912
+
913
+ .emoji-mart-skin-swatches {
914
+ font-size: 0;
915
+ padding: 2px 0;
916
+ border: 1px solid #d9d9d9;
917
+ border-radius: 12px;
918
+ background-color: #fff;
919
+ }
920
+
921
+ .emoji-mart-skin-swatches.custom {
922
+ font-size: 0;
923
+ border: none;
924
+ background-color: #fff;
925
+ }
926
+
927
+ .emoji-mart-skin-swatches.opened .emoji-mart-skin-swatch {
928
+ width: 16px;
929
+ padding: 0 2px;
930
+ }
931
+
932
+ .emoji-mart-skin-swatches.opened .emoji-mart-skin-swatch.selected:after {
933
+ opacity: .75;
934
+ }
935
+
936
+ .emoji-mart-skin-swatch {
937
+ display: inline-block;
938
+ width: 0;
939
+ vertical-align: middle;
940
+ transition-property: width, padding;
941
+ transition-duration: .125s;
942
+ transition-timing-function: ease-out;
943
+ }
944
+
945
+ .emoji-mart-skin-swatch:nth-child(1) { transition-delay: 0s }
946
+ .emoji-mart-skin-swatch:nth-child(2) { transition-delay: .03s }
947
+ .emoji-mart-skin-swatch:nth-child(3) { transition-delay: .06s }
948
+ .emoji-mart-skin-swatch:nth-child(4) { transition-delay: .09s }
949
+ .emoji-mart-skin-swatch:nth-child(5) { transition-delay: .12s }
950
+ .emoji-mart-skin-swatch:nth-child(6) { transition-delay: .15s }
951
+
952
+ .emoji-mart-skin-swatch.selected {
953
+ position: relative;
954
+ width: 16px;
955
+ padding: 0 2px;
956
+ }
957
+
958
+ .emoji-mart-skin-swatch.selected:after {
959
+ content: "";
960
+ position: absolute;
961
+ top: 50%; left: 50%;
962
+ width: 4px; height: 4px;
963
+ margin: -2px 0 0 -2px;
964
+ background-color: #fff;
965
+ border-radius: 100%;
966
+ pointer-events: none;
967
+ opacity: 0;
968
+ transition: opacity .2s ease-out;
969
+ }
970
+
971
+ .emoji-mart-skin-swatch.custom {
972
+ display: inline-block;
973
+ width: 0;
974
+ height: 38px;
975
+ overflow: hidden;
976
+ vertical-align: middle;
977
+ transition-property: width, height;
978
+ transition-duration: .125s;
979
+ transition-timing-function: ease-out;
980
+ cursor: default;
981
+ }
982
+
983
+ .emoji-mart-skin-swatch.custom.selected {
984
+ position: relative;
985
+ width: 36px;
986
+ height: 38px;
987
+ padding: 0 2px 0 0;
988
+ }
989
+
990
+ .emoji-mart-skin-swatch.custom.selected:after {
991
+ content: "";
992
+ width: 0;
993
+ height: 0;
994
+ }
995
+
996
+ .emoji-mart-skin-swatches.custom .emoji-mart-skin-swatch.custom:hover {
997
+ background-color: #f4f4f4;
998
+ border-radius: 10%;
999
+ }
1000
+
1001
+ .emoji-mart-skin-swatches.custom.opened .emoji-mart-skin-swatch.custom {
1002
+ width: 36px;
1003
+ height: 38px;
1004
+ padding: 0 2px 0 0;
1005
+ }
1006
+
1007
+ .emoji-mart-skin-swatches.custom.opened .emoji-mart-skin-swatch.custom.selected:after {
1008
+ opacity: .75;
1009
+ }
1010
+
1011
+ .emoji-mart-skin-text.opened {
1012
+ display: inline-block;
1013
+ vertical-align: middle;
1014
+ text-align: left;
1015
+ color: #888;
1016
+ font-size: 11px;
1017
+ padding: 5px 2px;
1018
+ width: 95px;
1019
+ height: 40px;
1020
+ border-radius: 10%;
1021
+ background-color: #fff;
1022
+ }
1023
+
1024
+ .emoji-mart-skin {
1025
+ display: inline-block;
1026
+ width: 100%;
1027
+ padding-top: 100%;
1028
+ max-width: 12px;
1029
+ border-radius: 100%;
1030
+ }
1031
+
1032
+ .emoji-mart-skin-tone-1 { background-color: #ffc93a }
1033
+ .emoji-mart-skin-tone-2 { background-color: #fadcbc }
1034
+ .emoji-mart-skin-tone-3 { background-color: #e0bb95 }
1035
+ .emoji-mart-skin-tone-4 { background-color: #bf8f68 }
1036
+ .emoji-mart-skin-tone-5 { background-color: #9b643d }
1037
+ .emoji-mart-skin-tone-6 { background-color: #594539 }
1038
+
1039
+ /* For screenreaders only, via https://stackoverflow.com/a/19758620 */
1040
+ .emoji-mart-sr-only {
1041
+ position: absolute;
1042
+ width: 1px;
1043
+ height: 1px;
1044
+ padding: 0;
1045
+ margin: -1px;
1046
+ overflow: hidden;
1047
+ clip: rect(0, 0, 0, 0);
1048
+ border: 0;
1049
+ }
1050
+
1051
+ /*
1052
+ * Dark mode styles
1053
+ */
1054
+
1055
+ .emoji-mart-dark {
1056
+ color: #fff;
1057
+ border-color: #555453;
1058
+ background-color: #222;
1059
+ }
1060
+
1061
+ .emoji-mart-dark .emoji-mart-bar {
1062
+ border-color: #555453;
1063
+ }
1064
+
1065
+ .emoji-mart-dark .emoji-mart-search input {
1066
+ color: #fff;
1067
+ border-color: #555453;
1068
+ background-color: #2f2f2f;
1069
+ }
1070
+
1071
+ .emoji-mart-dark .emoji-mart-search-icon svg {
1072
+ fill: #fff;
1073
+ }
1074
+
1075
+ .emoji-mart-dark .emoji-mart-category .emoji-mart-emoji:hover:before {
1076
+ background-color: #444;
1077
+ }
1078
+
1079
+ .emoji-mart-dark .emoji-mart-category-label span {
1080
+ background-color: #222;
1081
+ color: #fff;
1082
+ }
1083
+
1084
+ .emoji-mart-dark .emoji-mart-skin-swatches {
1085
+ border-color: #555453;
1086
+ background-color: #222;
1087
+ }
1088
+
1089
+ .emoji-mart-dark .emoji-mart-anchor:hover,
1090
+ .emoji-mart-dark .emoji-mart-anchor:focus,
1091
+ .emoji-mart-dark .emoji-mart-anchor-selected {
1092
+ color: #bfbfbf;
1093
+ }
1094
+
1095
+ /**
1096
+ * Draft v0.11.6
1097
+ *
1098
+ * Copyright (c) Facebook, Inc. and its affiliates.
1099
+ *
1100
+ * This source code is licensed under the MIT license found in the
1101
+ * LICENSE file in the root directory of this source tree.
1102
+ */
1103
+ .DraftEditor-editorContainer,.DraftEditor-root,.public-DraftEditor-content{height:inherit;text-align:initial}.public-DraftEditor-content[contenteditable=true]{-webkit-user-modify:read-write-plaintext-only}.DraftEditor-root{position:relative}.DraftEditor-editorContainer{background-color:rgba(255,255,255,0);border-left:.1px solid transparent;position:relative;z-index:1}.public-DraftEditor-block{position:relative}.DraftEditor-alignLeft .public-DraftStyleDefault-block{text-align:left}.DraftEditor-alignLeft .public-DraftEditorPlaceholder-root{left:0;text-align:left}.DraftEditor-alignCenter .public-DraftStyleDefault-block{text-align:center}.DraftEditor-alignCenter .public-DraftEditorPlaceholder-root{margin:0 auto;text-align:center;width:100%}.DraftEditor-alignRight .public-DraftStyleDefault-block{text-align:right}.DraftEditor-alignRight .public-DraftEditorPlaceholder-root{right:0;text-align:right}.public-DraftEditorPlaceholder-root{color:#9197a3;position:absolute;width:100%;z-index:1}.public-DraftEditorPlaceholder-hasFocus{color:#bdc1c9}.DraftEditorPlaceholder-hidden{display:none}.public-DraftStyleDefault-block{position:relative;white-space:pre-wrap}.public-DraftStyleDefault-ltr{direction:ltr;text-align:left}.public-DraftStyleDefault-rtl{direction:rtl;text-align:right}.public-DraftStyleDefault-listLTR{direction:ltr}.public-DraftStyleDefault-listRTL{direction:rtl}.public-DraftStyleDefault-ol,.public-DraftStyleDefault-ul{margin:16px 0;padding:0}.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listLTR{margin-left:1.5em}.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listRTL{margin-right:1.5em}.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listLTR{margin-left:3em}.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listRTL{margin-right:3em}.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listLTR{margin-left:4.5em}.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listRTL{margin-right:4.5em}.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listLTR{margin-left:6em}.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listRTL{margin-right:6em}.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listLTR{margin-left:7.5em}.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listRTL{margin-right:7.5em}.public-DraftStyleDefault-unorderedListItem{list-style-type:square;position:relative}.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth0{list-style-type:disc}.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth1{list-style-type:circle}.public-DraftStyleDefault-orderedListItem{list-style-type:none;position:relative}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listLTR:before{left:-36px;position:absolute;text-align:right;width:30px}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listRTL:before{position:absolute;right:-36px;text-align:left;width:30px}.public-DraftStyleDefault-orderedListItem:before{content:counter(ol0) ". ";counter-increment:ol0}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth1:before{content:counter(ol1,lower-alpha) ". ";counter-increment:ol1}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth2:before{content:counter(ol2,lower-roman) ". ";counter-increment:ol2}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth3:before{content:counter(ol3) ". ";counter-increment:ol3}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth4:before{content:counter(ol4,lower-alpha) ". ";counter-increment:ol4}.public-DraftStyleDefault-depth0.public-DraftStyleDefault-reset{counter-reset:ol0}.public-DraftStyleDefault-depth1.public-DraftStyleDefault-reset{counter-reset:ol1}.public-DraftStyleDefault-depth2.public-DraftStyleDefault-reset{counter-reset:ol2}.public-DraftStyleDefault-depth3.public-DraftStyleDefault-reset{counter-reset:ol3}.public-DraftStyleDefault-depth4.public-DraftStyleDefault-reset{counter-reset:ol4}