#loader,
.btn,
.cta-info,
.cta-popup--flex,
.cta-review,
.header-address,
.header-btns,
.header-logo,
.input-wrp--check,
.product-page--btns,
.step-card,
.steps,
.submenu {
  display: -webkit-box;
  display: -ms-flexbox
}

#loader.load,
.details {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none
}

.btn,
.btn span,
.header-address *,
.input-wrp>span,
.top-menu a {
  font-size: 14px
}

#loader,
.btn,
.header-address {
  display: flex
}

.btn,
.btn span,
.page-title,
.page-title.md {
  font-weight: 600
}

.breadcrumbs li,
.catalog-list>li,
.details summary,
.header-search--form,
.input-file,
.product-card,
.steps,
.steps li,
.top-menu li {
  position: relative
}

.btn,
.top-menu a {
  text-align: center
}

.product-list,
.product-list>li,
.service-card,
.why-we--list,
.why-we--list li {
  list-style-type: none !important
}

.footer-logo,
.header-logo,
.top-menu a {
  text-decoration: none
}

.bottom_form legend,
.bottom_form legend+p,
.footer-nav a,
.input-wrp>span,
.news-card time,
.page-title,
.page-title.flex a,
.why-we--list li p {
  letter-spacing: .01em
}

.footer-address *,
.header-address {
  font-style: normal
}

#loader.load,
#to_top,
.input-file input {
  visibility: hidden;
  opacity: 0
}

.content ol.list-none,
.content ol.list-none li,
.content ul.list-none,
.content ul.list-none li,
.details {
  list-style: none
}

.btn,
.input-file,
[data-href] {
  cursor: pointer
}

.catalog-list>li.active>a::before,
.swiper-button-prev {
  rotate: 180deg
}

.catalog-grid--item h3,
.tabs-nav ul li a,
.top-menu a {
  text-transform: uppercase
}

:root {
  --primary: #01A2D8;
  --primary-10: #01A2D81A;
  --primary-20: #01A2D833;
  --primary-80: #01A2D8CC;
  --secondary: #045571;
  --white: #fff;
  --black: #010101;
  --speed: .15s ease-in-out
}

#loader {
  position: fixed;
  inset: 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 1000;
  transition: var(--transition);
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  background: var(--white)
}

.btn,
.cta-review,
.page-title.flex,
.steps {
  -webkit-box-align: center
}

#search-form input,
#to_top,
.btn,
.catalog-list>li>a::before,
.catalog-list>li>ul,
.details summary,
.details summary::before,
.header-search input,
.input-file,
.input-wrp input,
.input-wrp textarea,
.input-wrp--check input,
.news-card,
.product-card,
.top-menu a {
  transition: var(--speed);
  -webkit-transition: var(--speed);
  -o-transition: var(--speed)
}

#search-suggestions,
#to_top,
.article-card,
.btn,
.catalog-list>li>ul,
.details summary,
.details summary::before,
.input-file,
.submenu,
.submenu a,
.submenu-popup,
.suggestion-item,
.top-menu,
.top-menu a,
header.header,
header.header .header-inner {
  -webkit-transition: var(--speed);
  -o-transition: var(--speed);
  transition: var(--speed)
}

#loader::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1Ljk2NTkgMi43MzI5NkMxNi4zODMxIDEuNzU4MSAxNS45MzIyIDAuNjEzMDQ2IDE0LjkwMzQgMC4zNTY0OTJDMTIuNzQyOSAtMC4xODIyMTMgMTAuNDYxNyAtMC4xMTIxNDcgOC4zMTg1MSAwLjU3ODY3NkM1LjU2MjM3IDEuNDY3MDggMy4yMjA0NCAzLjMyMjE2IDEuNzI0NyA1LjgwMTc1QzAuMjI4OTcgOC4yODEzNCAtMC4zMTk2NzIgMTEuMjE4MiAwLjE3OTk3NiAxNC4wNzA1QzAuNjc5NjI1IDE2LjkyMjkgMi4xOTM4NiAxOS40OTgzIDQuNDQzMzcgMjEuMzIxOUM2LjY5Mjg5IDIzLjE0NTQgOS41MjU5NCAyNC4wOTQgMTIuNDE5OSAyMy45OTI2QzE1LjMxNCAyMy44OTEzIDE4LjA3MzcgMjIuNzQ2OSAyMC4xOTAyIDIwLjc3MDVDMjIuMzA2NiAxOC43OTQxIDIzLjYzNyAxNi4xMTkgMjMuOTM1OSAxMy4yMzg3QzI0LjE2ODMgMTAuOTk4OSAyMy43NjQ5IDguNzUyNTUgMjIuNzkwOCA2Ljc1MDMzQzIyLjMyNjkgNS43OTY4IDIxLjExMzQgNS41OTI2IDIwLjI0NTkgNi4yMDI0OEMxOS4zNzg1IDYuODEyMzYgMTkuMTk0NyA4LjAwNjU5IDE5LjU4NTUgOC45OTIzM0MyMC4wNjY1IDEwLjIwNTYgMjAuMjUzMSAxMS41MjU2IDIwLjExNjQgMTIuODQyM0MxOS45MTMyIDE0LjgwMDkgMTkuMDA4NSAxNi42MiAxNy41NjkzIDE3Ljk2MzlDMTYuMTMwMSAxOS4zMDc5IDE0LjI1MzUgMjAuMDg2MSAxMi4yODU2IDIwLjE1NUMxMC4zMTc2IDIwLjIyMzkgOC4zOTExNiAxOS41Nzg5IDYuODYxNDkgMTguMzM4OUM1LjMzMTgyIDE3LjA5ODkgNC4zMDIxNSAxNS4zNDc2IDMuOTYyMzggMTMuNDA4QzMuNjIyNjIgMTEuNDY4NCAzLjk5NTcgOS40NzEzMSA1LjAxMjggNy43ODUxOUM2LjAyOTkgNi4wOTkwNyA3LjYyMjQxIDQuODM3NjEgOS40OTY1OSA0LjIzMzVDMTAuNzU2NSAzLjgyNzM4IDEyLjA4NjYgMy43MzY3NSAxMy4zNzMxIDMuOTU2MzRDMTQuNDE4NCA0LjEzNDc1IDE1LjU0ODcgMy43MDc4MyAxNS45NjU5IDIuNzMyOTZaIiBmaWxsPSJibGFjayIgZmlsbC1vcGFjaXR5PSIwLjEiLz4KPC9zdmc+Cg==) center/contain no-repeat;
  animation: 1s ease-in-out infinite both load-spin;
  -webkit-animation: 1s ease-in-out infinite both load-spin;
  z-index: 10
}

