main { margin: 0px !important; padding: 0px !important; width: 100vw; } .serviceWrapper { width: 80%; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 1em; margin: auto auto; margin-top: 4em; } .categoryContainer { border: 4px solid #002244; border-radius: 5px; box-shadow : 0 0 20px #002244; margin-bottom: 20px; } .categoryLabel { background-color: #002244; color: white; padding-left: 10px; font-family: monospace; font-size: 24px; } .service { border: 2px solid #002244; border-radius: 5px; padding: 10px; margin: 10px; display: flex; flex-direction: row; } .serviceContent { flex-grow: 1; } .serviceTitle { margin: 0.2em !important; } .serviceDescription { margin-top: 0px !important; } .serviceDescription::before { content: " - "; font-size: 18px; display: inline; } .serviceLink { width: 70%; padding-bottom: 5px; border-radius: 5px; border: 2px solid #002244; padding: 7px; margin-top: 4px; } .serviceLink > a { margin-bottom: 10px; word-break: break-word; } .serviceImage { flex-shrink: 1; width: 100px; height: 100px; margin: auto auto; } @media (max-width: 800px) { .serviceWrapper { grid-template-columns: 1fr; } .categoryContainer { width: 100%; } }