/**
 * Regole CSS per i questionari sul Rischio Aria/Acqua
 * 
*/
:root {
	--green: #94C356;
	--blue: #1FBCFF;
	--gd: #7aaa3e;
	--bg: #f4f7fa;
	--white: #ffffff;
	--title: #001D29;
	--text: #001D29D1;
	--light: #001D2991;
	--border: #dde6ed;
}
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
.pbar {
	height: 4px;
	background: #eef2f6;
	border-radius: 4px;
	margin-bottom: 28px;
	overflow: hidden;
}
.pfill {
	height:4px;
	background: linear-gradient(90deg,var(--green),var(--blue));
	transition: width .4s;
	border-radius: 4px;
	min-width: 0;
}
.cont-result {
	text-align: center;
	display: block;
	border: 2px solid #009FE336;
	padding: 30px 15px;
	margin-bottom: 20px;
}
.ibox{background:#f0faff;border-left:3px solid var(--blue);padding:14px 18px;border-radius:0 8px 8px 0;margin-top:22px}
.qtext {
	color: var(--title);
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.5em;
	margin-bottom: 20px
}
.qsub {
	display: block;
	font-size: 1rem;
	color: var(--light);
	font-weight: 400;
	margin-top: 5px;
}
.opts {
	display: flex;
	flex-direction: column;
	gap: 9px;
}
.opt {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 13px 18px;
	border: 2px solid var(--border);
	border-radius: 8px;
	cursor: pointer;
	transition: all .15s;
	user-select: none;
}
.opt:hover {
	border-color: var(--blue);
	background: #f0faff;
}
.opt.sel {
	border-color: var(--green);
	background: #f3fbea;
}
.mk {
	width: 20px;
	height: 20px;
	border: 2px solid var(--border);
	border-radius: 50%;
	flex-shrink: 0;
	margin-top: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .15s;
}
.opt.sel .mk {
	background: var(--green); border-color: var(--green);
}
.mk-dot {
	width: 8px;
	height: 8px;
	background: #ffffff;
	border-radius: 50%;
	display: none;
}
.opt.sel .mk-dot {
	display: block;
}
.cbx .mk {
	border-radius: 5px;
}
.ot {
	font-size: 1rem;
	line-height: 1.5;
	color: var(--text);
}
.nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 30px;
	gap: 15px;
}
.err {
	border-color: #e84040;
}
.ferr {
	color: #e84040;
	font-size: 0.8rem;
	margin-top: 4px;
	display: none;
}
.rbadge {
	display: inline-block;
	padding: 8px 26px;
	border-radius: 40px;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-bottom: 15px;
}
.rbadge.basso {
	background: #eaf7d5;
	color: #3d6b10;
}
.rbadge.medio {
	background: #fff3e0;
	color: #a05500;
}
.rbadge.alto {
	background: #feebeb;
	color: #b30000;
}
.result-title {
	font-size: 1.3rem;
	font-weight: 600;
	color: #152535;
	margin-bottom: 0px;
	line-height: 1.3em;
	text-align: center;
}
.result-section {
	margin-bottom: 20px;
}
.result-section h3 {}
.result-section p {}
.result-section ul {
	padding-left: 18px;
	margin-bottom: 8px;
}
.result-section ul li {}
.cont_btn_arg {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-between;
	gap: 15px;
}
.bp,
.btn.bp,
.bs,
.btn.bs,
.ctalink {
	width: auto;
	max-width: unset;
	height: unset;
	font-size: 0.9rem;
	line-height: 1em;
	padding: 13px 30px;
	margin-right: unset;
	margin-left: unset;
	color: var(--text-second-dark-color);
	background-color: var(--second-color);
	border: 2px solid var(--second-color);
	text-transform: uppercase;
}
.btn.bs {
	color: var(--grigio-s);
	background-color: var(--bianco);
	border-color: var(--border);
}
.bp:hover,
.btn.bp:hover,
.ctalink:hover {
	color: var(--text-second-dark-color);
	background-color: var(--second-color-dark);
	border-color: var(--second-color-dark);
}
.bs:hover,
.btn.bs:hover {
	color: var(--nero);
	background-color: var(--grigio-c);
	border-color: var(--nero);
}
.bp:disabled,
.btn.bp:disabled {
	opacity: .35;
	cursor: default;
	transform: none;
	color: var(--text-second-dark-color);
	background-color: var(--second-color);
	border-color: var(--second-color);
}
.bp:focus-visible,
.btn.bp:focus-visible,
.bs:focus-visible,
.btn.bs:focus-visible,
.ctalink:focus-visible {
	outline: 3px solid var(--second-color-dark);
}
.divider{
	border: none;
	border-top: 1px solid var(--border);
	margin: 20px 0;
}


/*
*** Inizio Media Queries
*/
/* Media queries dispositivi > Phablet */
@media ( min-width: 576px ) {}

/* Media queries dispositivi > Tablet Verticale */
@media screen and ( min-width: 768px ) {}

/* Media queries dispositivi > Tablet Orizzontale/Laptop */
@media screen and ( min-width: 992px ) {}

/* Media queries dispositivi > Desktop */
@media screen and ( min-width: 1200px ) {}

/* Media queries dispositivi > Desktop (extra large) */
@media screen and ( min-width: 1400px ) {}

/* Media queries dispositivi > Desktop (extra extra large) */
@media screen and ( min-width: 1600px ) {}
/*
*** Fine Media Queries
*/