:root{
	--calbox: 19px;
}
/*
font-size: calc(25px + (40 - 25) * ((100vw - 500px) / (1600 - 500)));
h1{
	font-size: calc(25px + (36 - 25) * ((100vw - 500px) / (1600 - 500)));
	color:#000;
}
*/
@font-face {
	font-family: 'Futura';
	font-style: normal;
	font-weight: normal;
	src: local('Futura LT Book'), url(../futura/FuturaLT-Book.woff) format('woff2');
}
html, body{
	font-family: 'Futura' !important;
	font-size: 10pt;
	margin: 0 !important;
	padding: 0 !important;
	background-color: #eaeef3 !important;
}
/* BUTTON OUTLINE FIX */
span#exportCSV:hover{
	cursor: pointer;
}
span#exportCSV:hover svg path{
	fill: #ccc;
}
/*button:focus{
	outline: 1px auto #007bff !important;
}*/
button:focus{
	outline: 1px solid transparent !important;
}
.ms-choice.custom{
	width: 100%;
	background:linear-gradient(157deg, #ffffff 0%, #f4f4f4 100%);
	padding: 0px 5px;
}
.ms-choice.custom:hover, .ms-choice.custom:hover{
	background:linear-gradient(157deg, #f4f4f4 0%, #f0f0f0 100%);
}
.ms-choice.custom:active, .ms-choice.custom:active{
	background:linear-gradient(157deg, #eaeaea 0%, #e4e4e4 100%);
}
.ms-choice.custom:focus, .ms-choice.custom:focus{
	/*outline: 1px auto #61c8d7 !important;*/
	outline: none !important;
}
.btn-custom{
    padding: 3px 5px;
    border-radius: 5px;
    background-color: #fff;
    border: none;
    box-shadow: 0px 3px 5px rgb(0 0 0 / 10%);
    transition: all 200ms ease 0s;
    cursor: pointer;
    outline: none;
	display: inline-block;
}
.btn-custom:hover{
	background-color: rgb(46 145 229);
    box-shadow: 0px 1px 3px rgb(46 145 229 / 40%);
	color: #fff;
	transform: translateY(-1px);
}
.btn-custom-active{
    padding: 3px 5px;
    border-radius: 5px;
    background-color: rgb(46 145 229);
	color: #fff;
    border: none;
    box-shadow: 0px 1px 3px rgb(46 145 229 / 40%);
    transition: all 200ms ease 0s;
    cursor: pointer;
    outline: none;
	display: inline-block;
}
.btn-custom-active:hover{
	background-color: rgb(46 145 229);
    box-shadow: 0px 3px 5px rgb(0 0 0 / 10%);
	transform: translateY(-1px);
}
/* BUTTON OUTLINE FIX END */

/* BACKGROUNDS */
.bg-transparent{
	background-color: transparent !important;
}
/* BACKGROUNDS END */

/*SIDEBAR*/
.navbar-brand{
	color: #f8f9fa !important;
	height: 50px !important;
    line-height: 44px;
    padding-left: 10px;
    font-size: 17pt;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
}
.sidebar{
	background-color:#3a3f51;
}
.sidebar .active{
	color: #000;
}
.submenu{
	padding:1px 0px;
	color: rgba(0,0,0, 0.5);
	display: block;
}
.sidebar .submenu:hover{
	color: rgba(0,0,0, 0.7);
	cursor: pointer;
}
.sidebar .mx35{
	padding-left: 5px;
}
.sidebar ul li {
	color: rgba(0,0,0, 0.5);
	display: block;
	font-size: 9pt;
	position: relative;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}      
.navbar-nav ul li::before {
	position: absolute;
	top: 16px;
	left: 6px;
	width: 10px;
	height: 1px;
	margin: auto;
	content: '';
	border-bottom: 1px dotted #999;
}      
.navbar-nav ul li::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 6px;
	width: 1px;
	height: calc(100% - 1px);
	content: '';
	border-left: 1px dotted #999;
}
.navbar-nav ul li:last-child::after {
	height: 16px;
}
.nav-item:hover{
	cursor: pointer;
}
/* SIDEBAR END */

/* ADDITIONAL WINDOWS */
.x{
	position: fixed;
    z-index: 1005;
    display: flex;
    align-items: center;
    height: 100vh;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100vw;
	background-color:rgba(0, 0, 0, 0.3);
}
.xcontainer{
	height: 80vh;
    width: 80vw;
    box-shadow: 2px 2px 10px 0 rgb(0 0 0 / 50%);
    position: relative;
	background-color: rgba(255,255,255,1);
	font-size: 9pt;
	border-radius: 20px;
	padding: 20px 10px 10px 10px;
}

/* width */
.xcontent::-webkit-scrollbar {
  width: 10px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}

/* Track */
.xcontent::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
.xcontent::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
.xcontent::-webkit-scrollbar-thumb:hover {
  background: #777;
}
.xcontent::-webkit-scrollbar-thumb:active {
  background: #555;
}

/* Buttons */
.xcontent::-webkit-scrollbar-button:single-button {
    background-color: rgb(64, 64, 64);
    display: block;
    background-size: 10px;
    background-repeat: no-repeat;
}

/* Up */
.xcontent::-webkit-scrollbar-button:single-button:vertical:decrement {
    height: 10px;
    width: 10px;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    background-position: 1px 3px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='130' height='100' fill='rgb(175, 175, 175)'><polygon points='50,00 0,50 100,50'/></svg>");
}

.xcontent::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='130' height='100' fill='rgb(112, 112, 112)'><polygon points='50,00 0,50 100,50'/></svg>");
}

.xcontent::-webkit-scrollbar-button:single-button:vertical:decrement:active {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='130' height='100' fill='rgb(128, 128, 128)'><polygon points='50,00 0,50 100,50'/></svg>");
}

/* Down */
.xcontent::-webkit-scrollbar-button:single-button:vertical:increment {
    height: 10px;
    width: 10px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    background-position: 1px 3px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='130' height='100' fill='rgb(175, 175, 175)'><polygon points='0,0 100,0 50,50'/></svg>");
}

.xcontent::-webkit-scrollbar-button:single-button:vertical:increment:hover {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='130' height='100' fill='rgb(112, 112, 112)'><polygon points='0,0 100,0 50,50'/></svg>");
}

.xcontent::-webkit-scrollbar-button:single-button:vertical:increment:active {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='130' height='100' fill='rgb(128, 128, 128)'><polygon points='0,0 100,0 50,50'/></svg>");
}
.xcontent{
	height: 100%;
    width: 100%;
	overflow: auto;
}
.xclose{
	cursor:pointer;
	background-color: #fff;
	width: 30px;
	height: 30px;
	position: absolute;
    top: -13px;
    right: -15px;
	border: 3px solid #999;
	border-radius: 50%;
	display: block;
	text-align: center;
	line-height: 20px;
	font-size: 21px;
	color: #999;
	z-index: 2;
}
.xclose:hover{
	border: 3px solid #666;
	color: #666;
}
.xclose:active{
	border: 3px solid #ccc;
	color: #ccc;
}
/* ADDITIONAL WINDOWS END*/

/* HEADER */
.new-header{
	position: fixed;
	z-index: 9;
    right: 17px;
    left: 0px;
    top: 0px;
	background-color: #fff;
	display: -ms-flexbox !important;
	display: flex !important;
	padding: 0;
	margin-right: 0;
	margin-left: 0;
	box-shadow: 0rem 0.3125rem 0.3125rem 0rem rgb(82 63 105 / 20%);
}
.new-header .new-header-second{
	background-color: #61c8d7;
}
.new-header .new-header-second .col{
	padding: 0;
	height: 40px;
	background-color: #61c8d7;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: transform 0.2s ease-out;
	-o-transition: transform 0.2s ease-out;
	transition: transform 0.2s ease-out;
}
.new-header .new-header-second .col:not(:first-child) {
	border-left: 1px solid #eee;
}
.new-header .new-header-second .col:hover{			
	background-color: #64bfcc;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: transform 0.2s ease-out;
	-o-transition: transform 0.2s ease-out;
	transition: transform 0.2s ease-out;
}
.new-header .new-header-second .col a{
	width: 100%;
	height: 100%;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}
.new-header .new-header-second .col a:hover{
	color: #eee;
	text-decoration: none;
}
.user-img-container{
	width: 42px;
    height: 42px;
    margin: 4px 0px 4px auto;
    border-radius: 50%;
    border: solid 2px #3a3f51;
}
.user-img-container a{
	color: #007bff;
    width: 100%;
    height: 100%;
	display: block;
    text-decoration: none;
    background-color: transparent;
}
.head-title-img{
	width: 100%;
    padding: 2px;
    border-radius: 50%;
}
.dropdown-menu .dropdown-item{
	font-size: 9pt;
	margin-bottom: 0 !important;
}
.dropdown-menu .dropdown-item a{
	text-align: center;
}
.dropdown-menu .dropdown-item a:hover{
	color: #16181b;
}
#liltitle{
	height: 40px !important;
	line-height: 40px !important;
	font-size: 10pt;
}
/* HEADER END */

