/**
 * @file
 * This file contains styling for the BuroRaDer.DateRangePicker extension plugin
 * that turns the jQuery UI datepicker into a date range picker.
 */
.ui-datepicker td {
    border: 0;
    padding: 0px;width: 33px;
}
.ui-datepicker table {
    font-size: 1em;
}

.ui-autocomplete .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
    border: 1px solid rgba(0,0,0,0.4);
    background: #c5c5c5;
    font-weight: normal;
    color: #fff;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
    float: left;
    display: none;
}
.ui-datepicker {
    padding: 0;
}

.ui-datepicker-multi .ui-datepicker-group table {
    width: 100%;
    margin: 0 auto;
}
#ui-datepicker-div p{
    position: absolute;
    top: -39px;
    left: -1px;
    right: 0;
    width: 100.5%;
    font-size: 17px;
    text-align: center;
    height: 40px;
    background: #f3f3f3;
    padding-top: 5px;
    border: 1px solid #c5c5c5;
    border-bottom: 0px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}


.desti .ui-datepicker{
    margin-left: -65px !important;
}
.ui-datepicker {
    width: 35.8em !important;
    z-index: 99!important;
    margin: 0 auto;
    margin-top: 9px;
    background-color: rgba(255, 255, 255, 0.88);
    border: 1px solid #e0e0e0 !important;
    box-shadow: rgba(0,0,0,0.3) 0 0 30px 0;
}

.ui-datepicker1{
    width: 16.8em !important;
    z-index: 9999!important;
    margin-left: 25px;
    margin-top: 9px;
    background-color: rgba(255, 255, 255, 0.88);
    border: 1px solid #e0e0e0 !important;
    box-shadow: rgba(0,0,0,0.3) 0 0 30px 0;
}
.desti .ui-datepicker{
    margin-left: -65px !important;
}
.ui-datepicker:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 100%;
    margin: 0 auto;
    left: 0;
    right: 0;
    width: 0;
    height: 0;
    border-bottom: 10px solid #eff0f0;
    border-top: 10px solid transparent;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}


.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    border: 1px solid #dad55e;
    background: #ffff01;
    color: #444;
}

.ui-datepicker-group-first{
    border-right:1px solid #ccc;
}

.ui-datepicker-multi-2 .ui-datepicker-group {
    width: 50%;
    padding: 10px;
    height:245px;
    /* border-right: 1px solid #ccc; */
}
/*
 * Do not fade the color of the selected date range on non selectable elements.
 */
.date-range-start.ui-state-disabled,
.date-range-in.ui-state-disabled {
  opacity: initial;
}

/*
 * But do fade the text. Unfortunately we had to copy the RGB part value of the
 * color as well, making it "fail" when another color was defined as text color.
 */
.date-range-start.ui-state-disabled > .ui-state-active,
.date-range-start.ui-state-disabled > .ui-state-default,
.date-range-in.ui-state-disabled > .ui-state-active,
.date-range-in.ui-state-disabled > .ui-state-default {
  color: rgba(85, 85, 85, 0.35);
}

.date-range-start > .ui-state-active,
.date-range-start > .ui-state-default,
.date-range-in > .ui-state-active,
.date-range-in > .ui-state-default,
.date-range-is-to .date-range-end > .ui-state-active,
.date-range-is-to .date-range-end > .ui-state-default {
  background: #FFFF01 none;
  color: #444;
}

/*
 * Split day settings (for a LTR txt direction).
 */
.date-range-split-day .date-range-start,
.date-range-split-day .date-range-end {
  background-color: #e6e6e6;
}

.date-range-split-day .date-range-start > .ui-state-active, .date-range-split-day .date-range-start > .ui-state-default {
    background: #ffff01;
    font-weight: bold;
}

.date-range-split-day .date-range-end > .ui-state-active,
.date-range-split-day .date-range-end > .ui-state-default {
     background: #ffff01;
    color: #444; /* LTR */
}

/*
 * Split day settings for a RTL text direction.
 *
 * This plugin assumes that this is explicitly specified on a container element,
 * e.g. the html or body element. It will fail when a lower element reverses the
 * direction.
 */
[dir=rtl] .date-range-split-day .date-range-start > .ui-state-active,
[dir=rtl] .date-range-split-day .date-range-start > .ui-state-default {
  background: linear-gradient(to bottom left, transparent, transparent 50%, lightgreen 50%, lightgreen); /* RTL */
}

[dir=rtl] .date-range-split-day .date-range-end > .ui-state-active,
[dir=rtl] .date-range-split-day .date-range-end > .ui-state-default {
  background: linear-gradient(to top right, transparent, transparent 50%, lightgreen 50%, lightgreen); /* RTL */
}


/*
 * Buttons
 */
#ui-datepicker-div > button {
  float: right;
  margin-left: 0.5em;
}
/*#ui-datepicker-div .ui-state-default{
    border: none;
    *background: #ffffff;*
    font-weight: normal;
    color: #454545;
}*/
 #ui-datepicker-div .ui-state-default {
    border: none;
    /*background: rgba(255, 255, 255, 0);*/
    font-weight: normal;
    color: #000000;    width: 33px;    height: 29px;
}
.ui-widget-header .ui-icon {
    background-image: none; text-indent: 0;height: auto;
}

.ui-icon > span:before, .ui-icon:before {
    font-family: FontAwesome;color: #333; 
}
 #ui-datepicker-div > button {
    float: right;
    margin-left: 0.5em;
    display: none;
}
 .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover {
    top: 2px;
    
    background: rgba(255, 255, 255, 0) !important;
    outline: none;
    border: none;
}

 .ui-datepicker .ui-datepicker-next-hover {
    right: 2px;
}
 .ui-datepicker .ui-datepicker-prev {
    left: 2px;
}
/*.ui-datepicker-current-day {
    background: #ffff01;
    width: 30px;
    height: 30px;
    border-radius: 50%;
}*/

