.section-marcas {
	--titulo-font-size: 12px;
	width: 100%;
	padding-bottom: calc(var(--titulo-font-size) * 2);
	background-color: #979FA4;
}

	.section-marcas .title {
		font-family: 'Montserrat-Bold';
		font-size: var(--titulo-font-size);
		color: #FFFFFF;
		display: flex;
		padding: var(--titulo-font-size) 0px;
		justify-content: center;
	}



	.section-marcas .carrousel {
		display: flex;
		margin-top: calc(var(--titulo-font-size)*.2);
		--carousel-duration: 30s;
		--carousel-width: 80vw;
		--carousel-item-width: 300px;
		--carousel-item-height: calc(var(--titulo-font-size) * 4);
		--carousel-item-gap: 2rem;
		--clr-cta: rgb(0, 132, 209);
		position: relative;
		width: var(--carousel-width);
		height: var(--carousel-item-height);
		overflow: clip;
	}

		.section-marcas .carrousel > img {
			position: absolute;
			top: 0;
			left: calc(100% + var(--carousel-item-gap));
			height: var(--carousel-item-height);
			display: grid;
			grid-template-rows: 200px auto 1fr auto;
			gap: 0.25rem;
			/* animation */
			will-change: transform;
			animation-name: marquee;
			animation-duration: var(--carousel-duration);
			animation-timing-function: linear;
			animation-iteration-count: infinite;
			animation-delay: calc( var(--carousel-duration) / var(--items) * 1 * var(--i) * -1 );
			&:nth-child(1) { --i: 0; }
		    &:nth-child(2) { --i: 1; }
		    &:nth-child(3) { --i: 2; }
		    &:nth-child(4) { --i: 3; }
		    &:nth-child(5) { --i: 4; }
		    &:nth-child(6) { --i: 5; }
		    &:nth-child(7) { --i: 6; }
			&:nth-child(8) { --i: 7; }
			&:nth-child(9) { --i: 8; }
			&:nth-child(10) { --i: 9; }
			&:nth-child(11) { --i: 10; }
			&:nth-child(12) { --i: 11; }
			&:nth-child(13) { --i: 12; }
			&:nth-child(14) { --i: 13; }
			&:nth-child(15) { --i: 14; }
		}


/* modo mobile 360px */
@media (min-width: 0px) and (max-width: 480px) {
	.section-marcas {
		--titulo-font-size: 15px;
	}
}

/* modo tablet 800px */
@media (min-width: 481px) and (max-width: 1000px) {
	.section-marcas {
		--titulo-font-size: 20px;
	}
}

/* modo laptop 1280px */
@media (min-width: 1001px) and (max-width: 1500px) {
	.section-marcas {
		--titulo-font-size: 25px;
	}
}

/* modo pc 1920px */
@media (min-width: 1501px) and (max-width: 2100px) {
	.section-marcas {
		--titulo-font-size: 25px;
	}
}

/* modo 4k */
@media (min-width: 2101px) {
	.section-marcas {
		--titulo-font-size: 32px;
	}
}