/* HAMBURGER */
.hamburger{
	margin: 0px 15px;
	display: inline-block;
    left: 0rem;
    position: relative;
    top: 0rem;
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
    width: 1.625rem;
    z-index: 999;
}
.hamburger:hover {
    cursor: pointer;
}
.hamburger .line {
    background: #000;
    display: block;
    height: 0.1875rem;
    border-radius: 0.1875rem;
    margin-top: 0.375rem;
    margin-bottom: 0.375rem;
    margin-right: auto;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.hamburger .line:nth-child(2) {
    height: 0.2rem !important;
}
.hamburger .line:nth-child(1), .hamburger .line:nth-child(2) {
    width: 1.625rem;
}
.hamburger .line:nth-child(3){
    width: 0.9375rem;
}
.hamburger.is-active .line:nth-child(1) {
    -webkit-transform: translateY(0.25rem) translateX(0.75rem) rotate(45deg);
    transform: translateY(0.25rem) translateX(0.75rem) rotate(45deg);
}
.hamburger.is-active .line:nth-child(2) {
    -webkit-transform: translateX(0rem);
    transform: translateX(0rem);
    width: 1.375rem;
    height: 0.125rem;
}
.hamburger.is-active .line:nth-child(3) {
    -webkit-transform: translateY(-0.25rem) translateX(0.75rem) rotate(-45deg);
    transform: translateY(-0.25rem) translateX(0.75rem) rotate(-45deg);
}
.hamburger.is-active .line:nth-child(1), .hamburger.is-active .line:nth-child(3) {
    width: 0.625rem;
    height: 0.125rem;
}
/* HAMBURGER END*/

/* BIG BUTTONS */
.mainBigButton div .BigButton{
	height: 115px;
    border-radius: 25px;
	padding: 10px;
	box-shadow: 0rem 0.3125rem 0.3125rem 0rem rgb(82 63 105 / 20%);
}
.mainBigButton > div:nth-child(1) .BigButton{
	background-color: #21D4FD;
	background-image: linear-gradient(19deg, #21D4FD 0%, #B721FF 100%);
}
.mainBigButton > div:nth-child(2) .BigButton{
	background-color: #FBAB7E;
	background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%);
}
.mainBigButton > div:nth-child(3) .BigButton{
	background-color: #FAACA8;
	background-image: linear-gradient(19deg, #FAACA8 0%, #DDD6F3 100%);
}
.mainBigButton > div:nth-child(4) .BigButton{
	background-color: #3ff481;
	background-image: linear-gradient(132deg, #3ff481 0%, #16A085 100%);
}
/* BIG BUTTONS END */

/* CUSTOM BOXES */
.customBoxes{
	border-radius:20px;
	box-shadow:0rem 0.3125rem 0.3125rem 0rem rgb(82 63 105 / 20%);
}
/* CUSTOM BOXES END*/

/* PARAGRAPH-CONTENT */
.paragraph-content{
	margin-top: 50px;
	font-family: 'Montserrat', sans-serif;
	color: #000;
	font-size: calc(11px + (13 - 11) * ((100vw - 500px) / (1600 - 500)));
}
.paragraph-content h1{
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: calc(18px + (28 - 18) * ((100vw - 500px) / (1600 - 500)));
	padding-bottom: 13px;
	margin-bottom: 2rem;
	border-bottom: solid 2px #ccc;
	color: #6a35eb;
}
.paragraph-content h2{
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: calc(18px + (21 - 18) * ((100vw - 500px) / (1600 - 500)));
	margin: 15px 0px 20px 0px;
}
.paragraph-content p{
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 14px;
}
/* PARAGRAPH-CONTENT END */

/* ONGOING BOOKINGS */
.occupancy-bookings .ongoing-d, .accordian-body .ongoing-d{
	background-color: #FFF;
	-webkit-transition: background-color .1s ease-out; 
	   -moz-transition: background-color .1s ease-out; 
		 -o-transition: background-color .1s ease-out; 
			transition: background-color .1s ease-out;
}
.occupancy-bookings .ongoing-d:hover, .accordian-body .ongoing-d:hover{
	background-color: #b845f342;
	cursor: pointer;
	-webkit-transition: background-color .1s ease-out; 
	   -moz-transition: background-color .1s ease-out; 
		 -o-transition: background-color .1s ease-out; 
			transition: background-color .1s ease-out;
}
.occupancy-bookings .ongoing-d:last-child{
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
}
/* ONGOING BOOKINGS END */

/* CALENDARS - yearly */
table.calendar.oneyear thead tr:first-child{
	height: 40px;
}
table.calendar.oneyear thead tr th span.title{
	font-size: calc(13px + (16 - 13) * ((100vw - 500px) / (1600 - 500)));
	letter-spacing: 3px;
}
table.calendar.oneyear thead tr th span.btn-custom-prev, table.calendar.oneyear thead tr th span.btn-custom-next{
	position: absolute;
    height: 40px;
    top: 0px;
    line-height: 40px;
    padding: 0px 10px;
	display: flex;
	border-bottom: 1px solid #ccc;
	-ms-flex-align: center !important;
    align-items: center !important;
}
table.calendar.oneyear thead tr th span.btn-custom-prev.disabled, table.calendar.oneyear thead tr th span.btn-custom-next.disabled{
	background: linear-gradient(157deg, #f1f3f6 0%, #f1f3f6 100%);
}
table.calendar.oneyear thead tr th span.btn-custom-prev:not(.disabled), table.calendar.oneyear thead tr th span.btn-custom-next:not(.disabled){
	background: linear-gradient(157deg, #ffffff 0%, #f4f4f4 100%);	
	-webkit-transition: background .1s ease-out; 
	   -moz-transition: background .1s ease-out; 
		 -o-transition: background .1s ease-out; 
			transition: background .1s ease-out;
}
table.calendar.oneyear thead tr th span.btn-custom-prev:not(.disabled):hover, table.calendar.oneyear thead tr th span.btn-custom-next:not(.disabled):hover{
	cursor: pointer;
	/*background: rgba(255, 255, 255, 0.7);*/
	background: linear-gradient(157deg, #f4f4f4 0%, #f0f0f0 100%);
	-webkit-transition: background .1s ease-out; 
	   -moz-transition: background .1s ease-out; 
		 -o-transition: background .1s ease-out; 
			transition: background .1s ease-out;
}
table.calendar.oneyear thead tr th span.btn-custom-prev:not(.disabled):active, table.calendar.oneyear thead tr th span.btn-custom-next:not(.disabled):active{
	background: linear-gradient(157deg, #eaeaea 0%, #e4e4e4 100%);
}
table.calendar.oneyear thead tr th span.btn-custom-prev{
    left: 0px;
	border-right: 1px solid #ddd;
}
table.calendar.oneyear thead tr th span.btn-custom-next{
	border-left: 1px solid #ddd;
    right: 0px;
}
/* CALENDARS - yearly end */

/* CALENDARS - one month */
table.onemonth{
	margin-left: auto;
	margin-right: auto;
}
table.onemonth th, table.onemonth td{
	height: 35px;
    width: 50px;
    position: relative;
    padding: 0;
}
table.onemonth thead tr td{
	font-size: 12pt;
	text-align: center;
	font-weight: 600;
	background-color: #47a8fe;
}
table.onemonth td:first-child{
	color: #F00;
}
table.onemonth .ongoing-d:hover{
	cursor: pointer;
}
.calendar-month-selector .monthly_cal_indicator{
	margin: 0px 15px;
}
.month-selector .previous:hover, .month-selector .next:hover{
	cursor: pointer;
}
.calendar-month-selector i.next:not(.text-light.disabled):hover, .calendar-month-selector i.previous:not(.text-light.disabled):hover{
	cursor: pointer;
	text-shadow: 0px 0px 5px #44AACE;
	color: #555;
}.calendar-month-selector i.next:not(.text-light.disabled):active, .calendar-month-selector i.previous:not(.text-light.disabled):active{
	cursor: pointer;
	text-shadow: 0px 0px 5px #F00;
	color: #999;
}
/* CALENDARS - one month END*/

/* BOOKING DETAIL PAGE */
#bookingTab li.nav-item .nav-link {
    font-weight: 600;
    color: #6c757d;
	border: 2px solid transparent;
}
#bookingTab li.nav-item .nav-link.disabled {
	color: #ccc;
}
#bookingTab {
	border: none;
}
#bookingTab li.nav-item .nav-link:hover {
    color: #666;
}
#bookingTab li.nav-item .nav-link:active {
    color: #999;
}
#bookingTab li.nav-item .nav-link.active {
    color: #000;
	border-bottom: 2px solid #999;
}
#bookingTab .card, #bookingTab .card-body {
    border-radius: 7px !important;
}
#bookingTab .card-body {
    padding: 1rem !important;
}
#bookingTab .card-body > span {
    color: #000;
	font-size: calc(12px + (14 - 12) * ((100vw - 500px) / (1600 - 500)));
}
#bookingTab .card-body ul{
    list-style:none;
	padding-left: 15px;
	margin-bottom: 0px;
}
#bookingTab .card-body > ul > li{
    font-size: calc(10px + (12 - 10) * ((100vw - 500px) / (1600 - 500)));
	display: flex;
}
#bookingTab .card-body > ul > li span:last-child{
	font-weight: bold;
	margin-left: auto;
	max-width: 67%;
	text-align: right;
}
#bookingTab .card-body > ul li:not(last-child){    
	border-bottom: solid 1px #aaa;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