#loader.load {
  z-index: -10;
  user-select: none;
  pointer-events: none
}

@-webkit-keyframes load-spin {
  from {
    transform: rotate(0);
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0)
  }

  to {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg)
  }
}

@keyframes load-spin {
  from {
    transform: rotate(0);
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0)
  }

  to {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg)
  }
}

body,
body *,
html {
  font-family: 'Open Sans';
  line-height: 1.25;
  font-size: 16px;
  color: var(--black);
  scrollbar-color: var(--primary) transparent;
  scrollbar-width: thin
}

::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background-color: transparent
}

.btn,
.catalog-list,
.catalog-list--wrp {
  height: -webkit-max-content;
  height: -moz-max-content
}

::-webkit-scrollbar-thumb {
  background-color: var(--primary);
  border-radius: 0;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0;
  -ms-border-radius: 0px;
  -o-border-radius: 0
}

body,
html {
  background-color: var(--white);
  scroll-behavior: smooth
}

body {
  counter-reset: steps
}

[data-href]:active,
a:active,
button:active {
  opacity: .7
}

.min-w-unset {
  min-width: unset !important
}

.btn {
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 5px 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 12px 18px;
  height: max-content;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  min-width: 210px
}

.btn-primary,
.btn-primary span {
  background-color: var(--primary);
  color: var(--white)
}

.btn-lite,
.btn-lite span {
  background-color: #ebf5f8;
  color: #01a2d8
}

.btn-lite span {
  background-color: transparent
}

.btn-secondary,
.btn-secondary span {
  background-color: var(--secondary);
  color: var(--white)
}

.btn-blue,
.btn-blue span {
  background-color: #ccf2ff;
  color: #045571;
  border-color: #b3e1f0
}

.btn-primary:active,
.top-menu a.active {
  background-color: #036e92
}

.btn-lite:active {
  background-color: #e5f5fa
}

.btn-secondary:active {
  background-color: #004b64
}

.page-title {
  font-size: 32px;
  padding-left: 10px;
  border: none;
  border-left: 6px solid #045571;
  margin: 0 0 32px
}

.input-wrp input,
.input-wrp textarea,
.input-wrp--check input {
  border-radius: 6px;
  transition: var(--speed);
  -webkit-transition: var(--speed);
  -o-transition: var(--speed);
  display: block
}

.details:not(:last-child),
.hero-text--sub {
  margin: 0 0 24px
}

.page-title.white {
  color: #fff;
  border-color: var(--primary)
}

.page-title.main {
  background-color: #e9f7fc;
  padding-top: 12px;
  padding-bottom: 12px
}

.page-title.flex {
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 12px
}

.page-title.flex a {
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: #045571
}

.page-title.md {
  font-size: 24px;
  border-width: 4px
}

.footer-address,
.input-wrp {
  display: block
}

.input-wrp>span {
  display: block;
  margin: 0 0 6px
}

.input-wrp input,
.input-wrp textarea {
  width: 100%;
  padding: 16px;
  border: 1px solid transparent;
  background-color: var(--white);
  color: var(--black);
  -webkit-box-shadow: 0 1px 2px 0 #0000001A;
  box-shadow: 0 1px 2px 0 #0000001A;
  -webkit-transition: var(--speed);
  -o-transition: var(--speed);
  transition: var(--speed);
  outline: 0
}

.header {
  top: 0;
  padding-top: env(safe-area-inset-top, 0)
}

.submenu,
header.header.scroll {
  -webkit-box-shadow: 0 2px 6px #00000020;
  box-shadow: 0 2px 6px #00000020
}

.input-wrp textarea {
  min-height: 130px;
  resize: none
}

.input-wrp input:active,
.input-wrp input:focus,
.input-wrp textarea:active,
.input-wrp textarea:focus {
  border-color: #045571
}

#search-form input:focus,
.header-search input:focus,
.input-wrp input:focus,
.input-wrp textarea:focus {
  background-color: #f8fdff
}

