/* General Settings */
html, body {
	height: 100%;
	background: #004B8D;
	font-family: "Open Sans", sans-serif;
	font-size: 14px;
	padding: 0;
	margin: 0;
	color: #6c717f;
}
/*Text Decoration*/
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	margin-bottom: 15px;
}
h1 {
	font-size: 24px;
}
h2 {
	font-size: 18px;
}
ul {
	list-style: disc;
	margin: 0px 0px;
	padding-left: 25px;
}
ol {
	list-style: decimal;
	margin: 15px 0px;
	padding-left: 25px;
}
a {
	color: #000000;
	text-decoration: none;
}

form {
	margin: 0;
}
/*Outermost Container*/
.panel {
	margin: 0px;
	text-align: center;
	padding: 15px;
	background-color: #F3F9FE;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
	min-width: 95%;
	min-height: 86%;
	text-align: center;
}
.panel h2 {
	font-weight: bold;
	border-bottom: 1px solid #E6E6E6;
	padding-bottom: 5px;
	color: #6c717f;
	font-size: 1.5rem;
}
.panel input {
	outline: 0;
	background: #FFFFFF;
	width: 100%;
	border: 1px solid #aaa;
	padding: 15px;
	padding-left: 8px;
	box-sizing: border-box;
	font-size: 14px;
	color: #6c717f;
}

.panel .smallinput input {
	max-width: 350px;
}

.panel input:focus {
	border: 1px solid #5897fb 
}
.panel select {
	outline: 0;
	background: #FFFFFF;
	width: 100%;
	border: 1px solid #aaa;
	margin: 4px;
	padding: 15px;
	box-sizing: border-box;
	font-size: 14px;
	color: #6c717f;
}
.panel textarea {
	outline: 0;
	background: #FFFFFF;
	width: 100%;
	border: 1px solid #aaa;
	margin: 4px;
	padding: 15px;
	box-sizing: border-box;
	font-size: 14px;
	color: #6c717f;
	height: 100px;
}
.panel textarea:focus {
	border: 1px solid #5897fb 
}
.button {
	text-transform: uppercase;
	outline: 0;
	border: 0;
	padding: 15px;
	cursor: pointer;
	font-size: 14px;
	color: #FFFFFF;
	background-color: #098BEF;
	box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
	border-bottom: 3px solid rgba(0, 0, 0, 0.1);
	font-weight: bold;
}
.button:hover{
	background-color: #0876C9;
	box-shadow: 0 1px 8px rgba(0, 0, 0, 0.3);
}
.button:disabled {
	opacity: 0.3;
	cursor: default;
	padding: 15px;
}
.button[disabled]:hover {
	box-shadow: none;
}
.badgebutton {
	text-transform: uppercase;
	border: 0;
	padding: .25em .5em;
	line-height: 1;
	cursor: pointer;
	font-size: 14px;
	color: #FFFFFF;
	background-color: #098BEF;
	box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
	border-bottom: 2px solid rgba(0, 0, 0, 0.1);
	font-weight: bold;
	border-radius: .25em;
	border-bottom: 2px solid rgba(0, 0, 0, 0.1);
}
.full {
	width: 100%;
}
.quarter {
	width: 25%;
}
.third {
	width: 33%;
}
.half {
	width: 50%;
}
.green {
	background-color: #3A6A9C;
}
.red {
	background-color: #f53649;
}
.red:hover {
	background-color: #E33244;
}

.green {
	background-color: #339f7b;
}

.green:hover {
	background-color: #2C8A6A;
}

