.ui.menu {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	margin: 1rem 0;
	background: #FFF;
	font-weight: 400;
	border: 1px solid rgba(34,36,38,.15);
	box-shadow: 0 1px 2px 0 rgba(34,36,38,.15);
	border-radius: .28571429rem;
	min-height: 2.85714286em
}

	.ui.menu:after {
		content: '';
		display: block;
		height: 0;
		clear: both;
		visibility: hidden
	}

	.ui.menu:first-child {
		margin-top: 0
	}

	.ui.menu:last-child {
		margin-bottom: 0
	}

	.ui.menu .menu {
		margin: 0
	}

	.ui.menu:not(.vertical) > .menu {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex
	}

	.ui.menu:not(.vertical) .item {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center
	}

	.ui.menu .item {
		position: relative;
		vertical-align: middle;
		line-height: 1;
		text-decoration: none;
		-webkit-tap-highlight-color: transparent;
		-webkit-box-flex: 0;
		-webkit-flex: 0 0 auto;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background: 0 0;
		padding: .92857143em 1.14285714em;
		text-transform: none;
		color: rgba(0,0,0,.87);
		font-weight: 400;
		-webkit-transition: background .1s ease,box-shadow .1s ease,color .1s ease;
		transition: background .1s ease,box-shadow .1s ease,color .1s ease
	}

	.ui.menu > .item:first-child {
		border-radius: .28571429rem 0 0 .28571429rem
	}

	.ui.menu .item:before {
		position: absolute;
		content: '';
		top: 0;
		right: 0;
		height: 100%;
		width: 1px;
		background: rgba(34,36,38,.1)
	}

	.ui.menu .item > a:not(.ui), .ui.menu .item > p:only-child, .ui.menu .text.item > * {
		-webkit-user-select: text;
		-moz-user-select: text;
		-ms-user-select: text;
		user-select: text;
		line-height: 1.3
	}

	.ui.menu .item > p:first-child {
		margin-top: 0
	}

	.ui.menu .item > p:last-child {
		margin-bottom: 0
	}

	.ui.menu .item > i.icon {
		opacity: .9;
		float: none;
		margin: 0 .35714286em 0 0
	}

	.ui.menu:not(.vertical) .item > .button {
		position: relative;
		top: 0;
		margin: -.5em 0;
		padding-bottom: .78571429em;
		padding-top: .78571429em;
		font-size: 1em
	}

	.ui.menu > .container, .ui.menu > .grid {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: inherit;
		-webkit-align-items: inherit;
		-ms-flex-align: inherit;
		align-items: inherit;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-webkit-flex-direction: inherit;
		-ms-flex-direction: inherit;
		flex-direction: inherit
	}

	.ui.menu .item > .input {
		width: 100%
	}

	.ui.menu:not(.vertical) .item > .input {
		position: relative;
		top: 0;
		margin: -.5em 0
	}

	.ui.menu .item > .input input {
		font-size: 1em;
		padding-top: .57142857em;
		padding-bottom: .57142857em
	}

	.ui.menu .header.item, .ui.vertical.menu .header.item {
		margin: 0;
		background: 0 0;
		text-transform: normal;
		font-weight: 700
	}

.ui.vertical.menu .item > .header:not(.ui) {
	margin: 0 0 .5em;
	font-size: 1em;
	font-weight: 700
}

.ui.menu .ui.popup {
	display: none
}

.ui.menu .ui.visible.popup {
	display: block
}

.ui.menu .item > i.dropdown.icon {
	padding: 0;
	float: right;
	margin: 0 0 0 1em
}

.ui.menu .dropdown.item .menu {
	left: 0;
	min-width: calc(100% - 1px);
	border-radius: 0 0 .28571429rem .28571429rem;
	background: #FFF;
	margin: 0;
	box-shadow: 0 1px 3px 0 rgba(0,0,0,.08);
	-webkit-box-orient: vertical !important;
	-webkit-box-direction: normal !important;
	-webkit-flex-direction: column !important;
	-ms-flex-direction: column !important;
	flex-direction: column !important
}

.ui.menu .ui.dropdown .menu > .item {
	margin: 0;
	text-align: left;
	font-size: 1em !important;
	padding: .78571429em 1.14285714em !important;
	background: 0 0 !important;
	color: rgba(0,0,0,.87) !important;
	text-transform: none !important;
	font-weight: 400 !important;
	box-shadow: none !important;
	-webkit-transition: none !important;
	transition: none !important
}

	.ui.menu .ui.dropdown .menu > .item:hover, .ui.menu .ui.dropdown .menu > .selected.item {
		background: rgba(0,0,0,.05) !important;
		color: rgba(0,0,0,.95) !important
	}

.ui.menu .ui.dropdown .menu > .active.item {
	background: rgba(0,0,0,.03) !important;
	font-weight: 700 !important;
	color: rgba(0,0,0,.95) !important
}

.ui.menu .ui.dropdown.item .menu .item:not(.filtered) {
	display: block
}

.ui.menu .ui.dropdown .menu > .item .icon:not(.dropdown) {
	display: inline-block;
	font-size: 1em !important;
	float: none;
	margin: 0 .75em 0 0
}

.ui.secondary.menu .dropdown.item > .menu, .ui.text.menu .dropdown.item > .menu {
	border-radius: .28571429rem;
	margin-top: .35714286em
}

.ui.menu .pointing.dropdown.item .menu {
	margin-top: .75em
}

.ui.inverted.menu .search.dropdown.item > .search, .ui.inverted.menu .search.dropdown.item > .text {
	color: rgba(255,255,255,.9)
}

.ui.vertical.menu .dropdown.item > .icon {
	float: right;
	content: "\f0da";
	margin-left: 1em
}

.ui.vertical.menu .dropdown.item .menu {
	top: 0 !important;
	left: 100%;
	min-width: 0;
	margin: 0;
	box-shadow: 0 1px 3px 0 rgba(0,0,0,.08);
	border-radius: 0 .28571429rem .28571429rem
}

.ui.vertical.menu .active.dropdown.item {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0
}

.ui.vertical.menu .dropdown.active.item {
	box-shadow: none
}

.ui.item.menu .dropdown .menu .item {
	width: 100%
}

.ui.menu .item > .label {
	background: #999;
	color: #FFF;
	margin-left: 1em;
	padding: .3em .78571429em
}

.ui.vertical.menu .item > .label {
	background: #999;
	color: #FFF;
	margin-top: -.15em;
	margin-bottom: -.15em;
	padding: .3em .78571429em;
	float: right;
	text-align: center
}

.ui.menu .item > .floating.label {
	padding: .3em .78571429em
}

.ui.menu .item > img:not(.ui) {
	display: inline-block;
	vertical-align: middle;
	margin: -.3em 0;
	width: 2.5em
}

