:root {
    --whit: #FFFFFF; /* weiss kontrast */
    --blak: #000000; /* schwarz */
    --blue: #0011EE; /* eins */
    --lila: #7000DD; /* zwei */
    --pink: #FF00AA; /* drei */
    --grey: #F3F5F7; /* vier */
    --dark: #aaaaaa;
}
@media (prefers-color-scheme: dark) {
:root {
    --image-filter: grayscale(50%);
    --whit: #FFFFFF; /* weiss kontrast */
    --blak: #000000; /* schwarz */
    --blue: #0011EE; /* eins */
    --lila: #7000DD; /* zwei */
    --pink: #FF00AA; /* drei */
    --grey: #F3F5F7; /* vier */
}
@media (prefers-color-scheme: light) {
:root {
    --whit: #FFFFFF; /* weiss kontrast */
    --blak: #000000; /* schwarz */
    --blue: #0011EE; /* eins */
    --lila: #7000DD; /* zwei */
    --pink: #FF00AA; /* drei */
    --grey: #F3F5F7; /* vier */
} }
img{
    filter: brightness(.8) contrast(1.2);
}
img:not([src*=".svg"]) {
    filter: var(--image-filter);
} }
*,
*::before,
*::after {
 -webkit-box-sizing: border-box;
 box-sizing: border-box; }

::-moz-selection {  
  background-color: yellow;  
}
@media (prefers-reduced-motion: no-preference) {
 :root {
      scroll-behavior: smooth; 
} }

[tabindex="-1"]:focus:not(:focus-visible) {
    outline: 0 !important; }

a:link, a:visited{
    text-decoration: none;
}
a:hover, a:active{
    text-decoration: underline;
}
.bg-blue{
    background-color: var(--blue);
}
.bg-lila{
    background-color: var(--lila);
}
.bg-pink{
    background-color: var(--pink);
}
.bg-grey{
    background-color: var(--grey);
}
.text-blue, .link-blue{
    color: var(--blue);
}
.text-lila, .link-lila{
    color: var(--lila);
}
.text-pink, .link-pink{
    color: var(--pink);
}
.text-grey, .link-grey{
    color: var(--grey);
}
.btn-primary{
    border: 1px solid var(--blue);
    background-color: var(--blue) !important;
}
a.btn:hover{
    text-decoration: none;
    background-color: var(--whit) !important;
    color: var(--blue);
    border: 1px solid var(--blue);
}
.link-ext{
    color: var(--lila) !important;
}
.link-int{
    color: var(--blue) !important;
}
body {
    background-color: var(--grey);
    border: 1.2em solid var(--whit);
}
header{
    background-color:#;
}
#content{
    background-color: #;
}
#panel-welcome{
    color: var(--blue);

}
footer{
    background-color: var(--blak);
    color: var(--whit);
}

.logo{
    color: var(--pink);
    margin:0.4em 0 0.4em 0;
    padding:0;
}
.logo small{
    color: #bbb;
    font-weight: 100;
}

a.nav-link {
    border-bottom:6px solid transparent;
}
a.nav-link:hover{
    border-bottom:6px solid var(--whit);
    color: var(--blue);
    text-decoration: none;
}
a.disabled{
    border-bottom:6px solid var(--whit);
}

a.link-rss{
    background-color: orange;
    color: #ffffff;
    font-size: 0.8em;
    padding:0 0.2em;
    margin:0 0 0.2em 0;
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
}
a.link-rss:link, a.link-rss:visited{
    
}
a.link-rss:hover, a.link-rss:active{
    background-color: darkorange;
}
a.link-opml{
    background-color: dodgerblue;
    color: #ffffff;
    font-size: 0.8em;
    padding:0 0.3em;
    margin:0 0 0.4em 0;
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
}
a.link-opml:hover, a.link-opml:active{
    background-color: deepskyblue;
}
.recent-blogs-list {
}

.recent-blogs-list li {
    line-height: 1rem;
}
.blog-entry {
}

.blog-title {
    line-height: 1.4rem;
}

.blog-title a {
    font-weight: 500;
    text-decoration: none;
}
.blog-url {
    color: #6c757d;
    font-size: 0.7em;
}
.update-time {
    color: #666;
    font-weight: 300;
}
footer a:link, footer a:visited{
    color: #fff;
    text-decoration: underline;
}
footer a:hover, footer a:active{
    text-decoration: none;
}


#monitor{
    .blog-title a:link {
        color: var(--blue);
    }
    .blog-title a:visited {
        color: var(--lila);
    }
}