.pane_details { display: flex !important; flex-direction: column; align-items: flex-start; justify-content: flex-start; .spacer_container { height: min-content !important; width: 100%; padding-top: 0 !important; } } .spacer_contact { justify-content: start !important; .contact_info .chunk .header { background-color: var(--background-1); white-space: nowrap; text-align: justify; } } .about_me { padding: 0 var(--spacing-thicc) var(--spacing-horizontal); } .early_history { justify-self: center; } .prog_languages, .software { * { margin: 0.5rem; } } .software_row { grid-template-columns: 60% auto; } .software { .three_dimensional_printing { color: var(--accent-magenta); } .android { color: var(--accent-green); } .anubis { color: var(--accent-green); } .blender { color: var(--accent-orange); } .davinci_resolve { color: var(--accent-blue); } .gimp { color: var(--accent-magenta); } .git { color: var(--accent-orange); } .ios { color: var(--white-0); } .libreoffice { color: var(--accent-green); } .linux { color: var(--white-0); } .macos { color: var(--white-0); } .ms_office { color: var(--accent-orange); } .ms_windows { color: var(--accent-blue); } .musescore { color: var(--accent-cyan); } .nextcloud { color: var(--accent-cyan); } .nginx { color: var(--accent-green); } .obs { color: var(--white-0); } .photoshop { color: var(--accent-blue); } .premiere_pro { color: var(--accent-purple); } .prusaslicer { color: var(--accent-orange); } .shopbot_control_software { color: var(--accent-blue); } .cnc_machining, .vectric_aspire { color: var(--accent-red); rotate: 90deg; } .zotero { color: var(--accent-orange); } } .prog_languages { .asciidoc { color: var(--accent-cyan); } .css { color: var(--accent-purple); } .html { color: var(--accent-orange); } .json { color: var(--accent-cyan); } .markdown { color: var(--accent-indigo); } .nginx { color: var(--accent-green); } .python { color: var(--accent-blue); } .ron { color: var(--accent-orange); } .rust { color: var(--accent-orange); } .scss { color: var(--accent-magenta); } .toml { color: var(--accent-orange); } .shell { color: var(--accent-green); } .yaml { color: var(--accent-yellow); } } .docker { /* Docker is protective of their colours. https://www.docker.com/company/newsroom/media-resources/ */ color: #1d63edff; } @media only screen and (max-width: 500px) { .awards, .certifications, .education, .prog_languages, .software, .work_history { width: 100%; } }