.grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 30px; @media (min-width: 2500px) { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; } @media (min-width: 3000px) { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; } @media (max-width: 1500px) { grid-template-columns: 1fr 1fr 1fr; } @media (max-width: 1000px) { grid-template-columns: 1fr 1fr; } @media (max-width: 600px) { grid-template-columns: 1fr; } } .action::before { content: "➡ "; } .metaService { margin: 6px; margin-bottom: 0px; } .descService { text-align: left; } .domService { font-size: 0.8em; } .domService code, .domService em { font-size: inherit; } .domService, .domService code { overflow-wrap: anywhere; @media @light { color: @darkerColor; } @media @dark { color: @lightlessColor; } } footer.antopie { display: flex; flex-direction: column; } .interlude { display: flex; justify-content: center; margin-top: 20px; margin-bottom: 10px; } .interlude > hr { border: 0; border-top: 2px gray dashed; width: 520px; } .row { .centered(); display: flex; flex-direction: row; flex-wrap: wrap; } .row > a.button { margin: 10px; } .padRow { padding: 10px; } small.row a { font-size: 0.8em; } h1.titreService { font-size: 1.3em; text-align: center; margin: 0px; padding-bottom: 0px; padding-top: 0px; } .red { color: red; }