dl,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
p,
pre,
ul {
	margin-top: 0;
}

address,
dl,
ol,
p,
pre,
ul {
	margin-bottom: 1rem;
}

img,
svg {
	vertical-align: middle;
}

body,
caption {
	text-align: left;
}

button,
hr,
input {
	overflow: visible;
}

pre,
textarea {
	overflow: auto;
}

dd,
h1,
h2,
h3,
h4,
h5,
h6,
label,
legend {
	margin-bottom: 0.5rem;
}

address,
legend {
	line-height: inherit;
}

progress,
sub,
sup {
	vertical-align: baseline;
}

*,
body,
fieldset {
	margin: 0;
}

.menu__link a:after,
.menu__link a:before {
	bottom: 1rem;
	background: var(--black);
	width: 0;
}

#pre-loader-box .wrapper-text .wrapper span.letter-1,
.hamburger .close,
.hamburger.active .open,
.promo__link,
.promo__link:hover {
	color: var(--black);
}

.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden,
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside
	> .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden,
.resume__item-head h4,
.skills__item h3,
.skills__item p,
ol ol,
ol ul,
ul ol,
ul ul {
	margin-bottom: 0;
}

.mCustomScrollbar {
	touch-action: pinch-zoom;
}

.mCustomScrollbar.mCS_no_scrollbar,
.mCustomScrollbar.mCS_touch_action {
	touch-action: auto;
}

.mCustomScrollBox {
	position: relative;
	overflow: hidden;
	height: 100%;
	max-width: 100%;
	outline: 0;
	direction: ltr;
}

.mCSB_container {
	overflow: hidden;
	width: auto;
	height: auto;
}

.mCSB_inside > .mCSB_container {
	margin-right: 30px;
}

.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
	margin-right: 0;
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_container,
.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper {
	margin-right: 0;
	margin-left: 30px;
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
	margin-left: 0;
}

.mCSB_scrollTools {
	position: absolute;
	width: 16px;
	height: auto;
	left: auto;
	top: 0;
	right: 0;
	bottom: 0;
	opacity: 0.75;
	filter: 'alpha(opacity=75)';
	-ms-filter: 'alpha(opacity=75)';
}

.mCSB_outside + .mCSB_scrollTools {
	right: -26px;
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools,
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
	right: auto;
	left: 0;
}

.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
	left: -26px;
}

.mCSB_scrollTools .mCSB_draggerContainer {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	height: auto;
}

.mCSB_scrollTools a + .mCSB_draggerContainer {
	margin: 20px 0;
}

.mCSB_scrollTools .mCSB_draggerRail {
	width: 2px;
	height: 100%;
	margin: 0 auto;
	border-radius: 16px;
}

.mCSB_scrollTools .mCSB_dragger {
	cursor: pointer;
	width: 100%;
	height: 30px;
	z-index: 1;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	position: relative;
	width: 4px;
	height: 100%;
	margin: 0 auto;
	border-radius: 16px;
	text-align: center;
}

.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	.mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_dragger
	.mCSB_dragger_bar {
	width: 12px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail {
	width: 8px;
}

.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonUp {
	display: block;
	position: absolute;
	height: 20px;
	width: 100%;
	overflow: hidden;
	margin: 0 auto;
	cursor: pointer;
}

.mCSB_horizontal.mCSB_inside > .mCSB_container {
	margin-right: 0;
	margin-bottom: 30px;
}

.mCSB_horizontal.mCSB_outside > .mCSB_container {
	min-height: 100%;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal {
	width: auto;
	height: 16px;
	top: auto;
	right: 0;
	bottom: 0;
	left: 0;
}

.mCustomScrollBox
	+ .mCSB_scrollTools
	+ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
	bottom: -26px;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer {
	margin: 0 20px;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	width: 100%;
	height: 2px;
	margin: 7px 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
	width: 30px;
	height: 100%;
	left: 0;
}

.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	width: 100%;
	height: 4px;
	margin: 6px auto;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	.mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_dragger
	.mCSB_dragger_bar {
	height: 12px;
	margin: 2px auto;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail {
	height: 8px;
	margin: 4px 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
	display: block;
	position: absolute;
	width: 20px;
	height: 100%;
	overflow: hidden;
	margin: 0 auto;
	cursor: pointer;
}

.mCS-dir-rtl
	> .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside
	> .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden
	+ .mCSB_scrollTools
	~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft {
	left: 0;
}

.mCS-dir-rtl
	> .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside
	> .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden
	+ .mCSB_scrollTools
	~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
	right: 0;
}

.mCSB_container_wrapper {
	position: absolute;
	height: auto;
	width: auto;
	overflow: hidden;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin-right: 30px;
	margin-bottom: 30px;
}

.mCSB_container_wrapper > .mCSB_container {
	padding-right: 30px;
	padding-bottom: 30px;
	box-sizing: border-box;
}

.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical {
	bottom: 20px;
}

.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
	right: 20px;
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden
	+ .mCSB_scrollTools.mCSB_scrollTools_vertical {
	bottom: 0;
}

.mCS-dir-rtl
	> .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside
	> .mCSB_scrollTools.mCSB_scrollTools_horizontal {
	left: 20px;
}

.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container {
	padding-right: 0;
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container {
	padding-bottom: 0;
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside
	> .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
	margin-right: 0;
	margin-left: 0;
}

.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar {
	transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s,
		margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s,
		margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s,
		opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {
	opacity: 0;
	filter: 'alpha(opacity=0)';
	-ms-filter: 'alpha(opacity=0)';
}

.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools,
.mCustomScrollBox:hover > .mCSB_scrollTools,
.mCustomScrollBox:hover ~ .mCSB_scrollTools,
.mCustomScrollbar
	> .mCustomScrollBox
	> .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar
	> .mCustomScrollBox
	~ .mCSB_scrollTools.mCSB_scrollTools_onDrag {
	opacity: 1;
	filter: 'alpha(opacity=100)';
	-ms-filter: 'alpha(opacity=100)';
}

.mCSB_scrollTools .mCSB_draggerRail {
	filter: 'alpha(opacity=40)';
	-ms-filter: 'alpha(opacity=40)';
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(255, 255, 255, 0.75);
	filter: 'alpha(opacity=75)';
	-ms-filter: 'alpha(opacity=75)';
}

.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	background-color: rgba(255, 255, 255, 0.85);
	filter: 'alpha(opacity=85)';
	-ms-filter: 'alpha(opacity=85)';
}

.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
	background-color: rgba(255, 255, 255, 0.9);
	filter: 'alpha(opacity=90)';
	-ms-filter: 'alpha(opacity=90)';
}

.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight,
.mCSB_scrollTools .mCSB_buttonUp {
	background-image: url(libs/mCSB_buttons.png);
	background-repeat: no-repeat;
	opacity: 0.4;
	filter: 'alpha(opacity=40)';
	-ms-filter: 'alpha(opacity=40)';
}

.mCSB_scrollTools .mCSB_buttonUp {
	background-position: 0 0;
}

.mCSB_scrollTools .mCSB_buttonDown {
	bottom: 0;
	background-position: 0 -20px;
}

.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: 0 -40px;
}

.mCSB_scrollTools .mCSB_buttonRight {
	background-position: 0 -56px;
}

.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover,
.mCSB_scrollTools .mCSB_buttonUp:hover {
	opacity: 0.75;
	filter: 'alpha(opacity=75)';
	-ms-filter: 'alpha(opacity=75)';
}

.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active,
.mCSB_scrollTools .mCSB_buttonUp:active {
	opacity: 0.9;
	filter: 'alpha(opacity=90)';
	-ms-filter: 'alpha(opacity=90)';
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(0, 0, 0, 0.15);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(0, 0, 0, 0.75);
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-2.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
	background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp,
.mCS-dark.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -80px 0;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown,
.mCS-dark.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -80px -20px;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -80px -40px;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight,
.mCS-dark.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -80px -56px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail {
	width: 4px;
	background-color: rgba(255, 255, 255, 0.1);
	border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	width: 4px;
	background-color: rgba(255, 255, 255, 0.75);
	border-radius: 1px;
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	background-color: rgba(255, 255, 255, 0.85);
}

.mCS-inset-3-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
	background-color: rgba(255, 255, 255, 0.9);
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -32px 0;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -32px -20px;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -40px -40px;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -40px -56px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -112px 0;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -112px -20px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -120px -40px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -120px -56px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail {
	width: 4px;
	background-color: rgba(255, 255, 255, 0.1);
	border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	width: 6px;
	background-color: rgba(255, 255, 255, 0.75);
	border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	width: 100%;
	height: 4px;
	margin: 6px 0;
}

.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	width: 100%;
	height: 6px;
	margin: 5px auto;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -16px 0;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -16px -20px;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -20px -40px;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -20px -56px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -96px 0;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -96px -20px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -100px -40px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -100px -56px;
}

.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(255, 255, 255, 0.1);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	width: 2px;
}

