/***** FONTS *****/

@font-face {
	font-family:proxima-nova-regular;
	src:url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-light-webfont.eot?) format("eot"),url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-light-webfont.woff) format("woff"),url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-light-webfont.ttf) format("truetype");
	font-weight:400;
	font-style:normal;
}

@font-face {
	font-family:proxima-nova;
	src:url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-bold-webfont.eot?) format("eot"),url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-bold-webfont.woff) format("woff"),url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-bold-webfont.ttf) format("truetype");
	font-weight:700;
	font-style:normal;
}

@font-face {
	font-family:proxima-nova-extrabold;
	src:url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-bold-webfont.eot?) format("eot"),url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-bold-webfont.woff) format("woff"),url(https://ca1-dhq.edcdn.com/email/fonts/proximanova/proximanova-bold-webfont.ttf) format("truetype");
	font-weight:1000;
	font-style:normal;
}


/***** ANIMATION *****/

@keyframes fade {
    
    from {opacity: 0;}
    to {opacity: 1;}
    
}

@keyframes unfade {
    
    from {opacity: 1;}
    to {opacity: 0;}
    
}

.transition {
	
	transition: background 0.2s ease-in-out;
	
}


/***** LOGIN SCREEN *****/

html {
	
	height: 100%;
	
}

.login-container {
	
	min-width: 360px;
	padding: 20px;
	height: calc(100vh - 83px);
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	align-items: center;
	-webkit-align-items: center;
	-webkit-align-content: center;
	align-content: center;
		
}

.login-container .login-box {
	
	flex: 0 calc(80vw);
	max-width: 460px;
	border-radius: 3px;
	padding: 20px;
	background-color: #ffffff;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-gap: 10px 10px;
	gap: 10px 10px;
	box-shadow: 2px 2px 4px 1px #333333;
	
}

.login-container .login-box .login-img {
	
	flex: 0 100%;
	max-width: 200px;
	width: 100%;
	height: auto;
	
}

.login-container .login-box .login-title {
	
	flex: 0 100%;
	font-size: 40px;
	font-family: 'proxima-nova', Helvetica, sans-serif;
	font-weight: 600;
	color: #37465D;
	padding: 10px;
	
}

.login-container .login-box .login-body {
	
	flex: 0 100%;
	padding: 0px 10px 10px 10px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-gap: 10px 10px;
	gap: 10px 10px;
	
}

.login-container .login-box .login-body .login-error {
	
	flex: 0 100%;
	padding: 10px 0px;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0px;
	color: red;
	
}

.login-container .login-box .login-body .login-success {
	
	flex: 0 100%;
	padding: 10px 0px;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0px;
	color: green;
	
}

.login-container .login-box .login-body .login-text {
	
	flex: 0 100%;
	padding: 10px 0px;
	font-family: 'proxima-nova-regular', Helvetica, sans-serif;
	font-weight: 400;
	font-size: 20px;
	line-height: 30px;
	letter-spacing: 0px;
	color: #37465D;
	
}

.login-container .login-box .login-body .login-link {
	
	flex: 0 35%;
	color: #ffffff;
	padding: 15px 25px;
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0.3px;
	font-family: 'proxima-nova-regular', Helvetica, sans-serif;
	text-decoration: none;
	background-color: #37465D;
	transition: background 0.2s ease-in-out;
	
}

.login-container .login-box .login-body .login-link:hover {
	
	background-color: #566e8f;
	
}

.login-container .login-box .login-body button {
	
	flex: 0 35%;
	color: #333333;
	padding: 15px 25px;
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0.3px;
	font-family: Helvetica, Arial, sans-serif;
	text-decoration: none;
	background-color: rgb(255,197,1);
	
}

.login-container .login-box .login-body .login-link-small {
	
	flex: 0 50%;
	color: #37465D;
	font-family: Helvetia, Arial, sans-serif;
	font-size: 11px;
	
}

.login-container .login-box .login-body .login-field-container {
	
	flex: 0 100%;
	padding: 0px;
	
}

.login-container .login-box .login-body .login-field {
	
	width: calc(100% - 25px);
	padding: 5px;
	font-family: 'proxima-nova-regular', Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 16px;
	color: #ffffff;
	background-color: #37465D;
	border-radius: 4px;
	border: none;
	letter-spacing: 0px;
	
}

.login-container .login-box .login-body .login-label {
	
	flex: 0 100%;
	color: #37465D;
	font-family: 'proxima-nova-regular', Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 30px;
	letter-spacing: 0px;
	text-align: left;
	
}

.login-container .cc-text {
	
	flex: 0 100%;
	text-align: center;
	padding: 20px 0px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	color: #ffffff;
	
}


/***** NAVIGATION BAR *****/

.nav-container {
	
	width: 100%;
	height: 83px;
	border-bottom: 1px solid #cccccc;
	position: fixed;
	left: 0px;
	top: 0px;
	background-color: #ffffff;
	z-index: 1;
	
}

.nav-img-container {
	
	height: calc(100% - 40px);
	line-height: 80px;
	padding: 20px;
	display: inline-block;
	float: left;
	
}

.nav-title-container {
	
	height: calc(100% - 40px);
	line-height: 45px;
	padding: 20px;
	font-family: 'proxima-nova', Arial, Helvetica, sans-serif;
	font-size: 20px;
	display: inline-block;
	float: left;
	
}

.nav-title-sub {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	
}

.nav-fn-container {
	
	height: calc(100% - 40px);
	padding: 20px 0px;
	display: inline-block;
	float: right;
	font-size: 0;
	
}

.nav-fn-container-prod {
	
	height: calc(100% - 40px);
	padding: 20px 0px;
	display: inline-block;
	float: right;
	line-height: 44px;
	
}

