@-webkit-keyframes arrow {
	from {
		transform: translateY(-70%);
	}
	to {
		transform: translateY(30%);
	}
}
@keyframes arrow {
	from {
		transform: translateY(-70%);
	}
	to {
		transform: translateY(30%);
	}
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	box-sizing: border-box;
}

html {
	font-size: 62.5%;
	scroll-behavior: smooth;
}

body {
	font-family: "Montserrat", sans-serif;
	font-size: 1.8rem;
}

.overflow {
	overflow: hidden;
}

.header {
	position: relative;
	overflow: hidden;
}
.header__logo {
	margin-left: 0.5em;
	width: 80px;
}
.header__top {
	width: 100%;
	height: 80px;
	background-color: hsl(240deg, 40%, 10%);
}
.header .hamburger {
	position: absolute;
	top: 2.35em;
	right: 1em;
	transform: translateY(-50%);
	z-index: 50;
}
.header .is-active {
	position: fixed;
}
.header .nav-mobile {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	transform: translateX(102%);
	transition: transform 0.3s;
	z-index: 10;
	background-color: hsl(0deg, 0%, 100%);
}
.header .nav-mobile--active {
	position: fixed;
	transform: translateX(0);
}
.header .nav__link {
	margin: 1em;
	font-size: 1.8rem;
	font-weight: light;
	text-transform: uppercase;
	letter-spacing: 2px;
	text-decoration: none;
	color: hsl(265deg, 99%, 38%);
	transition: color 0.3s;
}
.header .nav__link:hover {
	color: hsl(288deg, 100%, 50%);
}
.header .nav-desktop {
	display: none;
}
.header .nav-desktop__top {
	width: 100%;
	height: 80px;
	background-color: hsl(240deg, 40%, 10%);
}
.header__img {
	background-image: url("../img/kod-1.webp");
	filter: contrast(25%);
	background-size: cover;
	background-repeat: no-repeat;
	width: 100%;
	height: 300px;
}
.header__heading {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 300px;
	text-align: center;
	color: hsl(0deg, 0%, 100%);
	font-weight: bold;
	font-size: 3rem;
	transform: translate(-50%, -50%);
	text-shadow: 5px 5px 15px hsl(240deg, 40%, 10%);
}
.header__heading::after {
	content: "";
	position: absolute;
	top: 32px;
	right: 15px;
	width: 30px;
	height: 5px;
	background-color: hsl(240deg, 40%, 10%);
	border-radius: 15px;
}
.header__paragraph {
	position: absolute;
	top: 60%;
	left: 50%;
	text-align: center;
	text-shadow: 5px 5px 15px hsl(240deg, 40%, 10%);
	color: hsla(0deg, 0%, 100%, 0.784);
	font-size: 1.4rem;
	transform: translate(-50%);
}

.main .section {
	position: relative;
	padding: 8em 0;
	text-align: center;
}
.main .section__heading {
	font-weight: bold;
	font-size: 2.4rem;
	color: hsl(265deg, 99%, 38%);
}
.main .section__paragraph {
	margin: 1em;
	font-size: 1.3rem;
	color: hsl(240deg, 40%, 10%);
}
.main .our-apps,
.main .about {
	background-color: hsla(0deg, 2%, 40%, 0.084);
}
.main .our-apps__price-list {
	margin: 2em;
	color: hsl(265deg, 99%, 38%);
	font-weight: bold;
	font-size: 2.2rem;
}
.main .our-apps__cards {
	display: flex;
	flex-direction: column;
}
.main .our-apps__cards-card {
	margin: 1.5em auto;
	padding: 1em;
	width: 300px;
	background-color: hsl(0deg, 0%, 100%);
	border-radius: 15px;
	box-shadow: 5px 5px 15px hsl(240deg, 40%, 10%);
}
.main .our-apps__cards-card-heading {
	font-weight: bold;
	color: hsl(265deg, 99%, 38%);
	font-size: 2rem;
}
.main .our-apps__cards-card-earlier {
	margin: 1em;
	font-size: 1.4rem;
	text-decoration: line-through;
	font-weight: lighter;
}
.main .our-apps__cards-card-now {
	margin: 1em;
	font-weight: bold;
	font-size: 1.8rem;
	color: hsla(265deg, 99%, 38%, 0.733);
}
.main .whats-new p {
	margin-top: 2em;
}
.main .whats-new span {
	margin: 1em 0.5em;
	font-size: 1.6rem;
	font-weight: bold;
}
.main .about p {
	margin-top: 1em;
	padding: 1em;
}
.main .discord__link {
	color: hsl(265deg, 99%, 38%);
	font-size: 1.5rem;
	text-decoration: none;
	font-weight: bold;
	transition: color 0.3s;
}
.main .discord__link:hover {
	color: hsl(240deg, 50%, 50%);
}
.main .discord__arrow {
	position: absolute;
	left: 50%;
	transform: translate(-50%);
	top: 270px;
}
.main .discord__arrow i {
	margin-top: 2em;
	padding: 0.5em 0.7em;
	color: rgb(86, 73, 104);
	border-radius: 50%;
	border: solid 1px hsl(265deg, 99%, 38%);
	-webkit-animation: arrow 1s infinite alternate both;
	animation: arrow 1s infinite alternate both;
}
.btn-wrapper-reflink {
	width: 180px;
	height: 50px;
	background: none;
	color: hsla(265deg, 99%, 38%, 0.733);
	font-size: 20px;
	font-weight: bold;
	border-radius: 20px;

	cursor: pointer;
	transition: 0.5s;
}
.btn-wrapper-reflink:hover {
	border-radius: 5px;
	background-color: hsl(265deg, 99%, 38%);
	color: rgb(255, 255, 255);
	border: rgb(0, 0, 0) solid 2px;
	box-shadow: hsla(265deg, 99%, 38%, 0.733) 0 0 25px;
}

