@import url(/css/reset.css); /* base-test.landing.test */
@import url(/css/animate.css);
@import url(/css/fonts.css); 
@import url(/css/my_font.css);
@import url(/css/Font_Awesome_5_Free.css);


:root {
  --bg_section_pic: rgba(0, 148, 255, 0.4);
  --bg_block_gradient: linear-gradient(180deg, rgba(154, 193, 241, 0.59) 0%, rgba(255, 255, 255, 0) 100%);
  --bg_section: #2B6691;
  --font_color: #2B6691;
  --font_color_light: #fff;
  --font_color_dark: #2B6691;
  --font_family_main: 'Cuprum', sans-serif;
  --font_family_second: 'Oswald', sans-serif;

  --col_gap_zero: 0px;


  --root_font-size: 10px;
  --root_font-scale-start: 320px;   /* стартовая ширина */
  --root_font-scale-step: 0.0035;   /* коэффициент роста */
  --root_font-base-scale: 2;        /* множитель базовой шкалы */  
}


/* === BASE === */
/* === LAYOUT === */
/* === TYPOGRAPHY === */
/* === UTILITIES === */
/* === MEDIA === */

/* body, header, footer, nav, main, section, aside, ol, li, div {
  border: 1px solid red !important;
} */

#ms .gap {
  padding: 0em calc(4% + (100vw - 360px) /100) 3em;
}
#ms .blog {
  padding: 2em calc(4% + (100vw - 360px) /100) 3em;
}

#ms .max-width-320 { max-width: 320px; width: 100%; }
#ms .max-width-375 { max-width: 375px; width: 100%; }
#ms .max-width-425 { max-width: 425px; width: 100%; }
#ms .max-width-480 { max-width: 480px; width: 100%; }
#ms .max-width-670 { max-width: 670px; width: 100%; }
#ms .max-width-768 { max-width: 768px; width: 100%; }
#ms .max-width-1024 { max-width: 1024px; width: 100%; }
#ms .max-width-1200 { max-width: 1200px; width: 100%; }
#ms .max-width-1440 { max-width: 1440px; width: 100%; }
#ms .max-width-1920 { max-width: 1920px; width: 100%; }

html {
  height: 100%;
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}

#ms body {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 100vh;
  font-family: var(--font_family_main);
}

#ms header.header {
  display: flex;
  flex-direction: row;
  align-items: center;
  /* justify-content: space-evenly; */
  padding: 1em;
  width: 100%;
  line-height: 1.3;
  font-size: 2.5em;
  position: fixed;
  /* position: sticky; */
  /* position: absolute; */
  z-index: 2;
  transition: all 0.5s;
  /* color: var(--font_color_light); */
  /* background-color: none; */
}
#ms header.header--bg-add, #ms header.header--bg-visibility {
  background-color: #fff;
  color: var(--font_color_dark);
  box-shadow: 0 1px #dadada;
}
#ms header.header--hidden {
  transform: translateY(-300%);
}
#ms header.header:hover {
  background: #fff;
  color: var(--font_color_dark);
}
#ms header.header--menu-more-open {
  background: #fff;
  color: var(--font_color_dark);
}

#ms header div.header__logo {
  position: relative;
  display: flex;
  align-items: center;
}
#ms header div.header__logo--icon::before {
  display: flex;
  align-self: center;
  font-family: 'my_font';
  content: '\f24e';
  font-size: 90%;
  padding: 0 0.5em 0 0;
}
#ms header div.header__logo--img::before {
  content: '';
  background-image: var(--img-url); /* url(); */
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  height: 100%;
  width: 100%;
  min-height: 2em;
  min-width: 6.5em
}


#ms address.header__address {
  display: flex;
  flex-direction: row;
  align-self: center;
}
#ms address.header__address > a {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 0;
  white-space: nowrap;
  padding: 0 0 0 0.5em;
}
#ms address.header__address > a.icon-phone-squared::before {
  font-size: 150%;
}  
#ms address.header__address > a.icon-phone-squared:hover::before {
  animation: 1.2s ease-in-out 0s normal none infinite running trambling-animation;
}
@keyframes trambling-animation {
  0%, 50%, 100% {
      transform: rotate(0deg);
  }
  10%, 30% {
      transform: rotate(-10deg);
  }
  20%, 40% {
      transform: rotate(10deg);
  }
} 

#ms footer {
  background: black;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #c8c8c8;
  padding: 1em;
  line-height: 1.3;
  font-size: 2.5em;
  text-transform: uppercase;
  flex-wrap: wrap;
}


#ms footer.footer a:hover {
  color: #00ff7b;
}
#ms p.footer__copyright::before {
  content: "©";
  padding: 0 0.25em 0 0;
}

#ms button {
    border: 0 none;
    cursor: pointer;
    outline: none;
}    