/* BOOKING DETAIL PAGE END */

/*TABLES */
#booking-target div table{
	margin-left: auto;
	margin-right: auto;
}
/*TABLES END */
.transform-none{
	transform: none !important;
}
.t-39{
	top: 39px !important;
}
.futura{
	font-family: 'Futura' !important;			
}
.bg-lightgrey{
	background-color: #f3f3f3;
	padding: 25px;
}
.highcharts-credits{
	display: none;
}
.ajax-container{
	position: fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	display:flex;
	z-index:3;
}
.search_selector{
	font-size: 9pt;
	display: block;
	margin: 0 auto;
}
.table_calendar .booked{
	background-color: #eaeaea;
}
.table_calendar .booked_hover{
	background-color: #d7d7d7;
	cursor: pointer;
}
.table_calendar .booked_active{
	background-color: #c3c3c3;
}
.table_calendar .date, .table_calendar th{
	padding: 0 !important;
	border: 1px solid #ccc;
	font-size: calc(8px + (11 - 8) * ((100vw - 500px) / (1600 - 500)));
}
.table_calendar .btbb{
	border-right: none;
	border-left: none;
}
.table_calendar .btbbbl{
	border-left: none;
}
.table_calendar .btbbbr{
	border-right: none;
}
.table_calendar tr.month td {
	padding: 0;
	text-align: center;
	height: var(--calbox);
	width: var(--calbox);
	font-size: calc(8px + (11 - 8) * ((100vw - 500px) / (1600 - 500)));
}
.table_calendar tr.month td a {
	height: calc(var(--calbox) - 3px);
	line-height: calc(var(--calbox) - 3px);
	display: block;
	text-decoration: none;
	color: #fff;
	margin-bottom: calc(0 - var(--calbox));
	background-color: transparent;
	cursor: pointer;
}	
.table_calendar td span {		
	line-height: calc(var(--calbox) - 3px);
	bottom: 0px;
	text-decoration: none;
	color: #fff;
	display: block;
	white-space: nowrap;
	position: absolute;
	margin-left: 18px;
	text-overflow: ellipsis;
	text-align: left;
	z-index: 200;
	height: calc(var(--calbox) - 3px);
}
.table_calendar td span::after {
	content: '';
}
.table_calendar tr.month .g {
	height: calc(var(--calbox) - 3px);
	width: 100%;
	position: relative;
	box-sizing: content-box;
	overflow: hidden;
	display: block;
}
.table_calendar tr.month td div.-b {
	height: calc(var(--calbox) - 3px);
	margin-bottom: calc(0 - var(--calbox));
	width: 100%;
	position: absolute;
	display: block;
	left: 55%;
	border-radius: 4px;
}	
.table_calendar tr.month td div.b- {
	height: calc(var(--calbox) - 3px);
	margin-bottom: calc(0 - var(--calbox));
	width: 100%;
	position: absolute;
	display: block;
	left: -55%;
	border-radius: 4px;
}
.table_calendar tr.month td div.b {
	height: calc(var(--calbox) - 3px);
	margin-bottom: calc(0 - var(--calbox));
	width: 100%;
}
@media only screen and (min-width: 1200px){
	.table_calendar tr.month td div.-b, .table_calendar tr.month td div.b-{
	-webkit-transform: skew(-30deg);
	-moz-transform: skew(-30deg);
	transform: skew(-30deg);
	}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.table_calendar tr.month td div.-b, .table_calendar tr.month td div.b-{
	-webkit-transform: skew(-24deg);
	-moz-transform: skew(-24deg);
	transform: skew(-24deg);
	}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.table_calendar tr.month td div.-b, .table_calendar tr.month td div.b-{
	-webkit-transform: skew(-18deg);
	-moz-transform: skew(-18deg);
	transform: skew(-18deg);
	}
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
	.table_calendar tr.month td div.-b, .table_calendar tr.month td div.b-{
	-webkit-transform: skew(-12deg);
	-moz-transform: skew(-12deg);
	transform: skew(-12deg);
	}
}
@media only screen and (max-width: 575px){	
	.table_calendar tr.month td div.-b, .table_calendar tr.month td div.b-{
	-webkit-transform: skew(-6deg);
	transform: skew(-6deg);
	}
}
	
