.sliderLayoutContainer--carousel { padding: 0 59.2px 113px; @include mq(xl, min) { padding: 0 379.2px 113px; } @include mq(lg, max) { padding: 0 57.2px 105px; } @include mq(md, max) { padding: 0 55.2px 65px; } .sliderArrows { padding: 0; margin: 0; &.sliderLeftArrow { margin-left: 40px; @include mq(xl, min) { margin-left: 360px; } &::before { content: ""; width: 11.2px; height: 29.6px; background-image: url("https://agenciamagma.vteximg.com.br/arquivos/arrow-left-andreamm.svg"); } } &.sliderRightArrow { margin-right: 40px; @include mq(xl, min) { margin-right: 360px; } &::after { content: ""; width: 11.2px; height: 29.6px; background-image: url("https://agenciamagma.vteximg.com.br/arquivos/arrow-right-andreamm.svg"); } } .caretIcon { display: none; } } .paginationDotsContainer { bottom: 64px; gap: 12px; align-items: center; @include mq(md, max) { bottom: 32px; } .paginationDot { width: 10px; height: 10px; margin: 0; padding: 0; background: #000000; &--isActive { width: 17px !important; height: 17px !important; border: 0.5px solid #000000; background: #ffffff; } } } }