@import "../static/fonts/fonts.css";

:root {
	--font-size-18: 18px;
	--font-size-24: 24px;
	--font-size-30: 30px;
	--font-size-h1: 60px;
	--font-size-h2: 40px;
	--color-primary: #000;
	--color-secondary: #FFF;
	--color-tertiary: #F6CF62;
	--color-dark: #262625; 
	--color-light: #F6F6F6;
}

html, body {
	overflow-x: hidden;
	font-size: var(--font-size-18);
	font-family: Gilroy;
	line-height: 27px;
	font-weight: 500;
	color: var(--color-primary);
}

body > .container-fluid {
	padding: 120px 65px 0 65px;
	position: relative;
}

.container-shadow {
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.swiper-nav {
	height: 80px;
	position: relative;
}

.row, .row > *, p, span, h1, h2, h3, h4, h5, h6 {
	padding: 0;
	margin: 0;
}

.row.black {
	background: var(--color-dark);
	color: var(--color-secondary);
}

.btn-catalog {
	padding-block: 17px;
	display: block;
	border-style: solid;
	border-width: 1px;
	border-color: #000;
	max-width: 417px;
	width: 100%;
	border-radius: 10px;
	text-align: center;
	margin-block: 60px;
	margin-inline: auto;
	color: #000;
	background-color: #fff;
	text-decoration: none;
	font-family: 'Gilroy';
	font-size: 18px;
	z-index: 2;
	font-style: normal;
	font-weight: 500;
	transition: color 0.3s, border-color 0.3s;
	line-height: 144.444%;
}

.pulse {
	font-size: 20px;
	text-decoration: none;
	padding: 15px 30px;
	border-radius: 10px;
	transform: scale(1);
	animation: light 1.5s infinite alternate;
}

.pulse:hover {
	transform: scale(1.03);
}

@keyframes light {
	0% {
		 -webkit-box-shadow: 0px 0px 20px 0px rgba(190,77,227,0);
		 -moz-box-shadow: 0px 0px 20px 0px rgba(190,77,227,0);
		 box-shadow: 0px 0px 20px 0px rgba(190,77,227,0);
	}
	100% {
		 -webkit-box-shadow: 0px 0px 20px 0px var(--color-tertiary);
		 -moz-box-shadow: 0px 0px 20px 0px var(--color-tertiary);
		 box-shadow: 0px 0px 20px 0px var(--color-tertiary);
	}
}

.btn-catalog:hover {
	border-color: var(--color-tertiary);
	color: var(--color-tertiary);
}

h2 {
	font-size: var(--font-size-h2); 
	font-family: KyivTypeTitling;
	font-style: normal;
	font-weight: 500;
	line-height: 48px;
	text-transform: uppercase; 
	text-align: center;

	margin-bottom: 69px;
}

h3 {
	font-size: var(--font-size-h2); 
	font-family: KyivTypeTitling;
	font-style: normal;
	font-weight: 500;
	line-height: 48px;
	text-align: center;

	margin-bottom: 30px;
}

a.anchor {
	position: absolute;
	top: 0;
}

img.flip-h {
	transform: scaleX(-1);
}

img.flip-v {
	transform: scaleY(-1);
}

li {
	list-style-type: none; /* Убираем маркеры */
}

ul {
	margin-left: 0; /* Отступ слева в браузере IE и Opera */
	padding-left: 0; /* Отступ слева в браузере Firefox, Safari, Chrome */
}

button {
  padding: 0;
  border: none;
  font: inherit;
  color: inherit;
  background-color: transparent;
  cursor: pointer;
}

.title-3 {
	text-align: left;
	margin-bottom: 60px;
	position: relative;
}

.title-3::after {
	content: '';
	display: block;
	width: 100%;
	height: 10px;
	position: absolute;
	bottom: 0;
	left: 0;
	transform: translateY(20px);
}

.search-item {
	border-style: solid;
	border-width: 2px;
	border-radius: 15px;
	width: 245px;
	min-height: 180px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.search-item__logo {
	min-height: 110px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-block: 13px 10px;
	padding-inline: auto;
	align-self: center;
}

.search-item__logo svg,
.search-item__logo img {
	max-width: 90%;
	display: block;
	margin-inline: auto;
}

.search-item__footer {
	padding: 12px 15px;
	display: flex;
	align-items: center;
	gap: 7px;
	text-decoration: none;
}

.search-item__name {
	color: #FFF;
	font-family: 'Gilroy';
	font-size: 14px;
	font-weight: 500;
	line-height: 128.571%;
	text-decoration: none;
}

.search-item__name:active {
	color: #FFF;
	text-decoration: none;
}

.search-item__name:hover {
	color: #FFF;
	text-decoration: none;
}

body .companies {
	padding-top: 70px;
}

.choices-list {
	display: flex;
	align-items: stretch;
	gap: 30px;
	flex-wrap: wrap;
}



/* ################# Main Container ################# */
.main-bg {
	background-size: cover;
	background-position: center center;
	color: var(--color-secondary);
	height: 900px;
}

.main-bg {
	background: linear-gradient(180deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.62) 31%, rgba(0,0,0,0.36) 43%, rgba(0,0,0,0.11) 74%, rgba(0,0,0,0) 100%),
	url("../static/main/background.jpg") center center/cover no-repeat;
}

body .main-bg .nav-link {
	color: #fff;
}

.header {
	position: absolute !important;
	min-height: 150px;
	left: 0;
	top: 0;
	z-index: 2;
	width: calc(100% - 60px);
}

body .wrap-offer {
	position: relative;
	padding-top: 173px !important;
}

/* Navbar */
.navbar {
	margin-inline: 30px;
}

.container-main .navbar {
	padding-top: 41px;
}

.container-main > .navbar > .container-fluid {
	padding: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.20);
	padding-bottom: 30px;
}

