1/*!
2 * Stylesheet for the Date Range Picker, for use with Bootstrap 2.x
3 *
4 * Copyright 2013 Dan Grossman ( http://www.dangrossman.info )
5 * Licensed under the Apache License v2.0
6 * http://www.apache.org/licenses/LICENSE-2.0
7 *
8 * Built for http://www.improvely.com
9 */
10
11.daterangepicker.dropdown-menu {
12  max-width: none;
13  z-index: 3000;
14}
15
16.daterangepicker.opensleft .ranges, .daterangepicker.opensleft .calendar {
17  float: left;
18  margin: 4px;
19}
20
21.daterangepicker.opensright .ranges, .daterangepicker.opensright .calendar {
22  float: right;
23  margin: 4px;
24}
25
26.daterangepicker .ranges {
27  width: 160px;
28  text-align: left;
29}
30
31.daterangepicker .ranges .range_inputs>div {
32  float: left;
33}
34
35.daterangepicker .ranges .range_inputs>div:nth-child(2) {
36  padding-left: 11px;
37}
38
39.daterangepicker .calendar {
40  display: none;
41  max-width: 250px;
42}
43
44.daterangepicker .calendar th, .daterangepicker .calendar td {
45  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
46  white-space: nowrap;
47  text-align: center;
48}
49
50.daterangepicker .ranges label {
51  color: #333;
52  font-size: 11px;
53  margin-bottom: 2px;
54  text-transform: uppercase;
55  text-shadow: 1px 1px 0 #fff;
56}
57
58.daterangepicker .ranges input {
59  font-size: 11px;
60}
61
62.daterangepicker .ranges ul {
63  list-style: none;
64  margin: 0;
65  padding: 0;
66}
67
68.daterangepicker .ranges li {
69  font-size: 13px;
70  background: #f5f5f5;
71  border: 1px solid #f5f5f5;
72  color: #08c;
73  padding: 3px 12px;
74  margin-bottom: 8px;
75  -webkit-border-radius: 5px;
76  -moz-border-radius: 5px;
77  border-radius: 5px;
78  cursor: pointer;
79}
80
81.daterangepicker .ranges li.active, .daterangepicker .ranges li:hover {
82  background: #08c;
83  border: 1px solid #08c;
84  color: #fff;
85}
86
87.daterangepicker .calendar-date {
88  border: 1px solid #ddd;
89  padding: 4px;
90  border-radius: 4px;
91  background: #fff;
92}
93
94.daterangepicker .calendar-time {
95  text-align: center;
96  margin: 8px auto 0 auto;
97  line-height: 30px;
98}
99
100.daterangepicker {
101  position: absolute;
102  background: #fff;
103  top: 100px;
104  left: 20px;
105  padding: 4px;
106  margin-top: 1px;
107  -webkit-border-radius: 4px;
108  -moz-border-radius: 4px;
109  border-radius: 4px;
110}
111
112.daterangepicker.opensleft:before {
113  position: absolute;
114  top: -7px;
115  right: 9px;
116  display: inline-block;
117  border-right: 7px solid transparent;
118  border-bottom: 7px solid #ccc;
119  border-left: 7px solid transparent;
120  border-bottom-color: rgba(0, 0, 0, 0.2);
121  content: '';
122}
123
124.daterangepicker.opensleft:after {
125  position: absolute;
126  top: -6px;
127  right: 10px;
128  display: inline-block;
129  border-right: 6px solid transparent;
130  border-bottom: 6px solid #fff;
131  border-left: 6px solid transparent;
132  content: '';
133}
134
135.daterangepicker.opensright:before {
136  position: absolute;
137  top: -7px;
138  left: 9px;
139  display: inline-block;
140  border-right: 7px solid transparent;
141  border-bottom: 7px solid #ccc;
142  border-left: 7px solid transparent;
143  border-bottom-color: rgba(0, 0, 0, 0.2);
144  content: '';
145}
146
147.daterangepicker.opensright:after {
148  position: absolute;
149  top: -6px;
150  left: 10px;
151  display: inline-block;
152  border-right: 6px solid transparent;
153  border-bottom: 6px solid #fff;
154  border-left: 6px solid transparent;
155  content: '';
156}
157
158.daterangepicker table {
159  width: 100%;
160  margin: 0;
161}
162
163.daterangepicker td, .daterangepicker th {
164  text-align: center;
165  width: 20px;
166  height: 20px;
167  -webkit-border-radius: 4px;
168  -moz-border-radius: 4px;
169  border-radius: 4px;
170  cursor: pointer;
171  white-space: nowrap;
172}
173
174.daterangepicker td.off {
175  color: #999;
176}
177
178.daterangepicker td.disabled {
179  color: #999;
180}
181
182.daterangepicker td.available:hover, .daterangepicker th.available:hover {
183  background: #eee;
184}
185
186.daterangepicker td.in-range {
187  background: #ebf4f8;
188  -webkit-border-radius: 0;
189  -moz-border-radius: 0;
190  border-radius: 0;
191}
192
193.daterangepicker td.active, .daterangepicker td.active:hover {
194  background-color: #006dcc;
195  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
196  background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
197  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
198  background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
199  background-image: -o-linear-gradient(top, #0088cc, #0044cc);
200  background-image: linear-gradient(top, #0088cc, #0044cc);
201  background-repeat: repeat-x;
202  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
203  border-color: #0044cc #0044cc #002a80;
204  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
205  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
206  color: #fff;
207  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
208}
209
210.daterangepicker td.week, .daterangepicker th.week {
211  font-size: 80%;
212  color: #ccc;
213}
214
215.daterangepicker select.monthselect, .daterangepicker select.yearselect {
216  font-size: 12px;
217  padding: 1px;
218  height: auto;
219  margin: 0;
220  cursor: default;
221}
222
223.daterangepicker select.monthselect {
224  margin-right: 2%;
225  width: 56%;
226}
227
228.daterangepicker select.yearselect {
229  width: 40%;
230}
231
232.daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.ampmselect {
233  width: 60px;
234  margin-bottom: 0;
235}
236