:root{
	--primary:#229cbc;
	--text:#1c2b33;
	--bg:#f7fbfd;
	--success:#2e7d32;
	--danger:#c62828;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:'Source Sans Pro',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;color:var(--text);background:var(--bg)}

h1,h2,h3{font-family:'Zilla Slab', Georgia, 'Times New Roman', serif}

.container{
	max-width:720px;
	margin:40px auto;
	padding:0 16px;
}

h1{margin:0 0 12px}
p{line-height:1.6;color:#4b5a63}

.btn-primary-large{
	display:inline-block;
	padding:14px 22px;
	background:var(--primary);
	color:#fff;
	border-radius:10px;
	text-decoration:none;
	font-weight:600;
	transition:filter .15s ease-in-out;
}
.btn-primary-large:hover{filter:brightness(.95)}

.propositions{display:grid;gap:10px;margin:16px 0}
.proposition-btn{
	padding:12px 14px;
	border-radius:10px;
	border:1px solid rgba(0,0,0,.08);
	background:#fff;
	cursor:pointer;
	text-align:left;
	transition:background .15s ease, transform .02s ease;
}
.proposition-btn:hover{background:#f4f7f9}
.proposition-btn:disabled{opacity:.8;cursor:not-allowed}

.correct{background:rgba(46,125,50,.1)!important;border-color:rgba(46,125,50,.4)!important;color:var(--success)!important}
.incorrect{background:rgba(198,40,40,.08)!important;border-color:rgba(198,40,40,.4)!important;color:var(--danger)!important}

.feedback{
	min-height:28px;
	margin-top:8px;
	padding:8px 10px;
	border-radius:8px;
	background:#fff;
	border:1px solid rgba(0,0,0,.06);
	color:#51626b;
}

.feedback.no-border{
	border: none;
	background: transparent;
	padding: 0;
}

#next-question-btn{
	margin-top:16px;
	padding:10px 14px;
	border-radius:10px;
	border:1px solid var(--primary);
	background:#fff;
	color:var(--primary);
	cursor:pointer;
}
#next-question-btn:hover{background:#e9f6fb}

hr{
	border: 0;
	border-top: 2px solid #229cbc !important;
	opacity: 1;
	margin-top: 0.75rem;
	margin-bottom: 0.75rem;
}