#ms section {
  display: flex;
  flex-direction: column;
  position: relative;
  width: 100%;
  height: 100%;
  line-height: 1.3;
  font-size: 2.5em;
  margin: 0;
  --col_gap: var(--col_gap_zero);
}




#ms .column {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  
  align-self: center;
  gap: var(--col_gap);
}
#ms .columns-1 {
  column-count: 1;
  column-gap: 0;
}
#ms .columns-2 {
  column-count: 2;
  column-gap: 0;
}
#ms .columns-3 {
  column-count: 3;
  column-gap: 0;
}
#ms .columns-4 {
  column-count: 4;
  column-gap: 0;
}


#ms .row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  height: 100%;
  gap: var(--col_gap);
}
#ms .row-nowrap {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  width: 100%;
  height: 100%;
  gap: var(--col_gap);
}

#ms .item-1 {
  width: 100%;
  /* height: auto; */
}
#ms .item-2 {
  width: calc((100% - var(--col_gap))/2 - 0.1px);
  /* height: auto; */
}
#ms .item-3 {
  width: calc((100% - var(--col_gap)*2)/3 - 0.1px);
  /* height: auto; */
}
#ms .item-4 {
  width: calc((100% - var(--col_gap)*3)/4 - 0.1px);
  /* height: auto; */
}





#ms h1, #ms h2, #ms h3, #ms h4, #ms h5, #ms h6 {
  padding: 0.25em 0;
  font-family: var(--font_family_second);
}


#ms p {
  font-size: 100%;
  padding: 0.75em 0;
}

#ms a {
  font-size: 100%;
  color: inherit;
  text-decoration: none;
}

#ms a:visited {
  color: inherit;
}

#ms ol {
  padding: 0;
  /* padding: 0 0.75em; */
}
#ms ol > li {
  display: list-item;
  list-style: disc;
  list-style-position: inside;
  padding: 0.25em 0;
}


/* Для секции */
#ms .s-center { align-items: center; }
#ms .s-left { align-items: start; }
#ms .s-right { align-items: end; }
#ms .s-auto { align-self:auto; }

/* Для блока */
#ms .b-center { align-self: center; }
#ms .b-left { align-self: start; }
#ms .b-right { align-self: end; }
#ms .b-auto { align-self:auto; }
/* #ms .b-auto { align-self:auto; flex-grow: 1;} */

/* Для текста */
#ms .t-center { text-align: center; }
#ms .t-left { text-align: left; }
#ms .t-right { text-align: right; }
#ms .t-justify { text-align: justify; }






#ms .fw-100 { font-weight: 100; }
#ms .fw-200 { font-weight: 200; }
#ms .fw-300 { font-weight: 300; }
#ms .fw-400 { font-weight: 400; }
#ms .fw-500 { font-weight: 500; }
#ms .fw-600 { font-weight: 600; }
#ms .fw-700 { font-weight: 700; }
#ms .fw-800 { font-weight: 800; }
#ms .fw-900 { font-weight: 900; }


#ms .font-size-50  { font-size: calc(0.5 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-60  { font-size: calc(0.6 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-70  { font-size: calc(0.7 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-80  { font-size: calc(0.8 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-90  { font-size: calc(0.9 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-100 { font-size: calc(1.0 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-105 { font-size: calc(1.05 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-110 { font-size: calc(1.1 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-115 { font-size: calc(1.15 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-120 { font-size: calc(1.2 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-125 { font-size: calc(1.25 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-130 { font-size: calc(1.3 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-135 { font-size: calc(1.35 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-140 { font-size: calc(1.4 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-145 { font-size: calc(1.45 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-150 { font-size: calc(1.5 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-160 { font-size: calc(1.6 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-180 { font-size: calc(1.8 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-200 { font-size: calc(2.0 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-210 { font-size: calc(2.1 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-220 { font-size: calc(2.2 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-230 { font-size: calc(2.3 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-240 { font-size: calc(2.4 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-250 { font-size: calc(2.5 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-260 { font-size: calc(2.6 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-270 { font-size: calc(2.7 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-280 { font-size: calc(2.8 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-290 { font-size: calc(2.9 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }
#ms .font-size-300 { font-size: calc(3.0 * var(--root_font-size) * var(--root_font-base-scale) + (100vw - var(--root_font-scale-start)) * var(--root_font-scale-step)); }


