.daterange {
    position: relative
}
.daterange * {
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.daterange div,
.daterange li,
.daterange span,
.daterange ul {
    margin: 0;
    padding: 0;
    border: 0
}
.daterange ul {
    list-style: none
}
.daterange.dr-active {
    z-index: 10
}
.daterange .dr-input {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    border: 1px solid #C3CACD;
    border-radius: 5px;
    background-color: #FFF;
    position: relative;
    z-index: 5;
    overflow: hidden
}
.daterange .dr-input:hover {
    border-color: #2693D5
}
.daterange .dr-input.dr-active {
    box-shadow: 0 0 0 3px rgba(191, 222, 236, .8);
    border-color: #2693D5
}
.daterange .dr-input .dr-dates {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 1.5rem 0 .75rem;
    min-width: 230px
}
.daterange .dr-input .dr-dates .dr-date {
    font-size: .9375rem;
    padding: .65625rem 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    outline: 0
}
.daterange .dr-input .dr-dates .dr-date.dr-active,
.daterange .dr-input .dr-dates .dr-date:focus,
.daterange .dr-input .dr-dates .dr-date:hover {
    color: #2693D5
}
.daterange .dr-input .dr-dates .dr-dates-dash {
    color: #C3CACD;
    position: relative;
    top: -2px;
    padding: 0 5px;
    -webkit-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    text-align: center
}
.daterange .dr-input .dr-presets {
    width: 2.1875rem;
    border-left: 1px solid #C3CACD;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    cursor: pointer;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}
.daterange .dr-input .dr-presets.dr-active,
.daterange .dr-input .dr-presets:hover {
    border-color: #2693D5;
    box-shadow: inset 0 2px 3px #EBF1F4
}
.daterange .dr-input .dr-presets.dr-active .dr-preset-bar,
.daterange .dr-input .dr-presets:hover .dr-preset-bar {
    background-color: #2693D5
}
.daterange .dr-input .dr-presets .dr-preset-bar {
    height: 2px;
    background-color: #C3CACD;
    margin: 1px 0 1px 25%
}
.daterange .dr-input .dr-presets .dr-preset-bar:nth-child(1) {
    width: 50%
}
.daterange .dr-input .dr-presets .dr-preset-bar:nth-child(2) {
    width: 40%
}
.daterange .dr-input .dr-presets .dr-preset-bar:nth-child(3) {
    width: 30%
}
.daterange .dr-selections {
    position: absolute
}
.daterange .dr-selections .dr-calendar {
    background-color: #FFF;
    font-size: .9375rem;
    box-shadow: 0 0 5px #C3CACD;
    border-radius: 0 0 5px 5px;
    position: relative;
    overflow: hidden;
    z-index: 4;
    padding-top: 5px;
    top: -5px;
    left: 4px;
    transition: width .2s;
    min-width: 210px
}
.daterange .dr-selections .dr-calendar .dr-range-switcher {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .375rem .5rem;
    font-size: .875rem
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid rgba(195, 202, 205, .5);
    border-radius: 5px;
    height: 1.5625rem
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i {
    color: #C3CACD;
    position: relative;
    top: -1px;
    cursor: pointer;
    font-size: .75rem;
    height: 100%;
    width: 20px
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i:hover:after,
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i:hover:before {
    background-color: #2693D5
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i.dr-disabled {
    pointer-events: none;
    opacity: 0
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i:after,
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i:before {
    content: "";
    position: absolute;
    width: 7px;
    height: 2px;
    background-color: #C3CACD;
    border-radius: 1px;
    left: 50%
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i.dr-left:before {
    top: calc(50% - 2px);
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg)
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i.dr-left:after {
    top: calc(50% + 2px);
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i.dr-right:before {
    top: calc(50% - 2px);
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-switcher i.dr-right:after {
    top: calc(50% + 2px);
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg)
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-month-switcher {
    width: 100%;
    margin-right: .375rem
}
.daterange .dr-selections .dr-calendar .dr-range-switcher .dr-year-switcher {
    min-width: 80px
}
.daterange .dr-selections .dr-calendar .dr-days-of-week-list {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    background-color: #EBF1F4;
    font-size: .625rem;
    color: #9BA3A7;
    padding: .3125rem 0;
    border: 1px solid rgba(195, 202, 205, .5);
    border-left: none;
    border-right: none
}
.daterange .dr-selections .dr-calendar .dr-days-of-week-list .dr-day-of-week {
    width: calc(100% / 7);
    text-align: center
}
.daterange .dr-selections .dr-calendar .dr-day-list {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-day {
    padding: .3125rem;
    text-align: center;
    width: calc(100% / 7);
    cursor: pointer
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-day.dr-hover:not(.dr-current) {
    background-color: #EBF1F4!important
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-day.dr-hover-before {
    border-left: 2px solid #2693D5!important;
    border-radius: 2px 0 0 2px;
    padding-left: .1875rem!important
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-day.dr-hover-after {
    border-right: 2px solid #2693D5!important;
    border-radius: 0 2px 2px 0;
    padding-right: .1875rem!important
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-end,
.daterange .dr-selections .dr-calendar .dr-day-list .dr-selected,
.daterange .dr-selections .dr-calendar .dr-day-list .dr-start {
    background-color: #EBF1F4
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-maybe {
    background-color: #EBF1F4!important
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-fade {
    color: #C3CACD
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-start {
    border-left: 2px solid #2693D5;
    border-radius: 2px 0 0 2px;
    padding-left: .1875rem
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-end {
    border-right: 2px solid #2693D5;
    border-radius: 0 2px 2px 0;
    padding-right: .1875rem
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-current {
    color: #2693D5!important;
    background-color: rgba(38, 147, 213, .2)!important
}
.daterange .dr-selections .dr-calendar .dr-day-list .dr-outside {
    pointer-events: none;
    cursor: default;
    color: rgba(195, 202, 205, .5)
}
.daterange .dr-selections .dr-preset-list {
    background-color: #FFF;
    color: #2693D5;
    font-size: .9375rem;
    box-shadow: 0 0 5px #C3CACD;
    border-radius: 0 0 5px 5px;
    position: relative;
    overflow: hidden;
    z-index: 4;
    padding-top: 5px;
    top: -5px;
    left: 4px;
    width: 100%
}
.daterange .dr-selections .dr-list-item {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding: .75rem .625rem;
    border-bottom: 1px solid #EBF1F4;
    cursor: pointer;
    white-space: nowrap
}
.daterange .dr-selections .dr-list-item:hover {
    background-color: #EBF1F4
}
.daterange .dr-selections .dr-list-item .dr-item-aside {
    color: #9BA3A7;
    font-size: .75rem;
    margin-left: .3125rem
}
.daterange--single .dr-input {
    cursor: text
}
.daterange--single .dr-input .dr-dates {
    padding: 0;
    min-width: 160px;
    width: 100%
}
.daterange--single .dr-input .dr-dates .dr-date {
    width: 100%;
    padding: .65625rem .75rem;
    text-align: left
}
.daterange {
    float: left;
    padding: 20px
}
