body{
	/*gradiente do corpo*/
	background: linear-gradient(0.25turn, #DC143C, #000000, #000000, #DC143C);
}  

article {
	padding: 100px;	
	
}

h1 {
	text-align: center;
	justify-content: center;
	text-transform: capitalize;

}

p {
	color: white;
	 
}

main {
	display: flex;	
	justify-content: center;
	overflow: hidden;
	padding: 40px;
}

.cards {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 500px;
	overflow: hidden;
	padding: 0;
	gap: 30px;
	border-radius: 20px;	
}	


.cards img {
	width: 20%;
	height: 80%;
	border-radius: 15px;
	filter: grayscale(1);
	transition: 0.2s ease;
	cursor:pointer;
	padding: 20px;
	margin: 0;
	margin-top: 10px;
}

.cards img:hover {
	filter: grayscale(0);
	transform: translateY(-1rem);
	box-shadow: rgba(232, 235, 236, 0.959) 3px 3px 3px 3px, rgba(14, 30, 37, 0.32) 2px 2px 10px 10px;
}	
		
footer {
	width: 100%;
	height: 300px;
	text-align: center;
    background-color: black;	
	font-family: san-serif;
	padding: 30px;	  
}

.logofooter {
	width: 150px;
	padding: 20px;
	
		
}

.rodape {
	display: flex;
	gap: 20px;
	justify-content: center;
	padding: 10px;
}

.texto {
	display: flex;
	justify-content: center;
	gap: 40px;	
	padding: 0;
	text-transform: capitalize;	
}

.leis {
	display: flex;
	justify-content: center;
	gap: 50px;
	padding: 10px;
}


/*media query*/
@media screen (min-width: 430px) and (max-width: 1020px){
	/*cabeçario*/
	.menu {
		display: none;
	}
	
	.block-color {
		flex-direction: column;
	}

/*cards*/
	.cards {
		flex-direction: column;
		height: 1020px;		
	}

	footer {
		flex-direction: column;
	}
}