/**
 * Fangirling (Modified from Pico's Default Theme)
 *
 * @author  Flamebyrd
 * @link    http://random.fangirling.net
 * @license http://opensource.org/licenses/MIT The MIT License
 */

* {
    box-sizing: border-box;
    border: 0 none;
    margin: 0;
    padding: 0;
    -webkit-transition: all 0.051s ease;
    -moz-transition: all 0.051s ease;
    -o-transition: all 0.051s ease;
    -ms-transition: all 0.051s ease;
    transition: all 0.051s ease;
}

.hidden { display: none !important; }

#skip a
{
position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;
}

#skip a:focus
{
position:static;
width:auto;
height:auto;
}


.slide {
    overflow-y: hidden !important;
    -webkit-transition: height .5s ease-in !important;
            transition: height .5s ease-in !important;
}

/*** BASIC LAYOUT ***/

html, body { height: 100%; }

/* body { display: flex; flex-direction: column; } */
/* #main { ! flex: 1 0 auto;  } */
/* #header, #footer { flex: 0 0 auto; } */

#main {
  padding: 0;
}

.container {
    max-width: 48rem;
    padding: 0;
    margin: 0 auto;
}
.widescreen .container { max-width: 1080px; }

/* very ugly overflow fix, avoid this whenever possible! */
#main .container { overflow-x: auto; }

#main .container, .breadcrumbs .container {
  padding: 0 3rem;
}

.breadcrumbs .container {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/*** BASIC LAYOUT: HEADER ***/

#header { margin-bottom: 3%; }

#header a { text-decoration: none; }

#title, #logo {
    padding: 0.5em 0; 
}

#title h1 {
  font-size: 1.5em;
}

#title * { margin: 0; display: inline-block;}
#title p { font-style: italic; margin-left: 0.5em; }

#logo { height: 10.8em; }
#logo * { display: block; height: 100%; }
#logo img { min-width: 4.8em; }

#logo + #title h1 { margin: 0.8rem 0; }
#logo + #title.tagline h1 { margin: 0; }

/* IE8 + IE9 clearfix */
#header > .container:after {
    content: '';
    display: block;
    clear: both;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

/*** BASIC LAYOUT: FOOTER ***/

#footer p {
    margin: 0;
    padding: 3em 0;
}

#footer address {
  display: inline-block;
  font-style: normal;
}

#footer .social {
  display: inline-block;
}

#footer .social a::after {
  content: none;
}


/*** BASIC LAYOUT: EXTRA SMALL DEVICES ***/

@media (max-width: 767px) {
    /* #main { padding: 2em 0 1em; } */
    
    #main .container, .breadcrumbs .container {
      padding: 0.5rem;
    }

    #title, #logo { padding: 0.5em 1em 0.5em 0; line-height: 2rem;}
    #logo { height: 8.8em; }
    
    #header {
      margin: 0;
    }
    
    .container {
      padding: 0.5rem;
    }

    #footer p { padding: 1em 0; }
    #footer .social { padding: 0.5em 0 0.5em 1em; }
   
}

/*** TYPOGRAPHY ***/

html { font-size: 16px; }

body {
    font-family: 'Droid Sans', 'Helvetica', 'Arial', 'Verdana', sans-serif;
    font-size: 1rem;
    line-height: 1.6;
    font-variant-ligatures: common-ligatures;
    text-rendering: optimizeLegibility;
    font-kerning: normal;
}
 
p, td, th, li, dd {
    /* text-align: justify; */
    overflow-wrap: break-word;
    word-wrap: break-word;
}

p, hr, table, .table-responsive, ol, ul, dl, dd, pre, blockquote, fieldset {
    margin-bottom: 1em;
}

a {
    text-decoration: underline dotted;
    -webkit-transition: color .2s ease-in;
            transition: color .2s ease-in;
    text-underline-position: under
}