.ui.vertical.menu .item > img:not(.ui):only-child {
	display: block;
	max-width: 100%;
	width: auto
}

.ui.vertical.sidebar.menu > .item:first-child:before {
	display: block !important
}

.ui.vertical.sidebar.menu > .item::before {
	top: auto;
	bottom: 0
}

@media only screen and (max-width: 767px) {
	.ui.menu > .ui.container {
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important
	}
}

@media only screen and (min-width: 768px) {
	.ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .item:not(.right):not(.borderless):first-child {
		border-left: 1px solid rgba(34,36,38,.1)
	}
}

.ui.link.menu .item:hover, .ui.menu .dropdown.item:hover, .ui.menu .link.item:hover, .ui.menu a.item:hover {
	cursor: pointer;
	background: rgba(0,0,0,.03);
	color: rgba(0,0,0,.95)
}

.ui.link.menu .item:active, .ui.menu .link.item:active, .ui.menu a.item:active {
	background: rgba(0,0,0,.03);
	color: rgba(0,0,0,.95)
}

.ui.menu .active.item {
	background: rgba(0,0,0,.05);
	color: rgba(0,0,0,.95);
	font-weight: 400;
	box-shadow: none
}

	.ui.menu .active.item > i.icon {
		opacity: 1
	}

	.ui.menu .active.item:hover, .ui.vertical.menu .active.item:hover {
		background-color: rgba(0,0,0,.05);
		color: rgba(0,0,0,.95)
	}

.ui.menu .item.disabled, .ui.menu .item.disabled:hover {
	cursor: default;
	background-color: transparent !important;
	color: rgba(40,40,40,.3)
}

.ui.menu:not(.vertical) .left.item, .ui.menu:not(.vertical) .left.menu {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	margin-right: auto !important
}

.ui.menu:not(.vertical) .right.item, .ui.menu:not(.vertical) .right.menu {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	margin-left: auto !important
}

.ui.menu .right.item::before, .ui.menu .right.menu > .item::before {
	right: auto;
	left: 0
}

.ui.vertical.menu {
	display: block;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	background: #FFF;
	box-shadow: 0 1px 2px 0 rgba(34,36,38,.15)
}

	.ui.vertical.menu .item {
		display: block;
		background: 0 0;
		border-top: none;
		border-right: none
	}

	.ui.vertical.menu > .item:first-child {
		border-radius: .28571429rem .28571429rem 0 0
	}

	.ui.vertical.menu > .item:last-child {
		border-radius: 0 0 .28571429rem .28571429rem
	}

	.ui.vertical.menu .item > i.icon {
		width: 1.18em;
		float: right;
		margin: 0 0 0 .5em
	}

	.ui.vertical.menu .item > .label + i.icon {
		float: none;
		margin: 0 .5em 0 0
	}

	.ui.vertical.menu .item:before {
		position: absolute;
		content: '';
		top: 0;
		left: 0;
		width: 100%;
		height: 1px;
		background: rgba(34,36,38,.1)
	}

	.ui.vertical.menu .item:first-child:before {
		display: none !important
	}

	.ui.vertical.menu .item > .menu {
		margin: .5em -1.14285714em 0
	}

	.ui.vertical.menu .menu .item {
		background: 0 0;
		padding: .5em 1.33333333em;
		font-size: .85714286em;
		color: rgba(0,0,0,.5)
	}

	.ui.vertical.menu .item .menu .link.item:hover, .ui.vertical.menu .item .menu a.item:hover {
		color: rgba(0,0,0,.85)
	}

	.ui.vertical.menu .menu .item:before {
		display: none
	}

	.ui.vertical.menu .active.item {
		background: rgba(0,0,0,.05);
		border-radius: 0;
		box-shadow: none
	}

	.ui.vertical.menu > .active.item:first-child {
		border-radius: .28571429rem .28571429rem 0 0
	}

	.ui.vertical.menu > .active.item:last-child {
		border-radius: 0 0 .28571429rem .28571429rem
	}

	.ui.vertical.menu > .active.item:only-child {
		border-radius: .28571429rem
	}

	.ui.vertical.menu .active.item .menu .active.item {
		border-left: none
	}

	.ui.vertical.menu .item .menu .active.item {
		background-color: transparent;
		font-weight: 700;
		color: rgba(0,0,0,.95)
	}

.ui.tabular.menu {
	border-radius: 0;
	box-shadow: none !important;
	border: none;
	background: none;
	border-bottom: 1px solid #D4D4D5
}

.ui.tabular.fluid.menu {
	width: calc(100% + 2px) !important
}

.ui.tabular.menu .item {
	background: 0 0;
	border-bottom: none;
	border-left: 1px solid transparent;
	border-right: 1px solid transparent;
	border-top: 2px solid transparent;
	padding: .92857143em 1.42857143em;
	color: rgba(0,0,0,.87)
}

	.ui.tabular.menu .item:before {
		display: none
	}

	.ui.tabular.menu .item:hover {
		background-color: transparent;
		color: rgba(0,0,0,.8)
	}

.ui.tabular.menu .active.item {
	background: #FFF;
	color: rgba(0,0,0,.95);
	border-top-width: 1px;
	border-color: #D4D4D5;
	font-weight: 700;
	margin-bottom: -1px;
	box-shadow: none;
	border-radius: .28571429rem .28571429rem 0 0 !important
}

.ui.tabular.menu + .attached:not(.top).segment, .ui.tabular.menu + .attached:not(.top).segment + .attached:not(.top).segment {
	border-top: none;
	margin-left: 0;
	margin-top: 0;
	margin-right: 0;
	width: 100%
}

.top.attached.segment + .ui.bottom.tabular.menu {
	position: relative;
	width: calc(100% + 2px);
	left: -1px
}

.ui.bottom.tabular.menu {
	background: none;
	border-radius: 0;
	box-shadow: none !important;
	border-bottom: none;
	border-top: 1px solid #D4D4D5
}

	.ui.bottom.tabular.menu .item {
		background: 0 0;
		border-left: 1px solid transparent;
		border-right: 1px solid transparent;
		border-bottom: 1px solid transparent;
		border-top: none
	}

	.ui.bottom.tabular.menu .active.item {
		background: #FFF;
		color: rgba(0,0,0,.95);
		border-color: #D4D4D5;
		margin: -1px 0 0;
		border-radius: 0 0 .28571429rem .28571429rem !important
	}

.ui.vertical.tabular.menu {
	background: none;
	border-radius: 0;
	box-shadow: none !important;
	border-bottom: none;
	border-right: 1px solid #D4D4D5
}

	.ui.vertical.tabular.menu .item {
		background: 0 0;
		border-left: 1px solid transparent;
		border-bottom: 1px solid transparent;
		border-top: 1px solid transparent;
		border-right: none
	}

	.ui.vertical.tabular.menu .active.item {
		background: #FFF;
		color: rgba(0,0,0,.95);
		border-color: #D4D4D5;
		margin: 0 -1px 0 0;
		border-radius: .28571429rem 0 0 .28571429rem !important
	}

