

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-default {
	background: #ebe8e3;
}

.calendar-wrap .calendar-input-first,
.calendar-wrap .calendar-input-second {
    display: none;
}

.calendar-wrap .calendar-input.input-hidden {
    display: none;
}

.calendar-wrap .single-page .ui-datepicker.ui-widget-content {
    margin-top: 45px;
}

.calendar-wrap .ui-datepicker.ui-widget-content {
    position: relative;
    z-index: 300 !important;
    padding: 0;
    margin: 0;
    width: 100%;
    border: 0;
    background: url('/templates/villa/img/calendar-head-back.png');
    border-radius: 0;
    overflow: hidden;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-header {
    border: 0;
    font: 21px/57px 'Caviar Dreams';
    color: #999;
    height: 57px;
    border-radius: 0;
    text-transform: uppercase;
	font-family: "Gilroy", Arial, sans-serif;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-title {
    font: 21px/57px;
    color: #999;
	font-weight: bold;
	background: #fff;
	color: #777576;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-widget-header .ui-state-hover {
    background: #D3F0FF;
    border: 1px solid #038FDA;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-header {
    margin: 0;
    padding: 0;
	background: #fff;
}


.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-header {
	display: inline-block;
	padding-right: 50px;
}

.calendar-wrap .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    width: 30px;
    height: 33px;
    background: 0 !important;
    opacity: 1 !important;
}

.calendar-wrap .ui-datepicker.ui-widget-content {
	background: transparent;
}

.calendar-wrap .ui-datepicker .ui-datepicker-prev span {
    left: 5px;
    right: auto;
    margin: 0;
    top: 12px;
    width: 25px;
    height: 33px;
}

.calendar-wrap .ui-datepicker .ui-datepicker-next span {
    left: 5px;
    right: auto;
    margin: 0;
    top: 12px;
    width: 25px;
    height: 33px;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-prev span, .ui-datepicker.ui-widget-content .ui-datepicker-next span {
	background: transparent;
	overflow: visible;
	text-indent: initial;
	color: transparent;
}

.calendar-wrap .ui-datepicker .ui-datepicker-title {
    margin: 0 0 0px 45px;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-prev span:after {
    font-family: FontAwesome;
    background: transparent;
    text-indent: initial;
    content: "\f104";
    left: 5px;
    right: auto;
    margin: 0;
    top: -12px;
    width: 25px;
    height: 33px;
    overflow: visible;
    color: #000;
    font-size: 30px!important;
    position: absolute;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-next span:after {
    font-family: FontAwesome;
    background: transparent;
    text-indent: initial;
    content: "\f105";
    left: 10px;
    right: auto;
    margin: 0;
    top: -12px;
    width: 25px;
    height: 33px;
    overflow: visible;
    color: #000;
    font-size: 30px!important;
    position: absolute;
}

.calendar-wrap .ui-datepicker .ui-datepicker-next {
	right: 15px;
	left: auto;
}

.calendar-wrap .ui-datepicker.ui-widget-content table {
	background: #fff;
	border-collapse: initial;
	/*background: transparent;*/
}

.calendar-wrap .ui-datepicker-calendar tbody {
	border : 3px solid #dddddd;
}

    /*background: url('/templates/villa/img/calendar-arrow-left.png') center center no-repeat;*/
    /*content: "\f104";  /* this is your text. You can also use UTF-8 character codes as I do here */
    /*font-family: FontAwesome;
	font-size: 18px!important;
	background: transparent;	
	text-indent: initial;*/
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-next span {
    left: auto;
    right: 7px;
    /*background: url('/templates/villa/img/calendar-arrow-right.png') center center no-repeat;*/
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-prev.ui-state-hover{
    border: 0;
    background: 0;
    margin: 1px 0 0 1px;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-next.ui-state-hover{
    border: 0;
    background: 0;
    margin: 1px 1px 0 0;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-default {
	border: 0;
	padding: 0;
	/*background: 0;*/
	background: #f6f6f6;
	text-align: left;
	height: 58px;
	/*font: 20px/40px 'Caviar Dreams';*/
	color: #000;
	vertical-align: middle;
	padding-left: 10px;
	/*font-family: "Gilroy", Arial, sans-serif;*/
	
}

.calendar-wrap .single-page .ui-datepicker.ui-widget-content .ui-state-default {
    height: 51px;
    font: 20px/51px 'Caviar Dreams';
	font-family: "Gilroy", Arial, sans-serif;
}

.header .calendar-wrap {
    position: relative;
}

.calendar-wrap .ui-datepicker td {
    padding: 0;
    /*border: 10px solid #fff;*/
}

.calendar-wrap .ui-datepicker.ui-widget-content table {
    margin: 0 auto;
    /*width: 92%;*/
}

.ui-datepicker.ui-widget-content .ui-datepicker-week-end .ui-state-default  {
    color: #000;
}

.calendar-wrap .ui-datepicker.ui-widget-content th {
    padding: 2px 0 0 0;
    height: 45px;
    font: 20px/45px 'Caviar Dreams';
    color: #9da7af;
    background: #fff;
	font-family: "Gilroy", Arial, sans-serif;
}

.calendar-wrap .ui-datepicker.ui-widget-content tr {
    vertical-align: middle;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-highlight.ui-state-default {
    color: #000;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-active.ui-state-default {
    font-weight: 400;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-other-month .ui-state-default {
    opacity: 1;
    color: #000;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-disabled .ui-state-default {
    opacity: 1;
    color: #999;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-disabled .ui-state-default {
    color: #999;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-disabled.undefined {
    background: transparent;
    
    opacity: 0.3;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-disabled.undefined .ui-state-default {
    color: #fff;
}

.calendar-wrap .ui-datepicker.ui-widget-content .dp-highlight .ui-state-default {
    background: #999;
    color: #FFF;
}

.calendar-wrap .ui-datepicker.ui-widget-content .dp-highlight  {
    /*border: 2px solid #999;*/
}

.calendar-wrap .departure:after {
	content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 51px 154px 0px 0px;
    border-color: #890000 transparent transparent transparent;
    position: absolute;
    top: 0px;
	opacity: 0.3;
	z-index: 5;
}	

.calendar-wrap .arrival:after {
	content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 51px 163px;
    border-color: transparent transparent #890000 transparent;
    position: absolute;
    top: 0px;
	opacity: 0.3;
	z-index: 5;
	right: 0;
}	

.calendar-wrap .single-page .ui-datepicker.ui-widget-content .ui-state-default {
	z-index: 10;
	position: relative;
}

.calendar-wrap .ui-datepicker td {
    position: relative;
}

.calendar-wrap .datapicker-little .departure:after {
    border-width: 31px 33px 0px 0px;
}	

.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-title {
	text-align: left;
	font-family: 'Noto Serif SC';
	font-style: normal;
	font-weight: 500;
	font-size: 40px;
	line-height: 57px;
	color: #000000;
}

.calendar-wrap .datapicker-little .arrival:after {
    border-width: 0 0 31px 33px;		
}


.calendar-wrap .ui-datepicker-calendar td[data-custom]::before {
	/*STYLE THE CUSTOME DATA HERE*/
	content: '' attr(data-custom);
	display: block;
	font-size: small;
	position: absolute;
	right: 5px;
	bottom: 5px;  
	z-index: 555;
}

.calendar-wrap .ui-state-disabled::before, .arrival::after, .departure::after, .arrival::before, .departure::before, .dp-highlight::before {
	color: #fff;
}

.calendar-wrap .departure::before {
	color: #000;
}

@media (min-width: 992px) {
	
	/*ul.languages, .call-us {
		margin-top: 104px;
		display: block;
	}*/
}

@media (max-width: 771px) {
	.calendar-wrap .departure:after {
		border-width: 51px 65px 0px 0px;
	}
	
	.calendar-wrap .arrival:after {
		border-width: 0 0 51px 65px;
	}
}


.calendar-wrap .ui-datepicker.ui-widget-content td a, .calendar-wrap .ui-datepicker.ui-widget-content td span {
font-family: 'Montserrat'!important;
font-style: normal!important;
font-weight: 400!important;
font-size: 17px!important;
line-height: 40px!important;
text-align: center!important;	
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-disabled .ui-state-default, .ui-datepicker.ui-widget-content .ui-state-default {
	text-align: center!important;
}

.calendar-wrap .ui-datepicker-calendar td[data-custom]::before {
	left: 50%!important;
    transform: translate(-50%, 0)!important;
	text-align: center;
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 22px;
/* or 183% */

text-align: center;	
}

.calendar-wrap .ui-datepicker.ui-widget-content th {
	font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 17px;
/* identical to box height */

text-align: center;

color: #000000;
}

.calendar-wrap .ui-datepicker.ui-widget-content td {
	
}

.calendar-wrap .ui-state-default {
	margin-left: 0;
	padding-left: 0!important;
}

.calendar-wrap .ui-datepicker-calendar td {
	padding: 5px;
}

.calendar-wrap .ui-state-disabled::before, .calendar-wrap .arrival::after, .calendar-wrap .departure::after, .arrival::before, .calendar-wrap .departure::before, .calendar-wrap .dp-highlight::before {
	color: #000;
	border: 0;
}

/*.ui-datepicker.ui-widget-content td .ui-state-default {
	background: #e4ded3;
}

.ui-datepicker.ui-widget-content .ui-state-disabled.undefined {
	background: transparent;
}*/

.calendar-wrap .ui-state-disabled, .calendar-wrap .ui-widget-content .ui-state-disabled, .calendar-wrap .ui-widget-header .ui-state-disabled {
	opacity: 1;
}

.calendar-wrap .ui-state-disabled, .calendar-wrap .ui-widget-content .ui-state-disabled .ui-state-default {
	opacity: 1;
	color: #000;
	border-radius: 8px;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-disabled.undefined {
    /*background: #890000!important;*/
    opacity: 1;
    background: transparent;
    border-radius: 26px;
    color: #000;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-disabled .ui-state-default {
	background: #dbdbdb;
}

.calendar-wrap .ui-state-disabled::before, .ui-state-disabled::before {
	display: none!important;
}

.calendar-wrap .ui-datepicker.ui-widget-content .dp-highlight .ui-state-default {
	background: #e4ded3!important;
	border-radius: 8px;
}

.calendar-wrap .dp-highlight {
	/*background: #e4ded3!important;*/
	border-radius: 26px;
}

/*.ui-datepicker.ui-widget-content .dp-highlight:first-of-type .ui-state-default,
.ui-datepicker.ui-widget-content .dp-highlight:last-of-type .ui-state-default,
.ui-datepicker.ui-widget-content .dp-highlight:first-of-type:before,
.ui-datepicker.ui-widget-content .dp-highlight:last-of-type:before
*/

.calendar-wrap .ui-datepicker.ui-widget-content table {
	/*border-collapse: collapse!important;*/
}

.calendar-wrap .ui-datepicker.ui-widget-content table tbody {
	box-shadow: 0 0 0 1px #ccc;
	border-radius: 44px;
}

.calendar-wrap .ui-datepicker.ui-widget-content table tbody:before, .calendar-wrap  .ui-datepicker.ui-widget-content table tbody:after {
  content: '';
  display: block;
  height: 20px;
}

.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:first-child {
	padding-left: 30px;
	width: 106px;
}

.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:last-child {
	padding-right: 30px;
	width: 106px;
}

.calendar-wrap .ui-datepicker-calendar td:first-child[data-custom]::before {
	padding-left: 20px;
}

.calendar-wrap .ui-datepicker-calendar td:last-child[data-custom]::before {
	padding-right: 60px;
}

.calendar-wrap .ui-datepicker.ui-widget-content .fDate .ui-state-default,
.calendar-wrap .ui-datepicker.ui-widget-content .sDate .ui-state-default
{
	background: #353535!important;
	color: #fff!important;
}

.calendar-wrap .ui-datepicker.ui-widget-content .fDate::before,
.calendar-wrap .ui-datepicker.ui-widget-content .sDate::before
{
	color: #fff!important;
}

.calendar-wrap .ui-state-disabled::before, .calendar-wrap .dp-highlight::before {
    color: #000;
}

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-disabled.undefined .ui-state-default {
	color: #000;
	border-radius: 8px;
}

.calendar-wrap .ui-datepicker.ui-widget-content .dp-highlight .ui-state-default {
	color: #000;
}

@media (max-width: 1199px) {
.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-default {
	width: auto!important;
	height: 64px!important;
}
.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:first-child {
	padding-left: 5px;
	width: 74px!important;
	height: 64px!important;	
}

.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:last-child {
	padding-right: 5px;
	width: 74px!important;
	height: 64px!important;	
}	
.calendar-wrap .ui-datepicker-calendar td:first-child[data-custom]::before {
	padding-left: 10px;
}

.calendar-wrap .ui-datepicker-calendar td:last-child[data-custom]::before {
	padding-right: 10px;
}
}

@media (max-width: 991px) {
.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-default {
	width: auto!important;
	height: 50px!important;
}
.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:first-child {
	padding-left: 5px;
	width: 50px!important;
	height: 50px!important;	
}

.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:last-child {
	padding-right: 5px;
	width: 50px!important;
	height: 50px!important;	
}	
.calendar-wrap .ui-datepicker-calendar td[data-custom]::before {
    left: 0!important;
    transform: initial!important;
}
.calendar-wrap .ui-datepicker-calendar td:first-child[data-custom]::before {
	padding-left: 0px;
}

.calendar-wrap .ui-datepicker-calendar td:last-child[data-custom]::before {
	padding-right: 0px;
}
}

@media (max-width: 767px) {
.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-header {
	display: block;
	padding-right: 0px;
	text-align: center!important;
}	

.calendar-wrap .ui-datepicker .ui-datepicker-next {
	right: 15px;
	left: auto;
}
.calendar-wrap .ui-datepicker.ui-widget-content .ui-datepicker-title {
    text-align: center;
	margin-left: 0;
	font-size: 23px;
}
.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-default {
	width: 60px!important;
	height: 60px!important;
}
.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:first-child {
	padding-left: 5px;
	width: 70px!important;
	height: 60px!important;	
}

.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:last-child {
	padding-right: 5px;
	width: 70px!important;
	height: 60px!important;	
}	
.calendar-wrap .ui-datepicker-calendar td:first-child[data-custom]::before {
	padding-left: 10px;
}

.calendar-wrap .ui-datepicker-calendar td:last-child[data-custom]::before {
	padding-right: 10px;
}
}

@media (max-width: 575px) {

.calendar-wrap .ui-datepicker.ui-widget-content .ui-state-default {
	width: 40px!important;
	height: 40px!important;
}
.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:first-child {
	padding-left: 5px;
	width: 50px!important;
	height: 40px!important;	
}

.calendar-wrap .ui-datepicker.ui-widget-content table tbody tr td:last-child {
	padding-right: 5px;
	width: 50px!important;
	height: 40px!important;	
}	
.calendar-wrap .ui-datepicker-calendar td:first-child[data-custom]::before {
	padding-left: 0px;
}

.calendar-wrap .ui-datepicker-calendar td:last-child[data-custom]::before {
	padding-right: 0px;
}

.calendar-wrap .ui-datepicker.ui-widget-content td a, .calendar-wrap .ui-datepicker.ui-widget-content td span {
	line-height: 22px!important;
}
}