:root {
	--color1: #0304E5;
	--color2: #B8FB3C;
	--color3: #012E46;
	--color4: #FF9900;
}
body {
	margin: 0px;
	margin: 0px auto;
	padding: 0px 20px;
    font-family: 'Noto Sans';
	color: white;
	background: var(--color1);
	max-width: 480px;
}


header {
	margin-bottom: 96px;
}
header img {
    display: block;
    margin: 0px auto;
}
header p {
    font-size: 18px;
    text-align: center;
    text-wrap: balance;
}



.user_wrap {
	padding: 32px 32px;
	font-size: 16px;
	background: var(--color3);
}



.auth {
	grid-column: span 2;
    margin: 0px 0px 24px 0px;
    text-align: center;
}
.auth .lbl {
}
.auth .val {
    color: var(--color2);
}



.user_cont {
    display: grid;
    grid-template-columns: 60px 1fr;
    grid-gap: 8px 32px;
    max-width: 352px;
    margin: 0px auto;
}
.user_cont img {
    grid-row: span 3;
}

.info {
    margin: 0px;
}
.info .lbl {
    display: block;
}
.info .val {
    display: block;
    color: var(--color4);
}
.info .xlbl {
    display: inline-block;
    width : 100px;
}
.info .xval {
    display: inline-block;
    width : 100px;
    color: var(--color4);
}

.task {
    --grid-column: span 2;
    font-size: 15px;
}
.task a {
    color: var(--color2);
}



.company,
.faqs {
    margin: 64px 0px;
}
.company h2,
.faqs h2 {
    margin: 32px 0px 8px 0px;
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    text-transform: uppercase;
}
.company p,
.faqs p {
    margin: 8px 0px 0px 0px;
    font-weight: 300;
}
.faqs h3 {
    margin: 32px 0px 8px 0px;
    font-size: 16px;
}



.sponsors_wrap {
    margin: 64px 0px;
}
.sponsors_wrap h2 {
    margin: 0px 0px 8px 24px;
    font-size: 18px;
    font-weight: 300;
    text-transform: uppercase;
}
.sponsors_logos {
    display: grid;
    grid-gap: 16px;
    grid-template-columns: 1fr 1fr;
    padding: 16px;
    background: white;
    border-radius: 16px;
}
.sponsors_logos .logo {
    align-self: center;
    justify-self: center;
}



.copy {
    margin: 16px 0px 16px 0px;
    text-align: center;
}