.ui.vertical.right.tabular.menu {
	background: none;
	border-radius: 0;
	box-shadow: none !important;
	border-bottom: none;
	border-right: none;
	border-left: 1px solid #D4D4D5
}

	.ui.vertical.right.tabular.menu .item {
		background: 0 0;
		border-right: 1px solid transparent;
		border-bottom: 1px solid transparent;
		border-top: 1px solid transparent;
		border-left: none
	}

	.ui.vertical.right.tabular.menu .active.item {
		background: #FFF;
		color: rgba(0,0,0,.95);
		border-color: #D4D4D5;
		margin: 0 0 0 -1px;
		border-radius: 0 .28571429rem .28571429rem 0 !important
	}

.ui.tabular.menu .active.dropdown.item {
	margin-bottom: 0;
	border-left: 1px solid transparent;
	border-right: 1px solid transparent;
	border-top: 2px solid transparent;
	border-bottom: none
}

.ui.pagination.menu {
	margin: 0;
	display: -webkit-inline-box;
	display: -webkit-inline-flex;
	display: -ms-inline-flexbox;
	display: inline-flex;
	vertical-align: middle
}

	.ui.pagination.menu .item:last-child {
		border-radius: 0 .28571429rem .28571429rem 0
	}

		.ui.pagination.menu .item:last-child:before {
			display: none
		}

	.ui.pagination.menu .item {
		min-width: 3em;
		text-align: center
	}

	.ui.pagination.menu .icon.item i.icon {
		vertical-align: top
	}

	.ui.pagination.menu .active.item {
		border-top: none;
		padding-top: .92857143em;
		background-color: rgba(0,0,0,.05);
		color: rgba(0,0,0,.95);
		box-shadow: none
	}

.ui.secondary.menu {
	background: 0 0;
	margin-left: -.35714286em;
	margin-right: -.35714286em;
	border-radius: 0;
	border: none;
	box-shadow: none
}

	.ui.secondary.menu .item {
		-webkit-align-self: center;
		-ms-flex-item-align: center;
		align-self: center;
		box-shadow: none;
		border: none;
		padding: .78571429em .92857143em;
		margin: 0 .35714286em;
		background: 0 0;
		-webkit-transition: color .1s ease;
		transition: color .1s ease;
		border-radius: .28571429rem
	}

		.ui.secondary.menu .item:before {
			display: none !important
		}

	.ui.secondary.menu .header.item {
		border-radius: 0;
		border-right: none;
		background: none
	}

	.ui.secondary.menu .item > img:not(.ui) {
		margin: 0
	}

	.ui.secondary.menu .dropdown.item:hover, .ui.secondary.menu .link.item:hover, .ui.secondary.menu a.item:hover {
		background: rgba(0,0,0,.05);
		color: rgba(0,0,0,.95)
	}

	.ui.secondary.menu .active.item {
		box-shadow: none;
		background: rgba(0,0,0,.05);
		color: rgba(0,0,0,.95);
		border-radius: .28571429rem
	}

		.ui.secondary.menu .active.item:hover {
			box-shadow: none;
			background: rgba(0,0,0,.05);
			color: rgba(0,0,0,.95)
		}

.ui.secondary.inverted.menu .link.item, .ui.secondary.inverted.menu a.item {
	color: rgba(255,255,255,.7) !important
}

	.ui.secondary.inverted.menu .dropdown.item:hover, .ui.secondary.inverted.menu .link.item:hover, .ui.secondary.inverted.menu a.item:hover {
		background: rgba(255,255,255,.08);
		color: #fff !important
	}

.ui.secondary.inverted.menu .active.item {
	background: rgba(255,255,255,.15);
	color: #fff !important
}

.ui.secondary.item.menu {
	margin-left: 0;
	margin-right: 0
}

	.ui.secondary.item.menu .item:last-child {
		margin-right: 0
	}

.ui.secondary.attached.menu {
	box-shadow: none
}

.ui.vertical.secondary.menu .item:not(.dropdown) > .menu {
	margin: 0 -.92857143em
}

	.ui.vertical.secondary.menu .item:not(.dropdown) > .menu > .item {
		margin: 0;
		padding: .5em 1.33333333em
	}

.ui.secondary.vertical.menu > .item {
	border: none;
	margin: 0 0 .35714286em;
	border-radius: .28571429rem !important
}

.ui.secondary.vertical.menu > .header.item {
	border-radius: 0
}

.ui.secondary.inverted.menu, .ui.vertical.secondary.menu .item > .menu .item {
	background-color: transparent
}

.ui.secondary.pointing.menu {
	margin-left: 0;
	margin-right: 0;
	border-bottom: 2px solid rgba(34,36,38,.15)
}

	.ui.secondary.pointing.menu .item {
		border-bottom-color: transparent;
		border-bottom-style: solid;
		border-radius: 0;
		-webkit-align-self: flex-end;
		-ms-flex-item-align: end;
		align-self: flex-end;
		margin: 0 0 -2px;
		padding: .85714286em 1.14285714em;
		border-bottom-width: 2px;
		-webkit-transition: color .1s ease;
		transition: color .1s ease
	}

	.ui.secondary.pointing.menu .header.item {
		color: rgba(0,0,0,.85) !important
	}

	.ui.secondary.pointing.menu .text.item {
		box-shadow: none !important
	}

	.ui.secondary.pointing.menu .item:after {
		display: none
	}

	.ui.secondary.pointing.menu .dropdown.item:hover, .ui.secondary.pointing.menu .link.item:hover, .ui.secondary.pointing.menu a.item:hover {
		background-color: transparent;
		color: rgba(0,0,0,.87)
	}

	.ui.secondary.pointing.menu .dropdown.item:active, .ui.secondary.pointing.menu .link.item:active, .ui.secondary.pointing.menu a.item:active {
		background-color: transparent;
		border-color: rgba(34,36,38,.15)
	}

	.ui.secondary.pointing.menu .active.item {
		background-color: transparent;
		box-shadow: none;
		border-color: #1B1C1D;
		font-weight: 700;
		color: rgba(0,0,0,.95)
	}

		.ui.secondary.pointing.menu .active.item:hover {
			border-color: #1B1C1D;
			color: rgba(0,0,0,.95)
		}

	.ui.secondary.pointing.menu .active.dropdown.item {
		border-color: transparent
	}

.ui.secondary.vertical.pointing.menu {
	border-bottom-width: 0;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: rgba(34,36,38,.15)
}

	.ui.secondary.vertical.pointing.menu .item {
		border-bottom: none;
		border-right-style: solid;
		border-right-color: transparent;
		border-radius: 0 !important;
		margin: 0 -2px 0 0;
		border-right-width: 2px
	}

	.ui.secondary.vertical.pointing.menu .active.item {
		border-color: #1B1C1D
	}

