I'm Meret (she/her), this is my neocite for my art, writing and random little thoughts. I'm a queer writer (and artist) with a focus on rewrites of video games & writing my own romance novels. My ao3 is linked here .
Here are links to my current writing projects:
Eclipsed - A Last Legacy rewrite starring Anne Nova, my oc.
The Mo Dao Zu Shi Series - a collection of oc x canon fics
Now & Forever - A rewrite of the Baxter DLC from the video game Our Life: Beginning and Always, starring my ocs Anne Briars and Quinn Briars
@font-face { font-family: Azkasia; /*Internal name of the font you'll use for this stylesheet.*/ src: url("Azkasia%20Demo.ttf"); /*Put the url of the font on your site here. DO NOT HOTLINK.*/ } body { margin: 0; padding: 0; color: #fff; background: #00071c; font-size: 0.95em; font-family: "Liberation Mono", "Source Code Pro", "Courier New", monospace; } a { color: #c1cdf1; } /*Increased spacing to compensate for current font - may want to change if you use something else.*/ p { line-height: 150%; } /*Set font for headings.*/ h1, h2, h3 { text-align:center; font-family: Azkasia, Cursive, serif; letter-spacing: 0.175em; word-spacing: 0.2em; } /*Make the first letter slightly bigger and a different color :) */ h1::first-letter, h2::first-letter, h3::first-letter { color: #aae6ff; font-size: 1.25em; font-weight:bold; } /*Make lowercase headers bigger, since this font's a little harder to read.*/ h1 { font-size: 2.325em; } /*Make h2 and h3 in ALLCAPS.*/ h2, h3 { text-transform: uppercase; } /*h3 is left-aligned and indented.*/ h3 { text-align: left; margin-left: 1em; font-size: 1.25em; } /*Change color when bold or italic.*/ b { color: #aae6ff; } i { color: #cdf0ff; } hr { border: 0; background: linear-gradient(rgb(0,0,0,0), rgb(255,255,255,1), rgb(0,0,0,0)); height:1px; margin: 2em 1em; } blockquote { font-style:italic; border-left: 1px solid #aae6ff; background: rgb(170,230,255,0.15); padding: 5px 20px; } /*** NOTE: This stylesheet uses elements instead of div classes in a few places (nav1, nav2). If you want to use them as classes, put "." in front of all the custom element names in the stylesheet here. For example: nav1 .navlink {} would be .nav1 .navlink {} instead. ***/ /*Content all goes in here.*/ .wrapper { display: block; margin: 0 auto; width: 800px; position:relative; } /*This is where the pretty header image goes! Replace the url with the location of your own.*/ .header { display: block; background: linear-gradient(rgb(0,7,28,0.99), rgb(0,7,28,0)), url("/skaiabg.png") no-repeat; /*REPLACE ME!*/ background-size: 900px auto; height:400px; top: 0; } /*Miscellanous fancy styling for the title inside the header area.*/ .header h1 { font-size: 3.25em; padding-top: 100px; text-transform:lowercase; } .header h1::first-letter { color: #fff; } /*Puts "[]" around the title.*/ .header h1:before { content: "["; } .header h1:after { content: "]"; } /*Nav1 is for the link buttons on the side.*/ nav1 { display: block; position: absolute; float: right; margin-left: 800px; top: 100px; } nav1 .navlink { display: block; margin: 15px 0px; padding: 5px 2px; width: 100px; text-align: center; background: #333; font-family: Azkasia; font-size: 1.5em; text-transform: uppercase; border-radius: 0 15px 5px 0px; } nav1 .navlink a { color: #fff; text-decoration: none; } nav1 .navlink:hover, nav1 .navlink:focus-within { background: #555; padding-left:5px; transition:ease 0.5s; /*So the tab button appears to 'move' instead of instantly changing and popping outwards.*/ } /*Nav2 is for the links directly below the header.*/ nav2 { display: block; width: 100%; background: #444e6f; text-align: center; } nav2 .navlink { display: inline-block; margin: 10px 5px; padding: 2px; font-size: 1.5em; text-decoration:none; font-family: "Symbola", "Palatino Linotype", Garamond, serif; font-weight:bold; } nav2 .navlink a { color: #fff; text-shadow: 0 0 2px #c3cdea; } nav2 .navlink a:hover, nav2 .navlink a:focus { text-shadow: 0 0 3px #dae1f5; transition: ease 5s; } /*Main page content goes in here. (Replace the image with your own footer image.) The rgb color in the linear-gradient here should match your actual main div background color, so the image appears to 'fade in' from the image to solid background. */ .main { display: block; margin: 0; position: relative; /*In order: gradient overlay (opacity going from 1 to 0.875), actual background color, footer image*/ background: linear-gradient(rgb(16,24,50,1), rgb(16,24,50,0.875)), #101832 url("/skaiabg.png") no-repeat; background-size: 900px auto; background-position:bottom center; } /*Inside div. I don't remember why this was a div and nothing else, but it is. If you do change that, remember to add display:block; to the element first.*/ .inner { padding: 1px 20px 20px 20px; /*The 1px is to prevent paragraph margin overflow from mucking up the background. CSS is weird sometimes.*/ } /*Prevent image overflow.*/ .inner img { max-width: 100%; height:auto; } /*Footer with small text at the bottom of the page.*/ .footer { display: block; padding: 0.75em 20px; text-align: center; font-size: 0.85em; background: #444e6f; line-height: 150%; } .footer a { color: #dfdfdf; } /*** For narrower screens that can't handle the full version of the page. ***/ /*For desktop screens that are too narrow for the default width, keep the default layout, but with a narrower column.*/ @media(max-width:1050px) { .wrapper { width: 600px; } nav1 { margin-left:600px; } } /*For smallest screens, switch to percentage-based width, and move the side tab buttons to the space under the header as centered buttons.*/ @media(max-width:900px) { .wrapper { width: 80%; } nav1 { position:static; margin-left:0; margin: 0 auto; width: 100%; text-align:center; } nav1 .navlink { display: inline-block; border-radius: 15px 5px; margin: 15px 0; padding: 5px 15px 10px 15px; width: auto; } nav1 .navlink:hover { padding-left: 15px; } } /*If on mobile, maximize the space available by increasing width to 95%.*/ @media(orientation:portrait) { .wrapper { width: 95%; } }