@charset "UTF-8";

/*!
 * Bootstrap  v5.3.8 (https://getbootstrap.com/)
 * Copyright 2011-2025 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
:root {
  --blue: #010156;
  --black: #000;
  --brown: #7F2B09;
  --indigo: #6812f3;
  --purple: #6f42c2;
  --pink: #e93f8e;
  --red: #a51f18;
  --orange: #EC9A00;
  --yellow: #F1B000;
  --green: #448344;
  --teal: #5abfdd;
  --cyan: #30638d;
  --bejevyj: #FFE5C3;
  --white: #fff;
  --gray-100: #f9fafb;
  --gray-200: #eaedf0;
  --gray-300: #dfe3e7;
  --gray-400: #ced4da;
  --gray-500: #adb5bd;
  --gray-600: #6d757e;
  --gray-700: #484f56;
  --gray-800: #353b41;
  --gray-900: #22262a;
  --primary: #010156;
  --secondary: #6d757e;
  --success: #448344;
  --info: #30638d;
  --warning: #ad6200;
  --danger: #a51f18;
  --light: #f9fafb;
  --dark: #353b41;
  --primary-rgb: 1, 1, 86;
  --secondary-rgb: 109, 117, 126;
  --success-rgb: 68, 131, 68;
  --info-rgb: 48, 99, 141;
  --warning-rgb: 173, 98, 0;
  --danger-rgb: 165, 31, 24;
  --light-rgb: 249, 250, 251;
  --dark-rgb: 53, 59, 65;
  --primary-text-emphasis: #002;
  --secondary-text-emphasis: #2c2f32;
  --success-text-emphasis: #1b351b;
  --info-text-emphasis: #132838;
  --warning-text-emphasis: #452700;
  --danger-text-emphasis: #420c09;
  --light-text-emphasis: #484f56;
  --dark-text-emphasis: #484f56;
  --primary-bg-subtle: #ccd;
  --secondary-bg-subtle: #e2e3e5;
  --success-bg-subtle: #dae6da;
  --info-bg-subtle: #d6e0e8;
  --warning-bg-subtle: #efe0cc;
  --danger-bg-subtle: #edd2d1;
  --light-bg-subtle: #fcfcfd;
  --dark-bg-subtle: #ced4da;
  --primary-border-subtle: #99b;
  --secondary-border-subtle: #c5c8cb;
  --success-border-subtle: #b4ceb4;
  --info-border-subtle: #acc1d1;
  --warning-border-subtle: #dec099;
  --danger-border-subtle: #dba5a2;
  --light-border-subtle: #eaedf0;
  --dark-border-subtle: #adb5bd;
  --white-rgb: 255, 255, 255;
  --black-rgb: 0, 0, 0;
  --font-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --gradient: linear-gradient(180deg, #ffffff26, #fff0);
  --body-font-family: "Roboto Flex", sans-serif;
  --body-font-size: 1rem;
  --body-font-weight: 400;
  --content-line-height: 1.2;
  --body-line-height: 1;
  --body-color: #22262a;
  --body-color-rgb: 34, 38, 42;
  --body-bg: #FFE5C3;
  --body-bg-rgb: 255, 255, 255;
  --emphasis-color: #000;
  --emphasis-color-rgb: 0, 0, 0;
  --secondary-color: #22262abf;
  --secondary-color-rgb: 34, 38, 42;
  --secondary-bg: #eaedf0;
  --secondary-bg-rgb: 234, 237, 240;
  --tertiary-color: #22262a80;
  --tertiary-color-rgb: 34, 38, 42;
  --tertiary-bg: #f9fafb;
  --tertiary-bg-rgb: 249, 250, 251;
  --heading-color: inherit;
  --link-color: #224faa;
  --link-color-rgb: 34, 79, 170;
  --link-decoration: underline;
  --link-hover-color: #424077;
  --link-hover-color-rgb: 66, 64, 119;
  --code-color: #e93f8e;
  --highlight-color: #22262a;
  --highlight-bg: #fbeea8;
  --border-width: 1px;
  --border-style: solid;
  --border-color: #dfe3e7;
  --border-color-translucent: #0000002d;
  --border-radius: .25rem;
  --border-radius-sm: .2rem;
  --border-radius-lg: .3rem;
  --border-radius-xl: .3rem;
  --border-radius-xxl: 2rem;
  --border-radius-2xl: var(--border-radius-xxl);
  --border-radius-pill: 50rem;
  --box-shadow: drop-shadow(0 .5rem 1rem #00000026);
  --box-shadow-sm: drop-shadow(0 .125rem .25rem #00000013);
  --box-shadow-lg: drop-shadow(0 0.3rem 0.4rem #0000002d);
  --box-shadow-inset: inset 0 1px 2px #00000013;
  --focus-ring-width: .25rem;
  --focus-ring-opacity: .25;
  --focus-ring-color: #01015640;
  --form-valid-color: #448344;
  --form-valid-border-color: #448344;
  --form-invalid-color: #a51f18;
  --form-invalid-border-color: #a51f18;
  --font-size-x-small: 10px;
  --font-size-small: 12px;
  --font-size-normal: 14px;
}

*,
a,
:before,
:after {
  box-sizing: border-box;
  text-decoration: none;

}

.article-info-term .visually-hidden {
  display: none;
}

.article-info {
  font-size: small;
  color: var(--gray-400);
  margin-bottom: 20px;
}



@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}

body {
  font-family: var(--body-font-family);
  font-size: var(--body-font-size);
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  color: var(--body-color);
  text-align: var(--body-text-align);
  background-color: var(--body-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: #0000;
  margin: 0;
}



hr {
  color: inherit;
  border: 0;
  border-top: var(--border-width) solid;
  opacity: .25;
  margin: 1rem 0;
}

h6,
.h6,
h5,
.h5,
h4,
.h4,
h3,
.h3,
h2,
.h2,
h1,
.h1 {
  color: var(--heading-color);
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: 500;
  line-height: 1.2;
}

h1,
.h1 {
  font-size: calc(1.375rem + 1.5vw);
}

@media (width >=1200px) {

  h1,
  .h1 {
    font-size: 2.5rem;
  }
}

h2,
.h2 {
  font-size: calc(1.325rem + .9vw);
}

@media (width >=1200px) {

  h2,
  .h2 {
    font-size: 2rem;
  }
}

h3,
.h3 {
  font-size: calc(1.3rem + .6vw);
}

@media (width >=1200px) {

  h3,
  .h3 {
    font-size: 1.75rem;
  }
}

h4,
.h4 {
  font-size: calc(1.275rem + .3vw);
}

@media (width >=1200px) {

  h4,
  .h4 {
    font-size: 1.5rem;
  }
}

h5,
.h5 {
  font-size: 1.25rem;
}

h6,
.h6 {
  font-size: 1rem;
}

p {
  margin-top: 0;
  margin-bottom: 0.7em;
}

abbr[title] {
  cursor: help;
  text-decoration-skip-ink: none;
  text-decoration: underline dotted;
}

address {
  font-style: normal;
  line-height: inherit;
  margin-bottom: 1rem;
}



ol,
ul,
dl {
  margin-top: 0;
  margin-bottom: 0;
  list-style: none;
  padding-inline-start: 0;
}

ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0;
}

dt {
  font-weight: 700;
}

dd {
  margin-bottom: .5rem;
  margin-left: 0;
}

blockquote {
  margin: 0 0 1rem;
}

b,
strong {
  font-weight: bolder;
}

mark,
.mark {
  color: var(--highlight-color);
  background-color: var(--highlight-bg);
  padding: .1875em 0;
}

sub,
sup {
  vertical-align: baseline;
  font-size: .75em;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}



pre,
code,
kbd,
samp {
  font-family: var(--font-monospace);
  font-size: 1em;
}

pre {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: .875em;
  display: block;
  overflow: auto;
}

pre code {
  font-size: inherit;
  color: inherit;
  word-break: normal;
}

code {
  color: var(--code-color);
  word-wrap: break-word;
  font-size: .875em;
}

a>code {
  color: inherit;
}

kbd {
  color: var(--body-bg);
  background-color: var(--body-color);
  border-radius: .2rem;
  padding: .1875rem .375rem;
  font-size: .875em;
}

kbd kbd {
  padding: 0;
  font-size: 1em;
}

img,
svg {
  vertical-align: middle;
}

table {
  caption-side: bottom;
  border-collapse: collapse;
}

caption {
  color: var(--secondary-color);
  text-align: left;
  padding-top: .5rem;
  padding-bottom: .5rem;
}

th {
  text-align: inherit;
  text-align: -webkit-match-parent;
}

thead,
tbody,
tfoot,
tr,
td,
th {
  border-color: inherit;
  border-style: solid;
  border-width: 0;
}

label {
  display: inline-block;
}

button {
  border-radius: 0;
}

button:focus:not(:focus-visible) {
  outline: 0;
}

input,
button,
select,
optgroup,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
}

button,
select {
  text-transform: none;
}

[role="button"] {
  cursor: pointer;
}

select {
  word-wrap: normal;
}

select:disabled {
  opacity: 1;
}

.position-sticky {
  position: sticky;
  top: 0;
  z-index: 3;
}

.container-header {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  background-image: url('../images/top-bar.svg?v=1');
  background-repeat: repeat-x;
  background-size: 750px;
  background-position: bottom;
  width: 100%;
  margin-right: 288px;
  margin-bottom: 30px;
  filter: var(--box-shadow-lg);
}

.container-below-top {
  margin: 12px 20px 17px;
  display: flex;
  width: 100%;
  row-gap: 12px;
  column-gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-around;

  a {
    font-weight: 300;
  }

  a:hover {
    /* border-bottom: 1px dashed var(--brown); */
    /* font-weight: 500; */
  }

}


