/* -------------------------------- 

Primary style

-------------------------------- */
@font-face {
	font-family: GOTHIC;
	src: url(../fonts/GOTHIC.TTF);
}
@font-face {
	font-family: 'Gilroy';
	src: local('Gilroy Light'), local('Gilroy-Light'), url(../fonts/Gilroylight.woff2) format('woff2'),
		url(../fonts/Gilroylight.woff) format('woff'), url(../fonts/Gilroylight.ttf) format('truetype');
	font-weight: 300;
	font-style: normal;
}
@font-face {
	font-family: 'GilroyBold';
	src: local('Gilroy ExtraBold'), local('Gilroy-ExtraBold'),
		url(../fonts/Gilroyextrabold.woff2) format('woff2'),
		url(../fonts/Gilroyextrabold.woff) format('woff'),
		url(../fonts/Gilroyextrabold.ttf) format('truetype');
	font-weight: 800;
	font-style: normal;
}

*,
*::after,
*::before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	font-size: 100%;
	font-family: GOTHIC;
}
h1 {
	font-family: 'Gilroy';
	font-weight: 900;
	color: white;
	text-align: center;
	font-size: 25vw;
}
h2 {
	font-family: 'Gilroy';
	color: white;
	text-align: center;
	font-size: 1.5em;
	padding: 30px;
}
h3 {
	font-family: 'GilroyBold';
	font-weight: 900;
	color: inherit;
	font-size: 36px;
	padding: 60px 0 80px;
	background-color: #fff;
}
h4 {
	font-family: 'Gilroy';
	color: #a76500;
	font-size: 24px;
	text-align: center;
	padding-bottom: 30px;
}
h5 {
	font-family: 'GilroyBold';
	font-weight: 900;
	text-align: center;
	color: #222;
	font-size: 15vw;
	padding-top: 100px;
	padding-bottom: 20px;
	background-color: #fff;
	z-index: 20;
}
a {
	color: black;
	text-decoration: none;
}
header {
	display: block;
	position: fixed;
	width: 100%;
	height: 60px;
	background-color: white;
	z-index: 9999;
}

.cd-logo,
#phone-number,
.cd-nav-trigger {
	position: fixed;
	display: inline-block;
}

.cd-nav-trigger::after,
.cd-nav-trigger::before,
.cd-nav-trigger *::after,
.cd-nav-trigger *::before {
	content: '';
}

