@import 'mixins';
@import 'variables';

body {
	background-color: #f8f7f3;
}
.page-data {
	overflow: hidden;
}

.container {
	@include respond-above(xxl) {
		max-width: 1530px;
	}
}

.h2 {
	font-size: 50px;
	font-weight: 250;
	line-height: 1;
	letter-spacing: 2px;
	font-family: $font3;

	@include respond-below(xs) {
		font-size: 34px;
	}
}
.h3 {
	font-size: 34px;
	font-weight: 300;
	line-height: 1;
	letter-spacing: 2px;
	font-family: $font3;
	color: #1d1d1e;

	@include respond-below(xs) {
		font-size: 24px;
	}
}
.h4 {
	font-size: 24px;
	font-weight: 300;
	line-height: 1;
	letter-spacing: 2px;
	font-family: $font3;
	color: #1d1d1e;
}

.p {
	font-size: 16px;
	font-weight: 300;
	line-height: 24.8px;

	strong {
		font-weight: 700;
	}
}

.box-mb {
	margin-bottom: 120px;
	@include respond-below(xs) {
		margin-bottom: 60px;
	}
}

#scontainer-148 {
	@extend .box-mb;

	h2 {
		@extend .h2;
		text-transform: uppercase;
		margin-bottom: 48px;
		padding-bottom: 48px;
		border-bottom: 1px solid #000000;

		@include respond-below(sm) {
			margin-bottom: 30px;
			padding-bottom: 30px;
		}
	}

	p {
		@extend .h3;
		text-transform: uppercase;
		margin-bottom: 0;
	}

	.col-left {
		max-width: 560px;

		@include respond-below(sm) {
			margin-bottom: 30px;
		}
	}
}

#scontainer-149 {
	@extend .box-mb;

	p {
		color: #ffffff;
		font-size: 24px;
		font-weight: 300;
		letter-spacing: 2px;
		text-align: center;
		text-transform: uppercase;
		margin-bottom: 40px;

		@include respond-below(xs) {
			margin-bottom: 20px;
		}
	}
	.row {
		&-1 {
			margin-bottom: 40px;

			ul {
				padding: 0;
				margin: 0;
				list-style: none;

				display: flex;
				flex-direction: row;
				justify-content: center;
				flex-wrap: wrap;
				gap: 8px;

				li {
					a {
						color: #fff;
						font-size: 14px;
						font-weight: 700;
						letter-spacing: 1px;
						text-transform: uppercase;
						display: flex;
						align-items: center;
						padding: 18px 35px;
						background: #1d1d1e;
					}
				}
			}
		}

		&-2 {
			justify-content: center;

			> div {
				margin-bottom: 20px;
				padding: 0 10px;

				> div {
					padding: 70px 40px;
					background: #1d1d1e;
					height: 100%;

					@include respond-below(xs) {
						padding: 40px 10px;
					}
				}
			}

			ul {
				padding: 0;
				margin: 0;
				list-style: none;
				display: flex;
				justify-content: center;
				flex-direction: row;
				gap: 8px;

				li {
					&:nth-child(1) {
						a {
							background: #dfdfdf;

							&::after {
								content: url('/upload/filemanager/icon/file.svg');
							}
						}
					}
					&:nth-child(2) {
						a {
							background: #fff;

							&::after {
								content: url('/upload/filemanager/icon/see.svg');
							}
						}
					}

					a {
						font-size: 14px;
						font-weight: 700;
						letter-spacing: 1px;
						text-transform: uppercase;

						display: flex;
						align-items: center;
						gap: 10px;
						position: relative;
						padding: 18px 35px;

						&::after {
							height: 24px;
							width: 24px;
						}

						&:hover {
							color: #1d1d1e;
						}

						@include respond-below(xs) {
							padding: 15px;
						}
					}
				}
			}
		}
	}
}