.input-wrp--check {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px
}

.input-wrp--check input {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 24px;
  height: 24px;
  padding: 5px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  border: 1px solid #045571;
  transition: var(--speed)
}

#search-form input,
.header-search input,
.input-file {
  border-radius: 6px;
  transition: var(--speed);
  -webkit-transition: var(--speed);
  -o-transition: var(--speed)
}

.input-wrp--check input:checked {
  background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxNCAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjAxOTQgMC41ODQ3NTVMNC45NTgyOCA4LjY0NTI1QzQuOTA0MDggOC42OTk2NyA0LjgzOTY4IDguNzQyODQgNC43Njg3NSA4Ljc3MjNDNC42OTc4MyA4LjgwMTc2IDQuNjIxNzkgOC44MTY5MiA0LjU0NDk5IDguODE2OTJDNC40NjgxOSA4LjgxNjkyIDQuMzkyMTUgOC44MDE3NiA0LjMyMTIzIDguNzcyM0M0LjI1MDMgOC43NDI4NCA0LjE4NTkgOC42OTk2NyA0LjEzMTcgOC42NDUyNUwxLjAxNDM3IDUuNTI1QzAuOTYwMTY4IDUuNDcwNTkgMC44OTU3NiA1LjQyNzQyIDAuODI0ODM3IDUuMzk3OTZDMC43NTM5MTQgNS4zNjg1IDAuNjc3ODcyIDUuMzUzMzQgMC42MDEwNzQgNS4zNTMzNEMwLjUyNDI3NiA1LjM1MzM0IDAuNDQ4MjMzIDUuMzY4NSAwLjM3NzMxIDUuMzk3OTZDMC4zMDYzODcgNS40Mjc0MiAwLjI0MTk3OSA1LjQ3MDU5IDAuMTg3NzgyIDUuNTI1QzAuMTMzMzcxIDUuNTc5MiAwLjA5MDE5NjYgNS42NDM2MSAwLjA2MDczNzMgNS43MTQ1M0MwLjAzMTI3OCA1Ljc4NTQ2IDAuMDE2MTEzMyA1Ljg2MTUgMC4wMTYxMTMzIDUuOTM4M0MwLjAxNjExMzMgNi4wMTUwOSAwLjAzMTI3OCA2LjA5MTE0IDAuMDYwNzM3MyA2LjE2MjA2QzAuMDkwMTk2NiA2LjIzMjk4IDAuMTMzMzcxIDYuMjk3MzkgMC4xODc3ODIgNi4zNTE1OUwzLjMwNjI4IDkuNDY5NUMzLjYzNTI1IDkuNzk3ODYgNC4wODEwNiA5Ljk4MjI4IDQuNTQ1ODcgOS45ODIyOEM1LjAxMDY3IDkuOTgyMjggNS40NTY0OCA5Ljc5Nzg2IDUuNzg1NDUgOS40Njk1TDEzLjg0NTkgMS40MTA3NUMxMy45MDAzIDEuMzU2NTcgMTMuOTQzNCAxLjI5MjIgMTMuOTcyOCAxLjIyMTMzQzE0LjAwMjIgMS4xNTA0NiAxNC4wMTczIDEuMDc0NDggMTQuMDE3MyAwLjk5Nzc1NUMxNC4wMTczIDAuOTIxMDI2IDE0LjAwMjIgMC44NDUwNTEgMTMuOTcyOCAwLjc3NDE4MkMxMy45NDM0IDAuNzAzMzEzIDEzLjkwMDMgMC42Mzg5NDEgMTMuODQ1OSAwLjU4NDc1NUMxMy43OTE4IDAuNTMwMzQzIDEzLjcyNzMgMC40ODcxNjkgMTMuNjU2NCAwLjQ1NzcxQzEzLjU4NTUgMC40MjgyNTEgMTMuNTA5NSAwLjQxMzA4NiAxMy40MzI3IDAuNDEzMDg2QzEzLjM1NTkgMC40MTMwODYgMTMuMjc5OCAwLjQyODI1MSAxMy4yMDg5IDAuNDU3NzFDMTMuMTM4IDAuNDg3MTY5IDEzLjA3MzYgMC41MzAzNDMgMTMuMDE5NCAwLjU4NDc1NVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=") var(--secondary) center/14px no-repeat
}

.input-wrp--check input:not(:checked) {
  background-color: transparent
}

.input-file {
  background-color: var(--primary);
  transition: var(--speed);
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  height: 56px;
  -moz-transition: var(--speed);
  -ms-transition: var(--speed)
}

#search-form input,
.header-search input,
.top-menu a {
  display: block;
  transition: var(--speed);
  -webkit-transition: var(--speed);
  -o-transition: var(--speed)
}

.input-file .input-file--text {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  color: var(--white)
}

.input-file input {
  width: 1px;
  height: 1px
}

header.header {
  background-color: var(--white);
  z-index: 50
}

header.header.scroll .header-inner {
  padding: 6px 0
}

.header-logo {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px
}

.header-address,
.header-btns {
  gap: 12px
}

.footer-logo img,
.header-logo img {
  width: 59px;
  height: 59px;
  -o-object-fit: contain;
  object-fit: contain;
  display: block
}

.header-logo p {
  max-width: 190px;
  font-size: 13px
}