header {


  ul {
    display: flex !important;
    column-gap: 13px;
    justify-content: center;
    align-items: center;
  }

  a {
    display: flex;
    align-items: center;
    padding: 10px 20px;
    border-radius: 15px;
    transition: 200ms;
  }

  a:hover {
    background-color: var(--brown);
    color: var(--bejevyj);
    filter: var(--box-shadow-lg);
  }

}


.navbar-brand {
  margin: 20px;
}


.site-grid {
  display: flex;
}


.container-component {
  margin-right: -60px;
  width: -webkit-fill-available;
  line-height: var(--content-line-height);
}

.container-sidebar-right {
  background-image: url('../images/bg-right-bar.svg');
  background-repeat: repeat-y;
  background-position: left;
  background-size: cover;
  filter: drop-shadow(0 0 20px rgba(0, 0, 0, 0.2));
  /* width: 410px; */
  margin-top: -60px;
  margin-bottom: -20px;
  padding: 20px 20px 16px 50px;
  display: flex;
  z-index: 1;
  flex-direction: column;
  row-gap: 30px;
}



.container-sidebar-right .card {
  margin: 20px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  .vk {
    padding: 10px 15px;
    font-size: var(--font-size-small);
  }
  .mod-menu {
    display: flex;
    gap: 25px;
    flex-direction: column;
    align-items: center;
  }
}




