* {
  font-family: FiraCodeNerdFont;
}
html {
  -webkit-text-size-adjust: 100%;
}

body {
  background-color: #262626;
  color: #f4f4f4;
  margin: 0px;
  padding: 0px;
}

/* ### felső menüsáv ### */
.topbar {
  height: 64px;
  width: 100%;
  margin: 0px;
  margin-top: -2px;
  padding: 0px;
  padding-left: 8px;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: space-between;
  overflow: hidden;
  position: fixed;
  top: 0;
  background-color : #161616;
  color: #f4f4f4;
}
.topbar .title {
  color: #f4f4f4;
  margin: 0px;
  margin-left: 8px;
  padding: 0px;
  font-size: 24pt;
  font-weight: 600;
}
.topbar ul {
  padding: 0;
  margin-right: 8px;
}
.topbar li {
  color: #f4f4f4;
  margin-right: 16px;
  list-style: none;
  display: inline-block;
  font-size: 24pt;
  font-weight: bold;
}
.topbar .help {
  color: #f4f4f4 !important;
  margin-right: 12px;
  list-style: none;
  display: inline-block;
  font-size: 24pt;
  font-weight: bold;
}
.topbar a:link,
.topbar a:visited {
  color: #0f62fe;
  text-decoration: none;
}
.topbar a:hover {
  color: #4589ff;
  text-decoration: underline;
}
.topbar .help a:link,
.topbar .help a:visited {
  color: #f4f4f4;
  text-decoration: none;
}
.topbar .help a:hover {
  color: #a6c8ff;
  text-decoration: underline;
}
  
  
/* ### baloldali menüsáv ### */
.sidebar {
  width: 58px;
  height: 100%;
  position: fixed;
  top: 62px;
  left: 0px;
  margin: 0px;
  padding: 0px;
  background-color: #262626;
  border-style: none solid solid solid;
  border-color: #161616;
}
.sidebar ul {
  margin: 0;
  padding: 0;
  align-items: center;
  align-content: center;
}
.sidebar ul li {
  margin: 0;
  padding: 0;
  height: 58px;
  list-style: none;
  color: #f4f4f4;
  border-style: none none solid none;
  border-color: #161616;
  align-items: center;
  align-content: center;
  font-size: 32pt;
  font-weight: 200;
}
.sidebar ul li .icon {
  padding-top: 3px;
  padding-left: 9px;
}
.sidebar ul li .icon-git {
  padding-top: 1px;
  padding-left: 10px;
  font-size: 34pt;
}
.sidebar ul li a {
  display: flex;
  width: 100%;
  height: 100%;
  text-decoration: none;
}
.sidebar ul li a:link,
.sidebar ul li a:visited {
  background-color: #242424;
  color: #f4f4f4;
}
.sidebar ul li a:hover {
  background-color: #f4f4f4;
  color: #161616;
}
.sidebar .active {
  padding-left: 9px;
  background-color: #f4f4f4;
  color: #161616;
}
.sidebar .active-git {
  padding-left: 10px;
  background-color: #f4f4f4;
  color: #161616;
  font-size: 34pt;
}
.navbar a:hover {
  color: #f4f4f4;
}



/* ### oldal tartalom ### */
.content {
  margin: 0px;
  margin-top: 64px;
  margin-left: 64px;
  padding-top: 16px;
  padding-bottom: 32px;
  padding-left: 32px;
  padding-right: 32px;
  border-style: solid 2px;
  border-color: #161616;
}

.content a:link,
.content a:visited {
  color: #0f62fe;
  text-decoration: none;
}
.content a:hover {
  color: #4589ff;
  text-decoration: underline;
}

/* hírlap/blog */
.blogposts {
  margin-top: 20px;
  margin-left: 24px;
  margin-right: 28px;
  border-width: 2px;
  border-color: #f6f6f6;
  border-top-style: solid;
}
.block {
  margin: 0px;
  padding: 0px;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 4px;
  padding-right: 6px;
  border-width: 2px;
  border-color: #f6f6f6;
  border-bottom-style: solid;
}
.header {
  margin: 0px;
  margin-bottom: 8px;
  padding: 0px;
  padding-right: 4px;
  display: flex;
  align-content: center;
  justify-content: space-between;

}
.header h2 {
  margin-top: 0px;
  margin-bottom: 0px !important;
  margin-left: 8px !important;
  padding-top: 2px;
  font-size: 24pt;
}
.header h3 {
  margin-top: 16px;
  font-size: 16pt;
}
.blockbody {
  margin: 0px;
  margin-bottom: 6px;
  padding: 0px;
  padding-left: 8px;
  padding-right: 16px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: justify;
  font-size: 16pt;
}
.blockbody p {
  margin-top: 0px;
  margin-bottom: 16px;
  font-size: 16pt;
}



