Deixar partes do layout ocupando toda a tela

Layout
1

Olá! Procurei em vários tópicos aqui na loja integrada e nenhum funcionou para mim.

Gostaria que: O menu + banner + carrosel de marcas + mini banner + título de categoria ficasse ocupando a tela toda.

O “corpo” do site( a parte onde ficam os produtos na HOME) + a parte onde fica o logo e o carrinho, gostaria de deixar com um pouco de “borda” sem encostar muito nas laterais da tela.

Porém, todos os códigos que peguei e tentei colocar, desconfiguram todo o meu site :frowning:

Meu site é: https://www.prosoundonline.com.br/
Como ele está:

2021-07-10_145650
2021-07-10_1456501898×5656 1.21 MB

Como eu gostaria que ficasse (Tirei print e fui esticando para terem uma ideia)

ajudua-loja-integrada
ajudua-loja-integrada1200×3400 630 KB

Eu tentei inspecionar elemento e ir editando, ajustando, vendo tópicos aqui, mas nada funcionou.

2

Seria isso?

3

Boa tarde, Leonardo!!
Tudo bem?
Como faço para deixar nossa loja assim?
Igual a loja da Bruna?
Agradeço demais se puder nos ajudar.

4

tente assim:

.full.menu .nivel-dois .mega-recebe {
	width: 50%;
	margin: auto
}

@media only screen and (max-width:767px) {
	.menu.superior .nivel-dois {
		display: none
	}
}

.mega-recebe-prod .listagem li.listagem-linha {
	margin: auto
}

@media only screen and (max-width:767px) {
	.listagem-linha li {
		margin-top: 0
	}
}

@media (prefers-color-scheme: dark) {
	background-color: green!important;
	color: yellow!important;
}

.row-fluid.banner.hidden-phone {
	text-align: center;
}

.conteiner-principal .conteiner {
	max-width: 100%;
	!important;
}

#listagemProdutos {
	max-width: 1200px;
	margin: auto
}

.banner-center {
	width: auto;
	height: auto;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 12px 0 26px;
}

@media only screen and (max-width: 767px) {
	.banner-center {
		display: block;
		margin-top: 14px
	}
}

.modulo {
	margin-left: auto;
	margin-right: auto;
	text-align: center
}

.menu.superior>ul.nivel-um {
	width: fit-content;
	margin: auto;
	text-align: center
}

.menu.superior .nivel-um>li {
	float: none;
	display: inline-flex;
	border-right: none;
	border-left: none
}

.fundo-principal,
.botao.principal,
.menu li:hover>a .fundo-secundario,
.flex-control-paging li a.flex-active,
.dropdown-menu>li>a:hover,
.filtro.lista ul li label:hover,
.menu-simples li a:hover,
.menu-simples li.active a {
	background-color: #132651
}

.fundo-secundario {
	background-color: #132651;
}

.barra-inicial .canais-contato a, 
.barra-inicial .canais-contato i,
.barra-inicial .canais-contato span {
    color: white;
}
5

Poxxxxaaaaaaaaaaaaaaa!!!
Me ajudou demais, funcionou muito aqui.
grato!!
E Deus lhe abençoe por nos ajudar, não só a mim, mas a tantos outro que tenha duvidas e esta lutando.

1 curtida