#parking-widget,
#parking-lots-widget{
	padding-left:.9375rem;
	padding-right:.9375rem
}

#parking-widget h3,
#parking-lots-widget h3 {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#parking-widget .donut,
#parking-lots-widget .donut {
	display:flex;
	align-items:center;
	justify-content:center;
	position:relative;
	aspect-ratio:1/1;
	border-radius:50%;
	background:conic-gradient(#DDD 0 180deg, #DDD 0deg 0deg);
	margin:.5rem
}
@media(min-width: 1025px){
	#parking-widget .donut,
	#parking-lots-widget .donut {
		margin:.9rem
	}
}
#parking-widget .donut:after,
#parking-lots-widget .donut:after{
	position:absolute;
	content:" ";
	width:80%;
	height:80%;
	border-radius:50%;
	background:#fff;
	z-index:0
}
#parking-widget .donut .donut-content,
#parking-lots-widget .donut .donut-content{
	width:80%;
	height:80%;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	text-align:center;
	z-index:1
}
#parking-widget .donut .donut-content strong,
#parking-lots-widget .donut .donut-content strong {
	font-size:1.5rem;
	font-weight:bold;
	line-height:normal
}
#parking-widget .donut .donut-content span,
#parking-lots-widget .donut .donut-content span {
	font-size:.8em;
	line-height:normal;
	max-width:115px
}

#parking-lots-widget .parking-widget-data {
    display:flex;
    flex-wrap: wrap;
}

@media(min-width: 641px)and (max-width: 1024px){
	#parking-widget .donut .donut-content span,
	#parking-lots-widget .donut .donut-content span {
		font-size:.7em
	}
}
@media(min-width: 1025px){
	#parking-widget .donut .donut-content span,
	#parking-lots-widget .donut .donut-content span{
		font-size:.8em
	}
	
	#parking-lots-widget .parking-widget-data {
        justify-content: center;
	}
}

}
@media only screen and (min-width: 1441px){
	#parking-widget .donut .donut-content span,
	#parking-lots-widget .donut .donut-content span{
		font-size:.9em
	}
}