.header-search {
  max-width: 220px;
  width: 100%
}

#search-form input,
.header-search input {
  padding: 12px 18px;
  width: 100%;
  background-color: transparent;
  border: 1px solid #e0e0e0;
  font-size: 14px;
  transition: var(--speed)
}

.hero-img,
.object-card,
.product-card,
.service-img,
.submenu,
.top-menu a {
  border-radius: 6px
}

#search-form input:active,
#search-form input:focus,
.header-search input:active,
.header-search input:focus {
  border-color: #01a2d8
}

#search-form input::-webkit-input-placeholder,
.header-search input::-webkit-input-placeholder {
  font-size: 14px;
  color: #878787
}

#search-form input::-moz-placeholder,
.header-search input::-moz-placeholder {
  font-size: 14px;
  color: #878787
}

#search-form input:-ms-input-placeholder,
.header-search input:-ms-input-placeholder {
  font-size: 14px;
  color: #878787
}

#search-form input::-ms-input-placeholder,
.header-search input::-ms-input-placeholder {
  font-size: 14px;
  color: #878787
}

#search-form input::placeholder,
.header-search input::placeholder {
  font-size: 14px;
  color: #878787
}

.header-btns {
  max-width: -webkit-min-content;
  max-width: -moz-min-content;
  max-width: min-content;
  display: flex
}

.top-menu {
  background-color: var(--secondary)
}

.top-menu li {
  width: 100%
}

.top-menu a {
  padding: 16px;
  width: 100%;
  color: var(--white);
  white-space: nowrap;
  transition: var(--speed);
  -moz-transition: var(--speed);
  -ms-transition: var(--speed)
}

.submenu {
  position: absolute;
  top: 100%;
  width: 100%;
  padding: 12px;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  background-color: #fff;
  opacity: 0;
  -webkit-transform: scaleY(0);
  -ms-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: top;
  -ms-transform-origin: top;
  transform-origin: top;
  z-index: 50
}

.footer-logo,
.product-card a,
.product-img--wrp,
.service-img {
  -webkit-box-align: center;
  display: -webkit-box;
  display: -ms-flexbox
}

.product-img--wrp,
.service-img {
  display: -webkit-box;
  display: -ms-flexbox;
  -ms-flex-align: center
}

.submenu a {
  display: block;
  color: var(--secondary);
  white-space: wrap
}

.hero-img {
  max-width: 100%;
  width: 100%;
  max-height: 480px;
  -o-object-fit: cover;
  object-fit: cover
}

.hero-text h1 {
  font-size: 128px;
  line-height: 1.1;
  font-weight: 700;
  margin: 22px 0 12px;
  color: #01a2d8
}

.object-card p,
.service-card p {
  font-weight: 600;
  text-align: center
}

.content-article h2,
.hero-text--sub {
  font-size: 24px
}

.content p:not(:last-child),
.content p:not(:last-of-type),
.hero-text p:not(:last-child),
.product-info ol li:not(:last-child) {
  margin: 0 0 12px
}

.service-img {
  background-color: var(--primary-10);
  max-height: 322px;
  height: 100%;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center
}

.service-img img {
  max-width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain
}

.service-card p {
  font-size: 20px;
  margin: 12px 0 0
}

.object-card {
  position: relative;
  height: 100%;
  overflow: hidden
}

.object-card img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  z-index: 5
}

.object-card p {
  position: absolute;
  bottom: 0;
  width: 100%;
  background-color: #01a2D8CC;
  color: var(--white);
  padding: 10px;
  font-size: 18px;
  z-index: 10
}

.product-list,
.product-list>li {
  list-style-position: unset !important
}

.content ol,
.content ul,
.content-article ol,
.content-article ul,
.product-info ol li,
.product-info ul li {
  list-style-position: inside
}

.product-card {
  -webkit-box-shadow: 0 2px 6px 0 #00000020;
  box-shadow: 0 2px 6px 0 #00000020;
  padding: 12px 16px;
  background-color: var(--white);
  transition: var(--speed)
}

.product-card[data-count]::before {
  content: attr(data-count);
  position: absolute;
  top: 4px;
  right: 4px;
  display: block;
  padding: 2px;
  font-size: 12px;
  font-weight: 200;
  border-radius: 4px;
  background-color: #d4ecf4;
  color: #01a2d8;
  text-transform: lowercase;
  z-index: 10
}

.product-img--wrp {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 0 0 16px
}

.product-img--wrp img {
  max-width: 100%;
  height: 280px;
  max-height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  border-radius: 6px
}

.catalog-items--wrp .product-img--wrp img {
  height: 200px
}

.news-card h4,
.product-card h3 {
  letter-spacing: .01em;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: -moz-box;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-clamp: 2;
  box-orient: vertical;
  min-height: 42px;
  height: 100%;
  margin: 0 0 16px
}

.menu-btn,
.step-card {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal
}

.footer-logo,
.product-card a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center
}

.product-card a {
  gap: 6px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 10px 0;
  font-size: 14px;
  color: #045571
}

.about-section,
.about-section p {
  color: var(--white)
}

.about-section {
  background-color: var(--secondary);
  padding: 62px 0 78px
}

.about-section p:not(:last-child),
.product-swiper {
  margin: 0 0 20px
}

.about-swiper .swiper-slide {
  overflow: hidden;
  border-radius: 6px
}