a[href^="http://"]:not([href*="random.fangirling.net"])::after, 
a[href^="https://"]:not([href*="random.fangirling.net"])::after, 
a[href^="//"]:not([href*="random.fangirling.net"])::after {
	background-image: url('data:image/svg+xml;charset=utf8, %3Csvg%20enable-background%3D%22new%200%200%2012%2012%22%20version%3D%221.1%22%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20opacity%3D%22.75%22%3E%3Cg%20clip-rule%3D%22evenodd%22%20fill-rule%3D%22evenodd%22%3E%3Cpolygon%20points%3D%222%202%205%202%205%203%203%203%203%209%209%209%209%207%2010%207%2010%2010%202%2010%22%2F%3E%3Cpolygon%20points%3D%226.211%202%2010%202%2010%205.789%208.579%204.368%206.447%206.5%205.5%205.553%207.632%203.421%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E');
	display: inline-block;
	height: 1em;
	width: 1em;
	content: ' ';
	background-repeat: no-repeat;
	vertical-align: middle;
	margin-left: 0.1em;
  opacity: 0.8;
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0.75em;
    margin-bottom: 0.1em;
    font-weight: bold;
}
h1 { font-size: 1.65rem; margin-bottom: 0.75rem; }
h2 { font-size: 1.4rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.1rem; }
h5 { font-size: 1rem; }
h6 { font-size: 1rem; font-weight: normal; font-style: italic; }

@media (max-width: 320px) {
  h1 { font-size: 1.5rem; margin-top: 0.25rem; }
  h2 { font-size: 1.3rem; }
  h3 { font-size: 1.2rem; }
}
img { max-width: 100%; }


abbr { text-decoration: underline dotted; }

/*** UTILITIES ***/

.align-left { text-align: left; }
.align-center { text-align: center; }
.align-right { text-align: right; }
.align-justify { text-align: justify; }

.image { display: block; margin: 0 auto; }
.image.xsmall { width: 20%; }
.image.small { width: 40%; }
.image.large { width: 60%; }
.image.xlarge { width: 80%; }
.image.float-left { float: left; margin: 1em 2em 1em 0; }
.image.float-right { float: right; margin: 1em 0 1em 2em; }
.image img { display: block; width: 100%; }

@media (max-width: 767px) {
    .image.xsmall { width: 60%; }
    .image.small { width: 80%; }
    .image.large, .image.xlarge { width: 100%; }
    .image.float-left, .image.float-right { float: none; margin: 0 auto; }
}

/*** TABLES ***/

table { border-spacing: 0; }

td, th {
    padding: 0.4em 1em;
    vertical-align: top;
}
th {
    font-weight: bold;
    text-align: center;
}

tr:not(:last-child) td, tr:not(:last-child) th { border-bottom: 0 none; }
thead tr:last-child th {                         border-bottom: 0 none; }
td:not(:last-child), th:not(:last-child) {       border-right: 0 none; }

tr:first-child td:first-child, tr:first-child th:first-child { border-top-left-radius: 0.3em; }
tr:first-child td:last-child, tr:first-child th:last-child {   border-top-right-radius: 0.3em; }
tbody tr:last-child td:first-child {                           border-bottom-left-radius: 0.3em; }
tbody tr:last-child td:last-child {                            border-bottom-right-radius: 0.3em; }
table thead + tbody tr:first-child td {                        border-radius: 0 !important; }

.table-responsive { overflow-x: auto; clear: both;  }
.table-responsive > table { margin-bottom: 0;  }

@media (max-width: 767px) {
  td, th {
      padding: 0.2em 0.1em;
  }
}

/*** LISTS ***/

ol, ul {
    list-style-position: outside;
    padding-left: 1em;
}
ol { padding-left: 2.5em; }
li { 
  padding-left: 0.5em; 
  margin-bottom: 0.25rem;
}

dl { font-size: 1rem; }
dt {
  font-weight: bold;
  float: left;
  clear: left;
  margin: 0 0.5em 0 0;
  padding: 0;
}
dt::after {
  content: ":";
}
dd {
  padding: 0;
  margin: 0 0 0.5em 0;
}

@media (min-width: 768px) {
  dl { }
  dt {
    float: left;
    clear: left;
    width: 10em;
    font-weight: bold;
  }
  dt::after {
    content: ":";
  }
  dd {
    margin: 0;
    padding: 0 0 0.5em 10.5em;
  }
}

/*** CODE ***/

