@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

*{
	font-family: "Roboto", sans-serif;
	color: #2B0548;
	text-align: center;
}
span{
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-style: normal;
	color: red;
}
.title{
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-style: normal;
	font-size: 50px;
	color: #2B0548;
}
.conteudo h3{
	width: 100%;
}
.menu {
    background-color: #f8f8f8; /* Cor de fundo do menu */
    padding: 10px; /* Espaçamento interno do menu */
    border-bottom: 2px solid #ccc; /* Linha na parte inferior */
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-style: normal;
	font-size: 18px;
	color: #2B0548;
	flex-wrap: none;
}

.menu ul {
    list-style-type: none; /* Remove as bolinhas padrão da lista */
    padding: 0; /* Remove o padding padrão da lista */
    margin: 0; /* Remove a margem padrão da lista */
    display: flex; /* Faz a lista ser exibida em linha */
    justify-content: space-around; /* Espaça os itens uniformemente */
}

.menu li {
    padding: 10px 20px; /* Espaçamento interno dos itens */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
    transition: background-color 0.3s; /* Transição suave para hover */
}

.menu li:hover {
    background-color: #e0e0e0; /* Cor de fundo ao passar o mouse */
    border-radius: 5px; /* Cantos arredondados ao passar o mouse */
}

.btn{
	border-radius: 15px;
	text-transform: uppercase;
	color: #fff;
	font-size: 12px;
	padding: 15px 50px;
	cursor: pointer;
	font-weight: bold;
	width: 200px;
	align-self: center;
	border-width: 0px;
	margin: 15px auto 50px auto;
    background-color: #2B0548;
}


/*Estilização para dispositívos móveix*/
@media screen and (max-width: 980px){
		
	.menu {
		background-color: #f8f8f8; /* Cor de fundo do menu */
		padding: 10px; /* Espaçamento interno do menu */
		border-bottom: 2px solid #ccc; /* Linha na parte inferior */
		font-family: "Roboto", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: 18px;
		color: #2B0548;
	}

	.menu ul {
		list-style-type: none; /* Remove as bolinhas padrão da lista */
		padding: 0; /* Remove o padding padrão da lista */
		margin: 0; /* Remove a margem padrão da lista */
		display: flex; /* Faz a lista ser exibida em linha */
		justify-content: space-around; /* Espaça os itens uniformemente */
		flex-wrap: wrap;
	}

	.menu li {
		padding: 10px 20px; /* Espaçamento interno dos itens */
		cursor: pointer; /* Muda o cursor para indicar que é clicável */
		transition: background-color 0.3s; /* Transição suave para hover */
		width: 100%;
	}

	.menu li:hover {
		background-color: #e0e0e0; /* Cor de fundo ao passar o mouse */
		border-radius: 5px; /* Cantos arredondados ao passar o mouse */
	}
}