.container-main > .navbar .navbar-brand {
	padding: 0;
	margin: 0;
	max-height: 101px;
	display: flex;
}

.container-main > .navbar .navbar-brand svg {
	max-height: 101px;
}

#navbarNav > .navbar-nav {
	width: max-content;
	display: flex;
	gap: 20px;
	justify-content: space-between;
	margin-left: 20px;
	align-items: center;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.lang a,
#navbarNav > .navbar-nav > .nav-item > .nav-link {
	display: inline-block;
	position: relative;
	color: inherit;
	font-size: var(--font-size-18);
	padding: 0;

	transition: color 0.3s;
}

#navbarNav > .navbar-nav > .nav-item > .nav-link:after {
	content: "";
	display: block;
	position: absolute;
	bottom: -13px;
	left: 0;
	width: 0;
	height: 4px;
	background: var(--color-tertiary);
	transition: width 0.3s;
}

.lang a::after {
	content: "";
	display: block;
	position: absolute;
	bottom: -4px;
	left: 0;
	width: 0;
	height: 4px;
	background: var(--color-tertiary);
	transition: width 0.3s;
}

.transparent-wrap {
	display: flex;
	align-items: center;
}

#navbarNav .close-btn {
	display: none;
}

.lang {
	display: flex;
	z-index: 4;
	gap: 4px;
	color: #000;
	position: absolute;
	top: 60px;
	right: 42px;
}


.lang a.active,
.lang a:hover,
#navbarNav > .navbar-nav > .nav-item > .nav-link.active,
#navbarNav > .navbar-nav > .nav-item > .nav-link:hover {
	color: var(--color-tertiary);
}

.lang a.active:after,
.lang a:hover:after,
#navbarNav > .navbar-nav > .nav-item > .nav-link:hover:after,
#navbarNav > .navbar-nav > .nav-item > .nav-link.active:after {
	width: 95%;
}


/* Info */
.main-bg > .info {
	padding-top: 100px;
}

.main-bg .lang,
.main-bg .lang a {
	color: #fff;
}

.lang a.active {
	color: var(--color-tertiary) !important;
}

.main-bg .lang.black-lang,
.main-bg .lang.black-lang a {
	color: #000;
}

.main-bg .lang {
	top: 78px;
}

.main-bg .navbar-brand path {
	fill: #fff;
}

.main-bg > .info > div {
	padding: 0;
}

