.content {
	padding-top: 4rem;
}

.mailing-list {
	min-height: 40vh;
	h1 {
		color: var(--color-primary)
	}
}

.row-form {
	width: clamp(50vw, 30rem, 85vw);
	text-align: left;
}

.checkbox-row {
	margin: 1rem 0;
	display: flex;
}

.row-form label {
	flex-direction: row;
}

input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	background-color: var(--color-primary);
	margin-right: 1rem;
	font: inherit;
	color: currentColor;
	width: 1em;
	height: 1em;
	border: 0.1em solid currentColor;
	border-radius: 0.1em;
	display: grid;
	place-content: center;
}

input[type="checkbox"]::before {
	content: "✔";
	transform: scale(0);
	transition: 100ms transform ease-in-out;
}

input[type="checkbox"]:checked {
	border: 0.1em solid var(--color-secondary);
}

input[type="checkbox"]:checked::before {
	transform: scale(1);
	color: var(--color-secondary);
}
  

.label-description {
	font-weight: 600;
}

.description {
	font-size: 0.9rem;
	font-style: italic;
	width: 80%;
}

.submit-row {
	text-align: center;
}

button {
	width: auto;
}

.loading div {
	display: inline-block;
}

.loading div:after {
	content: " ";
	display: block;
	/* width: 11px;
	height: 11px;
	margin: 1px; */
	border-radius: 50%;
	border: 4px solid #fff;
	border-color: #000000 #000000 #000000 transparent;
	animation: ml-form-embedSubmitLoad 1.2s linear infinite;
}

@keyframes ml-form-embedSubmitLoad {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

.ml-error input, .ml-error textarea, .ml-error select {
border-color: red!important;
}

.ml-error .custom-checkbox-radio-list {
border: 1px solid red !important;
border-radius: 4px;
padding: 10px;
}

.ml-error .label-description,
.ml-error .label-description
.ml-error .label-descriptiona,
.ml-error label:first-child {
color: #ff0000 !important;
}

button.primary {
	background-color: var(--color-quaternary);
    padding: 0.2rem 2rem;
    border-radius: 0.25rem;
    border: 2px solid var(--color-primary);
    min-width: 7rem;
}

@media screen and (max-width: 575.98px) {
	.content {
		padding-top: 1rem;
	}

	.checkbox-row {
		flex-direction: column;
		gap: 1rem;
	}
}