GPQAPP

1
.daterangepicker {
2
  position: absolute;
3
  color: inherit;
4
  background-color: #fff;
5
  border-radius: 4px;
6
  border: 1px solid #ddd;
7
  width: 278px;
8
  max-width: none;
9
  padding: 0;
10
  margin-top: 7px;
11
  top: 100px;
12
  left: 20px;
13
  z-index: 3001;
14
  display: none;
15
  font-family: arial;
16
  font-size: 15px;
17
  line-height: 1em;
18
}
19

20
.daterangepicker:before, .daterangepicker:after {
21
  position: absolute;
22
  display: inline-block;
23
  border-bottom-color: rgba(0, 0, 0, 0.2);
24
  content: '';
25
}
26

27
.daterangepicker:before {
28
  top: -7px;
29
  border-right: 7px solid transparent;
30
  border-left: 7px solid transparent;
31
  border-bottom: 7px solid #ccc;
32
}
33

34
.daterangepicker:after {
35
  top: -6px;
36
  border-right: 6px solid transparent;
37
  border-bottom: 6px solid #fff;
38
  border-left: 6px solid transparent;
39
}
40

41
.daterangepicker.opensleft:before {
42
  right: 9px;
43
}
44

45
.daterangepicker.opensleft:after {
46
  right: 10px;
47
}
48

49
.daterangepicker.openscenter:before {
50
  left: 0;
51
  right: 0;
52
  width: 0;
53
  margin-left: auto;
54
  margin-right: auto;
55
}
56

57
.daterangepicker.openscenter:after {
58
  left: 0;
59
  right: 0;
60
  width: 0;
61
  margin-left: auto;
62
  margin-right: auto;
63
}
64

65
.daterangepicker.opensright:before {
66
  left: 9px;
67
}
68

69
.daterangepicker.opensright:after {
70
  left: 10px;
71
}
72

73
.daterangepicker.drop-up {
74
  margin-top: -7px;
75
}
76

77
.daterangepicker.drop-up:before {
78
  top: initial;
79
  bottom: -7px;
80
  border-bottom: initial;
81
  border-top: 7px solid #ccc;
82
}
83

84
.daterangepicker.drop-up:after {
85
  top: initial;
86
  bottom: -6px;
87
  border-bottom: initial;
88
  border-top: 6px solid #fff;
89
}
90

91
.daterangepicker.single .daterangepicker .ranges, .daterangepicker.single .drp-calendar {
92
  float: none;
93
}
94

95
.daterangepicker.single .drp-selected {
96
  display: none;
97
}
98

99
.daterangepicker.show-calendar .drp-calendar {
100
  display: block;
101
}
102

103
.daterangepicker.show-calendar .drp-buttons {
104
  display: block;
105
}
106

107
.daterangepicker.auto-apply .drp-buttons {
108
  display: none;
109
}
110

111
.daterangepicker .drp-calendar {
112
  display: none;
113
  max-width: 270px;
114
}
115

116
.daterangepicker .drp-calendar.left {
117
  padding: 8px 0 8px 8px;
118
}
119

120
.daterangepicker .drp-calendar.right {
121
  padding: 8px;
122
}
123

124
.daterangepicker .drp-calendar.single .calendar-table {
125
  border: none;
126
}
127

128
.daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span {
129
  color: #fff;
130
  border: solid black;
131
  border-width: 0 2px 2px 0;
132
  border-radius: 0;
133
  display: inline-block;
134
  padding: 3px;
135
}
136

137
.daterangepicker .calendar-table .next span {
138
  transform: rotate(-45deg);
139
  -webkit-transform: rotate(-45deg);
140
}
141

142
.daterangepicker .calendar-table .prev span {
143
  transform: rotate(135deg);
144
  -webkit-transform: rotate(135deg);
145
}
146

147
.daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
148
  white-space: nowrap;
149
  text-align: center;
150
  vertical-align: middle;
151
  min-width: 32px;
152
  width: 32px;
153
  height: 24px;
154
  line-height: 24px;
155
  font-size: 12px;
156
  border-radius: 4px;
157
  border: 1px solid transparent;
158
  white-space: nowrap;
159
  cursor: pointer;
160
}
161

162
.daterangepicker .calendar-table {
163
  border: 1px solid #fff;
164
  border-radius: 4px;
165
  background-color: #fff;
166
}
167

168
.daterangepicker .calendar-table table {
169
  width: 100%;
170
  margin: 0;
171
  border-spacing: 0;
172
  border-collapse: collapse;
173
}
174

175
.daterangepicker td.available:hover, .daterangepicker th.available:hover {
176
  background-color: #eee;
177
  border-color: transparent;
178
  color: inherit;
179
}
180

181
.daterangepicker td.week, .daterangepicker th.week {
182
  font-size: 80%;
183
  color: #ccc;
184
}
185

186
.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date {
187
  background-color: #fff;
188
  border-color: transparent;
189
  color: #999;
190
}
191

192
.daterangepicker td.in-range {
193
  background-color: #ebf4f8;
194
  border-color: transparent;
195
  color: #000;
196
  border-radius: 0;
197
}
198

199
.daterangepicker td.start-date {
200
  border-radius: 4px 0 0 4px;
201
}
202

203
.daterangepicker td.end-date {
204
  border-radius: 0 4px 4px 0;
205
}
206

