/* 0 - 600PX: Phone 600 - 900px: Table portrait 900 - 1200px: Tablet landscape [1200 - 1800] is where our nortal styles apply 1800px + : Big desktop */ /* Media Query M3 */ /* Grid breakpoints */ .sliderLayoutContainer--prateleira { background-color: transparent; justify-content: center; } .sliderLayoutContainer--prateleira .sliderTrack--prateleira { gap: 16px; } .sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira { width: 97%; } .sliderLayoutContainer--prateleira .slide--prateleira { margin: 0; } .sliderLayoutContainer--prateleira .sliderArrows--prateleira { padding: 0; margin: 0; } .sliderLayoutContainer--prateleira .sliderLeftArrow--prateleira { left: -12px; width: 11.2px; height: 29.6px; } .sliderLayoutContainer--prateleira .sliderLeftArrow--prateleira::after { content: ""; position: absolute; padding: 10px; left: 8px; box-shadow: 2px -2px 0 0px #000 inset; border: solid transparent; border-width: 0 0 1px 1px; transform: rotate(45deg); } .sliderLayoutContainer--prateleira .caretIcon { display: none; } .sliderLayoutContainer--prateleira .sliderRightArrow--prateleira { right: -12px; width: 11.2px; height: 29.6px; } .sliderLayoutContainer--prateleira .sliderRightArrow--prateleira::after { content: ""; position: absolute; padding: 10px; right: 8px; box-shadow: 2px -2px 0 0px #000 inset; border: solid transparent; border-width: 0 0 1px 1px; transform: rotate(-135deg); } .sliderLayoutContainer--prateleira .paginationDotsContainer { align-items: center; bottom: -32px; } .sliderLayoutContainer--prateleira .paginationDot--prateleira { width: 10px; height: 10px; margin: 0 6px; background: #000000; } .sliderLayoutContainer--prateleira .paginationDot--prateleira--isActive { width: 17px !important; height: 17px !important; background-color: white; border: 0.5px solid #000000; } @media screen and (min-width: 1920px) { .sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira { width: 98%; } } @media screen and (max-width: 1024px) { .sliderLayoutContainer--prateleira .sliderTrack--prateleira { gap: 12px; } .sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira { width: 100%; } .paginationDotsContainer { bottom: -24px; } } @media screen and (max-width: 768px) { .sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira { width: 90%; } .sliderLayoutContainer--prateleira .sliderTrack--prateleira { gap: 8px; } .sliderLayoutContainer--prateleira .sliderLeftArrow--prateleira { left: -8px; } .sliderLayoutContainer--prateleira .sliderRightArrow--prateleira { right: -8px; } .sliderLayoutContainer--prateleira .paginationDotsContainer { bottom: -16px; } }