@charset "UTF-8";

:root {
	/* Core Colors */
	--primary: #7a6f58;
	/* Darker for better contrast */
	--primary-light: #b0a890;
	--primary-dark: #5d5446;
	--accent: #d4a373;
	--accent-hover: #c6935f;
	--secondary: #3c4035;
	--text: #333;
	--light: #f9f9f9;
	--dark-mode-bg: #2a2d2e;
	--dark-mode-text: #d0d0d0;
	/* Улучшенный контраст */

	/* Modern Additions */
	--highlight: #ff9f55;
	/* Яркий акцент для CTA */
	--seasonal: #8bc34a;
	/* Сезонный цвет для акций */
	/* Typography */

	--fluid-min: 1rem;
	--fluid-max: 1.2rem;
	--fluid-range: calc(var(--fluid-max) - var(--fluid-min));
	--vw: 100vw;
	--line-height: 1.6;

	/* Spacing and Sizing */
	--spacing-xs: 0.25rem;
	--spacing-sm: 0.5rem;
	--spacing-md: 1rem;
	--spacing-lg: 2rem;
	--card-width: min(300px, 100%);
	--border-radius: 0.5rem;
}

*,
*::before,
*::after {
	box-sizing: border-box
}

html {
	font-family: sans-serif;
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: transparent
}

article,
aside,
footer,
header,
main,
nav,
section {
	display: block
}

body {
	font-family: Roboto, "Open Sans", sans-serif;
	color: var(--dark);
	background: var(--white);
	line-height: 1.4;
	font-weight: 400;
	margin: 0
}

[tabindex="-1"]:focus {
	outline: 0
}

.btn {
	display: inline-block;
	font-weight: 700;
	color: var(--dark);
	text-align: center;
	vertical-align: middle;
	user-select: none;
	background: transparent;
	border: 1px solid transparent;
	padding: .67rem 1rem;
	font-size: .875rem;
	line-height: 1.5;
	border-radius: 0.4rem;
	transition: all .2s ease-in-out
}

.btn-gray {
	color: #1e2022;
	background: var(--gray);
	border-color: var(--gray)
}

.btn-gray:hover {
	color: #1e2022;
	background: #dae5f5;
	border-color: #d0def2
}

.btn-gray:focus,
.btn-gray.focus {
	box-shadow: 0 0 0 .2rem rgba(215, 217, 220, .5)
}

.btn-gray.disabled,
.btn-gray:disabled {
	color: #1e2022;
	background: var(--gray);
	border-color: var(--gray)
}

.btn-gray:not(:disabled):not(.disabled):active,
.btn-gray:not(:disabled):not(.disabled).active,
.show>.btn-gray.dropdown-toggle {
	color: #1e2022;
	background: #d0def2;
	border-color: #c6d7ef
}

.btn-gray:not(:disabled):not(.disabled):active:focus,
.btn-gray:not(:disabled):not(.disabled).active:focus,
.show>.btn-gray.dropdown-toggle:focus {
	box-shadow: 0 0 0 .2rem rgba(215, 217, 220, .5)
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0;
	font-weight: 400; color: #7a6f58;
}
h1{
	font-weight: 300; 
}

h1,
h2,
h3,
h4 {
	margin-bottom: .9rem
}

#to-h1 {
	padding: 1rem 0 .5rem;
	background: var(--light);
}

h1,
.h1 {
	font-size: 1.7rem;
	line-height: 0.9
}

h2,
.h2 {
	font-size: 1.65rem;
	line-height: 1.1
}

h3,
.h3 {
	font-size: 1.5rem;
	line-height: 1.1
}

h4,
.h4 {
	font-size: 1.35rem
}

h5,
.h5 {
	font-size: 1.12rem
}

h6,
.h6 {
	font-size: 1rem
}

p {
	margin: 0 0 1.5rem
}

b,
strong {
	font-weight: bolder
}

small {
	font-size: 80%
}

h2 small {
	font-size: 65%;
	font-weight: 300
}

a {
	color: var(--primary);
	text-decoration: none;
	background: transparent
}

a:hover {
	color: var(--primary-4);
	text-decoration: none
}

a:not([href]):not([tabindex]) {
	color: inherit;
	text-decoration: none
}

a:not([href]):not([tabindex]):hover,
a:not([href]):not([tabindex]):focus {
	color: inherit;
	text-decoration: none
}

a:not([href]):not([tabindex]):focus {
	outline: 0
}

img,
svg {
	vertical-align: middle;
	border-style: none
}

svg {
	overflow: hidden
}

details summary {
	cursor: pointer
}

button:focus {
	outline: 1px dotted;
	outline: 5px auto -webkit-focus-ring-color
}

input,
button,
select,
optgroup,
textarea {
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit
}

button,
input {
	overflow: visible
}

button,
select {
	text-transform: none
}

select {
	word-wrap: normal
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button
}

button:not(:disabled),
[type="button"]:not(:disabled),
[type="reset"]:not(:disabled),
[type="submit"]:not(:disabled) {
	cursor: pointer
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	padding: 0;
	border-style: none
}

input[type="text"],
input[type="number"],
select {
	border: 1px solid rgb(145, 145, 145);
	border-radius: 0.4rem;
}

input[type="radio"],
input[type="checkbox"] {
	box-sizing: border-box;
	padding: 0
}

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
	-webkit-appearance: listbox
}

textarea {
	overflow: auto;
	resize: vertical
}

[hidden] {
	display: none
}

hr {
	margin: 1rem 0;
	border: 0;
	border-top: 1px solid var(--border)
}

small,
.small {
	font-size: 80%;
	font-weight: 400
}

mark,
.mark {
	padding: .2em;
	background: #fcf8e3
}

.list-unstyled {
	padding-left: 0;
	list-style: none
}

.img-fluid {
	max-width: 100%;
	height: auto
}

.img-thumbnail {
	padding: .25rem;
	background: var(--white);
	border: 1px solid var(--border);
	border-radius: .3125rem;
	max-width: 100%;
	height: auto
}

.breadcrumb {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	margin-bottom: .5rem;
	list-style: none;
	background: transparent;
	border-radius: .313rem
}

.breadcrumb li {
	padding-left: .3rem;
	font-size: .75rem
}

.breadcrumb li::before {
	display: inline-block;
	padding-right: .3rem;
	color: var(--dark);
	content: "/"
}

.breadcrumb li :hover::before {
	text-decoration: none
}

.breadcrumb li .active {
	color: var(--dark)
}

.breadcrumb li a {
	font-size: .75rem
}

.container {
	width: 100%;
	padding: 0 15px;
	margin: 0 auto
}

@media (min-width:576px) {
	.container {
		max-width: 540px
	}
}

@media (min-width:768px) {
	.container {
		max-width: 720px
	}
}

@media (min-width:992px) {
	.container {
		max-width: 960px
	}
}

@media (min-width:1200px) {
	.container {
		max-width: 1200px
	}
}

@media (min-width:1480px) {
	.container {
		max-width: 1430px
	}
}

/*
@media (min-width:1600px) {
	.container {
		max-width: 1550px
	}
}*/

.container-fluid {
	width: 100%;
	padding: 0 15px;
	margin: 0 auto
}

.row {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -15px
}

.no-gutters {
	margin: 0
}

.no-gutters>.col,
.no-gutters>[class*="col-"] {
	padding: 0
}

.col,
.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col-auto,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm,
.col-sm-auto,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md,
.col-md-auto,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg,
.col-lg-auto,
.col-xl-1,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl,
.col-xl-auto,
.col-wd-1,
.col-wd-2,
.col-wd-3,
.col-wd-4,
.col-wd-5,
.col-wd-6,
.col-wd-7,
.col-wd-8,
.col-wd-9,
.col-wd-10,
.col-wd-11,
.col-wd-12,
.col-wd,
.col-wd-auto {
	position: relative;
	width: 100%;
	padding: 0 15px
}

.col {
	flex-basis: 0;
	flex-grow: 1;
	max-width: 100%
}

.col-auto {
	flex: 0 0 auto;
	width: auto;
	max-width: 100%
}

.col-1 {
	flex: 0 0 8.33333%;
	max-width: 8.33333%
}

.col-2 {
	flex: 0 0 16.66667%;
	max-width: 16.66667%
}

.col-3 {
	flex: 0 0 25%;
	max-width: 25%
}

.col-4 {
	flex: 0 0 33.33333%;
	max-width: 33.33333%
}

.col-5 {
	flex: 0 0 41.66667%;
	max-width: 41.66667%
}

.col-6 {
	flex: 0 0 50%;
	max-width: 50%
}

.col-7 {
	flex: 0 0 58.33333%;
	max-width: 58.33333%
}

.col-8 {
	flex: 0 0 66.66667%;
	max-width: 66.66667%
}

.col-9 {
	flex: 0 0 75%;
	max-width: 75%
}

.col-10 {
	flex: 0 0 83.33333%;
	max-width: 83.33333%
}

.col-11 {
	flex: 0 0 91.66667%;
	max-width: 91.66667%
}

.col-12 {
	flex: 0 0 100%;
	max-width: 100%
}

.order-first {
	order: -1
}

.order-last {
	order: 13
}

.order-0 {
	order: 0
}

.order-1 {
	order: 1
}

.order-2 {
	order: 2
}

.order-3 {
	order: 3
}

.offset-1 {
	margin-left: 8.33333%
}

.offset-2 {
	margin-left: 16.66667%
}

.offset-3 {
	margin-left: 25%
}

.offset-4 {
	margin-left: 33.33333%
}

.offset-5 {
	margin-left: 41.66667%
}

@media (min-width:576px) {
	.col-sm {
		flex-basis: 0;
		flex-grow: 1;
		max-width: 100%
	}

	.col-sm-auto {
		flex: 0 0 auto;
		width: auto;
		max-width: 100%
	}

	.col-sm-1 {
		flex: 0 0 8.33333%;
		max-width: 8.33333%
	}

	.col-sm-2 {
		flex: 0 0 16.66667%;
		max-width: 16.66667%
	}

	.col-sm-3 {
		flex: 0 0 25%;
		max-width: 25%
	}

	.col-sm-4 {
		flex: 0 0 33.33333%;
		max-width: 33.33333%
	}

	.col-sm-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%
	}

	.col-sm-6 {
		flex: 0 0 50%;
		max-width: 50%
	}

	.col-sm-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%
	}

	.col-sm-8 {
		flex: 0 0 66.66667%;
		max-width: 66.66667%
	}

	.col-sm-9 {
		flex: 0 0 75%;
		max-width: 75%
	}

	.col-sm-10 {
		flex: 0 0 83.33333%;
		max-width: 83.33333%
	}

	.col-sm-11 {
		flex: 0 0 91.66667%;
		max-width: 91.66667%
	}

	.col-sm-12 {
		flex: 0 0 100%;
		max-width: 100%
	}

	.order-sm-first {
		order: -1
	}

	.order-sm-last {
		order: 13
	}

	.order-sm-0 {
		order: 0
	}

	.order-sm-1 {
		order: 1
	}

	.order-sm-2 {
		order: 2
	}

	.order-sm-3 {
		order: 3
	}

	.order-sm-4 {
		order: 4
	}

	.order-sm-5 {
		order: 5
	}

	.order-sm-6 {
		order: 6
	}

	.order-sm-7 {
		order: 7
	}

	.order-sm-8 {
		order: 8
	}

	.order-sm-9 {
		order: 9
	}

	.order-sm-10 {
		order: 10
	}

	.order-sm-11 {
		order: 11
	}

	.order-sm-12 {
		order: 12
	}

	.offset-sm-0 {
		margin-left: 0
	}

	.offset-sm-1 {
		margin-left: 8.33333%
	}

	.offset-sm-2 {
		margin-left: 16.66667%
	}

	.offset-sm-3 {
		margin-left: 25%
	}

	.offset-sm-4 {
		margin-left: 33.33333%
	}

	.offset-sm-5 {
		margin-left: 41.66667%
	}
}

@media (min-width:768px) {
	.col-md-auto {
		flex: 0 0 auto;
		width: auto;
		max-width: 100%
	}

	.col-md-1 {
		flex: 0 0 8.33333%;
		max-width: 8.33333%
	}

	.col-md-2 {
		flex: 0 0 16.66667%;
		max-width: 16.66667%
	}

	.col-md-3 {
		flex: 0 0 25%;
		max-width: 25%
	}

	.col-md-4 {
		flex: 0 0 33.33333%;
		max-width: 33.33333%
	}

	.col-md-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%
	}

	.col-md-6 {
		flex: 0 0 50%;
		max-width: 50%
	}

	.col-md-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%
	}

	.col-md-8 {
		flex: 0 0 66.66667%;
		max-width: 66.66667%
	}

	.col-md-9 {
		flex: 0 0 75%;
		max-width: 75%
	}

	.col-md-10 {
		flex: 0 0 83.33333%;
		max-width: 83.33333%
	}

	.col-md-11 {
		flex: 0 0 91.66667%;
		max-width: 91.66667%
	}

	.col-md-12 {
		flex: 0 0 100%;
		max-width: 100%
	}

	.order-md-first {
		order: -1
	}

	.order-md-last {
		order: 13
	}

	.order-md-0 {
		order: 0
	}

	.order-md-1 {
		order: 1
	}

	.order-md-2 {
		order: 2
	}

	.order-md-3 {
		order: 3
	}

	.order-md-4 {
		order: 4
	}

	.offset-md-0 {
		margin-left: 0
	}

	.offset-md-1 {
		margin-left: 8.33333%
	}

	.offset-md-2 {
		margin-left: 16.66667%
	}

	.offset-md-3 {
		margin-left: 25%
	}

	.offset-md-4 {
		margin-left: 33.33333%
	}

	.offset-md-5 {
		margin-left: 41.66667%
	}
}