.about-swiper .swiper-slide img {
  max-height: 545px;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.why-we--list li img {
  margin: 18px auto 16px
}

.why-we--list li p {
  text-align: center
}

.news-card {
  padding: 16px 12px;
  border: 1px solid #dbe9ee;
  border-radius: 6px;
  overflow: hidden;
  background-color: #f8fdff;
  transition: var(--speed)
}

.news-card>img {
  border-radius: 6px;
  height: 175px;
  max-width: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  margin: 0 0 16px
}

.news-card time {
  font-size: 12px;
  display: block;
  margin: 0 0 16px
}

.news-card a {
  display: block;
  padding: 10px 0;
  font-size: 14px;
  color: #01a2d8
}

.bottom_form {
  background-color: #f3f3f3;
  padding: 56px 12px
}

.bottom_form legend {
  font-size: 32px;
  font-weight: 700;
  text-align: center;
  display: block;
  width: 100%;
  margin: 0 0 10px;
  color: #045571
}

.bottom_form legend+p {
  font-size: 18px;
  text-align: center;
  margin: 0 0 48px
}

.footer {
  padding: 62px 0 68px;
  background-color: #11242b
}

.footer-logo {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  margin: 0 24px 0 0
}

.all-results--btn,
.content-article a {
  text-decoration: underline
}

.footer-logo p {
  max-width: 190px;
  font-size: 13px;
  color: var(--white)
}

.footer-address *,
.footer-nav a {
  font-size: 14px;
  color: var(--white)
}

.footer-nav {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 12px auto 12px auto;
  grid-template-columns: repeat(3, auto);
  gap: 6px 12px
}

.footer-nav a {
  display: block;
  font-weight: 600
}

.breadcrumbs li,
.breadcrumbs li a,
.tabs-nav ul li a {
  min-width: -webkit-max-content;
  min-width: -moz-max-content;
  color: #010101
}

.step-card,
.steps li::before {
  font-size: 18px;
  text-align: center
}

.swiper-button-next,
.swiper-button-prev {
  width: 44px;
  height: 44px;
  border-radius: 100%;
  background: url(../media/img/icons/slide-arrow.svg) center/12px no-repeat #00000066
}

.catalog-list,
.catalog-list--wrp {
  height: max-content
}

.swiper-button-next::after,
.swiper-button-prev::after {
  content: '';
  display: none
}

.steps-wrp {
  background-color: #92d7EE33
}

.steps {
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0 12%;
  min-height: 420px
}

.steps::before {
  content: '';
  position: absolute;
  left: 0;
  width: 100%;
  top: 50%;
  translate: 0 -50%;
  height: 2px;
  background-color: #045571
}

.steps li::before {
  counter-increment: steps;
  content: "0" counter(steps);
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  width: 40px;
  height: 40px;
  border-radius: 100%;
  line-height: 40px;
  color: var(--white);
  font-weight: 700;
  background-color: #045571
}

.step-card {
  position: absolute;
  left: 50%;
  translate: -50% 0;
  width: 300px;
  min-height: 148px;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid #045571;
  border-radius: 6px;
  padding: 14px
}

.catalog-list--wrp,
.product-text--wrp {
  position: sticky;
  top: calc(var(--headerHeight) + 12px)
}

.about-gallery,
.product-in-work,
.reviews-block {
  -ms-grid-columns: auto 20px auto 20px auto 20px auto;
  grid-template-columns: repeat(4, auto);
  gap: 20px
}

.step-card::after,
.step-card::before {
  content: '';
  position: absolute;
  left: 50%;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background-color: #045571
}

.steps li:nth-child(odd) .step-card:before {
  bottom: -10px;
  translate: -50% 100%
}

.steps li:nth-child(odd) .step-card::after {
  bottom: -26px;
  translate: -50% 100%
}

.steps li:nth-child(2n) .step-card::before {
  top: -10px;
  translate: -50% -100%
}

.steps li:nth-child(2n) .step-card::after {
  top: -26px;
  translate: -50% -100%
}

.steps li:nth-child(odd) .step-card {
  top: unset;
  bottom: calc(100% + 62px)
}

.steps li:nth-child(2n) .step-card {
  top: calc(100% + 62px);
  bottom: unset
}

#to_top {
  position: fixed;
  bottom: 120px;
  right: 30px;
  width: 48px;
  height: 48px;
  border: 0;
  outline: 0;
  border-radius: 6px;
  background: url("../media/img/icons/arrow-top.svg") center/18px no-repeat #01a2d8;
  scale: 90%;
  z-index: 100
}

#to_top.show {
  opacity: 1;
  visibility: visible;
  scale: 100%
}

#to_top:active {
  background: url("../media/img/icons/arrow-top.svg") center/18px no-repeat #036e92
}

.breadcrumbs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  padding: 24px 0
}

.breadcrumbs li:not(:last-child):before {
  content: '';
  position: absolute;
  top: 50%;
  right: -6px;
  translate: 100% -50%;
  width: 16px;
  height: 16px;
  background: url("../media/img/icons/breadcrimb-arrow.svg") center/contain no-repeat
}

.catalog-list>li>a::before,
.details summary::before {
  top: 50%;
  translate: 0 -50%;
  height: 24px;
  content: '';
  position: absolute
}