.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	width: 100%;
}

.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	width: 100%;
	height: 2px;
	margin: 7px auto;
}

.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(255, 255, 255, 0.15);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded.mCSB_scrollTools .mCSB_dragger {
	height: 14px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	width: 14px;
	margin: 0 1px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger {
	width: 14px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal
	.mCSB_dragger
	.mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	height: 14px;
	margin: 1px 0;
}

.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	.mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_dragger
	.mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	.mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_dragger
	.mCSB_dragger_bar {
	width: 16px;
	height: 16px;
	margin: -1px 0;
}

.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail {
	width: 4px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	.mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_dragger
	.mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	.mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_dragger
	.mCSB_dragger_bar {
	height: 16px;
	width: 16px;
	margin: 0 -1px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail {
	height: 4px;
	margin: 6px 0;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp {
	background-position: 0 -72px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown {
	background-position: 0 -92px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: 0 -112px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight {
	background-position: 0 -128px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -80px -72px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -80px -92px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -80px -112px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -80px -128px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	background-color: transparent;
	background-position: center;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==);
	background-repeat: repeat-y;
	opacity: 0.3;
	filter: 'alpha(opacity=30)';
	-ms-filter: 'alpha(opacity=30)';
}

.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	height: 4px;
	margin: 6px 0;
	background-repeat: repeat-x;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -16px -72px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -16px -92px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -20px -112px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -20px -128px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=);
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -96px -72px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -96px -92px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -100px -112px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -100px -128px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-repeat: repeat-y;
	background-image: linear-gradient(
		to right,
		rgba(255, 255, 255, 0.5) 0,
		rgba(255, 255, 255, 0) 100%
	);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	background-repeat: repeat-x;
	background-image: linear-gradient(
		to bottom,
		rgba(255, 255, 255, 0.5) 0,
		rgba(255, 255, 255, 0) 100%
	);
}

.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger {
	height: 70px;
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger {
	width: 70px;
}

.mCS-3d-dark.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d.mCSB_scrollTools {
	opacity: 1;
	filter: 'alpha(opacity=30)';
	-ms-filter: 'alpha(opacity=30)';
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail {
	border-radius: 16px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail {
	width: 8px;
	background-color: rgba(0, 0, 0, 0.2);
	box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5),
		inset -1px 0 1px rgba(255, 255, 255, 0.2);
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	background-color: #555;
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	width: 100%;
	height: 8px;
	margin: 4px 0;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5),
		inset 0 -1px 1px rgba(255, 255, 255, 0.2);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	width: 100%;
	height: 8px;
	margin: 4px auto;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp,
.mCS-3d.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -32px -72px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown,
.mCS-3d.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -32px -92px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -40px -112px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight,
.mCS-3d.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -40px -128px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(0, 0, 0, 0.1);
	box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp {
	background-position: -112px -72px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown {
	background-position: -112px -92px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft {
	background-position: -120px -112px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight {
	background-position: -120px -128px;
}

.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
	border-radius: 7px;
}

.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical,
.mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical {
	right: 1px;
}

.mCS-3d-thick-dark.mCSB_scrollTools_vertical,
.mCS-3d-thick.mCSB_scrollTools_vertical {
	box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1),
		inset 0 0 14px rgba(0, 0, 0, 0.5);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal,
.mCS-3d-thick.mCSB_scrollTools_horizontal {
	bottom: 1px;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1),
		inset 0 0 14px rgba(0, 0, 0, 0.5);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	border-radius: 5px;
	box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4);
	width: 12px;
	margin: 2px;
	position: absolute;
	height: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
	height: 12px;
	width: auto;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
	background-color: rgba(0, 0, 0, 0.05);
	box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
.mCSB_scrollTools .mCSB_draggerRail {
	background-color: transparent;
}

.mCS-3d-thick-dark.mCSB_scrollTools {
	box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1),
		inset 0 0 14px rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4),
		inset -1px 0 0 rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4),
		inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	background-color: #777;
}

.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical,
.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical {
	right: 0;
	margin: 12px 0;
}

.mCustomScrollBox.mCS-minimal
	+ .mCSB_scrollTools
	+ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark
	+ .mCSB_scrollTools
	+ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark
	+ .mCSB_scrollTools.mCSB_scrollTools_horizontal {
	bottom: 0;
	margin: 0 12px;
}

.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical,
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical {
	left: 0;
	right: auto;
}

.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger {
	height: 50px;
}

.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger {
	width: 50px;
}

.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(255, 255, 255, 0.2);
	filter: 'alpha(opacity=20)';
	-ms-filter: 'alpha(opacity=20)';
}

.mCS-minimal.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
	background-color: rgba(255, 255, 255, 0.5);
	filter: 'alpha(opacity=50)';
	-ms-filter: 'alpha(opacity=50)';
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(0, 0, 0, 0.2);
	filter: 'alpha(opacity=20)';
	-ms-filter: 'alpha(opacity=20)';
}

.mCS-minimal-dark.mCSB_scrollTools
	.mCSB_dragger.mCSB_dragger_onDrag
	.mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
	background-color: rgba(0, 0, 0, 0.5);
	filter: 'alpha(opacity=50)';
	-ms-filter: 'alpha(opacity=50)';
}

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail {
	width: 6px;
	background-color: rgba(0, 0, 0, 0.2);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	width: 6px;
}

.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	width: 100%;
	height: 6px;
	margin: 5px 0;
}