.item-content,
.item-page {
  background-color: var(--white);

  strong:has(img),
  p:has(img) {
    display: flex;
    justify-content: center;
  }

  img {
    border-radius: 15px;
    display: flex;
    flex: inherit;
    width: 100%;
    object-fit: contain;
  }
  .vk img {
    width: auto;
  }
}

.blog-item::before {
  margin-bottom: -2px;
  z-index: -1;
  background-image: url('../images/top-content.svg');
  background-position-y: top;
  background-size: cover;
  background-repeat: repeat-x;
  width: 100%;
  height: 37px;
  content: "";
  display: flex;
  position: relative;
  width: inherit;
  filter: drop-shadow(2px 4px 8px var(--gray-500));
}

.blog-item::after {
  margin-bottom: -2px;
  z-index: -1;
  background-image: url('../images/content-bottom.svg');
  background-position-y: bottom;
  background-size: cover;
  background-repeat: repeat-x;
  width: 100%;
  height: 37px;
  content: "";
  display: flex;
  position: relative;
  width: inherit;
  margin-bottom: 35px;
  filter: var(--box-shadow-lg);
}

main:has(.item-page) {
  padding-top: 17px;
  background-image: url('../images/top-content.svg');
  background-position-y: top;
  background-repeat: repeat-x;
  width: 100%;
  position: relative;
}

.com-content-category-blog__item .blog-item,
.item-page {
  padding: 0 30px 30px;
}

.item-content {
  padding: 20px 60px;
}

.mod-menu {
  display: flex;
  justify-content: center;

  ul li {
    text-decoration: none;
  }

  a {
    text-transform: uppercase;
    font-size: medium;
  }

  .current a {
    border-bottom: 1px dashed var(--brown);
    box-shadow: 0 3px 9px #63230030;
  }
}

.top-menu {
  min-width: 320px;
}

a {
  color: var(--brown);
}

.page-header {
  margin: 0 50px 20px;

  h1 {
    font-weight: 600;
    color: var(--brown);
  }
}

.com-content-article {
  margin-bottom: -10px;
}

.container-below-top .vk {
  display: none;
}