code {
    margin: 0 0.1em;
    padding: 0.1em 0.2em;
    border-radius: 0.3em;
    font-family: 'Droid Sans Mono', 'Courier New', 'Courier', monospace;
    font-size: 0.85rem;
    line-height: 1.9824;
}

pre {
    padding: 0 1em;
    border-radius: 0.3em;
}
pre code {
    display: block;
    margin: 0;
    padding: 1.1111em 0;
    border: 0 none;
    background: transparent;
    overflow-x: auto;
    line-height: 1.4;
}

/*** BLOCKQUOTE ***/

blockquote {
    font-style: italic;
    margin-left: 1em;
    padding-left: 1em;
    border-left-width: 0.5em;
    border-left-style: solid;
}

/*** FORMS ***/

label, fieldset legend { font-weight: 500; }

input:not([type="checkbox"]):not([type="radio"]), button, select, textarea, fieldset, fieldset legend {
    border-radius: 0.3em;
    -webkit-transition: none .2s ease-in;
            transition: none .2s ease-in;
    -webkit-transition-property: border-color, background, box-shadow;
            transition-property: border-color, background, box-shadow;
}

input:not([type="checkbox"]):not([type="radio"]), button, select, textarea {
    padding: 0.25em 0.5em;
    outline: 0 none;
    font-size: 1rem;
}

input[type="button"]:focus, input[type="submit"]:focus, input[type="reset"]:focus, button:focus,
input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover, button:hover {
    cursor: pointer;
}

textarea, select[multiple] {
    vertical-align: bottom;
    overflow: auto;
}

textarea {
    max-width: 100%;
    width: 30em;
    height: 10em;
}

fieldset {
    padding: 1em;
}
fieldset legend { padding: 0 0.5em; }

fieldset label, fieldset input, fieldset button,
fieldset select, fieldset textarea {
    margin: 0.2em 0.5em;
}
fieldset label:first-child, fieldset input:first-child, fieldset button:first-child,
fieldset select:first-child, fieldset textarea:first-child {
    margin-left: 0;
}
fieldset label:last-child, fieldset input:last-child, fieldset button:last-child,
fieldset select:last-child, fieldset textarea:last-child {
    margin-right: 0;
}

/* Firefox input size fix */
input::-moz-focus-inner, button::-moz-focus-inner {
    border: 0;
    padding: 0;
}
.content {
  margin-top: 2em;
}
div.preface, div.notes, div.endnotes {
    padding: 0.5em 1em;
    margin: 1em -1em;
    overflow: hidden;
}

li h3, li p {
  margin-bottom: 0.25rem;
}

li h3 {
  margin-top: 0.5rem;
}

.social-icon {
  height: 20px;
  width: auto;
  filter: brightness(0) invert(1);
}

hr {
  margin-top: 1em;
  border-width: 0.15em;
  border-style: solid;
  border-radius: 0.3em;
}

.breadcrumbs {
  font-size: 0.875rem;
}

@media (min-width: 768px) {
.works details ul {
    column-count: 3;
}
}

summary {
  cursor: pointer;
}

.bookmarklet {
  display: inline-block;
  padding: 0.5em 1em;
  border-radius: 5px;
  text-decoration: none;
  font-weight: bold;
}
.bookmarklet:hover {
  opacity: 0.8;
}

.script-options .extended-options {
  margin-left: 2em;
}

.works .meta dl {
  margin-bottom: 0.125rem;
}

.works .meta dt, .works .meta dd {
  display: inline-block;
  width: auto;
  min-width: auto;
  margin: 0;
  padding: 0;
  float: none;
}

.works .meta dt {
  font-weight: normal;
  font-style: italic;
  opacity: 0.9;
}

.works .meta dd + dt::before {
  content: ' • ';
  font-style: normal;
}

.works h2.fandom {
    margin-top: 2rem;
    margin-bottom: 0;
}

.works h3 {
  margin-top: 0.75rem;
  display: block;
  font-size: 1.25rem;
}

.works .title { 
  font-weight: 500;
}

.works .work-meta {
  margin-top: 0.1rem;
}

.works p {
  padding: 0;
  margin-bottom: 0.5em;  
}