.breadcrumbs li,
.breadcrumbs li a {
  display: block;
  min-width: max-content;
  font-size: 12px
}

.breadcrumbs li a>*,
.breadcrumbs li>* {
  font-size: 12px
}

.breadcrumbs li:not(:last-child) {
  margin: 0 28px 0 0
}

.breadcrumbs li:last-child {
  color: #595959
}

.about-gallery {
  display: -ms-grid;
  display: grid;
  margin: 32px 0 64px
}

.about-gallery img {
  width: 100%;
  height: 265px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 6px
}

.list-numeric li:not(:last-child) {
  margin: 0 0 18px
}

.catalog-list>li>ul>li:not(:last-child),
.content ul li:not(:last-child),
.content-article p:not(:last-child) {
  margin: 0 0 8px
}

.list-numeric h4,
.list-numeric mark {
  color: #045571;
  font-size: 16px;
  margin: 0 0 6px;
  font-weight: 600;
  background: 0 0
}

.content-article h6,
.list-numeric p {
  font-size: 16px
}

.content ul li,
.content-article ul li,
.product-info ul li {
  list-style-type: disc
}

.content ol li,
.content-article ol li,
.product-info ol li {
  list-style-type: decimal
}

.cta-sm {
  padding: 24px 12px 24px 78px;
  background: url("../media/img/icons/cta-sm.svg") center left 24px/44px no-repeat #e9f7fc;
  font-weight: 600;
  border-radius: 6px
}

.cta-sm a,
.details[open] summary {
  color: #045571
}

.product-in-work,
.reviews-block {
  display: -ms-grid;
  display: grid
}

.cta-popup--wrp {
  background-color: #f3f3f3;
  padding: 56px 0;
  margin: 64px 0 0
}

.catalog-items--wrp,
.content-article .mark,
.cta-review,
.tabs-content .product-info:nth-child(odd) {
  background-color: #e9f7fc
}

.cta-popup--flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 12px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center©;
  -ms-flex-align: center©;
  align-items: center©
}

.catalog-grid,
.reviews-list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 20px auto 20px auto;
  grid-template-columns: repeat(3, auto);
  gap: 20px
}

.cta-info,
.cta-review {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 32px
}

.reviews-list img {
  padding: 40px;
  border-radius: 6px;
  border: 1px solid #f3f3f3;
  aspect-ratio: 9/16;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.product-swiper--thumbs .swiper-slide,
.product-swiper--thumbs img {
  aspect-ratio: 1;
  aspect-ratio: 1
}

.cta-review {
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 24px 12px;
  border-radius: 6px
}

.faq-wrp {
  max-width: 988px
}

.details {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 24px 12px;
  border-bottom: 1px solid #045571;
  user-select: none
}

.details summary {
  list-style: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-weight: 600;
  font-size: 18px;
  cursor: pointer
}

summary::-webkit-details-marker {
  display: none
}

summary::marker {
  display: none
}

.details summary::before {
  right: 12px;
  width: 24px;
  background: url("../media/img/icons/plus.svg") center/24px no-repeat
}

.details[open] summary::before {
  rotate: 45deg
}

.details-content {
  padding: 12px 0 0
}

.catalog-grid--item {
  border-radius: 6px;
  border: 1px solid #f3f3f3;
  -webkit-box-shadow: 0 1px 4px 0 #00000020;
  box-shadow: 0 1px 4px 0 #00000020;
  padding: 24px;
  overflow: hidden
}

.catalog-grid--item img {
  margin: 0 auto;
  max-height: 280px;
  -o-object-fit: contain;
  object-fit: contain
}

.catalog-grid--item h3 {
  text-align: center;
  font-weight: 600;
  font-size: 20px
}

.catalog-items--wrp {
  padding: 32px;
  border-radius: 6px
}

.catalog-list--wrp,
.cta-info {
  background-color: #f8f8f8;
  border-radius: 6px
}

.cta-info {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 24px 12px
}

.catalog-page {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 320px 20px auto;
  grid-template-columns: 320px auto;
  gap: 20px;
  margin-bottom: 32px
}

.catalog-list--wrp {
  padding: 10px 14px
}

.catalog-list>li>a {
  display: block;
  position: relative;
  font-weight: 500;
  padding: 7px 24px 7px 0
}

.catalog-list>li>a::before {
  right: 0;
  width: 24px;
  background: url("../media/img/icons/menu-arrow.svg") center/contain no-repeat;
  -webkit-transition: var(--speed);
  -o-transition: var(--speed);
  transition: var(--speed)
}

.catalog-list>li>ul>li>a,
.product-swiper--thumbs img {
  transition: var(--speed);
  -webkit-transition: var(--speed);
  -o-transition: var(--speed);
  -webkit-transition: var(--speed);
  -o-transition: var(--speed)
}

.catalog-list>li>ul {
  max-height: 0;
  overflow: hidden
}

.catalog-list>li>ul>li {
  list-style-type: none
}

.catalog-list>li>ul>li.active>a {
  background-color: #045571;
  color: var(--white)
}

.catalog-list>li.active>ul {
  max-height: unset
}

.catalog-list>li>ul>li>a {
  display: block;
  padding: 6px 8px;
  color: var(--black);
  border-radius: 6px;
  font-size: 14px;
  transition: var(--speed);
  -webkit-transition: var(--speed);
  -moz-transition: var(--speed);
  -ms-transition: var(--speed);
  -o-transition: var(--speed);
}

.product-hero {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 548px 64px auto;
  grid-template-columns: 548px auto;
  gap: 24px 64px
}

.product-page--btns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px;
  margin: 0 0 24px
}

