*, ::after, ::before {
    box-sizing: border-box;
}

html {
	font-size: 100%;
}

body {
	font-size: 1em;
	margin:1em;
	background:#FFF;
	font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
	}

A 			{ color:#366; text-decoration:none; }
A:hover		{ color:#699; }

h1, h2, h3 {
	margin:0px;
	padding:0px;
	}

img {
	border:none;
	}

.blogbody img {
    max-width:100%;
    }

fieldset {
	border:solid 0 transparent;
	}

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.breadcrumbs { margin: 0 15px; }
.breadcrumbs ol { list-style:none; display:flex; flex-wrap:wrap; padding:0; margin:0; }
.breadcrumbs li + li::before { content:"\203A"; margin:0 .4em; color:#666; }

#container {
  /*padding: 10px 15px;*/
}

#shapka-blk {
    margin-left: 190px;
    text-align: center;
}

#logo-blk {
    width: 124px;
    float: left;
    text-align: center;
}
.logo-img { height: 66px; }
.logo-email { color: #ec0000; }   /* "email us" link */
.logo-mirror { font-size: small; } /* "mirror" link */

#banner {
	font-size:x-large;
	font-weight:bold;
	padding-left:15px;
	}

#banner a {
	font-size:x-large;
	color:#000;
	text-decoration:none;
	}

#banner a:hover {
	color:#000;
    }

.promo-links a {
    color:blue;
    }

.promo-links .random-link {
    text-transform: uppercase;
    }

#ruero-random {
    min-height: calc(10 * 1.4em);
}

.description {
	color:#767676;
	font-size:small;
	font-weight:bold;
	text-transform:none;
	letter-spacing:normal;
	}

.row {
    position: relative;
    }

#content {
	margin: 0 20px 20px 190px;
	}

#links {
    position: absolute;
    left: 0;
    top: 0;
	width:190px;
	color:#767676;
	}

.blog {
	padding:15px;
	}

.blog-w-right-banner, .blog-w-right-sidebar {
	padding:15px;
	margin-right:260px;
	}

.sendform {
	font-size:small;
	font-weight:normal;
	line-height:120%;
	border:thin dotted #666;
	padding:10px;
	}


.blogbody {
	font-weight:normal;
	line-height:120%;
	border-left:thin dotted #666;
	border-right:thin dotted #666;
	border-bottom:thin dotted #666;
	padding:10px;
	}

.blogbody a {
	/*font-weight:normal;*/
	text-decoration:underline;
	}

.blogbody-footer:after {
    display: table;
    content: "";
    clear: both;
}

.blogbody-footer .uptolike-rating {
    float: right;
    margin-top: -9px;
}

.info-block {
	font-size:smaller;
	font-weight:normal;
	}

.title	{
	font-size:small;
	text-transform:uppercase;
	font-weight:bold;
	}

.title a {
	color:#000;
    text-decoration:none;
	}

.title a:hover		{ color:#699; }

#menu {
	margin-bottom:15px;
	text-align:center;
	font-size:small;
	font-weight:bold;
	margin-left:124px;
	}

.banner-after-menu, .reklama-after-menu {
	margin-left:124px;
	}

.date	{
	font-size:small;
	color:#C93;
	font-weight:bold;
	text-transform:uppercase;
	margin-top:10px;
	border-bottom:thin dotted #666;
	}

.posted	{
	font-size:smaller;
	color:#5f5f5f;
	}

.blog-w-right-banner .blogbody .posted, .blog-w-right-sidebar .blogbody .posted {
    margin-top: 3em;
}

.caliber {
	color:#666;
	font-size:small;
	font-weight:normal;
	padding:3px;
	text-align:center;
	}

.nav-links {
	text-align:center;
	}

.calendar {
	color:#666;
	font-size:small;
	font-weight:normal;
	padding:3px;
	text-align:left;
	}

.calendarhead {
	color:#C93;
	font-size:small;
	font-weight:bold;
	line-height:140%;
	text-transform:uppercase;
	text-align:left;
	}

.side {
	color:#767676;
	font-size:small;
	font-weight:normal;
	line-height:140%;
	}

.sidetitle {
	color:#5f5f5f;
	font-size:small;
	font-weight:bold;
	line-height:140%;
	padding:2px;
	margin-top:10px;
	border-bottom:thin dotted #666;
	text-transform:uppercase;
	letter-spacing:.2em;
	}

.syndicate {
	font-size:x-small;
	font-weight:bold;
	line-height:140%;
	padding:2px;
	margin-top:10px;
	text-align:center;
	}

