.crypto-marquee-container{ position:relative; top:51px; z-index:90; width:100%; background:#fff; border-bottom:1px solid #eee; overflow:hidden; height:50px; box-shadow:0 2px 8px rgba(0,0,0,.03); margin-bottom: 50px; border-top:1px solid #DDDDDD; } #nav.sticky + .crypto-marquee-container{ position:sticky; top:104px; } .crypto-marquee { display: flex; align-items: center; height: 50px; will-change: transform; } .crypto-item { display: flex; align-items: center; min-width: 110px; padding: 0 12px; font-family: \'Lato\', Arial, sans-serif; font-size: 14px; border-right: 1px solid #eee; height: 50px; white-space: nowrap; background: transparent; flex-shrink: 0; } .crypto-icon { width: 28px; height: 28px; max-width: 28px; max-height: 28px; margin-right: 10px; vertical-align: middle; } .crypto-name { font-weight: 600; color: #222; margin-right: 8px; } .crypto-symbol { font-size: 14px; color: #888; margin-left: 2px; } .crypto-price { font-weight: 600; margin-right: 10px; color: #222; } .crypto-change { font-size: 14px; min-width: 52px; } .crypto-change.positive::before, .crypto-change.negative::before { display: inline-block; content: ""; width: 8px; height: 8px; background-size: contain; background-repeat: no-repeat; margin-right: 4px; } .crypto-change.positive { color: #0fba83; } .crypto-change.positive::before { background-image: url("/img/coin/caret-up.svg"); } .crypto-change.negative { color: #f55c4e; } .crypto-change.negative::before { background-image: url("/img/coin/caret-down.svg"); transform: rotate(180deg); } .crypto-item a { display: flex; align-items: center; text-decoration: none; /* Quita subrayado */ color: inherit; /* Hereda color del padre */ width: 100%; /* Hace que el enlace ocupe todo el div */ height: 100%; /* Ocupa todo el alto */ white-space: nowrap; /* No permite salto de línea */ gap: 5px; } .crypto-item a:visited, .crypto-item a:active, .crypto-item a:hover { color: inherit; /* Evita colores "link" */ text-decoration: none; } .crypto-item img.crypto-icon { pointer-events: none; } .crypto-marquee.crypto-detalle{ overflow: scroll; gap: 30px; justify-content: space-between; } .crypto-logo{ display: flex; align-items: center; justify-content:center; } .crypto-names{ display:flex; flex-direction:column; gap: 5px; line-height: normal; } .crypto-symbol, .crypto-name{ margin-left: 0px; margin-right: 0px; } .crypto-info{ display: flex; gap: 34px; align-items: center; } .crypto-sparkline svg{ width:105px; height:40px; } .sparkline-up .sparkline-line { stroke:#17c784; stroke-width:1; } .sparkline-down .sparkline-line { stroke:#ea3943; stroke-width:1; } .sparkline-up .gradient-start { stop-color:#17c784; stop-opacity:.20; } .sparkline-up .gradient-end { stop-color:#17c784; stop-opacity:0; } .sparkline-down .gradient-start{ stop-color:#ea3943; stop-opacity:.20; } .sparkline-down .gradient-end { stop-color:#ea3943; stop-opacity:0; } .crypto-buy{ background: transparent; border: 1px solid #E16826; color: #E16826; font-size: 12px; font-weight: 700; line-height: 160%; border-radius: 999px; padding: 2px 32px; text-decoration: none; min-width: 80px; text-align: center; } .crypto-buy:hover{ color: #fff; background: #E16826; text-decoration: none; } @media (max-width: 768px) { .crypto-marquee.crypto-detalle{ padding: 0 20px; } #nav.sticky + .crypto-marquee-container{ top:103px; } }