:root {
	--logo-top-bottom-padding: 6px;
	--message-height: 64px;
	--radio-button-size: 32px;
}

.btn-begin {
	margin-left: auto;
	margin-right: auto;
	width: 180px;	
	margin-top: 32px;
}

.bullet-note {
	padding: 16px;
	padding-bottom: 4px;
	width: 550px;
	margin-top: 8px;
	font-size: 24px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	border-radius: 10px;	
}

@media (max-width: 1024px) { /* mobile */
	.bullet-note {
		width: 95%;
	}
}

.bullet-note:nth-of-type(1)
{
	/*background-color: #6bf685;*/
	background-color: #b4fabf;
}

.bullet-note:nth-of-type(2)
{
/*	background-color: #fd88f9;*/
	background-color: #fac7f9;
}

.bullet-note:nth-of-type(3)
{
/*	background-color: #a5cab3;*/
	background-color: #dddddd;
}

.message {
	/*height: var(--message-height);*/
	margin-top: calc(66% - var(--message-height) / 2);
	margin-bottom: calc(66% - var(--message-height) / 2);
}

.logo-container {
	position: relative;
	text-align: center;
}

.logo {
	background-color: #F2F2F2;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding-top: var(--logo-top-bottom-padding);
	padding-bottom: var(--logo-top-bottom-padding);
}

.logo img {
	height: 100px;
}


.question-card:not(:last-of-type) {
	margin-top: calc(100% - 64px / 2);
	margin-bottom: calc(100% - 64px / 2);
}

.question-card:last-of-type {
	margin-bottom: 0 !important;
}

.question-text {
	margin: 64px;
}

.question-card input[type=radio] {
	vertical-align: middle;
	height: var(--radio-button-size);
	width: var(--radio-button-size);
}

.question-card .answer:nth-of-type(1) input[type=radio] {
	background-color:  #6bf685;
}

.question-card .answer:nth-of-type(2) input[type=radio] {
	background-color: #88e09c
}

.question-card .answer:nth-of-type(3) input[type=radio] {
	background-color: #a5cab3;
}

.question-card .answer:nth-of-type(4) input[type=radio] {
	background-color: #c3b4cb;
}

.question-card .answer:nth-of-type(5) input[type=radio] {
	background-color: #e09ee2;
}

.question-card .answer:nth-of-type(6) input[type=radio] {
	background-color: #fd88f9;
}

.question-card fieldset {
	display: grid;
	column-gap: 4px;
	row-gap: 16px;
	grid-template-columns: auto auto auto auto auto auto;
	transition: all;
}

.question-card fieldset input {
	padding: 0 !important;
}

@media (max-width: 1024px) /* mobile */
{
	body {
		font-size: 12px !important;
	}
	
	.question-text {
		margin-left: 2% !important;
		margin-right: 2% !important;
	}
	
	.question-card fieldset {
		margin-left: 2%;
		margin-right: 2%;
	}
}

@media (min-width: 1025px) /* desktop */
{
	.question-card fieldset {
		margin-left: 20%;
		margin-right: 20%;
	}
}