.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_dragger.mCSB_dragger_onDrag_expanded
	+ .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand
	.mCSB_draggerContainer:hover
	.mCSB_draggerRail {
	height: 12px;
	margin: 2px 0;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(0, 0, 0, 0.1);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail {
	width: 12px;
	background-color: rgba(0, 0, 0, 0.2);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	width: 6px;
	margin: 3px 5px;
	position: absolute;
	height: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	height: 6px;
	margin: 5px 3px;
	position: absolute;
	width: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail {
	width: 100%;
	height: 12px;
	margin: 2px 0;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail {
	background-color: transparent;
	border: 1px solid rgba(255, 255, 255, 0.2);
	box-sizing: border-box;
}

*,
.menu,
.menu__link,
.promo__link:before,
::after,
::before {
	box-sizing: border-box;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
	border-color: rgba(0, 0, 0, 0.2);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(255, 255, 255, 0.6);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(0, 0, 0, 0.6);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(255, 255, 255, 0.75);
}

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

article,
aside,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
	display: block;
}

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
		'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
		'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	background-color: #fff;
	background-color: var(--white);
	color: var(--black);
	letter-spacing: 0.3px;
}

[tabindex='-1']:focus {
	outline: 0 !important;
}

hr {
	box-sizing: content-box;
	height: 0;
}

abbr[data-original-title],
abbr[title] {
	text-decoration: underline;
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted;
	cursor: help;
	border-bottom: 0;
	-webkit-text-decoration-skip-ink: none;
	text-decoration-skip-ink: none;
}

address {
	font-style: normal;
}

dt {
	font-weight: 700;
}

dd {
	margin-left: 0;
}

blockquote,
figure {
	margin: 0 0 1rem;
}

b,
strong {
	font-weight: bolder;
}

small {
	font-size: 80%;
}

sub,
sup {
	position: relative;
	font-size: 75%;
	line-height: 0;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

a {
	color: #007bff;
	text-decoration: none;
	background-color: transparent;
}

a:hover {
	color: #0056b3;
	text-decoration: underline;
}

.btn:hover,
.contacts__link:hover,
.menu__link a,
.menu__link:last-child a,
.menu__link:last-child a:hover,
.promo__link:hover {
	text-decoration: none;
}

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

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

code,
kbd,
pre,
samp {
	font-family: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
		'Courier New', monospace;
	font-size: 1em;
}

img {
	border-style: none;
}

svg {
	overflow: hidden;
}

table {
	border-collapse: collapse;
}

caption {
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
	color: #6c757d;
	caption-side: bottom;
}

th {
	text-align: inherit;
}

label {
	display: inline-block;
}

button {
	border-radius: 0;
}

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

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

button,
select {
	text-transform: none;
}

select {
	word-wrap: normal;
}

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

.hamburger:hover,
[type='button']:not(:disabled),
[type='reset']:not(:disabled),
[type='submit']:not(:disabled),
button:not(:disabled) {
	cursor: pointer;
}

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

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

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

textarea {
	resize: vertical;
}

fieldset {
	min-width: 0;
	padding: 0;
	border: 0;
}

legend {
	display: block;
	width: 100%;
	max-width: 100%;
	padding: 0;
	font-size: 1.5rem;
	color: inherit;
	white-space: normal;
}

[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
	height: auto;
}

[type='search'] {
	outline-offset: -2px;
	-webkit-appearance: none;
}

[type='search']::-webkit-search-decoration {
	-webkit-appearance: none;
}

::-webkit-file-upload-button {
	font: inherit;
	-webkit-appearance: button;
}

output {
	display: inline-block;
}

summary {
	display: list-item;
	cursor: pointer;
}

.menu__link:last-child a::after,
.menu__link:last-child a::before,
template {
	display: none;
}

[hidden] {
	display: none !important;
}

:root {
	--main-color: #3aebca;
	--main-color-light: #d6f5ef;
	--main-color-dark: #3aebcae0;
	--black: #08080a;
	--white: #fffffc;
}

* {
	font-family: Poppins, sans-serif;
	padding: 0;
}

.container {
	width: 1140px;
	margin: 0 auto;
}

.divider {
	width: 60px;
	height: 3px;
	background-color: #3aebca;
	margin: 25px auto 0;
}

video {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

.cf:after {
	content: '';
	display: table;
	width: 100%;
	clear: both;
}

#pre-loader-box {
	visibility: visible;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100vw;
	height: 100vh;
	background-color: var(--white);
	position: fixed;
	z-index: 1000001;
	transition: opacity 1.5s, visibility 2s;
}

#pre-loader-box .wrapper-text {
	font-family: Poppins, sans-serif;
	font-size: 6em;
	line-height: 1em;
	font-weight: 700;
	text-align: center;
	position: relative;
	transition: 1.5s;
}

@media (max-width: 717px) {
	#pre-loader-box .wrapper-text {
		font-size: 3em;
	}
}

@media (max-width: 404px) {
	#pre-loader-box .wrapper-text {
		font-size: 2.2em;
	}
}

#pre-loader-box .wrapper-text:hover {
	cursor: default;
}

#pre-loader-box .wrapper-text .wrapper {
	display: inline-block;
	top: -900px;
	position: relative;
	height: 150px;
	width: 90px;
	transition: 0.3s;
}

#pre-loader-box .wrapper-text .wrapper span {
	position: absolute;
	top: 0;
	right: 0;
	transition: 0.3s;
}

#pre-loader-box .wrapper-text .wrapper span.space {
	padding: 0;
	min-width: 30px;
	display: inline-block;
}

body,
html {
	scrollbar-arrow-color: var(--white);
	scrollbar-base-color: transparent;
	scrollbar-shadow-color: var(--main-color);
	scrollbar-highlight-color: var(--white);
}

body ::-webkit-scrollbar-track,
html ::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 4px rgba(190, 190, 190, 0.3);
	background-color: transparent;
	overflow: hidden;
}

body ::-ms-scrollbar-track,
html ::-ms-scrollbar-track {
	box-shadow: inset 0 0 4px rgba(190, 190, 190, 0.3);
	background-color: transparent;
	overflow: hidden;
}

body ::-moz-scrollbar-track,
html ::-moz-scrollbar-track {
	box-shadow: inset 0 0 4px rgba(190, 190, 190, 0.3);
	background-color: transparent;
	overflow: hidden;
}

body ::-o-scrollbar-track,
html ::-o-scrollbar-track {
	box-shadow: inset 0 0 4px rgba(190, 190, 190, 0.3);
	background-color: transparent;
	overflow: hidden;
}

body ::-khtml-scrollbar-track,
html ::-khtml-scrollbar-track {
	box-shadow: inset 0 0 4px rgba(190, 190, 190, 0.3);
	background-color: transparent;
	overflow: hidden;
}

body ::-webkit-scrollbar,
html ::-webkit-scrollbar {
	width: 4px;
	height: 4px;
	background-color: var(--main-color-light);
}

body ::-ms-scrollbar,
html ::-ms-scrollbar {
	width: 4px;
	height: 4px;
	background-color: var(--main-color-light);
}

body ::-moz-scrollbar,
html ::-moz-scrollbar {
	width: 4px;
	height: 4px;
	background-color: var(--main-color-light);
}

body ::-o-scrollbar,
html ::-o-scrollbar {
	width: 4px;
	height: 4px;
	background-color: var(--main-color-light);
}

body ::-khtml-scrollbar,
html ::-khtml-scrollbar {
	width: 4px;
	height: 4px;
	background-color: var(--main-color-light);
}

body ::-webkit-scrollbar-thumb,
html ::-webkit-scrollbar-thumb {
	background-color: var(--main-color);
	border-radius: 3px;
}

body ::-ms-scrollbar-thumb,
html ::-ms-scrollbar-thumb {
	background-color: var(--main-color);
	border-radius: 3px;
}

body ::-moz-scrollbar-thumb,
html ::-moz-scrollbar-thumb {
	background-color: var(--main-color);
	border-radius: 3px;
}

body ::-o-scrollbar-thumb,
html ::-o-scrollbar-thumb {
	background-color: var(--main-color);
	border-radius: 3px;
}

body ::-khtml-scrollbar-thumb,
html ::-khtml-scrollbar-thumb {
	background-color: var(--main-color);
	border-radius: 3px;
}

#progress-box {
	height: 4px;
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	background-color: var(--main-color-light);
	z-index: 999999;
}

.progress-wrapper {
	position: relative;
	height: 4px;
}

.progress-line {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	position: absolute;
	width: 0%;
	height: 100%;
	background-color: var(--main-color);
	border: none;
}

.promo {
	min-height: 100vh;
	position: relative;
	background: url(../img/logo.png) center 10px no-repeat fixed,
		linear-gradient(
				180deg,
				rgba(255, 255, 255, 0.6) 0,
				rgba(255, 255, 255, 0.55) 0.01%,
				rgba(255, 255, 255, 0.5) 0.02%,
				rgba(255, 255, 255, 0.44) 100%
			)
			fixed,
		url(../img/main_bg.jpg) center/cover no-repeat fixed;
	padding-top: 363px;
}

.menu__link:first-child a:after,
.menu__link:first-child a:before,
.promo__link {
	background: 0 0;
}

.promo__title {
	max-width: 535px;
	margin: 10px 0 0 auto;
	text-align: right;
}

.promo__subtitle {
	position: relative;
	padding-left: 10px;
	z-index: 2;
	text-align: right;
}

.menu__link,
.menu__link a,
.title__section-subtitle,
.title__section-title {
	text-align: center;
}

.promo__subtitle:before {
	content: '';
	width: 36px;
	height: 36px;
	background: #3aebca;
	position: absolute;
	border-radius: 100%;
	z-index: -1;
	left: 0;
	top: -25%;
}

