body {
	font-family: roboto, sans-serif;
	background-color: rgb(208, 220, 233);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-image: url(téléchargement.jfif);

}
nav{
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	background-color: rgb(22, 40, 201);
	color: rgb(209, 214, 219);
}
.container{
	width: 55vw;
	border-radius: 100px;
	background-color: rgba(24, 160, 160, 0.212);
}
.heading {
	font-family: 'roboto', sans-serif;
	margin: 35px auto 20px;
}

hr {
	border-top: 2px solid rgb(12, 202, 37);
	width: 60%;
	margin-bottom: 55px;
}

.main {
	width: 40vw;
	margin: auto;
	padding: 50px;
	
	background-color: rgba(92, 90, 81, 0.5);
	color: white;
	border-radius: 60px;
	height: 500px;
}

label {
	font-size: 20px;
}

.btn {
	background-color: rgb(216, 133, 32);
	color: rgb(82, 49, 10);
	width: 100px;
}

#finalAmount {
	background-color: antiquewhite;
	font-family: 'Lobster', cursive;
	display: none;
	margin: 30px auto;
}

#finalAmount h2 {
	color: rgb(204, 28, 28);
	font-size: 20px;
}

.finalValue {
	font-family: 'Amiri', serif;
}

@media (max-width: 768px) {
	hr {
		width: 50%;
	}

	.main {
		width: 100%;
	}
}

@media (max-width: 300px) {
	.heading {
		font-size: 60px;
	}

	hr {
		width: 70%;
	}

	.main{
		width: 100%;
	}

	#finalAmount h2,
	.finalValue {
		width: 60%;
		font-family: roboto, sans-serif;
		font-size: 10px;
	}
}