/* Apply css properties to h1 element */
h1{
	text-align: left;
}

/* Create a container using css properties */
.container {
	
	position: relative;
	text-align: left;

}

/* Apply css properties to ui-widgets class */
.ui-widgets {
	position: relative;
	display: inline-block;
	width: 10rem;
	height: 10rem;
	border-radius: 9rem;
	margin:1.5rem;
	border: 1.2rem solid palegreen;
	box-shadow: inset 0 0 7px grey;
	border-left-color: palegreen;
	border-top-color:chartreuse ;
    	
    
	border-right-color: darkgreen;
	border-bottom-color: white ;
	text-align: center;
	box-sizing: border-box;
}

/* Apply css properties to the second
	child of ui-widgets class */
.ui-widgets:nth-child(2) {
	border-top-color:chartreuse ;
	border-right-color:blue ;
	border-left-color: palegreen;
	border-bottom-color: white;
}

/* Apply css properties to ui-widgets
class and ui-values class */
.ui-widgets .ui-values {
	top: 40px;
	position: relative;
	left: 7px;
	right: 0;
	font-weight: 700;
	font-size: 2.0rem;
}

/* Apply css properties to ui-widgets
class and ui-labels class */
.ui-widgets .ui-labels {
	left: 0;
	bottom: -16px;
	text-shadow: 0 0 4px grey;
	color:black;
	position: absolute;
	width: 100%;
	font-size: 16px;
}