@media (min-width:992px) {
	.col-lg {
		flex-basis: 0;
		flex-grow: 1;
		max-width: 100%
	}

	.col-lg-auto {
		flex: 0 0 auto;
		width: auto;
		max-width: 100%
	}

	.col-lg-1 {
		flex: 0 0 8.33333%;
		max-width: 8.33333%
	}

	.col-lg-2 {
		flex: 0 0 16.66667%;
		max-width: 16.66667%
	}

	.col-lg-3 {
		flex: 0 0 25%;
		max-width: 25%
	}

	.col-lg-4 {
		flex: 0 0 33.33333%;
		max-width: 33.33333%
	}

	.col-lg-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%
	}

	.col-lg-6 {
		flex: 0 0 50%;
		max-width: 50%
	}

	.col-lg-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%
	}

	.col-lg-8 {
		flex: 0 0 66.66667%;
		max-width: 66.66667%
	}

	.col-lg-9 {
		flex: 0 0 75%;
		max-width: 75%
	}

	.col-lg-10 {
		flex: 0 0 83.33333%;
		max-width: 83.33333%
	}

	.col-lg-11 {
		flex: 0 0 91.66667%;
		max-width: 91.66667%
	}

	.col-lg-12 {
		flex: 0 0 100%;
		max-width: 100%
	}

	.order-lg-first {
		order: -1
	}

	.order-lg-last {
		order: 13
	}

	.order-lg-0 {
		order: 0
	}

	.order-lg-1 {
		order: 1
	}

	.order-lg-2 {
		order: 2
	}

	.order-lg-3 {
		order: 3
	}

	.order-lg-4 {
		order: 4
	}
}

@media (min-width:992px) {
	.offset-lg-0 {
		margin-left: 0
	}

	.offset-lg-1 {
		margin-left: 8.33333%
	}

	.offset-lg-2 {
		margin-left: 16.66667%
	}

	.offset-lg-3 {
		margin-left: 25%
	}

	.offset-lg-4 {
		margin-left: 33.33333%
	}
}

@media (min-width:1200px) {
	.col-xl {
		flex-basis: 0;
		flex-grow: 1;
		max-width: 100%
	}

	.col-xl-auto {
		flex: 0 0 auto;
		width: auto;
		max-width: 100%
	}

	.col-xl-1 {
		flex: 0 0 8.33333%;
		max-width: 8.33333%
	}

	.col-xl-2 {
		flex: 0 0 16.66667%;
		max-width: 16.66667%
	}

	.col-xl-3 {
		flex: 0 0 25%;
		max-width: 25%
	}

	.col-xl-4 {
		flex: 0 0 33.33333%;
		max-width: 33.33333%
	}

	.col-xl-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%
	}

	.col-xl-6 {
		flex: 0 0 50%;
		max-width: 50%
	}

	.col-xl-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%
	}

	.col-xl-8 {
		flex: 0 0 66.66667%;
		max-width: 66.66667%
	}

	.col-xl-9 {
		flex: 0 0 75%;
		max-width: 75%
	}

	.col-xl-10 {
		flex: 0 0 83.33333%;
		max-width: 83.33333%
	}

	.col-xl-11 {
		flex: 0 0 91.66667%;
		max-width: 91.66667%
	}

	.col-xl-12 {
		flex: 0 0 100%;
		max-width: 100%
	}

	.order-xl-first {
		order: -1
	}

	.order-xl-last {
		order: 13
	}

	.order-xl-0 {
		order: 0
	}

	.order-xl-1 {
		order: 1
	}

	.order-xl-2 {
		order: 2
	}

	.order-xl-3 {
		order: 3
	}

	.order-xl-4 {
		order: 4
	}

	.order-xl-5 {
		order: 5
	}

	.order-xl-6 {
		order: 6
	}

	.order-xl-7 {
		order: 7
	}

	.order-xl-8 {
		order: 8
	}

	.order-xl-9 {
		order: 9
	}

	.order-xl-10 {
		order: 10
	}

	.order-xl-11 {
		order: 11
	}

	.order-xl-12 {
		order: 12
	}

	.offset-xl-0 {
		margin-left: 0
	}

	.offset-xl-1 {
		margin-left: 8.33333%
	}

	.offset-xl-2 {
		margin-left: 16.66667%
	}

	.offset-xl-3 {
		margin-left: 25%
	}

	.offset-xl-4 {
		margin-left: 33.33333%
	}

	.offset-xl-5 {
		margin-left: 41.66667%
	}

	.offset-xl-6 {
		margin-left: 50%
	}

	.offset-xl-7 {
		margin-left: 58.33333%
	}

	.offset-xl-8 {
		margin-left: 66.66667%
	}

	.offset-xl-9 {
		margin-left: 75%
	}

	.offset-xl-10 {
		margin-left: 83.33333%
	}

	.offset-xl-11 {
		margin-left: 91.66667%
	}
}

@media (min-width:1480px) {
	.col-wd {
		flex-basis: 0;
		flex-grow: 1;
		max-width: 100%
	}

	.col-wd-auto {
		flex: 0 0 auto;
		width: auto;
		max-width: 100%
	}

	.col-wd-1 {
		flex: 0 0 8.33333%;
		max-width: 8.33333%
	}

	.col-wd-2 {
		flex: 0 0 16.66667%;
		max-width: 16.66667%
	}

	.col-wd-3 {
		flex: 0 0 25%;
		max-width: 25%
	}

	.col-wd-4 {
		flex: 0 0 33.33333%;
		max-width: 33.33333%
	}

	.col-wd-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%
	}

	.col-wd-6 {
		flex: 0 0 50%;
		max-width: 50%
	}

	.col-wd-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%
	}

	.col-wd-8 {
		flex: 0 0 66.66667%;
		max-width: 66.66667%
	}

	.col-wd-9 {
		flex: 0 0 75%;
		max-width: 75%
	}

	.col-wd-10 {
		flex: 0 0 83.33333%;
		max-width: 83.33333%
	}

	.col-wd-11 {
		flex: 0 0 91.66667%;
		max-width: 91.66667%
	}

	.col-wd-12 {
		flex: 0 0 100%;
		max-width: 100%
	}

	.order-wd-first {
		order: -1
	}

	.order-wd-last {
		order: 13
	}

	.order-wd-0 {
		order: 0
	}

	.order-wd-1 {
		order: 1
	}

	.order-wd-2 {
		order: 2
	}

	.order-wd-3 {
		order: 3
	}

	.order-wd-4 {
		order: 4
	}

	.offset-wd-0 {
		margin-left: 0
	}

	.offset-wd-1 {
		margin-left: 8.33333%
	}

	.offset-wd-2 {
		margin-left: 16.66667%
	}

	.offset-wd-3 {
		margin-left: 25%
	}

	.offset-wd-4 {
		margin-left: 33.33333%
	}
}

/*Flex-start*/
.d-none {
	display: none !important
}

.d-inline {
	display: inline !important
}

.d-inline-block {
	display: inline-block !important
}

.d-block {
	display: block !important
}

.d-table {
	display: table !important
}

.d-table-row {
	display: table-row !important
}

.d-table-cell {
	display: table-cell !important
}

.d-flex {
	display: flex !important
}

.d-inline-flex {
	display: inline-flex !important
}

@media (min-width:576px) {
	.d-sm-none {
		display: none !important
	}

	.d-sm-inline {
		display: inline !important
	}

	.d-sm-inline-block {
		display: inline-block !important
	}

	.d-sm-block {
		display: block !important
	}

	.d-sm-table {
		display: table !important
	}

	.d-sm-table-row {
		display: table-row !important
	}

	.d-sm-table-cell {
		display: table-cell !important
	}

	.d-sm-flex {
		display: flex !important
	}

	.d-sm-inline-flex {
		display: inline-flex !important
	}

	.flex-sm-row {
		flex-direction: row !important
	}

	.flex-sm-column {
		flex-direction: column !important
	}

	.flex-sm-row-reverse {
		flex-direction: row-reverse !important
	}

	.flex-sm-column-reverse {
		flex-direction: column-reverse !important
	}

	.flex-sm-wrap {
		flex-wrap: wrap !important
	}

	.flex-sm-nowrap {
		flex-wrap: nowrap !important
	}

	.flex-sm-wrap-reverse {
		flex-wrap: wrap-reverse !important
	}

	.flex-sm-fill {
		flex: 1 1 auto !important
	}

	.flex-sm-grow-0 {
		flex-grow: 0 !important
	}

	.flex-sm-grow-1 {
		flex-grow: 1 !important
	}

	.flex-sm-shrink-0 {
		flex-shrink: 0 !important
	}

	.flex-sm-shrink-1 {
		flex-shrink: 1 !important
	}

	.justify-content-sm-start {
		justify-content: start !important
	}

	.justify-content-sm-end {
		justify-content: end !important
	}

	.justify-content-sm-center {
		justify-content: center !important
	}

	.justify-content-sm-between {
		justify-content: space-between !important
	}

	.justify-content-sm-around {
		justify-content: space-around !important
	}

	.align-items-sm-start {
		align-items: start !important
	}

	.align-items-sm-end {
		align-items: end !important
	}

	.align-items-sm-center {
		align-items: center !important
	}

	.align-items-sm-baseline {
		align-items: baseline !important
	}

	.align-items-sm-stretch {
		align-items: stretch !important
	}

	.align-content-sm-start {
		align-content: start !important
	}

	.align-content-sm-end {
		align-content: end !important
	}

	.align-content-sm-center {
		align-content: center !important
	}

	.align-content-sm-between {
		align-content: space-between !important
	}

	.align-content-sm-around {
		align-content: space-around !important
	}

	.align-content-sm-stretch {
		align-content: stretch !important
	}

	.align-self-sm-auto {
		align-self: auto !important
	}

	.align-self-sm-start {
		align-self: start !important
	}

	.align-self-sm-end {
		align-self: end !important
	}

	.align-self-sm-center {
		align-self: center !important
	}

	.align-self-sm-baseline {
		align-self: baseline !important
	}

	.align-self-sm-stretch {
		align-self: stretch !important
	}
}

@media (min-width:768px) {
	.d-md-none {
		display: none !important
	}

	.d-md-inline {
		display: inline !important
	}

	.d-md-inline-block {
		display: inline-block !important
	}

	.d-md-block {
		display: block !important
	}

	.d-md-table {
		display: table !important
	}

	.d-md-table-row {
		display: table-row !important
	}

	.d-md-table-cell {
		display: table-cell !important
	}

	.d-md-flex {
		display: flex !important
	}

	.d-md-inline-flex {
		display: inline-flex !important
	}

	.flex-md-row {
		flex-direction: row !important
	}

	.flex-md-column {
		flex-direction: column !important
	}

	.flex-md-row-reverse {
		flex-direction: row-reverse !important
	}

	.flex-md-column-reverse {
		flex-direction: column-reverse !important
	}

	.flex-md-wrap {
		flex-wrap: wrap !important
	}

	.flex-md-nowrap {
		flex-wrap: nowrap !important
	}

	.flex-md-wrap-reverse {
		flex-wrap: wrap-reverse !important
	}

	.flex-md-fill {
		flex: 1 1 auto !important
	}

	.flex-md-grow-0 {
		flex-grow: 0 !important
	}

	.flex-md-grow-1 {
		flex-grow: 1 !important
	}

	.flex-md-shrink-0 {
		flex-shrink: 0 !important
	}

	.flex-md-shrink-1 {
		flex-shrink: 1 !important
	}

	.justify-content-md-start {
		justify-content: start !important
	}

	.justify-content-md-end {
		justify-content: end !important
	}

	.justify-content-md-center {
		justify-content: center !important
	}

	.justify-content-md-between {
		justify-content: space-between !important
	}

	.justify-content-md-around {
		justify-content: space-around !important
	}

	.align-items-md-start {
		align-items: start !important
	}

	.align-items-md-end {
		align-items: end !important
	}

	.align-items-md-center {
		align-items: center !important
	}

	.align-items-md-baseline {
		align-items: baseline !important
	}

	.align-items-md-stretch {
		align-items: stretch !important
	}

	.align-content-md-start {
		align-content: start !important
	}

	.align-content-md-end {
		align-content: end !important
	}

	.align-content-md-center {
		align-content: center !important
	}

	.align-content-md-between {
		align-content: space-between !important
	}

	.align-content-md-around {
		align-content: space-around !important
	}

	.align-content-md-stretch {
		align-content: stretch !important
	}

	.align-self-md-auto {
		align-self: auto !important
	}

	.align-self-md-start {
		align-self: start !important
	}

	.align-self-md-end {
		align-self: end !important
	}

	.align-self-md-center {
		align-self: center !important
	}

	.align-self-md-baseline {
		align-self: baseline !important
	}

	.align-self-md-stretch {
		align-self: stretch !important
	}
}

