.container--details { padding-left: 40px; padding-right: 40px; @media screen and (min-width: 1921px) { padding-left: 360px; padding-right: 360px; } } .listContainer { border-bottom: 1px solid $color-gray9; margin-bottom: 32px; display: flex; justify-content: space-around; align-items: end; @media screen and (max-width: 1024px) { margin-top: 16px; padding-bottom: 16px; border-bottom: 1px solid $color-gray12; border-top: 1px solid $color-gray12; flex-direction: column; align-items: initial; margin-bottom: 16px; } } .listItem { background-color: transparent; padding: 0 16px 0 16px; margin: 0; height: 38px; width: 114px; @media screen and (min-width: 1921px) { width: 142px; } @media screen and (max-width: 1024px) { margin-top: 16px; padding: 0; width: unset; } :global(.vtex-button) { background-color: transparent; cursor: pointer; border: none; @media screen and (max-width: 1024px) { width: 100%; display: flex; } } :global(.vtex-button__label) { font-weight: 400; font-size: 18px; line-height: 38px; color: $color-gray9; text-transform: capitalize; margin: 0; padding: 0 !important; @media screen and (min-width: 1921px) { font-size: 24px; } } } .listItemActive { border-bottom: 2px solid $color-black-100; @media screen and (min-width: 1921px) { border-bottom: 3px solid $color-black-100; } @media screen and (max-width: 1024px) { border: none; } :global(.vtex-button__label) { color: $color-black-100; margin: 0; padding: 0; } } .listItemActive--descricao { border-bottom: 2px solid $color-black-100; @media screen and (min-width: 1921px) { border-bottom: 3px solid $color-black-100; } @media screen and (max-width: 1024px) { border: none; padding: 0; } :global(.vtex-button) { border: none; border-radius: 0%; } :global(.vtex-button__label) { color: $color-black-100; margin: 0; padding: 0; } }