/* alegreya-sans-300 - latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Alegreya Sans Light'), local('AlegreyaSans-Light'),
       url('/res/alegreya-sans-v8-latin-300.woff2') format('woff2')
}

/* alegreya-sans-300italic - latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: italic;
  font-weight: 300;
  src: local('Alegreya Sans Light Italic'), local('AlegreyaSans-LightItalic'),
       url('/res/alegreya-sans-v8-latin-300italic.woff2') format('woff2')
}
@font-face {
    font-family: 'alegreyaitalic';
    src: url('alegreya-italic-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'alegreyaregular';
    src: url('alegreya-regular-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'alegreyabold';
    src: url('alegreya-bold-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'alegreyabold_italic';
    src: url('alegreya-bolditalic-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'alegreyablack';
    src: url('alegreya-black-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'alegreyablack_italic';
    src: url('alegreya-blackitalic-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'alegreya_scregular';
    src: url('alegreyasc-regular-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'alegreya_scitalic';
    src: url('alegreyasc-italic-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'alegreya_scbold_italic';
    src: url('alegreyasc-bolditalic-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'alegreya_scbold';
    src: url('alegreyasc-bold-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'alegreya_scblack';
    src: url('alegreyasc-black-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'alegreya_scblack_italic';
    src: url('alegreyasc-blackitalic-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Sans Forgetica';
    src: url('sansforgetica-regular-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GNUTypewriterStandard';
    src: url('gtw-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face{
    font-family: 'Fira Code';
    src: url('FiraCode-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face{
    font-family: 'Fira Code';
    src: url('FiraCode-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

@font-face{
    font-family: 'Fira Code';
    src: url('FiraCode-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
}

@font-face{
    font-family: 'Fira Code';
    src: url('FiraCode-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

.clear {
    clear: both;
}

blockquote {
    font-family: 'GNUTypewriterStandard';
    font-weight: normal;
    font-style: normal;
}

code,p.leet {
    font-family: 'Fira Code' !important;
}

body,nav {
    width: 35em;
    max-width: 100%;
}
body.index {
    width: 100vw;
    background:#222;
    font-family: 'Alegreya Sans'
}

body,textarea, input {
    font: 400 24px/150% 'alegreyaregular',Georgia,serif;
    background:#000;
    color:silver;
}

body{
    padding: 0;
    margin:0 auto;
    text-align: justify;
    font: 400 24px/150% 'alegreyaregular',Georgia,serif;
}
nav {
    display:flex;
    justify-content: space-between;
    position:fixed;
    bottom:0;
    background: rgba(0,0,0,.8);
}
nav a {
    text-decoration:none;
}

a {
    color:silver;
    text-decoration:underline;
}

h1,h2, h2 a,h3,h4,h5,h6 {
    color: #eee;
    text-align: left;
    font-family: 'Alegreya Sans',sans-serif;
}
h1 {
    letter-spacing: -.09em;
    font-size: 4em;
    font-weight: 200;
    margin-bottom: 0;
    margin-top:0;
    text-align: center;
    line-height: .8em;
    z-index: 20;
    width: 100%;
}
body.index h1 {
    position: fixed;
}
h2 {
    margin-top:.5em;
    margin-bottom: 0;
    display:inline-block;
}
h2 a {
    text-decoration:none;
}
body.index h2 {
    display: inline;
}
.motto {
    color:silver;
}
.time {
    color: gray;
    float: right;
    margin-left: 1em;
    font-style: italic;
    font-size:.8em;
}
.day {
    font-size: 1.1em;
    border-bottom: solid 1px silver;
    font-style: italic;
    margin-top: 1em;
    color: darkgrey;
    padding-left: .5em;
}
.month,.firstLines {
    margin: .5em 0;
    font-size: 1.2em;
    border-bottom: double;
    padding-left: 1em;
}
.month {
    text-transform: uppercase;
    text-align: center;
}
.year {
    font-size: 1.3em;
    text-align: center;
    background: lightgreen;
    padding: .2em 0 0.05em;
    color: gray;
    font-weight: bold;
    border: solid 1px darkgreen;
    width: 100%;
    border-left: 0;
    border-right: 0;
}

div.articlesContainer {
    margin: .6em auto;
}
body.index article {
    border:solid 1px silver;
    border-radius: 1em;
    max-height: 60vh;
    width:350px;
    overflow: hidden;
    margin:.2em;
    padding-bottom: .5em;
    font-size:80%;
    font-family: 'Alegreya Sans';
    line-height:1.2rem;
    padding-top:.3em;
}
body.index article p {
    margin:0
}
body.index blockquote, body.index pre[class*="language-"] {
    border-left:3px solid grey;
    padding:0;
    margin:0;
}
body.index pre[class*="language-"] {
    padding:0;
    margin:0;
    line-height:12px;
    font-size:8px;
}

body.index article h1,body.index article h2,body.index article h3,body.index article h1,body.index p {
    font-family: 'Alegreya Sans';    
}
article * {
    overflow: hidden;
    text-overflow: ellipsis;
}
article pre {
    overflow: auto;
    text-overflow: initial;
}

img {
    max-width:100%
}

blockquote {
    border-left: solid silver 0.8em;
    padding: .5em;
    background: rgba(0,0,0,0.05);
}

 .tag {
    float: right;
    margin: .2em .1em 0;
    border: solid 1px green;
    border-radius: 1.75em;
    padding: 0 .05em 0 0;
    background: #719e40;
    color: #fff;
    font-style: italic;
    font-size: 70%;
    cursor: pointer;
    display: inline-block;
}

div.toprowshield {
    position:fixed;
    width:100%;
    height:4em;
    top:0;
    z-index:10;
    background: rgb(252,252,240);
}

body.index div.toprowshield {
    background:#222;
}

div.toprow {
    position: sticky;
    top: 0;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    z-index: 50;
}
.tools {
    float:right;
}
.tools .tool {
    border-left: solid 1px grey;
    border-bottom: solid 1px grey;
    float: right;
    margin-bottom: .5em;
    padding: .25em;
    z-index: 30;
}
.tool {
    display:none;
}

.tool a, .guestTool a {
    text-decoration: none;
}
.content {
    width: 100%;
    margin-bottom: 2em;
}

p.leet {
    color:lightgreen;
    background: hsl(0, 0%, 8%);
    border-radius: .5em;
    border: 3px solid lightgreen;
    box-shadow: 1px 1px .5em black inset;
    margin: .5em 0;
    overflow: auto;
    padding: 1em;
}

.readmore {
    position: absolute;
    bottom: 0;
    right: 0;
    border: solid 1px silver;
}

.readmore a {
    text-decoration: none;
}

article {
    border-top: silver solid 1px;
}

div.note, p.note {
    font-size:75%;
    color:gray;
}



/* Admin part */
.flashmsg {
    width: 100%;
    margin: .5em 0;
    padding: 1em;
    border: solid 1px blue;
    background: lightblue;
    color: blue;
    box-sizing: border-box;
}
.flasmsg.Error {
    border-color: red;
    color: red;
    background-color: pink;
}
.flasmsg.Warning {
    border-color: orangered;
    color: orangered;
    background-color: lightsalmon;
}
.flashmsg.Success {
    border-color: green;
    color: green;
    background-color: lightgreen;
}