.product-page--btns button {
  width: 24px;
  height: 25px;
  border: 1px solid transparent;
  background: center/contain no-repeat
}

.menu-btn,
.table-wrp th {
  background-color: #01a2d8
}

#product-print {
  background-image: url("../media/img/icons/product-print.svg")
}

#product-share {
  background-image: url("../media/img/icons/product-share.svg")
}

.product-text--wrp {
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content
}

.product-text,
.tabs-nav {
  margin: 0 0 24px
}

.product-hero--name,
.product-text b:first-child {
  font-weight: 600;
  color: #045571
}

.product-cta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 24px
}

.product-swiper img {
  width: 100%;
  height: 400px;
  -o-object-fit: contain;
  object-fit: contain;
  border-radius: 6px
}

.product-swiper--thumbs {
  padding: 6px 0 12px
}

.product-swiper--thumbs img {
  border-radius: 6px;
  border: 1px solid transparent;
  -o-object-fit: contain;
  object-fit: contain;
  height: 100%;
  transition: var(--speed)
}

.product-swiper--thumbs .swiper-slide {
  border-radius: 6px
}

.product-swiper--thumbs .swiper-slide-thumb-active img {
  border-color: var(--primary)
}

.product-info {
  padding: 32px 0
}

.product-info--imgs,
.product-info--video {
  margin: 32px 0 0;
  display: -ms-grid;
  display: grid;
  gap: 20px
}

.product-info--imgs {
  grid-template-columns: repeat(6, auto)
}

.product-info--imgs img,
.product-info--video iframe,
.product-info--video video {
  display: block;
  border-radius: 6px;
  height: 180px;
  -o-object-fit: cover;
  object-fit: cover
}

.product-info--video {
  grid-template-columns: repeat(4, auto)
}

.tabs-nav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 32px;
  -ms-scroll-snap-type: x mandatory;
  scroll-snap-type: x mandatory
}

.tabs-nav ul li {
  position: relative;
  scroll-snap-align: start;
  display: block
}

.tabs-nav ul li:not(:last-child)::before {
  content: '';
  position: absolute;
  right: -16px;
  height: 100%;
  width: 2px;
  background-color: #979797
}

.tabs-nav ul li a {
  display: block;
  font-size: 18px;
  min-width: max-content;
  -webkit-transition: var(--speed);
  -o-transition: var(--speed);
  transition: var(--speed)
}

.tabs-nav ul li a[aria-selected=true] {
  font-weight: 600;
  color: #01a2d8
}

[data-fancybox] {
  cursor: -webkit-zoom-in;
  cursor: zoom-in
}

.table-wrp {
  display: block;
  width: 100%;
  overflow-x: auto
}

.table-wrp table {
  width: 100%;
  border-collapse: collapse;
  border-style: hidden;
  -webkit-box-shadow: 0 0 0 1px #045571;
  box-shadow: 0 0 0 1px #045571
}

.table-wrp td,
.table-wrp th {
  padding: 12px;
  border-right: 1px solid #045571;
  text-align: center
}

.table-wrp tr:first-child {
  border-top: 1px solid #045571
}

.table-wrp tr {
  border-bottom: 1px solid #045571
}

.table-wrp th {
  font-weight: 600;
  color: var(--white)
}

.table-wrp tr td:first-child {
  text-align: left;
  font-weight: 600
}

.table-wrp tr:first-child td:first-child,
.table-wrp tr:first-child th:first-child {
  border-left: 1px solid #045571;
  border-top-left-radius: 6px
}

.table-wrp tr:first-child td:last-child,
.table-wrp tr:first-child th:last-child {
  border-top-right-radius: 6px
}

.popup-title {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  color: #01a2d8;
  margin: 0 0 24px
}

.menu-btn {
  display: none;
  width: 44px;
  height: 40px;
  border: none;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 8px;
  border-radius: 6px;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: end
}

#menu-popup .popup,
.menu-btn>span {
  display: block;
  border-radius: 6px;
  background-color: #fff
}

.menu-btn>span {
  width: 100%;
  height: 2px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  pointer-events: none
}

.has-child span,
.menu-back::before {
  top: 50%;
  width: 12px;
  height: 12px;
  background: url("../media/img/icons/breadcrimb-arrow.svg") center/contain no-repeat
}

.menu-btn>span:nth-child(2n) {
  width: 70%
}

#menu-popup .close_popup {
  -webkit-filter: invert(1);
  filter: invert(1);
  top: 12px;
  right: 12px
}

#menu-popup .popup {
  padding: 0
}

.menu-popup--list {
  overflow-x: hidden;
  position: relative;
  margin: 48px 0 12px
}

.menu-popup--list a {
  position: relative;
  display: block;
  padding: 16px 12px;
  font-size: 14px;
  border-bottom: 1px solid #dbe9ee
}

.has-child span {
  display: block;
  margin: 0 0 0 auto;
  position: absolute;
  right: 6px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%)
}

.submenu-popup {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 50;
  translate: 100% 0;
  opacity: 0
}

