body {
	margin: 0;
}

.wrapper {
	width: 440px;
	margin: 0 auto;
	height: 956px;
	/* background: radial-gradient(circle at center, #394186 0%, rgba(23, 19, 44, 0.95) 65.62%); */
	/* background: radial-gradient(circle at 51.56% 52.41%, #394186 0%, rgba(23, 19, 44, 0.95) 65.62%); */
	background: #394186; /* Fallback */
	/* background: radial-gradient(circle at 51.56% 52.41%, #394186 0%, rgba(23, 19, 44, 0.95) 65.62%); */
	background: radial-gradient(circle at 51.56% 52.41%, #394186 0%, rgba(23, 19, 44, 0.95) 130%);
}

.wrapper > div {
	position: relative;
}

.top {
	background-image: url('../img/top.png');
	height: 318px;
}

.top img {
	position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -100%);
	-webkit-transform: translate(-50%, -100%);
	-ms-transform: translate(-50%, -100%);
}

.spacer {
	height: 114px;
}

.bottom {
	background-image: url('../img/bottom.png');
	height: 524px;
}

.figure {
	position: absolute;
    bottom: 10%;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    max-width: 403px;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.figure img {
	/* width: 100%; */
    height: auto;
    display: block;
}

.figure img:first-child {
	text-align: center;
	text-align: -webkit-center;
}

.buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	position: relative;
	/* top: 25%; */
	height: 100px;
	text-align: center;
}

.buttons .btn {
	position: absolute;
}

.buttons .btn:last-child img {
	width: 100%;
}

.buttons .btn-login {
	top: -90%;
	/* right: 3.75%; */
}

.buttons .btn-signup {
	top: 10px;
	text-align: center;
    text-align: -webkit-center;
}

.buttons .btn-signup img {
	text-align: center;
    text-align: -webkit-center;
}

/* .buttons a {
	transition: transform 0.3s ease;
}

.buttons a:hover {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
} */

.bottom-figure {
	bottom: 0;
    position: absolute;
    display: flex;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%); /* Safari and older browsers */
    -ms-transform: translateX(-50%); /* IE 9+ */
}

.bottom-figure img {
	width: 345px;
}

@media  (max-width: 440px) {
	.wrapper {
		width: 100%;
	}

	.buttons a:hover {
		transform: scale(1);
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
	}
	
	/* .buttons .btn-login {
		transform: translate(13px);
		-webkit-transform: translate(13px);
		-ms-transform: translate(13px);
	} */
}