#ms .p-0 { padding: 0; }
#ms .p-010 { padding: 0.1em; }
#ms .p-015 { padding: 0.15em; }
#ms .p-020 { padding: 0.2em; }
#ms .p-025 { padding: 0.25em; }
#ms .p-030 { padding: 0.3em; }
#ms .p-035 { padding: 0.35em; }
#ms .p-040 { padding: 0.4em; }
#ms .p-045 { padding: 0.45em; }
#ms .p-050 { padding: 0.5em; }
#ms .p-055 { padding: 0.55em; }
#ms .p-060 { padding: 0.6em; }
#ms .p-065 { padding: 0.65em; }
#ms .p-070 { padding: 0.7em; }
#ms .p-075 { padding: 0.75em; }
#ms .p-080 { padding: 0.8em; }
#ms .p-085 { padding: 0.85em; }
#ms .p-090 { padding: 0.9em; }
#ms .p-095 { padding: 0.95em; }
#ms .p-100 { padding: 1em; }
#ms .p-125 { padding: 1.25em; }
#ms .p-150 { padding: 1.5em; }
#ms .p-175 { padding: 1.75em; }
#ms .p-200 { padding: 2em; }
#ms .p-225 { padding: 2.25em; }
#ms .p-250 { padding: 2.5em; }
#ms .p-275 { padding: 2.75em; }
#ms .p-300 { padding: 3em; }
#ms .p-400 { padding: 4em; }
#ms .p-500 { padding: 5em; }
#ms .p-600 { padding: 6em; }
#ms .p-700 { padding: 7em; }
#ms .p-800 { padding: 8em; }
#ms .p-900 { padding: 9em; }
#ms .p-1000 { padding: 10em; }


#ms .px-0 { padding-left: 0; padding-right: 0; }
#ms .px-010 { padding-left: 0.1em; padding-right: 0.1em; }
#ms .px-015 { padding-left: 0.15em; padding-right: 0.15em; }
#ms .px-020 { padding-left: 0.2em; padding-right: 0.2em; }
#ms .px-025 { padding-left: 0.25em; padding-right: 0.25em; }
#ms .px-030 { padding-left: 0.3em; padding-right: 0.3em; }
#ms .px-035 { padding-left: 0.35em; padding-right: 0.35em; }
#ms .px-040 { padding-left: 0.4em; padding-right: 0.4em; }
#ms .px-045 { padding-left: 0.45em; padding-right: 0.45em; }
#ms .px-050 { padding-left: 0.5em; padding-right: 0.5em; }
#ms .px-055 { padding-left: 0.55em; padding-right: 0.55em; }
#ms .px-060 { padding-left: 0.6em; padding-right: 0.6em; }
#ms .px-065 { padding-left: 0.65em; padding-right: 0.65em; }
#ms .px-070 { padding-left: 0.7em; padding-right: 0.7em; }
#ms .px-075 { padding-left: 0.75em; padding-right: 0.75em; }
#ms .px-080 { padding-left: 0.8em; padding-right: 0.8em; }
#ms .px-085 { padding-left: 0.85em; padding-right: 0.85em; }
#ms .px-090 { padding-left: 0.9em; padding-right: 0.9em; }
#ms .px-095 { padding-left: 0.95em; padding-right: 0.95em; }
#ms .px-100 { padding-left: 1em; padding-right: 1em; }
#ms .px-125 { padding-left: 1.25em; padding-right: 1.25em; }
#ms .px-150 { padding-left: 1.5em; padding-right: 1.5em; }
#ms .px-175 { padding-left: 1.75em; padding-right: 1.75em; }
#ms .px-200 { padding-left: 2em; padding-right: 2em; }
#ms .px-225 { padding-left: 2.25em; padding-right: 2.25em; }
#ms .px-250 { padding-left: 2.5em; padding-right: 2.5em; }
#ms .px-275 { padding-left: 2.75em; padding-right: 2.75em; }
#ms .px-300 { padding-left: 3em; padding-right: 3em; }
#ms .px-400 { padding-left: 4em; padding-right: 4em; }
#ms .px-500 { padding-left: 5em; padding-right: 5em; }
#ms .px-600 { padding-left: 6em; padding-right: 6em; }
#ms .px-700 { padding-left: 7em; padding-right: 7em; }
#ms .px-800 { padding-left: 8em; padding-right: 8em; }
#ms .px-900 { padding-left: 9em; padding-right: 9em; }
#ms .px-1000 { padding-left: 10em; padding-right: 10em; }