.ui.secondary.inverted.pointing.menu {
	border-width: 2px;
	border-color: rgba(34,36,38,.15)
}

	.ui.secondary.inverted.pointing.menu .item {
		color: rgba(255,255,255,.9)
	}

	.ui.secondary.inverted.pointing.menu .header.item {
		color: #FFF !important
	}

	.ui.secondary.inverted.pointing.menu .link.item:hover, .ui.secondary.inverted.pointing.menu a.item:hover {
		color: rgba(0,0,0,.95)
	}

	.ui.secondary.inverted.pointing.menu .active.item {
		border-color: #FFF;
		color: #fff
	}

.ui.text.menu {
	background: none;
	border-radius: 0;
	box-shadow: none;
	border: none;
	margin: 1em -.5em
}

	.ui.text.menu .item {
		border-radius: 0;
		box-shadow: none;
		-webkit-align-self: center;
		-ms-flex-item-align: center;
		align-self: center;
		margin: 0;
		padding: .35714286em .5em;
		font-weight: 400;
		color: rgba(0,0,0,.6);
		-webkit-transition: opacity .1s ease;
		transition: opacity .1s ease
	}

		.ui.text.menu .item:before, .ui.text.menu .menu .item:before {
			display: none !important
		}

	.ui.text.menu .header.item {
		background-color: transparent;
		opacity: 1;
		color: rgba(0,0,0,.85);
		font-size: .92857143em;
		text-transform: uppercase;
		font-weight: 700
	}

	.ui.text.item.menu .item, .ui.text.menu .item > img:not(.ui) {
		margin: 0
	}

.ui.vertical.text.menu {
	margin: 1em 0
}

	.ui.vertical.text.menu:first-child {
		margin-top: 0
	}

	.ui.vertical.text.menu:last-child {
		margin-bottom: 0
	}

	.ui.vertical.text.menu .item {
		margin: .57142857em 0;
		padding-left: 0;
		padding-right: 0
	}

		.ui.vertical.text.menu .item > i.icon {
			float: none;
			margin: 0 .35714286em 0 0
		}

	.ui.vertical.text.menu .header.item {
		margin: .57142857em 0 .71428571em
	}

	.ui.vertical.text.menu .item:not(.dropdown) > .menu {
		margin: 0
	}

		.ui.vertical.text.menu .item:not(.dropdown) > .menu > .item {
			margin: 0;
			padding: .5em 0
		}

.ui.text.menu .item:hover {
	opacity: 1;
	background-color: transparent
}

.ui.text.menu .active.item {
	background-color: transparent;
	border: none;
	box-shadow: none;
	font-weight: 400;
	color: rgba(0,0,0,.95)
}

	.ui.text.menu .active.item:hover {
		background-color: transparent
	}

.ui.text.attached.menu, .ui.text.pointing.menu .active.item:after {
	box-shadow: none
}

.ui.inverted.text.menu, .ui.inverted.text.menu .active.item, .ui.inverted.text.menu .item, .ui.inverted.text.menu .item:hover {
	background-color: transparent !important
}

.ui.fluid.text.menu {
	margin-left: 0;
	margin-right: 0
}

.ui.vertical.icon.menu {
	display: inline-block;
	width: auto
}

.ui.icon.menu .item {
	height: auto;
	text-align: center;
	color: #1B1C1D
}

	.ui.icon.menu .item > .icon:not(.dropdown) {
		margin: 0;
		opacity: 1
	}

.ui.icon.menu .icon:before {
	opacity: 1
}

.ui.menu .icon.item > .icon {
	width: auto;
	margin: 0 auto
}

.ui.vertical.icon.menu .item > .icon:not(.dropdown) {
	display: block;
	opacity: 1;
	margin: 0 auto;
	float: none
}

.ui.inverted.icon.menu .item {
	color: #FFF
}

.ui.labeled.icon.menu {
	text-align: center
}

	.ui.labeled.icon.menu .item {
		min-width: 6em;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column
	}

		.ui.labeled.icon.menu .item > .icon:not(.dropdown) {
			height: 1em;
			display: block;
			font-size: 1.71428571em !important;
			margin: 0 auto .5rem !important
		}

.ui.fluid.labeled.icon.menu > .item {
	min-width: 0
}

@media only screen and (max-width: 767px) {
	.ui.stackable.menu {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column
	}

		.ui.stackable.menu .item {
			width: 100% !important
		}

			.ui.stackable.menu .item:before {
				position: absolute;
				content: '';
				top: auto;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 1px;
				background: rgba(34,36,38,.1)
			}

		.ui.stackable.menu .left.item, .ui.stackable.menu .left.menu {
			margin-right: 0 !important
		}

		.ui.stackable.menu .right.item, .ui.stackable.menu .right.menu {
			margin-left: 0 !important
		}
}

.ui.menu .red.active.item, .ui.red.menu .active.item {
	border-color: #DB2828 !important;
	color: #DB2828 !important
}

.ui.menu .orange.active.item, .ui.orange.menu .active.item {
	border-color: #F2711C !important;
	color: #F2711C !important
}

.ui.menu .yellow.active.item, .ui.yellow.menu .active.item {
	border-color: #FBBD08 !important;
	color: #FBBD08 !important
}

.ui.menu .olive.active.item, .ui.olive.menu .active.item {
	border-color: #B5CC18 !important;
	color: #B5CC18 !important
}

.ui.green.menu .active.item, .ui.menu .green.active.item {
	border-color: #21BA45 !important;
	color: #21BA45 !important
}

.ui.menu .teal.active.item, .ui.teal.menu .active.item {
	border-color: #00B5AD !important;
	color: #00B5AD !important
}

.ui.blue.menu .active.item, .ui.menu .blue.active.item {
	border-color: #2185D0 !important;
	color: #2185D0 !important
}

.ui.menu .violet.active.item, .ui.violet.menu .active.item {
	border-color: #6435C9 !important;
	color: #6435C9 !important
}

.ui.menu .purple.active.item, .ui.purple.menu .active.item {
	border-color: #A333C8 !important;
	color: #A333C8 !important
}

.ui.menu .pink.active.item, .ui.pink.menu .active.item {
	border-color: #E03997 !important;
	color: #E03997 !important
}

.ui.brown.menu .active.item, .ui.menu .brown.active.item {
	border-color: #A5673F !important;
	color: #A5673F !important
}

.ui.grey.menu .active.item, .ui.menu .grey.active.item {
	border-color: #767676 !important;
	color: #767676 !important
}