.main-bg > .info h1 {
	margin: 0;
	margin-bottom: 39px;
	font-family: KyivTypeTitling;
	font-size: var(--font-size-h1);
	font-weight: 500;
	color: #fff;
	text-transform: uppercase;
	font-style: normal; 
	line-height: normal;
}

.main-bg > .info p {
	width: 629px;
	margin: 0 auto;
	margin-bottom: 123px;
}

.main-bg > .info .scroll {
	color: var(--color-secondary);
	text-decoration: none;

	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;

	margin: 130px auto;
	padding: 35px 0;
	width: 144px;
	height: 144px;
	border-radius: 50%;
	border: 2px solid var(--color-secondary);

	transition: border-color 0.3s, color 0.3s;
}

.main-bg > .info .scroll:hover {
	color: var(--color-tertiary);
	border-color: var(--color-tertiary);
}



/* ################# Partners Container ################# */
.container-partners > .row > div {
	padding: 0;
}

.container-partners > .row > .partners {
	display: flex;
	flex-direction: column;
	gap: 30px;
}

.container-partners > .row > .partners > span {
	display: flex;
	justify-content: center;
	align-items: center;

	height: 100px;
	border: 2px solid var(--color-primary);
	border-radius: 15px;

	font-size: var(--font-size-24);
	font-weight: 400;
}

.container-partners > .row > .logo {
	display: flex;
	justify-content: center;
	gap: 50px;

	padding: 45px 30px;
}



/* ################# Helps Container ################# */
.container-helps > .row {
	display: flex;
	justify-content: space-between;
	gap: 30px;
}

.container-helps > .row > .image-wrapper {
	position: relative;
	padding: 0;
	border-radius: 15px;
	max-width: calc(25% - 30px);
}

.container-helps > .row > .image-wrapper > * {
	width: 100%;
}

.container-helps > .row > .image-wrapper > .text {
	display: flex;
	flex-direction: column;
	justify-content: end;
	overflow: hidden;

	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;

	border-radius: 15px;
	/*padding: 40px 30px;*/
	color: var(--color-secondary);
	background: rgba(0, 0, 0, 0.23);
	box-shadow: none;

	transition: background 0.3s, box-shadow 0.3s;
}

.container-helps > .row > .image-wrapper:hover > .text {
	background: rgba(0, 0, 0, 0.7);
	box-shadow: 14px 12px 22px rgba(0, 0, 0, 0.35);
}

.container-helps > .row > .image-wrapper > .text > .title {
	position: absolute;
	bottom: 40px;
	left: 30px;
	width: calc(100% - 50px);

	font-size: var(--font-size-30);
	line-height: 40px;
	font-weight: 500;
	opacity: 1;

	transition: bottom 0.3s, opacity 0.3s;
}

.container-helps > .row > .image-wrapper:hover > .text > .title {
	bottom: 100%;
	opacity: 0;
}

.container-helps > .row > .image-wrapper > .text > .description {
	position: absolute;
	bottom: -100%;
	left: 30px;
	width: calc(100% - 50px);
	font-weight: 400;

	margin: 0;
	opacity: 0;

	transition: bottom 0.3s, opacity 0.3s;
}

.container-helps > .row > .image-wrapper:hover > .text > .description {
	bottom: 40px;
	opacity: 1;
}



/* ################# Grant Container ################# */
.container-grant > img {
	width: 100%;
	display: block;
	margin: 0 auto;
}



/* ################# Philosophy Container ################# */
.container-philosophy {
	padding: 126px 0 0 0 !important;
}

.container-philosophy > .row.black {
	padding: 188px 168px;
	font-size: var(--font-size-h2);
	line-height: 60px;
	font-weight: 400;
	text-align: center;
	margin-bottom: 69px;
}

.container-philosophy > .row.triangle {
	padding: 24px 0px 0 0px;
	position: relative;
	width: 80%;
	margin: 0 auto;
}

.container-philosophy > .row.triangle > img {
	width: 100%;
}

.container-philosophy > .row.triangle > .text {
	position: absolute;
	display: block;
	width: 22.5%;
}

.container-philosophy > .row.triangle > .text > p {
	color: var(--color-dark);
	text-align: center;
	font-weight: 400;
}