.cd-logo {
	top: 12px;
	left: 5%;
}
.cd-logo img {
	display: block;
	width: 130px;
}
#phone-number {
	display: none;
}
#back {
	position: fixed;
	z-index: -100;
}
@media screen and (orientation: portrait) {
	#back {
		left: 50%;
		margin-left: -79vh;
	}
	.autoplay img {
		width: 158vh;
		height: 100vh;
	}
}
@media screen and (orientation: landscape) {
	#back {
		left: 50%;
		margin-left: -450px;
	}
	.autoplay img {
		width: 900px;
	}
}
@media screen and (min-width: 900px) and (orientation: landscape) {
	#back {
		left: auto;
		margin-left: auto;
		width: 100%;
	}
	.autoplay img {
		width: 100%;
	}
}
.cd-intro {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: relative;
	height: 100vh;
	width: 100%;
}
#text1 h1,
#text1 h2 {
	display: flex;
	width: 100%;
	position: relative;
	text-align: center;
	justify-content: center;
	flex-direction: column;
}
#text1 svg {
	position: absolute;
	height: 60px;
	width: auto;
	left: 50%;
	margin-left: -7px;
}
.subtitle {
	display: block;
	position: relative;
	width: 100%;
	color: #444;
	background-color: #fff;
	text-align: center;
}
.subtitle-line {
	display: block;
	position: absolute;
	height: 1px;
	width: 100%;
	top: 75px;
	background-color: rgb(205, 220, 49);
	z-index: 10;
}
.subtitle h3 {
	position: relative;
	display: inline-block;
	padding: 60px 15px 60px;
	margin-top: 0;
	margin-bottom: 0;
	z-index: 11;
}
.title h3 {
	font-size: 1.8em;
	padding: 25px 15px 30px;
}
.title .subtitle-line {
	top: 40px;
}
#about-content {
	display: block;
	width: 100%;
	padding: 0 5%;
	color: #a76500;
	background-color: #fff;
	text-align: center;
}
.about {
	display: inline-block;
	position: relative;
	width: 100%;
	max-width: 500px;
	padding: 30px 0;
}
.about_img {
	display: flex;
	position: relative;
	align-items: center; /* Выравнивание текста по вертикали */
	justify-content: center; /* Выравнивание текста по горизонтали */
}
.about a {
	position: absolute;
	display: flex;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	align-items: center; /* Выравнивание текста по вертикали */
	justify-content: center; /* Выравнивание текста по горизонтали */
	background-color: rgba(0, 0, 0, 0.3);
	color: #fff;
	font-size: 24px;
	opacity: 1;
	-webkit-transition: opacity 0.3s 0s;
	-moz-transition: opacity 0.3s 0s;
	transition: opacity 0.3s 0s;
}
.about a:hover {
	opacity: 1;
}
.about p {
	line-height: 1.5;
}
.flex-container {
	display: flex; /* Флексы */
	height: 240vw; /* Высота */
	color: #fff; /* Белый цвет текста */
	background-color: #fff;
	padding: 5px;
	font-size: 2.6em; /* Размер шрифта */
	flex-flow: row wrap; /* Располагаем в виде колонок */
}
.flex-item {
	display: flex; /* Флексы */
	position: relative;
	background: #929d79; /* Цвет фона */
	background-size: cover;
	align-items: center; /* Выравнивание текста по вертикали */
	justify-content: center; /* Выравнивание текста по горизонтали */
}
.flex-item a {
	display: flex;
	position: relative;
	height: 100%;
	flex: 1 1 100%;
}
.flex-title {
	display: flex;
	position: relative;
	height: inherit;
	flex: 1 1 100%;
	align-items: flex-end;
	justify-content: center;
	color: #fff;
	padding-bottom: 10px;
	font-size: 0.4em;
}
.one {
	display: flex;
	margin-bottom: 5px;
	flex: 1 1 100%;
	flex-flow: column nowrap;
}
.two {
	display: flex;
	flex: 1 1 100%;
	flex-flow: row nowrap;
}
@media only screen and (min-width: 600px) {
	.flex-title {
		font-size: 0.5em;
	}
}
@media only screen and (min-width: 900px) {
	.flex-container {
		height: 60vw;
	}
	.one {
		flex: 1 1 0;
		margin-bottom: 0;
		margin-right: 5px;
	}
	.two {
		flex: 1 1 0;
	}
}
@media only screen and (min-width: 1050px) {
	.flex-title {
		background-color: rgba(0, 0, 0, 0.3);
		opacity: 0;
		-webkit-transition: opacity 0.3s 0s;
		-moz-transition: opacity 0.3s 0s;
		transition: opacity 0.3s 0s;
	}
	.flex-title:hover {
		opacity: 1;
	}
}
.five {
	margin-bottom: 5px;
	flex: 35 1 0;
	background-image: url(../Image/Kivach/Kivach1.jpg);
	background-position: center;
}
.six {
	display: flex;
	flex: 65 1 0;
	flex-flow: row nowrap;
}
.three {
	display: flex;
	margin-right: 5px;
	flex: 1 1 0;
	flex-flow: column nowrap;
}
.four {
	display: flex;
	flex: 1 1 0;
	flex-flow: column nowrap;
}
.three1 {
	margin-bottom: 5px;
	flex: 6 1 0;
	background-image: url(../Image/Peski/Peski2.jpg);
}
.three2 {
	flex: 4 1 0;
	background-image: url(../Image/matr/flowers3.jpg);
	background-position: bottom;
}
.four1 {
	margin-bottom: 5px;
	flex: 4 1 0;
	background-image: url(../Image/smosh/smosh4.jpg);
}
.four2 {
	flex: 6 1 0;
	background-image: url(../Image/Mosch.jpg);
	background-position: bottom;
}
.uroch-1 {
	margin-bottom: 5px;
	flex: 35 1 0;
	background-image: url(../Image/urochishe/uroch-2.jpeg);
	background-position: center;
}
.uroch-2 {
	margin-bottom: 5px;
	flex: 6 1 0;
	background-image: url(../Image/urochishe/uroch-1.png);
}
.uroch-3 {
	flex: 4 1 0;
	background-image: url(../Image/urochishe/uroch-3.jpeg);
	background-position: bottom;
}
.uroch-4 {
	margin-bottom: 5px;
	flex: 4 1 0;
	background-image: url(../Image/urochishe/uroch-4.JPG);
}
.three3 {
	margin-bottom: 5px;
	flex: 7 1 0;
	background-image: url(../Image/Sev/Sev8.jpg);
	background-position: center;
}
.three4 {
	flex: 3 1 0;
	background-image: url(../Image/sert/sert8.jpg);
}
.four3 {
	margin-bottom: 5px;
	flex: 1 1 0;
	background-image: url(../Image/plaza/plaza2.jpg);
	background-position: center;
}
.four4 {
	margin-bottom: 5px;
	flex: 1 1 0;
	background-image: url(../Image/Kivach/Kivach2.jpg);
	background-position: center;
}
.four5 {
	flex: 1 1 0;
	background-image: url(../Image/Kivach/Kivach3.jpg);
	background-position: bottom;
}
/***/
.five2 {
	margin-bottom: 5px;
	flex: 35 1 0;
	background-image: url(../Image/plaza/plaza1.jpg);
	background-position: center;
}
.three12 {
	margin-bottom: 5px;
	flex: 6 1 0;
	background-image: url(../Image/matr/golf1.jpg);
}
.three22 {
	flex: 4 1 0;
	background-position: bottom;
	background-image: url(../Image/matr/flowers1.jpg);
}
.four12 {
	margin-bottom: 5px;
	flex: 4 1 0;
	background-image: url(../Image/matr/flowers2.jpg);
}
.four22 {
	flex: 6 1 0;
	background-image: url(../Image/matr/golf2.jpg);
	background-position: bottom;
}
.three32 {
	margin-bottom: 5px;
	flex: 7 1 0;
	background-image: url(../Image/Peski/Peski1.jpg);
	background-position: center;
}
.three42 {
	flex: 3 1 0;
	background-image: url(../Image/vark/vark18.jpg);
}
.four32 {
	margin-bottom: 5px;
	flex: 1 1 0;
	background-image: url(../Image/stk.jpg);
	background-position: center;
}
.four42 {
	margin-bottom: 5px;
	flex: 1 1 0;
	background-image: url(../Image/Peski/Peski3.jpg);
	background-position: center;
}
.four52 {
	flex: 1 1 0;
	background-position: bottom;
	background-image: url(../Image/vark/vark17.jpg);
}
.flex-container2 {
	background-color: #fff;
	width: 100%;
}
#raz {
	display: none;
}
label[for='raz'] {
	display: inline-block;
	color: #dda427;
	text-transform: uppercase;
	padding: 15px 30px;
	margin: 50px 50px 0 -116px;
	left: 50%;
	cursor: pointer;
	position: relative;
	background-color: #fff;
	z-index: 1999;
	border: 2px solid #dda427;
	font-weight: bold;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
label[for='raz']:after {
	display: none;
}
#raz:checked ~ label[for='raz']:after {
	content: 'убрать';
	display: block;
	position: absolute;
	text-align: center;
	top: -2px;
	left: -2px;
	right: -2px;
	color: #dda427;
	background-color: #fff;
	padding: 15px 30px;
	border: 2px solid #dda427;
	font-weight: bold;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
label[for='raz']:hover,
#raz:checked ~ label[for='raz']:hover:after {
	color: #fff;
	background: #dda427;
	border: 2px solid #dda427;
}
#raz:checked ~ #skryt {
	position: relative;
	display: block;
	background-color: #fff;
}
#video_us {
	display: block;
	position: relative;
	text-align: center;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	z-index: 25;
}
#video_us video {
	width: 100%;
	max-width: 1000px;
}
#about {
	display: block;
	position: relative;
	width: 100%;
	background-color: #fff;
	margin-top: -50px;
	padding-top: 50px;
	z-index: 24;
}