#updates, #news, #notice {
  box-shadow:0 4px 6px rgba(0,0,0,0.1);
  border-width: 2px;
  border-style: solid;
  padding: 0.5em;
}

#updates > :first-child, #news > :first-child, #notice > :first-child {
  margin-top: 0;
}

@media screen and (min-width: 800px) {
  
  #updates, #news, #notice {
    margin: 1em -1em;
    padding: 1em;   
  }
  
  .mobile-only {
    display: none;
  }
  
	#updates, #news {
		float: right;
	  width: 20rem;
		max-height: 16rem;
    overflow-y: auto;
		margin-left: 1%;
		display: block;
		padding: 20px;
		margin:0 auto 20px 2%;
		line-height:1.5;
		/* background: linear-gradient(#F9EFAF, #F7E98D); */
    color: #222;
	}
  #updates h2 {
    margin-top: 0;
    font-size: 1.2rem;
  }
    
  #updates ul, #news ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
  }
  
  #updates ul li, #news ul li {
    padding: 0;
    margin-bottom: 0.5em;
  }
}


.no-js .user-theme-toggle {
  display: none;
}

.user-theme-toggle .theme-toggle-button-text {
  display: none;
}

.user-theme-toggle {
  margin-top: -3em;
  padding-top: 0.5rem;
  float: right; 
}

@media screen and (max-width: 799px) {
  .user-theme-toggle {
    display: none;
  }
}

#theme-toggle-button, .theme-toggle-button:hover {
  background: transparent; color: #fff;
  font-size: 0.8rem;
  border-color: #fff;
}

#theme-toggle-button:hover {
  opacity: 0.8;
}

#theme-toggle-button[data-current-theme=light] .theme-toggle-button-text-dark {
  display: inline;
}

#theme-toggle-button[data-current-theme=dark] .theme-toggle-button-text-light {
  display: inline;
}

.theme-toggle-button-text::after {
    display: inline-block;
    height: 1em;
    width: 1em;
    content: '';
    color: #fff;
    margin-left: 0.25em;
    vertical-align: top;
    margin-top: 0.1em;
    background-repeat: no-repeat;
}

.theme-toggle-button-text.theme-toggle-button-text-light::after {
    background: url('data:image/svg+xml,\ <svg version="1.1" xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M18 12c0-0.811-0.161-1.587-0.455-2.295-0.304-0.735-0.75-1.395-1.303-1.948-0.552-0.552-1.213-0.998-1.948-1.303-0.707-0.293-1.483-0.454-2.294-0.454s-1.587 0.161-2.295 0.455c-0.735 0.304-1.395 0.75-1.948 1.302s-0.998 1.213-1.302 1.948c-0.294 0.708-0.455 1.484-0.455 2.295s0.161 1.587 0.455 2.295c0.304 0.735 0.75 1.395 1.303 1.948 0.552 0.552 1.213 0.998 1.948 1.303 0.707 0.293 1.483 0.454 2.294 0.454s1.587-0.161 2.295-0.455c0.735-0.304 1.395-0.75 1.948-1.303s0.998-1.213 1.303-1.948c0.293-0.707 0.454-1.483 0.454-2.294zM16 12c0 0.544-0.108 1.060-0.303 1.529-0.202 0.489-0.5 0.929-0.869 1.299s-0.81 0.667-1.299 0.869c-0.469 0.195-0.985 0.303-1.529 0.303s-1.060-0.108-1.529-0.303c-0.489-0.202-0.929-0.5-1.299-0.869s-0.667-0.81-0.869-1.299c-0.195-0.469-0.303-0.985-0.303-1.529s0.108-1.060 0.303-1.529c0.202-0.489 0.5-0.929 0.869-1.299s0.81-0.667 1.299-0.869c0.469-0.195 0.985-0.303 1.529-0.303s1.060 0.108 1.529 0.303c0.489 0.202 0.929 0.5 1.299 0.869s0.667 0.81 0.869 1.299c0.195 0.469 0.303 0.985 0.303 1.529zM11 1v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM11 21v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM3.513 4.927l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM17.653 19.067l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM1 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM21 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM4.927 20.487l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0zM19.067 6.347l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"></path></svg>');
}