#ms .py-0 { padding-top: 0; padding-bottom: 0; }
#ms .py-010 { padding-top: 0.1em; padding-bottom: 0.1em; }
#ms .py-015 { padding-top: 0.15em; padding-bottom: 0.15em; }
#ms .py-020 { padding-top: 0.2em; padding-bottom: 0.2em; }
#ms .py-025 { padding-top: 0.25em; padding-bottom: 0.25em; }
#ms .py-030 { padding-top: 0.3em; padding-bottom: 0.3em; }
#ms .py-035 { padding-top: 0.35em; padding-bottom: 0.35em; }
#ms .py-040 { padding-top: 0.4em; padding-bottom: 0.4em; }
#ms .py-045 { padding-top: 0.45em; padding-bottom: 0.45em; }
#ms .py-050 { padding-top: 0.5em; padding-bottom: 0.5em; }
#ms .py-055 { padding-top: 0.55em; padding-bottom: 0.55em; }
#ms .py-060 { padding-top: 0.6em; padding-bottom: 0.6em; }
#ms .py-065 { padding-top: 0.65em; padding-bottom: 0.65em; }
#ms .py-070 { padding-top: 0.7em; padding-bottom: 0.7em; }
#ms .py-075 { padding-top: 0.75em; padding-bottom: 0.75em; }
#ms .py-080 { padding-top: 0.8em; padding-bottom: 0.8em; }
#ms .py-085 { padding-top: 0.85em; padding-bottom: 0.85em; }
#ms .py-090 { padding-top: 0.9em; padding-bottom: 0.9em; }
#ms .py-095 { padding-top: 0.95em; padding-bottom: 0.95em; }
#ms .py-100 { padding-top: 1em; padding-bottom: 1em; }
#ms .py-125 { padding-top: 1.25em; padding-bottom: 1.25em; }
#ms .py-150 { padding-top: 1.5em; padding-bottom: 1.5em; }
#ms .py-175 { padding-top: 1.75em; padding-bottom: 1.75em; }
#ms .py-200 { padding-top: 2em; padding-bottom: 2em; }
#ms .py-225 { padding-top: 2.25em; padding-bottom: 2.25em; }
#ms .py-250 { padding-top: 2.5em; padding-bottom: 2.5em; }
#ms .py-275 { padding-top: 2.75em; padding-bottom: 2.75em; }
#ms .py-300 { padding-top: 3em; padding-bottom: 3em; }
#ms .py-400 { padding-top: 4em; padding-bottom: 4em; }
#ms .py-500 { padding-top: 5em; padding-bottom: 5em; }
#ms .py-600 { padding-top: 6em; padding-bottom: 6em; }
#ms .py-700 { padding-top: 7em; padding-bottom: 7em; }
#ms .py-800 { padding-top: 8em; padding-bottom: 8em; }
#ms .py-900 { padding-top: 9em; padding-bottom: 9em; }
#ms .py-1000 { padding-top: 10em; padding-bottom: 10em; }


#ms .pt-0 { padding-top: 0; }
#ms .pt-010 { padding-top: 0.1em; }
#ms .pt-015 { padding-top: 0.15em; }
#ms .pt-020 { padding-top: 0.2em; }
#ms .pt-025 { padding-top: 0.25em; }
#ms .pt-030 { padding-top: 0.3em; }
#ms .pt-035 { padding-top: 0.35em; }
#ms .pt-040 { padding-top: 0.4em; }
#ms .pt-045 { padding-top: 0.45em; }
#ms .pt-050 { padding-top: 0.5em; }
#ms .pt-055 { padding-top: 0.55em; }
#ms .pt-060 { padding-top: 0.6em; }
#ms .pt-065 { padding-top: 0.65em; }
#ms .pt-070 { padding-top: 0.7em; }
#ms .pt-075 { padding-top: 0.75em; }
#ms .pt-080 { padding-top: 0.8em; }
#ms .pt-085 { padding-top: 0.85em; }
#ms .pt-090 { padding-top: 0.9em; }
#ms .pt-095 { padding-top: 0.95em; }
#ms .pt-100 { padding-top: 1em; }
#ms .pt-125 { padding-top: 1.25em; }
#ms .pt-150 { padding-top: 1.5em; }
#ms .pt-175 { padding-top: 1.75em; }
#ms .pt-200 { padding-top: 2em; }
#ms .pt-225 { padding-top: 2.25em; }
#ms .pt-250 { padding-top: 2.5em; }
#ms .pt-275 { padding-top: 2.75em; }
#ms .pt-300 { padding-top: 3em; }
#ms .pt-350 { padding-top: 3.5em; }
#ms .pt-400 { padding-top: 4em; }
#ms .pt-450 { padding-top: 4.5em; }
#ms .pt-500 { padding-top: 5em; }
#ms .pt-600 { padding-top: 6em; }
#ms .pt-700 { padding-top: 7em; }
#ms .pt-800 { padding-top: 8em; }
#ms .pt-900 { padding-top: 9em; }
#ms .pt-1000 { padding-top: 10em; }


