/* === 1. RESET (normalize) === */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
html, body, div, span, object, iframe,
p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video,
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
a:active, a:hover { outline: 0; }
button, input { line-height: normal; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }
audio, canvas, video { display: inline-block; }
blockquote, q { quotes: none; }
blockquote p:before, blockquote p:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th, td { text-align: left; vertical-align: top; font-weight: normal; }
thead th, thead td { font-weight: bold; vertical-align: bottom; }
a img, th img, td img { vertical-align: top; }
button, input, select, textarea { margin: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
button { width: auto; overflow: visible; }
input[type=button], input[type=submit], button { cursor: pointer; }
input[type="radio"], input[type="checkbox"] { font-size: 110%; position: relative; top: -1px; }
input[type="search"] { -webkit-appearance: textfield; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ddd; }
img, video { max-width: 100%; height: auto; }
img { -ms-interpolation-mode: bicubic; }
hgroup h1:first-child, hgroup h2:first-child, hgroup h3:first-child, hgroup h4:first-child, hgroup h5:first-child { margin-bottom: 0; }
p, ul, ol, dl, dd, dt, blockquote, td, th { line-height: 1.6em; }
ul, ol, ul ul, ol ol, ul ol, ol ul { margin: 0 0 0 1.6em; }
ol ol li { list-style-type: lower-alpha; }
ol ol ol li { list-style-type: lower-roman; }
p, ul, ol, dl, blockquote, hr, pre, table, form, fieldset, figure, address { margin-bottom: 1.6em; }
address { font-style: normal; }
dl dt { font-weight: 500; }
dd { margin-left: 1em; }
small { font-size: 12px; line-height: 1; }
strong, b { font-weight: bold; }
em, i { font-style: italic; }
sub, sup { font-size: 10px; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
figcaption { font-size: 12px; font-style: italic; }
mark { background-color: #fddc43; color: #0f0f0f; text-decoration: none; }
button:active, button:focus { outline: none; }
input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="phone"], input[type="tel"], input[type="number"], input[type="datetime"], input[type="date"], input[type="search"], input[type="datetime-local"], textarea, select[multiple="multiple"] {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1; font-size: 14px; border-radius: 0;
  background: #fff; box-shadow: none;
  border: 1px solid #bbbcc0; outline: none;
  padding: 7px 5px; position: relative; z-index: 2;
  -webkit-appearance: none;
}
input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="phone"], input[type="tel"], input[type="number"], input[type="datetime"], input[type="date"], input[type="search"], input[type="datetime-local"] { height: 2.3em; }
input[type="range"] { position: relative; top: 3px; }
select[multiple="multiple"], textarea { line-height: 1.35em; }
fieldset { padding: 1.6em; margin-bottom: 1.6em; border: 1px solid #dbdada; }
legend { font-weight: bold; padding: 0 1em; margin-left: -1em; }
tfoot th, tfoot td { background-color: #f4f4f4; }
th, td { border-bottom: 1px solid #eee; padding: 8px 10px; }
table caption { text-transform: uppercase; padding: 0 1em; color: #777; font-size: 12px; }

/* === 2. DESIGN (layout) === */
* { margin: 0; }
html, body { width: 100%; height: 100%; margin: 0; }
body { background: #121c26 url("../img/bg.jpg") top center; color: #aec1da; }
#full { position: relative; min-height: 100%; height: auto !important; height: 100%; width: 100%; background: url("../img/bd-head2.jpg") no-repeat top center; }
* html #full { height: 100%; }
#page { padding: 0 0 315px 0; width: 100%; }
#content { overflow: hidden; padding: 0; position: relative; }
#container2 { width: 100%; float: right; margin: 0 0 0 -296px; }
#main_content { margin-left: 296px; }
.clearing { height: 0; clear: both; }
.padsite { max-width: 1700px; width: 100%; margin: 0 auto; }
#header { width: 100%; margin: 0; padding: 0; height: 580px; background: url("../img/logo.png") no-repeat 30px 84px; position: relative; }
#leftcol { width: 296px; float: left; }
#footer { position: absolute; bottom: 0; height: 314px; width: 100%; background: url("../img/bg-foot.jpg") no-repeat bottom center; font-size: 18px; line-height: 24px; }

/* === 3. LINKS === */
a img { border: 0; }
a:visited, a:link, a { color: #fff; text-decoration: underline; }
a:hover { color: #5ab2f9; text-decoration: none; }
#upm a { color: #cfdff0; display: inline-block; margin: 0; padding: 15px 10px; text-decoration: none; }
#upm a:hover { color: #5ab2f9; background: url("../img/bg-upmlink.jpg") repeat-x top center; }
#autor a { color: #1d3854; text-decoration: underline; }
#autor a:hover { color: #375e84; text-decoration: none; }
.leftmenu a { padding: 10px 20px 0 0; height: 58px; display: block; color: #d0e1f8; background: url("../img/bg-lm-midlink.png") no-repeat top left; text-decoration: none; }
.leftmenu a:first-child { height: 57px; background: url("../img/bg-lm-firstlink.png") no-repeat top left; }
.leftmenu a:last-of-type { height: 72px; background: url("../img/bg-lm-lastlink.png") no-repeat top left; }
.leftmenu a:hover { color: #fff; }

/* === 4. TYPOGRAPHY === */
body { color: #aec1da; font: 16px/21px "PT Sans", Arial, Tahoma, sans-serif; }
#upmtd, .leftmenu { font-family: 'Philosopher', 'Times New Roman', sans-serif; }
h1, h2, h3, h4, h5, h6 { font-weight: 400; text-rendering: optimizeLegibility; font-size: 18px; line-height: 24px; margin-bottom: 18px; font-family: 'Philosopher', 'Times New Roman', sans-serif; }
h1 { color: #859ab4; font-size: 36px; line-height: 30px; text-align: right; }
h2 { color: #5ab2f9; font-size: 30px; text-align: center; }
h3 { color: #fff; font-size: 24px; }
h4 { color: #859ab4; font-size: 18px; text-align: center; }
h5 { color: #fff; }
h6 { color: #859ab4; }
#main_content { font-size: 16px; }
#foottext { font-size: 16px; }

/* === 5. STYLES (components) === */
.round5 { border-radius: 5px; }
#logo a { width: 555px; height: 120px; display: block; margin-top: -72px; margin-left: 16px; }
#upmtd { width: 100%; height: 219px; font-size: 21px; background: url("../img/bg-upm.png") no-repeat top left; }
#upm { display: block; margin-left: 218px; }
#logo { margin-top: 64px; }
#social { float: right; margin: 15px 30px 0 30px; }
#social a { margin: 0 10px; }
.path { position: absolute; bottom: 20px; left: 30px; }
.contacts { position: absolute; height: auto; top: 69px; right: 20px; }
.contacts a { text-decoration: none !important; color: #cfdff0 !important; }
.contblock { background: url("../img/bg-cont.jpg") top left; padding: 20px 30px; border-radius: 0 10px 10px 0; border: 3px solid #1d3854; min-height: 300px; }
#leftbg { width: 296px; background: url("../img/bg-left.jpg") repeat-y 6px 0px; }
#leftroundtop { height: 12px; background: url("../img/bg-left-top.png") no-repeat top right; }
#leftroundfoot { height: 17px; background: url("../img/bg-left-foot.png") no-repeat bottom right; }
.leftblock { padding: 10px 30px; }
.leftpad { padding: 0px; }
.leftmenu { text-align: right; font-size: 24px; }
#adr { width: auto; margin: 20px 0 0 30px; text-align: left; }
#foothead { height: 250px; padding-top: 80px; overflow: hidden; }
#autor { background-color: #aec1da; color: #121c26; padding: 7px 20px; width: 350px; margin: 0 auto; font-size: 16px; text-align: center; }
.x_close_symbol { display: none; }
.menu_opener_wrapper { display: none; }
.contacts a:hover { color: #fff; }

/* Animations */
@keyframes menuFadeIn {
  from { display: flex; opacity: 0; top: -16px; }
  to { display: flex; opacity: 1; top: 0; }
}
@keyframes menuFadeOut {
  from { opacity: 1; top: 0; }
  to { opacity: 0; top: -24px; }
}
@keyframes blink2 {
  0%, 50%, 100% { opacity: 1; }
  25%, 75% { opacity: 0; }
}

@media (max-width: 1220px) {
  #full { background-image: url(../img/bd-head1.jpg); }
}
@media (max-width: 1050px) {
  .contacts { top: 124px; }
}
#upmenu img:first-child { display: none; }

/* Kitten cards */
.price-old { font-size: 30px; font-weight: bold; color: #bbb; display: inline-block; position: relative; line-height: 1; padding: 0 .15em; vertical-align: middle; }
.price-old::before, .price-old::after { content: ""; position: absolute; left: -5%; width: 110%; top: 50%; transform: translateY(-50%); transform-origin: center; border-bottom: 2px solid #FF0000; pointer-events: none; }
.price-old::before { transform: translateY(-50%) rotate(-12deg); }
.price-old::after { transform: translateY(-50%) rotate(12deg); }
.price-old::after { all: unset; }
.price, .kitten-name { font-size: 30px; font-weight: bold; vertical-align: bottom; display: inline-block; }
.kitten-nm { vertical-align: top; display: inline-block; }
.kitten-image-wrapper { position: relative; display: inline-block; }
.kitten-image-wrapper img { border-radius: 15px; }
.sale-badge { position: absolute; top: 5px; right: 5px; width: 80px; pointer-events: none; animation: blink2 4s infinite; }
.kittenrow { display: flex; gap: 8px; align-items: flex-start; }
.kittencell55 { flex: 0 0 66%; max-width: 66%; }
.kittencell45 { flex: 0 0 34%; max-width: 34%; }
.kittencell55 img { display: block; width: 100%; height: auto; }
.parents-row { display: flex; gap: 8px; }
.parent-col { flex: 1; }
.kittentable { border: 2px solid #ccc; border-radius: 25px; padding: 10px; margin-bottom: 0px; }
.kittentable + .kittentable { margin-top: 5px; }
.kittentable-wrapper { display: flex; flex-direction: column; gap: 5px; }

/* MOBILE */
@media (max-width: 768px) {
  .nc_row { font-size: 26px; line-height: 27px; }
  h1, h2 { font-size: 40px; }
  .onlyPC { display: none !important; }
  .menu_wrapper { position: fixed; width: 100%; height: 100%; z-index: 100; top: 0; display: none; justify-content: center; align-items: center; background-color: #0000006c; }
  .menu_wrapper.active { display: flex; animation-duration: 0.4s; animation-name: menuFadeIn; }
  .menu_wrapper.gone { display: flex; animation-duration: 0.4s; animation-name: menuFadeOut; top: -150%; }
  #upmtd { width: 92%; height: 92%; border-radius: 36px; background: rgb(2,30,47); background: linear-gradient(90deg, rgba(2,30,47,1) 0%, rgba(0,51,81,1) 100%); border: 1px solid #123E55; border-top: 0; border-radius: 24px; }
  #upmtd nav { height: 100%; }
  #upmenu { display: block; height: 100%; text-align: center; }
  #upmenu img:first-child { display: block; max-width: 140px; max-height: 140px; margin: auto; }
  #upm { margin: 0 20px; overflow-y: scroll; overflow-x: hidden; height: fit-content; max-height: 52vh; }
  #upm a { display: block; width: 100%; background: rgb(0,94,148); background: linear-gradient(90deg, rgba(0,94,148,1) 0%, rgba(15,127,179,1) 100%); border-radius: 8px; padding: 12px 0; margin: 8px 0; font-size: 24px; }
  #upm a:hover { color: auto; background: none; }
  .x_close_symbol { display: unset; position: absolute; right: 36px; top: 36px; }
  #container2 { float: unset; margin: 0; }
  #main_content { margin-left: 0; }
  #leftbg { width: 100%; background-repeat: repeat; }
  #leftcol { width: 100%; float: unset; }
  .leftmenu, #leftroundtop, #leftroundfoot { display: none; }
  #adr { text-shadow: 2px 2px 2px black; font-weight: 600; }
  #header { background-image: url(../img/logo_mobile1.png); background-position-x: 8px; background-position-y: -8px; height: 259px; }
  #full { background-image: url(../img/bd-head_mobile1.jpg); }
  #logo { margin-top: 48px; }
  #logo a { width: 310px; height: 60px; position: absolute; top: 12px; left: 8px; }
  .menu_opener_wrapper { background: #041726; display: flex; position: fixed; height: 44px; width: 100%; top: 60px; align-items: center; z-index: 99; }
  .menu_opener_wrapper img { max-width: 36px; max-height: 36px; margin-left: 8px; }
  .contacts { top: unset; bottom: 54px; left: 0; right: 0; margin: auto; }
}

@media (max-width: 480px) {
  .kittentable { border-radius: 8px; }
  .kittenrow { flex-direction: column; }
  .kittencell55, .kittencell45 { flex: none; max-width: 100%; width: 100%; }
  .kittencell55 { order: 1; }
  .kittencell45 { order: 2; }
  #header { background-image: url(../img/logo_mobile2.png); background-position-x: 65%; background-position-y: 0px; height: 200px; }
  #full { background-image: url(../img/bd-head_mobile2.jpg); }
  #logo a { width: 200px; height: 30px; top: 12px; left: unset; right: 27%; }
  .contblock { padding: 5px 10px; }
  iframe { max-width: 100%; max-height: calc(90%/9*16); }
  .nc_row { overflow: hidden; max-width: 100%; overflow-wrap: break-word; }
  #autor { max-width: 100%; }
  .path { margin-left: -16px; }
  #adr { margin-left: 8px; margin-top: -16px; }
  .price, .kitten-name { font-size: 25px; }
  .price-old { font-size: 30px; }
  .price-old::before, .price-old::after { border-bottom: 1px solid #00FF00; }
}

@media (max-width: 320px) {
  .nc_row { font-size: 22px; line-height: 23px; }
  h1, h2 { font-size: 28px; }
}

/* Sale bar */
.sale-bar { background: #ffcc00; color: #000; font-weight: 800; text-align: center; padding: 10px 8px; font-size: 22px; letter-spacing: 1px; position: sticky; top: 0; z-index: 100; line-height: 1.3; }
.sale-bar.hidden { display: none; }

@media (max-width: 768px) {



  .sale-bar { position: fixed; left: 0; width: 100%; font-size: 16px; padding: 8px 6px; }
  body { padding-top: 60px; }
}