@media (min-width:992px) {
	.d-lg-none {
		display: none !important
	}

	.d-lg-inline {
		display: inline !important
	}

	.d-lg-inline-block {
		display: inline-block !important
	}

	.d-lg-block {
		display: block !important
	}

	.d-lg-table {
		display: table !important
	}

	.d-lg-table-row {
		display: table-row !important
	}

	.d-lg-table-cell {
		display: table-cell !important
	}

	.d-lg-flex {
		display: flex !important
	}

	.d-lg-inline-flex {
		display: inline-flex !important
	}

	.flex-lg-row {
		flex-direction: row !important
	}

	.flex-lg-column {
		flex-direction: column !important
	}

	.flex-lg-row-reverse {
		flex-direction: row-reverse !important
	}

	.flex-lg-column-reverse {
		flex-direction: column-reverse !important
	}

	.flex-lg-wrap {
		flex-wrap: wrap !important
	}

	.flex-lg-nowrap {
		flex-wrap: nowrap !important
	}

	.flex-lg-wrap-reverse {
		flex-wrap: wrap-reverse !important
	}

	.flex-lg-fill {
		flex: 1 1 auto !important
	}

	.flex-lg-grow-0 {
		flex-grow: 0 !important
	}

	.flex-lg-grow-1 {
		flex-grow: 1 !important
	}

	.flex-lg-shrink-0 {
		flex-shrink: 0 !important
	}

	.flex-lg-shrink-1 {
		flex-shrink: 1 !important
	}

	.justify-content-lg-start {
		justify-content: start !important
	}

	.justify-content-lg-end {
		justify-content: end !important
	}

	.justify-content-lg-center {
		justify-content: center !important
	}

	.justify-content-lg-between {
		justify-content: space-between !important
	}

	.justify-content-lg-around {
		justify-content: space-around !important
	}

	.align-items-lg-start {
		align-items: start !important
	}

	.align-items-lg-end {
		align-items: end !important
	}

	.align-items-lg-center {
		align-items: center !important
	}

	.align-items-lg-baseline {
		align-items: baseline !important
	}

	.align-items-lg-stretch {
		align-items: stretch !important
	}

	.align-content-lg-start {
		align-content: start !important
	}

	.align-content-lg-end {
		align-content: end !important
	}

	.align-content-lg-center {
		align-content: center !important
	}

	.align-content-lg-between {
		align-content: space-between !important
	}

	.align-content-lg-around {
		align-content: space-around !important
	}

	.align-content-lg-stretch {
		align-content: stretch !important
	}

	.align-self-lg-auto {
		align-self: auto !important
	}

	.align-self-lg-start {
		align-self: start !important
	}

	.align-self-lg-end {
		align-self: end !important
	}

	.align-self-lg-center {
		align-self: center !important
	}

	.align-self-lg-baseline {
		align-self: baseline !important
	}

	.align-self-lg-stretch {
		align-self: stretch !important
	}
}

@media (min-width:1200px) {
	.d-xl-none {
		display: none !important
	}

	.d-xl-inline {
		display: inline !important
	}

	.d-xl-inline-block {
		display: inline-block !important
	}

	.d-xl-block {
		display: block !important
	}

	.d-xl-table {
		display: table !important
	}

	.d-xl-table-row {
		display: table-row !important
	}

	.d-xl-table-cell {
		display: table-cell !important
	}

	.d-xl-flex {
		display: flex !important
	}

	.d-xl-inline-flex {
		display: inline-flex !important
	}

	.flex-xl-row {
		flex-direction: row !important
	}

	.flex-xl-column {
		flex-direction: column !important
	}

	.flex-xl-row-reverse {
		flex-direction: row-reverse !important
	}

	.flex-xl-column-reverse {
		flex-direction: column-reverse !important
	}

	.flex-xl-wrap {
		flex-wrap: wrap !important
	}

	.flex-xl-nowrap {
		flex-wrap: nowrap !important
	}

	.flex-xl-wrap-reverse {
		flex-wrap: wrap-reverse !important
	}

	.flex-xl-fill {
		flex: 1 1 auto !important
	}

	.flex-xl-grow-0 {
		flex-grow: 0 !important
	}

	.flex-xl-grow-1 {
		flex-grow: 1 !important
	}

	.flex-xl-shrink-0 {
		flex-shrink: 0 !important
	}

	.flex-xl-shrink-1 {
		flex-shrink: 1 !important
	}

	.justify-content-xl-start {
		justify-content: start !important
	}

	.justify-content-xl-end {
		justify-content: end !important
	}

	.justify-content-xl-center {
		justify-content: center !important
	}

	.justify-content-xl-between {
		justify-content: space-between !important
	}

	.justify-content-xl-around {
		justify-content: space-around !important
	}

	.align-items-xl-start {
		align-items: start !important
	}

	.align-items-xl-end {
		align-items: end !important
	}

	.align-items-xl-center {
		align-items: center !important
	}

	.align-items-xl-baseline {
		align-items: baseline !important
	}

	.align-items-xl-stretch {
		align-items: stretch !important
	}

	.align-content-xl-start {
		align-content: start !important
	}

	.align-content-xl-end {
		align-content: end !important
	}

	.align-content-xl-center {
		align-content: center !important
	}

	.align-content-xl-between {
		align-content: space-between !important
	}

	.align-content-xl-around {
		align-content: space-around !important
	}

	.align-content-xl-stretch {
		align-content: stretch !important
	}

	.align-self-xl-auto {
		align-self: auto !important
	}

	.align-self-xl-start {
		align-self: start !important
	}

	.align-self-xl-end {
		align-self: end !important
	}

	.align-self-xl-center {
		align-self: center !important
	}

	.align-self-xl-baseline {
		align-self: baseline !important
	}

	.align-self-xl-stretch {
		align-self: stretch !important
	}
}

@media (min-width:1480px) {
	.d-wd-none {
		display: none !important
	}

	.d-wd-inline {
		display: inline !important
	}

	.d-wd-inline-block {
		display: inline-block !important
	}

	.d-wd-block {
		display: block !important
	}

	.d-wd-table {
		display: table !important
	}

	.d-wd-table-row {
		display: table-row !important
	}

	.d-wd-table-cell {
		display: table-cell !important
	}

	.d-wd-flex {
		display: flex !important
	}

	.d-wd-inline-flex {
		display: inline-flex !important
	}

	.flex-wd-row {
		flex-direction: row !important
	}

	.flex-wd-column {
		flex-direction: column !important
	}

	.flex-wd-row-reverse {
		flex-direction: row-reverse !important
	}

	.flex-wd-column-reverse {
		flex-direction: column-reverse !important
	}

	.flex-wd-wrap {
		flex-wrap: wrap !important
	}

	.flex-wd-nowrap {
		flex-wrap: nowrap !important
	}

	.flex-wd-wrap-reverse {
		flex-wrap: wrap-reverse !important
	}

	.flex-wd-fill {
		flex: 1 1 auto !important
	}

	.flex-wd-grow-0 {
		flex-grow: 0 !important
	}

	.flex-wd-grow-1 {
		flex-grow: 1 !important
	}

	.flex-wd-shrink-0 {
		flex-shrink: 0 !important
	}

	.flex-wd-shrink-1 {
		flex-shrink: 1 !important
	}

	.justify-content-wd-start {
		justify-content: start !important
	}

	.justify-content-wd-end {
		justify-content: end !important
	}

	.justify-content-wd-center {
		justify-content: center !important
	}

	.justify-content-wd-between {
		justify-content: space-between !important
	}

	.justify-content-wd-around {
		justify-content: space-around !important
	}

	.align-items-wd-start {
		align-items: start !important
	}

	.align-items-wd-end {
		align-items: end !important
	}

	.align-items-wd-center {
		align-items: center !important
	}

	.align-items-wd-baseline {
		align-items: baseline !important
	}

	.align-items-wd-stretch {
		align-items: stretch !important
	}

	.align-content-wd-start {
		align-content: start !important
	}

	.align-content-wd-end {
		align-content: end !important
	}

	.align-content-wd-center {
		align-content: center !important
	}

	.align-content-wd-between {
		align-content: space-between !important
	}

	.align-content-wd-around {
		align-content: space-around !important
	}

	.align-content-wd-stretch {
		align-content: stretch !important
	}

	.align-self-wd-auto {
		align-self: auto !important
	}

	.align-self-wd-start {
		align-self: start !important
	}

	.align-self-wd-end {
		align-self: end !important
	}

	.align-self-wd-center {
		align-self: center !important
	}

	.align-self-wd-baseline {
		align-self: baseline !important
	}

	.align-self-wd-stretch {
		align-self: stretch !important
	}
}


.flex-row {
	flex-direction: row !important
}

.flex-column {
	flex-direction: column !important
}

.flex-row-reverse {
	flex-direction: row-reverse !important
}

.flex-column-reverse {
	flex-direction: column-reverse !important
}

.flex-wrap {
	flex-wrap: wrap !important
}

.flex-nowrap {
	flex-wrap: nowrap !important
}

.flex-wrap-reverse {
	flex-wrap: wrap-reverse !important
}

.flex-fill {
	flex: 1 1 auto !important
}

.flex-grow-0 {
	flex-grow: 0 !important
}

.flex-grow-1 {
	flex-grow: 1 !important
}

.flex-shrink-0 {
	flex-shrink: 0 !important
}

.flex-shrink-1 {
	flex-shrink: 1 !important
}

.justify-content-start {
	justify-content: start !important
}

.justify-content-end {
	justify-content: end !important
}

.justify-content-center {
	justify-content: center !important
}

.justify-content-between {
	justify-content: space-between !important
}

.justify-content-around {
	justify-content: space-around !important
}

.align-items-start {
	align-items: start !important
}

.align-items-end {
	align-items: end !important
}

.align-items-center {
	align-items: center !important
}

.align-items-baseline {
	align-items: baseline !important
}

.align-items-stretch {
	align-items: stretch !important
}

.align-content-start {
	align-content: start !important
}

.align-content-end {
	align-content: end !important
}

.align-content-center {
	align-content: center !important
}

.align-content-between {
	align-content: space-between !important
}

.align-content-around {
	align-content: space-around !important
}

.align-content-stretch {
	align-content: stretch !important
}

.align-self-auto {
	align-self: auto !important
}

.align-self-start {
	align-self: start !important
}

.align-self-end {
	align-self: end !important
}

.align-self-center {
	align-self: center !important
}

.align-self-baseline {
	align-self: baseline !important
}

.align-self-stretch {
	align-self: stretch !important
}

/*Flex-end*/


.form-control {
	display: block;
	width: 100%;
	height: calc(1.5em + 1.34rem + 2px);
	padding: .67rem 1rem;
	font-size: .875rem;
	font-weight: 400;
	line-height: 1.5;
	color: #818181;
	background: var(--white);
	border: 1px solid #dddddd;
	border-radius: 0.4rem;
	transition: border-color .15s ease-in-out
}

@media (prefers-reduced-motion:reduce) {
	.form-control {
		transition: none
	}
}

.form-control::-ms-expand {
	background: transparent;
	border: 0
}

.form-control:focus {
	color: #818181;
	background: var(--white);
	border-color: #66afe9;
	outline: 0;
	box-shadow: none
}

.form-control::placeholder {
	color: #818181;
	opacity: 1
}

.form-control:disabled,
.form-control[readonly] {
	background: #f8fafd;
	opacity: 1
}

select.form-control:focus::-ms-value {
	color: #818181;
	background: var(--white)
}

.form-control-file,
.form-control-range {
	display: block;
	width: 100%
}

.col-form-label {
	padding: .67rem 0;
	margin-bottom: 0;
	font-size: inherit;
	line-height: 1.5
}

.col-form-label-lg {
	padding: 1.125rem 0;
	font-size: 1.09375rem;
	line-height: 1.5
}

.col-form-label-sm {
	padding: .625rem 0;
	font-size: .76562rem;
	line-height: 1.5
}

.form-control-plaintext {
	display: block;
	width: 100%;
	padding: .67rem 0;
	margin-bottom: 0;
	line-height: 1.5;
	color: var(--dark);
	background: transparent;
	border: 1px solid transparent
}

.form-control-plaintext.form-control-sm,
.form-control-plaintext.form-control-lg {
	padding: 0
}

.form-control-sm {
	height: calc(1.5em + 1.25rem + 2px);
	padding: .625rem 1.125rem;
	font-size: .76562rem;
	line-height: 1.5;
	border-radius: 0.4rem;
}