.white-text {
	color: #FFFFFF;
}
.header {
	font-weight: bold;
	text-align: left;
	color: #6c717f;
}
.content {
	display: inline-block;
	padding: 10px;
	padding-top: 0px;
	text-align: center;
	margin-left: 5px;
	margin-right: 5px;
	box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
	min-width: 98%;
	min-height: 75%;
	background-color: #FFFFFF;
}
.boxwrapper > * {
	padding: 20px;
	padding-top: 0px;
	margin-bottom: 10px;
}
.boxwrapper {
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	grid-auto-rows: minmax(150px, auto);
	margin: 5px 5px 5px 5px;
	justify-content: center;
}
.box {
	margin-left: 5px;
	margin-right: 5px;
	flex: 1 1 200px;
	background-color: #FFFFFF;
	box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15);
}
.box .notebox {
	padding-left: 25px;
	padding-bottom: 10px;
}
.box .notebox .editlink {
	float: right;
}
.hardborder {
	box-shadow: none;
	border-bottom: 3px solid rgba(0, 0, 0, 0.1);
	background-color: #f1f2f4;
}
.minibox {
	max-width: 150px;
	padding: 10px;
	min-height: 140px;
}
.smallbox {
	max-width: 250px;
}
.mediumbox {
	max-width: 500px;
}
.largebox {
	max-width: 1000px;
}
.fullbox {
	max-width: 1250px;
}
.iconbox img {
	border-radius: 50%;
	height: 100px;
	width: 100px;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.iconbox .badge{
	margin-top: -15px;
}
.alertbox {
	color: #FFFFFF;
	max-height: 50px;
	border-bottom: 3px solid rgba(0, 0, 0, 0.2);
	padding: 20px;
	display: inline-block;
	margin-bottom: 15px;
	min-width: 80%;
	font-size: 16px;
}
.alertbox .boxcontent{
	text-align: left;
}
.alertbox .clickable {
	color: #FFFFFF;
	font-weight: bold;
}
.alertbox .clickable:hover {
	border-bottom: solid 2px #FFFFFF;
	color: #FFFFFF;
}
.alerticon img {
	float: left;
	max-width: 50px;
	max-height: 50px;
	padding-right: 25px;
}
.success {
	background-color: #339f7b;
}
.error {
	background-color: #aa0410;
}
.warning {
	background-color: #e4a300;
}
.info {
	background-color: #48555e;
}
.purple {
	background-color: #8960D6;
}
.teal {
	background-color: #60BAD6;
}
.system {
	background: rgb(119,144,237);
	background: linear-gradient(155deg, rgba(119,144,237,1) 73%, rgba(85,171,248,1) 100%);
}
.badge {
	color: #fff;
	display: inline-block;
	padding: .25em .5em;
	font-weight: bold;
	line-height: 1;
	text-align: center;
	white-space: nowrap;
	border-radius: .25em;
	border-bottom: 2px solid rgba(0, 0, 0, 0.1);
	min-width: 65px;
}
.readingboxheader {
	font-size: 4em;
}
.bad {
	color: #aa0410;
}
.good {
	color: #339f7b;
}
.okay {
	color: #e4a300;
}
.neutral {
	color: #48555e;
}

.readingboxname {
	font-size: 1em;
	font-weight: bold;
}
.readingboxchange{
	font-size: .9em;
}
.boxwarning {
	border-bottom: 6px solid #aa0410;
}
/*Navigation bar*/
.logo {
	background: no-repeat center/214px 50px url("../images/logo.png");
	width: 214px;
	height: 50px;
	position: absolute;
	padding: 5px;
}
.user img {
	padding: 5px;
	float:right;
	border-radius: 50%;
	cursor:pointer 
}
.navigation {
	text-align: center;
}
.navigationbar {
	width: 100%;
	margin-top: 0;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	background-color: #004B8D;
}
.navigationbar a {
	text-decoration: none;
	color: white;
}
.navigationbar ul {
	font-size: 0;
	list-style-type: none;
}
.navigationbar ul li {
	font-size: 1.15rem;
	font-weight: bold;
	color: white;
	display: inline-block;
	z-index:10000;
	padding: 20px;
	position: relative;
}
.navigationbar ul li ul {
	display: none;
}
.navigationbar ul li:hover {
	cursor: pointer;
	background-color: #0876C9;
}
.navigationbar ul li:hover ul {
	display: block;
	margin-top: 20px;
	min-width: 175px;
	left: 0;
	position: absolute;
}
.navigationbar ul li:hover ul li {
	display: block;
	background-color: #004B8D;
	padding: 15px 20px 15px 20px;
	text-align: left;
}
.navigationbar ul li:hover ul li span {
	float: right;
	color: #f9f9f9;
	background-color: #ff5b5b;
	padding: 2px 5px;
	text-align: center;
	font-size: .8rem;
	border-radius: 3px;
}
.navigationbar ul li:hover ul li:hover {
	background-color: #0876C9;
}
.navigationbar ul li:hover ul li:hover span {
	background-color: #e63950;
}
/* Footer */
#footer {
	text-align: center;
	bottom: 0;
	position: relative;
	width: 100%;
}
#footer p {
	color: #ffffff;
	font-size: 11px;
	margin: 0px;
	padding: 15px 10px;
}
#footer a {
	color: #ffffff;
	font-weight: bold;
}
/*Table*/
.table {
	border-collapse: collapse;
	width: 100%;
	text-align: left;
}
.table th {
	border-bottom:4px solid #9ea7af;
	border-right: 1px solid #9ea7af;
	padding:10px;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
	font-size: 1.25em;
}
.table th:first-child {
	border-top-left-radius:3px;
}
.table th:last-child {
	border-top-right-radius:3px;
	border-right:none;
}
.table tr {
	border-top: 1px solid #C1C3D1;
	border-bottom: 1px solid #C1C3D1;
	color:#666B85;
	font-size:14px;
	font-weight:normal;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.1);
}
.table tr:first-child {
	border-top:none;
}
.table tr:last-child {
	border-bottom:none;
}
.table tr:nth-child(odd) td {
	background:#F7F7F7;
}
.table tr:hover:nth-child(odd) td {
	background: #DEDEDE;
}
.table tr:hover{
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
	background-color: #DEDEDE;
}
.table td {
	padding:2px;
	padding-left:12px;
	padding-right:12px;
	border-right: 1px solid #C1C3D1;
	border-bottom: 1px solid #C1C3D1;
}
.table .padded td {
	padding:8px;
}
.table img {
	width: 45px;
	height: 45px;
}
.clickable {
	color: #098BEF;
	font-weight: bold;
}
.clickable:hover {
	color: #0876C9;
	border-bottom: 0;
}
.text-left {
	text-align: left;
}
.text-right {
	text-align: right;
}
.bold {
	font-weight: bold;
}
.text-center {
	text-align: center;
}
.metricbox {
	margin: 0;
	padding: 0;
	padding-left: 2px;
	padding-bottom: 10px;
}
.metric {
	float: left;
	padding-right: 45px;
	text-align: left;
}
.metric h4 {
	font-weight: bold;
	margin-bottom: 0px;
	font-size: 1.25em;
}
.metric p {
	font-size: .9em;
	color: #6c717f;
	margin: 0px;
}
.metric select {
	background-color: white;
	min-width: 125px;
}
.metric img {
	height: 45px;
	width: 45px;
	border-radius: 50%;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.1);
}
.metric-inline {
	float: left;
	padding-right: 45px;
	width: 50px;
}
.metric-inline h4 {
	font-weight: bold;
	margin: 0px;
	font-size: 1.25em;
}
.metric-inline p {
	font-size: .9em;
	color: #6c717f;
	margin: 0px;
}
.metricbox .nametile {
	padding-bottom: 10px;
	padding-left: 25px;
}
.metricbox .leftphoto {
	padding-left: 25px;
}
.boxwrapper .metricbox {
	box-shadow: none;
	background-color: #f1f2f4;
	border-bottom: 3px solid rgba(0, 0, 0, 0.1);
}
.metricbox .eventtile img {
	border-radius: 0;
	box-shadow: none;
}
.search {
	background: #f1f2f4;
	padding: 8px 20px;
	border-bottom: 3px solid rgba(0, 0, 0, 0.1);
	color: #6c717f;
	width: 100%;
	margin-bottom: 0px;
}
.search input {
	background-color: white;
	width:125px;
}
.search select {
	background-color: white;
	width:125px;
}
.utilities {
	padding: 5px;
	min-height: 60px;
}
.listbuttons {
	float: left;
}
.tools {
	float: right;
}
.tools img {
	padding: 2px;
	padding-top:1em;
	max-height: 35px;
}
.servicephoto {
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.15);
	max-width: 250px;
	max-height: 750px;
}
.servicephoto:hover {
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4), 0 5px 5px 0 rgba(0, 0, 0, 0.3);
}
.servicephoto.secondaryphoto {
	max-width: 100px;
	max-height: 300px;
}
.photobox {
	padding-bottom: 4px;
}
.short-input {
	width:125px;
}
.adv-search {
	display:none;
}
.customertabs {
	padding-top: 10px;
	text-align: center;
	clear: both;
}