207
.daterangepicker td.start-date.end-date {
208
  border-radius: 4px;
209
}
210

211
.daterangepicker td.active, .daterangepicker td.active:hover {
212
  background-color: #357ebd;
213
  border-color: transparent;
214
  color: #fff;
215
}
216

217
.daterangepicker th.month {
218
  width: auto;
219
}
220

221
.daterangepicker td.disabled, .daterangepicker option.disabled {
222
  color: #999;
223
  cursor: not-allowed;
224
  text-decoration: line-through;
225
}
226

227
.daterangepicker select.monthselect, .daterangepicker select.yearselect {
228
  font-size: 12px;
229
  padding: 1px;
230
  height: auto;
231
  margin: 0;
232
  cursor: default;
233
}
234

235
.daterangepicker select.monthselect {
236
  margin-right: 2%;
237
  width: 56%;
238
}
239

240
.daterangepicker select.yearselect {
241
  width: 40%;
242
}
243

244
.daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {
245
  width: 50px;
246
  margin: 0 auto;
247
  background: #eee;
248
  border: 1px solid #eee;
249
  padding: 2px;
250
  outline: 0;
251
  font-size: 12px;
252
}
253

254
.daterangepicker .calendar-time {
255
  text-align: center;
256
  margin: 4px auto 0 auto;
257
  line-height: 30px;
258
  position: relative;
259
}
260

261
.daterangepicker .calendar-time select.disabled {
262
  color: #ccc;
263
  cursor: not-allowed;
264
}
265

266
.daterangepicker .drp-buttons {
267
  clear: both;
268
  text-align: right;
269
  padding: 8px;
270
  border-top: 1px solid #ddd;
271
  display: none;
272
  line-height: 12px;
273
  vertical-align: middle;
274
}
275

276
.daterangepicker .drp-selected {
277
  display: inline-block;
278
  font-size: 12px;
279
  padding-right: 8px;
280
}
281

282
.daterangepicker .drp-buttons .btn {
283
  margin-left: 8px;
284
  font-size: 12px;
285
  font-weight: bold;
286
  padding: 4px 8px;
287
}
288

289
.daterangepicker.show-ranges.single.rtl .drp-calendar.left {
290
  border-right: 1px solid #ddd;
291
}
292

293
.daterangepicker.show-ranges.single.ltr .drp-calendar.left {
294
  border-left: 1px solid #ddd;
295
}
296

297
.daterangepicker.show-ranges.rtl .drp-calendar.right {
298
  border-right: 1px solid #ddd;
299
}
300

301
.daterangepicker.show-ranges.ltr .drp-calendar.left {
302
  border-left: 1px solid #ddd;
303
}
304

305
.daterangepicker .ranges {
306
  float: none;
307
  text-align: left;
308
  margin: 0;
309
}
310

311
.daterangepicker.show-calendar .ranges {
312
  margin-top: 8px;
313
}
314

315
.daterangepicker .ranges ul {
316
  list-style: none;
317
  margin: 0 auto;
318
  padding: 0;
319
  width: 100%;
320
}
321

322
.daterangepicker .ranges li {
323
  font-size: 12px;
324
  padding: 8px 12px;
325
  cursor: pointer;
326
}
327

328
.daterangepicker .ranges li:hover {
329
  background-color: #eee;
330
}
331

332
.daterangepicker .ranges li.active {
333
  background-color: #08c;
334
  color: #fff;
335
}
336

337
/*  Larger Screen Styling */
338
@media (min-width: 564px) {
339
  .daterangepicker {
340
    width: auto;
341
  }
342

343
  .daterangepicker .ranges ul {
344
    width: 140px;
345
  }
346

347
  .daterangepicker.single .ranges ul {
348
    width: 100%;
349
  }
350

351
  .daterangepicker.single .drp-calendar.left {
352
    clear: none;
353
  }
354

355
  .daterangepicker.single .ranges, .daterangepicker.single .drp-calendar {
356
    float: left;
357
  }
358

359
  .daterangepicker {
360
    direction: ltr;
361
    text-align: left;
362
  }
363

364
  .daterangepicker .drp-calendar.left {
365
    clear: left;
366
    margin-right: 0;
367
  }
368

369
  .daterangepicker .drp-calendar.left .calendar-table {
370
    border-right: none;
371
    border-top-right-radius: 0;
372
    border-bottom-right-radius: 0;
373
  }
374

375
  .daterangepicker .drp-calendar.right {
376
    margin-left: 0;
377
  }
378

379
  .daterangepicker .drp-calendar.right .calendar-table {
380
    border-left: none;
381
    border-top-left-radius: 0;
382
    border-bottom-left-radius: 0;
383
  }
384

385
  .daterangepicker .drp-calendar.left .calendar-table {
386
    padding-right: 8px;
387
  }
388

389
  .daterangepicker .ranges, .daterangepicker .drp-calendar {
390
    float: left;
391
  }
392
}
393

394
@media (min-width: 730px) {
395
  .daterangepicker .ranges {
396
    width: auto;
397
  }
398

399
  .daterangepicker .ranges {
400
    float: left;
401
  }
402

403
  .daterangepicker.rtl .ranges {
404
    float: right;
405
  }
406

407
  .daterangepicker .drp-calendar.left {
408
    clear: none !important;
409
  }
410
}
411