.nav-fn-container-prod a {
	
	padding: 34px 44px;
	background-image: url('/imgs/ico/cog.svg');
	background-position: center;
	background-size: 43px 43px;
	background-repeat: no-repeat;
	
}

.nav-fn-container-log {
	
	height: calc(100% - 40px);
	padding: 20px 0px;
	display: inline-block;
	float: right;
	line-height: 44px;
	
}

.nav-fn-container-log a {
	
	padding: 34px 44px;
	background-image: url('/imgs/ico/sign-out-alt.svg');
	background-position: center;
	background-size: 43px 43px;
	background-repeat: no-repeat;
	
}

.nav-ln-container {
	
	height: calc(100% - 40px);
	line-height: 45px;
	padding: 20px 0px;
	font-family: 'proxima-nova', Arial, Helvetica, sans-serif;
	font-size: 14px;
	display: inline-block;
	float: right;
	
}

.nav-container img {
	
	height: 100%;
	width: auto;
	margin: 0;
	display: inline-block;
	
}

.nav-container .border-right {
	
	border-right: 1px solid #cccccc;
	
}

.nav-container .border-left {
	
	border-left: 1px solid #cccccc;
	
}

.nav-ln-container a {
	
	text-decoration: none;
	color: #37465D;
	padding: 34px 20px 33px 20px;
	
}

.nav-container a:hover {
	
	background-color: #cfd7e2;
	
}


/***** MAIN CONTENT *****/

.dead-zone {
	
	width: 100%;
	height: 83px;
	
}

.content-container {
	
	min-width: 1000px;
	overflow-y: auto;
	padding: 20px;
	height: calc(100vh - 123px);
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 20px 20px;
	gap: 20px 20px;
		
}

.content-container-b {
	
	min-width: 1000px;
	overflow-y: auto;
	padding: 20px;
	height: calc(100vh - 123px);
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 20px 20px;
	gap: 20px 20px;
	background-color: #f2f2f2;
		
}

.content-container-c {
	
	min-width: 1000px;
	overflow-y: auto;
	padding: 20px;
	height: calc(100vh - 123px);
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 20px 20px;
	gap: 20px 20px;
	background-color: #f2f2f2;
		
}

.content-container-d {
	
	min-width: 1000px;
	overflow-y: auto;
	padding: 0px;
	height: calc(100vh - 123px);
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 20px 20px;
	gap: 20px 20px;
	background-color: #f2f2f2;
		
}

.content-container-d .kpi {
	
	padding: 20px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 20px 20px;
	gap: 20px 20px;
	background-color: #f2f2f2;
		
}