.promo__subtitle::before {
	left: unset;
	right: 239px;
	top: -7px;
}

.promo__btns {
	margin: 25px 0 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 282px;
}

.about__descr .divider,
.contacts__descr .divider,
.menu__list {
	margin: 0;
}

.promo__link {
	position: relative;
	display: block;
	height: 45px;
	padding: 11px 25px;
	border: 1px solid var(--black);
	border-radius: 0;
	overflow: hidden;
	z-index: 1;
	transition: 0.3s ease-out;
}

.promo__link:after {
	content: '';
	background: inherit;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 1;
}

.promo__link span {
	position: relative;
	z-index: 3;
	text-shadow: 1px 1px 23px #fff;
}

.promo__link:before {
	content: '';
	position: absolute;
	bottom: calc(-100% - 21px);
	left: 50%;
	transform: translate(-50%, -50%) scale(1);
	display: block;
	width: 40px;
	height: 40px;
	background: var(--main-color);
	border-radius: 50px;
	transition: transform 0.5s ease-in-out, border-bottom-color 0.3s ease-in-out;
	z-index: 2;
}

.promo__link:hover {
	border-color: var(--main-color);
	box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5);
	border-radius: 5px;
	cursor: pointer;
	z-index: 8;
	transition: 1.5s ease-out;
}

.promo__link:hover:before {
	transform: scale(8.3);
}

.chevron-wrapper {
	position: absolute;
	bottom: 5%;
	left: 60%;
	cursor: pointer;
}

.chevron-wrapper .chevron-container {
	position: relative;
	width: 28px;
	height: 60px;
}

.chevron-wrapper .chevron {
	position: absolute;
	width: 28px;
	height: 8px;
	opacity: 0;
	transform: scale3d(0.5, 0.5, 0.5);
	-webkit-animation: 3s ease-out infinite move;
	animation: 3s ease-out infinite move;
}

.chevron-wrapper .chevron:first-child {
	-webkit-animation: 3s ease-out 1s infinite move;
	animation: 3s ease-out 1s infinite move;
}

.chevron-wrapper .chevron:nth-child(2) {
	-webkit-animation: 3s ease-out 2s infinite move;
	animation: 3s ease-out 2s infinite move;
}

.chevron-wrapper .chevron:after,
.chevron-wrapper .chevron:before {
	content: ' ';
	position: absolute;
	top: 0;
	height: 100%;
	width: 51%;
	background: var(--black);
}

.chevron-wrapper .chevron:before {
	left: 0;
	transform: skew(0deg, 30deg);
}

.chevron-wrapper .chevron:after {
	right: 0;
	width: 50%;
	transform: skew(0deg, -30deg);
}

@-webkit-keyframes move {
	25% {
		opacity: 0.8;
	}

	33% {
		opacity: 0.8;
		transform: translateY(30px);
	}

	67% {
		opacity: 0.8;
		transform: translateY(40px);
	}

	100% {
		opacity: 0;
		transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
	}
}

@keyframes move {
	25% {
		opacity: 0.8;
	}

	33% {
		opacity: 0.8;
		transform: translateY(30px);
	}

	67% {
		opacity: 0.8;
		transform: translateY(40px);
	}

	100% {
		opacity: 0;
		transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
	}
}

.title {
	font-weight: 700;
	font-size: 36px;
	line-height: 130%;
}

.title_fz14 {
	font-size: 14px;
	line-height: 21px;
}

.title_fz16 {
	font-size: 16px;
	line-height: 24px;
}

.title_fz20 {
	font-size: 20px;
	line-height: 30px;
}

.title_fz36 {
	font-size: 36px;
}

.title_fz48 {
	font-size: 48px;
}

.title__section-title {
	position: relative;
}

.menu,
.menu__btn,
.sidepanel {
	position: fixed;
}

.title__section-title:before {
	content: '';
	width: 36px;
	height: 36px;
	background: #3aebca;
	position: absolute;
	border-radius: 100%;
	z-index: -1;
	top: -6px;
	left: 50%;
	transform: translateX(-50%);
}

.btn {
	height: 45px;
	padding: 12px 25px;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
}

.sidepanel {
	font-weight: 500;
	top: 230px;
	left: 50px;
	height: 340px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	z-index: 3;
}

.menu,
header {
	display: block;
}

.sidepanel__devider {
	width: 2px;
	height: 70px;
	background-color: #000;
}

.sidepanel__text {
	width: 25px;
	height: 25px;
}

.sidepanel__text span {
	transform: rotate(-90deg) translate(-30%, -260%);
	display: block;
	width: 150px;
}

header {
	position: relative;
}

.menu__btn {
	top: 5px;
	right: 15px;
	z-index: 11;
}

.menu {
	right: -100vw;
	top: 0;
	overflow: auto;
	height: 100vh;
	width: 100vw;
	pointer-events: none;
	padding-top: 161px;
	transition: right 475ms ease-out, transform 450ms, border-radius 0.8s 0.1s;
	border-bottom-left-radius: 100vw;
	background: #3aebcaf2;
	z-index: 10;
}

.menu__list {
	height: 100%;
	width: 100%;
	padding: 0;
	overflow: auto;
	overflow-x: hidden;
	pointer-events: auto;
}

.menu__link {
	list-style: none;
	text-transform: uppercase;
	pointer-events: auto;
	white-space: nowrap;
	transform: translateX(100vw);
}

.menu__link:first-child a img {
	width: 32px;
	height: 32px;
	-webkit-filter: drop-shadow(0 2px 7px #000);
	filter: drop-shadow(0 2px 7px #000);
	transition: transform 0.2s ease-in;
}

.menu__link:first-child a:hover img {
	transform: scale(1.1, 1.1);
}

.menu__link:last-child a svg {
	width: 22px;
}

.menu__link:last-child .menu__social {
	margin: 30px auto 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.menu__link a {
	color: var(--white);
	display: inline-block;
	padding: 1rem;
	font-size: calc(30px - 0.5vw);
	position: relative;
}

.about__skills-text,
.resume__item-body,
.resume__item-location,
.skills__item p {
	font-size: 12px;
	line-height: 18px;
}

.menu__link a:before {
	content: '';
	position: absolute;
	right: -100vw;
	height: 2px;
	transition: 0.3s;
}

.menu__link a:after {
	content: '';
	position: absolute;
	left: -100vw;
	height: 2px;
	transform: rotate(180deg);
	transition: 0.3s;
}

.menu__link a:hover:before {
	right: 0;
	width: 100%;
}

.menu__link a:hover::after {
	left: 0;
	width: 100%;
}

.hamburger {
	z-index: 9999;
	position: relative;
	display: block;
	height: 50px;
	width: 50px;
	transition: transform 0.5s;
	-webkit-filter: drop-shadow(0 0 3px #fff);
	filter: drop-shadow(0 0 3px #fff);
}

.hamburger .close,
.hamburger .open {
	position: absolute;
	bottom: -14px;
	text-transform: uppercase;
	font-size: 10px;
	text-align: center;
	overflow: hidden;
	transition: width 0.25s 0.35s, color 0.45s 0.35s;
}

.hamburger .close {
	right: 0;
	width: 0;
}

.hamburger .open,
.hamburger.active .close {
	color: var(--black);
	width: 100%;
}

.hamburger .btn-line {
	position: absolute;
	width: 100%;
	height: 2px;
	top: 50%;
	background-color: var(--black);
	pointer-events: auto;
	transition-duration: 0.35s;
	transition-delay: 0.35s;
}

.about__skills-circle:before,
.about__title:before {
	width: 36px;
	height: 36px;
	background: #3aebca;
	left: 0;
	content: '';
	position: absolute;
	z-index: -1;
}

.hamburger .btn-line:after,
.hamburger .btn-line:before {
	position: absolute;
	display: block;
	width: 100%;
	height: 2px;
	left: 50%;
	background-color: var(--black);
	content: '';
	transition: transform 0.35s;
	transform-origin: 50% 50%;
}

.hamburger .btn-line:before {
	transform: translate(-50%, -14px);
}

.hamburger .btn-line:after {
	transform: translate(-50%, 14px);
}

.hamburger.active {
	transform: translateX(5px);
}

.hamburger.active .btn-line {
	background-color: transparent;
	transform: rotate(90deg);
}

.hamburger.active .btn-line:before {
	transform: translate(-50%, -50%) rotate(315deg);
}

.hamburger.active .btn-line:after {
	transform: translate(-50%, -50%) rotate(-315deg);
}

.hamburger.active .open {
	width: 0;
}

.menu.active {
	right: 0;
	border-bottom-left-radius: 0;
}

.menu.active .menu__link {
	transform: translateX(0);
}

.menu.active .menu__link:first-child {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 80ms;
}

.menu.active .menu__link:nth-child(2) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.16s;
}

.menu.active .menu__link:nth-child(3) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.24s;
}

.menu.active .menu__link:nth-child(4) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.32s;
}

.menu.active .menu__link:nth-child(5) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.4s;
}

.menu.active .menu__link:nth-child(6) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.48s;
}

