body {
	font-family: futura-pt,sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 19px;
	width: 100%;
	padding-bottom: 80px;
	margin: 0;
	display: table;
	position: relative;
}
.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}
.background {
	position: absolute;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	z-index: -1;
	background-image: url('../images/pernoo.webp');
	background-size: cover;
	background-position: center;
	transition: all 1s cubic-bezier(0.59, 0, 0.37, 0.99);
	opacity: 0;
}
.loaded .background {
	opacity: 0.5;
}
h1 {
    font-family: futura-pt,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
    font-size: 100px;
    line-height: 90px;
	transition: all 1s cubic-bezier(0.59, 0, 0.37, 0.99) 1s;
	transform: translateX(20px);
	opacity: 0;
}
.loaded h1 {
	transform: translateX(0px);
	opacity: 1;
}

h2 {
    font-family: futura-pt,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
    font-size: 60px;
    line-height: 50px;
}
h3 {
    margin-bottom: -10px;
}
h4 {
    text-transform: uppercase;
    font-size: 30px;
    letter-spacing: 2px;
}
p {
	max-width: 700px;
}
strong {
	font-size: 25px;
	font-weight: 700;
}
.content {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	padding-left: 20px;
	padding-right: 20px;
}
.boxed {
    border-left: solid 4px #000000;
    padding-left: 60px;
	transition: all 1s cubic-bezier(0.59, 0, 0.37, 0.99) 2s;
	transform: translateX(20px);
	opacity: 0;
}
.loaded .boxed {
	transform: translateX(0px);
	opacity: 1;
}
.logo {
	position: absolute;
	top: 60px;
	left: 60px;
	width: 150px;
	height: 38px;
	background-image: url('../images/pernoo-logo.png');
	background-size: contain;
	transition: all 1s cubic-bezier(0.59, 0, 0.37, 0.99) 0s;
	transform: translateY(-20px);
	opacity: 0;
}
.loaded .logo {
	transform: translateX(0px);
	opacity: 1;
}
.contacts {
	margin-top: 60px;
	transition: all 1s cubic-bezier(0.59, 0, 0.37, 0.99) 3s;
	transform: translateX(20px);
	opacity: 0;
}
.loaded .contacts {
	transform: translateX(0px);
	opacity: 1;
}
.contact {
	padding-left: 60px;
	border-left: solid 4px #000000;
}


@media (max-width: 1400px) {
	h1 {
	    margin-top: 120px;
	}
}
@media (max-width: 850px) {
	h1 {
	    font-size: 80px;
		line-height: 70px;
	}
	.logo {
	    top: 40px;
	    left: 20px;
	}
	.boxed, .contact {
	    padding-left: 30px;
	}
}
@media (max-width: 600px) {
	h1 {
	    font-size: 50px;
		line-height: 45px;
	}
}