aemyn's internet place

/* aemyn.bear style v08 */

@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&display=swap');

@font-face { font-family: 'Aemyn Sans'; src: url('https://bear-images.sfo2.cdn.digitaloceanspaces.com/aemyn/aemynsans-v3-2.woff2') format('woff2'), url('https://bear-images.sfo2.cdn.digitaloceanspaces.com/aemyn/aemynsans-v3-1.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; }

:root { --width: 50rem; /* --font-main: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --font-secondary: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; */

--font-main: 'Aemyn Sans'; --font-secondary: 'Lexend';

--font-scale: 1.3em; --background-color: #00003c; --heading-color: yellow; --text-color: white; --link-color: #56b5e8; --visited-color: #cd78a7; --code-background-color: white; --code-color: black; --blockquote-background-color: #019f75; --blockquote-color: black; }

body { font-family: var(--font-secondary); font-size: var(--font-scale); margin: 8px auto; padding: 32px; max-width: var(--width); text-align: left; background-color: var(--background-color); word-wrap: break-word; overflow-wrap: break-word; line-height: 1.1; color: var(--text-color); }

h1, h2, h3, h4, h5, h6 { font-family: var(--font-main); color: var(--heading-color); }

strong, b { color: var(--heading-color); }

a { color: var(--link-color); cursor: pointer; text-decoration: none; }

a:hover { text-decoration: underline; }

nav { position: fixed; top: 0; left: 0; background: rgba(0,0,0,1); display: flex; align-items: center; text-align: center; width: 100%; line-height:1.3; height: auto; z-index: 999; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }

nav p { width: 50rem; padding: 0 20px; margin: 0 auto; }

nav a { margin-right: 8px; margin-left: 8px; text-align: center; font-size: 0.8em; }

button { margin: 0; }

content { line-height: 1.2; }

table { width: 100%; }

hr { border: 0; border-top: 1px dashed; }

img { max-width: 100%; }

code { font-family: monospace; font-size: 0.8em; background-color: var(--code-background-color); color: var(--code-color); border-radius: 0px; white-space: pre-wrap; word-break: keep-all; word-wrap: break-word !important; overflow-wrap: break-word !important;

}

blockquote { margin-left: 10%; margin-right: 10%; margin-top: 8px; margin-bottom: 8px; border-left: 2px dotted var(--background-color); border-right: 2px dotted var(--background-color); background-color: var(--blockquote-background-color); color: var(--blockquote-color); padding-left: 5%;
padding-right: 5%; font-size:0.7em;

font-family: monospace; text-align: center; font-style: bold;

}

footer { padding: 25px 0; text-align: center; }

button { border: 0; background-color: inherit; text-decoration: underline; color: var(--heading-color); }

.title { text-decoration: none; }

@-webkit-keyframes rainbow{

0%{color: #feef00;} 20%{color: #008020;} 40%{color: #014dfe;} 60%{color: #760089;} 80%{color: #e50003;}
90%{color: #e50003;}
100%{color: #fe8c00;} }

@-webkit-keyframes rainbow2{

0%{color: yellow;} 20%{color: lime;} 40%{color: cyan;} 60%{color: pink;} 80%{color: red;}
90%{color: orange;}
100%{color: yellow;} }

@-webkit-keyframes trans{ 0%{color: #5acefb;}
25%{color: #f4a9b9;} 50%{color: #fffefe;} 75%{color: #f4a9b9;} 100%{color: #5acefb;}
}

.title h1 { color: red; /* -webkit-animation: rainbow2 60s infinite; */ text-align: center; } }

.inline { width: auto !important; }

pre { overflow-x: hidden; overflow-y: hidden; font-family: monospace; font-size: 0.8em; text-align: left !important;

word-break: keep-all; white-space: pre-wrap; word-wrap: break-word !important; overflow-wrap: break-word !important;

}

.highlight, .code { margin-left: 10%; margin-right: 10%;

margin-top: 8px; margin-bottom: 8px; /* padding: 1px 15px; */ padding-left: 5%; padding-right: 5%;

padding-top: 5%; padding-bottom: 5%;

border-left: 2px dotted var(--background-color);
border-right: 2px dotted var(--background-color);
border-radius: 0px;

margin-block-start: 1em; margin-block-end: 1em; overflow-x: auto; font-family: monospace; font-size: 0.8em; text-align: left; word-break: keep-all; white-space: pre-wrap; word-wrap: break-word !important; overflow-wrap: break-word !important;

background-color: var(--code-background-color); color: var(--code-color);

}

/* blog post list */ ul.blog-posts { list-style-type: none; padding: unset; }

ul.blog-posts li { display: flex; }

ul.blog-posts li span { flex: 0 0 130px; }

ul.blog-posts li a:visited { color: var(--visited-color); }