.customertabs a {
	text-decoration: none;
	color: #6c717f;
}

.customertabs ul {
	font-size: 0;
	list-style-type: none;
	border-bottom: 1px solid #dcdde3;
}

.customertabs ul li {
	font-size: 16px;
	font-weight: bold;
	display: inline-block;
	padding: 15px;
	text-align: center;
}

.customertabs ul li:hover {
	box-shadow: 0 5px 2px -2px gray;
}

.customertabcurrent {
	box-shadow: 0 3px 2px -2px gray;
}

/* Checkbox Styles */
input[type=checkbox]{
	height: 0;
	width: 0;
	visibility: hidden;
	margin: 0;
}

label {
	cursor: pointer;
	text-indent: -9999px;
	width: 100px;
	height: 48px;
	background: grey;
	display: block;
	border-radius: 100px;
	position: relative;
}

label:after {
	content: '';
	position: absolute;
	top: 5px;
	left: 5px;
	width: 40px;
	height: 38px;
	background: #fff;
	border-radius: 40px;
	transition: 0.3s;
}

input:checked + label {
	background: #004B8D;
}

input:checked + label:after {
	left: calc(100% - 5px);
	transform: translateX(-100%);
}

label:active:after {
	width: 38px;
}

.requiredfield {
	color: red;
	font-weight: bold;
}

.copybutton {
	background:url(/images/copy-text.png) no-repeat;
	border: none; 
	height: 14px; 
	width: 13px;
}
.table .sectionbreak {
	border-right-width: 3px;
	text-align: center;
}