@font-face {
    font-family: Quake;
    src: url('../fonts/quake.ttf');
}


body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;

    background-color: black;
    background-image: url("../img/back.gif");
}

a {
    color: #845237;
    font-weight: bold;
    text-decoration: none;
}

a:hover {
    color: #6d2e20;
    font-weight: bolder;
    text-decoration: underline;
}

.container-wrapper  {
    background-color: transparent;
    /*background-image: url("../img/back.gif");*/
    padding-bottom: 1.5rem;
}

.header-outer {
    background-color: #1f160d;
    background-image: url("../img/back.gif");
}

.header-inner {
    /*background-color: #0b5ed7;*/
}

.main-logo {
    height: 177px;
    min-width:389px;
    background-image: url(../img/qg_logo4.jpg);
    cursor: pointer;
}

.navbar-dark .main-logo-micro {
    font-family: Quake, Arial, 'Helvetica Neue', Helvetica, sans-serif;
    color: orange;
    font-weight: bolder;
}

.logo-after-md {
    color: lightcoral;
}

.logo-after-md > ul {
    list-style-type: none;
}

@media (min-width: 768px) {
    .logo-after-md {
        background-image: url(../img/qg_logo_after.jpg);
        background-repeat: repeat-x;
        /*height: 177px;*/
    }
}

@media (min-width: 992px) {
    .logo-after-md {
        background-image: url(../img/qg_logo_after.jpg);
        background-repeat: repeat-x;
        /*height: 177px;*/
    }

    .main-menu {
        color: orange;
        position: relative;
        /*top: 140px;*/
        top: 62px;
        left: 10px;
    }

    .main-menu ul li {
        display: inline;
        margin: 0 0.15em;
        text-align: center;
    }

}

.main-menu-separator {
    font-weight: lighter;
}

/* main */
.main-container {
    background-color: #342f28;
    background-image: url("../img/main_bg.gif");
    border: 1px solid #1a1a1a;
    border-radius: 16px;
}

.side-block {
    color: #888888;
    font-weight: bolder;
    background-color: #1e1c19;
    background-image: url("../img/block_menu.jpg");
    border: #1A1A1A solid 2px;
    border-radius: 16px;
    padding: 0.5em 1.5em;
    margin-bottom: .5rem;
}

.side-block > h3, .last-topics-on-main > h3 {
    margin-top: .75rem;
    font-size: 1.10rem;
    text-align: center;
}

.side-block > ul {
    list-style-type: none;
    padding: 0;
}

.last-topics-on-main > ul {
    list-style-type: none;
    padding: 0 1rem;
}

.side-block > ul.last-texts, .side-block > ul.rss-menu {
    list-style-type: circle;
}

.content-block {
    color: #808080;
    background-image: url(../img/news_bg.gif);
    background-color: #333333;
    border: #1A1A1A solid 2px;
    border-radius: 16px;
    margin-bottom: 1em;
    /*padding: .5em;*/
}

.content-block blockquote
{
    margin: 10px 15px;
    padding: 15px 15px;
    background-color:#1f160d;
    background-image: url(../img/news_header.jpg);
}

.content-block p {
    padding: 0 1em;
}

.content-block > h1, .content-block > h2 {
    text-align:center;
    background-image: url(../img/news_header.jpg);
    margin: 0;
    font-family: Verdana, "Lucida Sans", Arial, Geneva, Helvetica, Helv, "Myriad Web", Syntax, sans-serif;
    font-size: 1.25rem;
    font-weight: bolder;
    padding-bottom: .25em;
}

.content-block > h3.examples {
    font-size: 1.10rem;
    font-weight: bolder;
    text-align: center;
    margin-bottom: 1rem;
}

.content-block > ul.examples {
    list-style: none;;
}

.content-block > ul.examples > li {
    display: inline-block;
    padding: .25rem 2rem;
    margin: 0 1rem;
    background-color:#1f160d;
    background-image: url(../img/news_header.jpg);
}

@media (max-width: 768px) {
    .content-block > p > a > img {
        /*width: 650px;*/
        width: 65vw;
        height: auto;
        object-fit: contain;
    }
}

@media (max-width: 576px) {
    .content-block > p > a > img {
        width: 65vw;
        height: auto;
        object-fit: contain;
    }
}

@media (max-width: 375px) {
    .content-block > p > a > img {
        width: 65vw;
        height: auto;
        object-fit: contain;
    }
}

.content-footer {
    padding-right: 1em;
    padding-bottom: .25em;
    text-align: right;
    color: #996600;
}

.content-item-list {
    margin-top: 1rem;
    list-style-type: none;
}

.announce-block {
    /*color: #808080;*/
    color: darkred;
    background-image: url(../img/news_bg.gif);
    background-color: #333333;
    border: #1A1A1A solid 4px;
    border-radius: 12px;
    margin-bottom: .5em;
    text-align: center;
}

.announce-block > h4, .announce-block > h5, .announce-block > h6 {
    font-size: 1.2rem;
    font-weight: bold;
    margin: 0;
}

.announce-block > .link_to_more {
    margin: 0;
    padding: 0 .35rem .10rem 0;
}

.news-archive-year-block {
    color: #888888;
    padding: 1em;
    background-image: url(../img/news_bg.gif);
    background-color: #1e1c19;
    border: #1A1A1A solid 4px;
    border-radius: 16px 16px;
}

.form-field {
    background-color: #342f28;
    border: #1A1A1A solid 4px;
    color: white;
}

.form-field:focus {
    background-color: #343a40;
    border: #1A1A1A solid 4px;
    color: white;
}

.form-field-dark, .form-field-dark:focus {
    background-color: #1A1A1A;
    border: #342f28 solid 4px;
    color: white;
}

.profile-user-signature {
    background-color: #1f160d;
    background-image: url(../img/news_header.jpg);
    padding: 1rem;
    border-radius: 1rem;
}

h2.comments-count-header {
    color: #888888;
    font-size: 1.5rem;
}

img.avatar-micro {
    width: 24px;
    height: 24px;
    margin-left: .5rem;
    margin-right: .5rem;
    margin-bottom: 1rem;
}

.comment-block {
    margin: 1rem 0;
}

.comment-block-separate {
    border-bottom: #146c43 solid 1px;
}

.comment-list-id, .comment-user-name {
    cursor: pointer;
}

.comment-form {
    color: lightgrey;
}

.pm-block-date {
    text-align: center;
    color: #808080;
    font-weight: bolder;
}

.pm-block {
    color: #808080;
    font-weight: bold;
    background-image: url(../img/news_bg.gif);
    background-color: #333333;
    border: #1A1A1A solid 2px;
    border-radius: 8px;
    margin: .5rem 0;
    padding: .5em;
}

.pm-avatara {
    padding: .5rem;
    margin: 0 .5rem;
}

.pm-avatara > img {
    width: 48px;
    height: 48px;
}

footer {
    margin-top: auto;
    background-color: #1f160d;
    border-top: #1A1A1A solid 2px;
}

.footer-menu-separator {
    font-weight: lighter;
}

.form-error {
    font-weight: bolder;
    color: red;
}