.form-control-lg {
	height: calc(1.5em + 2.25rem + 2px);
	padding: 1.125rem;
	font-size: 1.09375rem;
	line-height: 1.5;
	border-radius: 0.4rem;
}

select.form-control[size],
select.form-control[multiple],
textarea.form-control {
	height: auto
}

/*Table-end*/
/*Button-start*/
.btn-primary,
.btn-primary:hover,
.btn-primary.disabled,
.btn-primary:disabled,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show>.btn-primary.dropdown-toggle {
	color: var(--white);
	background: var(--gray);
	border-color: var(--accent);
}

.btn-primary:focus,
.btn-primary.focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show>.btn-primary.dropdown-toggle:focus {
	border-color: var(--accent-hover);
}

.btn-secondary,
.btn-secondary.disabled,
.btn-secondary:disabled {
	color: var(--white);
	background: #77838f;
	border-color: #77838f
}

.btn-secondary:hover {
	color: var(--white);
	background: #65707b;
	border-color: #5f6a74
}

.btn-secondary:focus,
.btn-secondary.focus,
.btn-secondary:not(:disabled):not(.disabled):active:focus,
.btn-secondary:not(:disabled):not(.disabled).active:focus,
.show>.btn-secondary.dropdown-toggle:focus {
	border-color: #5a636d
}

.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active,
.show>.btn-secondary.dropdown-toggle {
	color: var(--white);
	background: #5f6a74;
	border-color: #5a636d
}

[type="submit"].btn-block,
[type="reset"].btn-block,
[type="button"].btn-block {
	width: 100%
}

.fade {
	transition: opacity .15s linear
}

@media (prefers-reduced-motion:reduce) {
	.fade {
		transition: none
	}
}

.fade:not(.show) {
	opacity: 0
}

/*Button-end*/

/*Margins and Paddings-start*/
.m-1 {
	margin: .25rem !important
}

.mt-1,
.my-1 {
	margin-top: .25rem !important
}

.mr-1,
.mx-1 {
	margin-right: .25rem !important
}

.mb-1,
.my-1 {
	margin-bottom: .25rem !important
}

.ml-1,
.mx-1 {
	margin-left: .25rem !important
}

.m-2 {
	margin: .5rem !important
}

.mt-2,
.my-2 {
	margin-top: .5rem !important
}

.mr-2,
.mx-2 {
	margin-right: .5rem !important
}

.mb-2,
.my-2 {
	margin-bottom: .5rem !important
}

.ml-2,
.mx-2 {
	margin-left: .5rem !important
}

.m-3 {
	margin: 1rem !important
}

.mt-3,
.my-3 {
	margin-top: 1rem !important
}

.mr-3,
.mx-3 {
	margin-right: 1rem !important
}

.mb-3,
.my-3 {
	margin-bottom: 1rem !important
}

.ml-3,
.mx-3 {
	margin-left: 1rem !important
}

.m-4 {
	margin: 1.5rem !important
}

.mt-4,
.my-4 {
	margin-top: 1.5rem !important
}

.mr-4,
.mx-4 {
	margin-right: 1.5rem !important
}

.mb-4,
.my-4 {
	margin-bottom: 1.5rem !important
}

.ml-4,
.mx-4 {
	margin-left: 1.5rem !important
}

.m-5 {
	margin: 2rem !important
}

.mt-5,
.my-5 {
	margin-top: 2rem !important
}

.mr-5,
.mx-5 {
	margin-right: 2rem !important
}

.mb-5,
.my-5 {
	margin-bottom: 2rem !important
}

.ml-5,
.mx-5 {
	margin-left: 2rem !important
}

.m-7 {
	margin: 3rem !important
}

.mt-7,
.my-7 {
	margin-top: 3rem !important
}

.mr-7,
.mx-7 {
	margin-right: 3rem !important
}

.mb-7,
.my-7 {
	margin-bottom: 3rem !important
}

.ml-7,
.mx-7 {
	margin-left: 3rem !important
}

.m-12 {
	margin: 5.5rem !important
}

.mt-12,
.my-12 {
	margin-top: 5.5rem !important
}

.mr-12,
.mx-12 {
	margin-right: 5.5rem !important
}

.mb-12,
.my-12 {
	margin-bottom: 5.5rem !important
}

.ml-12,
.mx-12 {
	margin-left: 5.5rem !important
}

.p-1 {
	padding: .25rem !important
}

.pt-1,
.py-1 {
	padding-top: .25rem !important
}

.pr-1,
.px-1 {
	padding-right: .25rem !important
}

.pb-1,
.py-1 {
	padding-bottom: .25rem !important
}

.pl-1,
.px-1 {
	padding-left: .25rem !important
}

.p-2 {
	padding: .5rem !important
}

.pt-2,
.py-2 {
	padding-top: .5rem !important
}

.pr-2,
.px-2 {
	padding-right: .5rem !important
}

.pb-2,
.py-2 {
	padding-bottom: .5rem !important
}

.pl-2,
.px-2 {
	padding-left: .5rem !important
}

.p-3 {
	padding: 1rem !important
}

.pt-3,
.py-3 {
	padding-top: 1rem !important
}

.pr-3,
.px-3 {
	padding-right: 1rem !important
}

.pb-3,
.py-3 {
	padding-bottom: 1rem !important
}

.pl-3,
.px-3 {
	padding-left: 1rem !important
}

.p-4 {
	padding: 1.5rem !important
}

.pt-4,
.py-4 {
	padding-top: 1.5rem !important
}

.pr-4,
.px-4 {
	padding-right: 1.5rem !important
}

.pb-4,
.py-4 {
	padding-bottom: 1.5rem !important
}

.pl-4,
.px-4 {
	padding-left: 1.5rem !important
}

.p-5 {
	padding: 2rem !important
}

.pt-5,
.py-5 {
	padding-top: 2rem !important
}

.pr-5,
.px-5 {
	padding-right: 2rem !important
}

.pb-5,
.py-5 {
	padding-bottom: 2rem !important
}

.pl-5,
.px-5 {
	padding-left: 2rem !important
}

.p-7 {
	padding: 3rem !important
}

.pt-7,
.py-7 {
	padding-top: 3rem !important
}

.pr-7,
.px-7 {
	padding-right: 3rem !important
}

.pb-7,
.py-7 {
	padding-bottom: 3rem !important
}

.pl-7,
.px-7 {
	padding-left: 3rem !important
}

.p-12 {
	padding: 5.5rem !important
}

.pt-12,
.py-12 {
	padding-top: 5.5rem !important
}

.pr-12,
.px-12 {
	padding-right: 5.5rem !important
}

.pb-12,
.py-12 {
	padding-bottom: 5.5rem !important
}

.pl-12,
.px-12 {
	padding-left: 5.5rem !important
}

/*Margins and Paddings-end*/

.box {
	padding: 1rem;
	background-color: var(--background);
}

.spinner-border {
	display: inline-block;
	width: 2rem;
	height: 2rem;
	vertical-align: text-bottom;
	border: 0.25em solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	-webkit-animation: spinner-border 0.75s linear infinite;
	animation: spinner-border 0.75s linear infinite;
}

.spinner-border-sm {
	width: 1rem;
	height: 1rem;
	border-width: 0.2em;
}

@-webkit-keyframes spinner-grow {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
	}

	50% {
		opacity: 1;
	}
}

@keyframes spinner-grow {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
	}

	50% {
		opacity: 1;
	}
}

.spinner-grow {
	display: inline-block;
	width: 2rem;
	height: 2rem;
	vertical-align: text-bottom;
	background-color: currentColor;
	border-radius: 50%;
	opacity: 0;
	-webkit-animation: spinner-grow 0.75s linear infinite;
	animation: spinner-grow 0.75s linear infinite;
}

.spinner-grow-sm {
	width: 1rem;
	height: 1rem;
}



.bg-primary {
	background-color: #0062bd !important;
}

.bg-white {
	background-color: #fff !important;
}

.bg-transparent {
	background-color: transparent !important;
}

.bg-gray {
	background-color: #f8fafd !important;
}

.bg-gray-1 {
	background-color: #d5d7da !important;
}

.border {
	border: 1px solid #e7eaf3 !important;
}





.shadow-sm {
	box-shadow: 0 0 35px rgba(140, 152, 164, 0.125) !important;
}

.shadow {
	box-shadow: 0 0.375rem 1.5rem 0 rgba(140, 152, 164, 0.125) !important;
}

.shadow-lg {
	box-shadow: 0 10px 40px 10px rgba(140, 152, 164, 0.175) !important;
}







.text-monospace {
	font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
}

.text-justify {
	text-align: justify !important;
}

.text-wrap {
	white-space: normal !important;
}

.text-nowrap {
	white-space: nowrap !important;
}


.text-left {
	text-align: left !important;
}

.text-right {
	text-align: right !important;
}

.text-center {
	text-align: center !important;
}



.text-lowercase {
	text-transform: lowercase !important;
}

.text-uppercase {
	text-transform: uppercase !important;
}



.fw-300 {
	font-weight: 300 !important;
}


.fw-400 {
	font-weight: 400 !important;
}

.fw-600 {
	font-weight: 700 !important;
}

.fw-bold {
	font-weight: bold !important;
}

.font-italic {
	font-style: italic !important;
}

.text-white {
	color: #fff !important;
}

.text-primary {
	color: #0062bd !important;
}


.text-secondary {
	color: #77838f !important;
}


.text-black {
	color: #000000 !important;
}


.text-green {
	color: #5cb85c !important;
}



.text-red {
	color: #ee0000 !important;
}

.text-gray {
	color: #a8a8a8 !important;
}








.progress {
	display: -ms-flexbox;
	display: flex;
	height: 1rem;
	overflow: hidden;
	font-size: 0.65625rem;
	background-color: #f5f5f5;
	border-radius: 0.3125rem;
}

.progress-bar {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	background-color: #d8d8d8;
	transition: width 0.6s ease;
}

@media (prefers-reduced-motion: reduce) {
	.progress-bar {
		transition: none;
	}
}


.w-25 {
	width: 25% !important;
}

.w-50 {
	width: 50% !important;
}

.w-75 {
	width: 75% !important;
}

.w-100 {
	width: 100% !important;
}

.w-auto {
	width: auto !important;
}

.w-15 {
	width: 15% !important;
}

.w-20 {
	width: 20% !important;
}

.w-30 {
	width: 30% !important;
}

.w-35 {
	width: 35% !important;
}

.w-40 {
	width: 40% !important;
}

.w-60 {
	width: 60% !important;
}

.w-65 {
	width: 65% !important;
}

.w-80 {
	width: 80% !important;
}

.w-85 {
	width: 85% !important;
}

.w-90 {
	width: 90% !important;
}

@media (min-width: 576px) {
	.w-sm-25 {
		width: 25% !important;
	}

	.w-sm-50 {
		width: 50% !important;
	}

	.w-sm-75 {
		width: 75% !important;
	}

	.w-sm-100 {
		width: 100% !important;
	}

	.w-sm-auto {
		width: auto !important;
	}

	.w-sm-15 {
		width: 15% !important;
	}

	.w-sm-20 {
		width: 20% !important;
	}

	.w-sm-30 {
		width: 30% !important;
	}

	.w-sm-35 {
		width: 35% !important;
	}

	.w-sm-40 {
		width: 40% !important;
	}

	.w-sm-60 {
		width: 60% !important;
	}

	.w-sm-65 {
		width: 65% !important;
	}

	.w-sm-80 {
		width: 80% !important;
	}

	.w-sm-85 {
		width: 85% !important;
	}

	.w-sm-90 {
		width: 90% !important;
	}
}

@media (min-width: 768px) {
	.w-md-25 {
		width: 25% !important;
	}

	.w-md-50 {
		width: 50% !important;
	}

	.w-md-75 {
		width: 75% !important;
	}

	.w-md-100 {
		width: 100% !important;
	}

	.w-md-auto {
		width: auto !important;
	}

	.w-md-15 {
		width: 15% !important;
	}

	.w-md-20 {
		width: 20% !important;
	}

	.w-md-30 {
		width: 30% !important;
	}

	.w-md-35 {
		width: 35% !important;
	}

	.w-md-40 {
		width: 40% !important;
	}

	.w-md-60 {
		width: 60% !important;
	}

	.w-md-65 {
		width: 65% !important;
	}

	.w-md-80 {
		width: 80% !important;
	}

	.w-md-85 {
		width: 85% !important;
	}

	.w-md-90 {
		width: 90% !important;
	}
}