#ms .pb-0 { padding-bottom: 0; }
#ms .pb-010 { padding-bottom: 0.1em; }
#ms .pb-015 { padding-bottom: 0.15em; }
#ms .pb-020 { padding-bottom: 0.2em; }
#ms .pb-025 { padding-bottom: 0.25em; }
#ms .pb-030 { padding-bottom: 0.3em; }
#ms .pb-035 { padding-bottom: 0.35em; }
#ms .pb-040 { padding-bottom: 0.4em; }
#ms .pb-045 { padding-bottom: 0.45em; }
#ms .pb-050 { padding-bottom: 0.5em; }
#ms .pb-055 { padding-bottom: 0.55em; }
#ms .pb-060 { padding-bottom: 0.6em; }
#ms .pb-065 { padding-bottom: 0.65em; }
#ms .pb-070 { padding-bottom: 0.7em; }
#ms .pb-075 { padding-bottom: 0.75em; }
#ms .pb-080 { padding-bottom: 0.8em; }
#ms .pb-085 { padding-bottom: 0.85em; }
#ms .pb-090 { padding-bottom: 0.9em; }
#ms .pb-095 { padding-bottom: 0.95em; }
#ms .pb-100 { padding-bottom: 1em; }
#ms .pb-125 { padding-bottom: 1.25em; }
#ms .pb-150 { padding-bottom: 1.5em; }
#ms .pb-175 { padding-bottom: 1.75em; }
#ms .pb-200 { padding-bottom: 2em; }
#ms .pb-225 { padding-bottom: 2.25em; }
#ms .pb-250 { padding-bottom: 2.5em; }
#ms .pb-275 { padding-bottom: 2.75em; }
#ms .pb-300 { padding-bottom: 3em; }
#ms .pb-400 { padding-bottom: 4em; }
#ms .pb-500 { padding-bottom: 5em; }
#ms .pb-600 { padding-bottom: 6em; }
#ms .pb-700 { padding-bottom: 7em; }
#ms .pb-800 { padding-bottom: 8em; }
#ms .pb-900 { padding-bottom: 9em; }
#ms .pb-1000 { padding-bottom: 10em; }


#ms .pl-0 { padding-left: 0; }
#ms .pl-010 { padding-left: 0.1em; }
#ms .pl-015 { padding-left: 0.15em; }
#ms .pl-020 { padding-left: 0.2em; }
#ms .pl-025 { padding-left: 0.25em; }
#ms .pl-030 { padding-left: 0.3em; }
#ms .pl-035 { padding-left: 0.35em; }
#ms .pl-040 { padding-left: 0.4em; }
#ms .pl-045 { padding-left: 0.45em; }
#ms .pl-050 { padding-left: 0.5em; }
#ms .pl-055 { padding-left: 0.55em; }
#ms .pl-060 { padding-left: 0.6em; }
#ms .pl-065 { padding-left: 0.65em; }
#ms .pl-070 { padding-left: 0.7em; }
#ms .pl-075 { padding-left: 0.75em; }
#ms .pl-080 { padding-left: 0.8em; }
#ms .pl-085 { padding-left: 0.85em; }
#ms .pl-090 { padding-left: 0.9em; }
#ms .pl-095 { padding-left: 0.95em; }
#ms .pl-100 { padding-left: 1em; }
#ms .pl-125 { padding-left: 1.25em; }
#ms .pl-150 { padding-left: 1.5em; }
#ms .pl-175 { padding-left: 1.75em; }
#ms .pl-200 { padding-left: 2em; }
#ms .pl-225 { padding-left: 2.25em; }
#ms .pl-250 { padding-left: 2.5em; }
#ms .pl-275 { padding-left: 2.75em; }
#ms .pl-300 { padding-left: 3em; }
#ms .pl-400 { padding-left: 4em; }
#ms .pl-500 { padding-left: 5em; }
#ms .pl-600 { padding-left: 6em; }
#ms .pl-700 { padding-left: 7em; }
#ms .pl-800 { padding-left: 8em; }
#ms .pl-900 { padding-left: 9em; }
#ms .pl-1000 { padding-left: 10em; }

#ms .plp-001 { padding-left: 1%; }
#ms .plp-002 { padding-left: 2%; }
#ms .plp-003 { padding-left: 3%; }
#ms .plp-004 { padding-left: 4%; }
#ms .plp-005 { padding-left: 5%; }
#ms .plp-006 { padding-left: 6%; }
#ms .plp-007 { padding-left: 7%; }
#ms .plp-008 { padding-left: 8%; }
#ms .plp-009 { padding-left: 9%; }
#ms .plp-010 { padding-left: 10%; }
#ms .plp-015 { padding-left: 15%; }
#ms .plp-020 { padding-left: 20%; }
#ms .plp-025 { padding-left: 25%; }
#ms .plp-030 { padding-left: 30%; }
#ms .plp-035 { padding-left: 35%; }
#ms .plp-040 { padding-left: 40%; }
#ms .plp-045 { padding-left: 45%; }
#ms .plp-050 { padding-left: 50%; }
#ms .plp-055 { padding-left: 55%; }
#ms .plp-060 { padding-left: 60%; }
#ms .plp-065 { padding-left: 65%; }
#ms .plp-070 { padding-left: 70%; }
#ms .plp-075 { padding-left: 75%; }
#ms .plp-080 { padding-left: 80%; }
#ms .plp-085 { padding-left: 85%; }
#ms .plp-090 { padding-left: 90%; }
#ms .plp-095 { padding-left: 95%; }
#ms .plp-100 { padding-left: 100%; }


