#ui-datepicker-div
{
 font-size:17px;
 width:760px !important;
 border-radius:12px !important;
 border-bottom:solid 1px #dcdede !important;
  border-left:solid 1px #dcdede !important;
    border-right:solid 1px #dcdede !important;
     -moz-box-sizing: none !important;

 }
 
 

.ui-datepicker  *,
*:before,
*:after {
  -webkit-box-sizing: inherit;
     -moz-box-sizing:inherit;
          box-sizing: inherit;
}
 
 
.ie .ui-datepicker  *,
*:before,
*:after {
  -webkit-box-sizing: inherit;
     -moz-box-sizing:inherit;
          box-sizing: inherit;
}
 
 
 .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-radius:10px 10px 0px 0px !important;}
 

:after {
    -moz-box-sizing:none !important;
}
 

 
 .ui-datepicker {
    display: none;
    padding:0 !important ;
    width: 17em;
}   
    
.ui-datepicker-title select{border:solid 1px #b9bcc6;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    margin-left: 5px;
    border:none !important;
    color:#fff;
    cursor:pointer;
    font-size:20px
    -webkit-appearance:none;
}
.selectMonth_Outer {
   width: 130px;
   overflow: hidden;
   float:left;
   margin-left:27px;
   margin-top:4px;
}

.selectMonth_Outer select {
    padding: 5px 0px;
    width: 120% !important;
    border: none;
    box-shadow: none;
    background:#736a64 url("Calendar/base/images/slect_arrow.png") no-repeat 110px 10px  !important;
    cursor:pointer;
}

.selectMonth_Outer select:focus {
    outline: none;
    
}

.ui-datepicker-year select {
    padding: 5px 0px;
    width: 112% !important;
    border: none;
    box-shadow: none;
    background:#736a64 url("Calendar/base/images/slect_arrow.png") no-repeat 50px 10px  !important;
    cursor:pointer;
}

.ui-datepicker-year select:focus {
    outline: none;
    
}





.ui-datepicker td span, .ui-datepicker td a {
    display: block;
    padding: 0em 0em !important;
    text-align: center;
    text-decoration: none;
}



.selectYear_Outer {
   width: 70px;
   overflow: hidden;
   float:left;
   margin-left:30px;
   margin-top:4px;
}

.selectYear_Outer select {
    padding: 5px 0px;
    width: 118% !important;
    border: none;
    box-shadow: none;
    font-family: 'Lato', sans-serif;
    background:url("Calendar/base/images/slect_arrow.png") no-repeat 50px 10px#736a64 !important;
}

.selectYear_Outer select:focus {
    outline: none;
}





.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
   /*background: url("../../content/Calendar/base/images/ui-bg_glass_75_e6e6e6_1x400.png") repeat-x scroll 50% 50% #E6E6E6;
    border: 1px solid #D3D3D3;*/
    color: #667482;
    font-weight: normal;
    text-align: center;
    font-size: 16px;
}