@media (min-width: 992px) {
	.w-lg-25 {
		width: 25% !important;
	}

	.w-lg-50 {
		width: 50% !important;
	}

	.w-lg-75 {
		width: 75% !important;
	}

	.w-lg-100 {
		width: 100% !important;
	}

	.w-lg-auto {
		width: auto !important;
	}

	.w-lg-15 {
		width: 15% !important;
	}

	.w-lg-20 {
		width: 20% !important;
	}

	.w-lg-30 {
		width: 30% !important;
	}

	.w-lg-35 {
		width: 35% !important;
	}

	.w-lg-40 {
		width: 40% !important;
	}

	.w-lg-60 {
		width: 60% !important;
	}

	.w-lg-65 {
		width: 65% !important;
	}

	.w-lg-80 {
		width: 80% !important;
	}

	.w-lg-85 {
		width: 85% !important;
	}

	.w-lg-90 {
		width: 90% !important;
	}
}

@media (min-width: 1200px) {
	.w-xl-25 {
		width: 25% !important;
	}

	.w-xl-50 {
		width: 50% !important;
	}

	.w-xl-75 {
		width: 75% !important;
	}

	.w-xl-100 {
		width: 100% !important;
	}

	.w-xl-auto {
		width: auto !important;
	}

	.w-xl-15 {
		width: 15% !important;
	}

	.w-xl-20 {
		width: 20% !important;
	}

	.w-xl-30 {
		width: 30% !important;
	}

	.w-xl-35 {
		width: 35% !important;
	}

	.w-xl-40 {
		width: 40% !important;
	}

	.w-xl-60 {
		width: 60% !important;
	}

	.w-xl-65 {
		width: 65% !important;
	}

	.w-xl-80 {
		width: 80% !important;
	}

	.w-xl-85 {
		width: 85% !important;
	}

	.w-xl-90 {
		width: 90% !important;
	}
}

@media (min-width: 1480px) {
	.w-wd-25 {
		width: 25% !important;
	}

	.w-wd-50 {
		width: 50% !important;
	}

	.w-wd-75 {
		width: 75% !important;
	}

	.w-wd-100 {
		width: 100% !important;
	}

	.w-wd-auto {
		width: auto !important;
	}

	.w-wd-15 {
		width: 15% !important;
	}

	.w-wd-20 {
		width: 20% !important;
	}

	.w-wd-30 {
		width: 30% !important;
	}

	.w-wd-35 {
		width: 35% !important;
	}

	.w-wd-40 {
		width: 40% !important;
	}

	.w-wd-60 {
		width: 60% !important;
	}

	.w-wd-65 {
		width: 65% !important;
	}

	.w-wd-80 {
		width: 80% !important;
	}

	.w-wd-85 {
		width: 85% !important;
	}

	.w-wd-90 {
		width: 90% !important;
	}
}



/*------------------------------------
  Default Styles
------------------------------------*/


/*------------------------------------
  Highlight Color
------------------------------------*/
::-moz-selection {
	color: #fff;
	background-color: #0062bd;
}

::selection {
	color: #fff;
	background-color: #0062bd;
}

.bg-primary ::-moz-selection {
	color: #0062bd;
	background-color: #fff;
}

.bg-primary ::selection {
	color: #0062bd;
	background-color: #fff;
}

/*------------------------------------
  Accessibility
------------------------------------*/
:focus,
a:focus,
button:focus {
	outline: 0;
}

.form-control:focus {
	box-shadow: 0 0 0 0 transparent;
}

.btn:focus,
.btn.focus,
.btn:not(:disabled):not(.disabled):active:focus,
.btn:not(:disabled):not(.disabled).active:focus,
.btn:not([disabled]):not(.disabled):active,
.btn:not([disabled]):not(.disabled).active {
	box-shadow: 0 0 0 0 transparent;
}

.btn:not(:disabled):not(.disabled):active:focus,
.btn:not(:disabled):not(.disabled).active:focus,
.show>.btn.dropdown-toggle:focus {
	box-shadow: 0 0 0 0 transparent;
}


/*------------------------------------
  Typography Font Size
------------------------------------*/

.lh-1 {
	line-height: 100%;
}

.fs-6 {
	font-size: 0.37538rem;
}

.fs-8 {
	font-size: 0.49962rem;
}

.fs-12 {
	font-size: 0.74987rem;
}

.fs-13 {
	font-size: 0.81288rem;
}

.fs-14 {
	font-size: 0.875rem;
}

.fs-15 {
	font-size: 0.938rem;
}

.fs-16 {
	font-size: 1.00012rem;
}

.fs-18 {
	font-size: 1.12525rem;
}

.fs-20 {
	font-size: 1.25038rem;
}

.fs-22 {
	font-size: 1.37462rem;
}

.fs-24 {
	font-size: 1.49975rem;
}














/*------------------------------------
  Content Centered
------------------------------------*/
.flex-center-between {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.flex-content-center {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.flex-horizontal-center {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
}






/*Мои стили--------------------------------------------------------------------------------------------------------------------------*/



.hidden-attribution {
	display: none;
}

.bg-base {
	background-color: #f8fafd;
}

.submit {
	border-radius: 0.4rem;
	font-size: 18px;
	color: rgb(150, 150, 150);
	border: 1px solid rgba(0, 0, 0, 0);
	padding: 2px 8px 4px 8px;
	margin: 4px 0 0 0;
	background: rgb(230, 230, 230);
	opacity: 1;
}

.a-dotted {
	color: rgb(100, 100, 100);
	border-bottom: 1px dotted rgb(100, 100, 100);
}


/*базовые стили Бутстрап*/
.opacity-90 {
	opacity: 0.9;
}

.opacity-85 {
	opacity: 0.85;
}

.opacity-75 {
	opacity: 0.75;
}

.opacity-50 {
	opacity: 0.5;
}

.opacity-25 {
	opacity: 0.25;
}

.fw-200 {
	font-weight: 200;
}

.fw-400 {
	font-weight: 400;
}

.fw-500 {
	font-weight: 500;
}

.fw-600 {
	font-weight: 600;
}

.fw-bold {
	font-weight: bold;
}

.fst-italic {
	font-style: italic;
}

.lh-1 {
	line-height: 110%;
}

/* Стилизация header -----------*/
#site-header {
	background-color: #fff;
	/*margin-bottom: 24px;*/
}

.header-site {
	padding: 12px 0 0 0;
	border-bottom: 0px solid rgb(240, 240, 240);
}

.nav-panel {
	/*padding: 0 0 12px 0;*/
	box-shadow: -10px -1px 6px rgba(0, 0, 0, 0.02);
	z-index: 5000;
}


/* Логотип и название */
.brand {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: bold;
	color: var(--primary);
	text-decoration: none;
}

.logo {
	width: 24px;
	height: 24px;
	margin-right: 0px;
	filter: hue-rotate(350deg);

}

.brand-text {
	font-size: 1.25rem;
	letter-spacing: 1px;
	text-transform: uppercase;
	font-weight: 600;
}


/* Кнопка мобильного меню */
.navbar-toggler {
	display: inline-block;
	font-size: 1.5rem;
	color: var(--secondary);
	background-color: transparent;
	border: none;
	cursor: pointer;
	transition: transform 0.3s ease;
}

.navbar-toggler:hover {
	transform: scale(1.1);
	/* Эффект увеличения при наведении */
}



/* Основное меню (для десктопа) */
.main-menu {
	margin: 0;
	padding: 2px 0;
	display: flex;
	gap: 1rem;
	list-style: none;
}

.main-menu .menu-item {
	color: #443e2f;
	text-transform: uppercase;
	font-size: 14px;
	text-decoration: none;
	transition: color 0.3s ease;
	font-weight: 500;
}

.menu-item:hover {
	color: var(--primary);
}


.mobile-menu {
	position: fixed;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100vh;
	background-color: var(--primary);
	transition: left 0.3s ease;
	z-index: 999;
	overflow-y: auto;
	/* 🔁 Прокрутка по вертикали */
	padding: 10px;
	box-sizing: border-box;
}

.mobile-menu.active {
	left: 0;
	/* Показывается при активации */
}

.mobile-menu-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.mobile-menu-list li {
	list-style: none;
	padding: 6px 0;
}

.mobile-menu-list li a {
	color: #ffffff;
	font-size: 1.13rem;
}




/* Адаптивность */
@media (max-width: 1200px) {
	.main-nav {
		display: none;
		/* Скрываем основное меню */
	}
}

@media (max-width: 768px) {
	.header-site {
		flex-direction: column;
		/* Элементы шапки в столбец */
	}

	.brand {
		justify-content: center;
		/* Центрируем бренд */
		padding: 0;
	}

	.nav-panel {
		padding: 0;
		/* Скрываем информацию о проекте */
	}

}

/* Блок информации о проекте */
.header-project-info {
	display: none;
	align-items: center;
	/* Вертикальное выравнивание по центру */
	margin: 10px 0;
}

@media (min-width: 1480px) {
	.header-project-info {
		display: flex;
	}
}

/* Список ссылок */
.header-info-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	gap: 20px;
	/* Расстояние между элементами */
}

/* Элемент списка */
.header-info-item {
	font-size: 0.95rem;
}

/* Ссылка */
.header-info-link {
	color: var(--primary);
	text-decoration: none;
	font-weight: 500;
	transition: color 0.3s ease;
}

.header-info-link:hover {
	color: var(--accent);
	text-decoration: underline;
}

/* Адаптивность */
@media (max-width: 1199px) {
	.header-project-info {
		display: none;
		/* Скрываем на экранах < 1200px */
	}
}

/* Стилизация about-box ------------*/
.about-box {
	display: flex;
	/* Используем Flexbox для выравнивания элементов */
	align-items: center;
	/* Выравниваем элементы по центру вертикально */
	background-color: white;
	/* Цвет фона */
	padding: 1rem;
	/* Отступы внутри блока */
	/*border-radius: 12px;*/
	/* Сглаженные углы */
	box-shadow: var(--shadow);
	/* Небольшая тень */
	margin-bottom: 1.5rem;
	/* Отступ снизу */
}

.about-box .d-flex {
	display: flex;
	/* Flexbox для группировки элементов */
	align-items: center;
	/* Выравниваем элементы по центру */
	gap: 1rem;
	/* Пробел между элементами */
}

.about-box img {
	width: 48px;
	height: 48px;
	margin: 0 0.15rem 0 0.75rem;
	/* Отступ справа от логотипа */
}

.about-box p.m-0 {
	margin: 0;
	/* Убираем отступы у параграфа */
	font-size: 0.9rem;
	/* Размер шрифта */
	line-height: 1.4;
	/* Интерлиньяж */
}

.about-box .title {
	font-size: 1.25rem;
	/* Размер шрифта заголовка */
	font-weight: bold;
	/* Жирный шрифт */
	color: var(--primary);
	/* Основной цвет */
	text-transform: uppercase;
	/* Все буквы заглавные */
	letter-spacing: 1px;
	/* Промежуток между буквами */
	margin-bottom: 0.25rem;
	/* Отступ под заголовком */
}

.about-box a {
	display: block;
	/* Каждая ссылка занимает свою строку */
	margin-top: 0.5rem;
	/* Отступ сверху для ссылок */
	font-size: 0.875rem;
	/* Размер шрифта ссылок */
	color: var(--primary);
	/* Цвет ссылок */
	text-decoration: none;
	/* Убираем подчеркивание */
	transition: color 0.3s ease;
	/* Плавный переход цвета */
}

.about-box a:hover {
	color: var(--hover);
	/* Темнее при наведении */
}

/* Адаптивность */
@media (max-width: 768px) {
	.about-box {
		display: none;
	}

	.about-box img {
		margin: 0 auto 0.75rem;
		/* Логотип становится центральным */
	}

	.about-box a {
		margin-top: 0.25rem;
		/* Уменьшаем отступы между ссылками */
	}
}



.about-box .social-links {
	display: flex;
	/* Размещаем элементы в одну строку */
	gap: 1rem;
	/* Добавляем равномерный пробел между элементами */
	align-items: center;
	/* Выравниваем элементы по центру вертикально */
}

.about-box .social-links a {
	text-decoration: none;
	/* Убираем подчеркивание ссылок */
	color: var(--primary);
	/* Цвет ссылок */
	font-size: 1rem;
	/* Размер шрифта */
	font-weight: 500;
	/* Полужирный шрифт */
	transition: color 0.3s ease;
	/* Плавный переход цвета при наведении */
}

.about-box .social-links a:hover {
	color: var(--hover-color);
	/* Темнее при наведении */
}

@media (max-width: 768px) {
	.about-box .social-links {
		flex-direction: column;
		/* На мобильных устройствах делаем столбец */
		gap: 0.5rem;
		/* Уменьшаем пробел между элементами */
	}
}




/* Скролл------------- */

.scroll-product {
	overflow: scroll;
	overflow-x: hidden;
	height: 500px;
	scroll-behavior: smooth;
}

.scroll-1200 {
	overflow-y: scroll;
	overflow-x: hidden;
	height: 1200px;
	scroll-behavior: smooth;
}

*::-webkit-scrollbar,
html *::-webkit-scrollbar {
	scrollbar-width: thin;
	scrollbar-color: blue orange;
}

*::-webkit-scrollbar,
html *::-webkit-scrollbar {
	height: 10px;
	width: 10px;
}