.ui.inverted.menu {
	border: 0 solid transparent;
	background: #1B1C1D;
	box-shadow: none
}

	.ui.inverted.menu .item, .ui.inverted.menu .item > a:not(.ui) {
		background: 0 0;
		color: rgba(255,255,255,.9)
	}

		.ui.inverted.menu .item.menu {
			background: 0 0
		}

		.ui.inverted.menu .item:before, .ui.vertical.inverted.menu .item:before {
			background: rgba(255,255,255,.08)
		}

.ui.vertical.inverted.menu .menu .item, .ui.vertical.inverted.menu .menu .item a:not(.ui) {
	color: rgba(255,255,255,.5)
}

.ui.inverted.menu .header.item {
	margin: 0;
	background: 0 0;
	box-shadow: none
}

.ui.inverted.menu .item.disabled, .ui.inverted.menu .item.disabled:hover {
	color: rgba(225,225,225,.3)
}

.ui.inverted.menu .dropdown.item:hover, .ui.inverted.menu .link.item:hover, .ui.inverted.menu a.item:hover, .ui.link.inverted.menu .item:hover {
	background: rgba(255,255,255,.08);
	color: #fff
}

.ui.vertical.inverted.menu .item .menu .link.item:hover, .ui.vertical.inverted.menu .item .menu a.item:hover {
	background: 0 0;
	color: #fff
}

.ui.inverted.menu .link.item:active, .ui.inverted.menu a.item:active {
	background: rgba(255,255,255,.08);
	color: #fff
}

.ui.inverted.menu .active.item {
	background: rgba(255,255,255,.15);
	color: #fff !important
}

.ui.inverted.vertical.menu .item .menu .active.item {
	background: 0 0;
	color: #FFF
}

.ui.inverted.pointing.menu .active.item:after {
	background: #3D3E3F !important;
	margin: 0 !important;
	box-shadow: none !important;
	border: none !important
}

.ui.inverted.menu .active.item:hover {
	background: rgba(255,255,255,.15);
	color: #FFF !important
}

.ui.inverted.pointing.menu .active.item:hover:after {
	background: #3D3E3F !important
}

.ui.floated.menu {
	float: left;
	margin: 0 .5rem 0 0
}

	.ui.floated.menu .item:last-child:before {
		display: none
	}

.ui.right.floated.menu {
	float: right;
	margin: 0 0 0 .5rem
}

.ui.inverted.menu .red.active.item, .ui.inverted.red.menu {
	background-color: #DB2828
}

	.ui.inverted.red.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.red.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.menu .orange.active.item, .ui.inverted.orange.menu {
	background-color: #F2711C
}

	.ui.inverted.orange.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.orange.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.menu .yellow.active.item, .ui.inverted.yellow.menu {
	background-color: #FBBD08
}

	.ui.inverted.yellow.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.yellow.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.menu .olive.active.item, .ui.inverted.olive.menu {
	background-color: #B5CC18
}

	.ui.inverted.olive.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.olive.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.green.menu, .ui.inverted.menu .green.active.item {
	background-color: #21BA45
}

	.ui.inverted.green.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.green.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.menu .teal.active.item, .ui.inverted.teal.menu {
	background-color: #00B5AD
}

	.ui.inverted.teal.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.teal.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.blue.menu, .ui.inverted.menu .blue.active.item {
	background-color: #2185D0
}

	.ui.inverted.blue.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.blue.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.menu .violet.active.item, .ui.inverted.violet.menu {
	background-color: #6435C9
}

	.ui.inverted.violet.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.violet.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.menu .purple.active.item, .ui.inverted.purple.menu {
	background-color: #A333C8
}

	.ui.inverted.purple.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.purple.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.menu .pink.active.item, .ui.inverted.pink.menu {
	background-color: #E03997
}

	.ui.inverted.pink.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.pink.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.brown.menu, .ui.inverted.menu .brown.active.item {
	background-color: #A5673F
}

	.ui.inverted.brown.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.brown.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.inverted.grey.menu, .ui.inverted.menu .grey.active.item {
	background-color: #767676
}

	.ui.inverted.grey.menu .item:before {
		background-color: rgba(34,36,38,.1)
	}

	.ui.inverted.grey.menu .active.item {
		background-color: rgba(0,0,0,.1) !important
	}

.ui.fitted.menu .item, .ui.fitted.menu .item .menu .item, .ui.menu .fitted.item {
	padding: 0
}

.ui.horizontally.fitted.menu .item, .ui.horizontally.fitted.menu .item .menu .item, .ui.menu .horizontally.fitted.item {
	padding-top: .92857143em;
	padding-bottom: .92857143em
}

.ui.menu .vertically.fitted.item, .ui.vertically.fitted.menu .item, .ui.vertically.fitted.menu .item .menu .item {
	padding-left: 1.14285714em;
	padding-right: 1.14285714em
}

.ui.borderless.menu .item .menu .item:before, .ui.borderless.menu .item:before, .ui.menu .borderless.item:before {
	background: 0 0 !important
}

.ui.compact.menu {
	display: -webkit-inline-box;
	display: -webkit-inline-flex;
	display: -ms-inline-flexbox;
	display: inline-flex;
	margin: 0;
	vertical-align: middle
}

.ui.compact.vertical.menu {
	display: inline-block;
	width: auto !important
}

.ui.compact.menu .item:last-child {
	border-radius: 0 .28571429rem .28571429rem 0
}

	.ui.compact.menu .item:last-child:before {
		display: none
	}

.ui.compact.vertical.menu .item:last-child::before {
	display: block
}

.ui.menu.fluid, .ui.vertical.menu.fluid {
	width: 100% !important
}

.ui.item.menu, .ui.item.menu .item {
	width: 100%;
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	text-align: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
}

	.ui.item.menu .item:last-child:before {
		display: none
	}

.ui.menu.two.item .item {
	width: 50%
}

.ui.menu.three.item .item {
	width: 33.333%
}

.ui.menu.four.item .item {
	width: 25%
}

.ui.menu.five.item .item {
	width: 19.2%
}

.ui.menu.six.item .item {
	width: 16.666%
}

.ui.menu.seven.item .item {
	width: 14.285%
}

.ui.menu.eight.item .item {
	width: 12.5%
}

.ui.menu.nine.item .item {
	width: 11.11%
}

.ui.menu.ten.item .item {
	width: 10%
}

.ui.menu.eleven.item .item {
	width: 9.09%
}

.ui.menu.twelve.item .item {
	width: 8.333%
}

.ui.menu.fixed {
	position: fixed;
	z-index: 101;
	margin: 0;
	width: 100%
}

	.ui.menu.fixed, .ui.menu.fixed .item:first-child, .ui.menu.fixed .item:last-child {
		border-radius: 0 !important
	}

.ui.fixed.menu, .ui[class*="top fixed"].menu {
	top: 0;
	left: 0;
	right: auto;
	bottom: auto
}