.footer {
	position: absolute;
	width: 100%;
	padding: 0.5em;
	text-align: center;
	line-height: 40px;
	background-color: hsl(240deg, 40%, 10%);
}
.footer__paragraph {
	color: hsl(0deg, 0%, 100%);
}

@media (min-width: 576px) {
	.header__logo,
	.hamburger {
		margin-left: 3em;
		margin-right: 3em;
	}
	.header__heading {
		min-width: 350px;
		font-size: 3.5rem;
	}
	.header__heading::after {
		top: 40px;
		right: -5px;
		width: 40px;
	}
	.header__paragraph {
		font-size: 1.8rem;
	}
	.section__heading {
		font-size: 2.5rem;
	}
}
@media (min-width: 768px) {
	.wrapper {
		max-width: 700px;
		margin: 0 auto;
	}
	.wrapper-nav {
		display: flex;
		justify-content: space-evenly;
		width: 100%;
		background-color: hsl(240deg, 40%, 10%);
		position: fixed;
		z-index: 10;
	}
	.header__logo,
	.header .hamburger {
		display: none;
	}
	.header__img {
		height: 500px;
	}
	.header__heading {
		font-size: 4.2rem;
	}
	.header__heading::after {
		width: 70px;
		top: 52px;
		right: -15px;
	}
	.header__paragraph {
		font-size: 1.8rem;
	}
	.header__top {
		display: none;
	}
	.header .nav-mobile {
		display: none;
	}
	.header .nav-desktop {
		display: flex;
		background-color: hsl(240deg, 40%, 10%);
		height: 80px;
		min-width: 100%;
		position: fixed;
		z-index: 10;
		justify-self: center;
		justify-content: center;
	}
	.header .nav__logo {
		width: 80px;
		height: 79px;
	}
	.header .nav__link {
		align-self: center;
	}
	.main .section__heading {
		font-size: 2.8rem;
	}
	.main .section__paragraph {
		font-size: 1.4rem;
	}
	.main .our-apps__price-list {
		font-size: 2.5rem;
	}
	.main .our-apps__cards {
		flex-direction: row;
		flex-wrap: wrap;
		margin: 1em;
	}
}
@media (min-width: 992px) {
	.wrapper {
		max-width: 900px;
	}
	.header .nav-desktop {
		justify-content: space-evenly;
		padding: 0 8rem;
	}
	.header__heading {
		min-width: 600px;
		font-size: 5.5rem;
	}
	.header__heading::after {
		width: 100px;
		top: 62px;
		right: 7px;
	}
	.header__paragraph {
		font-size: 2.3rem;
	}
	.main .section__heading {
		font-size: 3rem;
	}
	.main .section__paragraph {
		font-size: 1.6rem;
	}
	.main .whats-new span {
		font-size: 1.9rem;
	}
	.main .discord__link {
		font-size: 1.7rem;
	}
}
@media (min-width: 1200px) {
	.wrapper {
		max-width: 1100px;
	}
	.header .nav-desktop {
		padding: 0 15em;
	}
}
@media (min-width: 1400px) {
	.wrappper {
		max-width: 1200px;
	}
	.header .nav-desktop {
		padding: 0 20em;
	}
} /*# sourceMappingURL=style.css.map */