/* Comentario */

/* 
nome de uma tag{...}
#nome de uma tag com id{...}
.nome de uma tag com uma classe{...}
 */


 /* Tipografia */
h1{
	font-size: larger;
	margin-bottom: 20px;
}

.titulo-A{
	font-size: 60px;

font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
margin-bottom: 50px;
}

.titulo-B{
	font-size: 40px;

font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
margin-bottom:30px;
}
.texto{
	font-size: 16px;
	line-height: 26px;
	color: black;
	margin-bottom: 10px;

}

/* Cores */
.cor-A{
	color: blue;
}


.cor-B{
	color: brown;
}

.cor-fundo-A{
	background-color: lightcyan;
}
.cor-fundo-B{
background-color: rgb(35, 35, 104);
}
.cor-fundo-C{
	background-color: rgb(48, 237, 184);
}

/* Estrutura */

.pad-t-b-grande{
	padding-top: 80px;
	padding-bottom: 80px;
}

.pad-t-b-medio{
	padding-top: 50px;
	padding-bottom: 50px;
}

.pad-t-b-pequeno{
	padding-top: 30px;
	padding-bottom: 30px;
}

header{
height: 30px;
}

section{
	
}

footer{
	height: 30px;
}

.container{
	
	width: 100%;
	max-width: 900px;
	margin-right: auto;
	margin-left: auto;
}


.grelha-12-col
{
display: grid;
grid-template-columns: repeat(12,1fr);
gap: 20px;
}


.item-12-col{
grid-column: span 12;


margin-bottom: 10px;
}

.item-6-col{
grid-column: span 6;


margin-bottom: 10px;
}

.item-4-col{
grid-column: span 4;

margin-bottom: 10px;
}
.item-3-col{
grid-column: span 3;

margin-bottom: 10px;
}