:root {
	--spacing-desktop: 50px;
	--spacing-mobile: 20px;

	--brochure-item-width: 300px;

	--main-bg-color: #fff;
	--main-text-color: #000000;
	--default-btn-color: #fff;
	--default-btn-bg: #000;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html,
body {
	width: 100%;
	background-color: var(--main-bg-color);
	color: var(--main-text-color);
	font-family: "Poppins", sans-serif;
}

/* header */
#header {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	padding: 20px var(--spacing-desktop);
}

#header.divider:after {
	content: ' ';
	position: absolute;
	bottom: 0;
	left: var(--spacing-desktop);
	right: var(--spacing-desktop);
	height: 1px;
	background-color: #000000;
}

#header .logo {
	width: auto;
	height: 100%;
	max-width: 300px;
	max-height: 74px;
}

#header .text {
	font-weight: 400;
	font-size: 30px;
	font-family: inherit;
}

@media(max-width:768px) {
	#header {
		padding: 20px var(--spacing-mobile);
	}

	#header .logo {
		height: 34px;
	}

	#header .text {
		font-size: 20px;
	}

	#header.divider:after {
		left: var(--spacing-mobile);
		right: var(--spacing-mobile);
	}
}

/* end of header */


.main_content {
	padding: 30px var(--spacing-desktop);
}

@media(max-width:768px) {
	.main_content {
		padding: 20px var(--spacing-mobile);
	}
}


/* text section */
section#text_section {
	margin-bottom: 50px;
}

#title {
	font-weight: 400;
	font-size: 30px;
	font-family: inherit;
}

#description {
	font-weight: 400;
	font-size: 18px;
	font-family: inherit;
}

@media(max-width:768px) {
	section#text_section {
		margin-bottom: 20px;
	}

	#title {
		font-size: 20px;
	}

	#description {
		font-size: 14px;
	}
}

/* end of text section*/


/* brochures section */
section#brochures_section {
	display: flex;
	gap: 50px;
}

@media(max-width:768px) {
	section#brochures_section {
		flex-direction: column;
		gap: 20px;
	}
}

/* end of brochures section */


/* collections filter */
#collections_filter {
	display: flex;
	flex-direction: column;
	gap: 20px;
	flex-shrink: 0;
	width: 300px;
	list-style-type: none;
}

@media(max-width:768px) {
	#collections_filter {
		gap: 10px;
		width: 100%;
	}
}

/* end of collections filter */


/* brochures list */
#brochures_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	flex-grow: 1;
	gap: 50px 30px;
	list-style-type: none;
}

#brochures_list .brochure-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	width: var(--brochure-item-width);
}

#brochures_list .brochure-item .brochure-link {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	flex-grow: 1;
	gap: 10px;
	width: min-content;
	max-width: 100%;
	margin: 0 auto;
	text-decoration: none;
	cursor: pointer;
}

#brochures_list .brochure-item img {
	max-height: 300px;
	width: auto;
	height: auto;
	border-radius: 15px;
	object-fit: contain;
	object-position: center;
	box-shadow: 0px 0px 3px 0px #83838338;
}

#brochures_list .brochure-item p {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 60px;
	font-weight: 400;
	font-size: 20px;
	font-family: inherit;
	text-align: center;
	cursor: pointer;
}

#brochures_list .brochure-item .brochure-actions {
	display: flex;
	gap: 10px;
	width: 100%;
}

#brochures_list .brochure-item .brochure-actions .read-btn,
#brochures_list .brochure-item .brochure-actions .download-btn {
	display: flex;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	width: 100%;
	padding: 1px 10px;
	border: none;
	border-radius: 5px;
	background-color: var(--default-btn-bg);
	color: var(--default-btn-color);
	font-weight: 400;
	font-size: 18px;
	font-family: inherit;
	text-align: center;
	cursor: pointer;
}
@media(max-width:768px) {
	#brochures_list {
		gap: 20px;
	}

	#brochures_list .brochure-item {
		width: 47%;
	}
	
	#brochures_list .brochure-item .brochure-link {
		gap: 5px;
		width: unset;
	}

	#brochures_list .brochure-item img {
		width: 100%;
	}

	#brochures_list .brochure-item p {
		font-size: 16px;
	}

	#brochures_list .brochure-item .brochure-actions {
		gap: 5px;
		flex-wrap: wrap;
	}

	#brochures_list .brochure-item .brochure-actions .read-btn,
	#brochures_list .brochure-item .brochure-actions .download-btn {
		font-size: 14px;
	}
	
}

/* end of brochures list */

.hide {
	display: none !important;
}

.checkbox_group {
	display: flex;
	align-items: baseline;
	gap: 9px;
}

.checkbox_group .colection_checkbox {
	flex-shrink: 0;
}

input[type="checkbox"].colection_checkbox {
	appearance: none;
	display: grid;
	place-content: center;
	width: 27px;
	height: 27px;
	border: 1px solid #000000;
	border-radius: 3px;
	background-color: #ffffff;
	color: #000000;
	cursor: pointer;
}