.ui[class*="top fixed"].menu {
	border-top: none;
	border-left: none;
	border-right: none
}

.ui[class*="right fixed"].menu {
	border-top: none;
	border-bottom: none;
	border-right: none;
	top: 0;
	right: 0;
	left: auto;
	bottom: auto;
	width: auto;
	height: 100%
}

.ui[class*="bottom fixed"].menu {
	border-bottom: none;
	border-left: none;
	border-right: none;
	bottom: 0;
	left: 0;
	top: auto;
	right: auto
}

.ui[class*="left fixed"].menu {
	border-top: none;
	border-bottom: none;
	border-left: none;
	top: 0;
	left: 0;
	right: auto;
	bottom: auto;
	width: auto;
	height: 100%
}

.ui.fixed.menu + .ui.grid {
	padding-top: 2.75rem
}

.ui.pointing.menu .item:after {
	visibility: hidden;
	position: absolute;
	content: '';
	top: 100%;
	left: 50%;
	-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
	background: 0 0;
	margin: .5px 0 0;
	width: .57142857em;
	height: .57142857em;
	border: none;
	border-bottom: 1px solid #D4D4D5;
	border-right: 1px solid #D4D4D5;
	z-index: 2;
	-webkit-transition: background .1s ease;
	transition: background .1s ease
}

.ui.vertical.pointing.menu .item:after {
	position: absolute;
	top: 50%;
	right: 0;
	bottom: auto;
	left: auto;
	-webkit-transform: translateX(50%) translateY(-50%) rotate(45deg);
	transform: translateX(50%) translateY(-50%) rotate(45deg);
	margin: 0 -.5px 0 0;
	border: none;
	border-top: 1px solid #D4D4D5;
	border-right: 1px solid #D4D4D5
}

.ui.pointing.menu .active.item:after {
	visibility: visible
}

.ui.pointing.menu .active.dropdown.item:after {
	visibility: hidden
}

.ui.pointing.menu .active.item .menu .active.item:after, .ui.pointing.menu .dropdown.active.item:after {
	display: none
}

.ui.pointing.menu .active.item:after, .ui.pointing.menu .active.item:hover:after, .ui.vertical.pointing.menu .active.item:after, .ui.vertical.pointing.menu .active.item:hover:after {
	background-color: #F2F2F2
}

.ui.vertical.pointing.menu .menu .active.item:after {
	background-color: #FFF
}

.ui.attached.menu {
	top: 0;
	bottom: 0;
	border-radius: 0;
	margin: 0 -1px;
	width: calc(100% + 2px);
	max-width: calc(100% + 2px);
	box-shadow: none
}

.ui.attached + .ui.attached.menu:not(.top) {
	border-top: none
}

.ui[class*="top attached"].menu {
	bottom: 0;
	margin-bottom: 0;
	top: 0;
	margin-top: 1rem;
	border-radius: .28571429rem .28571429rem 0 0
}

.ui.menu[class*="top attached"]:first-child {
	margin-top: 0
}

.ui[class*="bottom attached"].menu {
	bottom: 0;
	margin-top: 0;
	top: 0;
	margin-bottom: 1rem;
	box-shadow: 0 1px 2px 0 rgba(34,36,38,.15),none;
	border-radius: 0 0 .28571429rem .28571429rem
}

	.ui[class*="bottom attached"].menu:last-child {
		margin-bottom: 0
	}

.ui.top.attached.menu > .item:first-child {
	border-radius: .28571429rem 0 0
}

.ui.bottom.attached.menu > .item:first-child {
	border-radius: 0 0 0 .28571429rem
}

.ui.attached.menu:not(.tabular) {
	border: 1px solid #D4D4D5
}

.ui.attached.inverted.menu {
	border: none
}

.ui.attached.tabular.menu {
	margin-left: 0;
	margin-right: 0;
	width: 100%
}

.ui.mini.menu {
	font-size: .78571429rem
}

.ui.mini.vertical.menu {
	width: 9rem
}

.ui.tiny.menu {
	font-size: .85714286rem
}

.ui.tiny.vertical.menu {
	width: 11rem
}

.ui.small.menu {
	font-size: .92857143rem
}

.ui.small.vertical.menu {
	width: 13rem
}

.ui.menu {
	font-size: 1rem
}

.ui.vertical.menu {
	width: 15rem
}

.ui.large.menu {
	font-size: 1.07142857rem
}

.ui.large.vertical.menu {
	width: 18rem
}

.ui.huge.menu {
	font-size: 1.14285714rem
}

.ui.huge.vertical.menu {
	width: 20rem
}

.ui.big.menu {
	font-size: 1.21428571rem
}

.ui.big.vertical.menu {
	width: 22rem
}

.ui.massive.menu {
	font-size: 1.28571429rem
}

.ui.massive.vertical.menu {
	width: 25rem
}



/* ------------------------------------------- */

.watersmart-content .chart-container {
	padding: 30px 15px;
}

.watersmart-content h9 {
	margin-right: 5px;
	display: inline;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
}

.watersmart-content .tilecallout {
	color: #245ea4;
	font-weight: 600;
	font-size: 28px;
	line-height: 1;
	text-align: center;
}

.watersmart-content p {
	margin-top: 2.5px;
	font-weight: 400;
	line-height: 1.6em;
}

.watersmart-content div.separator {
	margin-top: 0.7em;
	margin-bottom: 1em;
	border-bottom: 1px solid rgba(255,255,255,0.7);
	border-top: 1px solid rgba(0,0,0,0.1);
	width: 100%;
}

.pills-light .nav-link {
	text-align: center;
}

	.pills-light .nav-link:hover {
		background-color: #eee;
		color: #245ea4;
	}

	.pills-light .nav-link.active {
		color: #495057;
		background-color: #eee;
	}

.watersmart-tab-active {
	display: block;
	float: left;
	background-color: #5DC7D3;
	color: white !important;
	cursor: pointer;
	height: 38.56px;
	font-size: 10px !important;
	font-weight: 500;
	text-transform: uppercase;
	border-top-left-radius: 0.285714rem !important;
	border-bottom-left-radius: 0.285714rem !important;
	line-height: 17px !important;
	width: auto;
	border-left: none !important;
	outline: none !important;
	box-shadow: none !important;
}

	.watersmart-tab-active:hover {
		color: white;
	}

.watersmart-tab-inactive {
	display: block;
	float: left;
	background-color: white;
	color: #666;
	cursor: pointer;
	height: 38.56px;
	font-size: 10px !important;
	font-weight: 500;
	text-transform: uppercase;
	border-color: #66666647 !important;
	border-top-right-radius: 0.285714rem !important;
	border-bottom-right-radius: 0.285714rem !important;
	line-height: 17px !important;
	width: auto;
	border-left: none !important;
	outline: none !important;
	box-shadow: none !important;
}

	.watersmart-tab-inactive:hover {
		background: #00000008;
		color: #666;
	}