/**************************** Top-menu ********************************/

.top-menu {
	width: 100%;
	padding-top: 26px;
	text-align: center;
	font-size: 0.9em;
}
.top-menu li {
	display: none;
}
#about-content img {
	width: 100%;
}

hr {
	background-color: black;
	margin: 0;
}

footer {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 30px;
	position: relative;
	width: 100%;
	padding: 30px 5%;
	background-color: #fff;
}

#copy {
	max-width: 460px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-wrap-style: pretty;
}

#copy span {
	margin-top: 1em;
	font-size: 0.8em;
	text-align: center;
	text-wrap-style: pretty;
}

#contact {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px 30px;
}

.cont {
	flex-shrink: 0;
}

.cont a {
	color: inherit;
	text-decoration: none;
	cursor: pointer;
}

.cont a:after {
	display: block;
	content: '';
	height: 1px;
	background-color: rgb(205, 220, 49);
	transition: opacity 0.3s ease-in-out;
}

@media only screen and (min-width: 745px) {
	h2 {
		font-size: 3vw;
		padding-top: 60px;
	}
	h5 {
		font-weight: 900;
		font-size: 100px;
		padding-top: 160px;
		padding-bottom: 60px;
	}
	.subtitle-line {
		width: 90%;
		left: 5%;
		top: 125px;
	}
	.subtitle h3 {
		padding: 110px 30px 80px;
	}
	.title h3 {
		font-size: 36px;
		padding: 50px 30px 80px;
	}
	.title .subtitle-line {
		top: 68px;
	}
	/* #copy {
		width: 60%;
		text-align: left;
		margin-top: 30px;
	} */
	/* #contact {
		width: 60%;
		text-align: left;
	} */
}

@media only screen and (min-width: 900px) {
	.about {
		width: 32%;
		padding: 30px 1%;
	}
	.about a {
		opacity: 0;
	}
	#video_us {
		padding: 50px 50px 0;
	}
	video {
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	}
}

@media only screen and (min-width: 950px) {
	footer {
		flex-direction: row;
		justify-content: space-between;
	}
	#copy {
		align-items: flex-start;
	}

	#copy span {
		text-align: left;
	}
}

@media only screen and (min-width: 1050px) {
	header {
		background-color: white;
	}
	.top-menu li {
		display: inline-block;
		margin: 0 25px;
	}
	.top-menu li a {
		opacity: 0.6;
		-webkit-transition: opacity 0.1s;
		transition: opacity 0.1s;
	}
	.top-menu li a:hover,
	.top-menu li a:active {
		opacity: 1;
		text-decoration: underline;
		text-decoration-color: rgba(205, 220, 49, 1);
		-moz-text-decoration-color: rgba(205, 220, 49, 1);
		-webkit-text-decoration-color: rgba(205, 220, 49, 1);
	}
	.top-menu li span a {
		opacity: 1;
		text-decoration: underline;
		text-decoration-color: rgba(205, 220, 49, 1);
		-moz-text-decoration-color: rgba(205, 220, 49, 1);
		-webkit-text-decoration-color: rgba(205, 220, 49, 1);
	}
	.cd-nav-trigger {
		display: none;
	}
	#phone-number {
		display: block;
		margin-top: -22px;
		right: 5%;
		font-size: 20px;
		border-bottom: 2px solid rgb(205, 220, 49);
		padding-bottom: 5px;
	}
}
/* @media only screen and (min-width: 1180px) { */
/* #copy {
		float: left;
		width: 39%;
	}
	#contact {
		width: 33%;
		text-align: center;
		margin: 50px 0;
	} */
/* } */