.container-philosophy > .row.triangle > .text.center {
	top: calc(43% + 54px);
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}

.container-philosophy > .row.triangle > .text.top {
	top: 19.75%;
}

.container-philosophy > .row.triangle > .text.center.top { 
	transform: translateX(-50%);
}

.container-philosophy > .row.triangle > .text.bottom {
	top: 53.25%;
}

.container-philosophy > .row.triangle > .text.left {
	left: 30.5%;
	transform: translateX(-50%);
}

.container-philosophy > .row.triangle > .text.right {
	left: 69.6%;
	transform: translateX(-50%);
}



/* ################# Region Container ################# */
.container-region {
	padding: 29px 65px 0 65px !important;
}


/* Map */
.container-region > .map {
	position: relative;
	width: 80%;
	margin: 0 auto;
}

.container-region > .map > img {
	width: 69.69%;
	margin: 0 auto;
} 

.container-region > .map > .place {
	position: absolute;
	max-width: 260px;

	color: var(--color-dark);
}

.container-region > .map > .place > img {
	display: block;
	width: 200px;
	height: 200px;
	background-size: cover;
	border-radius: 50%;

	margin-bottom: 20px;
}

.container-region > .map > .place > .info > .title {
	display: block;
	margin-bottom: 10px;

	font-size: var(--font-size-24);
	font-weight: 600;
	line-height: 27px;
}

.container-region > .map > .place > .info > p {
	line-height: 21px; 
}

.container-region > .map > .place.basalt {
	left: -1%;
	top: 15%;
}

.container-region > .map > .place.tunnel {
	right: -10%;
	top: 13%;
}

.container-region > .map > .place.factory {
	bottom: 9%;
	left: 2%;
}

.container-region > .map > .place.academy {
	bottom: 5%;
 	right: -3%;
}


/* Info/Percents */
.container-region > .info {
	flex-direction: row;
	justify-content: space-between;

	padding-top: 60px;
	gap: 30px 0;
}

.container-region > .info > .card {
	flex-basis: 305px;
	padding: 40px;

	border: 2px solid var(--color-primary);
	border-radius: 15px;
}

.container-region > .info > .card > img {
	width: 100px;
	height: 100px;
	background-size: cover;
	margin-bottom: 40px;
}

.container-region > .info > .card > .percents {
	color: var(--color-dark);
	font-size: var(--font-size-30);
	font-weight: 600;
	line-height: normal;

	margin-bottom: 10px;
}

.container-region > .info > .card > p {
	color: var(--color-dark);
}




/* ################# Contacts Container ################# */
.container-contacts {
	padding: 40px 0 0 0 !important;
}

.container-contacts > .row {
	padding: 87px 65px 127px 65px;
}

.container-contacts > .row > .logo {
	margin-left: auto;
}

.container-contacts > .row > .logo > a {
	display: block;
}

.container-contacts h2 {
	font-size: var(--font-size-24);
	font-family: Gilroy;
	font-style: normal;
	font-weight: 500;
	line-height: normal; 
	text-align: left;
	margin-bottom: 30px;
}


/* Contacts Block */
.container-contacts .contacts {
	display: flex;
	flex-direction: column;
	align-items: start;
}

.container-contacts .contacts > a {
	text-decoration: none;
	color: var(--color-secondary); 

	display: inline-block;
	margin-bottom: 20px;
}

.container-contacts .contacts > a:last-child {
	margin-bottom: 0;
}


/* Question Block */
.container-contacts .question > form {
	width: 100%;
}

.container-contacts .question > form > a > input {
	width: 100%;
	height: 60px;
	padding: 10px;

	border: none;
	border-radius: 10px;
	background: var(--color-light);
	font-weight: 400;
}


/* Partners Block */
.container-contacts .partners {
	padding-top: 80px;
	gap: 110px;
}

.container-contacts .partners > .partner {
	width: auto;
	display: flex;
	flex-direction: row;
	justify-content: start;
	align-items: center;
	flex-wrap: wrap;
	flex-basis: 0;
}

.container-contacts .partners > .partner > img {
	flex-basis: 100%;
}

