@import url("/local--files/component:theme/editor-window.css");

@import url('https://fonts.googleapis.com/css2?family=Gabriela&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik+80s+Fade&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik+Dirt&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anonymous+Pro&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Russo+One&display=swap');

:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Liminal Theme";

    --logo-image: url("/local--files/theme:runners-notes/runners-notes-header-1.png");
    --header-title: "Заметки Бегущего";
    --header-subtitle: "Сквозь материю и пространства!";

   --body-font:  'Gabriela', serif;
   --header-font: 'Rubik Dirt', cursive;
   --title-font: 'Russo One', sans-serif;
   --mono-font: 'Anonymous Pro', monospace;

   --white-bg-monochrome: 222, 152, 38;
   --white-bg-monochrome-2: 201, 89, 28;
   --white-monochrome: 40, 40, 40;
   --pale-gray-monochrome: 90, 38, 3;
   --light-gray-monochrome: 157, 71, 6;
   --gray-monochrome: 230, 111, 46;
   --black-monochrome: 255, 255, 255;
   --bright-accent: 227, 139, 31;
   --medium-accent: 227, 100, 31;
   --dark-accent: 236, 165, 50;
   --pale-accent: 255, 255, 255;
   --blurple: 193, 86, 24;
   --swatch-menubg-dark-color: var(--pale-accent);

   --swatch-topmenu-border-color: var(--medium-accent);

   --link-color: 48,87,255;
   --hover-link-color: 48,87,165;
   --visited-link-color: 48,87,165;
   --newpage-color: 48,87,165;

   --header-h2-font-size: calc(var(--base-font-size)*1.35);
   --header-height-on-desktop: 10rem;
   --header-height-on-mobile: 10rem;
   --sidebar-width-on-desktop: 20rem;
}

#skrollr-body {
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   background: linear-gradient(-45deg, rgb(var(--medium-accent)), rgb(var(--gray-monochrome)));
   width: 100%;
   height: 10rem;
}

#header::before {
   content: "";
   position: absolute;
   height: 95%;
   width: 100%;
   left: 12rem;
   bottom: 1rem;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 0.75;
}

span.printuser, #login-status a {
   color: rgb(var(--link-color));
}

#header h1 a::before, #header h2 span::before, #top-bar>ul>li a, div#page-options-bottom-2>a, div#page-options-bottom>a, .owindow .button-bar a, a.button, button, div.buttons input, file, input.button, form#edit-page-form > table.form td, .yui-navset .yui-nav .selected a, table.wiki-content-table th {
   color: rgb(var(--black-monochrome)) !important;
}

form#edit-page-form {
   background: rgb(var(--white-monochrome));
}

.wd-editor-toolbar-panel li.hseparator {
   background-color: rgb(var(--black-monochrome));
}

div.buttons.alignleft>input {
   border: 0.125rem solid rgba(var(--black-monochrome,48,48,52),1);
}

#side-bar .heading p {
   color: rgb(var(--dark-accent));
   text-shadow: none;
}

#side-bar {
   top: 0rem;
}

#side-bar:hover {
   border-right: 3px solid rgb(var(--dark-accent));
}

.yui-navset .yui-content {
   border: 5px solid rgb(var(--pale-gray-monochrome)) !important;
}

.scp-image-block {
   border: 3px solid rgb(var(--pale-gray-monochrome));
   border-radius: 5px;
   box-shadow: 2px 2px 8px rgba(0,0,0,.25);
}

#main-content a {
   padding: 2px 5px;
   transition: ease-in-out 0.35s;
}

#main-content a:hover {
   box-shadow: 1px 1px 5px #ffaf38;
   text-decoration: none;
}

span.printuser a:hover {
   box-shadow: none !important;
}

.wd-editor-toolbar-panel ul li a {
    padding: 0 !important;
}

hr {
   background-color: transparent;
   border: 1px solid rgb(var(--black-monochrome));
}

.yui-navset .yui-nav {
    border: 4px solid rgb(var(--pale-gray-monochrome));
    width: auto;
}