/* -------------------------------- Menu -------------------------------- */
.cd-nav-trigger {
	top: 8px;
	right: 5%;
	height: 44px;
	width: 44px;
	z-index: 11000;
	/* image replacement */
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
.cd-nav-trigger .cd-icon {
	/* icon created in CSS */
	position: absolute;
	left: 50%;
	top: 50%;
	bottom: auto;
	right: auto;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	display: inline-block;
	width: 18px;
	height: 3px;
	background-color: #ffffff;
	z-index: 10100;
}
.cd-nav-trigger .cd-icon::before,
.cd-nav-trigger .cd-icon:after {
	/* upper and lower lines of the menu icon */
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	/* apply transition to transform property */
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}
.cd-nav-trigger .cd-icon::before {
	-webkit-transform: translateY(-6px) rotate(0deg);
	-moz-transform: translateY(-6px) rotate(0deg);
	-ms-transform: translateY(-6px) rotate(0deg);
	-o-transform: translateY(-6px) rotate(0deg);
	transform: translateY(-6px) rotate(0deg);
}
.cd-nav-trigger .cd-icon::after {
	-webkit-transform: translateY(6px) rotate(0deg);
	-moz-transform: translateY(6px) rotate(0deg);
	-ms-transform: translateY(6px) rotate(0deg);
	-o-transform: translateY(6px) rotate(0deg);
	transform: translateY(6px) rotate(0deg);
}
.cd-nav-trigger::before,
.cd-nav-trigger::after {
	/* 2 rounded colored backgrounds for the menu icon */
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 50%;
	height: 100%;
	width: 100%;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	transition-property: transform;
}
.cd-nav-trigger::before {
	background-color: #091d23;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-delay: 0.4s;
	-moz-transition-delay: 0.4s;
	transition-delay: 0.4s;
}
.cd-nav-trigger::after {
	background-color: #ffb441;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
	-webkit-transition-duration: 0s;
	-moz-transition-duration: 0s;
	transition-duration: 0s;
	-webkit-transition-delay: 0s;
	-moz-transition-delay: 0s;
	transition-delay: 0s;
}
.cd-nav-trigger.close-nav::before {
	/* user clicks on the .cd-nav-trigger element - 1st rounded background disappears */
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
}
.cd-nav-trigger.close-nav::after {
	/* user clicks on the .cd-nav-trigger element - 2nd rounded background appears */
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-delay: 0.4s;
	-moz-transition-delay: 0.4s;
	transition-delay: 0.4s;
}
.cd-nav-trigger.close-nav .cd-icon {
	/* user clicks on the .cd-nav-trigger element - transform the icon */
	background-color: rgba(255, 255, 255, 0);
}
.cd-nav-trigger.close-nav .cd-icon::before,
.cd-nav-trigger.close-nav .cd-icon::after {
	background-color: white;
}
.cd-nav-trigger.close-nav .cd-icon::before {
	-webkit-transform: translateY(0) rotate(45deg);
	-moz-transform: translateY(0) rotate(45deg);
	-ms-transform: translateY(0) rotate(45deg);
	-o-transform: translateY(0) rotate(45deg);
	transform: translateY(0) rotate(45deg);
}
.cd-nav-trigger.close-nav .cd-icon::after {
	-webkit-transform: translateY(0) rotate(-45deg);
	-moz-transform: translateY(0) rotate(-45deg);
	-ms-transform: translateY(0) rotate(-45deg);
	-o-transform: translateY(0) rotate(-45deg);
	transform: translateY(0) rotate(-45deg);
}
.cd-primary-nav {
	/* by default it's hidden */
	position: fixed;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	padding: 80px 5%;
	z-index: 10050;
	background-color: rgb(213, 226, 84);
	overflow: auto;
	/* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
	-webkit-overflow-scrolling: touch;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility 0s, opacity 0.3s;
	-moz-transition: visibility 0s, opacity 0.3s;
	transition: visibility 0s, opacity 0.3s;
}
.cd-primary-nav li {
	margin: 1.6em 0;
	text-align: center;
	text-transform: capitalize;
}
.cd-primary-nav a {
	font-size: 20px;
	font-size: 1.25rem;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-transition: color 0.2s;
	-moz-transition: color 0.2s;
	transition: color 0.2s;
	color: #fff;
}
.no-touch .cd-primary-nav a:hover {
	color: #000;
}
.cd-primary-nav.fade-in {
	/* navigation visible at the end of the circle animation */
	visibility: visible;
	opacity: 1;
}
@media only screen and (min-width: 768px) {
	.cd-primary-nav li {
		margin: 2em 0;
	}
	.cd-primary-nav a {
		font-size: 28px;
		font-size: 1.75rem;
	}
}
@media only screen and (min-width: 1170px) {
	.cd-primary-nav li {
		margin: 2.6em 0;
	}
	.cd-primary-nav a {
		font-size: 32px;
		font-size: 2rem;
	}
}
.cd-overlay-nav,
.cd-overlay-content {
	/* containers of the 2 main rounded backgrounds - these containers are used to position the rounded bgs behind the menu icon */
	position: fixed;
	top: 18px;
	right: 5%;
	height: 4px;
	width: 4px;
	-webkit-transform: translateX(-20px) translateY(20px);
	-moz-transform: translateX(-20px) translateY(20px);
	-ms-transform: translateX(-20px) translateY(20px);
	-o-transform: translateX(-20px) translateY(20px);
	transform: translateX(-20px) translateY(20px);
}
.cd-overlay-nav span,
.cd-overlay-content span {
	display: inline-block;
	position: absolute;
	border-radius: 50%;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	will-change: transform;
	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
}
.cd-overlay-nav.is-hidden,
.cd-overlay-content.is-hidden {
	/* background fades out at the end of the animation */
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s;
	-moz-transition: opacity 0.3s 0s, visibility 0s 0.3s;
	transition: opacity 0.3s 0s, visibility 0s 0.3s;
}
.cd-overlay-nav {
	/* main rounded colored bg 1 */
	z-index: 10020;
}
.cd-overlay-nav span {
	background-color: rgb(213, 226, 84);
}
.cd-overlay-content {
	/* main rounded colored bg 2 */
	z-index: 10040;
}
.cd-overlay-content span {
	background-color: #ffb441;
}

/*************************** about us ******************************/

.about_i {
	display: block;
	position: fixed;
	background: url(../Image/Sev/Sev888.jpg) 100% 100% no-repeat;
	background-size: cover;
	background-position: 50% -500px;
	width: 100%;
	height: 100%;
	top: 0;
	z-index: -1;
}
#about_us {
	display: block;
	position: relative;
	width: 100%;
	margin-top: 20px;
	background-color: #fff;
	padding: 30px 25px;
	font-family: 'Gilroy';
	font-size: 1em;
	text-indent: 30px;
	text-align: justify;
	line-height: 1.5em;
	z-index: 10;
}
#about_us p {
	display: block;
	padding-top: 0.9em;
}
#about_us p::first-letter {
	font-size: 1.1em;
}
.title4 h5 {
	background: none;
	color: #fff;
	font-size: 25vw;
	padding-bottom: 0;
	text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
}
@media all and (min-width: 700px) {
	#about_us {
		margin-top: 50px;
		padding: 30px 50px;
		font-size: 1em;
	}
	#about_us p::first-letter {
		font-size: 1.2em;
	}
}
@media all and (min-width: 900px) {
	.title4 h5 {
		font-size: 300px;
	}
	#about_us {
		width: 800px;
		left: 50%;
		margin: 100px auto 0 -400px;
		border: 4px solid #dda427;
	}
}

