a {text-decoration:none;}
nav .navbar-nav li a{
  color: white;
  text-decoration:none;
  }
.navbar-nav > li > .dropdown-menu { background-color: #212529; }
.business-header {
	background-color:rgb(255,255,255);
	font-size:4em;
	text-align:center;
	margin-bottom:25px;}
.bg {
  /* The image used */
  background-image: url("/images/truck4000.png");

  /* Full height */
  height: 100%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.note{
max-width: 100%;
max-height: 300px;	
}	

.fixed-content {
    overflow-y:scroll;
    overflow-x:scroll;
}
.releasebox {
	height:300px;
}
.card1 {
    background: rgb(22, 105, 173);
	color:white;
}
.card2 {
    background: rgb(203, 67, 53);
	color:white;
}
.card3 {
    background: rgb(214, 137, 16);
	color:white;
}
.card4 {
    background: rgb(40, 180, 99);
	color:white;
}

.dropdown:hover>.dropdown-menu {
  display: block;
}

.dropdown>.dropdown-toggle:active {
  /*Without this, clicking will make it sticky*/
    pointer-events: none;
}

/* TEST


/* Hours Of Operation calendar */
.calendar {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    user-select: none; /* Disable text selection */
    gap: 5px; /* Add some space between cells */
}

.calendar div {
    border: 1px solid #ccc;
    padding: 5px; /* Decrease padding to make height smaller */
    text-align: center;
    font-size: 14px; /* Slightly larger font size for better readability */
    border-radius: 10px; /* Round the edges */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Add a subtle shadow */
    transition: background-color 0.3s, color 0.3s; /* Smooth transition for hover and selection */
    height: 1fr; /* Set a fixed height for smaller cells */
    display: flex;
    align-items: center;
    justify-content: center;
}

.time-slot {
    cursor: pointer;
}

.time-slot:hover {
    background-color: #f0f0f0; /* Light grey background on hover */
}

.selected {
    background-color: #007bff;
    color: white;
}

.selected:hover {
    background-color: #0056b3; /* Darker blue on hover when selected */
}


.selected:hover {
    background-color: #0056b3; /* Darker blue on hover when selected */
}

.single-plan {
    background-color: #f9f9f9; /* Very light gray */
    border: 1px solid #e0e0e0;
}

.basic-plan {
    background-color: #f2f9ff; /* Very light blue */
    border: 1px solid #d0e7ff;
}

/* Standard Plan - Slightly Darker */
.standard-plan {
    background-color: #FFFFE0; /* Very light blue */
    border: 1px solid #FFFF00;
}

/* Premium Plan - Highlighted */
.premium-plan {
    background-color: #e8f9f1; /* Very light green */
    border: 1px solid #bfe3d0;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.single-plan-header {
	background-color: #dc3545; /* Bootstrap Danger */
	color: white;
	padding: 10px;
	border-bottom: 1px solid #c82333;
}

.basic-plan-header {
	background-color: #007bff; /* Bootstrap Primary */
	color: white;
	padding: 10px;
	border-bottom: 1px solid #0056b3;
}

.standard-plan-header {
	background-color: #FFFF00; /* Bootstrap Success */
	color: white;
	padding: 10px;
	border-bottom: 1px solid #FFD700;
}

.premium-plan-header {
	background-color: #28a745; /* Bootstrap Success */
	color: white;
	padding: 10px;
	border-bottom: 1px solid #218838;
}

  /* Add hover effect to custom hover cards */
.hover-card:hover {
    transform: scale(1.05);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

/* Add a transition to the box shadow to make the hover effect smoother */
.hover-card {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	user-select: none;
}

.pricing-card {
    transform: scale(1.10);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.pricing-card:hover {
    transform: scale(1.12);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}