@media (width <900px) {
  .mod-menu {
    a {
      font-size: small;
    }
  }
  .item-content {
    padding: 20px;
  }
  .container-sidebar-right {
    display: none;
  }
  .container-component {
    margin-right: 0;
  }
  .container-header {
    margin-right: 0;
  }

  .container-below-top .vk {
    display: flex;
  }
  .lists {
    display: none;
  }
}



@media (width <=500px) {
  .mod-menu {
    a {
      font-size: var(--font-size-small);
      padding: 7px 8px;
      border-radius: 10px;
    }
  }
.top-menu {
  min-width: 250px;
}
  .container-sidebar-right {
    display: none;
  }

  .container-header {
    margin-right: 0;
  }


.container-below-top .vk {
  .image-title {
    font-size: var(--font-size-small);
    font-weight: 300;
  }
}
  .vk img {
    height: 20px;
    width: auto;
  }
}

.lists {
  display: flex;
  width: 100%;
  height: 100%;
  background-position-x: right;
  background-image: url('../images/lists.png');
  background-repeat: repeat-y;
  background-size: 50%;
  margin-bottom: -20px;
}



.vk {
  display: flex;
  flex-direction: row-reverse;
  gap: 15px;
  align-items: center;
  background-color: var(--gray-100);
  width: max-content;
  padding: 6px 8px;
  border-radius: 12px;
  box-shadow: 0 0 8px var(--border-color);
  transition: 0.3s;
}

.vk:hover {
  box-shadow: 0 0 12px var(--border-color-translucent);
}

.save-file-backgound {
  background-color: var(--white);
}

.load-files:not(:first-child) {
  margin-top: 12px;
}

.load-files {
  display: flex;
  /* height: 45px; */
  background-image: url(../images/download-file.svg);
  background-size: cover;
  padding: 20px 20px 30px;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  font-size: small;
  filter: drop-shadow(0 4px 3px rgba(88, 49, 0, 0.2));
}

.load-files-lable {
  font-weight: 400;
  color: var(--bejevyj);
}

.load-file a {
  display: flex;
  align-items: center;
  gap: 14px;
}

.load-file-link {
  color: var(--white);
  font-weight: 300;
}

.full-width {
  width: 100%;
}

.footer {
  background-image: url(../images/footer-top.svg);
  background-size: cover;
  margin-top: -25px;
  position: relative;
  z-index: 2;
  padding: 30px 0;

  a {
    color: var(--bejevyj);
  }

  .mod-menu {
    margin: 20px 30px;
    column-gap: 25px;

    .current a {
      border-color: var(--bejevyj);
      padding: 8px;
      border-radius: 0.8em;
    }
  }
}

.container-footer {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.back-to-top-link {
  position: fixed;
  bottom: 50px;
  right: 8px;
  z-index: 3;
  background-color: var(--body-bg);
  padding: 6px;
  margin: 0;
  border-radius: 30px;
  transition: 200ms;
}

.back-to-top-link:hover {
  background-color: var(--highlight-bg);
  filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.2));
}

.ramka {
  padding: 16px;
  border: 1px solid var(--gray-500);
  border-radius: 18px;
}

.brand-content {
  padding: 10px;
  padding-right: 25px;
  background-color: var(--brown);
  color: var(--bejevyj);
  display: flex;
  column-gap: 10px;
  border-radius: 35px;
  box-shadow: 0 3px 9px #63230091;
  
  img {
    display: block;
    width: 45px;
    height: max-content;
    border-radius: 40px;
  }
}
.brand-desc {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 16px;
}

.brand-desc p:first-child{
  font-size: 0.8em;
  margin-bottom: 4px;
}
.brand-desc p:last-child {
  font-size: 1em;
  font-weight: 700;
  margin-bottom: 0;
}

@media (width <800px) {
  .brand-content {
    padding: 8px;
    padding-right: 13px;
    img {
        display: block;
        width: 35px;
    }
  }
  .brand-desc {
    font-size: 14px;
  }
}

@media (width <=500px) {
  .brand-desc {
    font-size: 12px;
  }
}

.copyright {
  display: flex;
  gap: 4px;
  flex-direction: column;
  align-items: center;
  font-size: small;
  color: var(--bejevyj);
  font-weight: 300;
  margin-top: 30px;
}
.footer2 {
  text-align: center;
}


/* Страница ошибки 404 */

.error_site {
  display: flex;
  height: 100vh;
  flex-direction: column;
  justify-content: space-between;
  flex-wrap: nowrap;
  align-items: center;
}