.menu.active .menu__link:nth-child(7) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.56s;
}

.menu.active .menu__link:nth-child(8) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.64s;
}

.menu.active .menu__link:nth-child(9) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.72s;
}

.menu.active .menu__link:nth-child(10) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.8s;
}

.menu.active .menu__link:nth-child(11) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.88s;
}

.menu.active .menu__link:nth-child(12) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 0.96s;
}

.menu.active .menu__link:nth-child(13) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.04s;
}

.menu.active .menu__link:nth-child(14) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.12s;
}

.menu.active .menu__link:nth-child(15) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.2s;
}

.menu.active .menu__link:nth-child(16) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.28s;
}

.menu.active .menu__link:nth-child(17) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.36s;
}

.menu.active .menu__link:nth-child(18) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.44s;
}

.menu.active .menu__link:nth-child(19) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.52s;
}

.menu.active .menu__link:nth-child(20) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.6s;
}

.menu.active .menu__link:nth-child(21) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.68s;
}

.menu.active .menu__link:nth-child(22) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.76s;
}

.menu.active .menu__link:nth-child(23) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.84s;
}

.menu.active .menu__link:nth-child(24) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 1.92s;
}

.menu.active .menu__link:nth-child(25) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2s;
}

.menu.active .menu__link:nth-child(26) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.08s;
}

.menu.active .menu__link:nth-child(27) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.16s;
}

.menu.active .menu__link:nth-child(28) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.24s;
}

.menu.active .menu__link:nth-child(29) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.32s;
}

.menu.active .menu__link:nth-child(30) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.4s;
}

.menu.active .menu__link:nth-child(31) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.48s;
}

.menu.active .menu__link:nth-child(32) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.56s;
}

.menu.active .menu__link:nth-child(33) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.64s;
}

.menu.active .menu__link:nth-child(34) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.72s;
}

.menu.active .menu__link:nth-child(35) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.8s;
}

.menu.active .menu__link:nth-child(36) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.88s;
}

.menu.active .menu__link:nth-child(37) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 2.96s;
}

.menu.active .menu__link:nth-child(38) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.04s;
}

.menu.active .menu__link:nth-child(39) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.12s;
}

.menu.active .menu__link:nth-child(40) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.2s;
}

.menu.active .menu__link:nth-child(41) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.28s;
}

.menu.active .menu__link:nth-child(42) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.36s;
}

.menu.active .menu__link:nth-child(43) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.44s;
}

.menu.active .menu__link:nth-child(44) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.52s;
}

.menu.active .menu__link:nth-child(45) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.6s;
}

.menu.active .menu__link:nth-child(46) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.68s;
}

.menu.active .menu__link:nth-child(47) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.76s;
}

.menu.active .menu__link:nth-child(48) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.84s;
}

.menu.active .menu__link:nth-child(49) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 3.92s;
}

.menu.active .menu__link:nth-child(50) {
	transition: transform 1s cubic-bezier(0.29, 1.4, 0.44, 0.96) 4s;
}

.about,
.portfolio,
.resume,
.skills {
	padding-top: 120px;
}

.about__wrapper {
	display: flex;
	justify-content: space-between;
}

.about__photo {
	width: 100%;
	max-width: 400px;
	margin-right: 40px;
}

.about__photo-min {
	display: none;
}

.about__photo img,
.contacts__photo img {
	width: 100%;
}

.about__descr {
	padding-top: 6px;
	width: 100%;
	max-width: 670px;
}

.about__title,
.contacts__title {
	position: relative;
	padding-left: 12px;
	padding-top: 1px;
}

.about__title:before {
	border-radius: 100%;
	top: -25%;
}

.about__text,
.contacts__social,
.contacts__text {
	margin-top: 20px;
}

.about__skills {
	display: grid;
	grid-template: repeat(2, minmax(115px, auto)) / repeat(2, minmax(260px, auto));
	grid-auto-rows: 1fr;
	-moz-column-gap: 50px;
	column-gap: 50px;
	row-gap: 20px;
}

.about__skills-item {
	display: grid;
	grid-template-columns: 40px 200px;
	-moz-column-gap: 20px;
	column-gap: 20px;
}

.about__skills-circle {
	position: relative;
	padding: 15px 0 0 15px;
}

.about__skills-circle:before {
	border-radius: 100%;
	top: 0;
}

.about__skills-text {
	margin-top: 6px;
}

.resume__wrapper {
	padding: 60px 65px 0;
	display: grid;
	grid-template-columns: repeat(2, 425px);
	-moz-column-gap: 135px;
	column-gap: 135px;
	overflow: hidden;
}

.resume__list-visible {
	position: relative;
	max-height: 365px;
}

.resume__column-title {
	position: relative;
	padding-left: 35px;
}

.resume__column-title:after {
	content: '';
	position: absolute;
	height: 22px;
	width: 1px;
	background-color: var(--black);
	top: 22px;
	left: 0;
}

.resume__column-title:before {
	content: '';
	position: absolute;
	left: -7px;
	top: 50%;
	transform: translateY(-50%);
	width: 15px;
	height: 15px;
	background-color: #3aebca;
	border-radius: 100%;
}

.resume__column ul li:after,
.resume__item:before {
	position: absolute;
	background-color: #000;
	content: '';
}

.resume__column ul {
	list-style-type: none;
}

.contacts__input,
.resume__column ul li,
.resume__item {
	position: relative;
}

.resume__column ul li:after {
	width: 1px;
	height: calc(100% + 16px);
	top: -16px;
	left: 0;
}

.resume__item:before {
	height: 1px;
	width: 45px;
	top: 68px;
}

.resume__item-head {
	position: relative;
	padding: 45px 0 0 100px;
}

.resume__item-icon {
	position: absolute;
	top: 50px;
	left: 45px;
}

.resume__item-icon:before {
	content: '';
	width: 36px;
	height: 36px;
	background: #3aebca;
	position: absolute;
	border-radius: 100%;
	z-index: -1;
	left: 0;
	top: -25%;
}

.resume__item-icon img {
	position: absolute;
	top: 14px;
	left: 17px;
}

.resume__item-location {
	margin-top: 5px;
}

.resume__item-body {
	padding: 12px 0 0 43px;
}

.resume__certificate {
	margin-top: 44px;
	grid-column-start: 1;
	grid-column-end: 4;
	height: 24px;
	overflow: hidden;
	border-bottom: 1px solid #08080a0f;
	transition: height 0.4s ease-in-out, border-color 0.2s ease-in;
}

.resume__certificate:hover {
	border-bottom: 1px solid var(--white);
	transition: height 0.4s ease-in-out, border-color 0.1s ease-in-out;
}

.resume__certificate-btn {
	color: var(--main-color);
	cursor: pointer;
	text-align: left;
	font-size: 16px;
	font-style: italic;
	position: relative;
}

.resume__certificate-btn .plus {
	position: absolute;
	top: 4px;
	left: 90px;
}