.navbar{
	z-index: 9;
}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus{
	background-color: rgba(150, 150, 150, 0.1);
}
.nav .navbar-nav .nav-item .nav-link.hasChild{
	position: relative;
}
.nav .navbar-nav .nav-item .nav-link.hasChild::after{
	position: absolute;
	right: 1em;
	content: "";
	border-top: 0.3em solid;
	border-right: 0.3em solid transparent;
	border-bottom: 0;
	border-left: 0.3em solid transparent;
	display: block;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%) rotate(0deg);
	-webkit-transition: all .2s ease-out; 
	   -moz-transition: all .2s ease-out; 
		 -o-transition: all .2s ease-out; 
			transition: all .2s ease-out;
}
.nav .navbar-nav .nav-item .nav-link.hasChild[aria-expanded="true"]::after{
	transform: translateY(-50%) rotate(90deg);
	-webkit-transition: all .2s ease-out; 
	   -moz-transition: all .2s ease-out; 
		 -o-transition: all .2s ease-out; 
			transition: all .2s ease-out;
}
:root{
	--icon-width:45px;
}
.c-icon{	
	border-right: solid 1px #ccc;
	padding-left: 15px;
	padding-right: 15px;			
	width: calc(var(--icon-width) + 30px);
}
.c-icon:hover{
	cursor: pointer;
	background-color: rgba(175,175,175, 0.3);
	text-decoration: none;
}
.c-icon:hover > small{
	text-decoration: none !important;
	color: #000;
}
.c-icon > small{
	text-align: center;
	display: block;
	font-family: 'Futura' !important;
	font-size: 8.5pt !important;
	text-decoration: none;
	color: #666;
}
.h-active{
	background-color: rgba(175,175,175, 0.3)
}