#ms .pr-0 { padding-right: 0; }
#ms .pr-010 { padding-right: 0.1em; }
#ms .pr-015 { padding-right: 0.15em; }
#ms .pr-020 { padding-right: 0.2em; }
#ms .pr-025 { padding-right: 0.25em; }
#ms .pr-030 { padding-right: 0.3em; }
#ms .pr-035 { padding-right: 0.35em; }
#ms .pr-040 { padding-right: 0.4em; }
#ms .pr-045 { padding-right: 0.45em; }
#ms .pr-050 { padding-right: 0.5em; }
#ms .pr-055 { padding-right: 0.55em; }
#ms .pr-060 { padding-right: 0.6em; }
#ms .pr-065 { padding-right: 0.65em; }
#ms .pr-070 { padding-right: 0.7em; }
#ms .pr-075 { padding-right: 0.75em; }
#ms .pr-080 { padding-right: 0.8em; }
#ms .pr-085 { padding-right: 0.85em; }
#ms .pr-090 { padding-right: 0.9em; }
#ms .pr-095 { padding-right: 0.95em; }
#ms .pr-100 { padding-right: 1em; }
#ms .pr-125 { padding-right: 1.25em; }
#ms .pr-150 { padding-right: 1.5em; }
#ms .pr-175 { padding-right: 1.75em; }
#ms .pr-200 { padding-right: 2em; }
#ms .pr-225 { padding-right: 2.25em; }
#ms .pr-250 { padding-right: 2.5em; }
#ms .pr-275 { padding-right: 2.75em; }
#ms .pr-300 { padding-right: 3em; }
#ms .pr-400 { padding-right: 4em; }
#ms .pr-500 { padding-right: 5em; }
#ms .pr-600 { padding-right: 6em; }
#ms .pr-700 { padding-right: 7em; }
#ms .pr-800 { padding-right: 8em; }
#ms .pr-900 { padding-right: 9em; }
#ms .pr-1000 { padding-right: 10em; }

#ms .prp-001 { padding-right: 1%; }
#ms .prp-002 { padding-right: 2%; }
#ms .prp-003 { padding-right: 3%; }
#ms .prp-004 { padding-right: 4%; }
#ms .prp-005 { padding-right: 5%; }
#ms .prp-006 { padding-right: 6%; }
#ms .prp-007 { padding-right: 7%; }
#ms .prp-008 { padding-right: 8%; }
#ms .prp-009 { padding-right: 9%; }
#ms .prp-010 { padding-right: 10%; }
#ms .prp-015 { padding-right: 15%; }
#ms .prp-020 { padding-right: 20%; }
#ms .prp-025 { padding-right: 25%; }
#ms .prp-030 { padding-right: 30%; }
#ms .prp-035 { padding-right: 35%; }
#ms .prp-040 { padding-right: 40%; }
#ms .prp-045 { padding-right: 45%; }
#ms .prp-050 { padding-right: 50%; }
#ms .prp-055 { padding-right: 55%; }
#ms .prp-060 { padding-right: 60%; }
#ms .prp-065 { padding-right: 65%; }
#ms .prp-070 { padding-right: 70%; }
#ms .prp-075 { padding-right: 75%; }
#ms .prp-080 { padding-right: 80%; }
#ms .prp-085 { padding-right: 85%; }
#ms .prp-090 { padding-right: 90%; }
#ms .prp-095 { padding-right: 95%; }
#ms .prp-100 { padding-right: 100%; }




#ms .kvd        { aspect-ratio: 1 / 1; }   /* Квадрат */
#ms .alb        { aspect-ratio: 16 / 9; }  /* Альбом - Современное видео, презентации, YouTube*/
#ms .alb-2      { aspect-ratio: 3 / 2; }   /* Альбом - Фотоаппараты, горизонтальные обложки */
#ms .alb-old    { aspect-ratio: 4 / 3; }   /* Альбом - Старые экраны, ретро */
#ms .prt        { aspect-ratio: 2 / 3; }   /* Портрет - Современные вертикальные фото */
#ms .prt-shorts { aspect-ratio: 9 / 16; }  /* Портрет - Вертикальные видео, Reels, TikTok, YouTube */
#ms .prt-old    { aspect-ratio: 3 / 4; }   /* Портрет - Старые ID-фото, бумажные форматы */

/* Вставка image в html без обертки */
#ms img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1; /* Соотношение сторон 1:1, измените по необходимости */
  object-fit: cover;
  object-position: center;
  background-color: grey;
}
/* Вставка картинки в html с оберткой */
#ms .wrap-img {
  position: relative;
  overflow: hidden;
  padding: 0 0 100% 0;
flex-grow: 1;
}
#ms .wrap-img > img {
  position: absolute;
  object-fit: cover;
  object-position: center;
  height: 100%;
  width: 100%;
  /* top: 0; */
  left: 50%;
  transform: translateX(-50%);
}
/* Вставка картинки внутри абзацев */
#ms p > img.img-left {
  float: left;
  border: 1px solid #c8c8c8;
  margin: 0.3em 0.5em 0 0;
}
#ms p > img.img-right {
  float: right;
  border: 1px solid #c8c8c8;
  margin: 0.3em 0 0 0.5em;
}