#team_contaner {
	display: flex;
	position: relative;
	width: 100%;
	background-color: #fff;
	padding: 0 50px 30px;
}

#team {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
	position: relative;
	align-content: center;
	text-align: center;
	width: 100%;
}

.team_member {
	display: flex;
	position: relative;
	margin: 0 1% 30px;
	min-width: 220px;
	flex-direction: column;
	justify-content: flex-start;
	align-content: center;
	text-align: center;
	font-family: 'Gilroy';
	font-size: 14px;
	line-height: 1.5em;
}
.team_member div {
	display: flex;
	position: relative;
	width: 200px;
	height: 200px;
	left: 50%;
	margin: 30px auto 20px -100px;
	overflow: hidden;
}
.team_member img {
	width: 100%;
	height: 100%;
	-webkit-transition: transform 3s;
	-moz-transition: transform 3s;
	transition: transform 3s;
}
.team_member img:hover {
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
	transform: scale(1.2);
}
.team_member h4 {
	font-size: 18px;
	padding-bottom: inherit;
}
#empty {
	display: none;
}

@media all and (min-width: 459px) {
	.team_member {
		flex: 0 1 48%;
	}
	#empty {
		display: block;
	}
}

@media all and (min-width: 900px) {
	#team {
		width: 900px;
		left: 50%;
		margin-left: -450px;
	}
}

/******************** services ******************/

#service_title1,
#service_title2,
#service_title3 {
	display: block;
	position: relative;
	background-color: rgba(250, 250, 250, 1);
	width: 100%;
	padding-bottom: 50px;
}
#service_title1 .serv_1 {
	background: url(../Image/Kivach/Dendroplan.jpg);
	background-size: cover;
}
#service_title2 .serv_1 {
	background: url(../Image/vark/vark177.jpg);
	background-size: cover;
}
#service_title3 .serv_1 {
	background: url(../Image/matr/flowers22.jpg);
	background-size: cover;
}
.serv_1 {
	display: block;
	position: relative;
	width: 100%;
	color: rgba(255, 255, 255, 0.6);
	font-weight: bold;
	padding: 30px 0 30px;
	font-size: 200px;
	text-align: center;
}
.serv_2 {
	display: block;
	position: absolute;
	left: 50%;
	color: #fff;
	top: 105px;
	margin-left: -36vw;
	font-size: 8vw;
	font-family: 'GilroyBold';
	text-transform: uppercase;
}
#service_title2 .serv_2,
#service_title3 .serv_2 {
	margin-left: -34vw;
}
.service {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	max-width: 900px;
	width: 100%;
	left: 0;
	margin-left: 0;
	padding: 10px;
	margin-top: 50px;
	font-family: 'Gilroy';
	color: #2f2f2f;
	font-size: 14px;
	line-height: 1.5em;
	box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
	z-index: 5;
}
@media all and (min-width: 500px) {
	.service {
		font-size: 16px;
	}
}
@media all and (min-width: 745px) {
	.serv_2 {
		top: 105px;
		margin-left: -223px;
		font-size: 50px;
	}
	#service_title2 .serv_2,
	#service_title3 .serv_2 {
		margin-left: -205px;
	}
}
@media all and (min-width: 900px) {
	.serv_1 {
		padding: 60px 0 60px;
		font-size: 400px;
	}
	.serv_2 {
		top: 210px;
		margin-left: -446px;
		font-size: 100px;
	}
	#service_title2 .serv_2,
	#service_title3 .serv_2 {
		margin-left: -410px;
	}
	.service {
		font-size: 18px;
		left: 50%;
		margin-left: -450px;
		padding: 0;
	}
}
.service div {
	border-bottom: 1px solid #b5b5b5;
	border-right: 1px solid #b5b5b5;
	background-color: #fff;
}
.service div:first-child,
.service div:nth-child(2) {
	border-top: 1px solid #b5b5b5;
}
.serv1 {
	flex-basis: 100%;
	padding: 10px 30px 10px 40px;
	border-left: 1px solid #b5b5b5;
}
.serv1 ul li:first-child,
.serv1 ol li:first-child,
.serv1 p {
	font-weight: bold;
	list-style: none;
	margin-left: -20px;
}
.serv1 ul {
	list-style: circle inside;
}
.serv1 ol {
	list-style: decimal inside;
}
/* .serv2 {
	display: flex;
	flex-basis: 20%;
	align-items: center;
	justify-content: center;
	text-align: center;
} */