.container-contacts .partners > .partner a {
	white-space: nowrap;
	align-self: end;
	color: var(--color-secondary);
	font-weight: 400;
}

.container-contacts .partners > .partner.oda > img {
	flex-basis: auto;
	margin-bottom: 30px;
}

.container-contacts .partners > .partner.oda > .links {
	margin-top: 5px;
	margin-left: 40px;

	display: flex;
	flex-direction: column;
	align-self: start;
	gap: 30px;
}


/* --- filter --- */
.filter__title {
	text-align: left;
}

.filter__form {
	height: 60px;
	width: 100%;
	background-color: #000;
}

.filter__choices {
	margin-top: 40px;
	display: flex;
	flex-direction: column;
	gap: 30px;
}

.filter__choices li {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.filter__choices li::after {
	content: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' height='512px' style='enable-background:new 0 0 512 512;' version='1.1' viewBox='0 0 512 512' width='512px' xml:space='preserve'><style type='text/css'><![CDATA[.st0{display:inline;}.st1{fill:none;stroke:#000000;stroke-width:16;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.st2{display:none;}]]></style><g class='st2' id='cross'><g class='st0'><line class='st1' x1='112.5' x2='401' y1='112.5' y2='401'/><line class='st1' x1='401' x2='112.5' y1='112.5' y2='401'/></g></g><g id='cross_copy'><path d='M268.064,256.75l138.593-138.593c3.124-3.124,3.124-8.189,0-11.313c-3.125-3.124-8.189-3.124-11.314,0L256.75,245.436   L118.157,106.843c-3.124-3.124-8.189-3.124-11.313,0c-3.125,3.124-3.125,8.189,0,11.313L245.436,256.75L106.843,395.343   c-3.125,3.125-3.125,8.189,0,11.314c1.562,1.562,3.609,2.343,5.657,2.343s4.095-0.781,5.657-2.343L256.75,268.064l138.593,138.593   c1.563,1.562,3.609,2.343,5.657,2.343s4.095-0.781,5.657-2.343c3.124-3.125,3.124-8.189,0-11.314L268.064,256.75z'/></g></svg>");
	display: block;
	width: 16px;
	height: 16px;
}

.filter__choices span {
	color: #000;
	font-family: 'Gilroy';
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	padding: 10px;
}

.filter__item {
	background-color: #F6F6F6;
	padding: 10px;
	display: flex;
	align-items: center;
}

.filter__item button {
	margin-left: 10px;
}

/* --- woodworking --- */

.woodworking .title-3::after {
	background-color: #93614F;
}

.search-item {
	border-color: #93614F;
	height: 100%;
}

.search-item__footer {
	justify-content: space-between;
	margin-top: auto;
	min-height: 66px;
	background-color: #93614F;
}

/* --- light --- */

.light .title-3::after {
	background-color: #6BA5B1;
}

.light .search-item {
	border-color: #6BA5B1;
}

.light .search-item__footer {
	background-color: #6BA5B1;
}

/* --- glass --- */

.glass .title-3::after {
	background-color: #44B1E3;
}

.glass .search-item {
	border-color: #44B1E3;
}

.glass .search-item__footer {
	background-color: #44B1E3;
}

/* --- industrial --- */

.industrial .title-3::after {
	background-color: #E08538;
}

.industrial .search-item {
	border-color: #E08538;
}

.industrial .search-item__footer {
	background-color: #E08538;
}

/* --- glass --- */

.food .title-3::after {
	background-color: #F6CE46;
}

.food .search-item {
	border-color: #F6CE46;
}

.food .search-item__footer {
	background-color: #F6CE46;
}

/* --- glass --- */

.information .title-3::after {
	background-color: #B2B3B3;
}

.information .search-item {
	border-color: #B2B3B3;
}

.information .search-item__footer {
	background-color: #B2B3B3;
}

/*search-slider*/
.search-slider {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.search-slider__slide {
	width: 100%;
	height: 100%;
	padding-top: 315px;
}

.search-slider__title {
	color: #FFF;
	text-align: center;
	max-width: 910px;
	width: 100%;
	margin-inline: auto;
	font-family: KyivTypeTitling;
	font-size: 61px;
	font-weight: 500;
	text-transform: uppercase;
}

.search-slider__text {
	max-width: 475px;
	width: 100%;
	margin-inline: auto;
	margin-top: 40px;
	color: #FFF;
	text-align: center;
	font-family: 'Gilroy';
	font-size: 14px;
	font-weight: 500;
	line-height: 150%;
}

.search-slider__slide_1 {
	background-image: url("../static/search/search-img.png");
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.search-slider__slide_2 {
	background-image: url("../static/search/search-img.png");
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.search-slider__slide_3 {
	background-image: url("../static/search/search-img.png");
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.search-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 80px;
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-style: solid;
	border-width: 2px;
	border-color: #fff;
	border-radius: 50%;
}

.search-slider__prev {
	left: 15px;
}

.search-slider__next {
	right: 15px;
}

.swiper-button-disabled {
	opacity: 0.3;
}

/*info*/

.header .container-fluid {
	padding: 0;
}

.info-wrap .header {
	color: #000;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #D1D1D1;
}

.info-wrap .nav-link.active {
	font-weight: 700;
}

.info-wrap .navbar-toggler {
	align-items: center;
	border: none;
	padding: 0;
	width: 40px;
	height: 40px;
	display: none;
	justify-content: center;
}

.navbar-toggler {
	padding: 0;
}


body .info-about {
	padding-top: 130px !important;
	display: flex;
	justify-content: center;
	gap: 50px;
}

.info-about__left {
	width: 558px;
	height: 520px;
	border-radius: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #F6F6F6;
	flex-basis: 40%;
}

.info-about__left img,
.info-about__left svg {
	min-width: 90px;
}

.info-about__right {
	flex-basis: 45%;
}

.info-about__industry {
	color: #93614F;
	font-family: KyivTypeTitling;
	font-size: 18px;
	font-weight: 500;
	text-transform: uppercase;
}

.info-about__industry.ez {
	color: #6BA5B1;
}

.info-about__industry.glass {
	color: #44B1E3;
}

.info-about__industry.industrial {
	color: #E08538;
}

.info-about__industry.food {
	color: #F6CE46;
}

.info-about__industry.information {
	color: #B2B3B3;
}

.info-about__name {
	line-height: 120%;
	margin-top: 30px;
	color: #000;
	font-family: KyivTypeTitling;
	font-size: 40px;
	font-weight: 500;
	text-transform: uppercase;
}

.info-about__text {
	margin-top: 20px;
	color: #000;
	font-family: 'Gilroy';
	font-size: 18px;
	font-weight: 400;
	line-height: 144.444%;
}

.info-about__item {
	margin-top: 20px;
	color: #000;
	font-family: 'Gilroy';
	font-size: 18px;
	font-weight: 400;
	line-height: 144.444%;
}

.info-about__item span {
	font-weight: 700;
}

.info-about__btn {
	padding: 17px 116px;
	border-style: solid;
	border-width: 1px;
	border-color: #000;
	border-radius: 10px;
	margin-top: 50px;

	color: #000;
	font-family: 'Gilroy';
	font-size: 18px;
	font-weight: 500;
	line-height: 144.444%;
}

.info-slider {
	padding-top: 10px;
	padding-bottom: 110px;
}

.info-slider {
	position: relative;
}

.mySwiper {
	overflow: visible;
}

.mySwiper__slide {
	width: 553px;
	border-radius: 20px;
	overflow: hidden;
}

.mySwiper__slide img {
	width: 100%;
	height: 100%;
	display: block;
}

.mySwiper .swiper-pagination {
	position: absolute;
	left: 50%;
	bottom: -26%;
	z-index: 2;
	transform: translate(-50%, -50%);

	color: #000;
	font-family: KyivTypeTitling;
	font-size: 20px;
	font-weight: 500;
	text-transform: uppercase;

}

.mySwiper__arrow {
	position: absolute;
	bottom: -30%;
	transform: translateY(-50%);
	z-index: 2;
	width: 80px;
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-style: solid;
	border-width: 2px;
	border-color: #000;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color 0.5s;
}

.mySwiper__arrow:hover {
	background-color: #E6E6E6;
}

.mySwiper__arrow path {
	fill: #000;
}

.mySwiper__prev {
	left: 50%;
	transform: translateX(-200px);
}

.mySwiper__next {
	right: 50%;
	transform: translateX(200px);
}

.swiper-button-disabled {
	opacity: 0.3;
}

.info-slider__title {
	color: #000;
	font-family: KyivTypeTitling;
	font-size: 40px;
	font-weight: 500;
	text-transform: uppercase;
}

.filter__caption {
	text-align: left;
	font-size: 25px;
	margin-bottom: 0;
	font-family: 'gilroy';
	width: 300px;
	text-align: center;
}

.filter-wrapper {
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
}

.filter__list {
	cursor: pointer;
	position: relative;
	border-style: solid;
	border-width: 1px;
	border-color: #000;
	display: flex;
	border-radius: 5px;
	padding: 4px 0 7px;
	align-items: center;
	justify-content: center;
}

.filter__list_1:hover .jsList1 {
	display: flex;
}

.filter__list_2:hover .jsList2 {
	display: flex;
}

.jsList1,
.jsList2 {
	height: 400px;
	overflow-y: scroll;
}

.dropdownTrigger.clicked {
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
}

.dropdownContent.clicked {
	display: flex;
}

.filter__list ul {
	position: absolute;
	top: 101%;
	left: 0;
	background-color: #fff;
	box-shadow: 7px 9px 15px 5px rgba(0, 0, 0, 0.10);
	gap: 10px;
	flex-direction: column;
	width: 300px;
	padding: 10px;
	border-radius: 5px;
	border-top-left-radius: 0;
	z-index: 3;
	display: none;
	transition: display var(--transition);
}

.filter__list ul li {
	padding: 4px 8px;
	border-style: solid;
	border-width: 1px;
	border-color: #000;
	border-radius: 5px;
	cursor: pointer;
	transition: box-shadow 0.2s;
}

.filter__list ul li.active {
	background-color: #000;
	color: #fff;
}

.filter__list ul li:hover{
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.d-none-custom {
	display: none;
}

.europe-flex,
.moldova-flex,
.usa-flex,
.canada-flex,
.greatbritain-flex,
.australia-flex,
.turkey-flex,
.sweden-flex,
.germany-flex,
.belgium-flex,
.africa-flex,
.southamerica-flex,
.france-flex,
.italy-flex,
.slovakia-flex,
.latvia-flex,
.lithuania-flex,
.macedonia-flex,
.romania-flex,
.hungary-flex,
.eustonia-flex, 
.spain-flex,
.finland-flex,
.bulgaria-flex,
.china-flex,
.uae-flex,
.kazakhstan-flex,
.uzbekistan-flex,
.azerbaijan-flex,
.netherlands-flex,
.israel-flex,
.holland-flex,
.croatia-flex,
.austria-flex,
.jordan-flex,
.greece-flex,
.cyprus-flex,
.czech-flex,
.asia-flex,
.georgia-flex,
.moldova-flex,
.kazakhstan-flex,
.d-flex {
	display: flex; 
}

.d-block,
.woodworking-flex,
.light-flex,
.glass-flex,
.industrial-flex,
.food-flex,
.information-flex {
	display: block;
}

.navbar-toggler.close-btn {
	width: 40px;
	height: 40px;
}

.black-fill {
	width: 100%;
	height: 100%;
}

.black-fill path {
	fill: #000;
}

.filterBtn {
	width: 300px;
	text-align: center;
	padding-block: 5px 6px;
	font-size: 25px;
	line-height: 48px;
	border-style: solid;
	border-width: 1px;
	border-color: #000;
	border-radius: 10px;
	opacity: 0.4;
	transition: opacity 0.3s;
}

.navbar-toggler {
	border: none !important;
}

.filterBtn:hover {
	opacity: 1;
}

.catalog-download {
	color: #fff;
	margin-top: 20px;
}

.countryJs,
.industrialJs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.fill-red {
	fill: #E40420 !important;
}

.swiper * {
	-ms-user-select: none;
	user-select: none;
}

.swiper-wrapper {
	align-items: center;
}