/* Вставка background-image JPG-PNG в html */
#ms .bg-img {
  position: relative;
  border-radius: 4px;
}
#ms .bg-img::before {
  background-image: var(--img-url);  /* переменная img-url в html */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /* filter: blur(0.1rem); */
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -2;
  height: 100%;
  /* border: 1px solid #a7a7a7; */
}
#ms .bg-img::after {
  content: "";
  position: absolute;
  background-image: linear-gradient(to right, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.75) 100%);
  background-position: center;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  /* filter: blur(0.1rem); */
  height: 100%;
  /* border: 1px solid #fff; */
}



/* Вставка иконки через иконочный шрифт в псевдоэлементе CSS */
#ms .icon-font {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
#ms .icon-font::before {
  content: "\f111"; /* обводка - круг */
  font-family: my_font;
  font-size: 4em;
  line-height: 0.87;
  color: #308bf3;
}
#ms .icon-font::after {
  /* font-family: my_font;
  content: "\f219"; */
  content: attr(data-content); /* атрибут data-content в html */
  font-size: 2em;
  position: absolute;
  color: #fff;
}


/* Вставка иконки JPG-PNG через псевдоэлемент в CSS */
#ms .icon-img-url {
  display: flex;
  position: relative;
  min-height: 3.5em;
  min-width: 3.5em;
}
#ms .icon-img-url::before {
  content: '';
  position: absolute;
  background-image: var(--img-url); /* переменная img-url в html */
  background-repeat: no-repeat;
  background-size: 100%;
  height: 100%;
  width: 100%;
}

/* Вставка иконки SVG через псевдоэлемент в CSS */
#ms .icon-svg-url {
  display: flex;
  min-height: 3.5em;
  min-width: 3.5em;
  justify-content: center;
  align-items: center;
  /* 
  обводка - круг
  border: 3px solid red;
  border-radius: 64px; 
  */
}
#ms .icon-svg-url::before {
  content: '';
  display: flex;
  position: relative;
  -webkit-mask-image: var(--img-url); /* переменная img-url в html */
  mask-image: var(--img-url); /* переменная img-url в html */
  mask-image: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  background: #03ab6c;
  min-height: 3.5em;
  min-width: 3.5em;
}

/* Вставка иконки SVG в html */
#ms svg.icon-svg {
  width: 3.5em;
  fill: #03ab6c;
}

/* Вставка иконки JPG-PNG в html */
#ms img.icon-img {
  width: 3.5em;
}




#ms .spoiler {
  cursor: pointer;
}
#ms .is-hidden {
  transition: all 1s ease-out;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
}
#ms .is-hidden-hard {
  display: none !important;
}
#ms .hyphens {
  hyphens: auto;
}
#ms .crop {
  text-overflow: ellipsis; /* Добавляем многоточие в конце */
}
#ms .uppercase {
  text-transform: uppercase;
}
#ms .italic {
  font-style: italic;
}
#ms .underline {
  text-decoration: underline;
}
#ms .link-visibly {
text-decoration: underline;
color: deepskyblue;
cursor: pointer;
}


/* a:has([data-blo]){
  color: red;
} */






































/* @MEDIA #################### */

@media (max-width: 375px) {
  #ms .hidden-375-minus { display: none !important; }
}
@media (min-width: 376px) {
  #ms .hidden-375-plus { display: none !important; }
}
@media (max-width: 480px) {
  #ms .hidden-480-minus { display: none !important; }
}
@media (min-width: 481px) {
  #ms .hidden-480-plus { display: none !important; }
}
@media (max-width: 670px) {
  #ms .hidden-670-minus { display: none !important; }
}
@media (min-width: 671px) {
  #ms .hidden-670-plus { display: none !important; }
}
@media (max-width: 768px) {
  #ms .hidden-768-minus { display: none !important; }
}
@media (min-width: 769px) {
  #ms .hidden-768-plus { display: none !important; }
}
@media (max-width: 980px) {
  #ms .hidden-980-minus { display: none !important; }
}
@media (min-width: 981px) {
  #ms .hidden-980-plus { display: none !important; }
}
@media (max-width: 1024px) {
  #ms .hidden-1024-minus { display: none !important; }
}
@media (min-width: 1025px) {
  #ms .hidden-1024-plus { display: none !important; }
}
@media (max-width: 1280px) {
  #ms .hidden-1280-minus { display: none !important; }
}
@media (min-width: 1281px) {
  #ms .hidden-1280-plus { display: none !important; }
}
@media (max-width: 1366px) {
  #ms .hidden-1366-minus { display: none !important; }
}
@media (min-width: 1367px) {
  #ms .hidden-1366-plus { display: none !important; }
}
@media (max-width: 1600px) {
  #ms .hidden-1600-minus { display: none !important; }
}
@media (min-width: 1601px) {
  #ms .hidden-1600-plus { display: none !important; }
}
@media (max-width: 1920px) {
  #ms .hidden-1920-minus { display: none !important; }
}
@media (min-width: 1921px) {
  #ms .hidden-1920-plus { display: none !important; }
}
@media (max-width: 2048px) {
  #ms .hidden-2048-minus { display: none !important; }
}
@media (min-width: 2049px) {
  #ms .hidden-2048-plus { display: none !important; }
}
@media (max-width: 2560px) {
  #ms .hidden-2560-minus { display: none !important; }
}
@media (min-width: 2561px) {
  #ms .hidden-2560-plus { display: none !important; }
}


