<input tabindex="2" type="text" is="e-datepicker" value="2015-05-05" class="e-input e-input-large">
<input tabindex="2" type="text" is="e-datepicker" value="2015-05-05" class="e-input e-input-large">
|
|||||||||||||||||||
| Mo | Tu | We | Th | Fr | Sa | Su | |||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
→
|
26
|
27
|
28
|
29
|
30
|
31
|
1
|
||||||||||||
|
→
|
2
|
3
|
4
|
5
|
6
|
7
|
8
|
||||||||||||
|
→
|
9
|
10
|
11
|
12
|
13
|
14
|
15
|
||||||||||||
|
→
|
16
|
17
|
18
|
19
|
20
|
21
|
22
|
||||||||||||
|
→
|
23
|
24
|
25
|
26
|
27
|
28
|
29
|
||||||||||||
|
→
|
30
|
1
|
2
|
3
|
4
|
5
|
6
|
||||||||||||
<div class="e-datepicker e-datepicker-weeks">
<div>
<span class="e-datepicker__prev">
<a href="#0">
<e-icon icon="caret-left"></e-icon>
</a>
</span>
<div class="e-datepicker__title">
<a href="#0">
2015
</a>
</div>
<span class="e-datepicker__next">
<a href="#0">
<e-icon icon="caret-right"></e-icon>
</a>
</span>
</div>
<table>
<thead>
<tr>
<td colspan="8">
<table width="100%">
<tbody>
<tr>
<td>
<div class="e-datepicker__day">
Jan
</div>
</td>
<td>
<div class="e-datepicker__day">
Feb
</div>
</td>
<td>
<div class="e-datepicker__day">
Mar
</div>
</td>
<td>
<div class="e-datepicker__day">
Apr
</div>
</td>
<td>
<div class="e-datepicker__day">
May
</div>
</td>
<td>
<div class="e-datepicker__day">
Jun
</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">
Jul
</div>
</td>
<td>
<div class="e-datepicker__day">
Aug
</div>
</td>
<td>
<div class="e-datepicker__day">
Sep
</div>
</td>
<td>
<div class="e-datepicker__day">
Oct
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
Nov
</div>
</td>
<td>
<div class="e-datepicker__day">
Dec
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<th></th>
<th>
Mo
</th>
<th>
Tu
</th>
<th>
We
</th>
<th>
Th
</th>
<th>
Fr
</th>
<th>
Sa
</th>
<th>
Su
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="e-datepicker__day">
→
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
26
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
27
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
28
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
29
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
30
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
31
</div>
</td>
<td>
<div class="e-datepicker__day">
1
</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">
→
</div>
</td>
<td>
<div class="e-datepicker__day">
2
</div>
</td>
<td>
<div class="e-datepicker__day">
3
</div>
</td>
<td>
<div class="e-datepicker__day">
4
</div>
</td>
<td>
<div class="e-datepicker__day">
5
</div>
</td>
<td>
<div class="e-datepicker__day">
6
</div>
</td>
<td>
<div class="e-datepicker__day">
7
</div>
</td>
<td>
<div class="e-datepicker__day">
8
</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">
→
</div>
</td>
<td>
<div class="e-datepicker__day">
9
</div>
</td>
<td>
<div class="e-datepicker__day">
10
</div>
</td>
<td>
<div class="e-datepicker__day">
11
</div>
</td>
<td>
<div class="e-datepicker__day">
12
</div>
</td>
<td>
<div class="e-datepicker__day">
13
</div>
</td>
<td>
<div class="e-datepicker__day">
14
</div>
</td>
<td>
<div class="e-datepicker__day">
15
</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">
→
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
16
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
17
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
18
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
19
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
20
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
21
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
22
</div>
</td>
</tr>
<tr>
<td>
<div onclick="selectWeek(4)" class="e-datepicker__day">
→
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
23
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
24
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
25
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
26
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
27
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
28
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
29
</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">
→
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">
30
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
1
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
2
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
3
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
4
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
5
</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">
6
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="e-datepicker e-datepicker-weeks">
<div><span class="e-datepicker__prev"><a href="#0">
<e-icon icon="caret-left"></e-icon></a></span>
<div class="e-datepicker__title"><a href="#0">2015</a></div><span class="e-datepicker__next"><a href="#0">
<e-icon icon="caret-right"></e-icon></a></span>
</div>
<table>
<thead>
<tr>
<td colspan="8">
<table width="100%">
<tbody>
<tr>
<td>
<div class="e-datepicker__day">Jan</div>
</td>
<td>
<div class="e-datepicker__day">Feb</div>
</td>
<td>
<div class="e-datepicker__day">Mar</div>
</td>
<td>
<div class="e-datepicker__day">Apr</div>
</td>
<td>
<div class="e-datepicker__day">May</div>
</td>
<td>
<div class="e-datepicker__day">Jun</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">Jul</div>
</td>
<td>
<div class="e-datepicker__day">Aug</div>
</td>
<td>
<div class="e-datepicker__day">Sep</div>
</td>
<td>
<div class="e-datepicker__day">Oct</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">Nov</div>
</td>
<td>
<div class="e-datepicker__day">Dec</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<th></th>
<th>Mo</th>
<th>Tu</th>
<th>We</th>
<th>Th</th>
<th>Fr</th>
<th>Sa</th>
<th>Su</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="e-datepicker__day">→</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">26</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">27</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">28</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">29</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">30</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">31</div>
</td>
<td>
<div class="e-datepicker__day">1</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">→</div>
</td>
<td>
<div class="e-datepicker__day">2</div>
</td>
<td>
<div class="e-datepicker__day">3</div>
</td>
<td>
<div class="e-datepicker__day">4</div>
</td>
<td>
<div class="e-datepicker__day">5</div>
</td>
<td>
<div class="e-datepicker__day">6</div>
</td>
<td>
<div class="e-datepicker__day">7</div>
</td>
<td>
<div class="e-datepicker__day">8</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">→</div>
</td>
<td>
<div class="e-datepicker__day">9</div>
</td>
<td>
<div class="e-datepicker__day">10</div>
</td>
<td>
<div class="e-datepicker__day">11</div>
</td>
<td>
<div class="e-datepicker__day">12</div>
</td>
<td>
<div class="e-datepicker__day">13</div>
</td>
<td>
<div class="e-datepicker__day">14</div>
</td>
<td>
<div class="e-datepicker__day">15</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">→</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">16</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">17</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">18</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">19</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">20</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">21</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">22</div>
</td>
</tr>
<tr>
<td>
<div onclick="selectWeek(4)" class="e-datepicker__day">→</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">23</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">24</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">25</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">26</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">27</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">28</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">29</div>
</td>
</tr>
<tr>
<td>
<div class="e-datepicker__day">→</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-current">30</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">1</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">2</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">3</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">4</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">5</div>
</td>
<td>
<div class="e-datepicker__day e-datepicker__day-alternate">6</div>
</td>
</tr>
</tbody>
</table>
</div><div style="position: relative; height: 375px;">
<div style="position: absolute; top: 0; left: 31px; z-index: 1; display: block;" class="ui-datepicker">
<div class="ui-datepicker-header">
<a title="Prev" class="ui-datepicker-prev">
<span class="ui-icon ui-icon-circle-triangle-w">
Prev
</span>
</a>
<a title="Next" class="ui-datepicker-next">
<span class="ui-icon ui-icon-circle-triangle-e">
Next
</span>
</a>
<div class="ui-datepicker-title">
<span class="ui-datepicker-month">
November
</span>
<span class="ui-datepicker-year">
2015
</span>
</div>
</div>
<table class="ui-datepicker-calendar">
<thead>
<tr>
<th class="ui-datepicker-week-end">
<span title="Sunday">
Su
</span>
</th>
<th>
<span title="Monday">
Mo
</span>
</th>
<th>
<span title="Tuesday">
Tu
</span>
</th>
<th>
<span title="Wednesday">
We
</span>
</th>
<th>
<span title="Thursday">
Th
</span>
</th>
<th>
<span title="Friday">
Fr
</span>
</th>
<th class="ui-datepicker-week-end">
<span title="Saturday">
Sa
</span>
</th>
</tr>
</thead>
<tbody>
<tr>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
1
</a>
</td>
<td>
<a href="#" class="ui-state-default">
2
</a>
</td>
<td>
<a href="#" class="ui-state-default">
3
</a>
</td>
<td>
<a href="#" class="ui-state-default">
4
</a>
</td>
<td>
<a href="#" class="ui-state-default">
5
</a>
</td>
<td>
<a href="#" class="ui-state-default">
6
</a>
</td>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
7
</a>
</td>
</tr>
<tr>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
8
</a>
</td>
<td>
<a href="#" class="ui-state-default">
9
</a>
</td>
<td>
<a href="#" class="ui-state-default">
10
</a>
</td>
<td>
<a href="#" class="ui-state-default">
11
</a>
</td>
<td>
<a href="#" class="ui-state-default">
12
</a>
</td>
<td>
<a href="#" class="ui-state-default">
13
</a>
</td>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
14
</a>
</td>
</tr>
<tr>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
15
</a>
</td>
<td class="ui-datepicker-current-day">
<a href="#" class="ui-state-default ui-state-active">
16
</a>
</td>
<td>
<a href="#" class="ui-state-default">
17
</a>
</td>
<td class="ui-datepicker-today">
<a href="#" class="ui-state-default ui-state-highlight">
18
</a>
</td>
<td>
<a href="#" class="ui-state-default">
19
</a>
</td>
<td>
<a href="#" class="ui-state-default">
20
</a>
</td>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
21
</a>
</td>
</tr>
<tr>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
22
</a>
</td>
<td>
<a href="#" class="ui-state-default">
23
</a>
</td>
<td>
<a href="#" class="ui-state-default">
24
</a>
</td>
<td>
<a href="#" class="ui-state-default">
25
</a>
</td>
<td>
<a href="#" class="ui-state-default">
26
</a>
</td>
<td>
<a href="#" class="ui-state-default">
27
</a>
</td>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
28
</a>
</td>
</tr>
<tr>
<td class="ui-datepicker-week-end">
<a href="#" class="ui-state-default">
29
</a>
</td>
<td>
<a href="#" class="ui-state-default">
30
</a>
</td>
<td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
<td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
<td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
<td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
<td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
</tr>
</tbody>
</table>
<div class="ui-timepicker-div">
<dl>
<div class="timepicker-input-container">
<label class="timepicker-title">
Time
</label>
<input type="text" value="00" maxlength="2" size="2" class="ui-timepicker-select-input">
<label>
:
</label>
<input type="text" value="00" maxlength="2" size="2" class="ui-timepicker-select-input">
</div>
</dl>
</div>
<div class="ui-datepicker-buttonpane ui-widget-content">
<button type="button" class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all">
Now
</button>
<button type="button" class="ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all">
Done
</button>
</div>
</div>
</div>
<div style="position: relative; height: 375px;">
<div style="position: absolute; top: 0; left: 31px; z-index: 1; display: block;" class="ui-datepicker">
<div class="ui-datepicker-header"><a title="Prev" class="ui-datepicker-prev"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a><a title="Next" class="ui-datepicker-next"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
<div class="ui-datepicker-title"><span class="ui-datepicker-month">November</span><span class="ui-datepicker-year">2015</span></div>
</div>
<table class="ui-datepicker-calendar">
<thead>
<tr>
<th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
<th><span title="Monday">Mo</span></th>
<th><span title="Tuesday">Tu</span></th>
<th><span title="Wednesday">We</span></th>
<th><span title="Thursday">Th</span></th>
<th><span title="Friday">Fr</span></th>
<th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
</tr>
</thead>
<tbody>
<tr>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">1</a></td>
<td><a href="#" class="ui-state-default">2</a></td>
<td><a href="#" class="ui-state-default">3</a></td>
<td><a href="#" class="ui-state-default">4</a></td>
<td><a href="#" class="ui-state-default">5</a></td>
<td><a href="#" class="ui-state-default">6</a></td>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
</tr>
<tr>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">8</a></td>
<td><a href="#" class="ui-state-default">9</a></td>
<td><a href="#" class="ui-state-default">10</a></td>
<td><a href="#" class="ui-state-default">11</a></td>
<td><a href="#" class="ui-state-default">12</a></td>
<td><a href="#" class="ui-state-default">13</a></td>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
</tr>
<tr>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">15</a></td>
<td class="ui-datepicker-current-day"><a href="#" class="ui-state-default ui-state-active">16</a></td>
<td><a href="#" class="ui-state-default">17</a></td>
<td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">18</a></td>
<td><a href="#" class="ui-state-default">19</a></td>
<td><a href="#" class="ui-state-default">20</a></td>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
</tr>
<tr>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">22</a></td>
<td><a href="#" class="ui-state-default">23</a></td>
<td><a href="#" class="ui-state-default">24</a></td>
<td><a href="#" class="ui-state-default">25</a></td>
<td><a href="#" class="ui-state-default">26</a></td>
<td><a href="#" class="ui-state-default">27</a></td>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
</tr>
<tr>
<td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">29</a></td>
<td><a href="#" class="ui-state-default">30</a></td>
<td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
</tr>
</tbody>
</table>
<div class="ui-timepicker-div">
<dl>
<div class="timepicker-input-container">
<label class="timepicker-title">Time</label>
<input type="text" value="00" maxlength="2" size="2" class="ui-timepicker-select-input">
<label> : </label>
<input type="text" value="00" maxlength="2" size="2" class="ui-timepicker-select-input">
</div>
</dl>
</div>
<div class="ui-datepicker-buttonpane ui-widget-content">
<button type="button" class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all">Now</button>
<button type="button" class="ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all">Done</button>
</div>
</div>
</div>| Oct 2015 | ||||||
|---|---|---|---|---|---|---|
| Sun | Mon | Tue | Wed | Thu | Fri | Sat |
| 27 | 28 | 29 | 30 | 1 | 2 | 3 |
| 4 | 5 | 6 | 7 | 8 | 9 | 10 |
| 11 | 12 | 13 | 14 | 15 | 16 | 17 |
| 18 | 19 | 20 | 21 | 22 | 23 | 24 |
| 25 | 26 | 27 | 28 | 29 | 30 | 31 |
| 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| Nov 2015 | ||||||
|---|---|---|---|---|---|---|
| Sun | Mon | Tue | Wed | Thu | Fri | Sat |
| 25 | 26 | 27 | 28 | 29 | 30 | 31 |
| 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| 8 | 9 | 10 | 11 | 12 | 13 | 14 |
| 15 | 16 | 17 | 18 | 19 | 20 | 21 |
| 22 | 23 | 24 | 25 | 26 | 27 | 28 |
| 29 | 30 | 1 | 2 | 3 | 4 | 5 |
<div class="e-row">
<div style="position: relative;" class="e-col-4 opened">
<div class="e-daterangepicker">
<e-icon icon="calendar-o" class-name="e-daterangepicker__icon"></e-icon>
<span class="e-daterangepicker__item">
Oct 20, 2015 - Nov 18, 2015
</span>
<small class="text-size-small">
Last 30 days
</small>
</div>
<div style="top: 25px; left: 45px; display: block;" class="e-daterangepicker__container">
<div class="e-field">
<div class="e-row">
<div class="e-col-4 e-col-condensed">
<div class="e-row">
<div class="e-field e-col-6 e-col-condensed">
<label for="daterangepicker_start" class="e-field__label">
Start date
</label>
<input type="text" name="daterangepicker_start" value class="e-input">
</div>
<div class="e-field e-col-6 e-col-condensed">
<label for="daterangepicker_end" class="e-field__label">
End date
</label>
<input type="text" name="daterangepicker_end" value class="e-input">
</div>
</div>
<div class="e-row">
<div class="e-col-12 e-daterangepicker__ranges">
<ul>
<li>
Last month
</li>
<li>
Last 7 days
</li>
<li class="active">
Last 30 days
</li>
<li>
Last 60 days
</li>
<li>
Last 90 days
</li>
</ul>
</div>
</div>
</div>
<div class="e-col-8 e-col-condensed e-daterangepicker__calendars">
<div class="e-row">
<div class="e-col-6 e-col-condensed">
<div class="e-datepicker">
<div class="calendar-date">
<table>
<thead>
<tr>
<th colspan="1" class="prev available"></th>
<th colspan="5" class="month">
Oct 2015
</th>
<th colspan="1" class="next available"></th>
</tr>
<tr>
<th>
Sun
</th>
<th>
Mon
</th>
<th>
Tue
</th>
<th>
Wed
</th>
<th>
Thu
</th>
<th>
Fri
</th>
<th>
Sat
</th>
</tr>
</thead>
<tbody>
<tr>
<td class="off">
27
</td>
<td class="off">
28
</td>
<td class="off">
29
</td>
<td class="off">
30
</td>
<td>
1
</td>
<td>
2
</td>
<td>
3
</td>
</tr>
<tr>
<td>
4
</td>
<td>
5
</td>
<td>
6
</td>
<td>
7
</td>
<td>
8
</td>
<td>
9
</td>
<td>
10
</td>
</tr>
<tr>
<td>
11
</td>
<td>
12
</td>
<td>
13
</td>
<td>
14
</td>
<td>
15
</td>
<td>
16
</td>
<td>
17
</td>
</tr>
<tr>
<td>
18
</td>
<td>
19
</td>
<td class="active start-date">
20
</td>
<td class="in-range">
21
</td>
<td class="in-range">
22
</td>
<td class="in-range">
23
</td>
<td class="in-range">
24
</td>
</tr>
<tr>
<td class="in-range">
25
</td>
<td class="in-range">
26
</td>
<td class="in-range">
27
</td>
<td class="in-range">
28
</td>
<td class="in-range">
29
</td>
<td class="in-range">
30
</td>
<td class="in-range">
31
</td>
</tr>
<tr>
<td class="off in-range">
1
</td>
<td class="off in-range">
2
</td>
<td class="off in-range">
3
</td>
<td class="off in-range">
4
</td>
<td class="off in-range">
5
</td>
<td class="off in-range">
6
</td>
<td class="off in-range">
7
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="e-col-6 e-col-condensed">
<div class="e-datepicker">
<div class="calendar-date">
<table class="table-condensed">
<thead>
<tr>
<th colspan="1" class="prev available"></th>
<th colspan="5" class="month">
Nov 2015
</th>
<th colspan="1" class="next available"></th>
</tr>
<tr>
<th>
Sun
</th>
<th>
Mon
</th>
<th>
Tue
</th>
<th>
Wed
</th>
<th>
Thu
</th>
<th>
Fri
</th>
<th>
Sat
</th>
</tr>
</thead>
<tbody>
<tr>
<td class="off in-range">
25
</td>
<td class="off in-range">
26
</td>
<td class="off in-range">
27
</td>
<td class="off in-range">
28
</td>
<td class="off in-range">
29
</td>
<td class="off in-range">
30
</td>
<td class="off in-range">
31
</td>
</tr>
<tr>
<td class="in-range">
1
</td>
<td class="in-range">
2
</td>
<td class="in-range">
3
</td>
<td class="in-range">
4
</td>
<td class="in-range">
5
</td>
<td class="in-range">
6
</td>
<td class="in-range">
7
</td>
</tr>
<tr>
<td class="in-range">
8
</td>
<td class="in-range">
9
</td>
<td class="in-range">
10
</td>
<td class="in-range">
11
</td>
<td class="in-range">
12
</td>
<td class="in-range">
13
</td>
<td class="in-range">
14
</td>
</tr>
<tr>
<td class="in-range">
15
</td>
<td class="in-range">
16
</td>
<td class="in-range">
17
</td>
<td class="active end-date">
18
</td>
<td>
19
</td>
<td>
20
</td>
<td>
21
</td>
</tr>
<tr>
<td>
22
</td>
<td>
23
</td>
<td>
24
</td>
<td>
25
</td>
<td>
26
</td>
<td>
27
</td>
<td>
28
</td>
</tr>
<tr>
<td>
29
</td>
<td>
30
</td>
<td class="off">
1
</td>
<td class="off">
2
</td>
<td class="off">
3
</td>
<td class="off">
4
</td>
<td class="off">
5
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="e-row">
<div class="e-col-12">
<div class="e-buttongroup">
<button class="e-btn btn">
Cancel
</button>
<button class="e-btn">
Apply & select campaigns manually
</button>
<button class="e-btn e-btn-primary">
Apply
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="e-row">
<div style="position: relative;" class="e-col-4 opened">
<div class="e-daterangepicker">
<e-icon icon="calendar-o" class-name="e-daterangepicker__icon"></e-icon><span class="e-daterangepicker__item">Oct 20, 2015 - Nov 18, 2015</span><small class="text-size-small">Last 30 days</small>
</div>
<div style="top: 25px; left: 45px; display: block;" class="e-daterangepicker__container">
<div class="e-field">
<div class="e-row">
<div class="e-col-4 e-col-condensed">
<div class="e-row">
<div class="e-field e-col-6 e-col-condensed">
<label for="daterangepicker_start" class="e-field__label">Start date</label>
<input type="text" name="daterangepicker_start" value="" class="e-input">
</div>
<div class="e-field e-col-6 e-col-condensed">
<label for="daterangepicker_end" class="e-field__label">End date</label>
<input type="text" name="daterangepicker_end" value="" class="e-input">
</div>
</div>
<div class="e-row">
<div class="e-col-12 e-daterangepicker__ranges">
<ul>
<li>Last month</li>
<li>Last 7 days</li>
<li class="active">Last 30 days</li>
<li>Last 60 days</li>
<li>Last 90 days</li>
</ul>
</div>
</div>
</div>
<div class="e-col-8 e-col-condensed e-daterangepicker__calendars">
<div class="e-row">
<div class="e-col-6 e-col-condensed">
<div class="e-datepicker">
<div class="calendar-date">
<table>
<thead>
<tr>
<th colspan="1" class="prev available"></th>
<th colspan="5" class="month">Oct 2015</th>
<th colspan="1" class="next available"></th>
</tr>
<tr>
<th>Sun</th>
<th>Mon</th>
<th>Tue</th>
<th>Wed</th>
<th>Thu</th>
<th>Fri</th>
<th>Sat</th>
</tr>
</thead>
<tbody>
<tr>
<td class="off">27</td>
<td class="off">28</td>
<td class="off">29</td>
<td class="off">30</td>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
</tr>
<tr>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
</tr>
<tr>
<td>18</td>
<td>19</td>
<td class="active start-date">20</td>
<td class="in-range">21</td>
<td class="in-range">22</td>
<td class="in-range">23</td>
<td class="in-range">24</td>
</tr>
<tr>
<td class="in-range">25</td>
<td class="in-range">26</td>
<td class="in-range">27</td>
<td class="in-range">28</td>
<td class="in-range">29</td>
<td class="in-range">30</td>
<td class="in-range">31</td>
</tr>
<tr>
<td class="off in-range">1</td>
<td class="off in-range">2</td>
<td class="off in-range">3</td>
<td class="off in-range">4</td>
<td class="off in-range">5</td>
<td class="off in-range">6</td>
<td class="off in-range">7</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="e-col-6 e-col-condensed">
<div class="e-datepicker">
<div class="calendar-date">
<table class="table-condensed">
<thead>
<tr>
<th colspan="1" class="prev available"></th>
<th colspan="5" class="month">Nov 2015</th>
<th colspan="1" class="next available"></th>
</tr>
<tr>
<th>Sun</th>
<th>Mon</th>
<th>Tue</th>
<th>Wed</th>
<th>Thu</th>
<th>Fri</th>
<th>Sat</th>
</tr>
</thead>
<tbody>
<tr>
<td class="off in-range">25</td>
<td class="off in-range">26</td>
<td class="off in-range">27</td>
<td class="off in-range">28</td>
<td class="off in-range">29</td>
<td class="off in-range">30</td>
<td class="off in-range">31</td>
</tr>
<tr>
<td class="in-range">1</td>
<td class="in-range">2</td>
<td class="in-range">3</td>
<td class="in-range">4</td>
<td class="in-range">5</td>
<td class="in-range">6</td>
<td class="in-range">7</td>
</tr>
<tr>
<td class="in-range">8</td>
<td class="in-range">9</td>
<td class="in-range">10</td>
<td class="in-range">11</td>
<td class="in-range">12</td>
<td class="in-range">13</td>
<td class="in-range">14</td>
</tr>
<tr>
<td class="in-range">15</td>
<td class="in-range">16</td>
<td class="in-range">17</td>
<td class="active end-date">18</td>
<td>19</td>
<td>20</td>
<td>21</td>
</tr>
<tr>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
<tr>
<td>29</td>
<td>30</td>
<td class="off">1</td>
<td class="off">2</td>
<td class="off">3</td>
<td class="off">4</td>
<td class="off">5</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="e-row">
<div class="e-col-12">
<div class="e-buttongroup">
<button class="e-btn btn">Cancel</button>
<button class="e-btn">Apply & select campaigns manually</button>
<button class="e-btn e-btn-primary">Apply</button>
</div>
</div>
</div>
</div>
</div>
</div>