:root { --body-bg-image: url("/images/aqua.gif"); } * { image-rendering: pixelated; box-sizing: border-box; } html, body { margin: 0; padding: 0; } body { font-family: "Space Mono", monospace; font-weight: 400; font-style: normal; font-size: 15px; max-width: 900px; margin: auto; background: #e6e9ea; /* background-image: var(--body-bg-image); */ } p { text-align: justify; } footer { bottom: 0px; left: 0; text-align: center; width: 100%; } .header { text-align: center; } .header nav { display: block; } .header ul, footer ul { padding: 0px; } .header ul>li { display: inline-block; text-align: center; } .header ul>li:not(:last-child):after { content: " | "; } .header ul>li a { text-decoration: none; font-size: 15px; color: #000000; font-weight: bold; } .text-center { /* text-align: center; */ } footer ul>li { display: inline-block; } footer ul>li>p { margin-block-end: unset; margin-block-start: unset; } .logo { text-decoration: none; color: #000000; } h4.slogan { margin: 0px; } .mt-10 { margin-top: 10px; } .font-bold { font-weight: bold; } .font-italics { font-style: italic; } table { border-collapse: collapse; } th, tr, td { border: 1px solid; } table tr { padding-bottom: 10px; } table th { padding-right: 20px; } table td { padding: 10px; } .post-date { font-size: 15px; font-style: italic; } .post-lists li { list-style-type: "◆ "; margin-bottom: 5px; } @media (max-width: 1000px) { body { font-size: 80%; padding: 3%; } #blog img { max-width: 80%; } } /* Underline Reveal */ .hvr-underline-reveal { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; overflow: hidden; } .hvr-underline-reveal:before { content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; background: #000000; height: 1px; -webkit-transform: translateY(4px); transform: translateY(4px); -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .hvr-underline-reveal:hover:before, .hvr-underline-reveal:focus:before, .hvr-underline-reveal:active:before { -webkit-transform: translateY(0); transform: translateY(0); } .tools-container { --auto-grid-min-size: 16rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--auto-grid-min-size), 1fr)); grid-gap: 1rem; } .tool { border: 1px solid #000000; width: 252px; margin: 10px; padding: 10px; box-shadow: 2px 6px; background: linen; } img { max-width: 100%; } .tools-container .tool-name * { font-weight: bold; color: #000000; } .tools-container label { font-weight: bold; } p.first-letter::first-letter { font-size: 150%; } .highlight { background: #000000; padding: 2px 5px 2px 5px; color: #ffffff; } .highlight.tags { border-radius: 8px; } .article { line-height: 25px; } .etyone { margin-bottom: 5px; } .gr_grid_container { /* customize grid container div here. eg: width: 500px; */ } .gr_grid_book_container { /* customize book cover container div here */ float: left; width: 98px; height: 160px; padding: 0; overflow: hidden; } .four-o-four, .f-o-f-message { display: flex; justify-content: center; } th { background-color: #3b3b3b; color: white; border: 1px solid #000000; } tr:nth-child(even) { background-color: #f2f2f2; } tr:nth-child(odd) { background-color: #f8f8f8 } .text-lightish-50 .hvr-underline-reveal.links { text-decoration: underline; }