#express {
	position: relative;
	display: flex;
	flex: 1 1 0;
	align-items: center;
	justify-content: center;
}

#express img {
	height: 125vw;
	max-width: 100%;
}

@media all and (min-width: 800px) {
	footer {
		border-top: 1px solid #000;
	}
	#express {
		padding: 0 50px 100px;
		background-color: #fff;
	}
	#express img {
		height: 100%;
		border: outset 20px rgba(51, 170, 245, 1);
	}
}
@media all and (min-width: 1050px) {
	footer {
		border-top: none;
	}
	#express {
		padding: 100px 50px;
		background-image: url(../Image/express_back.jpg);
		background-size: cover;
		background-repeat: no-repeat;
	}
}
/************************portfolio**********************/
.portfolio {
	position: relative;
	display: flex;
	align-items: center; /* Выравнивание текста по вертикали */
	justify-content: center; /* Выравнивание текста по горизонтали */
	flex-wrap: wrap;
	width: 90%;
	left: 5%;
	margin-bottom: 60px;
}
.portfolio a {
	display: inline-block;
	position: relative;
	flex-basis: 99%;
	height: 56vw;
	margin: 2vw 0.5%;
	overflow: hidden;
}
.single-item img {
	height: 100%;
}
.object,
.object div {
	height: 56vw;
}
@media all and (min-width: 1050px) {
	.portfolio {
		margin-bottom: 120px;
	}
	.portfolio a {
		flex-basis: 49%;
		height: 28vw;
		margin: 0.35vw 0.5%;
	}
	.object,
	.object div {
		height: 28vw;
	}
}
.object:after,
.object:before {
	position: absolute;
	display: flex;
	height: 37%;
	bottom: 0;
	align-items: flex-end;
	padding: 30px;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.8));
	color: #fff;
	opacity: 0;
	-webkit-transition: opacity 0.3s 0s;
	-moz-transition: opacity 0.3s 0s;
	transition: opacity 0.3s 0s;
}
.object:after {
	justify-content: flex-start;
	width: 65%;
	left: 0;
	font-size: 20px;
}
.object:hover:after,
.object:hover:before {
	opacity: 1;
}
.object:before {
	content: 'подробнее';
	justify-content: flex-end;
	width: 35%;
	right: 0;
	font-size: 18px;
	z-index: 1000;
}
@media all and (min-width: 600px) {
	.object:after {
		font-size: 30px;
	}
	.object:before {
		font-size: 24px;
	}
}
.object:active:before {
	text-decoration: underline;
}
#lososinoe:after {
	content: 'Участок на оз. Лососинское';
}

#konchezero:after {
	content: 'Участок на оз. Кончезеро';
}
#Kivach:after {
	content: 'Заповедник "Кивач"';
}
#Sev:after {
	content: 'Ресторан "Северный"';
}
#vark:after {
	content: 'ЖК "Аквамарин"';
}
#matr:after {
	content: 'посёлок Матросы';
}
#Peski:after {
	content: 'г. Петрозаводск, р-н Пески';
}
#sert:after {
	content: 'г. Сертолово (Ленинградская обл.)';
}
.current_object {
	position: relative;
	display: flex;
	align-items: center; /* Выравнивание текста по вертикали */
	justify-content: center; /* Выравнивание текста по горизонтали */
	flex-wrap: wrap;
	width: 90%;
	left: 5%;
	margin-bottom: 50px;
}
.current {
	display: flex;
	position: relative;
	flex-basis: 100%;
	height: 56vw;
	margin: 0.35vw 0.5%;
	overflow: hidden;
	background-position: center;
	background-size: cover;
}
.current a {
	width: 100%;
	height: 100%;
}
.current_title {
	display: flex;
	flex: 1 1 0;
	height: 100%;
	align-items: center;
	justify-content: center;
	color: #fff;
	padding-bottom: 10px;
	background-color: rgba(92, 193, 0, 0.4);
	font-size: 0.5em;
	opacity: 0;
	-webkit-transition: opacity 0.3s 0s;
	-moz-transition: opacity 0.3s 0s;
	transition: opacity 0.3s 0s;
}
.current_title:hover {
	opacity: 1;
}
.current_title img {
	width: 48px;
}
@media all and (min-width: 1050px) {
	.current {
		flex-basis: 49%;
		height: 28vw;
	}
}
#others {
	display: inline-block;
	color: #dda427;
	text-transform: uppercase;
	padding: 15px 30px;
	margin-bottom: 50px;
	left: 50%;
	margin-left: -102px;
	cursor: pointer;
	position: relative;
	background-color: #fff;
	z-index: 1999;
	border: 2px solid #dda427;
	font-weight: bold;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
