* {
	font-family: "Lexend", sans-serif;
}

body {
	margin-right: auto;
	margin-left: auto;
	background-color: #052e16;
	color: white;
	padding: 2rem;
	max-width: 40%;
}

@media (max-width: 1080px) {
	body {
		max-width: 80%;
	}
}

@media (max-width: 768px) {
	body {
		max-width: 80%;
	}
}

@media (max-width: 480px) {
	body {
		max-width: 80%;
	}
}

input[type=checkbox].hidden{
  opacity: 0;
  display: none;
}

select {
	width: 100%;
	background-color: transparent;
	color: white;
	border: .2rem solid #ffffff;
	border-radius: .5rem;
}

/* Color for options inside the select */
select *{
  color: black;
}

h3 {
	margin: .5rem;
}

.title {
	text-align: center;
}

.select-field {
	display: grid;
	align-items: center;
	background-color: #166534;
	margin-bottom: 1rem;
	padding-bottom: 1rem;
	padding: 0.5rem;
	border-radius: 1rem;
}

.lesson_div {
    transition: background-color 0.3s ease;
	background-color: #166534;
	padding-bottom: 1rem;
	padding: 0.5rem;
	border-radius: 1rem;
    cursor: pointer;
}

.lesson_div label {
    cursor: pointer;
}

.lesson_div.selected {
    transition: background-color 0.3s ease;
    background-color: #0f4c3b;
}

.copy-div {
	width: 100%;
	display: grid;
}

#copy-btn {
	color: white;
	background-color: #166534;
	padding-bottom: 1rem;
	padding: 0.5rem;
    border: 0.1rem solid #ffffff;
	border-radius: 1rem;
    cursor: pointer;
}

#calendar_url {
	color: white;
	background-color: #166534;
	margin-bottom: 1rem;
	padding-bottom: 1rem;
	padding: 0.5rem;
    border: none;
	border-radius: 1rem;
}

#gen_btn {
	margin-bottom: 1rem;
}