*,
		*:after,
		*:before {
		box-sizing: border-box;
		}

		body {
		font-family: "Inter", sans-serif;
		color: #000021;
		font-size: calc(1em + 1.25vw);
		background-color: #e6e6ef;
		}

		form {
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		}

		label {
		display: flex;
		cursor: pointer;
		font-weight: 500;
		position: relative;
		overflow: hidden;
		margin-bottom: 0.375em;
		/* Accessible outline */
		/* Remove comment to use */
		/*
			&:focus-within {
				outline: .125em solid $primary-color;
			}
		*/
		}
		label input {
		position: absolute;
		left: -9999px;
		}
		label input:checked + span {
		background-color: #d6d6e5;
		}
		label input:checked + span:before {
		box-shadow: inset 0 0 0 0.4375em #00005c;
		}
		label span {
		display: flex;
		align-items: center;
		padding: 0.375em 0.75em 0.375em 0.375em;
		border-radius: 99em;
		transition: 0.25s ease;
		}
		label span:hover {
		background-color: #d6d6e5;
		}
		label span:before {
		display: flex;
		flex-shrink: 0;
		content: "";
		background-color: #fff;
		width: 1.5em;
		height: 1.5em;
		border-radius: 50%;
		margin-right: 0.375em;
		transition: 0.25s ease;
		box-shadow: inset 0 0 0 0.125em #00005c;
		}

		.container {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 20px;
		}