/* archívum & listák */
.content ul {
  margin: 0;
  margin-top: 8px;
  margin-left: 0px;
  margin-right: 16px;
  padding: 0;
}
.content li {
  margin-bottom: 8px;
  list-style: none;
  font-weight: bold;
  font-size: 24pt;
}
.content .contact-li {
  margin-bottom: 8px;
  list-style: none;
  font-weight: bold;
  font-size: 18pt;
}
.content .contact-bigtext {
  margin-top: 8px;
  margin-bottom: 12px;
  font-size: 24pt;
}

/* irományok */
.content h1 {
  margin-top: 8px;
  margin-bottom: 8px;
  font-size: 36pt;
}
.content h2 {
  margin-top: 8px;
  margin-bottom: 32px;
  margin-left: 32px;
  font-size: 24pt;
}
.content .multiline {
  margin-top: 8px;
  margin-bottom: 8px;
  margin-left: 32px;
  font-size: 24pt;
}
.paragraph {
  margin-top: 0px;
  margin-bottom: 24px;
  font-size: 16pt;
}



/* fórum */
/* poszt űrlap */
.content .post-form {
  margin-left: 24px;
  margin-right: 28px;
  padding: 16px;
  background-color: #ffffff;
}
.content .post-form .username {
  width: 320px;
  min-height: 32px;
  margin-bottom: 8px;
  border-style: solid;
  border-width: 2px;
  border-color: #c6c6c6;
  font-size: 16pt;
}
.content .post-form textarea {
  width: calc(100% - 20px);
  margin-bottom: 4px;
  padding: 8px;
  min-height: 128px;
  border-style: solid;
  border-width: 2px;
  border-color: #c6c6c6;
  font-size: 16pt;
  resize: none;
}
.content .post-form button {
  padding: 8px 16px;
  background-color: #ffffff;
  border-style: solid;
  border-width: 2px;
  border-color: #6f6f6f;
  font-size: 20pt;
  cursor: pointer;
}
.content .post-form .error {
  margin-bottom: 12px;
  color: #ee0713;
  font-weight: bold;
  font-size: 16pt;
}
/* posztok */
.content .posts {
  margin-top: 2px;
  margin-left: 24px;
  margin-right: 28px;
}
.content .post {
  margin-bottom: 2px;
  padding: 16px;
  padding-bottom: 20px;
  background-color: #ffffff;
  color: #000000;
  font-size: 16pt;
}
.post.highlight {
  background-color: #ccf7d7;
  transition: background-color 1.0s ease;
}
.post.highlight.fade-out {
  background-color: #ffffff;
  transition: background-color 2.0s ease;
}
.post.new {
  background-color: #ffe2cc;
  transition: background-color 1.0s ease;
}
.post.new.fade-out {
  background-color: #ffffff;
  transition: background-color 5.0s ease;
}
.content .meta {
  font-size: 20pt;
  color: #000000;
  margin-bottom: 16px;
}
.content .post .postbody {
  font-size: 16pt;
}

.content i {
  font-style: italic;
}
.content b {
  font-weight: bold;
}
.content u {
  text-decoration: underline;
}
.content s {
}
.content .bigtext {
  font-size: 24pt !important;
}
.content .smalltext {
  font-size: 10pt !important;
}

.content .spoiler {
  filter: blur(6px);
  transition: filter 0.25s ease;
  cursor: help;
}
.content .spoiler:hover {
  filter: blur(0);
}