.ui-state-active { border: 1px solid #999999/*{borderColorHover}*/; background:/*{bgColorHover}*/ url(images/calender-hover.png)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ no-repeat/*{bgHoverRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #fff/*{fcHover}*/;}


/*.ui-datepicker-week-end .ui-state-default{  background: url("images/ui-bg_glass_75_e6e6e6_1x4001.png") repeat-x scroll 50% 50% #e0e0e0;color:#000000;}*/
.ui-state-active
{

    
    /*background: url("../../content/Calendar/base/images/ui-bg_glass_55_fbf9ee_1x4001.png") repeat-x scroll 50% 50% #006E89!important;
    border: 1px solid #FCEFA1!important;*/
    color: #fff!important;
    }

#ui-datepicker-div{z-index:11111!important; padding-bottom:50px !important;}
/*#ui-datepicker-div{width: 500px!important;
    height: 316px!important;}*/
  
  /*  
.start-date .ui-state-default{background: url("images/ui-bg_glass_75_e6e6e6_1x4001.png") repeat-x scroll 50% 50% #183d50!important;}
.end-date .ui-state-default{background: url("images/ui-bg_glass_75_e6e6e6_1x4001.png") repeat-x scroll 50% 50% #183d50!important;}
.between-date .ui-state-default{background: url("images/ui-bg_glass_75_e6e6e6_1x4001.png") repeat-x scroll 50% 50% #183d50!important;}
*/

.start-date .ui-state-default {background: url("../../Calendar/base/images/calender-hover.png") no-repeat right top  !important;    color: #fff !important; height:47px; width:47px;}
.end-date .ui-state-default{background: url("../../Calendar/base/images/calender-hover.png") no-repeat left top  !important;color: #fff !important; height:47px; width:47px;}
.between-date .ui-state-default{background:#5c5c5c  !important;    color: #fff !important;height:47px; width:47px;}
.between-date .ui-state-default.ui-state-hover{background:#ccc  !important;color: #555555 !important;}
.between-date1 .ui-state-default{background:#ccc  !important;color: #555555 !important; }
 .ui-datepicker-unselectable.ui-state-disabled.start-date{opacity:1;filter:Alpha(Opacity=100);}
 
 .ui-widget-header {
    background:none !important;
   /* border: 1px solid #B9BCC6;*/
    font-weight: normal;
    border-right: 0px;
    height:46px;
    
    
}

.ui-datepicker{ -webkit-box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.15);
box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.15) ; }
.ui-widget-header{ border:none !important;}
.chrome .ui-widget-header {
   height:41px !important;
    
}


.ui-corner-right
{ 
    border-radius:0px 12px 0px 0px !important;
}

.ui-corner-left{ border-radius:12px 0px 0px 0px !important;}

.ui-datepicker .ui-datepicker-prev span 
{ 
    width:45px !important;
    height:46px !important;
    margin-top:-15px !important;
    margin-left:-16px !important;
   
    cursor:pointer;
    background: url("../../Calendar/base/images/arrow-left.png") no-repeat 15px 15px  !important;
}


.ui-datepicker .ui-datepicker-prev span:hover
{ 
    width:45px !important;
    height:46px !important;
    margin-top:-15px !important;
    margin-left:-16px !important;
   border:none;
    cursor:pointer;
    background: url("../../Calendar/base/images/arrow-left.png") no-repeat 15px 15px !important;
}





.ui-datepicker-prev.ui-corner-all.ui-state-disabled span 
{ 
    width:45px !important;
    height:46px !important;
    margin-top:-15px !important;
    margin-left:-16px !important;
  
    cursor:pointer;
    background: url("../../Calendar/base/images/arrow-left.png") no-repeat 15px 15px !important;
}

.ui-datepicker-prev.ui-corner-all.ui-state-disabled span:hover
{ 
    width:45px !important;
    height:46px !important;
    margin-top:-15px !important;
    margin-left:-16px !important;
  border:none;
    cursor:pointer;
    background: url("../../Calendar/base/images/arrow-left.png") no-repeat 15px 15px !important;
}


.ui-datepicker .ui-datepicker-next span {
    display: block;
    left: 50%;
    margin-left: -29px !important;
    margin-top: -15px !important;
    position: absolute;
    top: 50%;
    width: 46px !important;
    height: 46px !important;
  
    background: url("../../Calendar/base/images/arrow-right.png") no-repeat 15px 15px !important;
    cursor:pointer;
    font-family: 'Lato', sans-serif;
}

.ui-datepicker .ui-datepicker-prev{    left: 1px !important;  top: 0 !important;}
.ui-datepicker .ui-datepicker-next { right: 1px !important; top: 0 !important;}
.ui-datepicker-header .ui-state-hover{ background:none !important; border:none !important;}
.ui-state-default .ui-state-active{ color:#fff !important;}
.ui-datepicker .ui-datepicker-next span:hover {
    display: block;
    left: 50%;
    margin-left: -29px !important;
    margin-top: -15px !important;
    position: absolute;
    top: 50%;
    width: 46px !important;
    height: 46px !important;
    border:none;
    background: url("../../Calendar/base/images/arrow-right.png") no-repeat 15px 15px !important;
    cursor:pointer;
    font-family: 'Lato', sans-serif;
}
.ui-datepicker th {

    text-align: center;
    font-weight: normal  !important;
    color: #5d5d5d !important;

}

.ui-state-active{ background:none !important; border:solid 1px #333 !important}
.ui-datepicker-next.ui-corner-all.ui-state-disabled span 
{ 
    left: 50%;
    margin-left: -29px !important;
    margin-top: -15px !important;
    position: absolute;
    top: 50%;
    width: 45px !important;
    height: 46px !important;
   border:none;
    background: url("../../Calendar/base/images/arrow-right.png") no-repeat 15px 15px !important;
    cursor:pointer;
    font-family: 'Lato', sans-serif;
}

.ui-datepicker-next.ui-corner-all.ui-state-disabled span:hover
{ 
  left: 50%;
    margin-left: -29px !important;
    margin-top: -15px !important;
    position: absolute;
    top: 50%;
    width: 45px !important;
    height: 46px !important;
   border:none;
    background: url("../../Calendar/base/images/arrow-right.png") no-repeat 15px 15px !important;
    cursor:pointer;
    font-family: 'Lato', sans-serif;
}
.ui-datepicker-month {font-size: 20px; -moz-box-sizing: padding-box !important; color:#000 !important; display:inline-block;text-transform: uppercase; line-height:40px; font-family: 'Lato', sans-serif; text-align:center; vertical-align:middle; padding-left:5px; margin-top:-6px; font-weight:bold; }
.ui-datepicker-year {-moz-box-sizing: padding-box !important;  color:#000 !important; display:inline-block; padding-top:4px; padding-left:5px; font-weight:bold !important; font-size:20px;}
.ui-datepicker .ui-datepicker-title {-moz-box-sizing: padding-box !important;font-size:16px !important; font-family: 'Lato', sans-serif;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {   -moz-box-sizing: inherit !important;  text-align:left !important; text-transform:uppercase; cursor:pointer;}

.ui-datepicker-unselectable.end-date1{background:none;} 
.start-date, .start-date.end-date1{ background:#5c5c5c; border-radius: 30px 0px 0px 30px;  color:#fff !important;}
.end-date, .end-date1{ background:#5c5c5c;border-radius: 0px 30px 30px 0px;  color:#fff !important;}
.between-date{background:#5c5c5c; color:#fff !important;}
.between-date1{background:#ccc;}
.finalRow .bordereddate{border-radius: 0px 30px 30px 0px !important; background:#5c5c5c;}
.finalRow .bordereddate.start-date{background:#5c5c5c !important;border-radius: 30px 0px 0px 30px !important;}
.finalRow .start-date .ui-state-default{background:none !important;border-radius: 0;}
.between-date1.end-date{background:#ccc;padding:0;color:#555555 !important;border-radius:0 !important}
.between-date1.end-date a.ui-state-default.ui-state-active{color:#555555 !important;}
.ui-state-disabled.bordereddate{background:none;}
.between-date.bordereddate {background:#ccc;border-radius:0 !important}
.start-date a.ui-state-default.ui-state-active{ color:#fff !important;}
.end-date a.ui-state-default.ui-state-active{   color:#fff !important;}
.between-date a{ color:#fff !important;}
.bordereddate a.ui-state-hover{background:none !important;border:0 !important;border-radius:0 !important}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight 
{ 
  background: url("../../Calendar/base/images/text_bg.png") no-repeat !important;   
  color:#8d99a6 !important;
  width:47px;
  height:47px;
  -moz-box-sizing: inherit !important;
}
.ui-datepicker td { width:47px !important;padding: 0 !important;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {  border:none !important; height:47px; width:47px; line-height:47px; font-family: 'Lato', sans-serif;}
.closebox { position:absolute; right:15px; bottom:0px;}
div.closebox {  /*background: url("../Calendar/base/images/closebox.png") no-repeat !important; */  height:47px; width:47px;cursor:pointer; line-height:47px;}
div.closebox:hover {  /*background: url("../Calendar/base/images/closebox_hover.png") no-repeat !important; */  height:47px; width:47px; line-height:47px;}
div.closebox:before{content:"Close"; position:absolute; right:0; top:0; color:#5d5d5d;}

.ui-datepicker th {
    border: 0 none;
    font-weight: bold;
    padding: 0.7em 0.3em;
    text-align: center;
    color:#000;
    font-size:14px;
    font-family: 'Lato', sans-serif;
     -moz-box-sizing: padding-box !important;
}

.ui-datepicker .ui-datepicker-title {
    line-height: 1.8em;
    margin: 0 1.3em !important;
    text-align: center;
    -moz-box-sizing: padding-box !important;
}


.ui-widget-content { border:none !important; -moz-box-sizing: padding-box !important;}

 option:checked {
            background:#09a9d3 !important;
            color:#fff !important;
 }

 option:checked:hover, select:focus option:checked:hover {
                background:#09a9d3 !important;
                color:#fff !important;
                  -moz-box-sizing: padding-box !important;
}






	
/*custom dropdown*/
.monthDropdoen .dropdown{-moz-user-select:none; -moz-box-sizing: padding-box !important;text-transform: uppercase;  border:solid 1px transparent;font-size:20px; /*background:#68bd45 url("../Calendar/base/images/slect_arrow.png") no-repeat 120px 8px !important;*/color:#000;cursor:pointer;display:block;height:26px;line-height:26px;padding:0 0 0 8px;position:relative;text-align:left;text-decoration:none;white-space:nowrap;width:100%;float:left;  font-weight:bold !important;}
.monthDropdoen .dropdown:after{position:absolute;right:10px;color:#666}
.monthDropdoen .dropdown.open { border:solid 1px #ccc;}
.monthDropdoen .dropdown.small{width:160px}
.monthDropdoen .dropdown ul{list-style:none;padding:0;margin:0;position:absolute;top:26px;left:-1px;z-index:5;border:1px solid #ccc;width:100%;color:#ccc;background-color:#fff;display:none;color:#666;font-size:16px;width: 106px;}
.monthDropdoen .dropdown li{list-style:none;padding:0;margin:0;padding:2px 3px;text-indent:5px}
.monthDropdoen .dropdown li:hover{list-style:none;padding:0;margin:0;padding:2px 3px;text-indent:5px;background:#68bd45;color:#fff}
.monthDropdoen .dropdown li.other{color:#2e8fda;font-size:14px;background:0;border-top:1px solid #dedede}
.monthDropdoen .dropdown li.other:hover{background:#09a9d3;}
.monthDropdoen{margin-top:5px ;display:inline-block;}

.yearDropdoen{margin-top:5px ; display:inline-block;}
.yearDropdoen .dropdown{/*background:#68bd45 url("../Calendar/base/images/slect_arrow.png") no-repeat 55px 8px !important;*/-moz-box-sizing: padding-box !important;border:solid 1px transparent;color:#000;cursor:pointer;display:block;height:26px;line-height:26px;padding:0 0 0 8px;position:relative;text-align:left;text-decoration:none;white-space:nowrap;width:100%;float:left; font-size:20px;   font-weight:bold !important;}
.yearDropdoen .dropdown:after{position:absolute;right:10px;color:#666;  -moz-box-sizing:none !important;}
.yearDropdoen .dropdown.open { border:solid 1px #ccc;}
.yearDropdoen .dropdown.small{width:160px}
.yearDropdoen .dropdown ul{list-style:none;padding:0;margin:0;position:absolute;top:26px;left:-1px;z-index:5;border:1px solid #ccc;width:100%;color:#ccc;background-color:#fff;display:none;color:#666;font-size:16px}
.yearDropdoen .dropdown li{list-style:none;padding:0;margin:0;padding:2px 3px;text-indent:5px}
.yearDropdoen .dropdown li:hover{list-style:none;padding:0;margin:0;padding:2px 3px;text-indent:5px;background:#68bd45;color:#fff}
.yearDropdoen .dropdown li.other{color:#2e8fda;font-size:14px;background:0;border-top:1px solid #dedede}
.yearDropdoen .dropdown li.other:hover{background:#68bd45;}


.ui-datepicker .ui-datepicker-title{ width:50%; margin:4px auto !important;}
 

@media only screen and (max-width:800px) 
{
 #ui-datepicker-div{width: 15em!important; line-height:118%;}
 
  #ui-datepicker-div
{
 left:20% !important;
 width:300px !important;
 }
 

/*.monthDropdoen .dropdown{background:#736a64 url("../Calendar/base/images/slect_arrow.png") no-repeat 90px 8px !important; }*/

.ui-datepicker .ui-datepicker-title { font-size:12px !important;}
.selectMonth_Outer { width:100px;}
 .ui-datepicker th { font-size:13px;}
 .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { font-size:14px;}
 .selectYear_Outer select { width:97% !important;}
 .ui-widget-header { border-radius:10px;}
 .monthDropdoen { width:40%;}
 .yearDropdoen .dropdown { width:60%;}
 .yearDropdoen {width: 45%;margin-left: 13px;}
 .monthDropdoen .dropdown ul { font-size:12px;}
 .yearDropdoen .dropdown ul { font-size:12px;}
 #ui-datepicker-div {width: 374px !important;}
 .monthDropdoen .dropdown {font-size: 13px;}
 .yearDropdoen .dropdown {padding: 0 0 0 7px;font-size: 13px;}
 .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {height: 37px;width: 37px;line-height: 37px;background-size: 37px !important;}
 .ui-datepicker .ui-datepicker-title {width: 47%;display: flex;justify-content: center;}

}
 
 @media only screen and (max-width:479px) 
{
   #ui-datepicker-div
{

 width:300px !important;
 left:3% !important;
 }   
    
    .monthDropdoen {
	width: 54%;
}
.ui-datepicker .ui-datepicker-title {width: 60%;}
}