input[type="checkbox"].colection_checkbox::before {
	content: "";
	width: 13px;
	height: 10px;
	transform: scale(0);
	transform-origin: center;
	transition: transform 120ms ease-in-out;
	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxNSAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE0LjA1NjYgMS4yMDYwNUw0Ljc2NzU4IDEwLjQ5NDFMNC43Njg1NSAxMC40OTUxTDQuNDE0MDYgMTAuODQ4NkwwLjc5Nzg1MiA3LjIzMjQyTDEuMTUxMzcgNi44Nzg5MUw0LjQxNDA2IDEwLjE0MDZMMTMuNzAzMSAwLjg1MjUzOUwxNC4wNTY2IDEuMjA2MDVaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNMTQuMDU2NiAxLjIwNjA1TDE0LjQxMDIgMS41NTk2M0wxNC43NjM4IDEuMjA2MDdMMTQuNDEwMiAwLjg1MjUwMUwxNC4wNTY2IDEuMjA2MDVaTTQuNzY3NTggMTAuNDk0MUw0LjQxNDA0IDEwLjE0MDZMNC4wNjA0NSAxMC40OTQxTDQuNDE0MDIgMTAuODQ3N0w0Ljc2NzU4IDEwLjQ5NDFaTTQuNzY4NTUgMTAuNDk1MUw1LjEyMTYyIDEwLjg0OTJMNS40NzYxNSAxMC40OTU2TDUuMTIyMTEgMTAuMTQxNkw0Ljc2ODU1IDEwLjQ5NTFaTTQuNDE0MDYgMTAuODQ4Nkw0LjA2MDUxIDExLjIwMjJMNC40MTM1OCAxMS41NTUzTDQuNzY3MTMgMTEuMjAyN0w0LjQxNDA2IDEwLjg0ODZaTTAuNzk3ODUyIDcuMjMyNDJMMC40NDQyOTggNi44Nzg4N0wwLjA5MDc0NDggNy4yMzI0MkwwLjQ0NDI5OCA3LjU4NTk4TDAuNzk3ODUyIDcuMjMyNDJaTTEuMTUxMzcgNi44Nzg5MUwxLjUwNDg3IDYuNTI1M0wxLjE1MTMxIDYuMTcxODVMMC43OTc4MTQgNi41MjUzNUwxLjE1MTM3IDYuODc4OTFaTTQuNDE0MDYgMTAuMTQwNkw0LjA2MDU2IDEwLjQ5NDJMNC40MTQxIDEwLjg0NzdMNC43Njc2IDEwLjQ5NDJMNC40MTQwNiAxMC4xNDA2Wk0xMy43MDMxIDAuODUyNTM5TDE0LjA1NjcgMC40OTg5ODZMMTMuNzAzMSAwLjE0NTQ1MUwxMy4zNDk2IDAuNDk4OTY3TDEzLjcwMzEgMC44NTI1MzlaTTE0LjA1NjYgMS4yMDYwNUwxMy43MDMxIDAuODUyNDgzTDQuNDE0MDQgMTAuMTQwNkw0Ljc2NzU4IDEwLjQ5NDFMNS4xMjExMSAxMC44NDc3TDE0LjQxMDIgMS41NTk2M0wxNC4wNTY2IDEuMjA2MDVaTTQuNzY3NTggMTAuNDk0MUw0LjQxNDAyIDEwLjg0NzdMNC40MTUgMTAuODQ4N0w0Ljc2ODU1IDEwLjQ5NTFMNS4xMjIxMSAxMC4xNDE2TDUuMTIxMTMgMTAuMTQwNkw0Ljc2NzU4IDEwLjQ5NDFaTTQuNzY4NTUgMTAuNDk1MUw0LjQxNTQ5IDEwLjE0MTFMNC4wNjEgMTAuNDk0Nkw0LjQxNDA2IDEwLjg0ODZMNC43NjcxMyAxMS4yMDI3TDUuMTIxNjIgMTAuODQ5Mkw0Ljc2ODU1IDEwLjQ5NTFaTTQuNDE0MDYgMTAuODQ4Nkw0Ljc2NzYyIDEwLjQ5NTFMMS4xNTE0IDYuODc4ODdMMC43OTc4NTIgNy4yMzI0MkwwLjQ0NDI5OCA3LjU4NTk4TDQuMDYwNTEgMTEuMjAyMkw0LjQxNDA2IDEwLjg0ODZaTTAuNzk3ODUyIDcuMjMyNDJMMS4xNTE0IDcuNTg1OThMMS41MDQ5MiA3LjIzMjQ2TDEuMTUxMzcgNi44Nzg5MUwwLjc5NzgxNCA2LjUyNTM1TDAuNDQ0Mjk4IDYuODc4ODdMMC43OTc4NTIgNy4yMzI0MlpNMS4xNTEzNyA2Ljg3ODkxTDAuNzk3ODY3IDcuMjMyNTFMNC4wNjA1NiAxMC40OTQyTDQuNDE0MDYgMTAuMTQwNkw0Ljc2NzU2IDkuNzg3MDJMMS41MDQ4NyA2LjUyNTNMMS4xNTEzNyA2Ljg3ODkxWk00LjQxNDA2IDEwLjE0MDZMNC43Njc2IDEwLjQ5NDJMMTQuMDU2NyAxLjIwNjExTDEzLjcwMzEgMC44NTI1MzlMMTMuMzQ5NiAwLjQ5ODk2N0w0LjA2MDUzIDkuNzg3MDVMNC40MTQwNiAxMC4xNDA2Wk0xMy43MDMxIDAuODUyNTM5TDEzLjM0OTYgMS4yMDYwOUwxMy43MDMxIDEuNTU5NjFMMTQuMDU2NiAxLjIwNjA1TDE0LjQxMDIgMC44NTI1MDFMMTQuMDU2NyAwLjQ5ODk4NkwxMy43MDMxIDAuODUyNTM5WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==);
	background-repeat: no-repeat;
	background-size: contain;
}

input[type="checkbox"].colection_checkbox:checked::before {
	transform: scale(1);
}

.collection_label {
	font-weight: 400;
	font-size: 18px;
	font-family: inherit;
}

@media(max-width:768px) {
	.collection_label {
		font-size: 14px;
	}
}