@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
    h1 {
      @apply text-2xl;
    }
    h2 {
      @apply text-xl;
    }
    h3 {
      @apply text-lg;
    }
  }
.ql-editor{min-height: 250px;font-size: 1.1rem;}
article .ql-code-block-container{background-color: rgb(36, 36, 36);position: relative;padding:15px 50px 10px;counter-reset: line;}
article .ql-code-block-container select {display: none;}
article .ql-code-block-container .ql-code-block:first-of-type:before{background: rgba(0,0,0,0.6); padding: 5px 10px; position: absolute; right: 10px; top: 5px; color: #fff; content: attr(data-language); display: block;width: fit-content;height: auto;}
article .ql-code-block-container .ql-code-block:after{content: counter(line); counter-increment: line; position: absolute; padding:0 10px; left:0px; border-right: 1px solid #ccc; width: 40px; text-align: center;}
article .ql-code-block-container .ql-code-block br{display: none;}
aside::-webkit-scrollbar-track,main::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 5px;
	background-color: #000;
}
aside::-webkit-scrollbar,aside::-webkit-scrollbar-track{background-color: #00070a;}
aside::-webkit-scrollbar,main::-webkit-scrollbar
{
	width:5px;
	background-color: #000;
}

aside::-webkit-scrollbar-thumb,main::-webkit-scrollbar-thumb
{
	border-radius: 5px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #aaa;
    max-height: 100px;
}
#header:before{
    background-image: url('../uploads/bg.png');
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    content: "";
}
#message{
  animation: showmess 3s ease-in-out;
}
@keyframes showmess{
  0% {
    opacity: 0;
    margin-top: 20px;
  }
  8%{opacity: 1; margin-top: 0;}
  75%{opacity: 1;}
  100%{opacity: 0;}
}
.ql-code-block .hljs-string{
  color: #b86a59;
}
.ql-code-block .hljs-literal,.ql-code-block .hljs-number{
  color: #3da3c5;
}
.hljs-doctag, .hljs-keyword, .hljs-meta .hljs-keyword, .hljs-template-tag, .hljs-template-variable, .hljs-type, .hljs-variable.language_{
  color: #5380e8!important;
}
.hljs-title, .hljs-title.class_, .hljs-title.class_.inherited__, .hljs-title.function_{
  color: #d8ce9e;
}
.hljs-attr, .hljs-attribute, .hljs-literal, .hljs-meta, .hljs-number, .hljs-operator, .hljs-selector-attr, .hljs-selector-class, .hljs-selector-id, .hljs-variable{
  color: #2581eb;
}
article ol,article ul {
  list-style: disc;
  list-style-position: inside;
  padding-left: 2rem;
}
article ul.faq{
  list-style: none;
}
.topvote .item h3{font-size: 16px!important;}
.ql-align-center img{margin:auto}
article h2{font-size: 1.6em}
article h3{font-size: 1.4em}
article h4{font-size: 1.2em}
.toc-content{padding: 15px; background: #333;margin-bottom: 16px}
.toc-content ul{list-style: none;}
article .description iframe{width: 100%;margin: 20px 0; height: 450px}
@media screen and (max-width: 720px){
  article .description iframe{height: 250px!important}
}