body {
	font-family: "Open Sans", Arial, sans-serif;
	margin:0;
	display: table;
	width: 100%;
	height: 100%;
}

a { text-decoration: none; }
a:link { color: #000099; }
a:visited { color: #000099; }
a:active { color: #000099; }
a:hover { color: #e10000; }

.fullWidth {
	width: 100%;
}

.left {
	float: left;
	text-align: left;
}

.right {
	float: right;
	text-align: right;
}

.widgetGroupRow {
	height: auto;
	clear: both;
	display:inline-block;
}

.widgetGroupRow.widget {
	margin: 4px;
}

.widget {
	text-align: left;
	color:black;
	display:inline-block;
}

.widgetGroupColumn {
	display:inline-block;
}

.widgetGroupColumn .widget {
}


.widgetValue {
	text-align: center;
	width: 100%;
}

.widgetTitle {
	text-align: center;
	width: 100%;
	display:inline-block;
}

.widgetGroup {
	display:inline-block;
}

.roundBorder {
	border:1px solid gray;    
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
}

.circle {
    border:1px solid blue;    
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
	aspect-ratio: 1 / 1;
	height: 100%;
}

.circle .sizeMedium {
	min-height: 50px;
}

.center {
  margin-left: auto;
  margin-right: auto;
}

.centreContent {
	display: table;
	text-align: center;
} 
.centreContent div {
	vertical-align: middle;
	display:table-cell;
} 
.centreContent span {
	vertical-align: middle;
	display:table-cell;
} 

.sizeSmall {
	font-size: 16px;
}

.sizeMedium {
	font-size: 32px;
}

.subLabel {
	font-size: .8em;
}

.showPhone {
	display: none;
}

.month {
	margin: auto;
	border-collapse: collapse;
	width: 650px;
}

.monthTitle {
	text-align: center;
	height: auto;
}

.monthDay {
	width: 14.28%;
	height: 50px;
	vertical-align: top;
	border: 1px solid #888;
	margin: 1px;  
}

.monthDay.outside {
	background-color: #eee;
}

.monthDayName {
	text-align: center;
	height: auto;
}

.monthDate {
	text-align: right;
}


@media only screen and (max-width : 450px) {

 	.showPhone {
		display: block;
	}
}

@media (prefers-color-scheme: dark) {
	body {
		background-color: #222;
		color:#aaa;
	}

	a:link { color: #9999ee; }
	a:visited { color: #9999ee; }
	a:active { color: #9999ee; }
	a:hover { color: #9999ee; }
}