.grid-c2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; } .grid-c3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; } @media (max-width: 1100px) { .grid-c3 { grid-template-columns: 1fr 1fr; } } @media (max-width: 768px) { .grid-c2, .grid-c3 { grid-template-columns: 1fr; } } .grid-hashes { display: grid; grid-template-columns: repeat(4,0.5fr) 0.25fr; gap: 20px; } .grid-credits { display: grid; grid-template-columns: 0.5fr 1fr 0.25fr; gap: 20px; } .grid-entries { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; margin-bottom: 20px; } @media (max-width: 1400px) { .grid-entries { grid-template-columns: repeat(5, minmax(0, 1fr)); } } @media (max-width: 1200px) { .grid-entries { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 900px) { .grid-entries { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 640px) { .grid-entries { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 420px) { .grid-entries { grid-template-columns: 1fr; } }