.powered {
	color:#767676;
	font-size:x-small;
	font-weight:bold;
	border-top:thin dotted #666;
	border-bottom:thin dotted #666;
	line-height:140%;
	text-transform:uppercase;
	padding:2px;
	margin-top:10px;
	text-align:left;
	letter-spacing:.2em;
	}

.comment-date {
	color:#5f5f5f;
	font-size:smaller;
	}

.comment-nick {
	font-weight:bold;
    }

.comments-body {
	color:#666;
	font-size:small;
	font-weight:normal;
	line-height:140%;
	margin:1ex 0 2ex;
	}

.comments-body blockquote {
	border:thin dotted #666;
	padding:5px;
	font-size:smaller;
	}

.comments-post {
	color:#5f5f5f;
	font-size:smaller;
	font-weight:normal;
	margin-top:0px;
    clear: left;
	}

.comments-head	{
	font-size:small;
	color:#5f5f5f;
	font-weight:bold;
	margin-top:10px;
	text-transform:uppercase;
	border-bottom:thin dotted #666;
	}

.trackback-body {
	color:#333;
	font-size:small;
	font-weight:normal;
	line-height:140%;
	padding-top:15px;
	}

.trackback-url {
	color:#666;
	font-size:small;
	font-weight:normal;
	line-height:140%;
	padding:5px;
	border:thin dashed #666;
	}

.trackback-post {
	color:#5f5f5f;
	font-size:small;
	font-weight:normal;
	margin-bottom:20px;
	}

#banner-commentspop {
	color:#C93;
	font-size:large;
	font-weight:bold;
	padding-left:15px;
	}

.gravatar {
	float:left;
	margin:0 0.5em 0 0;
	}

.comment-img {
	margin-bottom:1ex;
	}

.comment-img img {
	padding:5px;
	border:thin dotted #666;
	}

.bottom-left-informer {
	width:50%;
	float:left;
	border-width:thin thin thin 0;
	border-style:dotted;
	border-color:#666;
    font-size:small;
	}

.bottom-right-informer {
	width:49.9%;
	float:left;
	border-width:thin 0;
	border-style:dotted;
	border-color:#666;
    font-size:small;
	}

.right-banner, .right-sidebar {
	float:right;
	padding:42px 0 0 0;
	width:254px;
	}

.partners-links {
	margin:0;
	padding:0;
	}

.partners-links li {
	list-style:none;
	}

.mailform {
	margin-right:140px;
	}

.form-name-email {
	padding-right:1em;
	margin-right:1em;
	float:left;
	text-align:left;
	border-right:thin dotted #bbb;
}

#from-right-side {
	float:right;
	width:300px;
	border-left:thin dotted #666;
	border-bottom:thin dotted #666;
	}

#from-right-side-text {
	padding:15px 0 15px 15px;
	}

.b-share-popup {
	font-size:small;
}
.comments-form {
    float:left;
}
#comment-text-block {
    float:left;
    clear:left;
}
.hint-text {
	font-size:smaller;
}

.neteye-posts ul {
    display: inline-block;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.neteye-posts li {
    display: block;
    width: 250px;
    padding: 5px;
    float: left;
    text-align: center;
}

@media (min-width: 801px) {
.neteye-posts.wrap3 li:nth-child(3n+1) {
    clear: left;
}
}

.neteye-posts .preview img {
    width: 150px;
    height: 150px;
}

@media (max-width: 800px) {
body {
    margin:1ex;
	x-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}
#shapka-blk {
    margin-left: 0;
    clear: both;
}
#links {
    display:none;
}
#content {
    position: relative;
    width:100%;
    margin:0;
}
.blog {
    padding:0;
}
.title {
    font-size: medium;
}
.blogbody {
    font-size: medium;
    padding-left:0;
    padding-right:0;
    border-left:none;
    border-right:none;
}
.caliber {
    font-size: medium;
}

.right-banner {
    display:none;
}
.blog-w-right-banner {
	padding-left:0;
	padding-right:0;
	margin-right:0;
}
.mailform {
	margin-right:0;
	}
.comments-body {
	font-size:medium;
}
.comments-form {
    float:none;
}
#save-personal-info {
	font-size:smaller;
}
#comment-text-block {
    float:none;
}
#comment-text-block textarea {
    width:100%;
}
#from-right-side {
    display:none;
}
.blogbody img {
	max-width:100%;
    width:auto;
    height:auto;
}
.blogbody iframe {
	max-width:100%;
    height:auto;
}
}

@media (min-width: 1200px) {
#shapka-blk {
    margin-left: 14rem;
}
#content {
	margin-left: 14rem;
	}