*::-webkit-scrollbar-track,
html *::-webkit-scrollbar-track {
	background: rgb(240, 240, 240);
	border-radius: 20px;
}

*::-webkit-scrollbar-thumb,
html *::-webkit-scrollbar-thumb {
	background-color: rgb(200, 200, 200);
	border-radius: 20px;
	border: 0px solid orange;
}



/* Стили диапазонного элемента ввода (слайдера) ----------*/
/* Сбрасываем стили по умолчанию */
input[type="range"] {
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	cursor: pointer;
	width: 100%;
}

/* Удаляем фокусировку по умолчанию */
input[type="range"]:focus {
	outline: none;
}

/* Стили для Chrome, Safari, Opera и Edge Chromium */
/* дорожка слайдера */
input[type="range"]::-webkit-slider-runnable-track {
	background-color: #dcdcdc;
	border-radius: 0.4rem;
	height: 0.2rem;
}

/* ползунок слайдера */
input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	/* Переопределяем вид по умолчанию */
	appearance: none;
	margin-top: -12px;
	/* Установим ползунок по центру дорожки */
	/* пользовательские стили */
	background-color: #34bcec;
	height: 1.5rem;
	width: 1.5rem;
	border-radius: 50px;
	border: 2px solid white;
	box-shadow: rgba(0, 0, 0, 0.1) 2px 3px 3px 2px;
}

input[type="range"]:focus::-webkit-slider-thumb {
	border: 0px solid #06aa9a;
	outline: 2px solid #34bcec;
	outline-offset: 0.125rem;
}

/*Стили для Firefox */
/* дорожка слайдера */
input[type="range"]::-moz-range-track {
	background-color: #053a5f;
	border-radius: 0.4rem;
	height: 0.5rem;
}

/* ползунок слайдера */
input[type="range"]::-moz-range-thumb {
	border: none;
	/* Удаляем лишнюю рамку, которую добавляет FF */
	border-radius: 0;
	/* Удаляем border-radius по умолчанию от FF */
	/* пользовательские стили */
	background-color: red;
	height: 2rem;
	width: 1rem;
}

input[type="range"]:focus::-moz-range-thumb {
	border: 1px solid #053a5f;
	outline: 3px solid #053a5f;
	outline-offset: 0.125rem;
}


.max-min-260 {
	min-width: 250px;
	max-width: 260px;
}


/* Стиль для input и select */
.form-control,
.form-select {
	width: 100%;
	padding: 0.75rem 1rem;
	font-size: 1rem;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da !important;
	border-radius: 0.4rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* Фокус на input */
.form-control:focus,
.form-select:focus {
	border-color: #80bdff;
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
	outline: none;
}

/* Placeholder */
.form-control::placeholder {
	color: #adb5bd;
	opacity: 1;
	/* Chrome, Firefox and Opera */
}






/* -------------------------Стилизация article-box */

.article-box {
	background-color: #fff;
	border-radius: 0.4rem;
	overflow: hidden;
	/* Убираем вылазящие элементы */
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	/* Анимация при наведении */
}

.article-box:hover {
	transform: translateY(-10px);
	/* Поднятие при наведении */
	/*box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);*/
	/* Более заметная тень */
}

.article-box h3 {
	font-weight: 500;
	font-size: 1.1rem;
	margin: 0;
	padding: 0 1rem;
}


.article-box:hover .img-box img {
	opacity: 0.8;
	/* Затемнение изображения при наведении */
}

.img-panel {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: rgba(77, 183, 255, 0.99);
	/* Полупрозрачный фон */
	color: #fff;
	padding: 0.5rem 1rem;
	font-size: 0.875rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 1px;
	z-index: 1;
	/* Чтобы текст был поверх изображения */
}



.article-box a {
	text-decoration: none;
	color: inherit;
	/* Цвет ссылки такой же, как основной текст */
}

.article-box p {
	padding: .5rem 1rem;
}


/* Стилизация видео */
article video {
	width: 100%;
	border-radius: 12px 12px 0 0;
	/* Сглаженные углы у видео */
	background-color: #000;
	/* Темный фон для видео */
}

/* Адаптивность */

@media (max-width: 768px) {

	.article-box {
		border-radius: 0.4rem;
		/* Уменьшаем скругление углов */
	}

	.img-panel {
		font-size: 0.8rem;
		/* Уменьшаем размер шрифта */
		padding: 0.5rem 0.75rem;
	}
}


/* Общий стиль для blockquote */
blockquote {
	position: relative;
	margin: 0 0 1rem 0;
	padding: 1.5rem 2rem;
	background-color: #f9fafb;
	/* Лёгкий серый фон */
	/*border-left: 4px solid var(--primary);
	 Голубая левая граница */
	color: #333;
	font-size: 1rem;
	/* Размер шрифта */
	line-height: 1.6;
	/* Интервал между строками */
	border-radius: 0.4rem;
	/* Скругление углов 
	box-shadow: var(--shadow-0);*/
}

/* Кавычки через псевдоэлементы */
blockquote::before {
	content: "❝";
	/* Открывающие кавычки */
	position: absolute;
	top: -0.5rem;
	left: -0.5rem;
	font-size: 3rem;
	color: #adb5bd;
	/* Серый цвет кавычек */
	font-family: serif;
	/* Шрифт для кавычек */
}

blockquote::after {
	content: "❞";
	/* Закрывающие кавычки */
	position: absolute;
	bottom: -0.5rem;
	right: -0.5rem;
	font-size: 3rem;
	color: #adb5bd;
	/* Серый цвет кавычек */
	font-family: serif;
	/* Шрифт для кавычек */
}

/* Автор цитаты */
blockquote p {
	font-weight: 300;
}

blockquote small {
	color: var(--secondary);
}

/* Адаптивность */
@media (max-width: 768px) {
	blockquote {
		padding: 1rem;
		/* Уменьшаем отступы на маленьких экранах */
		/*border-left: 5px solid #0056b3;
		 Уменьшаем размер левой границы */
	}

	blockquote::before,
	blockquote::after {
		font-size: 2rem;
		/* Уменьшаем размер кавычек */
	}
}



/* Стилизация кнопки */
#scroll-to-top {
	position: fixed;
	/* Фиксированное положение */
	bottom: 20px;
	/* Расположение снизу */
	right: 20px;
	/* Расположение справа */
	width: 42px;
	/* Размер кнопки */
	height: 42px;
	display: flex;
	/* Центрирование содержимого */
	align-items: center;
	justify-content: center;
	font-size: 1.4rem;
	/* Размер иконки */
	color: white;
	cursor: pointer;
	background-color: var(--primary);
	z-index: 1000;
	/* Повышаем важность для отображения поверх других элементов */
	transition: opacity 0.3s ease, transform 0.3s ease;
	/* Анимация появления */
	border-radius: 50%;

}


#scroll-to-top:hover {
	background-color: darken(#0062bd, 10%) !important;
	/* Темнее при наведении */
	transform: translateY(-5px);
	/* Эффект поднятия */
}

#scroll-to-top.d-none {
	opacity: 0;
	/* Скрываем кнопку */
	pointer-events: none;
	/* Отключаем взаимодействие */
}

@media (max-width: 768px) {
	#scroll-to-top {
		bottom: 10px;
		/* Уменьшаем отступы для мобильных устройств */
		right: 10px;
		width: 40px;
		height: 40px;
		font-size: 1rem;
	}
}




/* Авторы и эксперты */
.expert-card {
	background-color: #fff;
	border-radius: 0.4rem;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	padding: 1rem;
	margin-bottom: 1.5rem;
}

/* Изображение эксперта */
.expert-image {
	width: 100%;
	max-width: 150px;
	/* Ограничиваем размер изображения */
	height: auto;
	border-radius: 50%;
	/* Делаем изображение круглым */
	margin-bottom: 0.5rem;
}

/* Информация о специалисте */
.expert-name {
	font-size: 1.3rem;
	font-weight: bold;
	margin-bottom: 0.05rem;
	color: var(--primary);
}

.expert-specialty {
	font-size: 1rem;
	font-weight: 600;
	color: var(--secondary);
	margin-bottom: 0.05rem;
}

.expert-location {
	font-size: 1rem;
	color: var(--secondary);
	margin-bottom: 0.05rem;
}

.expert-description {
	font-size: 1rem;
	line-height: 1.6;
	margin-bottom: 0.05rem;
}

/* Контакты */
.expert-contacts li {
	margin-bottom: 0.5rem;
}

.expert-contacts strong {
	font-weight: bold;
	color: var(--secondary);
}

.expert-contacts a {
	text-decoration: none;
	color: var(--primary);
	transition: color 0.3s ease;
}

.expert-contacts a:hover {
	color: var(--hover);
}

/* Социальные сети */
.expert-socials {
	display: flex;
	justify-content: flex-start;
	gap: 1rem;
}

.expert-socials a {
	display: inline-block;

	width: 36px;
	height: 36px;
	line-height: 30px;
	text-align: center;
	background-color: white;
	color: #fff;
	border-radius: 50%;
	text-decoration: none;
	transition: background-color 0.3s ease;
}

.expert-socials a:hover {
	background-color: var(--hover);
}

.expert-socials svg {
	width: 32px;
	height: 32px;
	fill: rgb(145, 145, 145);
	margin: 0;
}

/* Адаптивность */
@media (max-width: 768px) {
	.expert-card {
		text-align: center;
	}

	.expert-image {
		max-width: 120px;
		margin: 0 auto 1rem;
	}

	.expert-socials {
		justify-content: center;
	}
}

.card {
	border-radius: 0.4rem;
	overflow: hidden;
}

.card-header {
	font-size: 1rem;
	padding: 0.75rem;
	border-bottom: 2px solid var(--primary);
}

.card-body ul li {
	margin-bottom: 0.5rem;
}

.card-body a:hover {
	color: #007bff !important;
	/* Выделение при наведении */
}



/* Адаптивность */
@media (max-width: 768px) {
	.card {
		margin-bottom: 1rem;
	}
}








/* Общий стиль секции */
.download-instruction {
	max-width: 600px;
	margin: 2rem auto;
	padding: 1rem;
	background-color: #f9f9f9;
	border-radius: 0.4rem;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Заголовок */
.download-instruction h3 {
	font-size: 1.5rem;
	margin-bottom: 1rem;
	color: #333;
}

/* Описание */
.download-instruction p {
	font-size: 1rem;
	margin-bottom: 1rem;
	color: #666;
}

/* Кнопки */
.download-instruction .btn {
	display: block;
	width: 100%;
	margin-bottom: 1rem;
	text-align: center;
	font-size: 1rem;
	transition: transform 0.2s ease;
}

.download-instruction .btn:hover {
	transform: translateY(-2px);
}

/* Иконки FontAwesome */
.download-instruction i {
	margin-right: 0.5rem;
}



.alert-box {
	max-width: 99%;
	background-color: #f6f8fa;
	/* Нейтральный светло-серый фон */
	border: 1px solid #d0d7de;
	/* Графитовая рамка */
	border-radius: 0.4rem;
	/* Более мягкие закругления */
	padding: 20px;
	margin-bottom: 24px;
	/*box-shadow: var(--shadow);
	 Двойная тень для глубины */
	transition: box-shadow 0.3s ease, transform 0.3s ease;
	/* Анимация при наведении */
}

@media (max-width: 768px) {
	.alert-box {
		max-width: 99.99%;
	}
}

.alert-box:hover {
	box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15), 0 2px 4px rgba(0, 0, 0, 0.1);
	/* Усиление тени при наведении */
	transform: translateY(-2px);
	/* Микро-подъем для эффекта интерактивности */
}

.alert-box p {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: #24292f;
	/* Темно-серый текст */
	font-style: normal;
	/* Обычный стиль текста */
}

.alert-box strong {
	color: #1a73e8;
	/* Синий акцент для важного текста */
	font-weight: bold;
	/* Жирное начертание */
}

/* Для темной темы (опционально) 
.alert-box.dark-theme {
	background-color: #161b22;

	border: 1px solid #30363d;

	color: #c9d1d9;
}

.alert-box.dark-theme strong {
	color: #58a6ff;
}
*/
.rounded-circle {
	border-radius: 50% !important;
}

/* Стили для баннера кук */
.cookie-consent-banner {
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index: 1000;
	background: #fff;
	border-top: 1px solid #ddd;
	background-color: #f9fafb;
	color: #333;
	padding: 15px 0;
	left: 0;
	box-shadow: 0 -4px 6px rgba(0, 0, 0, 0.1);
}

.cookie-consent-banner p {
	margin-bottom: 0;
	/* Убираем отступ у текста */
	font-size: 14px;
	/* Размер шрифта */
}

.cookie-consent-banner a {
	color: #0056b3;
	/* Голубой цвет ссылок */
	text-decoration: underline;
	/* Подчеркнутые ссылки */
}