.dash-box {
	
	height: calc(33% - 15px);
	width: calc(33% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	
}

.dash-box:hover {
	
	background-color: #f1f1f1;
	
}

.dash-box a {
	
	text-decoration: none;
	
}

.overview-box {
	
	height: calc(50% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 10px 10px;
	gap: 10px 10px;
	position: relative;
	
}

.overview-box-b {
	
	height: calc(50% - 10px);
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 0px;
	gap: 0px;
	position: relative;
	
}

.overview-box-c {
	
	height: calc(50% - 10px);
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 0px 20px;
	gap: 0px 20px;
	position: relative;
	
}

.overview-box-b .val-box {
	
	height: calc(50% - 10px);
	width: 100%;
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 0px;
	gap: 0px;
	
}

.overview-box-b .val-box-b {
	
	height: calc(50% - 10px);
	width: calc(50% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 20px 0px;
	gap: 20px 0px;
	
}

.overview-box-c .val-box {
	
	height: calc(100%);
	width: calc(33% - 11px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 0px 0px;
	gap: 0px 0px;
	
}

.overview-box-c .graph-container {
	
	width: calc(100%);
	height: calc(75% - 40px);
	text-align: center;
	padding: 0px 0px;
	
}

.overview-box-c .change-container {
	
	width: calc(100% - 20px);
	height: calc(25% - 40px);
	text-align: center;
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 0px 0px;
	gap: 0px 0px;
	
}

.val-pad {
	
	height: 20px;
	width: calc(100%);
	
}

.val-pad-b {
	
	height: calc(50% - 20px);
	width: 20px;
	
}

.overview-a {
	
	width: calc(66% - 10px);
	
}

.overview-b {
	
	width: calc(34% - 10px);
	
}

.overview-c {
	
	width: calc(50% - 10px);
	
}

.overview-box .kpi-name {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 20px;
	color: #37465D;
	font-weight: 600;
	line-height: 24px;
	padding: 10px 10px 10px 15px;
	width: calc(100% - 20px);
	height: 20px;
	text-align: left;
	
}

.overview-box .graph-container {
	
	width: calc(33% - 5px);
	height: calc(100% - 110px);
	text-align: center;
	
}

.overview-box .filter-container {
	
	width: calc(100% - 20px);
	height: 20px;
	padding: 10px;
	line-height: 20px;
	text-align: center;
	
}

.overview-box .table-container {
	
	
	width: calc(100%);
	height: calc(100% - 50px);
	overflow: auto;
}

.overview-box .table-container table {
	
	width: 100%;
	padding: 10px;
	border-collapse: collapse;
	
}

.overview-box .table-container th, .overview-box .table-container td {
	
	padding: 10px 10px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 16px;
	color: #37465D;
	
}

.overview-box .table-container th {
	
	border-bottom: 2px #37465D solid;
	
}

.overview-box .table-container .cam {
	
	width: 50%;
	text-align: left;
	
}

.overview-box .table-container .metric {
	
	width: 25%;
	text-align: center;
	
}

.overview-box .table-container tr:nth-child(odd) {
	
	background: transparent;
	
}

.overview-box .table-container tr:nth-child(even) {
	
	background: #f2f2f2;
	
}

.overview-box img {
	
	width: 10px;
	height: auto;
	vertical-align: middle;
	margin: auto;
	display: inline-block;
	/*padding: 2px;*/
	cursor: pointer;
	/*border-radius: 2px;*/
	background-color: #eeeeee;
	padding: 7px;
	border-radius: 15px;
	font-weight: 600;
	border: none;
	
}

.overview-box img:hover {
	
	background-color: #dddddd;
	
}

.overview-box-b .val-box .big-val {
	
	width: calc(33%);
	height: calc(100%);
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 0px;
	gap: 0px;
	
}

.overview-box-b .val-box .sml-val {
	
	width: calc(66%);
	height: calc(100%);
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 0px;
	gap: 0px;
	
}

.filter-box {
	
	width: 300px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 14px;
	border: 1px solid #cccccc;
	
}

.val-wide {
	
	width: calc(100%);
	
}

.val-big {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 80px;
	line-height: 80px;
	color: rgba(49,32,83,0.9);
	font-weight: 600;
	
}

.val-med {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 55px;
	line-height: 55px;
	color: rgba(49,32,83,0.9);
	font-weight: 600;
	text-align: center;
	
}

.val-med-wht {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 34px;
	line-height: 34px;
	color: #ffffff;
	font-weight: 600;
	text-align: center;
	
}

.val-sml {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 40px;
	line-height: 44px;
	color: rgba(49,32,83,0.9);
	font-weight: 600;
	
}

.val-xsml {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 20px;
	line-height: 24px;
	color: rgba(49,32,83,0.9);
	font-weight: 600;
	text-align: center;
	
}

.val-xxsml {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 20px;
	color: rgba(49,32,83,0.9);
	font-weight: 600;
	text-align: center;
	
}

.kpi-box {
	
	height: auto;
	min-height: 300px;
	width: calc(33% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	text-align: center;
	
}

.kpi-box-engage {
	
	height: auto;
	min-height: 300px;
	width: calc(100%);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	text-align: center;
	
}

.kpi-box .kpi-name, .kpi-box-engage .kpi-name {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #37465D;
	font-weight: 600;
	line-height: 20px;
	padding: 5px 10px 10px 10px;
	width: calc(100% - 20px);
	height: 20px;
	text-align: left;
	
}

.kpi-box-engage .kpi-range {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #37465D;
	font-weight: 600;
	line-height: 20px;
	padding: 10px;
	width: calc(100% - 20px);
	height: 20px;
	text-align: center;
	
}

.explainer {
	
	height: auto;
	min-height: 24px;
	width: calc(100% - 40px);
	padding: 0px 0px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 14px;
	color: #37465D;
	
}

.kpi-box-flex {
	
	height: auto;
	min-height: 300px;
	width: calc(33% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	text-align: center;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 10px 10px;
	gap: 10px 10px;
	
}

.kpi-box-flex-b {
	
	height: calc(50% - 30px);
	min-height: 140px;
	width: calc(33% - 29px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 10px;
	position: relative;
	text-align: center;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 10px 10px;
	gap: 10px 10px;
	
}

.kpi-box-flex div {
	
	width: calc(100% - 40px);
	padding: 0px 20px;
	text-align: center;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-weight: 600;
	color: #37465D;
	
}

.kpi-box-flex-b div {
	
	width: calc(100% - 40px);
	padding: 0px 20px;
	text-align: center;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-weight: 600;
	color: #37465D;
	
}

.kpi-box-flex .val-sml {
	
	font-size: 26px;
	line-height: 26px;
	margin: 0 auto;
	
}

.kpi-box-flex-b .val-sml {
	
	font-size: 22px;
	line-height: 22px;
	margin: 0 auto;
	
}

.kpi-box-flex .val-med {
	
	font-size: 34px;
	line-height: 34px;
	margin: 0 auto;
	
}

.kpi-box-flex-b .val-med {
	
	font-size: 30px;
	line-height: 30px;
	margin: 0 auto;
	
}

.kpi-box-flex .val-lg {
	
	font-size: 60px;
	line-height: 60px;
	
}

.kpi-box-flex-b .val-lg {
	
	font-size: 50px;
	line-height: 50px;
	
}

.no-month {
	
	background-color: rgba(49,32,83,0.1);
	
}

.kpi-box-flex-split-2 {
	
	height: auto;
	min-height: 300px;
	width: calc(50% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 10px 10px;
	gap: 10px 10px;
	
}

.kpi-box-flex-split-3 {
	
	height: auto;
	min-height: 300px;
	width: calc(33% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 10px 10px;
	gap: 10px 10px;
	
}

.kpi-box-flex-split-win {
	
	height: auto;
	min-height: 30px;
	width: calc(100%);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 0px 0px;
	gap: 0px 0px;
	
}

.kpi-box-flex-personal {
	
	height: auto;
	min-height: 300px;
	width: calc(25% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 10px 10px;
	gap: 10px 10px;
	
}

.kpi-box-flex-personal-b {
	
	height: auto;
	min-height: 300px;
	width: calc(74.5% - 10px);
	border-radius: 4px;
	padding: 0px;
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 20px 20px;
	gap: 20px 20px;
	
}

.kpi-box-flex-split-win .kpi-name {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #37465D;
	font-weight: 600;
	line-height: 20px;
	padding: 5px 10px 10px 10px;
	width: calc(100% - 20px);
	height: 20px;
	text-align: left;
	
}

.audit-score-flex {
	
	height: auto;
	min-height: 30px;
	width: calc(100%);
	background-color: #ffffff;
	padding: 0px;
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 0px 0px;
	gap: 0px 0px;
	
}

.audit-score-flex .audit-score-main {
	
	width: calc(100 - 40px);
	padding: 20px 20px;
	text-align: center;
	
}

.audit-score-flex .audit-score-sml {
	
	font-size: 14px!important;
	
}

.kpi-box-flex-split-2 .kpi-name, .kpi-box-flex-split-3 .kpi-name {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 26px;
	color: #37465D;
	font-weight: 600;
	line-height: 26px;
	padding: 10px 20px;
	width: calc(100% - 20px);
	height: 20px;
	text-align: left;
	
}

.kpi-box-flex-personal .kpi-name {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #37465D;
	font-weight: 600;
	line-height: 20px;
	padding: 5px 10px 10px 10px;
	width: calc(100% - 20px);
	height: 20px;
	text-align: left;
	
}

.kpi-box-flex-split-2 .split-section-container, .kpi-box-flex-split-3 .split-section-container {
	
	width: calc(100% - 40px);
	padding: 10px 20px;
	
}

.kpi-box-flex-split-win .split-section-title {
	
	width: calc(40% - 40px);
	padding: 20px 20px;
	text-align: center;
	
}

.kpi-box-flex-split-win .split-section-val {
	
	width: calc(60% - 40px);
	padding: 20px 20px;
	text-align: center;
	
}

.kpi-box-flex-split-win .split-section-val-b {
	
	width: calc(25% - 40px);
	padding: 20px 20px;
	text-align: center;
	
}

.kpi-box-flex-split-2 .split-section-a, .kpi-box-flex-split-3 .split-section-a {
	
	padding: 0px 10px 0px 0px;
	width: calc(30% - 20px);
	text-align: right;
	float: left;
	
}

.kpi-box-flex-split-2 .split-section-b, .kpi-box-flex-split-3 .split-section-b {
	
	padding: 0px 0px 0px 10px;
	width: calc(70% - 20px);
	text-align: left;
	float: right;
	
}

.kpi-box-flex-split-2 .val-sml, .kpi-box-flex-split-3 .val-sml {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 22px;
	line-height: 22px;
	font-weight: 600;
	color: #37465D;
	margin: 0 auto;
	
}

.kpi-box-flex-split-2 .val-med, .kpi-box-flex-split-3 .val-med {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 34px;
	line-height: 34px;
	color: #37465D;
	margin: 0 auto;
	
}

.kpi-box-flex-split-win .val-xsml {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 22px;
	font-weight: 600;
	margin: 0 auto;
	
}

.kpi-box-flex-split-win .val-sml {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 22px;
	line-height: 22px;
	font-weight: 600;
	margin: 0 auto;
	
}

.kpi-box-flex-split-win .val-med {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 34px;
	line-height: 34px;
	margin: 0 auto;
	
}

.kpi-box-flex-split-win .val-lg {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 60px;
	line-height: 60px;
	margin: 0 auto;
	
}

.kpi-box-flex-split-2 .val-lg, .kpi-box-flex-split-3 .val-lg {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 60px;
	line-height: 60px;
	color: #37465D;
	margin: 0 auto;
	
}

.kpi-bdr-top {
	
	border-top: 2px solid #37465D;
	width: calc(50%)!important;
	
}

.kpi-divider {
	
	width: calc(100%);
	padding: 3px 0px;
	background-color: #37465D;
	
}

.kpi-pos {
	
	color: darkgreen!important;
	
}

.kpi-neg {
	
	color: darkred!important;
	
}

.kpi-dark {
	
	background: rgba(49,32,83,0.9);
	color: #ffffff!important;
	
}

.kpi-light {
	
	color: #37465D!important;
	background: #ffffff;
	
}

.dash-box-list {
	
	height: auto;
	width: calc(100%);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	
}

.dash-box-list .heading {
	
	width: calc(100% - 40px);
	height: 50px;
	text-align: center;
	padding: 20px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 30px;
	color: #37465D;
	
}

.dash-box-list .heading .back {
	
	text-decoration: none;
	position: absolute;
	left: 0px;
	top: 0px;
	height: 20px;
	display: inline-block;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	padding: 5px 10px;
	text-align: left;
	border: none;
	font-weight: 600;
	z-index: 1;
	
}

.dash-box-list .heading .back:hover { 

	background-color: #f2f2f2;

}

.dash-box-list .heading .new {
	
	text-decoration: none;
	position: absolute;
	right: 0px;
	top: 0px;
	height: 20px;
	display: inline-block;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	padding: 5px 10px;
	text-align: right;
	border: none;
	font-weight: 600;
	z-index: 1;
	
}

.dash-box-list .heading .new:hover { 

	background-color: #f2f2f2;

}

.dash-box-list-b {
	
	height: auto;
	width: calc(100%);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	
}

.dash-box-list-b .heading {
	
	width: calc(100% - 40px);
	height: 50px;
	text-align: center;
	padding: 20px;
	font-family: 'proximan-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 30px;
	color: #37465D;
	
}

.dash-box-list-b .heading .back {
	
	text-decoration: none;
	position: absolute;
	left: 0px;
	top: 0px;
	height: 20px;
	display: inline-block;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	padding: 5px 10px;
	text-align: left;
	border: none;
	font-weight: 600;
	z-index: 1
	
}

.dash-box-list-b .heading .back:hover { 

	background-color: #f2f2f2;

}

.dash-box-list-b .heading .volume {
	
	text-decoration: none;
	position: absolute;
	right: 0px;
	top: 0px;
	height: 20px;
	display: inline-block;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	padding: 5px 10px;
	text-align: right;
	border: none;
	font-weight: 600;
	z-index: 1
	
}

.dash-box-list-b .heading .volume:hover { 

	background-color: #f2f2f2;

}

.dash-box-list-b .heading .volume .years {
	
	display: none;
	position: absolute;
	right: 0px;
	top: 30px;
	width: 100px;
	height: auto;
	min-height: 30px;
	padding: 0px;
	background-color: #ffffff;
	z-index: 1;
	box-shadow: 2px 2px 4px 1px #333333;
	font-size: 11px;
	font-family: Helvetica, Arial, sans-serif;
	color: #333333;
	overflow-y: auto;
	text-align: left;
	
}

.dash-box-list-b .heading .volume .years.active {
	
	display: block;
	
}

.dash-box-list-b .heading .volume .years div {
	
	width: calc(100% - 20px);
	padding: 5px 10px;
	font-size: 11px;
	
}

.dash-box-list-b .heading .volume .years div:hover {
	
	background-color: #eeeeee;
	
}

.dash-box-list-b .heading .volume .examples {
	
	display: none;
	position: absolute;
	right: 0px;
	top: 30px;
	width: 130px;
	height: auto;
	min-height: 30px;
	padding: 0px;
	background-color: #ffffff;
	z-index: 1;
	box-shadow: 2px 2px 4px 1px #333333;
	font-size: 11px;
	font-family: Helvetica, Arial, sans-serif;
	color: #333333;
	overflow-y: auto;
	text-align: left;
	
}

.dash-box-list-b .heading .volume .examples.active {
	
	display: block;
	
}

.dash-box-list-b .heading .volume .examples div {
	
	width: calc(100% - 20px);
	padding: 5px 10px;
	font-size: 11px;
	
}

.dash-box-list-b .heading .volume .examples div:hover {
	
	background-color: #eeeeee;
	
}

.dash-box-list-b .heading .volume-b {
	
	text-decoration: none;
	position: absolute;
	right: 200px;
	top: 0px;
	height: 20px;
	display: inline-block;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	padding: 5px 10px;
	text-align: right;
	border: none;
	font-weight: 600;
	z-index: 1
	
}

.dash-box-list-b .heading .volume-b:hover { 

	background-color: #f2f2f2;

}

.dash-box-list-b .heading .volume-b .sort {
	
	display: none;
	position: absolute;
	left: 0px;
	top: 30px;
	width: 100px;
	height: auto;
	min-height: 30px;
	padding: 0px;
	background-color: #ffffff;
	z-index: 1;
	box-shadow: 2px 2px 4px 1px #333333;
	font-size: 11px;
	font-family: Helvetica, Arial, sans-serif;
	color: #333333;
	overflow-y: auto;
	text-align: left;
	
}

.dash-box-list-b .heading .volume-b .sort.active {
	
	display: block;
	
}

.dash-box-list-b .heading .volume-b .sort div {
	
	width: calc(100% - 20px);
	padding: 5px 10px;
	font-size: 11px;
	
}

.dash-box-list-b .heading .volume-b .sort div:hover {
	
	background-color: #eeeeee;
	
}

.dash-box-list-b .heading .volume-c {
	
	text-decoration: none;
	position: absolute;
	right: 260px;
	top: 0px;
	height: 20px;
	display: inline-block;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	padding: 5px 10px;
	text-align: right;
	border: none;
	font-weight: 600;
	z-index: 1
	
}

.dash-box-list .list {
	
	width: calc(100%);
	height: calc(100% - 150px);
	
}

.dash-box-list .list .name {
	
	width: 50%
	
}

.dash-box-list .list-b {
	
	width: calc(100%);
	height: calc(100% - 150px);
	
}

.dash-box-list-b .list {
	
	width: calc(100%);
	height: calc(100% - 150px);
	
}

.dash-box-list-b .list-b {
	
	width: calc(100%);
	height: calc(100% - 150px);
	
}

.dash-box-list .section-head, .dash-box-list-b .section-head {
	
	padding: 20px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 24px;
	background-color: rgba(49,32,83,0.9);
	color: #ffffff;
	text-align: left;
	font-weight: 600;
	
}

.dash-box-list .list table, .dash-box-list-b .list table, .dash-box-list-b .stats table {
	
	width: 100%;
	padding: 0px;
	border-collapse: collapse;
	
}

.dash-box-list .list th {
	
	padding: 20px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	text-align: left;
	border-bottom: 1px solid #cccccc;
	
}

.dash-box-list-b .list th {
	
	padding: 20px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 24px;
	background-color: #37465D;
	color: #ffffff;
	text-align: left;
	
}

.dash-box-list .list td, .dash-box-list-b .list td {
	
	padding: 20px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	text-align: left;
	
}

.dash-box-list-b .stats td {
	
	padding: 20px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 20px;
	
}

.dash-box-list-b .stats .sml-td {
	
	font-size: 16px!important;
	
}

.dash-box-list-b .stats tr:nth-child(even) {
	
	background-color: rgba(245,245,245,0.9);
	
}

.dash-box-list .list-b table, .dash-box-list-b .list-b table {
	
	width: 100%;
	padding: 0px;
	border-collapse: collapse;
	
}

.dash-box-list .list-b-th, .dash-box-list-b .list-b-th {
	
	padding: 20px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 24px;
	background-color: rgba(49, 32, 83, 0.9);
	color: #ffffff;
	text-align: left;
	
}

.dash-box-list .list-b-td, .dash-box-list-b .list-b-td {
	
	padding: 10px 20px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 20px;
	background-color: #566e8f;
	color: #ffffff;
	text-align: left;
	
}

.dash-box-list .cam-list {
	
	padding: 0px;
	border-bottom: 4px solid #cccccc;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	
}

.dash-box-list .list-b-subs-th, .dash-box-list-b .list-b-subs-th {
	
	padding: 10px;
	border-bottom: 4px solid #cccccc;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	background-color: #f2f2f2;
	
}

.dash-box-list .list-b-subs-td, .dash-box-list-b .list-b-subs-td {
	
	padding: 10px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	border-bottom: 1px dashed #cccccc;
	
}

.wd-5 {
	
	width: 5%;
	
}

.wd-10 {
	
	width: 10%;
	
}

.wd-15 {
	
	width: 15%;
	
}

.wd-20 {
	
	width: 20%;
	
}

.wd-25 {
	
	width: 25%;
	
}

.wd-30 {
	
	width: 30%;
	
}

.wd-33 {
	
	width: 33%;
	
}

.wd-35 {
	
	width: 35%;
	
}

.wd-40 {
	
	width: 40%;
	
}

.dash-box-list .list tr:nth-child(even) {
	
	background-color: #f2f2f2;
	
}

.dash-box-list .links {
	
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: calc(50% - 40px);
	padding: 0px 20px 20px 20px;
	height: 30px;
	line-height: 20px;
	
}

.dash-box-list .links ul {
	
	list-style: none;
	
}

.dash-box-list .links li {
	
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	
}

.dash-box-list .links a {
	
	padding: 5px 10px;
	border-radius: 15px;
	background-color: #f2f2f2;
	text-decoration: none;
	color: #333333;
	transition: background 0.2s ease-in-out;
	
}

.dash-box-list .links span {
	
	padding: 5px 10px;
	border-radius: 15px;
	text-decoration: none;
	background-color: #37465D;
	color: #ffffff;
	
}

.dash-box-list .links a:hover {
	
	background-color: #37465D;
	color: #ffffff;
	
}

.dash-box-enter {
	
	min-height: calc(40%);
	width: calc(40%);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	
}

.dash-box-enter .heading {
	
	width: calc(100% - 40px);
	height: 30px;
	text-align: center;
	padding: 20px;
	font-family: 'proximan-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 22px;
	color: #37465D;
	
}

.dash-box-enter .heading .back {
	
	text-decoration: none;
	position: absolute;
	left: 0px;
	top: 0px;
	height: 20px;
	display: inline-block;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	padding: 5px 10px;
	text-align: left;
	border: none;
	border-top-left-radius: 3px;
	border-bottom-right-radius: 3px;
	font-weight: 600;
	box-shadow: inset -2px -2px 4px -1px #cccccc;
	
}

.dash-box-enter .heading .back:hover { 

	background-color: #f2f2f2;

}

.dash-box-enter .body {
	
	width: calc(100%);
	height: calc(100% - 70px);
	padding: 0px;
	
}

.dash-box-enter .body .form-group {
	
	width: calc(100%);
	display: inline-block;
	padding: 10px 0px;
	
}

.dash-box-enter .body .form-group .form-label-container {
	
	width: calc(30% - 20px);
	height: calc(100%);
	padding: 0px 10px 0px 10px;
	display: inline-block;
	text-align: right;
	
}

.dash-box-enter .body .form-input-container {
	
	width: calc(69% - 20px);
	height: calc(100%);
	padding: 0px 10px 0px 10px;
	display: inline-block;
	text-align: left;
	
}

.dash-box-enter .body .form-button {
	
	width: calc(100%);
	display: inline-block;
	padding: 10px 10px 30px 10px;
	text-align: center;
	
}

.month-kpi table {
	
	width: 100%;
	padding: 0px;
	border-collapse: collapse;
	
}

.month-kpi th {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #333333;
	line-height: 20px;
	font-weight: 600;
	padding: 10px;
	
}

.month-kpi td {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #000000;
	line-height: 20px;
	font-weight: 400;
	padding: 10px;
	
}

.form-label {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #333333;
	line-height: 20px;
	font-weight: 600;
	
}

.form-field, .form-select {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #ffffff;
	line-height: 20px;
	background-color: #37465D;
	border: none;
	border-radius: 4px;
	width: calc(100% - 20px);
	padding: 5px 10px;
	
}

.form-submit {
	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	line-height: 20px;
	background-color: #37465D;
	border: none;
	border-radius: 4px;
	padding: 5px 10px;
	
}

.form-submit:hover {
	
	background-color: #566e8f;
	
}

.text-left {
	
	text-align: left;
	
}

.text-center {
	
	text-align: center;
	
}

.text-right {
	
	text-align: right;
	
}

.text-bold {
	
	font-weight: 600!important;
	
}

.content-container-b .prod-container {
	
	width: calc(100% - 40px);
	height: calc(100% - 40px);
	padding: 20px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-content: center;
	align-content: center;
	-webkit-gap: 20px 20px;
	gap: 20px 20px;
	
}


/***** BORDERS *****/

.border-top-thick {
	
	border-top: 4px solid #cccccc;
	
}

.border-top-thick-b {
	
	border-top: 4px solid #333333;
	
}

.border-top-thickest {
	
	border-top: 10px solid #cccccc;
	
}

.border-bottom-thick {
	
	border-bottom: 4px solid #666666;
	
}

.border-bottom-dashed {
	
	border-top: 1px dashed #cccccc;
	
}


/***** BUTTONS *****/

.edit {
	
	background-color: #37465D;
	text-decoration: none;
	padding: 10px 15px;
	border-radius: 25px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	display: inline-block;
	border: none;
	
}

.edit:hover {
	
	background-color: #566e8f;
	
}

.button-up {
	
	box-shadow: inset -4px -4px 4px -4px #cccccc, inset 4px 4px 4px -4px #f2f2f2;
	
}


/***** DROP-DOWNS *****/

.drop-down-small {
	
	padding: 5px 0px 5px 3px;
	border-radius: 15px;
	width: 100px;
	text-decoration: none;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: 600;
	font-size: 11px;
	background-color: #eeeeee;
	color: rgba(75,75,75,.9);
	border: none;
	letter-spacing: 0px;
	box-shadow: inset -4px -4px 4px -4px #cccccc, inset 4px 4px 4px -4px #f2f2f2;
	
}

.drop-down-small:hover {	

	background-color: #dddddd;
	
}


/***** SCROLLBARS *****/

.scroll::-webkit-scrollbar {
	
	width: 16px;
	
}

.scroll::-webkit-scrollbar-track {
	
	background: none;
	
}

.scroll::-webkit-scrollbar-thumb {
	
	background: rgba(49,32,83,0.9);
	border-radius: 8px;
	
}


/***** ALERTS *****/

.alert-green {
	
	position: absolute;
	left: 0px;
	right: 0px;
	top: 60px;
	padding: 0px 20px 20px 20px;
	height: 10px;
	line-height: 30px;
	color: green;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: center;
	font-weight: 600;
	
}

.alert-red {
	
	position: absolute;
	left: 0px;
	right: 0px;
	top: 60px;
	padding: 0px 20px 20px 20px;
	height: 10px;
	line-height: 30px;
	color: red;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: center;
	font-weight: 600;
	
}


/***** ERRORS *****/

.form-error {
	
	font-family: Arial, Helvetica, sans-serif;
	color: darkred;
	padding: 10px 20px;
	text-align: right;
	font-size: 11px;
	
}


/***** PRODUCTION BOXES *****/

.prod-img {
	
	height: calc(100%);
	width: calc(28% - 20px);
	line-height: 200px;
	
}

.prod-img img {
	
	width: 100%;
	height: auto;
	display: inline-block;
	margin: 0 auto;
	vertical-align: middle;
	
}

.prod-title {
	
	height: calc(100%);
	width: calc(100% - 20px);
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 35px;
	color: #37465D;
	line-height: 200px;
	text-align: center;
	
}

.audit-check {
	
	width: 30px;
	height: auto;
	display: inline-block;
	
}

.audit-check-b {
	
	height: 30px;
	width: auto;
	display: inline-block;
	
}

.audit-check-explain {
	
	width: calc(100% - 100px);
	padding: 10px 20px 10px 50px;
	display: inline-block;
	
}

.check-center {
	
	text-align: center;
	
}

.img-thumb {
	
	padding: 0px;
	border: 1px solid #cccccc;
	width: 100px;
	height: 100px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	
}

.audit-list {
	
	font-size: 14px!important;
	padding-bottom: 5px;
	
}


/***** PDF CLASSES *****/

.pdf-body {
	
	margin: 0px;
	padding: 0px;
	
}

.pdf-container {
	
	width: 100%;
	padding: 0px;
	text-align: left;
	
}

.pdf-container-b {
	
	width: 100%;
	padding: 20px 0px;
	text-align: left;
	
}

.pdf-container-audit {
	
	width: 100%;
	padding: 0px 0px;
	text-align: left;
	
}

.pdf-img {
	
	text-align: right;
	padding: 5px 0px;
	width: 100%;
	
}

.pdf-img-b {
	
	text-align: right;
	padding: 5px 10px;
	width: 100%;
	
}

.pdf-img img {
	
	display: inline-block;
	
}

.pdf-title {
	
	text-align: left;
	padding: 5px 0px 5px 10px;
	width: 98.5%;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 30px;
	line-height: 24px;
	background-color: rgba(49, 32, 83, 0.9);
	color: #ffffff;
	
}

.pdf-sub-title {
	
	text-align: left;
	padding: 5px 0px;
	width: 100%;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 24px;
	line-height: 24px;
	color: rgba(49, 32, 83, 0.9);
	
}

.pdf-section-title {
	
	text-align: left;
	padding: 5px 0px;
	width: 100%;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 26px;
	line-height: 20px;
	color: #37465D;
	
}

.pdf-explain {
	
	text-align: left;
	padding: 5px 0px;
	width: 100%;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 18px;
	color: #37465D;
	
}

.pdf-section-details {
	
	text-align: left;
	padding: 0px 0px;
	width: 100%;
	
}

.pdf-audit-title {
	
	text-align: left;
	padding: 10px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 40px;
	line-height: 40px;
	color: #37465D;
	
}

.pdf-audit-sub-title {
	
	text-align: left;
	padding: 10px 10px 30px 10px;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 30px;
	line-height: 30px;
	color: #37465D;
	
}

.pdf-audit-section-title {
	
	text-align: left;
	padding: 10px 10px;
	width: 97%;
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 26px;
	line-height: 20px;
	background-color: #37465D;
	color: #ffffff;
	
}

.pdf-sml-td {
	
	font-size: 14px!important;
	
}

.pdf-audit-center {
	
	text-align: center!important;
	
}

.pdf-section-details table {
	
	width: 100%;
	border-collapse: collapse;
	
}

.pdf-section-details th {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 18px;
	color: #37465D;
	padding: 0px 10px;
	vertical-align: top;
	
}

.pdf-section-details td {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 18px;
	color: #37465D;
	padding: 0px 10px;
	vertical-align: top;
	
}

.pdf-section-details .boxy {
	
	height: 120px;
	background-color: rgba(150,150,150,0.1);
	border-radius: 5px;text-align: center;
	font-size: 24px;
	vertical-align: middle;
	
}

.pdf-audit-details table {
	
	width: 100%;
	border-collapse: collapse;
	
}

.pdf-audit-details th {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 18px;
	color: #37465D;
	padding: 0px 10px;
	vertical-align: top;
	
}

.pdf-audit-details td {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 18px;
	color: #37465D;
	padding: 0px 10px;
	vertical-align: top;
	
}
.pdf-audit-details tr:nth-child(even) {
	
	background-color: rgba(245,245,245,0.9);
	
}

.pdf-pad {
	
	padding: 10px!important;
	
}

.pdf-section-details .th-left {
	
	width: 25%;
	text-align: left;
	
}

.pdf-section-details .th-left-b {
	
	width: 50%;
	text-align: left;
	
}

.pdf-section-details .th-right {
	
	width: 25%;
	text-align: right;
	
}

.pdf-section-details .th-right-b {
	
	width: 50%;
	text-align: right;
	
}

.pdf-section-details .th-mid {
	
	width: 25%;
	text-align: center;
	vertical-align: middle;
	
}

.pdf-section-details .th-mid-b {
	
	width: 33%;
	text-align: center;
	vertical-align: middle;
	
}

.pdf-section-details .th-mid-c {
	
	width: 50%;
	text-align: center;
	vertical-align: middle;
	
}

.pdf-section-details .th-box {
	
	border: 1px solid #37465D;
	background-color: #ffffff!important;
	color: #37465D!important;
	
}

.pdf-section-details .td-kpi {
	
	width: 25%;
	text-align: left;
	
}

.pdf-section-details .td-kpi-b {
	
	width: 75%;
	text-align: left;
	
}

.pdf-section-details .td-kpi-c {
	
	width: 33%;
	text-align: left;
	
}

.pdf-section-details .td-kpi-d {
	
	width: 100%;
	text-align: left;
	
}

.pdf-section-details-b table {
	
	width: 100%;
	border-collapse: collapse;
	
}

.pdf-section-details-b td {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 10px;
	color: #37465D;
	padding: 10px 20px 10px 20px;
	vertical-align: top;
	
}

.pdf-section-details-b th {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 16px;
	color: #ffffff;
	background-color: rgba(49, 32, 83, 0.9);
	padding: 10px 20px 10px 20px;
	vertical-align: top;
	text-align: left;
	
}

.pdf-section-details-b .th-left {
	
	width: 25%;
	text-align: left;
	
}

.pdf-section-details-b .th-left-b {
	
	width: 50%;
	text-align: left;
	
}

.pdf-section-details-b .th-right {
	
	width: 25%;
	text-align: right;
	
}

.pdf-section-details-b .th-right-b {
	
	width: 50%;
	text-align: right;
	
}

.pdf-section-details-b .th-mid {
	
	width: 25%;
	text-align: center;
	vertical-align: middle;
	
}

.pdf-section-details-b .th-mid-b {
	
	width: 33%;
	text-align: center;
	vertical-align: middle;
	
}

.pdf-section-details-b .th-mid-c {
	
	width: 50%;
	text-align: center;
	vertical-align: middle;
	
}

.pdf-section-details-b .th-box {
	
	border: 1px solid #37465D;
	background-color: #ffffff!important;
	color: #37465D!important;
	
}

.pdf-section-details-b .rate-txt {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 18px;
	color: #37465D;
	
}

.pdf-section-details-b .rate-val {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 24px;
	line-height: 24px;
	color: #37465D;
	
}

.pdf-section-details-b .rate-div {
	
	padding: 5px;
	width: 100%;
	border-top: 2px solid #37465D;
	
}

.pdf-section-details-c table {
	
	width: 100%;
	border-collapse: collapse;
	
}

.pdf-section-details-c td {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 10px;
	color: #37465D;
	padding: 10px 20px 10px 20px;
	vertical-align: top;
	
}

.pdf-section-details-c th {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
	color: #ffffff;
	background-color: rgba(49, 32, 83, 0.9);
	padding: 10px 20px 10px 20px;
	vertical-align: top;
	text-align: left;
	
}

.border-left-thick {
	
	border-left: 5px solid #37465D;
	
}

.border-left-thin {
	
	border-left: 1px solid #cccccc;
	
}

.border-left-thin-dotted {
	
	border-left: 1px dotted #cccccc;
	
}

.border-top-thin-dotted {
	
	border-top: 1px dotted #cccccc;
	
}

.border-bottom-thin-dotted {
	
	border-bottom: 1px dotted #cccccc;
	
}

.back-blue-opq {
	
	background-color: rgba(55,70,93,0.1);
	
}

.page-break {
	
	page-break-after: always;
	
}

.pdf-kpi {
	
	width: calc(100%);
	height: auto;
	padding: 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-webkit-gap: 20px 20px;
	gap: 20px 20px;
	
}

.pdf-kpi-box {
	
	height: auto;
	min-height: 300px;
	width: calc(25% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	text-align: center;
	
}

.pdf-kpi-box-b {
	
	height: auto;
	min-height: 300px;
	width: calc(42% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	text-align: left;
	
}

.pdf-kpi-box-c {
	
	height: auto;
	min-height: 300px;
	width: calc(60%);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	text-align: center;
	
}

.pdf-kpi-box-d {
	
	height: auto;
	min-height: 300px;
	width: calc(33% - 10px);
	border-radius: 4px;
	background-color: #ffffff;
	box-shadow: 2px 2px 4px 1px #999999;
	padding: 0px;
	position: relative;
	text-align: center;
	
}

.pdf-header {
	
	font-family: 'proxima-nova-regular', Arial, Helvetica, sans-serif;
	font-size: 20px;
	line-height: 20px;
	color: #37465D;
	padding: 10px;
	width: calc(100% - 20px);
	
}
