/*Обнуление*/
* {
	padding: 0;
	margin: 0;
	border: 0;
}
*,
*:before,
*:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
:focus,
:active {
	outline: none;
}
a:focus,
a:active {
	outline: none;
}

nav,
footer,
header,
aside {
	display: block;
}

html,
body {
	height: 100%;
	width: 100%;
	font-size: 100%;
	line-height: 1;
	font-size: 14px;
	-ms-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
input,
button,
textarea {
	font-family: inherit;
}

input::-ms-clear {
	display: none;
}
button {
	cursor: pointer;
}
button::-moz-focus-inner {
	padding: 0;
	border: 0;
}
a,
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
ul li {
	list-style: none;
}
img {
	vertical-align: top;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: inherit;
	font-weight: 400;
}
/*--------------------*/

body {
	background-color: black;
}

.nav,
.menu {
	display: flex;
	position: ;
}

.nav {
	padding: 1.38vw 0 0 0;
}

.menu {
	position: absolute;
	right: 0px;
	padding-right: 1.38vw;
}

.menu-item p img {
	width: 6.25vw;
}

.menu-item {
	padding: 0 1.38vw 0 0;
	opacity: 0.5;
}

.menu-item:hover {
	opacity: 1;
}

.menu-item-active {
	opacity: 1;
}

.logo a {
	display: inline-block;
	font-family: Ranchers;
	font-style: normal;
	font-weight: normal;
	font-size: 3.33vw;
	line-height: 4.16vw;
	padding: 0.9vw 0 0 2.7vw;
	letter-spacing: 0.07em;
	color: #ffffff;
	opacity: 0.5;
}

.logo a:hover {
	opacity: 1;
}

h1 {
	font-family: Ranchers;
	font-style: normal;
	font-weight: normal;
	font-size: 6.94vw;
	line-height: 8.75vw;
	text-align: center;
	letter-spacing: 0.07em;
	color: #ffffff;
	padding: 4.5vw 0 2.5vw 0;
	animation: show 3s 1;
}

h3 {
	font-family: Ranchers;
	font-style: normal;
	font-weight: normal;
	font-size: 2.5vw;
	line-height: 3vw;
	letter-spacing: 0.07em;
	color: #a3a3a3;
	animation: show 7s 1;
}

.text {
	font-family: Montserrat;
	font-style: normal;
	font-weight: 200;
	font-size: 2.5vw;
	line-height: 3vw;
	text-align: justify;
	color: #ffffff;
}

strong {
	font-family: Ranchers;
	font-style: normal;
	font-weight: normal;
	font-size: 3.5vw;
	line-height: 6vw;
}

.punctuation-text-first {
	width: 94.4vw;
	margin: 0 auto;
	animation: show 5s 1;
}

.content {
	position: relative;
}

.bg {
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position: fixed;
	width: 100%;
	padding-bottom: 70vh;
	margin-top: 10vh;
	animation: show 5s 1;
	transition-delay: 5s;
	z-index: -1;
}

.bg-start {
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position: fixed;
	width: 100%;
	padding-bottom: 70vh;
	margin-top: 10vh;
	animation: hide 8s 1;
	opacity: 0;
}

.question {
	background-image: url(img/question-bg-start.png);
}

.question1 {
	background-image: url(img/question-bg.svg);
}

.exclam {
	background-image: url(img/exclam-bg-start.png);
}

.exclam1 {
	background-image: url(img/exclam-bg.svg);
}

.quotes {
	background-image: url(img/quotes-bg-start.png);
}

.quotes1 {
	background-image: url(img/quotes-bg.svg);
}

.dash {
	background-image: url(img/dash-bg-start.png);
}

.dash1 {
	background-image: url(img/dash-bg.svg);
}

.apost {
	background-image: url(img/apost-bg-start.png);
}

.apost1 {
	background-image: url(img/apost-bg.svg);
}

.per {
	background-image: url(img/per-bg-start.png);
}

.per1 {
	background-image: url(img/per-bg.svg);
}

.comma {
	background-image: url(img/comma-bg-start.png);
}

.comma1 {
	background-image: url(img/comma-bg.svg);
}

.col {
	background-image: url(img/col-bg-start.png);
}

.col1 {
	background-image: url(img/col-bg.svg);
}

.semi {
	background-image: url(img/semi-bg-start.png);
}

.semi1 {
	background-image: url(img/semi-bg.svg);
}

.punctuation-text {
	padding: 6.5vw 0 2.5vw 0;
	width: 64.4vw;
	margin: 0 auto;
	position: relative;
	animation: show 5s 1;
	transition-delay: 5s;
}

@keyframes show {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes hide {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@media screen and (max-width: 800px) {
	.punctuation-text {
		width: 94.4vw;
	}
	.text {
		font-size: 4.5vw;
		line-height: 6vw;
	}
}