.c-shadow{
	-webkit-box-shadow: inset 0 0 3px #000000;
	   -moz-box-shadow: inset 0 0 3px #000000;
		 -o-box-shadow: inset 0 0 3px #000000;
			box-shadow: inset 0 0 3px #000000;
}
div[class^="ico-custom"]{
	height: 45px;
	width: 45px;
	margin-top: 3px;
}
.ico-custom-summary{
	//background: url("../img/icon/ico-sum.png") no-repeat center center fixed;
	background: url("../img/icon/ico-sum.png") no-repeat center center;
	height: 100%;
	overflow: hidden;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.ico-custom-summary:hover{
	background: url("../img/icon/ico-sum-hover.png") no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.ico-custom-calendar{
	background: url("../img/icon/ico-cal.png") no-repeat center center;
	height: 100%;
	overflow: hidden;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.ico-custom-calendar:hover{
	background: url("../img/icon/ico-cal-hover.png") no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.ico-custom-table{
	background: url("../img/icon/ico-tab.png") no-repeat center center;
	height: 100%;
	overflow: hidden;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.ico-custom-table:hover{
	background: url("../img/icon/ico-tab-hover.png") no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.ico-custom-statistic{
	background: url("../img/icon/ico-sta.png") no-repeat center center;
	height: 100%;
	overflow: hidden;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.ico-custom-statistic:hover{
	background: url("../img/icon/ico-sta-hover.png") no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.svg-green {fill:#00A859}
.svg-black {fill:#000000}
.svg-red {fill: #ED3237}
.svg-purple {fill: #A8518A}
.svg-pink {fill:#F7ADAF}
.svg-softblue {fill:#00AFEF}
.svg-blackNZ {fill:black;fill-rule:nonzero}
.svg-blue {fill:#3E4095}
.background{
	/*background-color: #D9AFD9;
	background-image: linear-gradient(316deg, #D9AFD9 0%, #97D9E1 72%);*/
	background-color: #3EECAC;
	background-image: linear-gradient(135deg, #3EECAC 0%, #EE74E1 100%);
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height:100%;
	overflow:hidden;
}
.content{
	align-items: unset !important;
	display: flex;
	align-items: center;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 2;
	font-size: 11px;
}
.content .heading{
	text-align: center;
	color: white;
}
.content .heading .title{
	font-size: calc(20px + (40 - 20) * ((100vw - 500px) / (1600 - 500)));
	font-weight: 700;
	display: block;
}
.content .heading .subtitle{
	font-size: calc(13px + (24 - 13) * ((100vw - 500px) / (1600 - 500)));
	display: block;
}
.content .section{
	padding: 20px;
	background-color: #fff;
	color: #333;
	border: 2px solid #ddd;
	border-radius: 10px;
	margin-top: 70px;
	-webkit-box-shadow: inset 0px 0px 4px 3px rgb(230 230 230);
	-moz-box-shadow: inset 0px 0px 4px 3px rgb(230 230 230);
	box-shadow: inset 0px 0px 4px 3px rgb(230 230 230);
}
.content .section:last-child {
	margin-bottom: 70px;
}
.content .section .title{
	font-size: calc(16px + (20 - 16) * ((100vw - 500px) / (1600 - 500)));
	display: block;
}
.content .section .table_summary, .content .section .table_summary tr, .content .section .table_summary tr td, .content .section .table_summary tr th{
	border: 1px solid #999;		
}
.content .section .table_summary{
	margin: 0 auto;
}
.content .section .table_summary tr th{
	padding: 5px 12px;
}
.content .section .table_summary tr td{
	padding: 2px 12px;
}
.close{
	position: absolute;
	top: 0px;
	right: 0px;
	padding-right: 20px;
	cursor: pointer;
}
.notif-alert-content{
	padding: 50px 20px;
	background-color: white;
}
.lnr {
	font-family: Linearicons-Free;
	speak: none;
	font-style: normal;
	font-weight: 600;
}
.head-title{
	display: block;
	border-bottom: solid 3px #6a35eb;
	background-color: #e3e3e3;
}
.head-title span{		
	line-height: 50px;
	font-size: 16pt;
}
.card .card-header {
	//display: flex;
	justify-content: space-between;
	align-items: baseline;
	flex-wrap: wrap;
	margin-top: 0;
	//padding-bottom: 0;
	border-radius: 0.25rem 0.25rem 0 0;
	border-bottom: 1px solid #ccc;
    background-color: #f8f9fa;
};
.bg-index{
	position: fixed;
	text-align: center;
	width: 100%;
	height: 100vh;
}
.form-control:focus{
	box-shadow: none;
}
.vertical_center.home{
	display: flex;
}
.vertical_center {
	display: flex;
	align-items: center;
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	height: 100vh;
	width: 100vw;
	z-index: 2;
	font-size: 11px;
}
#notification{
	background-color:rgba(255,255,255,1);
	border:2px solid #007bff; 
	border-radius:15px; 
	text-align:center;
	font-size: 10pt;
	padding: 10px 30px;
}
.secondstep, .thirdstep, .change_pass{
	display:none;
}
.logoanimated-container{
	position:fixed;
	top:0;
	bottom:0;
	left:0;
	right:0;
	width:100vw;
	height:100vh;
	z-index:-1;
}
.logoanimated-container .logoanimated{
	display: block;
	margin: 0 auto;
}	
.logoanimated-container .logoanimated #layer_2{	
	-webkit-animation: rotate 2s linear forwards;
	-moz-animation: rotate 2s linear forwards;
	animation: rotate 2s linear forwards;
	animation-delay: 2.2s;
}
.logoanimated-container .logoanimated svg {
	margin: auto;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	overflow: visible;
}
.logoanimated-container path[class^="path-first-"], polygon[class^="path-first-"]{
	fill-opacity: 0;
	stroke-dashoffset: 2000;
	stroke-dasharray: 2000;
}
.logoanimated-container .path-first-p {
	animation: draw 4s linear forwards;
	-moz-animation: draw 4s linear forwards;
	-webkit-animation: draw 4s linear forwards;
	animation-delay: 1.3s;
	-moz-animation-delay: 1.3s;
	-webkit-animation-delay: 1.3s;
}
.logoanimated-container .path-first-q {
	animation: draw 4s linear forwards;
	-moz-animation: draw 4s linear forwards;
	-webkit-animation: draw 4s linear forwards;
	animation-delay: 1.6s;
	-moz-animation-delay: 1.6s;
	-webkit-animation-delay: 1.6s;
}
.logoanimated-container .path-first-r {
	animation: draw 4s linear forwards;
	-moz-animation: draw 4s linear forwards;
	-webkit-animation: draw 4s linear forwards;
	animation-delay: 1.9s;
	-moz-animation-delay: 1.9s;
	-webkit-animation-delay: 1.9s;
}
.logoanimated-container .path-first-s {
	animation: draw 4s linear forwards;
	-moz-animation: draw 4s linear forwards;
	-webkit-animation: draw 4s linear forwards;
	animation-delay: 2.2s;
	-moz-animation-delay: 2.2s;
	-webkit-animation-delay: 2.2s;
}
.logoanimated-container .path-first-t {
	animation: draw 4s linear forwards;
	-moz-animation: draw 4s linear forwards;
	-webkit-animation: draw 4s linear forwards;
	animation-delay: 2.5s;
	-moz-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.logoanimated-container .path-first-u {
	animation: draw 1s linear forwards;
	-moz-animation: draw 1s linear forwards;
	-webkit-animation: draw 1s linear forwards;
	animation-delay: 4s;
	-moz-animation-delay: 4s;
	-webkit-animation-delay: 4s;
}
@-webkit-keyframes draw {
	30% {stroke-dashoffset: 0;fill-opacity: 0;}
	50% {fill-opacity: 1;}
	100% {stroke-dashoffset: 1;fill-opacity: 1;}
}
@-moz-keyframes draw {
	30% {stroke-dashoffset: 0;fill-opacity: 0;}
	50% {fill-opacity: 1;}
	100% {stroke-dashoffset: 1;fill-opacity: 1;}
}
@keyframes draw {
	30% {stroke-dashoffset: 0;fill-opacity: 0;}
	50% {fill-opacity: 1;}
	100% {stroke-dashoffset: 1;fill-opacity: 1;}
}
div[id^="forgetpass_notification"], div[id^="username_notification"], div[id^="password_notification"]{
	text-align: center;
    font-size: 10pt;
    color: #fff !important;
    border-radius: 3px;
}
/* SELECTOR */
#select-month{
	width: 100px;
}
#select-year{
	width: 80px;
}
#togglevilla{
	width: 200px;
}
/* SELECTOR end */

@media only screen and (min-width: 1200px){
	form[name^="login"] .input-group-text{width:100px;}
	#fixed{transform: translate3d(0px, 44px, 0px) !important;left: unset !important;right: 0px !important;}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
	form[name^="login"] .input-group-text{width:100px;}
	#fixed{transform: translate3d(0px, 44px, 0px) !important;left: unset !important;right: 0px !important;}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
	html, body{font-size: 10pt;}
	form[name^="login"] .input-group-text{width:80px;}
	#fixed{transform: translate3d(0px, 44px, 0px) !important;left: unset !important;right: 0px !important;}
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
	html, body{font-size: 10pt;}
	form[name^="login"] .input-group-text{width:80px;}
	#fixed{transform: translate3d(0px, 74px, 0px) !important;left: unset !important;right: 0px !important;}
}
@media only screen and (max-width: 575px){	
	html, body{font-size: 10pt;}
	form[name^="login"] .input-group-text{width:80px;}
	#fixed{transform: translate3d(0px, 74px, 0px) !important;left: unset !important;right: 0px !important;}
}