.submenu-popup.active {
  translate: 0 0;
  opacity: 1
}

.menu-back {
  position: relative;
  display: block;
  border: none;
  padding: 12px 16px 16px 24px;
  background-color: var(--primary);
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  font-size: 14px;
  line-height: 1;
  color: var(--white);
  margin: 0 0 6px 12px
}

.menu-back::before {
  content: "";
  position: absolute;
  left: 6px;
  -webkit-transform: scaleX(-1) translateY(-50%);
  -ms-transform: scaleX(-1) translateY(-50%);
  transform: scaleX(-1) translateY(-50%);
  z-index: 10
}

.article-card {
  background-color: #f8fdff;
  border: 1px solid #dbe9ee
}

.article-card img {
  width: 100%;
  height: 260px;
  -o-object-fit: cover;
  object-fit: cover
}

.swiper-scrollbar-drag {
  background-color: var(--primary)
}

.content-article h2,
.content-article h3,
.content-article h4,
.content-article h5,
.content-article h6 {
  font-weight: 600;
  padding: 8px 0 16px;
  color: #045571
}

.content-article h5 {
  font-size: 18px
}

.content-article h4 {
  font-size: 20px
}

.content-article h3 {
  font-size: 22px
}

.content-article b,
.content-article strong {
  font-weight: 700;
  color: #045571
}

.content-article ol ol,
.content-article ol ul,
.content-article ul ol,
.content-article ul ul {
  margin-left: 12px
}

.content-article li:not(:last-child) {
  margin-bottom: 4px
}

.content-article a {
  display: inline-block;
  padding: 4px;
  border-radius: 4px;
  background-color: #e9f7fc;
  color: #045571
}

.content-article cite,
.content-article em,
.content-article i {
  font-style: italic
}

.content-article blockquote {
  padding: 8px 8px 8px 16px;
  margin: 8px 0;
  border-left: 2px solid #e9f7fc
}

.fancybox__backdrop {
  background: rgba(24, 24, 24, .9);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px)
}

.contact-card,
.contact-details,
.contacts-top {
  background-color: #f8fdff;
  padding: 24px
}

.f-button svg {
  stroke: #fff
}

.fancybox__infobar,
.fancybox__infobar span {
  color: #fff
}

.contacts-top {
  border: 1px solid #dbe9ee;
  border-radius: 6px;
  margin: 0 0 20px
}

.contact-card {
  border: 1px solid #dbe9ee;
  border-radius: 6px
}

.contact-card--map {
  height: 440px;
  margin: 0 0 20px
}

.contact-details {
  border: 1px solid #dbe9ee;
  border-radius: 6px;
  margin: 20px 0 0
}

#search-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border-radius: 6px;
  border: 1px solid #ccc;
  width: 100%;
  overflow-y: auto;
  z-index: 100;
  opacity: 0;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transform-origin: top;
  -ms-transform-origin: top;
  transform-origin: top
}

#search-suggestions.active {
  opacity: 1;
  -webkit-transform: translateY(1);
  -ms-transform: translateY(1);
  transform: translateY(1)
}

.suggestion-item {
  display: block;
  padding: 8px;
  font-size: 14px
}

@media (hover:hover) {
  .product-card:hover {
    background-color: #ebf5f8
  }

  .btn-lite:hover,
  .news-card:hover {
    background-color: #d4ecf4
  }

  .btn-primary:hover,
  .input-file:hover {
    background-color: #0a90bd
  }

  .btn-secondary:hover,
  .top-menu a:hover {
    background-color: #036e92
  }

  #search-form input:hover,
  #search-form input:not(:focus):hover,
  .header-search input:hover,
  .header-search input:not(:focus):hover,
  .input-wrp input:active:hover,
  .input-wrp input:not(:focus):hover,
  .input-wrp textarea:active:hover,
  .input-wrp textarea:not(:focus):hover {
    border-color: #dbeaef
  }

  .top-menu li:hover .submenu {
    -webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1
  }

  .submenu a:hover {
    color: #fff
  }

  #to_top:hover {
    background: url("../media/img/icons/arrow-top.svg") center/18px no-repeat #0a90bd
  }

  .details:hover summary {
    color: #045571
  }

  .catalog-list>li>ul>li>a:hover {
    background-color: #045571;
    color: var(--white)
  }

  .tabs-nav ul li a:hover {
    color: #01a2d8
  }

  .article-card:hover {
    background-color: #dbe9ee
  }

  .suggestion-item:hover {
    background-color: var(--primary-20)
  }
}

.suggestion-item.active {
  background-color: var(--primary-20)
}

.all-results--btn {
  color: #004b64
}

.pagination {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 12px;
  margin: 24px 0 12px;
}

.pagination li a,
.pagination li span {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  transition: var(--speed);
  -webkit-transition: var(--speed);
  -moz-transition: var(--speed);
  -ms-transition: var(--speed);
  -o-transition: var(--speed);
  color: #01a2d8;
  background-color: #ebf5f8;
  font-size: 16px;
  line-height: 1;
  text-align: center;
}

.pagination li.active span {
  background-color: var(--primary);
  color: var(--white);
}

@media (hover:hover) {
  .pagination li a:hover,
  .pagination li span:hover {
    background-color: var(--primary);
    color: var(--white);
  }
}