.resume__certificate-btn .plus .plusminus {
	position: relative;
	width: 16px;
	height: 16px;
	cursor: pointer;
}

.resume__certificate-btn .plus .plusminus.active:before {
	transform: translatey(-50%) rotate(-90deg);
	opacity: 0;
}

.resume__certificate-btn .plus .plusminus.active:after {
	transform: translatey(-50%) rotate(0);
}

.resume__certificate-btn .plus .plusminus:after,
.resume__certificate-btn .plus .plusminus:before {
	content: '';
	display: block;
	background-color: var(--black);
	position: absolute;
	top: 50%;
	left: 0;
	transition: 0.35s;
	width: 100%;
	height: 2px;
}

.resume__certificate-btn .plus .plusminus:before {
	transform: translatey(-50%);
}

.resume__certificate-btn .plus .plusminus:after {
	transform: translatey(-50%) rotate(90deg);
}

.resume__certificate-btn:before {
	content: '';
	position: absolute;
	height: 1px;
	width: 100%;
	bottom: 0;
	left: 0;
	background-color: #08080a0f;
	transition: transform 0.2s ease-in;
}

.resume__certificate-btn.close:last-child,
.resume__certificate-btn:hover:last-child,
.resume__certificate-btn:last-child {
	text-align: right;
}

.resume__certificate-btn:last-child .plus {
	left: unset;
	right: 90px;
}

.resume__certificate-btn:last-child:before {
	bottom: 1px;
	transition: 0.2s ease-in-out;
}

.resume__certificate-btn.close:before,
.resume__certificate-btn:hover:before {
	transform: translateY(-23px);
}

.resume__certificate-btn.close:hover:last-child svg,
.resume__certificate-btn.close:last-child svg,
.resume__certificate-btn:hover:last-child svg {
	transform: scale(-1, -1);
}

.resume__certificate-btn.close:last-child:before,
.resume__certificate-btn:hover:last-child:before {
	transform: translateY(0);
}

.resume__certificate-btn.close:hover:last-child:before {
	background-color: #08080a63;
}

.resume__certificate-content {
	margin-top: 20px;
	margin-bottom: 20px;
	display: grid;
	grid-template-columns: repeat(3, auto);
	gap: 12px;
}

.resume__certificate-item {
	cursor: pointer;
}

.resume__certificate-item img {
	width: 100%;
	height: 200px;
	-o-object-fit: contain;
	object-fit: contain;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: var(--main-color);
}

.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	background-color: var(--main-color-light);
}

.box-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	height: 100vh;
	width: 100vw;
	background: rgba(0, 0, 0, 0.7);
	z-index: 15;
	justify-content: center;
	align-items: center;
	opacity: 0;
	-webkit-animation: 0.5s forwards ani;
	animation: 0.5s forwards ani;
}