.watersmart-content .circle {
	width: 10px;
	height: 10px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background: red;
}

.watersmart-content .legend-container {
	text-align: center;
	margin-top: -40px;
}

.watersmart-content .legendItem {
	display: inline-block;
	font-size: 12px;
	color: #464646d9;
	font-weight: normal;
	cursor: pointer;
	margin-right: 10px;
	z-index: 500;
}



.history-chart-container.portal .nav.selection-bar {
	margin-top: 5px;
	margin-right: 25px;
	margin-bottom: 10px;
	margin-left: 10px;
	width: 860px;
	display: block;
}

.history-chart-container.portal .ui.menu {
	box-shadow: none;
	width: 400px;
	display: inline-block;
}

	.history-chart-container.portal .ui.menu .item {
		display: inline-block;
		font-size: 11px;
		font-weight: 500;
		color: #666;
		text-transform: uppercase;
		line-height: 11px;
		display: inline-flex;
		height: 40px;
	}

.history-chart-container.portal .nav .date-range .ui.calendar.start input {
	width: 80px;
	font-size: 10px;
	font-weight: 500;
	color: #666;
}

.history-chart-container.portal .nav .date-range {
	float: right;
	color: #404040;
	font-weight: 700;
	z-index: 15;
	width: 270px;
	background-color: transparent;
}

	.history-chart-container.portal .nav .date-range .ui.calendar.start {
		display: inline-block;
		width: 90px;
	}