#newPostFormContainer {
    display:flex;
    flex-direction:column;
    height:100vh;
}

textarea, #contentPlus {
    width: 35em;
    max-width: 100%;
    box-sizing: border-box;
    margin:0 auto;
    border:none;
    overflow: auto;
}
#newPostFormContainer textarea, #contentPlus  {
    flex-grow: 1;
}


#newPostButtons {
    display:flex;
    flex-shrink: 1;
}

#newPostButtons input[type="submit"]{
    flex-grow:1;
}

#moreActions {
    position:fixed;
    width: 100vw;
    height: 100vh;
    top:0;
    left: 0;
    background: rgba(0,0,0,.7);
    display:none;    
}

.close {
    float: right;
    color: red;
    font-weight: bold;
    font-family: 'Alegreya Sans';
    cursor: pointer;
    margin: .25em .5em;
}

#moreActionsMain > div {
    display:none;
}


#moreActionsTabs > div{
    display: inline-block;
    cursor: pointer;
    border:solid 1px silver;
    padding:.2em .5em;
    margin:0;
    float: left;
    border-radius: 5px 20px 0 0;
    border-bottom: 0;
    top: 1px;
    background:#111;
}
#moreActionsTabs > div.activ {
    font-weight: bold;
    border: solid 1px silver;
    top: 2px;
    position: relative;
    background: #000;
    border-bottom: none;
}
#moreActionsMain {
    background: #000;
    width:100%;
    padding: 1em;
    margin-top: 2em;
    border-top:1px solid silver;
}

/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism-twilight&languages=markup+css+clike+javascript+c+csharp+bash+batch+cpp+ruby+diff+docker+markup-templating+git+go+less+http+ini+java+json+latex+markdown+liquid+makefile+nginx+perl+php+php-extras+sql+powershell+prolog+scss+python+sass+smarty+yaml+twig+wasm&plugins=line-numbers+autolinker+keep-markup */
/**
 * prism.js Twilight theme
 * Based (more or less) on the Twilight theme originally of Textmate fame.
 * @author Remy Bach
 */
