@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap');



:root {
	--grey: #F1F0F6;
	--dark-grey: #8D8D8D;
	--light: #fff;
	--dark: #000;
	--green: #81D43A;
	--light-green: #E3FFCB;
	--blue: #1775F1;
	--light-blue: #D0E4FF;
	--dark-blue: #0C5FCD;
	--red: #FC3B56;
}

/* MAIN */
main {
	/*width: 100%;*/
	/*padding: 24px 20px 20px 20px;*/
}
main .info-data {
	/*margin-top: 6px;*/
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	grid-gap: 20px;
}
main .info-data .card.red {
	padding: 20px;
	border-radius: 10px;
	background: var(--light);
	border-top:3px solid #dc3545;
	/*box-shadow: 4px 4px 16px rgba(0, 0, 0, .05);*/
}
main .info-data .card.green {
	padding: 20px;
	border-radius: 10px;
	background: var(--light);
	border-top:3px solid #2eb85c;
	/*box-shadow: 4px 4px 16px rgba(0, 0, 0, .05);*/
}
main .info-data .card.blue {
	padding: 20px;
	border-radius: 10px;
	background: var(--light);
	border-top:3px solid #3399ff;
	/*box-shadow: 4px 4px 16px rgba(0, 0, 0, .05);*/
}
main .info-data .card.yellow {
	padding: 20px;
	border-radius: 10px;
	background: var(--light);
	border-top:3px solid #f9b115;
	/*box-shadow: 4px 4px 16px rgba(0, 0, 0, .05);*/
}
main .card .head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
main .card .head h2 {
	font-size: 24px;
	font-weight: 600;
}
main .card .head p {
	font-size: 14px;
}
main .card .head .icon {
	font-size: 50px;
	color: var(--green);
}
main .card .head .icon.down {
	color: var(--red);
}
main .card .progress {
	display: block;
	margin-top: 24px;
	height: 10px;
	width: 100%;
	border-radius: 10px;
	background: var(--grey);
	overflow-y: hidden;
	position: relative;
	margin-bottom: 4px;
}

main .card .label {
	font-size: 14px;
	font-weight: 700;
}
main .data {
	display: flex;

	margin-top: 20px;
	flex-wrap: wrap;
}
main .data .content-data {
	flex-grow: 1;
	flex-basis: 400px;
	padding: 20px;
	background: var(--light);
	border-radius: 10px;
	/*box-shadow: 4px 4px 16px rgba(0, 0, 0, .1);*/
}

