/* HTML */
/* -------------------------------------------------------------------- */
html { height: 100%; font-size: 10px; }
body {  width: 100%; min-height: 100%; vertical-align: top;	background: var(--background-color); color: var(--text-color); font-size: 1.7rem; font-family: var(--font); font-weight: 300; line-height: 1.4; }
body > .container { overflow: hidden; }

hr { display: block; margin: 6rem 0; border:none; background: transparent; border-bottom: 1px solid #aaa; }

.ui-slider .slick-slide { display: block; }
.ui-slider { margin-left: -2rem; margin-right: -2rem;}

@media screen and (max-width: 960px) {
	.ui-slider { margin-left: 0; margin-right: 0;}
}

/* Main elements */
/* -------------------------------------------------------------------- */
img { display: inline-block; max-width: 100%; height: auto; }
p:not(:last-child) { margin-bottom: 1em; }

a { color: inherit; text-decoration: underline; }
a:hover { text-decoration: none; }

em { font-weight: bold; font-style: normal; }
strong { font-weight: bold; }
b { font-weight: bold; }
sub { vertical-align: sub; }

.card-link { position: absolute; left: 0; top: 0; width: 100%; height: 100%;}

/* Headings */
/* -------------------------------------------------------------------- */
h1, h2, h3, h4 { margin-bottom: 0.5em; line-height: 1.1; color: var(--heading-color); font-weight: normal; }
h2:not(:first-child), h3:not(:first-child), h4:not(:first-child) { margin-top: 1em;}
h1 { font-size: 4rem; font-weight: bold; margin-bottom: 1em; }
h2 { margin-bottom: 0.7em; font-weight: bold; }
h3 { font-size: 2.8rem; font-weight: bold; }
h2 { font-size: 3.4rem; color: var(--heading-color);  }
h2 ~ h3 { margin-top: 0.5rem !important; font-size: 2.4rem;  }

h1, h2, h3 { font-family: var(--font-heading);  }

@media screen and (max-width: 640px) {
	h2 ~ h3 { text-align: center; margin-bottom: 4rem; }
}

/* Lists */
/* -------------------------------------------------------------------- */
ol > li::marker  {  display: inline; }
ol > li::before,
ul > li::before { display: inline-block; }
ol > li > p { display: inline; }
ul > li > p { display: inline; }

.hidden { display: none !important; }
.clearfix { clear: both; }



/* Картинки */
/* -------------------------------------------------------------------- */
img.-full { width: 100%; height: auto; float: none; max-width: none; margin-left: 0; margin-right: 0; margin: 3rem 0;}
img.-left { float: left; margin-right: var(--span); margin-bottom: var(--span); max-width: 50rem; height: auto; position: relative; }
img.-right { float: right; margin-left: var(--span); margin-bottom: var(--span); max-width: 50rem; height: auto; position: relative; }
img.-left.-small { max-width: 30rem; }
img.-right.-small { max-width: 30rem; }
img.-center { margin: 0 auto; max-height: 60rem; width: auto; display: block; margin:2rem auto; }
img.-frame { border: 2px solid #00000020; box-shadow: var(--shadow); }

@media screen and (max-width: 768px) {
	img.-left, img.-right { float: none; max-width: none; margin:0; margin-bottom: 2rem; width: 100%; }
}

/* Таблицы */
/* -------------------------------------------------------------------- */
table { width: 100%; border: 1px solid #c0c0c0; margin-bottom: 4rem; background: white;  text-align: center; overflow: hidden; }
table caption { display: none; }
table td,
table th { border: 1px solid #c0c0c0; padding: 2rem; text-align: center;  }
table th { background: #e1e1e1; color: black; font-size: 1.8rem; }
table td { text-align: center; padding: 1rem 2rem; }
table td strong { font-weight: bold;}


@media screen and (max-width: 960px) {
	table { overflow: auto; max-width: 100%; }
}


.ui-links-group a { color: black; display: inline-block; padding: 0.5rem 1rem; background: #e0e0e0; font-size: 1.6rem; margin-right: 0.5rem; margin-bottom: 0.5rem; text-decoration: none; transition: .3s all; border-radius: 0.3rem; }
.ui-links-group a:hover { color: white; background: black; }


.tabs {  position: relative;  padding: .2em; }
.tabs .tabs-navigation {  display: flex; flex-wrap: wrap; }
.tabs .tabs-navigation a { padding: 1px; text-decoration: none; display: inline-block; padding: 1rem; background: linear-gradient(to top, #0001, transparent 2rem), linear-gradient(310deg, #0001, transparent 2rem), white; border-left: 1px solid #0001; transition: .3s; }
.tabs .tabs-navigation a:hover { background: #eee; }
.tabs .tabs-navigation a.-active {  background: var(--color-yellow); }
.tabs .tabs-content { background: white; padding: 1rem; }
.tabs .tab { padding: 20px; display: none; }
.tabs .tab.-active { display: block; }



/* Панели */
/* -------------------------------------------------------------------- */
.ui-panel { padding: var(--span-large); box-shadow: var(--shadow); background: white;  }
.ui-panel.-gray { background: var(--color-light-gray); }
.ui-panel.-blue { background: var(--color-blue); }
.ui-panel.-white { --text-color: var(--color-black); background: var(--color-white); color: var(--text-color); --heading-color: black;}
.ui-panel.-frameless { padding:0; overflow: hidden; }

.ui-panel.-with-image { display: flex; align-items: center; min-height: 10rem; padding-right: 30rem; position: relative; overflow: hidden; }
.ui-panel.-with-image > .image { width: 30rem;  position: absolute; right:0; top: 0; bottom:0;  }
.ui-panel.-with-image > .image img { margin-bottom: 0; width: 100%; height: 100%; object-fit: cover; }


@media screen and (max-width: 768px) {
	.ui-panel { padding: var(--span); }
}

.ui-center { text-align: center; }
.ui-center.-panel { max-width: 60rem; margin:0 auto;}
.ui-inline { display: flex; align-items: center; gap: 0.5rem; justify-content: center; }


.slider .slick-slide {margin: 1rem; display: block; }

/* Контейнеры для элементов */
/* -------------------------------------------------------------------- */
.ui-flex-container { display: flex; gap: 2rem; align-items: center; flex-wrap: wrap; }
.ui-flex-container > * { flex-shrink: 0; }

@media screen and (max-width: 768px) {
	.ui-flex-container { flex-wrap: wrap; }
	.ui-flex-container > * { flex-basis: 100%; }
}



.ui-articles-container { display: flex; flex-direction: column; gap: 2rem; }

.ui-container { display: grid; grid-template-rows: auto; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--span);}
.ui-container.-small { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.ui-container.-smaller { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.ui-container.-normal { grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); }
.ui-container.-wide { grid-template-columns: repeat(auto-fit, minmax(500px, 1fr)); }

@media screen and (max-width: 960px) {
	.ui-container { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));}	
}

@media screen and (max-width: 640px) {
	.ui-container { display: flex; flex-flow: wrap; }
	.ui-container > * { flex-grow: 1;  }
}


.buttons-container { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }


.ui-grid { display: grid; grid-template-rows: auto; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; justify-content: center;  }
.ui-grid.-narrow { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; grid-gap: 1rem; }
.ui-grid.-narrower { grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); }
.ui-grid.-wider { grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); }
.ui-grid.-wide { grid-template-columns: repeat(auto-fill, minmax(500px, 1fr)); }

@media screen and (max-width: 960px) {
	.ui-grid.-narrower { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
	.ui-grid.-wider { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
	.ui-grid.-wide { grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); }
}


.ui-split-container { display: flex; gap: var(--span-large); }
.ui-split-container > * { width: 48%; flex-grow: 1;}

.ui-split-container.-center { align-items: center; }

.ui-split-container.-proportion-2-1 > *:nth-child(1) { width: 64%; }
.ui-split-container.-proportion-2-1 > *:nth-child(2) { width: 31%; }

@media screen and (max-width: 768px) {
	.ui-split-container { flex-wrap: wrap; }
	.ui-split-container > * { width: auto; }
}


/* Адптивное меню */
/* -------------------------------------------------------------------- */
.ui-mobile-menu { display:none; position: fixed; top:0; left:0; width: 100%; height: auto; z-index: 200; max-height: 100%; overflow: auto;  }

.ui-mobile-menu .menu-main li ul { position: relative; color: white; background: transparent;}
.ui-mobile-menu .menu-main li.active { background: none !important; color: white !important; }
.ui-mobile-menu .menu-main li.active > a,
.ui-mobile-menu .menu-main li.active > span { font-weight: bold; }
.ui-mobile-menu .menu-main li.active > ul { margin-left: 2rem; padding-left: 0;  background: #00000020;  }
.ui-mobile-menu .menu-main li ul li { border: none !important; }

.ui-mobile-menu li { display: block; } 
.ui-mobile-menu li a,
.ui-mobile-menu li span { display: block; padding: 0.5rem 0; }
.ui-mobile-menu li:hover > a { text-decoration: underline; }
.ui-mobile-menu > ul { display: none; background: white; padding: 2rem 4rem; z-index: 100;  overflow: auto;  position: relative; }
.ui-mobile-menu a { color: black; text-decoration: none;  }
.ui-mobile-menu > ul > li > ul { display: none; padding: 1rem; margin: 0 -4rem; font-size: 90%; padding-left: 5rem; }
.ui-mobile-menu > ul > li.active > ul { display: block; background: #00000020; border-bottom: 1px solid rgba(255,255,255,0.3); border-top: 1px solid rgba(255,255,255,0.3); }
.ui-mobile-menu li.active > a { font-weight: bold; }
.ui-mobile-menu li.active > ul { display: block; }

.ui-mobile-menu .open-button { width: 100%; border-radius: 0; text-align: left; padding-left: 4rem; justify-content: start; background: var(--color-blue); height: 5rem; color: white; }
.ui-mobile-menu .open-button i { transition: all .3s; display: block; content: ''; width: 2rem; height: 2rem; background: white; position: absolute; right: 2rem; top: 50%; transform: translate(0, -50%); }

	.ui-mobile-menu.open::after { content: ''; display: block; top: 100%; height: 2rem; left:0; right:0; background: linear-gradient(#0003, transparent); }
	.ui-mobile-menu.open > ul { background: linear-gradient(#006db040, transparent 5rem), white; }

	.ui-mobile-menu.open .open-button i { --image: url(../img/icons/close.svg); }

@media screen and (max-width: 768px) {
	body { padding-top: 5rem; }
	.ui-mobile-menu { display: block;  }
	.ui-mobile-menu.open > ul { display: block; height: 100%; }
	.ui-mobile-menu.open .open-button { background: var(--color-blue); }
	.ui-mobile-menu.open .open-button::after { opacity: 1; background-image: url(../img/ui-close.svg); filter: invert(100%); }
}


.ui-section { margin-bottom: var(--span); clear: both;  overflow: hidden; }
.ui-section:last-child { margin-bottom: 0; }


.message-queue { position: fixed; top: 50%; padding: 3rem; left: 50%; right: 0; background: rgba(0, 0, 0, 0.7); transform: translate(-50%, -50%); max-width: 800px; border-radius: 1rem;  z-index:100; }
.message-queue .message { margin: 0 auto; max-width: 700px; display: block; background: white; padding: 1rem; margin-bottom: 0.5rem; border-radius: 3px; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);  }
.message-queue .message: last-child { margin-bottom: 0;  }
.message-queue .message.error { border-left: 5px solid #a6051b;  }
.message-queue .message strong { font-weight: bold; }
.message-queue .message .large { font-size: 2.5rem;}
.message-queue .message .large strong { color: #a6051b; }
.message-queue .message.critical { border-left: 5px solid transparent; color: white; background: #a6051b;  }
.message-queue .message.warning { border-left: 5px solid #ffd376;  }

@media screen and (max-width: 640px) {
	 .message-queue { padding: 1rem; bottom: 0; width: 100%; border-radius: 0; top: auto; transform: none; left:0; right:0; }
	 .message-queue .message { padding: 0.5rem; }
}

/* Хлебные крошки */
/* -------------------------------------------------------------------- */
.breadcrumbs { font-size: 1.6rem; margin-bottom: 2rem;  color: #666; display: inline; align-items: center; display: block;  }
.breadcrumbs ul { display: inline; align-items: center; flex-wrap: wrap; }
.breadcrumbs li { padding: 0.5rem; position: relative; display: inline; align-items: center; flex-wrap: wrap; }
.breadcrumbs ul > li:first-child::before { content:''; display: inline-block; width: 2rem; height: 2rem; --image: url('../img/icons/breadcrumbs.svg');  
		mask: var(--image) center/contain no-repeat; -webkit-mask: var(--image) center/contain no-repeat; background: var(--color-yellow); position: relative; margin-right:  0.75rem;  }
.breadcrumbs li { margin-right: 3rem; }
.breadcrumbs li::after { content:''; display: block; margin:0 1rem; position: absolute; width: 3px; height: 3px; background: #ccc; right: -3rem; top: 50%; }
.breadcrumbs li:last-child::after { display: none; }
.breadcrumbs > span { margin: 0.2rem 0.5rem; }
.breadcrumbs span { color: black; }
.breadcrumbs .divider { display: inline-block; height: 2rem; width: 1rem; color: gray;}
.breadcrumbs a { color: var(--color-black); text-decoration: underline; }

/* Page block */
/* -------------------------------------------------------------------- */
.page-block { padding: var(--block-padding); overflow: hidden; position: relative; color: var(--text-color); background: var(--background-color); --text-color: inherit; --background-color: transparent;}
.page-block > .container { max-width: var(--page-width); margin: 0 auto; position: relative; }

.page-block.-narrow { padding-top: var(--span); padding-bottom: var(--span); }
.page-block.-promo > .container { display: flex; align-items: center; justify-content: center; min-height: 35vh; }

.page-block.-black { --text-color: white; --background-color: black; }

@media screen and (max-width: 960px) {
	.page-block { --block-padding: calc(var(--span) * 3); }
}
@media screen and (max-width: 768px) {
	.page-block { --block-padding: var(--span-large) var(--span); }
	.page-block h2 { text-align: center; }
}

.page-block.-blue { --background-color: linear-gradient(var(--color-blue), #043448); --text-color: white; --heading-color: white; }

/* Блок с внутренними */
.page-block:not(.-inset) { background: var(--background-color); }
.page-block.-inset > .container { background: var(--background-color); color: var(--text-color); padding: var(--span-large); }
@media screen and (max-width: 960px) {
	.page-block.-inset > .container { padding: var(-span-small); }
}

.page-block.-full { padding:0; }
.page-block.-full > .container { max-width: none; }
.page-block.-min-height { min-height: 35rem; display: flex; align-items: center; }
.page-block.-min-height > .container {  flex-grow: 1; }

.block-heading { font-size: 3.8rem; text-align: center; color: var(--heading-color); margin:0 auto; margin-bottom: 1em; max-width: calc(var(--page-width) * 0.7); }
.block-heading + .subheading { text-align: center; font-size: 2rem; font-weight: bold; max-width: 60rem; margin:0 auto; margin-top: -3rem !important; margin-bottom: 4rem; }

@media screen and (max-width: 640px) {
	.block-heading { font-size: 3.2rem; }
}

.block-heading-container { display: inline-flex; font-size: 3.8rem; text-align: center; color: var(--heading-color); margin:0 auto; margin-bottom: 1em; gap: 1rem; }
.block-heading-container h2 { margin: 0; }
.block-heading-container i { width: 4rem; height: 4rem; }
@media screen and (max-width: 640px) {
	.block-heading-container { font-size: 3.2rem; }
}

/* Message box */
/* ----------------------------------------------------- */
.message-box {
	--text-color: var(--color-black); color: var(--text-color); --image: url("../img/icon-message-box-info.png");
	clear: both; position: relative; display: flex; justify-content: flex-start;
  align-items: flex-start; padding: 4rem; padding-left: 12rem;  text-align: left; margin: 3rem 0; flex-flow: column; 
 	min-height: 10rem; border-radius: var(--border-radius); min-height: 100px;
 	border: 2px solid #e0e0e0; 
 	background: linear-gradient(45deg, #00000020, white 5rem);
}
.message-box::after { content:''; display: block; width: 4px; position: absolute; top:-2px; right:-2px; bottom:-2px; background: var(--color-blue); }
.message-box h2 { text-align: left; font-size: 2.4rem; margin-bottom: 1rem; margin-top: 0; }
.message-box a { color: var(--text-color); text-decoration: underline; }
.message-box > * { margin-bottom: 0.5rem;}
.message-box > *:last-child { margin-bottom: 0; }
.message-box::before { content: ''; display: block; position: absolute; top: 50%; bottom: 0; left: 2rem; width: 8rem; height:8rem; transform: translateY(-50%); background: var(--color-blue); mask: var(--image) center / contain no-repeat; -webkit-mask: var(--image) center / contain no-repeat; }
.message-box.-home { --image:url(../img/icon-mb-home.png); }
.message-box.-alert { --image:url(../img/icon-mb-alert.png); }
.message-box.-alert::before { background: var(--color-blue); }
.message-box.-alert::after { background: var(--color-blue); }
.message-box.-center { text-align: center; align-items: center; }
.message-box.-center::before { display:none;  }
.message-box.-with-image { padding-left: 25rem; }
.message-box.-with-image .image { position: absolute; left:0; top:0; height: 100%; width: 20rem; mask: linear-gradient(to left, transparent, white 2rem); }
.message-box.-with-image .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover; }
@media screen and (max-width: 768px) {
	.message-box.-with-image .image { display: none; }
	.message-box.-with-image::before { display: none; }
}

@media screen and (max-width: 768px) {
	.message-box { padding: 2rem !important; }
	.message-box::before { display: none; }
}

/* Pagination */
/* ----------------------------------------------------- */
.pagination { display: flex; margin: 4rem 0; text-align: center; align-items: center; justify-content: center; flex-wrap: wrap; }
.pagination .title { margin-right: 2rem; }
.pagination ul { margin-bottom: 0; margin-left: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; grid-gap: 0.4rem; }
.pagination li a { display: inline-flex; margin: 0.5rem 0.5rem; }
.pagination li.active a { background: var(--color-blue);  color: #ffffff; }
.pagination li { display: inline-flex; list-style-type: none; margin-bottom: 0; margin-left: 0; align-items: center; }
.pagination li:not(.control) a { min-width: 30px; width: 30px; height: 30px; align-items: center; justify-content: center; text-decoration: none; }
.pagination li:hover:not(.active):not(.control) a { background: #dddddd; }


/* F.A.Q */
/* ----------------------------------------------------- */
#faq { position: relative; z-index: 10; overflow: visible; }
#faq.page-block > .container { position: relative; }
#faq.page-block > .container::after { content: ''; position: absolute; right:0; bottom: 0; height: 590px; width: 40%; background: url(../img/faq-bg-woman.png) bottom center / contain no-repeat; filter: drop-shadow(0 0 25px #ffffff50); }
.faq-container { display: grid; grid-template-rows: auto; grid-template-columns: repeat(auto-fit, minmax(500px, 1fr)); justify-content: center;  margin-bottom: 4rem; gap: 2rem; }

.faq-container .faq-item a { text-decoration: none; }
.faq-container .faq-item { background: linear-gradient(210deg, #eee1, transparent 9rem), white; box-shadow: var(--shadow); align-items: center; padding: 1rem 2rem;  gap: 2rem; align-self: stretch; display: flex; align-items: center; justify-content: center; flex-flow: column; position: relative; z-index: 1; }
.faq-container .faq-item .answer { display: none; padding: 2rem; background: white; border-radius: 0 0 1rem 1rem;  z-index: 10;  width: 100%;  z-index: 10; position: absolute; top: 100%; box-shadow: 0 5px 5px 0 #0002; }
.faq-container .faq-item .question { font-weight: normal; width: 100%; display: block;  padding: 2rem 0; padding-right: 7rem; position: relative; font-size: 2rem; color: var(--color-blue); cursor: pointer; z-index: 10; }
.faq-container .faq-item .question::after { content:''; width: 2rem; height:1rem; background: var(--color-blue); mask:url(../img/ui-arrow-down.svg) center / contain no-repeat; -webkit-mask:url(../img/ui-arrow-down.svg) center / contain no-repeat; position: absolute; right: 0; top: 50%; transform:translateY(-50%); }
.faq-container .faq-item .question:hover::after { background: black; }

.faq-container .faq-item:hover { box-shadow: 0 0 10px 0 #00000020; }
.faq-container .faq-item.-active { background: linear-gradient(to top, #0002, transparent 2rem), white; border-left: 4px solid var(--color-blue); position: relative; z-index: 50; }
.faq-container .faq-item.-active .question { font-weight: bold;  }
.faq-container .faq-item.-active .answer { display: block; color: black; border-left: 4px solid var(--color-blue); left: -4px;  width: calc(100% + 4px);}
.faq-container .faq-item.-active .question::after { transform: scaleY(-100%); background: black; }

@media screen and (max-width: 960px) { 
	#faq .ui-split-container .side { display: none;  }
	.faq-container {}
	#faq.page-block > .container::after { display: none; }
}

@media screen and (max-width: 640px) { 
	.faq-container { display: flex; flex-wrap: wrap; }
	.faq-container .faq-item { padding: 0rem; width: 100%; }
	.faq-container .faq-item .question::after { right: 2rem; width: 2rem; }
	.faq-container .faq-item .question { font-size: inherit; padding: 2rem; padding-right: 5rem; }
	.faq-container .faq-item .answer { padding: 2rem; }
}

/* Social icons */
/* ----------------------------------------------------- */
.social-icons { white-space: nowrap; display: flex; align-items: center; gap: 1rem 1.5rem;}
.social-icons a { width: 3rem; height: 3rem; background: #dfdfdf80; position: relative; display: inline-flex; justify-content: center; align-items: center; transition: .3s all; }
.social-icons a i { background: black; transition: 0.3s; }
.social-icons a.telegram:hover i { background: var(--color-blue); }
.social-icons a.whatsapp:hover i { background: #29b415; }
.social-icons a.vk:hover i { background: #266298; }


.social-icons-line { white-space: nowrap; display: block; align-items: center; gap: 1rem 1.5rem;}
.social-icons-line .icon { width: 4rem; height: 4rem; background: #dfdfdf80; position: relative; display: inline-flex; justify-content: center; align-items: center; transition: .3s all; }
.social-icons-line .icon i { background: black; transition: 0.3s; }
.social-icons-line a { display: flex; align-items: center; gap: 1rem; }
.social-icons-line a.telegram:hover i { background: var(--color-blue); }
.social-icons-line a.whatsapp:hover i { background: #29b415; }
.social-icons-line a.vk:hover i { background: #266298; }



/* Tippy */
/* ----------------------------------------------------- */
.button-up {transition: opacity .3s ease;opacity: 0.6;background-color: #e0e0e0; height: 55px;width: 55px;bottom: 30px;right: 30px;cursor: pointer;display: none;position: fixed;z-index: 999; color: #fff;align-items: flex-end;justify-content: center;border-radius: 35px;  user-select: none;}
.button-up:before { content: "";position: absolute;top: 40%;width: 40%;height: 40%;border-left: 3px solid black;border-top: 3px solid black;transform: rotate(45deg); left: 27%;}
.button-up:hover {opacity: 1;}

/* Lists */
/* ----------------------------------------------------- */
.article ul li, .ui-list li { margin-bottom: 0.5rem; }
.article ul, .ui-list { list-style-type: disc; margin-left: 1rem; list-style-type: disc; list-style-position: inside; margin-bottom: 2rem; overflow: hidden; }
.article ol { list-style-type: decimal; margin-left: 1rem;  list-style-position: inside; margin-bottom: 2rem; overflow: hidden; }
.article a { color: var(--link-color); }
.article ul > li:marker,
.ui-list > li::marker { color: black; }


.ui-list.-columns {  display:grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.5rem 2rem;  grid-gap: 0.5rem 2rem; color: var(--color-blue); }

.ui-list.-split { columns: 2; column-gap: 4rem;}
.ui-list.-split li { }
@media screen and (max-width: 768x) { 
 .ui-list.-split { columns: 1}
}

/* Magnific popup */
/* ----------------------------------------------------- */
.mfp-content { --text-color: black; --heading-color: var(--color-blue); color: black; padding: 4rem; overflow:hidden; background: white; display: inline-block; width: auto; max-width: 700px; z-index: 52; }
.mfp-bg { z-index: 49;}
.mfp-wrap { z-index: 50; }
.mfp-content .ui-form { padding: 0; box-shadow: none; }
.mfp-content input, .mfp-content select, .mfp-content textarea { background: #f0f0f0; }
.mfp-content .form-buttons { display: flex; align-items: center; justify-content: center; margin-bottom: 0; margin-top: 1rem; }
.mfp-content .vcap-input > label { font-weight: normal; }
.mfp-content .vcap-input > label a:hover { text-decoration: none; }
.mfp-content h2 { color: var(--color-blue); text-align: center; font-size: 2.5rem; }
.mfp-close { border-radius: 50%; width: 3.5rem; height: 3.5rem; right: 1rem; top: 1rem; line-height: 0; }
.mfp-close:hover, .mfp-close:focus { color: white; }

/* Tippy */
/* ----------------------------------------------------- */
.tippy-content { font-size: 1.5rem; padding: 2rem; }
.tippy-box { background: #ffffffe0; color: black; border-radius: 1rem; }
.tippy-arrow  { color: #ffffffe0;}

.articles-list > *:not(:last-child) { margin-bottom: var(--span); }
                                
#content { padding-top: var(--span-large); }
#content > .container { display: grid; margin:0 auto; grid-template-columns: 325px auto; gap: var(--span); }
@media screen and (max-width: 960px) {
	#content > .container	{ display: block; }
	#side { display: none; }
}

.up-button { transition: opacity .3s ease; opacity: 0.6; height: 55px;width: 55px; bottom: 3rem; right: 3rem; background: #276e92; cursor: pointer; display: none; position: fixed; z-index: 999; align-items: flex-end; justify-content: center; border-radius: 35px; user-select: none; }
.up-button:before { content: ""; position: absolute; top: 60%; left: 50%; width: 40%; height: 40%; border-left: 3px solid white; border-top: 3px solid white; transform: translate(-50%,-50%) rotate(45deg); }
.up-button:hover {opacity: 1;}


.ui-link { font-size: 1.5rem; color: var(--text-color); display: inline-flex; align-items: center; gap: 0.5rem; }
.ui-link i { background: var(--color-blue); width: 2rem; height: 2rem; content: ''; display: inline-block; text-decoration: none; }

/* Teasers */
/* ----------------------------------------------------- */
.ui-teaser-small { display: flex; align-items: center; }
.ui-teaser-small .image { width: 5rem; height: 5rem; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.ui-teaser-small .image i { width: 4rem; height: 4rem; }
.ui-teaser-small .content { margin-left: 1rem; flex-grow: 1; }

.ui-teaser-mini { display: flex; align-items: center;  min-height: 6rem; }
.ui-teaser-mini .image { width: 6rem; height: 100%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--color-yellow); }
.ui-teaser-mini .image i { width: 4rem; height: 4rem; background: black; }
.ui-teaser-mini .content { padding: 0.5rem 1em; flex-grow: 1; line-height: 1.1; text-transform: uppercase; font-size: 1.5rem; font-weight: bold;  }

.title-bar { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 2rem; }
.title-bar > * { flex-shrink:0; }
.title-bar h2 { flex-grow: 1; margin: 0; }

@media screen and (max-width: 960px) {
	.title-bar { justify-content: center; }
}

/* Gallery */
/* ----------------------------------------------------- */
.gallery-item-card { display: block; position: relative; border: 3px solid white; box-shadow: 0 0 5px 0 #00000030; }
.gallery-item-card a { display: block; padding-top: 75%; position: relative; }
.gallery-item-card img { display: block; position: absolute; top:0; left:0; width: 100%; height: 100%; object-fit: cover; }

/* Certificate */
/* ----------------------------------------------------- */
.certificate-card { padding-top: 138%; background: white; border: 3px solid #eee; position: relative; }
.certificate-card .image { position: absolute; left: 1rem; top: 1rem; bottom: 1rem; right: 1rem; display: block; background: #f0f0f0; }
.certificate-card .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }

/* Advantage */
/* ----------------------------------------------------- */
.advantage-card { background: var(--color-yellow); display: flex; flex-direction: column; padding: 2rem; text-align: center; }
.advantage-card .image { width: 100%; padding-top: 85%; position: relative; }
.advantage-card .image i { position: absolute; width: 80%; height: 60%; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: contain; }
.advantage-card .content { font-size: 1.5rem; line-height: 1.2; } 

@media screen and (max-width: 960px) {
	.advantage-card { flex-direction: row; text-align: left; align-items: center; padding: 1rem; }
	.advantage-card  .image { flex-basis: 8rem; width: 8rem; height: 8rem; padding-top: 0; flex-shrink: 0; }
}


/* Category */
/* ----------------------------------------------------- */
.category-card { position: relative; background: #f7f7f7}
.category-card .heading { background: linear-gradient(210deg, #f4f4f4, transparent 30rem), #f1f1f1; display: flex; align-items: center; transition: .3s; padding: 1rem; gap: 1rem; align-items: center; }
.category-card .heading i[data-icon] { --image: url(../img/icons/chemistry.png); }
.category-card .heading i { background: var(--color-blue); width: 4rem; height: 4rem; flex-shrink: 0; }
.category-card .heading .title { font-size: 1.8rem; color: black; font-weight: bold; }

.category-card .content { padding: 2rem; font-size: 1.5rem; }
.category-card .content a { color: black;  position: relative; word-break: break-word; opacity: 0.8; }
.category-card .content span { margin-right: 0.5rem; }
.category-card .content a:hover { color: var(--color-blue); }


.category-article .catalog-categories { margin: 2rem 0 ; }

.catalog-categories .categories-small-list { margin-top: 1rem; gap: 1rem; }
.catalog-categories .category-small-card:nth-child(n + 8) { display: none; }
.catalog-categories.-open .category-small-card:nth-child(n + 8) { display: flex; }

.category-small-card { position: relative; background: #f7f7f7; transition: .3s; background: #f2f2f2; display: flex; align-items: center; justify-content: left; }
.category-small-card .heading {  display: flex; align-items: center; transition: .3s; padding: 1rem; gap: 1rem;  }
.category-small-card i { background: var(--color-blue); width: 3rem; height: 3rem; flex-shrink: 0; --image: url(../img/icons/chemistry.png); transition: .3s; }
.category-small-card .title { font-size: 1.5rem; color: black; font-weight: bold; line-height: 1.1; transition: .3s; }
.category-small-card:hover { background: var(--color-blue); }
.category-small-card:hover .title { color: white; }
.category-small-card:hover i { background: white; }

.category-more-card { position: relative; background: #f7f7f7; transition: .3s; background: linear-gradient(to right, #ffa00c50, transparent 4rem), #f2f2f2; display: flex; align-items: center; justify-content: center; border-left: 5px solid var(--color-yellow); cursor: pointer; transition: .3s; }
.category-more-card .heading {  display: flex; align-items: center; transition: .3s; padding: 1rem; gap: 1rem;  }
.category-more-card i { background: black; width: 3rem; height: 3rem; flex-shrink: 0; }
.category-more-card .title { font-size: 1.5rem; color: black; font-weight: bold; line-height: 1.1; transition: .3s; }

.catalog-categories.-open .category-more-card { background: var(--color-yellow); border-left-color: black; }
.catalog-categories.-open .category-more-card i { transform: scaleX(-100%); }
                              




/* Product */
/* ----------------------------------------------------- */
.product-card { background: white; text-decoration: none; color: black; border: 3px solid var(--color-yellow);  transition: .3s; display: flex; flex-direction: column; position: relative; padding-bottom: 7rem; }
.product-card .image { padding-top: 65%; position: relative; overflow: hidden; } 
.product-card .image img { position: absolute; left: 50%; top: 50%; width: 90%; height: 90%;  object-fit: contain;  transform: translate(-50%, -50%); }
.product-card .content { padding: 2rem; text-align: center; transition: .3s; flex-grow: 1; }
.product-card .title a { text-decoration: none; text-overflow: ellipsis; overflow: hidden; }
.product-card .title { text-transform: uppercase; color: var(--color-black); font-weight: bold;  display: flex; align-items: center; justify-content: center; transition: .3s; min-height:3em; font-weight: bold; line-height: 1.2;  font-size: 1.5rem; }
.product-card .description { font-size: 1.4rem; opacity: 0.8; }
.product-card .price { font-size: 2rem; margin-top: 2rem; display: inline-flex; align-items: center; gap: 1rem; justify-content: center; color: #444; }
.product-card .price strong { color: bold; color: var(--color-blue); display: inline-block; padding: 0.5rem; background: var(--color-light-gray); font-size: 2.4rem; }
.product-card .price.-empty { font-size: 2.2rem; font-style: italic; }
.product-card .price.-available { font-size: 2.2rem; padding: 0.5rem 2rem; }
.product-card .nds { opacity: 0.7; font-size: 2rem; }
.product-card .price-state { padding: 0.5rem 1rem; background: #f0f0f0; display: inline-block; }
.product-card .options { margin-top: 1rem; }
.product-card .price-state.-is-ordering { background: var(--color-blue); color: white;  }
.product-card .more-button { position: absolute; left: 0; right: 0; bottom: 0; justify-content: center; }
	.product-card:hover { text-decoration: none; border-color: var(--color-blue); }
	.product-card:hover .title { color: var(--color-blue);  }
	.product-card:hover .price strong { color: var(--color-blue); }
	.product-card:hover .more-button { background: var(--color-blue) !important; color: white !important; }
	.product-card:hover .more-button i { background: white; }

.product-card.-is-ordering { border-color: #ccc; }
.product-card.-is-ordering .ui-button:not(:hover) { background: #eee;  }



/* Product variant */
/* ----------------------------------------------------- */
.product-variant-card { border: 1px solid #e0e0e0; display: flex; align-items: center; align-items: stretch; transition: .3s; flex-wrap: wrap; margin-bottom: 2rem; }
.product-variant-card .image { height: 100%; min-height: 11rem; flex-shrink:0; flex-basis: 13rem; background: white; border-left: 5px solid var(--color-blue); position: relative; }
.product-variant-card .image::after { content: ''; position: absolute; left: 0; top:0; width: 100%; height: 100%; background: linear-gradient(to left, #0001, transparent 10rem); }
.product-variant-card .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: contain;}
.product-variant-card .properties { padding: 1rem 2rem; border-right: 1px solid #e0e0e0; flex-basis:30rem; display: flex; align-items: center; flex-wrap: wrap; align-content: center; flex-grow: 1; }
.product-variant-card .properties .title { font-weight: bold; }
.product-variant-card .properties > * { flex-basis: 100%; }
.product-variant-card .price { font-size: 1.6rem; padding: 1rem 2rem; display: flex; align-items: center; justify-content: center; flex-grow: 1;  gap: 1rem; flex-basis: 10rem; }
.product-variant-card .price .value { font-size: 4rem; font-weight: bold; color: var(--color-blue); }
.product-variant-card .buttons { padding: 1rem 2rem; display: flex; align-items: center; justify-content: right; gap: 1rem; }
	.product-variant-card:hover { border-color: #aaa; background: linear-gradient(210deg, #ffc21250, transparent 10rem), white}


@media screen and (max-width: 960px) {
	.product-variant-card .image { flex-grow: 1; }
	.product-variant-card .buttons { border-top:1px solid #e0e0e0; flex-grow: 1; justify-content: center; flex-wrap: wrap; }
}

@media screen and (max-width: 640px) {
	.product-variant-card .properties { text-align: center; }
	.product-variant-card .buttons button { flex-grow: 1; }
}



/* Product table */
/* ----------------------------------------------------- */
.product-table-card { border: 1px solid #e0e0e0; display: flex; align-items: center; align-items: stretch; transition: .3s; font-size: 1.5rem;}
.product-table-card:not(:last-child) { border-bottom: none; }
.product-table-card .image {  flex-shrink:0; flex-basis: 10rem; background: #f4f4f4;  position: relative; aling-self: stretch; }
.product-table-card .title { font-weight: bold; margin-bottom: 0.5rem;}
.product-table-card .image img { position: absolute; left:50%; top:50%; width: 80%; height: 80%; object-fit: contain; transform: translate(-50%,-50%); }
.product-table-card .properties { padding: 1rem 2rem; border-right: 1px solid #e0e0e0; display: flex; align-items: center; flex-wrap: wrap; align-content: center; flex-grow: 1; flex-basis: 70%;}
.product-table-card .properties > * { flex-basis: 100%; }

.product-table-card .info { display: flex; flex-wrap: wrap; align-items: center; padding: 1rem; gap: 1rem; flex-basis: 46rem;}
.product-table-card .price { font-size: 1.5rem;  display: flex; align-items: center; justify-content: center;  gap: 1rem; flex-basis:20rem; flex-shrink: 0; width: 20rem;}
.product-table-card .price .value { font-size: 3rem; font-weight: normal; }
.product-table-card .buttons {  display: flex; align-items: center; justify-content: right; gap: 1rem; flex-shrink: 0; }

@media screen and (max-width: 960px) {
	.product-table-card .properties { padding-bottom: 0; border: none;}
	.product-table-card { flex-wrap: wrap; text-align: center; }
	.product-table-card .info { flex-basis: 30%; }
	.product-table-card .info > * { flex-grow: 1; justify-content: center; }
	.product-table-card .image { display: none;}
	.product-table-card { justify-content: center; }
}


/* News */
/* ----------------------------------------------------- */
.news-card { background: white; border: 3px solid var(--color-yellow);  display: flex; transition: .3s; }
.news-card .content { position: relative; padding-bottom: 5rem; }
.news-card .content .top { padding: 4rem; }
.news-card .image { flex-basis: 40%; max-width: 30rem;  flex-shrink:0; height: 100%; background: #666; position: relative; }
.news-card .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover; }
.news-card .date { display: inline-block; margin-bottom: 1rem; font-size: 1.4rem; }
.news-card .title { font-weight: bold; text-transform: uppercase; margin-bottom: 1rem; font-size: 2rem; font-family: var(--font-heading); }
.news-card .more-button { margin-top: 2rem; background: var(--color-yellow); padding: 1.5rem 4rem; position: absolute; bottom: 0; left:0; right: 0; text-decoration: none; color: black; display: flex; gap: 1rem; align-items: center; transition: .3s; }
.news-card .more-button i { width: 2.5rem; height: 2.5rem; transition: .3s; }

	.news-card:hover { border-color: var(--color-blue); }
	.news-card:hover .more-button {  background: var(--color-blue); color: white; }
	.news-card:hover .more-button i { background: white; }

@media screen and (max-width: 960px) {
	.news-card { display: block; }
	.news-card .image { width: 100%; max-width: none; padding-top: 50%; height: auto; }
	.news-card .content { padding-bottom: 5rem; }
	.news-card .content .top { padding: 2rem; }
}

/* Article */
/* ----------------------------------------------------- */
.article-card { background: #f6f6f6; display: grid; grid-template-columns: 20rem auto; font-size: 1.5rem; }
.article-card .content { padding: 4rem; }
.article-card .image { width: 20rem; flex-shrink:0; height: 100%; background: #666; position: relative; }
.article-card .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover; }
.article-card .title { color: var(--color-blue); font-weight: bold; text-transform: uppercase; margin-bottom: 1rem; }
.article-card .ui-link { margin-top: 1rem;}

/* Article list */
/* ----------------------------------------------------- */
.article-list-card { display: flex; gap: 2rem; align-items: center; flex-wrap: wrap; }
.article-list-card .image { flex-basis: 30rem; position: relative;  }
.article-list-card .image img { width: 100%; height: auto; }
.article-list-card .content { flex-basis: 30rem; flex-grow: 1; }
.article-list-card .ui-button { margin-top: 1rem; }
.article-list-card .text { margin-bottom: 1rem; }
.article-list-card h2 { font-size: 2.5rem; }
.article-list-card h2 a { text-decoration: none; }

@media screen and (max-width: 960px) {
	.article-list-card .image { flex-basis: 100%; }
	.article-list-card .content { text-align: center; }
}


/* Partners */
/* ----------------------------------------------------- */
.partner-card { background: var(--color-light-gray);  border: 3px solid transparent; transition: .3s; }
.partner-card .image { width: 100%; padding-top: 35%; position: relative; }
.partner-card .image img { position: absolute; left: 50%; top: 50%; width: 80%; height: 80%; object-fit: contain; transform: translate(-50%, -50%); }
	.partner-card:hover { border-color: var(--color-blue); }


/* Cities selector */
/* ----------------------------------------------------- */
/* ============================================================== */
.cities-list { background: linear-gradient(to top, #0001, transparent 5rem), var(--color-light-gray); color: black; position: fixed; left:0; top:0; width: 100%; z-index: 100; display: none; opacity: 0;  box-shadow: var(--shadow); font-weight: normal; }
.cities-list-inner { position: relative; max-height: 60rem; overflow: auto; padding: 4rem; }
.cities-list .container { max-width: var(--page-width); margin:0 auto;  position: relative; }
.cities-list .cities-container {  width: 100%; text-align: left; }
.cities-list .city { display: inline-block; clear: both; color: var(--color-blue); background: white; padding: 0.5rem 1rem; transition: .3s; }
.cities-list .city:hover { background: var(--color-blue); color: white; text-decoration: none; }
.cities-list .city.-active { border-left:5px solid white; font-weight: bold; padding-left: 10px;  background: var(--color-yellow); border-color: var(--color-yellow); text-decoration: underline; color: black; text-decoration: none; }
.cities-list a { display: inline-block; padding: 0.3rem 0.5rem; font-size: 1.5rem; color: var(--color-black);}
.cities-list a:hover { color: black; }
.cities-list h2 { text-align: left; color: black; font-size: 3rem; margin-bottom: 3rem; font-weight: normal; }
.cities-list .cities-group .cities { display: grid; gap: 1rem 2rem; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); }
.cities-list .cities-group .cities.-important { margin-bottom: 2rem; }
.cities-list .cities-group:not(:last-child) { margin-bottom: 2rem; border-bottom: 1px dashed #775132a3; padding-bottom: 2rem; }
.cities-list .cities-heading { font-weight: bold; font-size: 2rem; margin-bottom: 1rem; font-family: var(--font-heading); }
.cities-list .cities-heading.-secondary { }
.cities-list .close-button { position: absolute; top:2rem; right:2rem; width: 2rem; height: 2rem;	-webkit-mask: url(../img/icons/close.svg) center/contain no-repeat; mask: url(../img/icons/close.svg) center/contain no-repeat; background: black; cursor: pointer; }
.cities-list .close-button:hover { background: var(--color-red); }

#cities-list { font-size: 1.5rem; }
#cities-list a { display: inline-block; padding: 0.5rem; }
#cities-list a:hover { background: var(--color-red); color: white; }

/* Header block */
/* ===================================================== */
#header { overflow: visible; position: relative; z-index: 4; }
.template-id-2 #header { padding-bottom: 0; }
#header > .container { display: flex; align-items: center; gap: 1rem 2rem; flex-wrap: wrap; justify-content: center; }

#header .logo { display: flex; gap: 1rem; align-items: center; flex-shrink: 0; }
#header .site-logo { width: 7rem; background: url(../img/site-logo.png) center/contain no-repeat; height: 7rem; }
#header .slogan .bottom { font-size: 1.3rem; }
#header .span { flex-grow: 1; }
#header .social-icons {  justify-content: center; }
#header .social-container-outer { flex-grow: 1; justify-content: center; display: flex; }
#header .social-container { justify-content: center; display: flex; flex-basis: 20rem; flex-wrap: wrap; gap: 0.5rem 1.5rem; align-items: center; justify-content: start; }

#header .search { flex-grow: 1; display: flex; }
#header .search form { display: flex; align-items: center;  flex-basis: 100%; position: relative; }
#header .search input { min-height:4rem; height: 5rem; flex-basis: 100%; background: #f9f9f9; border-left: 1px solid #aaa; border-right: 1px solid #aaa; }
#header .search button { min-height:4rem; height: 4rem; width: 4rem; padding: 0; background: transparent; position: absolute; right:0.5rem; top: 50%; transform: translate(0,-50%);  }
#header .search button i { background: black; }

#header .phones { display: flex; flex-flow: column; align-items: end; gap: 1rem; line-height: 1; justify-content: center; flex-wrap: wrap !important;  }
#header .phone { margin-bottom: 0; display: flex; align-items: center; gap: 1rem; white-space: nowrap; font-family: var(--font-heading); color: #ccc; font-size: 2rem;  }
#header .phone a { text-decoration: none; }
#header .phone strong { color: black; }
#header .callback-button { height: 4rem; padding: 1rem 2.7rem; }

#header .cities-selector { display: flex; align-items: center; gap: 1rem; flex-grow: 0; justify-content: center; font-size: 1.5rem; }
#header .cities-selector .title { font-weight: bold;  }
#header .cities-selector .city { text-decoration: underline; cursor: pointer; display: flex; align-items: center; gap: 0.5rem; } 
#header .cities-selector .city  i { width: 1rem; height: 1rem; }
#header .cities-selector .city:hover {  text-decoration: none; color: var(--color-blue); }
#header .cities-selector .city:hover i { background: var(--color-blue); }

#header .contacts  { flex-basis:36rem; }
#header .contacts span { color: #666; }

#header .contacts-item { font-size: 1.5rem; display: flex; gap: 1rem; align-items: center; margin-bottom: 0.5rem;}
#header .contacts-item a { text-decoration: underline; }
#header .contacts-item a:hover { color: var(--color-blue); }
#header .contacts-item i { background: #e0e0e0; width: 2rem; height: 2rem; flex-shrink: 0; }

#header .email a { color: black; font-size: 1.5rem; flex-shrink: 0;  }

#header .navigation { flex-basis: 100%; display: flex; align-items: center; gap: 1rem 2rem; justify-content: center; flex-wrap: wrap; }

#header .main-menu {  flex-basis: 76rem; flex-shrink: 0;}
#header .main-menu { display: inline-flex; justify-content: start; font-size: 1.7rem; position: relative;  width: 100%; font-family: var(--font-heading); }
#header .main-menu > li { position: relative; display: flex; align-items: center; z-index: auto; flex-grow: 1; background: var(--color-white); color: var(--color-black); }
#header .main-menu > li::after { content: ''; display: block; position: absolute; right: 0; width: 1px; top: 0; bottom: 0; background: linear-gradient(transparent, #eee 50%); }
#header .main-menu a { display: inline-flex; transition: all .3s; align-items: center; width: 100%; text-align: center; justify-content: center; color: black; text-decoration: none; font-weight: bold;  white-space: nowrap; padding: 0 0.5rem;  }
#header .main-menu > li > ul { display: none; position: absolute; left:0; top:99%; background: white; font-size: 1.4rem; min-width: 25rem; z-index: 10; border:1px solid #e0e0e0;}
#header .main-menu > li > ul li a { padding: 1rem; display: block; text-align: left; padding-left: 2rem; border-bottom:1px solid #e0e0e0; }
#header .main-menu > li:hover ul { display: block; }
#header .main-menu > li.active > a {  background: linear-gradient(var(--color-yellow) 50%, white); }
#header .main-menu > li:hover > a { background: linear-gradient(var(--color-blue) 50%, white); color: white; }
#header .main-menu > li > a { padding: 1rem 2rem; height: 5rem; }
#header .main-menu ul li > a:hover { background: var(--color-blue); color: white; }

@media screen and (max-width: 960px) {
	#header .main-menu { justify-content: center; border-left: none; display: none; }
	#header .main-menu { flex-wrap: wrap; }
	#header .main-menu > li { flex-grow: 0; }
	#header .social-icons { flex-grow: 0;}
}


@media screen and (max-width: 1280px) {
	#header .span { display: none; }
}

@media screen and (max-width: 1024px) {
	#header .search { flex-basis: 100%; }
}

@media screen and (max-width: 960px) {
	#header .search { flex-basis: auto; flex-grow: 0; }
	#header .phones { flex-flow: row; }
	#header .contacts { display: none; }
	#header .site-logo { height: 6rem; }
	#header .cities-selector { font-size: 90%; }
}

@media screen and (max-width: 768px) {
	#header .navigation { display: none; }
	#header .social-container > * { flex-basis: 100%; }
}







#cities-list.page-block { background: url(../img/cities-list-bg.jpg) center/cover no-repeat; }
#cities-list { font-size: 1.5rem; }
#cities-list a { display: inline-block; padding: 0.5rem; }
#cities-list .ui-container { gap: 0 2rem; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
#cities-list a:hover { background: var(--color-blue); color: white; }


/* Slider block */
/* ===================================================== */
#slider { background: #eaeaea;  overflow: hidden; }
#slider > .container { padding-top: 38%; position: relative; }

#slider .ui-slider { position: absolute; left:0; top: 0; width: 100%; height: 100%; margin: 0 !important}
#slider .slick-track::before, #slider .slick-track::after { display: none; }
#slider .slick-track { width: 100% !important; }
#slider .slick-slide { display: block; width: 100%; height: 100%; }

#slider .slide { width: 100% !important; height: 100%; position: relative; margin:0 !important; padding: 0 var(--block-padding); }
#slider .slide > .image { display: block; position: absolute; left:0; top:0; width: 100%; height: 100%;  z-index:0; }
#slider .slide > .image img { width: 100%; height: 100%; object-fit: cover; }
#slider .slide .content-wrapper { margin:0 auto; max-width: var(--page-width); height: 100%; display: flex; align-items: center; position: relative; z-index: 1; justify-content: end;  }
#slider .slide .content-wrapper > .content { max-width: 35%; font-size: 1.6rem; }
#slider .slide .content h1 { color: black; font-size: 3.5rem; font-weight: bold; margin-bottom: 1rem; }
#slider .slide .content h1 span { display: block; }
#slider .slide .content-top { display: flex; gap: 2rem 3rem; align-items: center; }
#slider .slide .spark img { height: 26rem; width: auto; }
                           
#slider.-narrow > .container { padding-top: 30%; }

#slider .teasers-container { display: grid; gap: 2rem; grid-template-rows: auto; grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr)); margin-top: 3rem; }
#slider .ui-teaser-small { font-weight:bold; ; text-transform: uppercase; font-size: 1.4rem;  border-right:1px solid #d0d0d0; }
#slider .ui-teaser-small .image i { background: var(--color-blue); }
#slider .ui-teaser-small .content { padding-right: 2rem;  }

@media screen and (max-width: 1024px) {
	#slider > .container { padding-top: 50%; }
	#slider.-narrow > .container { padding-top: 30%; }
	#slider.-narrow .slide > .image { filter: none;}

	#slider .slide .content-wrapper > .content { max-width: none; }	
	#slider .slide > .image { filter: blur(10px); }
}

@media screen and (max-width: 960px) {
	#slider .teasers-container { display: none; }
	#slider .slide .content-wrapper > .content { text-align: center; }
	#slider .slide .content h1 { font-size: 2.5rem; }
	#slider > .container { padding-top: 70%; }
}

@media screen and (max-width: 640px) {
	#slider .slide .content h1 { font-size: 2rem; } 
	#-slider { display: none; }
}

/* About block */
/* ===================================================== */
#about { background: #f7f7f7; position: relative; }
#about .bg { position: absolute; left: 0; top: 0; bottom: 0; width: 54%; --mask: linear-gradient(to left, transparent, white 30%); mask: var(--mask); -webkit-mask: var(--mask); 
	background: url(../img/bg-about.jpg) right center/ cover; }
#about > .container { display: flex; gap: 4rem; align-items: center; flex-wrap: wrap; }
#about > .container > * { flex-grow: 1; flex-basis: 35rem; }
#about .ui-teasers-container { margin-top: 4rem; }
#about .ui-teaser-mini { background: white; flex-basis: 20rem; }

.index-top-wrapper { background: url(../img/bg-index-top-wrapper.jpg) right bottom no-repeat; }
.index-top-wrapper #search { padding-top: 0; }


@media screen and (max-width: 1200px) {
	#about > .container > .span { flex-basis: 10rem; }
}	

@media screen and (max-width: 960px) {
	#about .bg { display: none; }
}



/* Search block */
/* ===================================================== */
#search .search { display: flex; align-items: center; background: var(--color-light-gray); border-left: 7px solid var(--color-yellow); flex-wrap: wrap; }
#search .search > * { flex-basis: 30rem; flex-grow: 1; }
#search .search .content { padding: 1.5rem 4rem; }
#search .search h2 { font-size: 2.2rem; margin-bottom: 0.5rem; }
#search form { display: flex; align-items: center; background: white; align-self: stretch; padding-left: 6rem; clip-path: polygon(4rem 0, 100% 0, 100% 100%, 0 100%); }
#search form input[type="text"] { background: transparent; border: none !important; flex-grow: 1; box-shadow: none !important; font-size: 1.6rem;  }
#search form .ui-button { height: 100%; width: 13rem; clip-path: polygon(4rem 0, 100% 0, 100% 100%, 0 100%); }
#search form .ui-button i { width: 2.5rem; height: 2.5rem; position: relative; left: 1rem; }

@media screen and (max-width: 960px) {
	#search form { clip-path: none; padding: 0; }
	#search form .ui-button { width: 9rem; }
}

/* Catalog categories block */
/* ===================================================== */
#catalog-categories { }

/* Catalog categories block */
/* ===================================================== */
#catalog-categories-compact { background: url(../img/bg-catalog-categories-compact.jpg) center/cover no-repeat, #f4f4f4; }

/* Catalog popular block (index page) */
/* ===================================================== */
#catalog-popular { }


/* Similar products block */
/* ===================================================== */
#product-similar { }


/* Delivery block (index page) */
/* ===================================================== */
#delivery-index { background: linear-gradient(white, transparent 10%), linear-gradient(to top, #0001, transparent 5rem), url(../img/bg-delivery-index.jpg) center bottom / 120vw auto no-repeat; position: relative; }
#delivery-index > .container { display: flex; min-height: 55vh; align-items: center; }
#delivery-index .content { width: 40%; }
#delivery-index .content .ui-button { margin-top: 1rem; }
#delivery-index h2 { margin-bottom: 2rem; }

@media screen and (max-width: 1024px) {
	#delivery-index .content { width: auto; } 
}

@media screen and (max-width: 960px) {
	#delivery-index {  background-size: auto; background-position-x: 30%; }
}

/* Delivery block (index page) */
/* ===================================================== */
#delivery { background: linear-gradient(white, transparent 10%), linear-gradient(to top, #0001, transparent 5rem), url(../img/bg-delivery-index.jpg) center bottom / 120vw auto no-repeat; position: relative; }
#delivery > .container { display: flex; min-height: 55vh; align-items: center; }
#delivery .content { width: 40%; }
#delivery .content .ui-button { margin-top: 1rem; }
#delivery h2 { margin-bottom: 2rem; }

@media screen and (max-width: 1024px) {
	#delivery .content { width: auto; } 
}

@media screen and (max-width: 960px) {
	#delivery-index {  background-size: auto; background-position-x: 30%; }
}

/* Article block */
/* ===================================================== */
#article { padding-bottom: 4rem; padding-top: 2rem; overflow: visible;  }
.article-wrapper { background: linear-gradient(#00000008, transparent 5rem); }

/* Article block (products) */
/* ===================================================== */
#article.product { }
#article.product .sub-title { margin-top: -2rem; font-style: italic; margin-bottom: 2rem; font-size: 2rem; }

/* Info block */
/* ===================================================== */






/* Contacts block */
/* ===================================================== */
#contacts { background: url(../img/bg-contacts.jpg) center/cover no-repeat, #aaa; padding: 0; }
#contacts > .container { display: flex; justify-content: center; }
#contacts .content { flex-basis: 60rem; padding: 4rem; background: linear-gradient(#edf5f9, white 10rem); align-self: stretch; display: flex; align-items: center; flex-wrap: wrap; align-content: center; justify-content: center; text-align: center; }
#contacts .content .top { opacity: 0.8; margin-bottom: 2rem; font-style: italic; }
#contacts .form { width: 100%; }
#contacts .vcap-input { justify-content: center; }
#contacts { --input-color: #f5f5f5; }

@media screen and (max-width: 1024px) {
	#contacts > .container { flex-wrap: wrap; gap: 0; flex-flow: wrap-reverse;}
	#contacts .content { border: 1px solid #e0e0e0; border-bottom: none; }
	#contacts > .container > * { flex-basis: 100%; }
}


/* Map block */
/* ===================================================== */
#map { background: #f0f0f0; position: relative; border-bottom: 6px solid var(--color-yellow); padding-top: 2rem; }
#map > .container { display: flex;  min-height: 50vh;  pointer-events: none; }
#map .map { position: absolute; left:0; top:0; width: 100%; height: 100%; }
#map iframe { position: absolute; left:0; top:0; width: 100%; height: 100%; }
#map .map *[class*="ground-pane"] { filter: grayscale(100%); }
#map .content {  width: 100%; text-align: center; }
#map .block-heading-container { background: linear-gradient(white, white, #fff5); padding: 1rem 4rem;  display: inline-flex; align-items: center; gap: 1rem; }

@media screen and (max-width: 640px) {
	#map .address i { display: none; }
}

/* Footer block */
/* ===================================================== */
#footer { }

#footer a { text-decoration: none; }
#footer i { width: 3rem; height: 3rem; }

#footer .footer-top { display: flex; align-items: center; flex-wrap: wrap; gap: 2rem 4rem; margin-top: 4rem; justify-content: center; }
#footer .footer-bottom { display: flex; align-items: center; flex-wrap: wrap; gap: 2rem 4rem; margin-top: 4rem;  justify-content: center; }

#footer .bottom-menu { display: flex; flex-wrap: wrap; margin:0 auto;  justify-content: center; }
#footer .bottom-menu li { background: #fff2; transition: .3s; color: white ;}
	#footer .bottom-menu li:hover { background: white; color: black; }
	#footer .bottom-menu li.active { background: var(--color-yellow); }
	#footer .bottom-menu li.active a { color: var(--color-black); }
#footer .bottom-menu a { display: block; text-decoration: none; font-size: 1.6rem; padding: 1.3rem 2.5rem; text-align: center; }


#footer .contacts-item { display: flex; align-items: center; gap: 1rem; }
#footer .contacts-item .icon { background: #fff2; width: 5rem; height: 5rem; display: flex; align-items: center; justify-content: center; }
#footer .contacts-item .icon i { background: white;  }

#footer .phone { font-size: 3rem; font-family: var(--font-heading); display: flex; gap: 1rem; align-items: center; }
#footer .phone .icon { background: var(--color-yellow); width: 5rem; height: 5rem; background: var(--color-yellow); display: flex; align-items: center; justify-content: center; }

#footer .contacts { display: flex; gap: 1rem 2rem; flex-wrap: wrap; flex-grow: 1; justify-content: center; align-items: center; }
#footer .social-icons a { width: 5rem; height: 5rem; background: #ffffffda; transition: .3s;}
#footer .social-icons a i { background: black; width: 3rem; height: 3rem; }
#footer .social-icons a:hover { background: var(--color-yellow); }

#footer .site-logo { flex-basis: 8rem; width: 8rem; flex-shrink: 0; height: 8rem; background: url(../img/site-logo.png) center/contain no-repeat; }

#footer .copyrights { flex-grow: 1; display: flex; align-items: center; font-size: 1.4rem; flex-basis: 30rem; font-weight: 300; color: #fffa; gap: 1rem; }
#footer .copyrights .copy { font-weight: bold; font-size: 1.6rem; color: white; margin-bottom: 0.2rem; }

#footer .developer { font-size: 1.4rem; display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; text-align: right; }
#footer .developer a { color: var(--color-yellow); }
#footer .developer .logo { width: 16rem; height: 5rem; background: url(../img/logo-vebas.png) center/contain no-repeat; }


@media screen and (max-width: 1024px) {
	#footer > .container { justify-content: center; }
	#footer .bottom-menu li { flex-grow: 0; }
	#footer .bottom-menu a { padding: 1rem; }
	#footer .copyrights { align-items: center; gap: 2rem; flex-basis: 45rem; justify-content: center; flex-grow: 0; }
	#footer .copyrights > * { flex-basis: auto; }
}

@media screen and (max-width: 640px) {
	#footer .site-logo { display: none; }
	#footer .copyrights { text-align: center; }
	#footer .developer { text-align: center; display: block; }
	#footer .contacts-item { text-align: center; flex-basis: 30rem; justify-content: center; }
	#footer .contacts-item .icon { display: none; }
}


.search-bar { display: block; position: relative; }
.search-bar input[type="text"] { width: 100%; border-left: 4px solid var(--color-blue); min-height: 4rem; }
.search-bar button { position: absolute; right: 0; top:0; height: 100%; width: 5rem; --button-color: transparent; --button-text-color: #ccc; }

.catalog { margin-bottom: 4rem; }

.catalog-filter { display: flex; gap: 1rem 2rem; flex-wrap: wrap;  margin-bottom: 2rem; margin-top: 2rem; background: var(--color-light-gray); border-left: 10px solid var(--color-yellow); }

.catalog-filter .sort { display: flex; align-items: center; gap: 1rem; justify-content: center; padding: 1rem 2rem; }
.catalog-filter .sort .clear { white-space: nowrap; }
.catalog-filter select { min-height: 2rem; padding: 1rem 2rem; flex-basis: 20rem; background: transparent; }
.catalog-filter select:focus { border: none; box-shadow: none; }

.catalog-filter .view { display: flex; justify-content: center; gap: 1rem 1rem; border-left: 1px solid #e0e0e0; padding-left: 1rem;}
.catalog-filter .view i { background: #e0e0e0; }
.catalog-filter .view a { display: inline-flex; align-items: center; gap: 1rem; height: 4rem; text-decoration: none; padding: 1rem 2rem;}
.catalog-filter .view a.-active { background: #f0f0f0; }
.catalog-filter .view a.-active i { background: var(--color-blue); }
.catalog-filter .view span { display: inline-block; }

.catalog-filter .letters { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; flex-grow: 1; padding: 1rem; flex-basis: 40rem;  }
.catalog-filter .letters a { display: inline-block; padding: 0.3rem;  transition: .3s; }
.catalog-filter .letters a:hover { background: #f0f0f0;}
.catalog-filter .letters a.-active { background: white; text-decoration: none; }

.catalog-filter .search { background: #fafafa; align-self: stretch; padding-left: 4rem; clip-path: polygon(4rem 0, 100% 0, 100% 100%, 0 100%); }
.catalog-filter .search form { display: flex; align-items: center;  height: 100%; }
.catalog-filter .search input { min-height:4rem; height: 100%; background: transparent;  }
.catalog-filter .search button { min-height:4rem; height: 100%; padding-left: 4rem; clip-path: polygon(4rem 0, 100% 0, 100% 100%, 0 100%); }
.catalog-filter .search button:hover i { background: white; }


@media screen and (max-width: 960px) {
	.catalog-filter .sort { flex-grow: 1; }
	.catalog-filter .view { flex-grow: 1; }
	.catalog-filter .options .spacer { display: none; }
	.catalog-filter .view span { display: none; }
	.catalog-filter .letters { display: none; }
	.catalog-filter .search button { padding-left: 1rem; clip-path: none; padding-right: 1rem; }
	.catalog-filter .search { clip-path: none; padding-left: 0; width: 100%; }
	.catalog-filter .search input { flex-grow: 1; }
}

.catalog.ui-container { grid-template-columns: repeat(auto-fill, minmax(30rem, 1fr)); }

@media screen and (max-width: 960px) {
	.catalog.ui-container { display: flex; }
	.catalog.ui-container .product-card {  flex-basis: 30rem; }
}

.catalog-content { margin-bottom: 4rem; }

.section-image-side { display: flex; align-items: center; gap: 4rem; }
.section-image-side .image { width: 30rem; flex-shrink: 0;  }



/* Product top block */
/* ===================================================== */

#product-top { padding-bottom: 0; }
#product-top .wrapper { display: flex; gap: 4rem; align-items: start; flex-wrap: wrap; padding-bottom: 4rem;   }
#product-top .description {  font-style: italic; opacity:  0.8; }
#product-top .info {  flex-basis: 40rem; flex-grow: 1; }

#product-top .product-documents { margin: 2rem 0; }
#product-top .product-documents .document { display: inline-flex; gap: 1rem; font-weight: 500; background: #f0f0f0; padding: 1rem; text-decoration: none; align-items: center; }
#product-top .product-documents .document i { width: 3rem; height: 3rem; background: var(--color-blue); }
#product-top .product-documents .document:hover { background: var(--color-yellow); }
#product-top .product-documents .document:hover i { background: black; }


#product-top .product-price { background: var(--color-light-gray); border: 4px solid var(--color-yellow); display: flex; gap: 1rem; align-items: center; justify-content: center;  margin-top: 4rem; line-height: 1.2; }
#product-top .product-price .price-top { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; }
#product-top .product-price .price-bottom { margin-top: 1rem; }
#product-top .product-price .price-bottom span { padding: 0.5rem 1rem; background: white; font-size: 1.7rem; }
#product-top .product-price .price-bottom span.is-ordering { border-left: 6px solid var(--color-yellow); }
#product-top .product-price .price { font-size: 2rem; display: flex; gap: 0.3rem  1rem; align-items: center; padding: 2rem; flex-grow: 1; justify-content: center; flex-wrap: wrap; white-space: nowrap; }
#product-top .product-price .price .title { font-weight: bold; margin-right: 1rem; }
#product-top .product-price .price strong { font-size: 3.5rem; color: var(--color-blue); line-height: 1; margin: 0 0.5rem; }
#product-top .product-price .buttons { display: flex; align-items: center; gap: 1rem; padding: 1rem; flex-grow: 1; background: white; clip-path: polygon(3rem 0, 100% 0, 100% 100%, 0 100%); justify-content: center; padding-left: 4rem; align-self: stretch; }
#product-top .product-price .buttons .ui-button { height: 5rem; }

#product-top .product-price-bulk { display: block; align-items: center; margin-top: 1rem; font-size: 1.8rem; padding: 1rem 2rem; background: #f8f8f8; border-bottom: 4px solid var(--color-yellow); text-align: center; }
#product-top .product-price-bulk > * { display: inline-block; }
#product-top .product-price-bulk .title { font-weight: bold; }

#product-top .product-minimal-order { display: block; align-items: center; margin-top: 1rem; font-size: 1.8rem; padding: 1rem 2rem; background: #f8f8f8; border-bottom: 4px solid var(--color-yellow); text-align: center; }
#product-top .product-minimal-order > * { display: inline-block; }
#product-top .product-minimal-order .title { font-weight: bold; }


#product-top .properties { flex-basis: 40rem; flex-grow: 1; margin-top: 4rem; display: inline-block; }
#product-top .properties hr { margin: 2rem 0; }
#product-top .properties .property:not(:last-child) { margin-bottom: 0.2em; }
#product-top .properties .property .value > *:not(:last-child)::after { content: ','; color: black; }
#product-top .properties .property a { color: var(--color-blue); }

#product-top .images { flex-basis: 40%; min-width: 30rem;  display: flex; align-items: center; justify-content: center; flex-direction: column; }
#product-top .images .full-image { width: 35rem; height: 35rem; position: relative; flex-shrink: 0; }
#product-top .images .full-image img { position: absolute; left: 0; top:0; width: 100%; height: 100%; object-fit: contain; }
#product-top .images .preview { width: 100%;  padding-top: 70%; position: relative;  }
#product-top .images .preview img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }

#product-top .preview-slider { width: 100%;  }
#product-top .preview-slider .slick-track { padding: 1rem; }
#product-top .preview-slider .slick-slide { display: block; padding: 1rem;  position: relative; border: 2px solid white; box-shadow: 0 0 5px 0 #0002; cursor: pointer; }
#product-top .preview-slider .slick-slide.slick-current { border-color: #aaa; }


@media screen and (max-width: 960px) {
	#product-top .product-price { flex-wrap: wrap; width: 100%; }
	#product-top .product-price .buttons { padding-left: 1rem; clip-path: none; }
	#product-top .images { flex-basis: 100%; }
	#product-top .image { width: 100%; height: auto; }
	#product-top .image img { width: 100%; height: auto; position: relative; }
	#product-top .properties { display: block; }
}

.product-description { margin-top: 4rem; }

/* Product usage block */
/* ===================================================== */

.product-usage-card { display: flex; }
.product-usage-card .text { padding: 2rem; display: flex; align-items: center;}
.product-usage-card .side { flex-basis: 30rem; flex-shrink: 0; }
.product-usage-card .image { position: relative; padding-top: 75%; background: #eee; }
.product-usage-card .image img { position: absolute; left: 0; top:0; width: 100%; height: 100%; object-fit: cover; }
.product-usage-card.-adaptive { -webkit-mask: linear-gradient(to top, #0000, #000f 5rem); mask: linear-gradient(to top, #0000, #000f 5rem); }
.product-usage-card.-adaptive.-open { mask: none; -webkit-mask: none; }

.product .product-usage-button { position: relative; top: 1rem;  margin:0 auto; left: 50%; transform: translate(-50%, 0); padding: 1rem; height: 4rem;}
.product .product-usage-button.-open { top: -4rem; }


@media screen and (max-width: 1024px) {
	.product-usage-card .side {flex-basis: 20rem;}
}

@media screen and (max-width: 640px) {
	.product-usage-card .side { display: none; }
	.product-usage-card { gap: 1rem; }
	.product-usage-card .text { padding: 0; }
}

@media screen and (min-width: 640px) {
	.product .product-usage-button { display: none; }
	.product-usage-card.-adaptive { mask: none; -webkit-mask: none; }
}


.product .product-variants { margin: 4rem 0; }
.product .product-variants > *:not(:last-child) { margin-bottom: 2rem; }


.product-specs .specs-container { display: flex; flex-wrap: wrap; gap: 2rem; margin-bottom: 4rem; }
.product-specs .specs-tab { flex-basis: 40rem; flex-grow: 1; font-size: 1.6rem; line-height: 1.1; border: 3px solid #eee; border-bottom: 5px solid var(--color-yellow); }
.product-specs .specs-tab .section-title { padding: 2rem; background: #f0f0f0;  margin: 0 !important; margin-bottom: 1.5rem; display: flex; align-items: center;}
.product-specs .specs-tab .section-title i { width: 4rem; height: 4rem; background: var(--color-blue); margin-right: 1rem; }
.product-specs .specs-tab .spec { margin-bottom: 0.7rem; }
.product-specs .specs-tab .specs-list { padding: 2rem; }
.product-specs .specs-tab .spec .title { font-weight: bold; display: inline-block;}
.product-specs .specs-tab .spec .value { display: inline-block; }
.product-specs .specs-tab .spec > * { flex-basis: 50%; }

#product-usage .link-buttons { margin-top: 6rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(450px, 1fr)); align-items: center; flex-wrap: wrap; gap: 1rem 2rem; margin-bottom: -2rem; }
#product-usage .link-buttons .ui-button { --button-color: var(--color-light-gray); --button-text-color: black; min-height: 12rem; font-size: 1.8rem;  justify-content: start; padding: 0; text-transform: uppercase; font-weight: bold; white-space: normal; display: flex; }
#product-usage .link-buttons .ui-button .icon { background: var(--color-yellow); display: flex; width: 12rem; align-items: center; justify-content: center; align-self: stretch; transition: .3s; flex-shrink: 0; }
#product-usage .link-buttons .ui-button .text { white-space: normal; flex-basis: 10rem; flex-grow: 1;  padding: 1rem; }
#product-usage .link-buttons .ui-button i { width: 90%; height: 50%; transition: .3s; background: black; }
	#product-usage .link-buttons .ui-button:hover { background: var(--color-yellow); color: black; }

@media screen and (max-width: 640px) {
	#product-usage .link-buttons .ui-button { height: auto; flex-grow: 1; }
	#product-usage .link-buttons { display: flex; flex-wrap: wrap; }
}


#product-tabs { padding-top: 0; }
#product-tabs > .container { border-top: 1px dashed #888; padding-top: 6rem; }
#product-tabs .tabs .tabs-navigation { gap: 1.5rem; }
#product-tabs .tabs .tabs-navigation a { border: 3px solid #eee; padding: 1.5rem 4rem; font-size: 2rem; background: white; transition: .3s; }
#product-tabs .tabs .tabs-navigation a:hover { border-color: var(--color-yellow); }
#product-tabs .tabs .tabs-navigation a.-active { background: var(--color-yellow); border-color: var(--color-yellow); }
#product-tabs .tabs .tabs-content { padding: 0; }
#product-tabs .tabs .tab { padding: 0; }

@media screen and (max-width: 768px) {
	#product-tabs .tabs .tabs-navigation a { padding: 1rem 2rem; font-size: 1.8rem; }
}




.catalog-quick-menu { margin-bottom: 4rem; display: flex; gap: 0.5rem; flex-wrap: wrap; }
.catalog-quick-menu > * { display: inline-flex; height: 4rem; background: #f0f0f0; align-items: center; font-size: 1.5rem; }
.catalog-quick-menu .title { background: var(--color-blue); color: white; font-weight: bold; padding:0 1rem; cursor: pointer; }
.catalog-quick-menu .title i { background: white; margin-left: 1rem; }
.catalog-quick-menu { display: inline-flex; gap: 0.5rem; flex-wrap: wrap; }
.catalog-quick-menu a { display: block;  display: flex; align-items: center; text-decoration: none; color: black;}
.catalog-quick-menu a:hover { background: var(--color-blue); color: white; }
.catalog-quick-menu .item { display: inline-flex; padding-left: 1rem; padding-right: 1rem; border-left: 4px solid var(--color-blue); }
.catalog-quick-menu .item.-has-icon { padding-left: 0; } 
.catalog-quick-menu .item .icon { background: var(--color-blue); margin-right: 1rem; height: 100%; width: 4rem; display: inline-flex; align-items: center; justify-content: center; }
.catalog-quick-menu .item .icon i { background: white; width: 3rem; height: 3rem; }

.catalog-quick-menu .close-button { padding: 0 1rem; color: #444; display: flex; align-items: center; display: none; cursor: pointer; }
.catalog-quick-menu .close-button i { background: #666; width: 1.5rem; margin-right: 0.5rem; }
.catalog-quick-menu .close-button:hover i { background: #fff; }
.catalog-quick-menu.-open .close-button { display: inline-flex; }


.catalog-categories-menu { margin-bottom: 2rem; }
.catalog-categories-menu .categories { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.catalog-categories-menu .category-button { white-space: nowrap; background: #f5f5f5; padding: 0.5rem 1rem; position: relative; z-index:1; }
.catalog-categories-menu .category-button.-has-children { padding-right: 3rem; }
.catalog-categories-menu .category-button .down { content: ''; background: #e0e0e0; width: 2rem; display: inline-flex; position: absolute; right: 0; top:0; height: 100%; cursor: pointer; align-items: center; justify-content: center; }
.catalog-categories-menu .category-button .down i { width: 1.2rem; background: var(--color-blue); }
.catalog-categories-menu .category-button > a { text-decoration: none; font-size: 90%; color: inherit;  }
.catalog-categories-menu .category-children { display: none; font-size: 1.5rem; border: 2px solid #e0e0e0; position: absolute; top: 95%; z-index: 5; left:0; background: #fff; min-width: 100%; box-shadow: 0 0 5px 0 #0003; max-height: 30rem; overflow-y: auto; scrollbar-width: thin; scroll-padding:0; }
.catalog-categories-menu .category-children a { display: block; padding: 0.5rem 1rem; padding-right: 2rem; transition: .3s; white-space: nowrap; text-decoration: none; }
.catalog-categories-menu .category-children a.-active { background: #f0f0f0; }
.catalog-categories-menu .category-children a:hover { background: var(--color-blue); color: white; }

.catalog-categories-menu .category-button.-active { border-left: 8px solid var(--color-blue);   }

.catalog-categories-menu .category-button.-open { z-index: 3; background: var(--color-blue); color: white; }
.catalog-categories-menu .category-button.-open .down { background: var(--color-blue); }
.catalog-categories-menu .category-button.-open .down i { background: white; --image: url(../img/icon-arrow-up.svg); }

#catalog-categories-compact .catalog-quick-menu .title { background: var(--color-blue); color: white; font-weight: bold; padding:0 1rem; cursor: pointer; }
#catalog-categories-compact .catalog-quick-menu { margin-top:2rem;}
#catalog-categories-compact .catalog-quick-menu > * { background: white; }
#catalog-categories-compact .catalog-quick-menu a:hover { background: var(--color-blue); color: white; }



.content-block:not(:last-child) { margin-bottom: 2rem; }

.page-id-214 .search { margin-bottom: 2rem; }
.page-id-214 .search form { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
.page-id-214 .search form > * { flex-grow: 1; }
.page-id-214 .search form input { }


.page-id-817 .ui-flex-container > * { flex-grow: 0; }
.page-id-817 h3 { margin-top: 2rem; margin-bottom: 2rem; }
.page-id-817 .ui-group h2 { font-size: 2rem;}
.page-id-817 .ui-group .comment { font-style: italic; opacity:0.6; }
.page-id-817 .ui-group img { max-height: 80px; }

.ui-group {  padding: 4rem; border: 1px solid #c0c0c0; margin-bottom: 2rem; }

.ui-links { margin-bottom: 2rem; }
.ui-links a { display: inline-block; padding: 1rem; background: #f0f0f0; transition: .3s;} 
.ui-links a:hover { background: var(--color-blue); color: white; }

.ui-teasers-container { display: grid; gap: 2rem; grid-template-rows: auto; grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr)); }
.ui-teasers-container > * { flex-basis: 32%; }
@media screen and (max-width: 1024px) {
	.ui-teasers-container > * { flex-basis: 45%; }
}
@media screen and (max-width: 960px) {
	.ui-teasers-container { gap: 2rem; }
	.ui-teasers-container > * { flex-basis: 100%; }
}



.ui-round-teaser { display: flex; align-items: center; gap: 1em;}

.ui-round-teaser .content { font-size: 1.5rem;}
.ui-round-teaser .image { background: var(--color-blue); width: 10rem; height: 10rem; border-radius: 50%; flex-shrink: 0; position: relative; }
.ui-round-teaser .image i { background: white; position: absolute; left: 50%; top: 50%; width: 50%; height: 50%; transform: translate(-50%,-50%); }
.ui-round-teaser h3,
.ui-round-teaser .title { font-weight: bold; font-size: 2rem; line-height: 1.2; margin-bottom: 1rem;}

@media screen and (max-width: 960px) {
	.ui-round-teaser .image { width: 8rem; height: 8rem; }
}



.page-id-2 .top-heading { font-size: 3rem; margin-bottom: 2rem; line-height: 1.2;}

.text-italics { font-style: italic; opacity: 0.8;}

.ui-text-card { padding: 4rem; border: 1px solid #c0c0c0; font-size: 1.5rem; }
.ui-text-card h3 { font-size: 2rem; text-align: center; }

.ui-flex-container { display: flex; gap: 4rem;  align-items: start; }
.ui-flex-container > * { flex-basis: 45%; flex-grow: 1; }
@media screen and (max-width: 960px) {
	.ui-flex-container > * { flex-basis: 100%; }
}

.download-dpog { border-bottom: 3px solid #444; }
.download-dpog .buttons { display: flex; gap: 2rem; align-items: center; justify-content: center; flex-wrap: wrap; }
.download-dpog .buttons a { flex-basis: 20rem; }

.ui-price-card { border: 1px solid #a0a0a0; }
.ui-price-card .top { padding: 2rem; border-bottom: 1px solid #a0a0a0;}
.ui-price-card .top .title { font-weight: bold; font-size: 2rem; height: 4rem;}
.ui-price-card .top .price { display: flex; align-items: center; height: 7rem; gap: 1rem; }
.ui-price-card .top .price strong { font-size: 3.4rem; }
.ui-price-card .top .ui-button { height: 5rem; padding: 1rem; 2rem}
.ui-price-card .content { font-size: 1.5rem; }
.ui-price-card .content li { padding: 1.5rem 2rem; }
.ui-price-card .content li:not(:last-child) { border-bottom: 1px solid #c0c0c0; }

.ui-price-card.-active { background: var(--color-blue); color: white; }
.ui-price-card.-active .top { border-color: white; }
.ui-price-card.-active .content li:not(:last-child) { border-color: white; }
.ui-price-card .top .ui-button { background: black; }

.ui-service-card { font-size: 1.5rem;  border: 1px solid #c0c0c0; display: flex; align-items: center;  }
.ui-service-card .image { flex-basis: 20rem; flex-shrink: 0; align-self: stretch; }
.ui-service-card .image img { width: 100%; height: 100%; object-fit: cover;}
.ui-service-card .title { font-size: 2.2rem; font-weight: bold; margin-bottom: 0.5em; }
.ui-service-card .title a { text-decoration: none; color: black; }
.ui-service-card .content { padding: 2rem; }
.ui-service-card .content .ui-button { margin-top: 1rem; }


/* Блок с категориями на сайте */
#categories {}
#categories .block-content { max-width: 80rem; margin: 0 auto; margin-bottom: 4rem; text-align: center; }
#categories .category { background: var(--color-light-gray);  display: flex; align-items: center; position: relative; }
#categories .category .title { font-size: 1.8rem;  color: black; transition: .3s; display: flex; align-items: center; gap: 1rem; }
#categories .category .title strong { font-weight: bold; }
#categories .category .title i { background: black; width: 1.5rem; height: 1.5rem;}
#categories .category .title:hover { color: var(--color-blue); }
#categories .category .image { background: var(--color-blue); flex-basis: 12rem; align-self: stretch; flex-shrink: 0; min-height: 12rem; position: relative; transition: .3s; }
#categories .category .image i { --image: url(../img/icons/chemistry.png); background: white; position: absolute; left: 50%; top: 50%; width: 80%; height: 60%; transform: translate(-50%, -50%); transition: .3s; }
#categories .category .button { margin-top: 1rem; }
#categories .category .button a { display: flex; text-decoration: none; gap: 1rem; }
#categories .category .content { padding: 2rem; }
#categories .buttons-container { margin-top: 4rem; }

	#categories .category:hover .image { background: var(--color-yellow); }
	#categories .category:hover .title { text-decoration: underline; }
	#categories .category:hover .image i { background: black; }

@media screen and (max-width: 768px) {
	#categories .category { flex-grow: 0; }
	#categories .category .title { font-size: 1.6rem; }
}


.warehouse-container { display: grid; grid-template-rows: auto; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap: 4rem 2rem; }
.warehouse-card { }
.warehouse-card .content { flex-grow: 1; background: #f5f5f5; padding: 2rem; border-left: 5px solid var(--color-blue); min-height: 10rem; }
.warehouse-card h3 { font-size: 1.6rem; margin-bottom: 0.5rem; }
.warehouse-card .image { flex-basis: 40rem; display: block; }
.warehouse-card .image img { max-height: 25rem; width: 100%; object-fit: cover; border: 1px solid #c0c0c0; border-top: none; }

.button-card { display: flex; align-items: center; border: 1px solid #c0c0c0; text-decoration: none;}
.button-card .title { font-size: 2rem; margin-bottom: 1rem; line-height: 1.1; text-decoration: none; }
.button-card .image { background: var(--color-blue); flex-basis: 12rem; align-self: stretch; min-height: 12rem; flex-shrink: 0; display: block; position: relative; }
.button-card .image i { background: white; position: absolute; width: 70%; height: 70%; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.button-card .content { padding: 2rem; }


.page-template-5 #delivery .teasers { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 4rem; max-width: 60rem;}
.page-template-5 #delivery .teasers .ui-teaser-mini { flex-grow: 1; flex-basis: 40%; text-decoration: none; transition: .3s; }
.page-template-5 #delivery .teasers .ui-teaser-mini:hover { background: var(--color-blue); color: white; }
.page-template-5 #product-popular .block-heading { text-align: left; max-width: none; }

#about-catalog > .container { display: flex; gap: 2rem; flex-wrap: wrap; }
#about-catalog > .container > * { flex-basis: 40rem; flex-grow: 1; }
#about-catalog .articles .title-bar { display: flex; gap: 1rem; align-items: center; justify-content: center; flex-wrap: wrap; }
#about-catalog .articles .title-bar h2 { flex-grow: 1; flex-basis: 45rem;}
#about-catalog .about { padding: 4rem; background: url(../img/bg-about-catalog.jpg) center/cover no-repeat;  display: flex; justify-content: center; flex-direction: column; }
#about-catalog .about .ui-button { margin-top: 1rem; }
#about-catalog .ui-article-card { display: block; background: white; border: 3px solid #eee;}
#about-catalog .ui-article-card:not(:last-child) { margin-bottom: 1rem; }
@media screen and (max-width: 768px) {
	#about-catalog .about { text-align: center; }
	#about-catalog .articles .title-bar { }
}


.catalog-teaser { background: #f3f3f3; display: flex; align-items: center; border-bottom: 3px solid var(--color-blue); color: black; text-decoration: none;}
.catalog-teaser > * { align-self: stretch;  }
.catalog-teaser .image { width:8rem; height: 100%; min-height: 8rem; flex-shrink:0; background: var(--color-blue); position: relative; }
.catalog-teaser .image i { width: 100%; height: 100%; mask-size: 5rem 5rem; -webkit-mask-size: 5rem 5rem; background: white; }
.catalog-teaser .content { padding: 1rem 2rem; transition: .3s; display: flex; align-items: center; flex-grow: 1; line-height: 1.2;}
.catalog-teaser:hover .content { background: var(--color-blue); color: white;  }

@media screen and (max-width: 768px) {
	#catalog-teasers .ui-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
	.catalog-teaser { font-size: 1.5rem; }
	.catalog-teaser .image { width: 6rem; min-height: 6rem; }
	.catalog-teaser .image i { mask-size: 4rem 4rem; -webkit-mask-size: 4rem 4rem; }
}	


.catalog-content-block { clear: both; }

.catalog-filters { margin: 1rem 0; position: relative; clear: both; }
.catalog-filters .reset { cursor: pointer; display: flex; align-items: center; gap: 1rem; }
.catalog-filters .tabs { filter: drop-shadow(0px 0px 5px #0003); } 
.catalog-filters .sort-input { display: flex; align-items: center; }
.catalog-filters .sort-input select { padding: 1rem 2rem; } 

.catalog-filters .tab a { display: inline-block; padding: 0.5rem 1rem;  text-decoration: underline; color: var(--color-green); background: white; transition: .3s; box-shadow: 0 0 3px 0 #0002; text-decoration: none; }
.catalog-filters .tab a:hover { background: var(--color-yellow); color: black; }
.catalog-filters .tab a.-active { background: var(--color-green); color: white; }
.catalog-filters .tab .filter-values-list { display: flex; gap: 1rem; flex-wrap: wrap; }

.catalog-filters .sort { display: flex; align-items: center; gap: 1rem; flex-grow: 0; }
.catalog-filters .sort select { border: 1px solid #eee; min-height: 4rem; font-size: 1.5rem; width: 100%;  }

.catalog-filters .filter { display: flex; align-items: center; gap: 1rem 2rem; flex-grow: 1;  flex-basis: 20rem; }
.catalog-filters .filter .content { flex-grow: 1; }

.catalog-filters .properties-container-inner { display: flex; gap: 2rem 4rem; align-items: center; flex-wrap: wrap; flex-basis: 100%; }

.catalog-filters .buttons-container { display: flex; align-items: center; justify-content: start; flex-basis: 100%; flex-wrap: wrap; gap: 1rem 2rem;  margin-top: 2rem; }
.catalog-filters.-open .properties { max-height: none; padding-bottom: 6rem; }
.catalog-filters.-open .properties::after { display: none;  }


@media screen and (max-width: 768px) {
	.catalog-filters .heading { display: none; }
	.catalog-filters .property { text-align: center; }
	.catalog-filters .property .title { justify-content: center; }
	.catalog-filters .properties-container-inner { justify-content: center; }
	.catalog-filters .tabs .tab { padding: 0; }
	.catalog-filters .tab a { padding: 0.2rem 1rem; font-size: 1.5rem; }
	.catalog-filters .tabs .tabs-navigation a { padding: 0.7rem 1rem; flex-grow: 1; text-align: center; }
	.catalog-filters .small-filter { flex-grow: 1; border: none !important; justify-content: center; border: none; }
	.catalog-filters .ui-button.-mini { padding: 0.5rem; }
}




#certificates {}

#advantages .ui-grid { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
#advantages .block-text { text-align: center;  max-with: 80rem; margin: 0 auto; margin-bottom: 4rem; }


.catalog-content-block { display: flex; gap: 4rem; flex-wrap:wrap; align-items: center; }
.catalog-content-block > .content { flex-basis: 30rem; flex-grow: 1; }
.catalog-content-block > .image { flex-basis: 30rem; }
.catalog-content-block > .image img { max-width: 30rem; max-height: 30rem; }

@media screen and (max-width: 768px) {
	.catalog-content-block > .image { order: -1; flex-basis: 100%; }
	.catalog-content-block > .image img { max-width: none; width: 100%; height: auto;  }
}

#info .buttons-container { margin-top: 4rem; }

.contacts-office-card { border: 1px solid #eee; background: white; box-shadow: var(--shadow); font-size: 1.6rem; display: inline-block; }
.contacts-office-card p { margin: 0; }
.contacts-office-card > .title { background: var(--color-yellow); font-size: 2rem; font-weight: bold; }
.contacts-office-card > * { padding: 1rem 2rem; }
.contacts-office-card > *:not(:last-child) { border-bottom: 1px solid #eee; }
.contacts-office-card .phones a { display: flex; gap: 1rem; align-items: center;  font-size: 1.8rem; font-weight:bold; text-decoration: none; }
.contacts-office-card .emails a { display: flex; align-items: center; gap: 1rem; text-decoration: none; }
.contacts-office-card .write-us { display: flex; align-items: center; gap: 1rem; }
.contacts-office-card .write-us .title { display: none; }

.contacts-office-card i { background: #ccc; }
.contacts-office-card .write-us i { width: 3rem; height: 3rem; background: #27d045; transition: .3s; }
.contacts-office-card .write-us i[data-icon="social-skype"] { background: #00aff0; }
.contacts-office-card .write-us i:hover { background: #eee !important; }
.contacts-office-card .sites .site { display: flex; align-items: centee; gap: 1rem; }
.contacts-office-card .sites a { text-decoration: none;  }
.contacts-office-card .map { padding: 0; }

.contacts-card { border: 1px solid #eee; background: white; box-shadow: var(--shadow); font-size: 1.6rem; display: inline-flex; align-items: center; flex-wrap: wrap; }
.contacts-card p { margin: 0; }
.contacts-card > * { padding: 2rem; flex-basis: 30rem !important; flex-grow: 1;   }
.contacts-card .content { border-left: 1px solid #eee; }
.contacts-card .content p.title { margin-bottom: 1rem; }
.contacts-card .content ul li { margin: 0; }
.contacts-card .name { font-size: 2rem; font-weight: bold; display: flex; gap: 1rem; align-items: center; }
.contacts-card .name img { max-width: 4rem; max-height: 4rem; }
.contacts-card .phones a { display: flex; gap: 1rem; align-items: center;  font-size: 1.8rem; font-weight:bold; text-decoration: none; }
.contacts-card .emails a { display: flex; align-items: center; gap: 1rem; text-decoration: none; }
.contacts-card .phones a { font-size: 1.8rem; text-decoration: none; }
.contacts-card .write-us i { width: 3rem; height: 3rem; background: #27d045; transition: .3s; }
.contacts-card .write-us i[data-icon="social-skype"] { background: #00aff0; }
.contacts-card .write-us i:hover { background: #eee !important; }
.contacts-card .write-us { display: flex; align-items: center; gap: 1rem; }
.contacts-card .write-us .links { display: flex; align-items: center; gap: 1.5rem; }
.contacts-card .write-us .title { display: none; }

@media screen and (max-width: 768px) {
	.contacts-card .info { text-align: center; }
	.contacts-card .phones a { justify-content: center; }
	.contacts-card .name { justify-content: center; }
}

	.contacts-card.-primary { border: 3px solid var(--color-yellow); margin-bottom: 4rem; min-width: 40rem; }

.contacts-card .info > * { padding: 1rem 0; }
.contacts-card .info > *:not(:last-child) { border-bottom: 1px solid #eee; }

.document-card { border: 3px solid var(--color-yellow); background: white; box-shadow: var(--shadow); font-size: 1.6rem; padding: 2rem; }
.document-card .title { font-weight: bold; font-size: 2rem; }
.document-card .content { margin: 2rem 0; }
.document-card .file-link { display: inline-flex; gap: 1rem; align-items: center; color: var(--color-blue); }
.document-card .file-link i { width: 3rem; height: 3rem; background: var(--color-blue); }
.document-card .file-link i[data-icon="pdf"] { background: red; }


.delivery-options p { margin-bottom: 0.2rem; }
.delivery-options p.small { font-size: 80%; opacity: 0.8; }
.delivery-options .section { margin-bottom: 2rem; }
.delivery-options .frame { background: #f5f5f5; padding: 2rem; border-left: 5px solid var(--color-blue); }
.page-id-812 .delivery-options .block-heading { text-align: left; max-width: none; }

.section-title { margin-top: 4rem !important; display: flex; align-items: center; gap: 1rem; font-size: 2.2rem; color:var(--color-blue); font-weight: bold; }
.section-title i { background: var(--color-blue); width: 3rem; height: 3rem; }

.more-text { margin-bottom: 2rem; }
.more-text .more-button { height: 4rem !important; }
.more-text .details {  max-height: 0; overflow: hidden; padding: 0 4rem; transition:.5s; border: 3px solid transparent; margin-top: -3px; }
.more-text.-open .details { max-height: 3000px; padding: 4rem; border-color: var(--input-border-color); }
.more-text.-open .more-button { border-color: var(--color-red) !important; }


.delivery-map { }
.delivery-map .heading { display: flex; align-items: center; gap: 1rem; background: linear-gradient(to top, #0002, transparent 2rem), #f0f0f0; padding: 2rem; }
.delivery-map .heading h2 { font-size: 2.6rem; margin: 0;  }
.delivery-map .heading i { background: var(--color-green); width: 4rem; height: 4rem; }

.delivery-map .content { box-shadow: var(--shadow); }

.delivery-map .popular { padding: 2rem; border-bottom: 1px solid #e0e0e0;  }
.delivery-map .popular .cities { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.delivery-map .popular h3 { font-size: 2.3rem; }
.delivery-map .popular .ui-button { --button-color: #fafafa; --button-text-color: #333; height: 3rem; border-bottom: 3px solid var(--color-light-green); font-size: 1.6rem; }
.delivery-map .popular .ui-button:hover { --button-color: var(--color-light-green); --button-text-color: white; }

.delivery-map .controls { padding: 1rem; position: absolute; left:2rem; right:2rem; top: 1rem; z-index: 2; background: #fff8; box-shadow: var(--shadow); }
.delivery-map .controls .form { display: flex; gap: 1rem; align-itsms: center; flex-wrap: wrap; }
.delivery-map .controls .input { display: flex; align-items: center; gap: 1rem; flex-grow: 1; margin-bottom: 0; }
.delivery-map .controls .ui-button { height: 4rem; }
.delivery-map .controls .input i { background: #333; width: 2.5rem; height: 2.5rem; }
.delivery-map .controls input,
.delivery-map .controls select { background: white; margin-bottom: 0; font-size: 1.5rem; padding: 0.5rem 1rem; min-height: 4rem; font-weight: bold; border: 1px solid #ddd; }

.delivery-map .map {  background: #333; position: relative; position: relative; }
.delivery-map .map #delivery-map { width: 100% !important; height: 45rem !important; position: relative; z-index: 2; }

.delivery-map .result  { position: absolute; background: #0008; color: white;  padding: 1rem; position: absolute; left: 2rem; bottom: 1rem ;  z-index: 5; display: none; }
.delivery-map .result .item { display: flex; gap: 0.5rem; align-items: center; }
.delivery-map .result .data { display: flex; align-items: center; font-size: 1.9rem; gap: 2rem; flex-wrap: wrap; }
.delivery-map .result .title { font-weight: bold; }
.delivery-map .result .value { font-weight: bold; padding: 0.5rem; background: var(--color-green); display: inline-block; }
.delivery-map .result .comment { font-size: 1.4rem; font-style: italic; margin-top: 0.5rem; }


#catalog-elements-block  { background: var(--color-light-gray);}
.elements-list { gap: 1rem; margin-top: 2rem; margin-bottom: 3rem; justify-content: center; }
.elements-list .element-teaser { background: white; display: flex; min-height: 4rem; align-items: center; text-decoration: none; color: black; transition: .3s; }
.elements-list .element-teaser .image { flex-basis: 4rem; flex-shrink:0; width: 4rem; height:100%; background: var(--color-blue); position: relative; }
.elements-list .element-teaser .image img { position: absolute; left:0; top:0; width: 100%; height: 100%;  object-fit: contain; object-}
.elements-list .element-teaser .content { padding: 1rem; height: 100%; } 
.elements-list .element-teaser:hover { background: var(--color-blue); color: white; }
.elements-list .element-teaser:hover .content { background: linear-gradient(to right, #fff4, transparent 1rem); }

@media screen and (max-width: 768px) {
	.elements-list .element-teaser { min-height: 3rem; padding: 0; flex-grow: 0; }
	.elements-list .element-teaser .image { width: 3rem; height: 100%; flex-basis: 3rem; }
}


.product-contacts .more-text.-open .details { padding: 2rem; }

#categories.-openable .category:nth-child(n+13) { display: none;  }
#categories.-openable.-open .category:nth-child(n+13) { display: flex;  }