html,body {
	background-color: #f8f9fa;
	background-size: 20px 20px;
	background-position: 0 0, 0 10px, 10px -10px, -10px 0;
}
.my-indicator{display:none;}
.htmx-request .my-indicator{display:inline;}
.htmx-request.my-indicator{display:inline;}
.spinner {
	display: inline-block;
	animation: spin 1s linear infinite;
}
#why, #what, #how{
	padding: 80px 0;
}
#why {
	background-color: #006d77;
	color: #fff;
}
#what {
	background-color: #83c5be;
}
#how {
	background-color: #edf6f9;
}
#app {
	background-color: #fff;
}
.separator {
	position: relative;
	display: inline-block;
	font-size: 1.5em; /* Adjust size as needed */
	color: #ccc; /* Adjust color as needed */
	margin: 0 10px; /* Space around the separator */
}
.separator::before {
	content: "/";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-20deg); /* Adjust rotation angle */
	display: block;
}
.tagline {
    font-family: 'Arial Black', sans-serif; /* Choose a bold font family */
    font-size: calc(3rem + 2vw); /* Responsive font size based on viewport width */
    text-align: center;
}
@keyframes spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}
.intl-tel-input {width: 100%;}
.iti {width: 100%;}
aside {
	width: 250px;
}
/* Extra styling for Dropzone box */
.dropzone {
  border: 2px dashed #0d6efd;
  border-radius: 1rem;
  background: #f8f9fa;
  padding: 2rem;
}
.dropzone .dz-message {
  color: #6c757d;
  font-weight: 500;
}
.dropzone .dz-message i {
  font-size: 3rem;
  color: #0d6efd;
  margin-bottom: 1rem;
}