#others:hover {
	color: #fff;
	background: #dda427;
	border: 2px solid #dda427;
}
@media all and (min-width: 750px) {
	.current_object {
		margin-bottom: 120px;
	}
	#others {
		margin-bottom: 100px;
	}
}
#Kivach1 {
	background-image: url(../Image/Kivach/Kivach1.jpg);
}
#Kivach2 {
	background-image: url(../Image/Kivach/Kivach2.jpg);
}
#Kivach3 {
	background-image: url(../Image/Kivach/Kivach3.jpg);
}
#Kivach4 {
	background-image: url(../Image/Kivach/Kivach4.jpg);
}
#Kivach5 {
	background-image: url(../Image/Kivach/Kivach5.jpg);
}
#Kivach6 {
	background-image: url(../Image/Kivach/Kivach6.jpg);
}
#Kivach7 {
	background-image: url(../Image/Kivach/Kivach7.jpg);
}
#Kivach8 {
	background-image: url(../Image/Kivach/Kivach8.jpg);
}
#Kivach9 {
	background-image: url(../Image/Kivach/Kivach9.jpg);
}
#Kivach10 {
	background-image: url(../Image/Kivach/Kivach10.jpg);
}
#Kivach11 {
	background-image: url(../Image/Kivach/Kivach11.jpg);
}
#Sev2 {
	background-image: url(../Image/Sev/Sev2.jpg);
}
#Sev3 {
	background-image: url(../Image/Sev/Sev3.jpg);
}
#Sev4 {
	background-image: url(../Image/Sev/Sev4.jpg);
}
#Sev5 {
	background-image: url(../Image/Sev/Sev5.jpg);
}
#Sev6 {
	background-image: url(../Image/Sev/Sev6.jpg);
}
#Sev7 {
	background-image: url(../Image/Sev/Sev7.jpg);
}
#Sev8 {
	background-image: url(../Image/Sev/Sev8.jpg);
}
#Sev9 {
	background-image: url(../Image/Sev/Sev9.jpg);
}
#vark1 {
	background-image: url(../Image/vark/vark1.jpg);
}
#vark2 {
	background-image: url(../Image/vark/vark2.jpg);
}
#vark3 {
	background-image: url(../Image/vark/vark3.jpg);
}
#vark4 {
	background-image: url(../Image/vark/vark4.jpg);
}
#vark5 {
	background-image: url(../Image/vark/vark5.jpg);
}
#vark6 {
	background-image: url(../Image/vark/vark6.jpg);
}
#vark7 {
	background-image: url(../Image/vark/vark7.jpg);
}
#vark8 {
	background-image: url(../Image/vark/vark8.jpg);
}
#vark9 {
	background-image: url(../Image/vark/vark9.jpg);
}
#vark10 {
	background-image: url(../Image/vark/vark10.jpg);
}
#vark11 {
	background-image: url(../Image/vark/vark11.jpg);
}
#vark12 {
	background-image: url(../Image/vark/vark12.jpg);
}
#vark13 {
	background-image: url(../Image/vark/vark13.jpg);
}
#vark14 {
	background-image: url(../Image/vark/vark14.jpg);
}
#vark15 {
	background-image: url(../Image/vark/vark15.jpg);
}
#vark16 {
	background-image: url(../Image/vark/vark16.jpg);
}
#vark17 {
	background-image: url(../Image/vark/vark17.jpg);
}
#vark18 {
	background-image: url(../Image/vark/vark18.jpg);
}
#vark20 {
	background-image: url(../Image/vark/vark20.jpg);
}
#vark21 {
	background-image: url(../Image/vark/vark21.jpg);
}
#matr1 {
	background-image: url(../Image/matr/matr1.jpg);
}
#matr2 {
	background-image: url(../Image/matr/matr2.jpg);
}
#matr3 {
	background-image: url(../Image/matr/matr3.jpg);
}
#matr4 {
	background-image: url(../Image/matr/matr4.jpg);
}
#matr5 {
	background-image: url(../Image/matr/matr5.jpg);
}
#matr6 {
	background-image: url(../Image/matr/matr6.jpg);
}
#matr7 {
	background-image: url(../Image/matr/matr7.jpg);
}
#golf1 {
	background-image: url(../Image/matr/golf1.jpg);
}
#golf2 {
	background-image: url(../Image/matr/golf2.jpg);
}
#flowers1 {
	background-image: url(../Image/matr/flowers1.jpg);
}
#flowers2 {
	background-image: url(../Image/matr/flowers2.jpg);
}
#flowers3 {
	background-image: url(../Image/matr/flowers3.jpg);
}
#Peski1 {
	background-image: url(../Image/Peski/Peski1.jpg);
}
#Peski2 {
	background-image: url(../Image/Peski/Peski2.jpg);
}
#Peski3 {
	background-image: url(../Image/Peski/Peski3.jpg);
}
#Peski4 {
	background-image: url(../Image/Peski/Peski4.jpg);
}
#Peski5 {
	background-image: url(../Image/Peski/Peski5.jpg);
}
#Peski6 {
	background-image: url(../Image/Peski/Peski6.jpg);
}
#Peski7 {
	background-image: url(../Image/Peski/Peski7.jpg);
}
#Peski8 {
	background-image: url(../Image/Peski/Peski8.jpg);
}
#Peski9 {
	background-image: url(../Image/Peski/Peski9.jpg);
}
#Peski10 {
	background-image: url(../Image/Peski/Peski10.jpg);
}
#Peski11 {
	background-image: url(../Image/Peski/Peski11.jpg);
}
#Peski12 {
	background-image: url(../Image/Peski/Peski12.jpg);
}
#Peski13 {
	background-image: url(../Image/Peski/Peski13.jpg);
}
#Peski14 {
	background-image: url(../Image/Peski/Peski14.jpg);
}
#Peski15 {
	background-image: url(../Image/Peski/Peski15.jpg);
}
#Peski16 {
	background-image: url(../Image/Peski/Peski16.jpg);
}
#sert1 {
	background-image: url(../Image/sert/sert1.jpg);
}
#sert2 {
	background-image: url(../Image/sert/sert2.jpg);
}
#sert3 {
	background-image: url(../Image/sert/sert3.jpg);
}
#sert4 {
	background-image: url(../Image/sert/sert4.jpg);
}
#sert5 {
	background-image: url(../Image/sert/sert5.jpg);
}
#sert6 {
	background-image: url(../Image/sert/sert6.jpg);
}
#sert7 {
	background-image: url(../Image/sert/sert7.jpg);
}
#sert8 {
	background-image: url(../Image/sert/sert8.jpg);
}
#sert9 {
	background-image: url(../Image/sert/sert9.jpg);
}
#sert10 {
	background-image: url(../Image/sert/sert10.jpg);
}
#sert11 {
	background-image: url(../Image/sert/sert11.jpg);
}
#sert12 {
	background-image: url(../Image/sert/sert12.jpg);
}
#sert13 {
	background-image: url(../Image/sert/sert13.jpg);
}
#sert14 {
	background-image: url(../Image/sert/sert14.jpg);
}
#sert15 {
	background-image: url(../Image/sert/sert15.jpg);
}
#sert16 {
	background-image: url(../Image/sert/sert16.jpg);
}
#konchezero-01 {
	background-image: url(../Image/konchezero/konchezero-01.jpg);
}
#konchezero-02 {
	background-image: url(../Image/konchezero/konchezero-02.jpg);
}
#konchezero-03 {
	background-image: url(../Image/konchezero/konchezero-03.jpg);
}
#konchezero-04 {
	background-image: url(../Image/konchezero/konchezero-04.jpg);
}
#konchezero-05 {
	background-image: url(../Image/konchezero/konchezero-05.jpg);
}
#konchezero-06 {
	background-image: url(../Image/konchezero/konchezero-06.jpg);
}
#konchezero-07 {
	background-image: url(../Image/konchezero/konchezero-07.jpg);
}
#konchezero-08 {
	background-image: url(../Image/konchezero/konchezero-08.jpg);
}
#konchezero-09 {
	background-image: url(../Image/konchezero/konchezero-09.jpg);
}
#konchezero-10 {
	background-image: url(../Image/konchezero/konchezero-10.jpg);
}
#konchezero-11 {
	background-image: url(../Image/konchezero/konchezero-11.jpg);
}
#konchezero-12 {
	background-image: url(../Image/konchezero/konchezero-12.jpg);
}
#konchezero-13 {
	background-image: url(../Image/konchezero/konchezero-13.jpg);
}
#konchezero-14 {
	background-image: url(../Image/konchezero/konchezero-14.jpg);
}
#konchezero-15 {
	background-image: url(../Image/konchezero/konchezero-15.jpg);
}
#konchezero-16 {
	background-image: url(../Image/konchezero/konchezero-16.jpg);
}
#konchezero-17 {
	background-image: url(../Image/konchezero/konchezero-17.jpg);
}
#konchezero-18 {
	background-image: url(../Image/konchezero/konchezero-18.jpg);
}
#konchezero-19 {
	background-image: url(../Image/konchezero/konchezero-19.jpg);
}
#lososinoe-01 {
	background-image: url(../Image/lososinoe/lososinoe-01.jpg);
}
#lososinoe-02 {
	background-image: url(../Image/lososinoe/lososinoe-02.jpg);
}
#lososinoe-03 {
	background-image: url(../Image/lososinoe/lososinoe-03.jpg);
}
#lososinoe-04 {
	background-image: url(../Image/lososinoe/lososinoe-04.jpg);
}
#lososinoe-05 {
	background-image: url(../Image/lososinoe/lososinoe-05.jpg);
}
#lososinoe-06 {
	background-image: url(../Image/lososinoe/lososinoe-06.jpg);
}
#lososinoe-07 {
	background-image: url(../Image/lososinoe/lososinoe-07.jpg);
}
#lososinoe-08 {
	background-image: url(../Image/lososinoe/lososinoe-08.jpg);
}
#lososinoe-09 {
	background-image: url(../Image/lososinoe/lososinoe-09.jpg);
}
#lososinoe-10 {
	background-image: url(../Image/lososinoe/lososinoe-10.jpg);
}
#lososinoe-11 {
	background-image: url(../Image/lososinoe/lososinoe-11.jpg);
}
#lososinoe-12 {
	background-image: url(../Image/lososinoe/lososinoe-12.jpg);
}
#lososinoe-13 {
	background-image: url(../Image/lososinoe/lososinoe-13.jpg);
}
#lososinoe-14 {
	background-image: url(../Image/lososinoe/lososinoe-14.jpg);
}
#lososinoe-15 {
	background-image: url(../Image/lososinoe/lososinoe-15.jpg);
}
#lososinoe-16 {
	background-image: url(../Image/lososinoe/lososinoe-16.jpg);
}
#lososinoe-17 {
	background-image: url(../Image/lososinoe/lososinoe-17.jpg);
}
#lososinoe-18 {
	background-image: url(../Image/lososinoe/lososinoe-18.jpg);
}
#lososinoe-19 {
	background-image: url(../Image/lososinoe/lososinoe-19.jpg);
}
#lososinoe-20 {
	background-image: url(../Image/lososinoe/lososinoe-20.jpg);
}
