@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
body {
	margin: 0;
	padding: 0;
	font-family: 'Roboto Condensed';
	font-weight: 300;
}
.img-full {
	width: 100%;
}

.container-main {
	display: flex;
	background-image: url('../img/background.png');
	background-size: cover;
	background-position: -5vw;
	background-repeat: no-repeat;
	height: 100vh;
}
.container-main .container-inner {
	padding-left: 18vw;
	display: flex;
	flex-direction: column;
	height: 100vh;
}
.container-main .container-inner-top {
	display: flex;
	align-items: center;
	height: 33vh;
	padding-left: 27vw;
}
.container-main .container-inner-top .left {
	font-size: 2vw;
	text-align: right;
	color: #202d61;
}
.container-main .container-inner-top .right img {
	height: 13vw;
	margin-left: 5vw;
}
.container-main .container-inner-center {
	display: flex;
	align-items: center;
	height: 33vh;
	padding-top: 2vw;
}
.container-main .container-inner-center .left {
	font-size: 2.2vw;
	text-align: center;
	color: #202d61;
	text-transform: uppercase;
}
.container-main .container-inner-center .left span {
	color: #009fe3;
}
.container-main .container-inner-center .right .first {
	background-color: #133984;
	margin-left: 5vw;
	width: 100%;
	text-align: center;
	color: white;
	padding: 0.5vw;
	font-size: 1.5vw;
	text-transform: uppercase;
}
.container-main .container-inner-center .right .second {
	background-color: #94c120;
	margin-left: 5vw;
	margin-top: 0.5vw;
	width: 100%;
	text-align: center;
	color: white;
	padding: 0.5vw;
	font-size: 1.5vw;
	text-transform: uppercase;
}
.container-main .container-inner-bottom {
	display: flex;
	align-items: center;
	padding-left: 30vw;
	height: 33vh;
	flex-direction: column;
	padding-top: 3vw;
}
.container-main .container-inner-bottom .first img {
	height: 3vw;
}
.container-main .container-inner-bottom .second img {
	height: 8vw;
}
.container-main .container-inner-bottom .second a {
	transition: 0.3s all;
}
.container-main .container-inner-bottom .second a:hover {
	transition: 0.3s all;
	opacity: 0.7;
}

.container-responsive .container-intro {
	background-color: #1e2758;
	color: white;
	font-size: 3vh;
	text-transform: uppercase;
	padding: 2vh;
	text-align: center;
	margin-top: -15px;
}
.container-responsive .container-intro span {
	color: #fff338;
}
.container-responsive .container-pay {
	font-size: 4vh;
}
.container-responsive .container-pay a {
	text-decoration: none;
}
.container-responsive .container-pay .first,
.container-responsive .container-pay .second,
.container-responsive .container-pay .third {
	padding: 2vh;
	text-align: center;
	font-weight: normal;
	text-transform: uppercase;
}
.container-responsive .container-pay .first {
	background-color: #f6ec14;
	color: #272b5f;
}
.container-responsive .container-pay .second {
	background-color: #009be3;
	color: white;
}
.container-responsive .container-pay .third {
	background-color: #a2c216;
	color: white;
}
.container-responsive .container-methods {
	padding: 3vh;
	text-align: center;
}
.container-responsive .container-methods img {
	width: 100%;
}
.container-responsive .container-ending {
	color: #1e2758;
	font-size: 3vh;
	text-transform: uppercase;
	padding: 2vh;
	text-align: center;
	border-top: 15px solid #a2c216;
}
.container-responsive .container-ending span {
	color: #fff338;
}

@media (orientation: landscape) {
  .container-main {
		display: block;
	}
	.container-responsive {
		display: none;
	}
}

@media (orientation: portrait) {
	.container-main {
		display: none;
	}
  .container-responsive {
		display: block;
	}
}