.modal-cookie-settings {
	display: none;
	/* Скрыто по умолчанию */
	position: fixed;
	/* Фиксированное положение */
	top: 50%;
	/* Центрируем по вертикали */
	left: 50%;
	/* Центрируем по горизонтали */
	transform: translate(-50%, -50%);
	/* Корректируем позицию */
	background-color: #fff;
	/* Белый фон */
	padding: 20px;
	/* Внутренние отступы */
	border-radius: 0.4rem;
	/* Скругленные углы */
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
	/* Тень для объемности */
	width: 90%;
	/* Адаптивная ширина */
	max-width: 600px;
	/* Максимальная ширина */
}

.modal-cookie-settings h3 {
	font-size: 16px;
	/* Размер заголовка */
	margin-bottom: 15px;
	/* Отступ от заголовка */
	color: #333;
	/* Темно-серый цвет текста */
}

.modal-cookie-settings small {
	font-size: 12px;
	/* Размер шрифта для дополнительного текста */
	color: #6c757d;
	/* Серый цвет текста */
}



.content-menu {
	background: var(--white, #ffffff);
	border-radius: 2px;
	padding: 1.2rem;
	/*box-shadow: var(--shadow);*/
	transition: box-shadow 0.3s ease;
}

/* Заголовок */
.content-menu>p {
	font-size: 1.0rem;
	font-weight: 700;
	color: var(--primary, #2d98da);
	margin: 0 0 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid var(--primary-light, #74b9ff);
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Внутренний контейнер */
.content-menu>div {
	padding: 0;
}

/* Список */
.content-menu ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.content-menu ul li {
	margin-bottom: 1rem;
	font-size: 0.97rem;
	line-height: 1.2;
	position: relative;
	padding-left: 1.5rem;
}

.content-menu ul li:last-child {
	margin-bottom: 0;
}

/*
.content-menu ul li:before {
	content: "→";
	position: absolute;
	left: 0;
	color: var(--primary, #2d98da);
	font-size: 1.0rem;
	transition: transform 0.3s ease;
}
*/
/* Ссылки */
.content-menu ul li a {
	text-decoration: none;
	color: var(--text, #2f3542);
	display: block;
	transition: color 0.3s ease, padding-left 0.3s ease;
}

.content-menu ul li a:hover {
	color: var(--accent, #2d98da);
	padding-left: 0.5rem;
}

.content-menu ul li a:hover+ :before,
.content-menu ul li:hover:before {
	transform: translateX(5px);
}

/* Адаптивность */
@media (max-width: 768px) {
	.content-menu {
		padding: 1rem;
		max-width: 100%;
		/* Полная ширина на мобильных */
	}

	.content-menu>p {
		font-size: 1.1rem;
		padding-bottom: 0.3rem;
	}

	.content-menu ul li {
		font-size: 1rem;
		padding-left: 1.15rem;
	}

	.content-menu ul li:before {
		font-size: 1rem;
	}
}

@media (max-width: 576px) {
	.content-menu {
		border-radius: 0.4rem;
	}

	.content-menu ul li {
		margin-bottom: 0.75rem;
	}

	.content-menu ul li a:hover {
		padding-left: 0.25rem;
	}
}




.box-to-close {
	padding: 0.2rem 1rem .1rem 0rem;
	border-radius: 2px;
}

.close {
	color: rgb(255, 255, 255);
	float: right;
	font-size: 20px;
	cursor: pointer;
	/*padding: 0.24rem 0.8rem;
	border-radius: 5rem;
	border: 1px solid white;*/
}

.close:hover {
	color: darkred;
}

/* Формы */
.form-group {
	margin-bottom: 1.5rem;
}

label {
	display: block;
	margin-bottom: 5px;
}

input[type="email"],
input[type="password"] {
	width: 100%;
	padding: 8px;
	border: 1px solid #ccc;
	border-radius: 0.4rem;
}


/* Секция flowchart и калькуляторы -------------*/
.section-calc {
	position: relative;
	padding: 2rem;
	background: var(--background);
	max-width: 800px;
	margin: 0 auto;
	border-radius: 0.4rem;
}

.section-calc h2 {
	font-size: 1.75rem;
	font-weight: 600;
	color: var(--primary);
	margin-bottom: 1.5rem;
	text-align: center;
}

.section-calc h3 {
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--primary);
	margin-bottom: 1rem;
	text-align: center;
}

.section-calc hr {
	border: 0;
	border-top: 2px solid var(--border);
	margin: 1.5rem 0;
}

/* Временная линия */
.section-calc::before {
	content: '';
	position: absolute;
	left: 30px;
	top: 0;
	bottom: 0;
	width: 4px;
	background: var(--primary-2);
}

/* Этапы */
.stage {
	position: relative;
	margin: 1.5rem 0;
	padding: 1.5rem;
	background: var(--white);
	border: 1px solid var(--border);
	border-radius: 0.4rem;
	margin-left: 60px;
	transition: background 0.2s;
}

.stage:hover {
	background: var(--gray);
}

.stage::before {
	content: attr(data-stage);
	position: absolute;
	left: -45px;
	top: 1.5rem;
	width: 30px;
	height: 30px;
	background: var(--primary);
	color: var(--white);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1rem;
	font-weight: 600;
}

.stage p {
	font-size: 1rem;
	color: var(--dark);
	line-height: 1.6;
	margin-bottom: 1rem;
}

/* Список калькуляторов */
.calc-list {
	margin-top: 1rem;
}

.calc-list h4 {
	font-size: 1.1rem;
	font-weight: 500;
	color: var(--primary-2);
	margin-bottom: 0.75rem;
}

.calc-list ul {
	list-style: none;
	padding: 0;
}

.calc-list li {
	position: relative;
	padding-left: 1.5rem;
	margin-bottom: 0.5rem;
}

.calc-list li::before {
	content: '→';
	position: absolute;
	left: 0;
	color: var(--primary);
	font-size: 1.2rem;
}

.calc-list a {
	font-size: 0.95rem;
	color: var(--primary);
	transition: color 0.2s, transform 0.2s;
}

.calc-list a:hover {
	color: var(--accent);
	transform: translateX(5px);
}

.calc-list a[href="#"] {
	color: var(--secondary);
	font-style: italic;
	pointer-events: none;
}

/* Уведомление о разработке */
.box-edit>p {
	display: inline-block;
	background: var(--primary-1);
	color: var(--white);
	padding: 0.5rem 1rem;
	border-radius: 0.4rem;
	font-size: 0.9rem;
	margin: 1.5rem 0 1.5rem 60px;
}

/* Формы калькуляторов ----------2*/
.section-calc form {
	border: 1px solid var(--border);
	padding: 1.5rem;
	border-radius: 0.4rem;
	background: var(--white);
	max-width: 600px;
	margin: 0 auto;
}

.section-calc form details summary small {
	color: var(--primary);
	font-size: .95rem;
}

.section-calc form details p {
	margin-top: 0.6rem;
}

.section-calc form details summary::marker {
	color: var(--primary-1);
	/* Цвет маркера (например, синий) */
}

.section-calc label {
	font-weight: 500;
	display: block;
	color: var(--dark);
	margin-bottom: 0.5rem;
	font-size: 0.95rem;
}

.section-calc input[type="number"],
.section-calc select {
	width: 100%;
	padding: 0.75rem;
	border: 1px solid var(--border);
	border-radius: 0.4rem;
	font-size: 0.95rem;
	margin-bottom: 1rem;
	background: var(--white);
	transition: border-color 0.2s;
}

.section-calc select {
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--secondary) 50%),
		linear-gradient(135deg, var(--secondary) 50%, transparent 50%);
	background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px);
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
}

.section-calc input[type="number"]:focus,
.section-calc select:focus {
	border-color: var(--accent);
	outline: none;
}

.section-calc button[type="button"] {
	width: 100%;
	padding: 0.75rem;
	background: var(--primary);
	color: var(--white);
	border: none;
	border-radius: 0.4rem;
	font-size: 1rem;
	cursor: pointer;
	transition: background 0.2s;
}

.section-calc button[type="button"]:hover {
	background: var(--primary-2);
}

.section-calc button[type="submit"] {
	width: 100%;
	padding: 0.75rem;
	background: var(--primary);
	color: var(--white);
	border: none;
	border-radius: 0.4rem;
	font-size: 1rem;
	cursor: pointer;
	transition: background 0.2s;
}

.section-calc button[type="submit"]:hover {
	background: var(--primary-2);
}

.section-calc .result {
	text-align: center;
	margin-top: 1.5rem;
	color: var(--dark);
	font-size: 1.1rem;
}

.section-calc .result span {
	font-weight: 600;
	color: var(--primary);
}

.section-calc .result p {
	text-align: left;
}

.section-calc .error {
	margin-top: 1.5rem;
}

.section-calc mark {
	font-size: 1.1rem;
}

/* Адаптивность */
@media (max-width: 991.98px) {
	.section-calc {
		padding: 1.5rem;
		max-width: 700px;
	}

	.section-calc h2 {
		font-size: 1.5rem;
	}

	.section-calc h3 {
		font-size: 1.3rem;
	}

	.section-calc::before {
		left: 20px;
		width: 3px;
	}

	.stage {
		margin-left: 50px;
		padding: 1rem;
	}

	.stage::before {
		left: -35px;
		width: 25px;
		height: 25px;
		font-size: 0.9rem;
	}

	.stage h3 {
		font-size: 1.3rem;
	}

	.calc-list h4 {
		font-size: 1rem;
	}

	.calc-list a {
		font-size: 0.9rem;
	}

	.box-edit>p {
		margin-left: 50px;
	}

	.section-calc form {
		padding: 1rem;
	}

	.section-calc input[type="number"],
	.section-calc select {
		font-size: 0.9rem;
	}

	.section-calc button[type="button"] {
		font-size: 0.95rem;
	}
}

@media (max-width: 767.98px) {
	.section-calc {
		padding: 1rem;
		max-width: 100%;
	}

	.section-calc h2 {
		font-size: 1.4rem;
	}

	.section-calc h3 {
		font-size: 1.2rem;
	}

	.section-calc::before {
		left: 15px;
		width: 2px;
	}

	.stage {
		margin-left: 40px;
		padding: 0.75rem;
	}

	.stage::before {
		left: -30px;
		width: 20px;
		height: 20px;
		font-size: 0.8rem;
	}

	.stage h3 {
		font-size: 1.2rem;
	}

	.stage p {
		font-size: 0.9rem;
	}

	.calc-list h4 {
		font-size: 0.95rem;
	}

	.calc-list li {
		padding-left: 1.25rem;
	}

	.calc-list a {
		font-size: 0.85rem;
		line-height: 1.4;
		white-space: normal;
	}

	.box-edit>p {
		margin-left: 40px;
		font-size: 0.85rem;
	}

	.section-calc input[type="number"],
	.section-calc select {
		padding: 0.5rem;
		font-size: 0.85rem;
	}

	.section-calc button[type="button"] {
		padding: 0.5rem;
		font-size: 0.9rem;
	}

	.section-calc h4#result {
		font-size: 1rem;
	}
}



/* Общий стиль для футера */

.footer {
	background: linear-gradient(to right, rgb(128, 115, 92), rgb(56, 49, 34));
	/*rgb(66, 66, 66),rgb(43, 43, 43)); */
	color: white;
	padding: 20px 0;
	box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.1);

}

/* Логотип */
.footer .brand {
	font-size: 1rem;
}

/* Заголовки секций */
.footer h6 {
	font-size: 0.92rem;
	margin-bottom: 0.5rem;
	font-weight: 600;

}

/* Ссылки */
.footer a {
	font-size: 0.9rem;
	color: #ebebeb;
	/* Темно-серый цвет ссылок */
	transition: color 0.3s ease;
	/* Плавный переход цвета */
	text-decoration: none;
	/* Без подчёркивания */
}

.footer a:hover {
	color: #ffffff;
	/* Голубой цвет при наведении */
}

/* Адресные данные */
.footer address {
	font-style: normal;
	/* Нормальный стиль текста */
	line-height: 1.5;
	/* Интервал между строками */
}

/* Адаптивность */
@media (max-width: 768px) {

	.footer h6 {
		text-align: center;
		/* Выравнивание заголовков по центру */
	}

	.footer ul {
		flex-direction: column;
		/* Вертикальное расположение ссылок */
		align-items: center;
		/* Центрирование ссылок */
	}

	.footer address {
		text-align: center;
		/* Выравнивание контактов по центру */
	}
}

/* Эффект hover для списка ссылок */
.footer ul li a:hover {
	text-decoration: underline;
	/* Подчёркивание при наведении */
}

/* Стиль логотипа */
.footer img.logo {
	width: 34px;
	/* Ширина логотипа */
	height: auto;
	/* Сохранение пропорций */
	transition: transform 0.3s ease;
	/* Плавный эффект масштабирования */
}

.footer img.logo:hover {
	transform: scale(1.1);
	/* Масштабирование при наведении */
}






/* Общий стиль для контейнера */
.lead-author {
	display: flex;
	flex-wrap: wrap;
	/* Разрешаем перенос элементов на новую строку */
	gap: 16px;
	justify-content: center;
	padding: .81rem;
	background-color: #ffffff;
	border-radius: 0.4rem;
	/* Скругление углов 
	box-shadow: var(--shadow-0);*/

}