@-webkit-keyframes ani {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes ani {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.box-overlay div {
	position: relative;
	max-height: 88%;
	max-width: 88%;
}

.box-overlay div img {
	max-height: 700px;
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
}

.box-overlay div span.box-close {
	position: absolute;
	top: -32px;
	right: -32px;
	z-index: inherit;
	width: 30px;
	height: 30px;
	background: url(../icons/resume/cross.svg) 100%/100% no-repeat;
	cursor: pointer;
}

.skills__items {
	margin-top: 60px;
	padding: 0 10px;
	display: grid;
	grid-template: repeat(1, minmax(270px, auto)) / repeat(4, 270px);
	grid-auto-rows: minmax(270px, auto);
	gap: 13px;
}

.skills__item {
	border: 1px solid #000;
	padding: 30px 30px 25px;
}

.skills__item-img {
	display: flex;
	align-items: center;
	min-height: 65px;
}

.skills__item h3 {
	margin-top: 20px;
}

.skills__item p {
	margin-top: 15px;
}

.skills__ratings {
	margin-top: 120px;
	display: grid;
	grid-template: repeat(2, minmax(70px, auto)) / repeat(3, 350px);
	-moz-column-gap: 45px;
	column-gap: 45px;
	row-gap: 35px;
}

.skills__ratings-item {
	display: grid;
	grid-template: minmax(21px, auto) 14px/200px 35px;
	justify-content: space-between;
	align-content: space-between;
}

.skills__ratings-title {
	position: relative;
	padding: 2px 0 0 13px;
}

.skills__ratings-title:before {
	content: '';
	width: 36px;
	height: 36px;
	background: #3aebca;
	position: absolute;
	border-radius: 100%;
	z-index: -1;
	left: 0;
	top: -25%;
}

.skills__ratings-counter {
	font-size: 14px;
	line-height: 21px;
}

.skills__ratings-line {
	width: 350px;
	height: 14px;
	background-color: #e8e4de;
	border-radius: 4px;
	grid-column: 1/3;
}

.skills__ratings-line span {
	display: block;
	height: 100%;
	background-color: #3aebca;
	border-radius: 4px;
	transition: width 0.8s ease-in;
	width: 0;
}

.portfolio__wrapper {
  height: 300px;
	margin-top: 60px;
	/* display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: start;
	flex-wrap: nowrap;
	gap: 10px; */
}

.portfolio__item {
	overflow: hidden;
	position: relative;
	min-width: 280px;
	min-height: 280px;
	width: 280px;
	height: 280px;
}
/*
.portfolio__item:first-child {
    grid-row: 1/2;
    grid-column: 1/3
}

.portfolio__item:nth-child(2) {
    grid-row: 2/2;
    grid-column: 2/4
}

.portfolio__item:nth-child(3) {
    grid-row: 1/3;
    grid-column: 4/5
}

.portfolio__item:nth-child(4) {
    grid-row: 2/4;
    grid-column: 1/2
}

.portfolio__item:nth-child(6) {
    grid-row: 3/4;
    grid-column: 2/5
}

.portfolio__item:nth-child(7) {
    grid-row: 4/5;
    grid-column: 1/4
}

.portfolio__item:nth-child(8) {
    grid-row: 4/6;
    grid-column: 4/5
}

.portfolio__item:nth-child(9) {
    grid-row: 5/6;
    grid-column: 1/3
} */

.portfolio__item img {
	transition: 0.6s;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-webkit-filter: grayscale(88%);
	filter: grayscale(88%);
}

.portfolio__item-descr {
	transition: 0.6s;
	position: absolute;
	top: 50%;
	width: 100%;
	height: 0;
	background: rgba(34, 34, 34, 0.5);
	z-index: 4;
	text-align: center;
	opacity: 0;
	display: grid;
	justify-content: center;
	align-content: center;
}

.contacts__wrapper,
.price__wrapper {
	justify-content: space-between;
	display: grid;
}

.portfolio__item-descr h5 {
	transition: 0.7s;
	padding-top: 0;
	text-transform: uppercase;
	color: #fff;
	font-size: 20px;
	font-weight: 500;
	line-height: 24px;
	margin-bottom: 0;
}

.portfolio__item-descr p {
	transition: 0.5s;
	padding-top: 0;
	padding-bottom: 0;
	color: #b2b2b2;
	font-size: 14px;
}

.contacts__btn,
.contacts__btn-hover,
.contacts__btn:hover,
.contacts__privacy label {
	color: var(--black);
}

.portfolio__item-descr svg {
	transition: 0.5s;
	opacity: 0;
}

.portfolio__item-descr svg path {
	fill: var(--white);
}

.portfolio__item-mob img {
	-webkit-filter: grayscale(0);
	filter: grayscale(0);
}

.portfolio__item-mob .portfolio__item-descr,
.portfolio__item:hover .portfolio__item-descr,
.portfolio__item_hover .portfolio__item-descr {
	transition: 0.5s;
	height: 100%;
	z-index: 6;
	top: 0;
	opacity: 1;
	width: 100%;
}

.portfolio__item-mob .portfolio__item-descr p,
.portfolio__item:hover .portfolio__item-descr p,
.portfolio__item_hover .portfolio__item-descr p {
	transition: 0.5s ease-in-out;
	padding-top: 11px;
}

.portfolio__item-mob .portfolio__item-descr svg,
.portfolio__item:hover .portfolio__item-descr svg,
.portfolio__item_hover .portfolio__item-descr svg {
	transition: 1.5s ease-out;
	opacity: 1;
}

.portfolio__item:hover img,
.portfolio__item_hover img {
	transform: scale(1.05);
	-webkit-filter: grayscale(0);
	filter: grayscale(0);
}

.price {
	padding-top: 60px;
}

.price__wrapper {
	margin-top: 60px;
	padding: 0 60px;
	grid-template: repeat(3, minmax(45px, auto)) / repeat(2, 365px);
	grid-auto-rows: minmax(45px, auto);
	row-gap: 15px;
}

.price__item {
	position: relative;
	display: grid;
	grid-template: repeat(2, minmax(21px, auto)) / repeat(2, auto);
	row-gap: 5px;
	padding-left: 25px;
}

.price__item:before {
	content: '';
	width: 15px;
	height: 15px;
	background-color: #3aebca;
	border-radius: 100%;
	position: absolute;
	top: 5px;
}

.price__count,
.price__type {
	font-weight: 700;
	font-size: 14px;
	line-height: 21px;
}

.price__count {
	justify-self: end;
}

.price__descr {
	grid-column: 1/3;
	font-size: 12px;
	line-height: 18px;
}

.contacts {
	padding: 120px 0 90px;
}

.contacts input {
	border: 1px solid var(--black);
}

.contacts__wrapper {
	padding-right: 52px;
	padding-left: 35px;
	grid-template-columns: 400px 585px;
}

.contacts__descr {
	padding-top: 6px;
}

.contacts__title:before {
	content: '';
	width: 36px;
	height: 36px;
	background: #3aebca;
	position: absolute;
	border-radius: 100%;
	z-index: -1;
	left: 0;
	top: -25%;
}

.contacts__link {
	margin-right: 25px;
	width: 100%;
	max-width: 30px;
	max-height: 30px;
}

.contacts__link img {
	width: 100%;
	max-width: 30px;
	max-height: 30px;
}

.contacts__form {
	margin-top: 30px;
	display: grid;
	grid-template: 45px 190px 45px / repeat(2, 280px);
	justify-content: space-between;
	row-gap: 27px;
}

.contacts__form label[for='email'],
.contacts__form label[for='name'],
.contacts__form label[for='text'] {
	border-bottom: 9px solid transparent;
	position: absolute;
	top: -9px;
	left: 12px;
	display: block;
	margin: 0;
	height: 18px;
	padding: 0 8px;
	background: #fff;
	font-size: 12px;
	transition: 0.5s;
}

.contacts__triggers {
	grid-column: 1/3;
	display: grid;
	grid-template-columns: repeat(2, auto);
	-moz-column-gap: 35px;
	column-gap: 35px;
}

.contacts__privacy {
	font-size: 12px;
	line-height: 14px;
	align-self: center;
	display: flex;
}

.contacts__privacy input {
	margin-right: 10px;
}

.contacts__privacy input._error {
	box-shadow: 0 0 15px red;
}

.contacts__input input {
	width: 100%;
	height: 100%;
	padding: 0 20px;
	font-size: 12px;
	transition: 0.5s;
}

.contacts__input input:focus {
	border-color: #7a956b;
	border-width: 2px;
	border-radius: 3px;
}

.contacts__input input._error {
	border-color: red;
	border-width: 2px;
	border-radius: 3px;
}

.contacts__input._error label[for='email'],
.contacts__input._error label[for='name'],
.contacts__input._error label[for='text'] {
	top: -1px;
	transition: 0.3s;
	background: 0 0;
	color: #0000005c;
}

.contacts__textarea {
	position: relative;
	grid-column: 1/3;
}

.contacts__textarea._error label[for='text'] {
	top: 2px;
	background: 0 0;
	transition: 0.3s;
	color: #0000005c;
}

.contacts__textarea textarea {
	width: 100%;
	height: 100%;
	resize: none;
	padding: 20px;
	font-size: 12px;
	transition: 0.5s;
	text-overflow: ellipsis;
	overflow: hidden;
	font-weight: 400;
	border: 1px solid var(--black);
}

.contacts__textarea textarea:focus {
	border-color: #7a956b;
	border-width: 2px;
	border-radius: 3px;
}

.contacts__textarea textarea._error {
	border-color: red;
	border-width: 2px;
	border-radius: 3px;
}

.contacts__btn {
	border: none;
	font-size: 14px;
	font-weight: 22px;
	padding: 12px 25px;
	height: 45px;
	position: relative;
	background: 0 0;
	transition: 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.15s;
}

.contacts__btn:focus-visible {
	outline: 0;
}

.contacts__btn::after,
.contacts__btn::before {
	content: '';
	position: absolute;
	height: 20px;
	width: 20px;
	transition: 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
	z-index: -2;
	border-radius: 50%;
}

.contacts__btn::before {
	background-color: var(--black);
	top: -0.75rem;
	left: 0.5rem;
	-webkit-animation: 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite
		alternate top;
	animation: 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite alternate
		top;
}

.contacts__btn::after {
	background-color: var(--main-color);
	top: 3rem;
	left: 13rem;
	-webkit-animation: 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite
		alternate bottom;
	animation: 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite alternate
		bottom;
}

.contacts__btn-hover::after,
.contacts__btn-hover::before,
.contacts__btn:hover::after,
.contacts__btn:hover::before {
	top: 0;
	height: 100%;
	width: 100%;
	border-radius: 0;
	-webkit-animation: none;
	animation: none;
}

.contacts__btn-hover::after,
.contacts__btn:hover::after {
	left: 0;
}

.contacts__btn-hover::before,
.contacts__btn:hover::before {
	top: 0.5rem;
	left: 0.35rem;
}

@-webkit-keyframes top {
	from {
		transform: translate(0, 0);
	}

	to {
		transform: translate(0, 3.5rem);
	}
}

@keyframes top {
	from {
		transform: translate(0, 0);
	}

	to {
		transform: translate(0, 3.5rem);
	}
}

@-webkit-keyframes bottom {
	from {
		transform: translate(-11.5rem, 0);
	}

	to {
		transform: translate(0, 0);
	}
}

@keyframes bottom {
	from {
		transform: translate(-11.5rem, 0);
	}

	to {
		transform: translate(0, 0);
	}
}

.contacts input:-internal-autofill-selected + label {
	border-bottom: 9px solid #e8f0fe;
	transition: 0;
}

.up {
	display: none;
	position: fixed;
	bottom: 40px;
	right: 40px;
	width: 30px;
	height: 30px;
	-webkit-filter: drop-shadow(2px 2px 8px #fff);
	filter: drop-shadow(2px 2px 8px #fff);
}

.up:hover svg {
	-webkit-animation: 2.222s linear infinite bounce;
	animation: 2.222s linear infinite bounce;
}

@-webkit-keyframes bounce {
	0%,
	100%,
	50% {
		transform: translateY(0);
	}

	25% {
		transform: translateY(-25%);
	}

	75% {
		transform: translateY(-35%);
	}
}

@keyframes bounce {
	0%,
	100%,
	50% {
		transform: translateY(0);
	}

	25% {
		transform: translateY(-25%);
	}

	75% {
		transform: translateY(-35%);
	}
}

@media (max-width: 1439px) {
	.sidepanel {
		display: none;
	}
}

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

	.about__photo img {
		-o-object-fit: cover;
		object-fit: cover;
		max-height: 100%;
	}

	.about__skills {
		grid-template: repeat(2, minmax(115px, auto)) / repeat(
				2,
				minmax(260px, auto)
			);
		-moz-column-gap: 20px;
		column-gap: 20px;
	}

	.about__skills-item {
		grid-template-columns: 40px 195px;
		-moz-column-gap: 15px;
		column-gap: 15px;
	}

	.resume__wrapper {
		padding: 40px 20px 0;
		-moz-column-gap: 80px;
		column-gap: 80px;
	}

	.skills__items {
		grid-template-columns: repeat(auto-fit, 270px);
		justify-content: space-between;
	}

	.skills__ratings {
		grid-template-columns: repeat(auto-fit, 350px);
		grid-auto-rows: minmax(70px, auto);
		justify-content: space-between;
		padding: 0 30px;
	}

	/* .portfolio__wrapper {
        grid-template-columns: repeat(auto-fit,280px);
        grid-auto-rows: 280px;
        justify-content: center;
        gap: 22px
    } */

	/* .portfolio__item:first-child,.portfolio__item:nth-child(2),.portfolio__item:nth-child(3),.portfolio__item:nth-child(4),.portfolio__item:nth-child(5),.portfolio__item:nth-child(6),.portfolio__item:nth-child(7),.portfolio__item:nth-child(8),.portfolio__item:nth-child(9) {
        grid-row: unset;
        grid-column: unset
    } */

	.portfolio__item-descr {
		padding: 10px;
	}

	.contacts__wrapper {
		padding: 0;
		grid-template-columns: 400px 520px;
	}

	.contacts__form {
		grid-template: 45px 190px 45px / repeat(2, 250px);
	}
}

@media (max-width: 992px) {
	.about__photo {
		display: none;
	}

	.about__descr {
		max-width: 100%;
	}

	.container {
		max-width: 720px;
	}

	.title_fz36 {
		font-size: 30px;
	}

	.divider {
		margin: 15px auto 0;
	}

	.about__skills {
		grid-template-columns: 380px;
		grid-auto-rows: minmax(115px, auto);
	}

	.about__skills-item {
		grid-template-columns: 40px auto;
		-moz-column-gap: 20px;
		column-gap: 20px;
	}

	.resume__wrapper {
		-moz-column-gap: 60px;
		column-gap: 60px;
		grid-template-columns: repeat(2, minmax(auto, 300px));
	}

	.resume__certificate-content {
		margin-top: 20px;
		margin-bottom: 20px;
		display: grid;
		grid-template-columns: repeat(2, auto);
		gap: 12px;
	}

	.skills__items {
		padding: 0 20px;
	}

	.skills__ratings {
		grid-template-columns: repeat(auto-fit, 320px);
		justify-content: space-between;
		padding: 0;
		-moz-column-gap: 0;
		column-gap: 0;
	}

	.skills__ratings-line {
		width: 100%;
	}

	.price__wrapper {
		grid-template-columns: repeat(auto-fit, 350px);
		padding: 0;
	}

	.contacts__wrapper {
		grid-template-columns: 300px 400px;
	}

	.contacts__form {
		grid-template: 45px 190px 45px / repeat(2, 195px);
	}

	.contacts__btn {
		padding: 8px 25px;
		line-height: 16px;
	}
}

@media (max-width: 768px) {
	.container {
		max-width: 540px;
	}

	.title_fz48 {
		font-size: 28px;
	}

	.promo {
		padding-top: 252px;
		background: url(../img/logo.png) center 10px no-repeat fixed,
			linear-gradient(
					180deg,
					rgba(255, 255, 255, 0.6) 0,
					rgba(255, 255, 255, 0.55) 0.01%,
					rgba(255, 255, 255, 0.5) 0.02%,
					rgba(255, 255, 255, 0.44) 100%
				)
				fixed,
			url(../img/main_bg-midl.jpg) 55% / cover no-repeat;
	}

	.promo__title {
		line-height: 39px;
		max-width: 300px;
	}

	.about,
	.contacts,
	.portfolio,
	.price,
	.resume,
	.skills {
		padding-top: 40px;
	}

	.about__wrapper {
		grid-template: 340px auto auto/100%;
	}

	.about__photo {
		grid-row: unset;
	}

	.about__skills {
		grid-template-columns: 1fr 1fr;
	}

	.about__skills-item {
		grid-template-columns: 40px minmax(200px, 100%);
		-moz-column-gap: 20px;
		column-gap: 20px;
	}

	.resume__wrapper {
		grid-template-columns: minmax(100%, auto);
		-moz-column-gap: 60px;
		column-gap: 60px;
		row-gap: 50px;
		padding: 40px 5px 0 8px;
	}

	.resume__item:before {
		top: 44px;
		width: 10px;
	}

	.resume__item-lacation {
		font-size: 14px;
	}

	.resume__item-head {
		padding: 25px 0 0 60px;
	}

	.resume__item-icon {
		top: 25px;
		left: 10px;
	}

	.resume__certificate-content {
		margin-top: 20px;
		margin-bottom: 20px;
		display: grid;
		grid-template-columns: repeat(1, auto);
		gap: 12px;
	}

	.resume__certificate-content img {
		width: 80%;
		height: 100%;
		margin: 0 auto;
		display: block;
	}

	.skills__items {
		padding: 0;
		justify-content: center;
		gap: 20px;
		grid-template-columns: repeat(auto-fit, 250px);
	}

	.skills__ratings {
		grid-template-columns: repeat(auto-fit, 100%);
	}

	.skills__ratings {
		grid-auto-rows: minmax(70px, auto);
		justify-content: center;
		margin-top: 40px;
	}

	.skills__ratings-line {
		width: 100%;
	}

	.price__wrapper {
		margin-top: 20px;
		justify-content: center;
	}

	.contacts__photo {
		display: none;
	}

	.contacts__wrapper {
		grid-template-columns: 1fr;
	}

	.contacts__form {
		grid-template: 45px 190px 45px / repeat(2, 250px);
	}
}

@media (max-width: 576px) {
	.container {
		width: 100%;
		padding: 0 20px;
	}

	.title_fz48 {
		font-size: 26px;
	}

	.title_fz36 {
		font-size: 24px;
	}

	.menu__btn {
		top: 10px;
		right: 15px;
		z-index: 11;
	}

	.hamburger {
		height: 40px;
		width: 40px;
	}

	.hamburger.active {
		transform: translateX(3px);
	}

	.hamburger .close,
	.hamburger .open {
		bottom: -15px;
		font-size: 8px;
	}

	.menu {
		padding-top: 10%;
	}

	.menu__link a {
		font-size: calc(30px - 0.8vw);
		padding: 0.7rem;
	}

	.promo {
		padding-top: 252px;
		background: url(../img/logo.png) center 10px no-repeat fixed,
			linear-gradient(
					180deg,
					rgba(255, 255, 255, 0.6) 0,
					rgba(255, 255, 255, 0.55) 0.01%,
					rgba(255, 255, 255, 0.5) 0.02%,
					rgba(255, 255, 255, 0.44) 100%
				)
				fixed,
			url(../img/main_bg-min.jpg) 55% / cover no-repeat;
	}

	.promo__btns {
		margin-top: 30px;
	}

	.promo__subtitle {
		padding-left: 4px;
	}

	.about__wrapper {
		grid-template: 340px auto auto/1fr;
	}

	.about__skills {
		grid-template-columns: 1fr;
	}

	.price__wrapper,
	.skills__items,
	.skills__ratings {
		grid-template-columns: repeat(auto-fit, 100%);
	}

	.resume__item-body {
		padding: 10px 0 0 20px;
		width: 100%;
	}

	.resume__certificate-content img {
		width: 100%;
	}

	.skills__items {
		margin-top: 20px;
	}

	.skills__items .skills__item {
		text-align: center;
	}

	.skills__items .skills__item-img {
		justify-content: center;
	}

	.contacts {
		padding-bottom: 50px;
	}

	.contacts__form {
		grid-template: 45px 45px 190px minmax(45px, auto) / 1fr;
	}

	.contacts__textarea {
		grid-column: unset;
		width: 100%;
	}

	.contacts__triggers {
		grid-column: unset;
		grid-template-columns: 1fr;
		-moz-column-gap: unset;
		column-gap: unset;
		row-gap: 20px;
	}

	.contacts__btn {
		order: 2;
		max-width: 220px;
		margin: 0 auto;
	}

	.contacts__policy {
		width: 180px;
		margin: 0 auto;
		line-height: 18px;
	}

	.up {
		right: 15px;
		bottom: 20px;
	}
}

a {
	cursor: pointer;
}