/* @MEDIA #################### */

@media only screen and (max-width : 670px) {
  #ms header {
    justify-content: space-between;
    padding: 0.5em calc(4% + (100vw - 360px) /100);
  }
  #ms header.header {
    min-height: 4em;
  }

  #ms ol.row li {
    flex-direction: column;
  }
}


/* @MEDIA #################### */

@media only screen and (min-width:320px) and (max-width:375px) {
  :root {
    --root_font-size: 10px;
  }

  #ms .item-4, #ms .item-3, #ms .item-2, #ms .item-1 {
    width: 100%;
  }
  #ms .columns-4, #ms .columns-3, #ms .columns-2 {
    column-count: 1;
  }
  #ms address.header__address {
    display: none;
  }
}

@media only screen and (min-width:376px) and (max-width:480px) {
  :root {
    --root_font-size: 10px;
  }

  #ms .item-4, #ms .item-3, #ms .item-2, #ms .item-1 {
    width: 100%;
  }
  #ms .columns-4, #ms .columns-3, #ms .columns-2 {
    column-count: 1;
  }
  #ms address.header__address {
    display: none;
  }
}

@media only screen and (min-width:481px) and (max-width:670px) {
  :root {
    --root_font-size: 10px;
  }

  #ms .item-4, #ms .item-3, #ms .item-2 {
    width: calc((100% - var(--col_gap))/2 - 0.1px);
  }
  #ms .columns-4, #ms .columns-3 {
    column-count: 2;
  }
}

@media only screen and (min-width:671px) and (max-width:768px) {
  :root {
    --root_font-size: 10px;
  }

  #ms .item-4, #ms .item-3, #ms .item-2 {
    width: calc((100% - var(--col_gap))/2 - 0.1px);
  }
  #ms .columns-4, #ms .columns-3 {
    column-count: 2;
  }
}

@media only screen and (min-width: 769px) and (max-width: 980px) {
  :root {
    --root_font-size: 10px;
  }

  #ms .item-4, #ms .item-3 {
    width: calc((100% - var(--col_gap)*2)/3 - 0.1px);
  }
  #ms .columns-4 {
    column-count: 3;
  }
}

@media only screen and (min-width: 981px) and (max-width: 1024px) {
  :root {
    --root_font-size: 10px;
  }

  #ms .item-4, #ms .item-3 {
    width: calc((100% - var(--col_gap)*2)/3 - 0.1px);
  }
  #ms .columns-4 {
    column-count: 3;
  }
}

@media only screen and (min-width: 1025px) and (max-width: 1280px) {
  :root {
    --root_font-size: 10px;
  }

}

@media only screen and (min-width: 1281px) and (max-width: 1366px) {
  :root {
    --root_font-size: 10px;
  }

}

@media only screen and (min-width: 1367px) and (max-width: 1600px) {
  :root {
    --root_font-size: 10px;
  }

}

@media only screen and (min-width: 1601px) and (max-width: 1920px) {
  :root {
    --root_font-size: 10px;
  }

}

@media only screen and (min-width: 1921px) and (max-width: 2048px) {
  :root {
    --root_font-size: 10px;
  }

}

@media only screen and (min-width: 2049px) and (max-width: 2560px) {
  :root {
    --root_font-size: 10px;
  }

}

@media only screen and (min-width: 2561px) {
  :root {
    /* --root_font-size: 10px; */
    --root_font-size: 8px;
  }

}





/* 3440px x 1440px (UltraWide мониторы)
3840px x 2160px (4K, Ultra HD, стандартное разрешение для многих современных мониторов)
5120px x 2880px (5K, некоторые мониторы)
7680px x 4320px (8K, некоторые мониторы) */










































/* POLICY STYLES #################### */

#ms section.policy {
  /* color: var(--font_color_dark);  */
  color: inherit; 
}
#ms section.policy h2, #ms section.policy h3 {
  font-family: var(--font_family_main);
}
#ms section.policy a {
  color: blue;
  text-decoration: underline;
}
/* THANKS STYLES #################### */
#ms section.thanks {
  flex-grow: 1;
  color: var(--font_color_dark);
  opacity: 0;
  animation: ani 2.5s forwards; 
}
@keyframes ani {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

#ms div.thanks {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  align-items: center;
  justify-content: center;
}

#ms section.thanks a {
  color: blue;
  text-decoration: underline;
}