/* Стиль для каждого автора */
.lead-author>p {
	flex: 1 1 calc(50% - 32px);
	/* Занимает половину пространства с учётом отступов (gap) */
	text-align: center;
	/* Центрируем текст */
	background-color: #f9fafb;
	/* Легкий серый фон */
	border-radius: 0.4rem;
	/* Скругление углов */
	padding: 16px;
	/* Внутренние отступы */
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	/* Добавляем плавные эффекты */
	font-size: .7rem;
	color: var(--secondary);
	line-height: 100%;
}

/* Стиль для изображения */
.lead-author img {
	width: 100px;
	/* Ширина аватара */
	height: 100px;
	/* Высота аватара */
	object-fit: cover;
	/* Сохраняем пропорции изображения */
	border-radius: 50%;
	/* Круглая форма аватара */
	margin-bottom: 8px;
	/* Отступ под аватар */
	filter: grayscale(100%);
}

/* Hover-эффект */
.lead-author>p:hover {
	transform: scale(1.05);
	/* Немного увеличиваем при наведении */
	box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
	/* Усиливаем тень */
}

/* Адаптивность для маленьких экранов */
@media (max-width: 768px) {
	.lead-author>p {
		flex: 1 1 100%;
		/* Каждый элемент занимает всю ширину экрана */
		max-width: 100%;
		/* Максимальная ширина */
	}
}

/* Адаптивность для очень маленьких экранов */
@media (max-width: 480px) {
	.lead-author {
		/*flex-direction: column; /* Элементы располагаются вертикально */
		align-items: center;
		/* Центрируем элементы по вертикали */
	}

	.lead-author>p {
		flex: 1 1 auto;
		/* Элементы занимают доступное пространство */
		max-width: none;
		/* Убираем ограничение ширины */
	}
}


q {
	font-style: italic;
	/* Курсив для цитат */
	color: #0056b3;
	/* Голубой цвет для акцента */
	quotes: "“" "”";
	/* Стилизация кавычек */
	font-size: 1.0rem;
}

q::before {
	content: open-quote;
	/* Открывающие кавычки */
	color: #adb5bd;
	/* Серый цвет для кавычек */
	font-size: 1.5rem;
	vertical-align: middle;
}

q::after {
	content: close-quote;
	/* Закрывающие кавычки */
	color: #adb5bd;
	/* Серый цвет для кавычек */
	font-size: 1.5rem;
	vertical-align: middle;
}



/*На проверку - удаление или замену -------------------------------*/
/* Авторский - в начале страниц контейнер */
.author-articles {
	background-color: #f9fafb;
	border-radius: 16px;
	box-shadow: var(--shadow);

}


/* Правая колонка с информацией об авторе */
.author {
	background-color: #f8f9fa;
	border-radius: 16px;
	box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.05);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 1.25rem;
}


/* Аватар автора */
.author-articles img {
	width: 120px;
	height: 120px;
	object-fit: cover;
	border-radius: 50%;
	margin-bottom: 0.3rem;
	/* mb-3 */
}

/* Имя автора */
.author-articles h3 {
	text-align: center;
	font-size: 0.85rem;
	margin-bottom: 0.1rem;
	color: #a5a5a5;
}

/* Кнопка "Об авторе" */
.author-articles .btn.btn-gray {
	background-color: #adb5bd;
	color: #a5a5a5;
	padding: 0 1.5rem;
	border: none;
	transition: background-color 0.3s ease, transform 0.3s ease;
	text-decoration: none;
	cursor: pointer;
}


.author-articles a span {
	font-weight: 300;
	color: #a5a5a5;
	font-size: .8rem;
}

/* Адаптивность для маленьких экранов */
@media (max-width: 768px) {
	.row.author-articles {
		flex-direction: column;
		/* Вертикальное расположение элементов */
	}


	.author-articles img {
		width: 80px;
		/* Уменьшаем размер аватара */
		height: 80px;
	}

	.author-articles h3 {
		font-size: 0.875rem;
		/* Уменьшаем размер шрифта */
	}

	.author-articles .btn.btn-gray {
		font-size: 0.875rem;
		/* Уменьшаем размер шрифта */
		padding-left: 1rem;
		/* px-6 уменьшаем */
		padding-right: 1rem;
	}
}


.box-edit li a,
.box-edit h2,
.box-edit h3,
.box-edit h4 {
	color: #6c757d;
}

.box-edit {
	color: #6c757d;
	background-color: #c2c2c2;
	padding: 40px;
}





/* Виджеты в сайдбаре */
.widget {
	background: var(--white);
	border: 1px solid var(--border);
	border-radius: 0.4rem;
	padding: 1.5rem;
}

/* Ограничение высоты с прокруткой */
.widget ul {
	max-height: 320px;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: var(--primary) var(--gray);
	list-style: none;
	padding: 0rem;
}

.widget-list {
	list-style: none;
	padding: 0rem;
}

.widget ul::-webkit-scrollbar {
	width: 6px;
}

.widget ul::-webkit-scrollbar-track {
	background: var(--gray);
}

.widget ul::-webkit-scrollbar-thumb {
	background: var(--primary);
	border-radius: 3px;
}

.widget h3 {
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--primary);
	margin-bottom: 1rem;
}

.widget ul li {
	margin-bottom: 0.15rem;
}

.widget ul li a {
	display: flex;
	align-items: center;
	color: var(--dark);
	text-decoration: none;
	font-size: 0.95rem;
	font-weight: 500;
	padding: 0.5rem;
	border-radius: 4px;
	transition: background 0.2s, color 0.2s;
}

.widget ul li a:hover {
	background: var(--gray);
	color: var(--accent);
}


/* Адаптивность */
@media (max-width: 991.98px) {
	.widget {
		padding: 1rem;
	}

	.widget h3 {
		font-size: 1.1rem;
	}

	.widget-link {
		font-size: 0.9rem;
	}

	.widget-icon {
		width: 18px;
		height: 18px;
	}

	.widget ul {
		max-height: 280px;
	}
}

@media (max-width: 767.98px) {
	.widget-link {
		padding: 0.4rem;
	}

	.widget ul {
		max-height: 240px;
	}
}






.services-overview {
	/*max-width: 1200px;*/
	margin: var(--spacing-lg, 2rem) auto;
	padding: var(--spacing-md, 1rem);
	background: var(--light, #f9f9f9);
}

.offer {
	color: var(--accent, #d4a373);
	font-weight: 600;
	margin-bottom: var(--spacing-sm, 0.5rem);
	display: block;
}

.services-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: var(--spacing-md, 1rem);
}

.service-card {
	border: 1px solid var(--primary, #7a6f58);
	border-radius: var(--border-radius, 0.5rem);
	padding: var(--spacing-md, 1rem);
	background: var(--light, #f9f9f9);
	text-align: center;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	touch-action: manipulation;
}

.service-card:hover,
.service-card:focus {
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.service-icon {
	width: 100%;
	/* height: 50px;*/
	margin-bottom: var(--spacing-sm, 0.5rem);
}

.service-card h3 {
	font-size: 1.2em;
	margin-bottom: var(--spacing-sm, 0.5rem);
	color: var(--text, #333);
}

.service-card p {
	font-size: 0.9em;
	color: #666;
	margin-bottom: var(--spacing-sm, 0.5rem);
	text-wrap: balance;
}

.benefit {
	display: block;
	font-size: 0.85em;
	color: var(--accent, #d4a373);
	margin-bottom: var(--spacing-sm, 0.5rem);
}



@media (prefers-reduced-motion: reduce) {
	.service-card {
		transition: none;
	}
}

.cta-btn {
	display: inline-block;
	padding: 0.5rem 1rem;
	background-color: var(--accent, #d4a373);
	color: white;
	text-decoration: none;
	border-radius: var(--border-radius, 0.5rem);
	margin-top: var(--spacing-md, 1rem);
	outline: 1px solid var(--accent, #d4a373);
	outline-offset: 2px;
}

.cta-btn:hover,
.cta-btn:focus {
	background-color: var(--accent-hover, #c6935f);
	outline: 2px solid var(--accent, #d4a373);
	outline-offset: 2px;
	color: white;
}

/* Поисковая строка */
.search-form {
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 350px;
	position: relative;
	margin: 10px 0;
}

.search-input {
	width: 100%;
	padding: 12px 10px;
	border: 1px solid #e0e0e0 !important;
	border-radius: 200px !important;
	font-size: 1rem;
	outline: none;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.search-input:focus {
	border-color: var(--primary);
	box-shadow: 0 0 8px rgba(255, 196, 0, 0.2);
}

.search-input::placeholder {
	color: #999;
	opacity: 0.8;
}

.search-button {
	position: absolute;
	right: 10px;
	top: 8px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	transition: transform 0.2s ease;
}

.search-button:hover {
	transform: scale(1.1);
}

.search-button svg {
	width: 20px;
	height: 20px;
	fill: var(--primary);
}

@media (max-width: 768px) {
	.search-form {
		max-width: 100%;
	}

	.search-input {
		padding: 10px 40px 10px 15px;
		font-size: 0.9rem;
	}

	.search-button {
		width: 25px;
		height: 25px;
	}

	.search-button svg {
		width: 18px;
		height: 18px;
	}
}



.testimonial-item {
	margin-bottom: 20px;
	padding: 15px;
	border: 0px solid #ddd;
	border-radius: 5px;
}

.testimonial-item strong {
	font-weight: bold;
}

.testimonial-item span .rating {
	color: rgb(255, 196, 0);
	font-size: 1.2em;
}

@media (max-width: 768px) {
	.testimonial-item p {
		font-size: 0.9em;
	}
}

@media (max-width: 480px) {
	.testimonials {
		padding: 10px;
	}

	.testimonial-item {
		padding: 10px;
	}

	.testimonial-item p {
		font-size: 0.85em;
	}
}

/*Table-start*/
.table {
	width: 100%;
	border: 1px solid rgb(100, 100, 100);
	border-radius: 0.4rem;
	font-size: 0.95rem;
	color: var(--dark);
	background: var(--white);
	border-collapse: collapse;
	min-width: 1200px;
	/* Гарантированная ширина для прокрутки */
}

.table th,
.table td {
	padding: 0.75rem;
	vertical-align: middle;
	border: 1px solid rgb(220, 220, 220);
	text-align: left;
}

/* Фиксация первого столбца */
.table th:first-child,
.table td:first-child {
	position: -webkit-sticky;
	/* Для совместимости с Safari */
	position: sticky;
	left: 0;
	background: white;
	/* Фон для предотвращения наложения */
	z-index: 2;
	/* Выше остальных ячеек */
	min-width: 200px;
	/* Увеличена для читаемости */
	box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
	/* Тень для разделения */
}

/* Заголовок фиксированного столбца */
.table thead th:first-child {
	z-index: 3;
	/* Выше остальных заголовков */
	background: var(--primary);
	/* Сохранение фона заголовка */
	color: white;
}

.table thead {
	background: var(--primary);
	color: white;
}

.table thead th {
	border-bottom: 2px solid var(--border);
}

.table-striped tbody tr:nth-of-type(odd) {
	background: rgb(245, 245, 245);
}

.table tbody+tbody {
	border-top: 2px solid rgb(245, 245, 245);
}

.table-responsive-sm {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	/* Плавная прокрутка */
	position: relative;
	/* Контекст для sticky */
	max-width: 100%;
	/* Убеждаемся, что контейнер не обрезает */
}

/* Медиа-запросы */
@media (max-width: 991.98px) {
	.table {
		font-size: 0.9rem;
	}

	.table th,
	.table td {
		padding: 0.5rem;
	}
}

@media (max-width: 767.98px) {
	.table {
		font-size: 0.85rem;
	}

	.table th,
	.table td {
		padding: 0.4rem;
	}
}

@media (max-width: 575.98px) {
	.table-responsive-sm {
		width: 100%;
		overflow-x: auto;
	}
}

/* Стили для блока адреса в шапке */
.box-address {
	background: rgba(230, 230, 230, 1);
}

[itemprop="address"] {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	font-size: 14px;
	line-height: 1.4;
	padding: 4px 0;
}

/* Стили для телефона */
.expert-specialty[itemprop="telephone"] {
	color: #e71d02ff;
	text-decoration: none;
	font-weight: 500;
	transition: color 0.2s ease;
}

.expert-specialty[itemprop="telephone"]:hover {
	color: #003d80;
	text-decoration: underline;
}

/* Стили для города и улицы */
[itemprop="addressLocality"],
[itemprop="streetAddress"] {
	color: #333333;
}

/* Стили для номера офиса */
[itemprop="address"] span:not([itemprop]) {
	color: #333333;
}

/* Адаптивность */
@media (max-width: 991px) {
	[itemprop="address"] {
		font-size: 13px;
		gap: 6px;
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (max-width: 767px) {
	[itemprop="address"] {
		font-size: 12px;
		padding: 4px 0;
	}
}