#links {
	width:14rem;
	}

}

/* AA contrast: red #ff0000 (3.99:1) -> #dd0000 (5.15:1). */
.adult-badge { color:#dd0000; font-weight:bold; } /* 18+ badge in shapka */
.adult-link  { color:#dd0000; font-weight:bold; } /* age-gate links under posts */
/* Warning links read as a bold badge, not a competing underlined link (both themes). */
.blogbody a:has(.adult-link) { text-decoration:none; }

/* High-contrast users (LIGHT only): deepen brand gold (fails AA by default)
   and the lightest grey tier. Scoped to light so it never darkens text on the
   dark theme, where deep bronze/grey would be unreadable on the dark field. */
@media (prefers-contrast: more) and (prefers-color-scheme: light) {
  .date,
  .calendarhead,
  #banner-commentspop { color:#946b00; } /* gold #cc9933 (2.57:1) -> 4.81:1 */
  .side,
  .powered,
  #links { color:#595959; }              /* #767676 (4.6:1) -> 7.0:1 */
}

/* Skip link: off-screen until focused (keyboard "skip to content").
   Markup to add later as the first element inside <body>:
   <a class="skip-link" href="#main">...</a>  (label in cp1251 page text)
   and put id="main" on the <main> element. */
.skip-link {
  position: absolute;
  top: -100px;
  left: 8px;
  z-index: 1000;
  padding: 8px 16px;
  background: #000;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  border-radius: 0 0 4px 4px;
}
.skip-link:focus { top: 0; }
/* Main is programmatically focused via the skip link (tabindex="-1"); no ring on the whole region. */
#main:focus { outline: none; }

/* Touch target size (WCAG 2.5.8): promo links under posts are stacked via <br>
   at 19px line-height -> too tight. Pad to >=24px tall hit area. */
.blogbody noindex a {
  display: inline-block;
  padding: 4px 0; /* 19 + 8 = 27px */
}

/* Declare both schemes so the browser themes the canvas, scrollbars and form
   controls, and paints no white flash before CSS loads. Pairs with the
   <meta name="color-scheme"> tag in the head include. */
:root { color-scheme: light dark; }

/* ============================================================
   DARK THEME (auto, follows OS via prefers-color-scheme)
   Warm near-black derived from the logo ink (#201600), so the
   brand gold glows instead of going sour on a cool grey. Panels
   inherit the body field (their #FFF backgrounds were removed in
   cleanup), so this block only sets foreground colours + borders.
   Light theme is untouched.
   ============================================================ */
@media (prefers-color-scheme: dark) {
  body { background:#191510; color:#dcd7cc; } /* warm field + off-white text, ~13:1 */

  /* Links keep the site teal, lifted for AA on the dark field. */
  a       { color:#7ab8b8; } /* ~6.4:1 */
  a:hover { color:#9ed0d0; }

  /* Forced-black links would vanish on dark -> warm off-white. */
  .title a, #banner a, #banner a:hover { color:#e8e3d8; }
  .title a:hover { color:#9ed0d0; }

  /* Muted grey tier (was #5f5f5f / #767676 / #666 / #333 on white)
     lifted to one warm grey, dimmer than body for hierarchy. ~6.9:1 */
  .posted, .sidetitle, .comment-date, .comments-post, .comments-head,
  .trackback-post, .trackback-body, .side, #links, .powered, .description,
  .caliber, .calendar, .comments-body, .trackback-url { color:#a59f92; }

  /* Gold accents (.date/.calendarhead/#banner-commentspop) keep #cc9933 from
     the light theme -> no override needed; it reads ~5.9:1 on the warm dark. */

  /* Reds -> brighter coral lifted from the logo accent (#d24a43). Bumped from
     #ef6b5e (6:1) to clear the perceptual dimness of red on dark. ~8:1 */
  .adult-badge, .adult-link, .logo-email { color:#ff8f7a; }

  /* Promo link blue is too dark on the field -> warm-friendly blue. */
  .promo-links a { color:#8fb3e0; }

  /* Dotted/dashed rules (#666 / #bbb on white) -> warm low-key line. */
  .blogbody, .sendform, .date, .sidetitle, .powered, .comments-head,
  .comments-body blockquote, .trackback-url, .comment-img img,
  .bottom-left-informer, .bottom-right-informer, #from-right-side {
    border-color:#4a4234;
  }
  .form-name-email { border-right-color:#4a4234; }
  .breadcrumbs li + li::before { color:#a59f92; } /* ">" separator */
}