#ui-datepicker-div
{
 font-size:15px;
 width:600px !important;
font-family: 'Lato', sans-serif;
 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:#685d7b url("/content/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:#685d7b url("/content/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("/content/Calendar/base/images/slect_arrow.png") no-repeat 50px 10px#685d7b !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 !important;
    font-weight: normal;
    text-align: center;
    font-size: 16px;
}
/*.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;}
/*#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("../../content/Calendar/base/images/sitemapcalender-hover.png") no-repeat right top  !important;    color: #fff !important; height:47px; width:47px;}
.end-date .ui-state-default{background: url("../../content/Calendar/base/images/sitemapcalender-hover.png") no-repeat left top  !important;color: #fff !important; height:47px; width:47px;}
.between-date .ui-state-default{background: url("../../content/Calendar/base/images/sitemapcalender-hover.png") no-repeat right top  !important;    color: #fff !important;height:47px; width:47px;}

 .ui-datepicker-unselectable.ui-state-disabled.start-date{opacity:1;filter:Alpha(Opacity=100);}
 
 .ui-widget-header {
    background:#685d7b !important;
   /* border: 1px solid #B9BCC6;*/
    font-weight: normal;
    border-right: 0px;
    height:41px;
    background:#685d7b;
    border:none !important;
    box-shadow:1px 1px 4px #898989;
    border-radius:0px 0px 0px 0px;
   -moz-box-sizing: padding-box !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;
    border-radius:12px 0px 0px 0px !important;
    cursor:pointer;
    background: url("/content/Calendar/base/images/arrow-left.png") no-repeat 15px 15px #9587ac !important;
}


.ui-datepicker .ui-datepicker-prev span:hover
{ 
    width:45px !important;
    height:46px !important;
    margin-top:-15px !important;
    margin-left:-16px !important;
    border-radius:12px 0px 0px 0px !important;
    cursor:pointer;
    background: url("/content/Calendar/base/images/arrow-left.png") no-repeat 15px 15px #90825c !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;
    border-radius:12px 0px 0px 0px !important;
    cursor:pointer;
    background: url("/content/Calendar/base/images/arrow-left.png") no-repeat 15px 15px #9587ac !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-radius:12px 0px 0px 0px !important;
    cursor:pointer;
    background: url("/content/Calendar/base/images/arrow-left.png") no-repeat 15px 15px #9587ac !important;
}


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

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

.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-radius: 0px 12px 0px 0px;
    background: url("/content/Calendar/base/images/arrow-right.png") no-repeat 15px 15px  #9587ac !important;
    cursor:pointer;
    font-family: 'Lato', sans-serif;
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
	border: 1px solid #999999;
	background: url(images/sitemapcalender-hover.png) 50% 50% no-repeat !important;
	font-weight: normal;
	color: #fff;
}


.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-radius: 0px 12px 0px 0px;
    background: url("/content/Calendar/base/images/arrow-right.png") no-repeat 15px 15px  #9587ac !important;
    cursor:pointer;
    font-family: 'Lato', sans-serif;
}
.ui-datepicker-month { -moz-box-sizing: padding-box !important; color:#fff !important; line-height:40px; font-family: 'Lato', sans-serif; text-align:center; vertical-align:middle; padding-left:2px; margin-top:-1px; float:left; text-transform:uppercase; font-weight:normal; letter-spacing:1px;}
.ui-datepicker-year {-moz-box-sizing: padding-box !important;  color:#fff !important; display:block; width:35%; float:right; padding-top:5px; padding-right:30px; font-weight:normal !important;}
.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-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight 
{ 
  background: url("/content/Calendar/base/images/sitemaptext_bg.png") no-repeat !important;   
  color:#8d99a6 !important;
  width:47px;
  height:47px;
  -moz-box-sizing: inherit !important;
}
.ui-datepicker td { width:37px !important;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {  border:none !important; height:37px; width:37px; line-height:37px; font-family: 'Lato', sans-serif;}
.closebox { position:absolute; right:-15px; top:-20px;}
div.closebox {  background: url("/content/Calendar/base/images/closebox.png") no-repeat !important;   height:37px; width:37px;cursor:pointer; line-height:37px;}
div.closebox:hover {  background: url("/content/Calendar/base/images/closebox_hover.png") no-repeat !important;   height:37px; width:37px; line-height:37px;}


.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:#685d7b !important;
            color:#fff !important;
 }

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






	
/*custom dropdown*/
.monthDropdoen .dropdown{-moz-user-select:none; -moz-box-sizing: padding-box !important; background:#685d7b url("/content/Calendar/base/images/slect_arrow.png") no-repeat 120px 8px !important;color:#fff;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;text-transform:uppercase; border:solid 1px #685d7b; letter-spacing:1px; font-weight:normal !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}
.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:#685d7b;color:#fff}
.monthDropdoen .dropdown li.other{color:#2e8fda;font-size:14px;background:0;border-top:1px solid #dedede}
.monthDropdoen .dropdown li.other:hover{background:#685d7b}
.monthDropdoen{width:55%;float:left;margin-left:30px;margin-top:5px}

.yearDropdoen{width:30%;float:right;margin-top:5px ; -moz-box-sizing: padding-box !important;}
.yearDropdoen .dropdown{background:#685d7b url("/content/Calendar/base/images/slect_arrow.png") no-repeat 55px 8px !important;-moz-box-sizing: padding-box !important;color:#fff;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;text-transform:uppercase;border:solid 1px #685d7b; letter-spacing:1px; font-weight:normal !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:#685d7b;color:#fff}
.yearDropdoen .dropdown li.other{color:#2e8fda;font-size:14px;background:0;border-top:1px solid #dedede}
.yearDropdoen .dropdown li.other:hover{background:#685d7b}




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

.monthDropdoen .dropdown{background:#685d7b url("/content/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:12px;}
 .selectYear_Outer select { width:97% !important;}
 .ui-widget-header { border-radius:10px;}
 .monthDropdoen { width:40%;}
 .yearDropdoen .dropdown { width:60%;}
 .yearDropdoen { width:45%;}
 .monthDropdoen .dropdown ul { font-size:12px;}
 .yearDropdoen .dropdown ul { font-size:12px;}
.ui-datepicker-group-last .ui-datepicker-title { display:none !important;}
.ui-datepicker-group-last .ui-datepicker-calendar { display:none !important;}
 .ui-datepicker-group-last { width:0% !important;}
  .ui-datepicker-group-first { width:100% !important;}
}
 
.select-dropdown,
.select-dropdown * {
	margin: 0;
	padding: 0;
	position: relative;
	box-sizing: border-box;
}
.select-dropdown {
    position: relative;
    background-color: transparent;
    border-radius: 4px;
    float: right;
    padding: 10px;
}
.select-dropdown select {
    font-size: 1rem;
    font-weight: normal;
    max-width: 100%;
    padding: 8px 24px 8px 10px;
    border: none;
    background-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    min-width: 140px;
}

.select-dropdown select:active, .select-dropdown select:focus {
	outline: none;
	box-shadow: none;
}
.select-dropdown:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 11px;
	width: 0;
	height: 0;
	margin-top: -2px;
	border-top: 9px solid #685d7b;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
}

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

 width:300px !important;
 left:3% !important;
 }   
    
    
}