/* Comentario */

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

* {
	margin: 0px;
	padding: 0px;

}

img {
	display: block;
	width: 100%;
}

/* Tipografia */


.titulo-topo {
	font-family: "Roboto Serif", serif;
	font-weight: 100;
	color: blue;
	font-size: 50px;
	margin-bottom: 10px;
}


.titulo-a {
	font-family: "Roboto Serif", serif;
	font-weight: 100;
	color: rgb(255, 0, 200);
	font-size: 50px;
	margin-bottom: 10px;
}

.titulo-b {
	color: rgb(255, 153, 0);
	font-size: 30px;
}

.texto {
	font-family: "Roboto Serif", serif;
	font-weight: 400;
	color: #ffffff;
	font-size: 16px;
	line-height: 26px;
	margin-bottom: 10px;
}

.texto-topo {
	font-family: "Roboto Serif", serif;
	font-weight: 400;
	color: #a8a8a8;
	font-size: 16px;
	line-height: 26px;
	margin-bottom: 10px;
}

/* ESTRUTURA */




	section {
	width: 100%;
	margin-top: auto;
	margin-bottom: auto;
}



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


}

.container-topo {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 900px;
	height: 500px;
	background-image: url(imagens/mp100.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
	justify-content: center;

}

.box-topo {
	margin-left: auto;
	margin-right: auto;
	width: auto;
	max-width: 500px;
    align-items: center;
	display: flex;

}

/* COLUNAS */

.col-2 {

	margin-bottom: 10px;
	width: 50%;
}

.col-3 {

	margin-bottom: 10px;
	width: 33.3%;
}

.col-4 {

	margin-bottom: 10px;
	width: 25%;

}

/* FLEX */

.flex-sb {
	display: flex;
	justify-content: space-between;
}

.flex-center {
	display: flex;
	justify-content: center;
}

.flex-sa {
	display: flex;
	justify-content: space-around;
}

.flex-gap-peq {
	display: flex;
	gap: 20px
}

/* CORES DE FUNDO */

.bc-escuro {
	background-color: #464646;
}

.bc-meio {
	background-color: #8f8f8f;
}

.bc-claro {
	background-color: #d7d7d7;
}

.bc-preto {
	background-color: #1f1f1f;
}

/*PADDINGS E MARGINS*/

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

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

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

.pad-t-b-maior {
	padding-top: 200px;
	padding-bottom: 200px;
}


.teste {
	width: 200px;
	height: 200px;
	background-color: aqua;
	margin-left: auto;
	margin-right: auto;
}