.yui-navset .yui-nav a:hover {
   box-shadow: none !important;
   color: rgb(var(--black-monochrome));
}

#top-bar>ul>li a:hover, div#page-options-bottom a:hover, div#page-options-bottom-2 a:hover, div.buttons.alignleft>input:hover {
    color: rgb(var(--gray-monochrome)) !important;
}

.styled-quote {
   background-color:rgb(var(--dark-accent));
   border: 4px solid rgba(var(--gray-monochrome));
   border-radius: 10px;
   color: rgba(var(--pale-gray-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 2px 2px 8px rgba(0,0,0,.25);
}

.dark-styled-quote {
   background-color:rgb(var(--gray-monochrome));
   border: 4px solid rgb(var(--pale-gray-monochrome));
   border-radius: 10px;
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 2px 2px 8px rgba(0,0,0,.25);
}

.lightblock {
   background-color:rgb(var(--dark-accent));
   color: rgb(var(--pale-gray-monochrome));
   border-radius: 10px;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 2px 2px 8px rgba(0,0,0,.25);
}

.darkblock {
   background-color:rgb(var(--gray-monochrome));
   border-radius: 10px;
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 2px 2px 8px rgba(0,0,0,.25);
}

.darkblock a, .dark-styled-quote a {
color: rgb(var(--link-color)) !important;
}

.striped-block {
   background: linear-gradient(45deg, rgb(var(--dark-accent)) 0% 12%, rgba(var(--white-bg-monochrome)) 12% 22%, rgb(var(--dark-accent)) 22% 34%, rgba(var(--white-bg-monochrome)) 34% 40%, rgb(var(--dark-accent)) 40% 64%, rgba(var(--white-bg-monochrome)) 64% 76%, rgb(var(--dark-accent)) 76% 86%, rgba(var(--white-bg-monochrome)) 86% 100%);
   color: rgb(var(--pale-gray-monochrome));
   border-radius: 10px;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 2px 2px 8px rgba(0,0,0,.25);
}

.dark-striped-block {
   background: linear-gradient(-135deg, rgb(var(--gray-monochrome)) 0% 12%, rgba(var(--white-bg-monochrome-2)) 12% 22%, rgb(var(--gray-monochrome)) 22% 34%, rgba(var(--white-bg-monochrome-2)) 34% 40%, rgb(var(--gray-monochrome)) 40% 64%, rgba(var(--white-bg-monochrome-2)) 64% 76%, rgb(var(--gray-monochrome)) 76% 86%, rgba(var(--white-bg-monochrome-2)) 86% 100%);
   border-radius: 10px;
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 2px 2px 8px rgba(0,0,0,.25);
}

.footerbox{
    padding:0.1rem 1rem;
    background: rgb(var(--pale-gray-monochrome));
    border-radius: 10px 10px 0 0;
    color:rgb(var(--black-monochrome));
    border: 4px solid rgb(var(--pale-gray-monochrome));
    box-sizing: border-box;
    border-bottom: 0rem;
}

.footerspan{
    margin-top:0.2rem;
    font-size:155%;
    font-family: 'Rubik Dirt', cursive;
    color: white;
}

.footerflavor{
    padding:0.5px 1rem;
    margin-bottom:1rem;
    background: rgb(var(--dark-accent));
    border-radius:0 0 10px 10px;
    color: rgb(var(--white-monochrome));
    box-sizing:border-box;
    height: auto;
    border: 4px solid rgb(var(--pale-gray-monochrome));
    border-top: 0rem;
}

.profilepic{
    border-radius:0.6rem;
    float:left;
    max-height:13rem;
    height:17vw;
    margin-right:1rem;
    box-shadow: 0px 0px 3px;
    box-sizing:border-box;
}

.hovertip .content {
    border: 4px solid rgb(var(--medium-accent));
}

.f-footer {
   display: none;
}

.page-rate-widget-box a {
    padding: 0 !important;
}

.page-rate-widget-box a:hover {
    box-shadow: none !important;
}

#side-bar .side-block div a img {
    filter: none;
}