.theme-toggle-button-text.theme-toggle-button-text-dark::after {
    background: url('data:image/svg+xml,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M21.996 12.882c0.022-0.233-0.038-0.476-0.188-0.681-0.325-0.446-0.951-0.544-1.397-0.219-0.95 0.693-2.059 1.086-3.188 1.162-0.696 0.047-1.399-0.027-2.077-0.226-0.656-0.192-1.29-0.501-1.874-0.932-0.655-0.484-1.181-1.074-1.575-1.729-0.409-0.68-0.676-1.432-0.792-2.206s-0.082-1.571 0.11-2.342c0.184-0.741 0.514-1.46 0.999-2.115 0.142-0.191 0.216-0.435 0.191-0.691-0.053-0.55-0.542-0.952-1.092-0.898-1.117 0.109-2.186 0.399-3.172 0.843-1.005 0.452-1.925 1.065-2.723 1.808-0.883 0.82-1.618 1.801-2.159 2.901-0.523 1.064-0.863 2.238-0.978 3.485-0.125 1.347 0.024 2.658 0.402 3.878 0.392 1.266 1.031 2.431 1.863 3.433s1.86 1.843 3.033 2.461c1.13 0.595 2.392 0.982 3.739 1.106s2.659-0.025 3.878-0.403c1.266-0.392 2.431-1.031 3.433-1.863s1.843-1.86 2.461-3.033c0.595-1.13 0.982-2.392 1.106-3.739zM19.567 14.674c-0.126 0.351-0.276 0.689-0.447 1.014-0.493 0.937-1.166 1.76-1.969 2.427s-1.735 1.178-2.747 1.491c-0.973 0.302-2.021 0.421-3.102 0.321s-2.089-0.41-2.99-0.884c-0.937-0.493-1.76-1.166-2.427-1.969s-1.178-1.735-1.491-2.747c-0.302-0.973-0.421-2.021-0.321-3.102 0.092-1 0.365-1.938 0.782-2.786 0.43-0.878 1.018-1.661 1.725-2.319 0.64-0.595 1.377-1.086 2.183-1.449 0.179-0.081 0.362-0.155 0.548-0.223-0.092 0.257-0.171 0.516-0.236 0.778-0.256 1.029-0.302 2.091-0.147 3.121s0.51 2.032 1.056 2.941c0.527 0.875 1.23 1.663 2.1 2.306 0.775 0.573 1.622 0.986 2.5 1.243 0.907 0.266 1.846 0.364 2.772 0.302 0.752-0.050 1.496-0.207 2.21-0.465z"></path></svg>');
}

.icon {
    height: 1.2rem;
    width: 1.2rem;
    display: inline-block;
    vertical-align: text-bottom;
}

.icon svg {
  fill: currentcolor;
}

table th.sort {
    cursor: pointer;
}

table th.sort.asc::after {
    content: '↑';
    float: right;
}

table th.sort.desc::after {
    content: '↓';
    float: right;
}

.details, 
.show,
.hide:target {
  display: none;
}

ul.pagination {
list-style-type: none;
margin: 0;
padding: 0;
display: inline-block;
}
ul.pagination li {
display: inline-block;
margin-right: 0.5em;
}

ul.pagination li.active a {
  color: black;
  font-weight: bold;
  text-decoration: none;
}

a.disabled, ul.pagination li.disabled a {
  pointer-events: none;
  cursor: default;
  text-decoration: none;
  color: gray;
}

@media screen and (min-width: 799px) {
  #news .details, #updates .details {
    display: block;
  }
}

.hide:target + .show,
.hide:target ~ .details {
  display: block;
}

@media only screen and (max-width: 600px) {
  .small-flex {
    display : -webkit-box;
    display : -moz-box;
    display: -ms-flexbox;
    display : -webkit-flex;
    display : flex;
  }
  .small-flex-v {
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .small-flex-start {
    -webkit-box-ordinal-group: -1;
    -moz-box-ordinal-group: 0;
    -ms-flex-order : -1;
    -webkit-order : -1;
    -moz-order : -1;
    order : -1;
  }
}