.content .greentext {
  color: #0e6027;
}
.content .orangetext {
  color: #ba4e00;
}
.content .bluetext {
  color: #6384bd;
}
.content .glowtext {
  color: #000000;
  text-shadow: #00fe20 0px 0px 24px, #00fe20 0px 0px 4px;
}
.content .shinetext {
  background: linear-gradient(to bottom, #fccd27, #f1c21b, #de9a00);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0px 0px 24px #fddc69, 0px 0px 4px #fccd27
}
.content .ragetext {
  color: #af0a0f;
  text-shadow: #ff0000 0px 0px 24px, #ff0000 0px 0px 4px;
  display: inline-block;
  animation: shakes 0.2s infinite;
}
@keyframes shakes {
  0% { transform:translate(1px,1px) }
  12% { transform:translate(2px,0px) }
  25% { transform:translate(0px,-2px) }
  37% { transform:translate(-1px,0px) }
  50% { transform:translate(-2px,2px) }
  62% { transform:translate(2px,-2px) }
  75% { transform:translate(0px,-2px) }
  87% { transform:translate(-1px,1px) }
  100% { transform:translate(1px,1px) }
}
.content .gaytext {
  font-weight: bold;
  background: linear-gradient(to left, red, orange, yellow, green, cyan, blue, violet);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.content .spintext {
  animation: rotation 1s infinite linear;
  display: inline-block;
  word-break: break-all;
}
@keyframes rotation {
  from {
    transform: rotateX(0deg)
  }

  to {
    transform: rotateX(359deg)
  }
}

.content .codeblock {
  margin: 0;
  margin-top: 4px;
  margin-bottom: 8px;
  margin-right: 32px;
  padding: 8px 12px;
  border-radius: 8px;
  background-color: #d1d1d1;
  overflow-x: auto;
}
.content .codeblock .lang {
  padding-bottom: 8px;
  color: #0072c3;
  font-family: BlexMonoNerdFont;
  font-size: 18pt;
  font-weight: bold;
}
.content .codeblock code {
  font-family: BlexMonoNerdFont;
  font-size: 16pt;
}
.content .codeblock code br {
  display: none;
}
.content .codeblock-inline {
  margin: 0;
  margin-left: -4px;
  margin-right: -4px;
  padding: 2px 6px;
  border-radius: 8px;
  background-color: #d1d1d1;
  font-family: BlexMonoNerdFont;
  font-size: 16pt;
}


.content .darklink:link,
.content .darklink:visited,
.content .post .postbody a:link,
.content .post .postbody a:visited {
  color: #0043ce;
  text-decoration: none;
  font-weight: bold;
}
.content .darklink:hover,
.content .post .postbody a:hover {
  color: #0f62fe;
  text-decoration: underline;
  font-weight: bold;
}

.content .postlink:link,
.content .postlink:visited {
  font-weight: bold;
  text-decoration: none;
  color: #198038 !important;
}
.content .postlink:hover {
  font-weight: bold;
  text-decoration: underline;
  color: #42be65 !important;
}
.content .post.deleted {
  background-color: #c6c6c6 !important;
  font-style: italic;
}
.content .post.deleted .meta {
  color: #525252 !important;
}
.content .post.deleted .postbody {
  font-weight: bold;
  color: #525252 !important;
}

.content table {
  font-size: 16pt;
  background-color: #ffffff;
  border: 2px solid #6f6f6f;
  color: #000000;
  border-collapse: collapse;
}
.content th,
.content td {
  padding: 10px;
  border: 2px solid #6f6f6f;
}

/* fórum súgó & szabályzat */
.content .index {
  display: flex;
  flex-wrap: wrap;
}
#rules,
#texthelp {
  scroll-margin-top: 80px;
}
.content hr {
  border: none;
  height: 2px;
  background-color: #f6f6f6;
}
.content .section {
  margin: 0px;
  margin-top: 24px;
  font-size: 24pt;
}
.content .definition,
.content .rule {
  margin-bottom: 8px;
  margin-left: 8px;
  list-style: none;
  font-weight: normal !important;
  font-size: 20pt;
}
.content .subrule {
  margin-bottom: 8px;
  margin-left: 20px;
  list-style: none;
  font-weight: normal !important;
  font-size: 16pt;
}
.content .subtitle {
  margin: 0px;
  margin-bottom: 12px;
  font-size: 24pt;
}



/* git szerver */
.content .clonecmd {
  font-size: 18pt;
  padding: 8px 12px;
  border-radius: 8px;
  background-color: #161616;
  font-family: BlexMonoNerdFont;
}



/* egyéb */
@font-face {
  font-family: FiraCodeNerdFont;
  src: url(assets/FiraCodeNerdFont-Regular.ttf);
}
@font-face {
  font-family: BlexMonoNerdFont;
  src: url(assets/BlexMonoNerdFontMono-Regular.ttf);
}