.mountains-of-christmas-regular {
  font-family: "Mountains of Christmas", serif;
  font-weight: 400;
  font-style: normal;
}

.mountains-of-christmas-bold {
  font-family: "Mountains of Christmas", serif;
  font-weight: 700;
  font-style: normal;
}

body {
	font-family: nyt-cheltenham,cheltenham-fallback-georgia,cheltenham-fallback-noto,georgia,'times new roman',times,serif;	
}
h1,h2,h3,p,div {
	font-family: nyt-cheltenham,cheltenham-fallback-georgia,cheltenham-fallback-noto,georgia,'times new roman',times,serif;	
}
html {
	font-family: nyt-cheltenham,cheltenham-fallback-georgia,cheltenham-fallback-noto,georgia,'times new roman',times,serif;	
}
.ui-datepicker-trigger {
	width:32px;
	height:32px;
}

.my-custom-button-class {
	display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #fff; /* White text color */
  background-color: #0d6efd; /* Bootstrap primary blue */
  border: 1px solid #0d6efd; /* Matching border color */
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  cursor: pointer;
}

/* Style the close button as a circle */
.ui-dialog-titlebar-close {
  border-radius: 50% !important; /* Makes it circular */
  width: 24px !important; /* Adjust size as needed */
  height: 24px !important; /* Adjust size as needed, should match width for a perfect circle */
  padding: 0 !important; /* Remove default padding */
  display: flex !important; /* Use flexbox for centering the 'X' */
  justify-content: center !important; /* Center horizontally */
  align-items: center !important; /* Center vertically */
  background-color: #6699CC !important; /* Example background color for the circle */
  border: 1px solid #366BA1 !important; /* Example border */
}

/* Hide the default jQuery UI icon */
.ui-dialog-titlebar-close .ui-icon {
  display: none !important;
}

/* Create the 'X' using pseudo-elements */
.ui-dialog-titlebar-close::before,
.ui-dialog-titlebar-close::after {
  content: '';
  position: absolute;
  width: 12px; /* Adjust size of the 'X' */
  height: 2px; /* Adjust thickness of the 'X' */
  background-color: #fff; /* Color of the 'X' */
}

.ui-dialog-titlebar-close::before {
  transform: rotate(45deg); /* First line of the 'X' */
}

.ui-dialog-titlebar-close::after {
  transform: rotate(-45deg); /* Second line of the 'X' */
}

/* Optional: Add hover effect */
.ui-dialog-titlebar-close:hover {
  background-color: #6699CC !important;
  border-color: #a00 !important;
}