code[class*="language-"],
pre[class*="language-"] {
	color: white;
	background: none;
	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
	text-align: left;
	text-shadow: 0 -.1em .2em black;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	word-wrap: normal;
	line-height: 1.5;

	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;

	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

pre[class*="language-"],
:not(pre) > code[class*="language-"] {
	background: hsl(0, 0%, 8%); /* #141414 */
}

/* Code blocks */
pre[class*="language-"] {
	border-radius: .5em;
	border: .3em solid hsl(0, 0%, 33%); /* #282A2B */
	box-shadow: 1px 1px .5em black inset;
	margin: .5em 0;
	overflow: auto;
	padding: 1em;
}

pre[class*="language-"]::-moz-selection {
	/* Firefox */
	background: hsl(200, 4%, 16%); /* #282A2B */
}

pre[class*="language-"]::selection {
	/* Safari */
	background: hsl(200, 4%, 16%); /* #282A2B */
}

/* Text Selection colour */
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
	text-shadow: none;
	background: hsla(0, 0%, 93%, 0.15); /* #EDEDED */
}

pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
code[class*="language-"]::selection, code[class*="language-"] ::selection {
	text-shadow: none;
	background: hsla(0, 0%, 93%, 0.15); /* #EDEDED */
}

/* Inline code */
:not(pre) > code[class*="language-"] {
	border-radius: .3em;
	border: .13em solid hsl(0, 0%, 33%); /* #545454 */
	box-shadow: 1px 1px .3em -.1em black inset;
	padding: .15em .2em .05em;
	white-space: normal;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
	color: hsl(0, 0%, 47%); /* #777777 */
}

.token.punctuation {
	opacity: .7;
}

.namespace {
	opacity: .7;
}

.token.tag,
.token.boolean,
.token.number,
.token.deleted {
	color: hsl(14, 58%, 55%); /* #CF6A4C */
}

.token.keyword,
.token.property,
.token.selector,
.token.constant,
.token.symbol,
.token.builtin {
	color: hsl(53, 89%, 79%); /* #F9EE98 */
}

.token.attr-name,
.token.attr-value,
.token.string,
.token.char,
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable,
.token.inserted {
	color: hsl(76, 21%, 52%); /* #8F9D6A */
}

.token.atrule {
	color: hsl(218, 22%, 55%); /* #7587A6 */
}

.token.regex,
.token.important {
	color: hsl(42, 75%, 65%); /* #E9C062 */
}

.token.important,
.token.bold {
	font-weight: bold;
}
.token.italic {
	font-style: italic;
}

.token.entity {
	cursor: help;
}

pre[data-line] {
	padding: 1em 0 1em 3em;
	position: relative;
}

/* Markup */
.language-markup .token.tag,
.language-markup .token.attr-name,
.language-markup .token.punctuation {
	color: hsl(33, 33%, 52%); /* #AC885B */
}

/* Make the tokens sit above the line highlight so the colours don't look faded. */
.token {
	position: relative;
	z-index: 1;
}

.line-highlight {
	background: hsla(0, 0%, 33%, 0.25); /* #545454 */
	background: linear-gradient(to right, hsla(0, 0%, 33%, .1) 70%, hsla(0, 0%, 33%, 0)); /* #545454 */
	border-bottom: 1px dashed hsl(0, 0%, 33%); /* #545454 */
	border-top: 1px dashed hsl(0, 0%, 33%); /* #545454 */
	left: 0;
	line-height: inherit;
	margin-top: 0.75em; /* Same as .prism’s padding-top */
	padding: inherit 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	white-space: pre;
	z-index: 0;
}

.line-highlight:before,
.line-highlight[data-end]:after {
	background-color: hsl(215, 15%, 59%); /* #8794A6 */
	border-radius: 999px;
	box-shadow: 0 1px white;
	color: hsl(24, 20%, 95%); /* #F5F2F0 */
	content: attr(data-start);
	font: bold 65%/1.5 sans-serif;
	left: .6em;
	min-width: 1em;
	padding: 0 .5em;
	position: absolute;
	text-align: center;
	text-shadow: none;
	top: .4em;
	vertical-align: .3em;
}

.line-highlight[data-end]:after {
	bottom: .4em;
	content: attr(data-end);
	top: auto;
}

pre[class*="language-"].line-numbers {
	position: relative;
	padding-left: 3.8em;
	counter-reset: linenumber;
}

pre[class*="language-"].line-numbers > code {
	position: relative;
	white-space: inherit;
}

.line-numbers .line-numbers-rows {
	position: absolute;
	pointer-events: none;
	top: 0;
	font-size: 100%;
	left: -3.8em;
	width: 3em; /* works for line-numbers below 1000 lines */
	letter-spacing: -1px;
	border-right: 1px solid #999;

	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

}

	.line-numbers-rows > span {
		pointer-events: none;
		display: block;
		counter-increment: linenumber;
	}

		.line-numbers-rows > span:before {
			content: counter(linenumber);
			color: #999;
			display: block;
			padding-right: 0.8em;
			text-align: right;
		}

.token a {
	color: inherit;
}