.ui.calendar .ui.popup {
	max-width: none;
	padding: 0;
	border: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.history-chart-container.portal .nav .date-range i.calendar.icon {
	background-image: url(/Content/tpu/images/calendar-light.png);
	background-position: right center;
	background-repeat: no-repeat;
	border: 0px;
}

.history-chart-container.portal .chart-legend {
	color: #404040;
	font-weight: 400;
	font-size: 12px;
	padding: 5px 10px;
	display: inline-block;
	vertical-align: top;
}

.history-chart-container .chart-legend > span {
	display: inline-block;
	margin-right: 20px;
}

.history-chart-container .chart-legend span.dot {
	display: inline-block;
	border-radius: 10px;
	width: 10px;
	height: 10px;
	margin-right: 5px;
}

	.history-chart-container .chart-legend span.dot.normal {
		background-color: #5dc7d3;
	}

	.history-chart-container .chart-legend span.dot.leak {
		background-color: #F26322;
	}

	.history-chart-container .chart-legend span.dot.missing {
		background-color: #c4c4c4;
	}

.controlgraph-legend-label {
	font-size: 12px;
	font-weight: 400;
	color: #666;
}

.date-data {
	float: right;
	padding-right: 16px;
}

.history-chart-container.portal .date-data {
	color: #404040;
	font-size: 12px;
	margin-top: 5px;
}

var {
	font-style: inherit;
	font-size: 12px;
}

.apply-font {
	font-size: 12px;
}

.history-chart-container .chart-legend > span {
	display: inline-block;
	margin-right: 20px;
}

.history-chart-container.portal .nav .date-range {
	float: right;
	color: #404040;
	font-weight: 700;
	z-index: 15;
	width: 270px;
	background-color: transparent;
	font-size: 10px;
}

	.history-chart-container.portal .nav .date-range .ui.calendar.end, .history-chart-container.portal .nav .date-range .ui.calendar.start {
		display: inline-block;
		width: 90px;
		font-size: 10px;
	}

	.history-chart-container.portal .nav .date-range span.dash {
		position: relative;
		left: 30px;
		font-size: 10px;
	}

	.history-chart-container.portal .nav .date-range .ui.calendar.end {
		margin-left: 30px;
		font-size: 10px;
	}

		.history-chart-container.portal .nav .date-range .ui.calendar.end input, .history-chart-container.portal .nav .date-range .ui.calendar.start input {
			width: 120px;
			font-size: 10px;
			font-weight: 500;
			color: #666;
		}

	.history-chart-container.portal .nav .date-range i.calendar.icon {
		background-image: url(/Content/tpu/images/calendar-light.png);
		background-position: right center;
		background-repeat: no-repeat;
		border: 0px;
	}

/*.calendar.icon:before {
	left: 0;
	position: absolute;
	text-align: center;
	top: 50%;
	width: 100%;
	margin-top: -.5em;
	background: 0 0 !important;
}*/

/*.history-chart-container.portal .nav .date-range i.calendar.icon:before {
	content: '';
}*/
.date-item {
	align-self: auto;
	width: 120px;
}

.track-usage-graph .nav .ui.menu .item.active, .track-usage .nav .ui.menu .item.active, .history-chart-container.portal .ui.menu .item.active {
	background-color: #5DC7D3;
	color: white;
}

.wsfont {
	font-size: 10px !important;
}

.ui.menu .item:before {
	position: absolute;
	content: '';
	top: 0;
	right: 0;
	height: 100%;
	width: 1px;
	background: rgba(34,36,38,.1);
}
/*.ui[class*="left icon"].input > i.icon {
	right: auto;
	left: 1px;
	border-radius: .28571429rem 0 0 .28571429rem;
}*/

/*.ui.icon.input > i.icon {
	cursor: default;
	position: absolute;
	line-height: 1;
	text-align: center;
	top: 0;
	right: 0;
	margin: 0;
	height: 100%;
	width: 2.67142857em;
	opacity: .5;
	border-radius: 0 .28571429rem .28571429rem 0;
	-webkit-transition: opacity .3s ease;
	transition: opacity .3s ease;
}*/

.input-icons i {
	position: absolute;
}

.input-icons {
	width: 100%;
	margin-bottom: 10px;
}

.input-field {
	width: 100%;
	padding: 10px;
	text-align: center;
}

.calendar-icon {
	/*padding: 10px;*/
	/*background-image: url(/Content/tpu/images/calendar-light.png);
	background-position: right center;
	background-repeat: no-repeat;
	border: 0px;*/
	position: absolute;
	top: 5px;
	left: 7px;
	font-size: 15px;
	z-index: 99;
}

.watersmart-datepicker {
	padding-left: 18px;
	border: 1px solid rgba(34, 36, 38, 0.15);
	height: 27px;
}

/* Slider */
.irs--flat .irs-bar {
	background-color: rgba(128, 179, 236, 0.3) !important;
	height: 100% !important;
	top: 0px !important;
	cursor: grab !important;
}

.irs--flat {
	height: 100% !important;
}

	.irs--flat .irs-line {
		top: 0px !important;
		/*height: 100% !important;*/
		background-color: #e1e4e940 !important;
	}

	.irs--flat .irs-handle {
		top: 20% !important;
		height: 80% !important;
	}

.irs-handle {
	cursor: ew-resize !important;
}

.irs-from, .irs-to {
	background-color: #ccc !important;
	z-index: 1 !important;
}

.irs--flat .irs-handle > i:first-child {
	background-color: #666569 !important;
	z-index: 1;
}

.irs--flat .irs-handle > i:nth-child(2) {
	display: block;
	width: 80%;
	height: 35%;
	margin-left: 10%;
	margin-right: 10%;
	margin-top: 100%;
	background-color: rgb(235, 231, 232);
	z-index: 2;
	position: absolute;
	border: 1px solid rgb(178, 177, 182);
}

.irs--flat .irs-handle > i:nth-child(3) {
	position: absolute;
	display: block;
	box-sizing: border-box;
	top: 20px;
	left: 35%;
	width: 5px;
	height: 10px;
	border-left: 1px solid rgb(178, 177, 182);
	border-right: 1px solid rgb(178, 177, 182);
	z-index: 3;
}
/*.irs--flat .irs-to:before {
	background-color: #b2b1b6 !important;
}*/
.irs--flat .irs-from, .irs--flat .irs-to, .irs--flat .irs-single {
	color: white;
	font-size: 10px;
	line-height: 1.333;
	text-shadow: none;
	padding: 1px 5px;
	background-color: #666569 !important;
	border-radius: 4px;
}

.history-chart-container .chart-legend span.dot.currentusage {
	background-color: #5DC7D3;
}

.history-chart-container .chart-legend span.dot.average {
	background-color: #828282;
}

.history-chart-container .chart-legend span.dot.efficient {
	background-color: #245ea4;
}

.dashboard-tile {
	/* height: 365px; */
	background-color: white;
}

.dashboard-tile-2 {
	/* height: 400px; */
	background-color: white;
}

@media (min-width: 576px) {
	.dashboard-tile {
		height: 365px;
	}
	.dashboard-tile-1 {
		height: 395px;
	}
	.dashboard-tile-2 {
		height: 400px;
	}
	.watersmartNotificationBody {
		height: 694px !important;
	}
}

@media (min-width: 768px) {
	.dashboard-tile {
		height: auto;
	}
	.dashboard-tile-1 {
		height: auto;
	}
	.dashboard-tile-2 {
		height: auto;
	}
	.watersmartNotificationBody {
		height: auto !important;
	}
}
@media (min-width: 992px) {
	.dashboard-tile {
		height: 400px;
	}
	.dashboard-tile-1 {
		height: 355px;
	}
	.dashboard-tile-2 {
		height: 400px;
	}
	.watersmartNotificationBody {
		height: 614px !important;
	}
}

@media (min-width: 1200px) {
	.dashboard-tile-1 {
		height: 390px;
	}

	.watersmartNotificationBody {
		height: 694px !important;
	}
}

@media (min-width: 1230px) {
	.dashboard-tile-1 {
		height: 340px;
	}

	.watersmartNotificationBody {
		height: 644px !important;
	}
}

.font-12 {
	font-size: 12px;
}

.scroll-wrapper {
	overflow-y: auto;
	padding-top: 0px;
	padding-bottom: 0px;
	max-height: 295px;
}

.tile-img {
	width: 50px;
	height: auto;
	margin: auto;
}

.recommended-tile-img {
	width: 70px;
	height: auto;
	margin: auto;
}

.recommended-tile {
	overflow: hidden;
	height: 140px;
    background-color: white;
    border: none;
	border-radius: 4px;
	border-radius: 0.25rem !important;
    padding: 10px 10px 10px 10px;
    margin-top: 25px;
    color: #666666;
    width: 100%;
	box-shadow: rgba(0, 0, 0, 0.08) 0px 1px 5px 0px;
	transition: all ease 0.3s;
}

.recommended-tile:hover {
	cursor: pointer;
	-webkit-box-shadow: 0 6px 12px 0 rgb(0 0 0 / 16%);
	box-shadow: 0 6px 12px 0 rgb(0 0 0 / 16%);
}

div.rebate {
	z-index: 1000;
	text-align: center;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
    padding: 5px 0;
    margin-top: 21px;
    margin-left: -14px;
    width: 100px;
    background-color: #83A23D;
    color: #fff;
    font-size: 11px;
	box-shadow: rgb(0 0 0 / 30%) 0px 1px 1px;
}

.savings-title {
	color: #666;
	font-size: 12px;
}

.savings-water {
	color: #245ea4;
	line-height: 28px;
}

.savings-money {
	color: #83A23D;
	line-height: 28px;
}

.recommendation-title {
	line-height: 1.2em;
	font-weight: 600;
}

.pl-20px {
	padding-left: 20px
}

.pl-30px {
	padding-left: 30px
}

.px-30px {
	padding-left: 30px
}

.watersmart-content.px-0 .row .col h9 {
	padding-left: 15px;
}

b.info,
b.info * {
	font-size: 28px;
	font-weight: bold;
	color: #245ea4;
}

b.warning,
b.warning * {
	font-size: 28px;
	font-weight: bold;
	color: #ED7038;
}

svg[data-prefix=fas].success {
	color: #84a33d;
	font-size: 24px;
}

.bill-success {
	color: #84a33d;
	font-size: 28px;
}

svg[data-prefix=fas].danger {
	color: #dc3545;
	font-size: 24px;
}

.bill-danger {
	color: #dc3545;
	font-size: 28px;
}

.watersmart-content .popover-trigger {
	font-size: 1em;
	text-decoration: none;
	color: #666;
	cursor: pointer;
}

	.watersmart-content .popover-trigger:hover {
		color: #245ea4;
	}

/*.popover {
	background-color: #232f34;
	max-width: 240px;
}

.popover-body {
	color: #f3f4f4;
}

.bs-popover-top .arrow::after {
	border-top-color: #232f34;
}

.popover-body .btn {
	background-color: #f3f4f4;
	padding: 10px 10px 8px;
}*/

.watersmartNotificationBody h4 {
	font-weight: 600;
	font-size: 14px;
}

.notificationType {
	font-size: 14px;
	color: #245ea4 !important;
	margin-bottom: 10px;
	font-size: 13px;
}

.fa-check-circle, .fa-thumbtack, .fa-bullhorn {
	font-size: 16px;
}

	.fa-check-circle path {
		color: #84a33d;
	}

	.fa-bullhorn path {
		color: #f1ac1d;
	}

.gray-link {
	color: #666;
}

	.gray-link:hover {
		color: #245ea4;
	}

.portal-quicklink a {
	color: #666 !important;
}

.portal-quicklink i {
	color: #245ea4 !important;
}

	.portal-quicklink i:hover, .portal-quicklink a:hover {
		color: #245ea4 !important;
	}

#recommendationModalBody h1 {
	font-size: 1.5rem;
}

#recommendationModalBody div {
	margin-bottom: 1.5rem;
}

.modal {
	padding: 10px;
}