/* Buttons*/

/*#ui-datepicker-div > button {
  float: right;
  margin-left: 0.5em;
}*/

#ui-datepicker-div .ui-widget.ui-widget-content {
    border: 1px solid #ffffff;
    box-shadow: 0 0 6px rgba(0,0,0,0.4);border-radius: 8px;
}
#ui-datepicker-div .ui-widget-header {
    border: 1px solid #fff;
    background: #ffffff;
    color: #333;
    font-weight: bold;
}



#ui-datepicker-div .ui-widget {
    font-family: 'Open Sans', sans-serif;
    font-size: 1.1em;
}

/*.ui-datepicker-week-end {
    background:#fff;
    color:#2770a5;
}*/
.ui-datepicker td span, .ui-datepicker td a {
    display: block;
    padding: 4px;
    text-align: center;
    text-decoration: none;
    background: #fff;
}

.ui-autocomplete {
    border: 1px solid #ddd;
    background: #fff;
    color: #333;
    max-height: 132px;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 99999;
}

.ui-datepicker .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    color: #444;    border: none;
}

 .ui-state-active:hover {
    border: 1px solid #adadad;
    background: #adadad;
    font-weight: normal;
    color: #fff;
}

 .ui-datepicker .ui-datepicker-buttonpane button {
    float: right;
    margin: 0;
    cursor: pointer;
    width: auto;
    overflow: visible;
    position: absolute;
    top: 0px;
    padding: 0px 4px;
    right: 0px;
    border: 1px solid #ffffff;
    border-radius: 4px;
    background: #fff;
}

 .ui-datepicker .ui-state-hover, .ui-datepicker  .ui-widget-content .ui-state-hover{
     background:#ffff01;
     color:#444;
 }
 .ui-datepicker .ui-datepicker-buttonpane {
     display:none;
    background-image: none;
    margin: 0;
    top: 0px;
    right: 0;
    padding: 0 .2em;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    border: 0px;
    position: absolute;
}
 ui-datepicker-prev{

     background:rgba(255,255,255,0);
 }
 .ui-datepicker-next-hover{
     background:rgba(255,255,255,0);
 }


 /*.ui-datepicker:before {
    text-align: center;
    content: "Select Date";
    width: 100%;
    height: 30px;
    background: #f5f5f5;
    font-size: 17px;
}*/

 /*.returns-date #ui-datepicker-div:before {
    text-align: center;
    content: "Select Return Date";
    width: 100%;
    height: 30px;
    background: #f3f3f3;
    font-size: 18px;
}*/
 /*.ui-state-default, .ui-widget-content .ui-state-default {
    background: rgba(246, 246, 246, 0);
}*/



  .ui-widget-content .ui-state-default{
           background: rgba(246, 246, 246, 0);
        }
        .start-date .ui-state-default, .end-date .ui-state-default {
            background: #7d8285;
            color: #FFFFFF;
        }

        .between-date .ui-state-default {
            background: #9999FF;
        }


        .ui-datepicker-days-cell-over.dp-highlight > .ui-state-default {
            /*background-color: #7d8285 !important;*/
            background: #ffff01 url('../images/Rightarrow_bg.png') no-repeat !important;
            color: #fff !important;
            position: relative;
        }


        /*.ui-datepicker-days-cell-over.dp-highlight > .ui-state-default:after {
	       content: '';
            display: block;
            position: absolute;
            left: 100%;
            right: 0px;
            top: 50%;
            margin-top: -7px;
            width: 0;
            height: 0;
            border-top: 7px solid transparent;
            border-right: 7px solid transparent;
            border-bottom: 7px solid transparent;
            border-left: 7px solid #7d8285;
        }*/

        
        .dp-highlight .ui-state-default {
            background: #ffff01;
            color: #000;
        }

        .vikas-highlight .ui-state-default {
            /*background-color: #7d8285 !important;*/
             background:#ffff01 url('../images/Leftarrow_bg.png') right no-repeat !important;
            color: #fff !important;
            position: relative;
        }
        
        /*.vikas-highlight .ui-state-default:before {
            content: "";
            display: block;
            width: 0;
            height: 0;
            border-top: 8px solid transparent;
            border-bottom: 8px solid transparent;
            border-right: 8px solid #7d8285;
            position: absolute;
            top: 6.5px;
            left: -7px;
        }*/

        /*#ui-datepicker-div .ui-state-active {
            color: #FFFFCC;
        }*/

        #ui-datepicker-div .ui-state-highlight {
            background: rgba(255, 255, 255, 0);
            color: #000 !important;
            font-weight: 600;
        }

        .ui-datepicker.ui-datepicker-multi {
            border-radius: 4px;
            width: 542px;
        }

        .ui-datepicker .ui-datepicker-today .ui-state-default {
            opacity: inherit;
            /*background: #565f7c;*/
            color: #000 !important;
            font-weight: bold !important;
        }

        .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
            border: 1px solid #dad55e;
            background: #f6f6f6;
            color: #444;
        }

        .ui-datepicker .ui-datepicker-today {
            opacity: inherit;
            font-weight: bold;
        }

        .ui-datepicker-mutlti {
            /*margin-left: -65px !important;*/
            margin-left: -150px !important;
            width: 20em;
        }


        .ui-datepicker th {
    padding: .3em .3em;
    text-align: center;
    font-weight: bold;
    border: 0;
}
 .ui-datepicker-other-month{
            opacity:0 !important;
        }