@font-face {
	font-family: 'Roboto Thin';
	src: url('../fonts/roboto/Roboto-Thin.ttf');
}

@font-face {
	font-family: 'Roboto Thin Italic';
	src: url('../fonts/roboto/Roboto-ThinItalic.ttf');
}

@font-face {
	font-family: 'Roboto Light';
	src: url('../fonts/roboto/Roboto-Light.ttf');
}

@font-face {
	font-family: 'Roboto Light Italic';
	src: url('../fonts/roboto/Roboto-LightItalic.ttf');
}

@font-face {
	font-family: 'Roboto Regular';
	src: url('../fonts/roboto/Roboto-Regular.ttf');
}

/* @font-face {
	font-family: 'Roboto Bold';
	src: url('../fonts/roboto/Roboto-Bold.ttf');
} */

@font-face {
	font-family: 'Roboto Black';
	src: url('../fonts/roboto/Roboto-Black.ttf');
}

.opad{padding: 0;}
.hover-pointer{	cursor: pointer;}
.align-r{ text-align: right;}
.align-c{ text-align: center;}
.float-r{float: right;}
.float-l{float: left;}
.ajaxLoading{display: none;}

html,body {
	font-family: 'Roboto Regular';
	font-size: small;
}

#row-top{
	background-color: white;
	height: 60px;
}

#row-ribbon{
	background-color: rgba(38,57,73,0.88);
	color: rgba(255,255,255,1);
	height: 30px;
	border-bottom: solid 1px rgba(255,255,255,0.06);
}
#row-ribbon-nav{
	color: rgba(255,255,255,0.8);
	padding: 5px 0 0 0;
}
#row-ribbon-nav .fa{
	padding: 0 15px 0 0;
}

#row-ribbon-actions{
	padding-top: 5px;
}
.ribbon-class{
	display: none;
	background-color: rgba(0,0,0,0);
	border: none;
}
.ribbon-class:focus{
	border: none;
}
.ribbon-class option{
	background-color: rgba(38,57,73,0.88);
	border: none;
}

#main-hamburger-menu{
	margin: 5px 15px 0 0;
}
#main-hamburger-menu:hover{
	cursor: pointer;
	color: white;
}
#main-navigation-title{
	font-family: 'Roboto Bold';
}


/*Sidebar Tings!*/
#side-bar{
	background-color: rgba(38,57,73,0.88);
	color: rgba(255,255,255,0.8);
	height: calc(100vh - 90px);/*note space before and after the minus sign*/
}

.side-bar-items{
	height: 32px;
	padding: 7px 0 0 15px;
	font-family: "Roboto Bold";
}
.side-bar-items .fa{
	margin: 0 15px 0 0;
}
.side-bar-items:hover{
	background-color: rgba(38,57,73,0.4);
	color: rgba(255,255,255,1);
	cursor: pointer;
}
.side-bar-selected{
	background-color: rgba(38,57,73,0.4);
	color: rgba(255,255,255,1);
}

.side-bar-submenu{
	display: none;
	background-color: rgba(38,57,73,0.4);
	padding: 0 0 0 30px;
}
.side-bar-submenu .side-bar-items{
	font-family: 'Roboto Regular';
	font-size: 0.95em;
}

/*Main Section Tings*/
#main-section{
	height: calc(100vh - 90px);/*note space before and after the minus sign*/
	overflow-y: auto;
	background-color: rgba(243,243,243,1);
}
#main-section > div{
	display: none;
	padding: 15px 0 0 0;
}

/*--Spending data tings*/
#spending-data, #lending-data, #telco-data,
#telco-master-data-call,
#telco-master-data-sms,
#telco-master-data-data
{
	background-color: white;
	padding-bottom: 15px;
	padding-top: 15px;
	margin-bottom: 15px;
}

/*--loan products tings*/
#loan-products-holder, #credit-concentrations-holder, #loan-parameters-holder{
	padding-top: 15px;
}
#loan-products, #credit-concentrations,#loan-parameters{
	background-color: white;
	padding-top: 10px;
	padding-bottom: 20px;
	margin-bottom: 15px;
}

.table-header{
	font-family: "Roboto Bold";
	height: auto;
	padding-top: 5px;
	font-size: 0.93em;
	color: rgba(0,0,0,0.7);
	border-bottom: solid 1px rgba(0,0,0,0.1);
}

.table-row{
	font-family: "Roboto Bold";
	color: rgba(0,0,0,0.5);
	min-height: 28px;
	padding-top: 5px;
	font-size: 0.93em;
	border-bottom: solid 1px rgba(0,0,0,0.07);
}
.table-row:hover{
	background-color: rgba(0,0,0,0.03);
}


/*--score card tings*/
.score-card{
	margin: 15px 0  30px 0;
}
.score-box-accent{
	height: 4px;
}
.score-box{
	background-color: white;
	padding-top: 7px;
	min-height: 200px;
}
.score-box-header{
	background-color: white;
	height: 35px;
	padding-top: 7px;
	border-bottom: solid 1px rgba(0,0,0,0.07);
}
.score-box-header > .score-box-card-name{
	font-family: "Roboto Regular";
	font-size: 15px;
    font-weight:400;
	color: rgba(0,0,0,0.5);
}
.score-box-header > .fa, .score-box-header > .glyphicon{
	float: right;
	margin:3px 0 0 7px;
	color: rgba(0,0,0,0.35);
}
.score-box-header > .fa:hover, .glyphicon:hover{
	color: black;
}

.score-box-chart{
	margin: 10px 0 15px 0;
}

.modules-header-container{
	height: 26px;
	padding-right: 0;
	font-family: "Roboto Bold";
	font-size: 14px;
	color: rgba(0,0,0,0.5);
	border-bottom: solid 1px rgba(0,0,0,0.07);
}

.score-edit-box{
	display: none;
	background-color: white;
	padding-top: 15px;
	padding-bottom: 15px;
	min-height: 355px;
}

.score-box-modules-container,
.score-box-conc-container,
.score-box-lp-container{
	padding-top: 5px;
	padding-bottom: 15px;
}
.score-box-modules-container > div.score-box-modules,
.score-box-conc-container > div.score-box-modules,
.score-box-lp-container > div.score-box-modules{
	height: 32px;
	padding: 7px 0 7px 15px;
	/* font-family: "Roboto Bold"; */
	color: rgba(0,0,0,0.5);
    font-size:15px;
    font-weight:400;
}
.score-box-modules .fa{
	margin: 0 15px 0 0;
}
.module-color-indicator.fa{
	float: right;
	margin: 2px 10px 0 0;
}
.personal-indicator.fa{	color: #F7464A; }
.cashflow-indicator.fa{	color: #787878; }
.credit-indicator.fa{ color: #00C78C; }
.lifestyle-indicator.fa{ color: #949FB1; }
.telco-indicator.fa{ color: rgba(0,137,236,1); }
.finance-indicator.fa{ color: rgba(223,255,0,1); }

.module-weight{
	float: right;
	margin-right: 15px;
}
.score-box-modules:hover{
	background-color: rgba(0,0,0,0.03);
	cursor: pointer;
}

.module-members-container{
	display: none;
	height: auto;
	font-size: 0.92em;
	color: rgba(0,0,0,0.7);
	padding: 7px 0 10px 45px;
}
.module-members:hover{
	font-weight: 600;
	color: rgba(0,0,0,0.75);
}
.module-members > .fa{
	margin-right: 7px;
	font-size: 0.83em;
}
.module-members-weight{
	float: right;
	margin-right: 15px;
}
.module-members-value{
	float: right;
	margin-right: 15px;
}

.member-pop-details div{
	text-align: center;
}

/*Results Things*/
#customer-bio-holder{
	padding-top: 15px;
	margin-bottom: 15px;
}
#customer-bio{
	background-color: white;
	padding-top: 15px;
	padding-bottom: 15px;
	min-height: 200px;
}
.customer-bio-modules{
	margin-top: 15px;
	min-height: 150px;
}
.bio-line{
	height: 28px;
	padding: 5px 0 5px 0;
	font-family: "Roboto Bold";
	color: rgba(0,0,0,0.5);
	margin-bottom: 7px;
}
.bio-line:hover{
	background-color: rgba(0,0,0,0.03);
}
.bio-line .fa, .bio-line .glyphicon{
	margin:  0 15px 0 0;
}
.bio-value{
	float: right;
	margin-right: 25px;
}

.bio-slide{
	height: 28px;
	margin-bottom: 7px;
}

.score-box-final{
	margin-bottom: 10px;
}
.score-label{
	font-size: 16px;
	margin: 0 0 0 15px;
	color: rgba(0,0,0,0.4);
}
.score-val{
	font-family: "Roboto Light Italic";
	font-size: 20px;
	float: right;
	color: rgba(0,0,0,0.5);
	font-weight:600;
}
.score-percent{
	color: rgba(0,0,0,0.5);
	font-size: 13px;
	float: right;
	position: relative;
	margin-left: 6px;
	top: 8px;
	left: -4px;
}

.score-box-modules .color-dots{
	font-size: 0.85em;
	margin-top: 4px;
}

/*Score Card Pop-up*/
.score-card-module-member-pop{
	display: block;
	position: absolute;
	background-color: white;
	box-shadow: 4px 4px 10px rgba(0,0,0,.3);
	z-index: 2;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-delay: 0s;
	-moz-animation-duration: 0.5s;
	-moz-animation-delay: 0s;
}

.score-card-module-member-pop > .member-pop-header{
	height: 28px;
	width: 100%;
	font-family: 'Roboto Bold';
	color: rgba(0,0,0,0.5);
	padding-top: 4px;
	border-bottom: solid 1px rgba(0,0,0,0.1);
}
.member-pop-header .glyphicon{
	float: right;
	color: rgba(0,0,0,0.35);
	margin: 0 0 0 5px;
}
.member-pop-header .glyphicon:hover{
	color: black;
}

/*custom buttons*/
.pseudo-button{
	height: 23px;
	width: auto;
	padding: 3px 7px;
	margin: 0 0 0 7px;
	color: white;
}
.pseudo-button:hover{
	cursor: pointer;
}
.b-blue{
	background-color: rgba(0,137,236,1.0);
}
.b-blue:hover{
	background-color: rgba(0,137,236,0.8);
}
.b-red{
	background-color: rgba(252, 40, 71, 0.65);
}
.b-red:hover{
	background-color: rgba(252, 40, 71, 0.5);
}
.b-green{
	background-color: rgba(80, 200, 120, 0.7);
}
.b-green:hover{
	background-color: rgba(80, 200, 120, 0.6);
}
.b-gray{
	background-color: rgba(178, 190, 181, 1.0);
	color: black;
}

/*Edit*/
.score-edit-module-line{
	margin:  10px 0 0 0;
}
.edit-module-name{
	margin: 4px 0 0 0;
	font-family: 'Roboto Bold';
	color: rgba(0,0,0,0.7);
}
.edit-module-more{
	margin: 5px 0 0 0;
	float: right;
	color: rgba(0,0,0,0.35);
}
.edit-module-weight, .edit-datapoint-weight{
	height: 24px;
	font-size: 0.85em;
	border: none;
	box-shadow: none;
	border-radius: 0 0;
	border-bottom: solid 1px rgba(0,0,0,0.1);
}

.edit-datapoints-holder{
	display: none;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

.loan-products-edit{
	padding: 20px 15px 20px 15px;
}
.lp-edit-line{
	margin-top: 10px
}

canvas {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.df-value{
	color: rgba(0, 158, 96, 1);
}

/*Recommendation*/

#customer-reco-holder{
	padding-top: 15px;
	padding-bottom: 30px;
}

#customer-sub-reco-holder{
	padding-top: 30px;
	padding-bottom: 30px;
}

.reco-card{
	margin-bottom: 30px;
}

.reco-subcategory-header{
	height: 30px;
	padding-top: 5px;
	background-color: rgba(0,0,0,0.07);
}
.reco-subcategory-header > .reco-subcategory-card-name{
	font-family: "Roboto Bold";
	font-size: 14px;
	color: rgba(0,0,0,0.6);
}
.reco-subcategory-header > .fa, .reco-subcategory-header > .glyphicon{
	float: right;
	margin:3px 0 0 7px;
	color: rgba(0,0,0,0.35);
}
.reco-subcategory-header > .fa:hover, .reco-subcategory-header > .glyphicon:hover{
	color: black;
}

.reco-subcategory-content{
	border: solid 1px rgba(0,0,0,0.06);
	height: auto;
	min-height: 100px;
	padding-top: 15px;
}
.reco-subcategory-content > div{
	height: auto;
}

.reco-subcategory-content-reco{
	margin-top: 15px;
	padding-top: 15px;
	border-top: solid 1px rgba(0,0,0,0.04);
}

.reco-summ-values{
	position: relative;
	right: 75px
}

.reco-subcategory-content-reco span.fa{
	margin-right: 10px
}
.reco-subcategory-content-reco .badge{
	position: relative;
	top: 3px;
}
.reco-reco-bestPost-label{
	margin-left: 15px;
}

.reco-brand-card-inner{
	border: solid 1px rgba(0,0,0,0.04);
	margin: 15px 0 15px 0;
}
.reco-brand-card-logo{
	border-bottom: solid 1px rgba(0,0,0,0.02);
	min-height: 70px;
}
.reco-brand-card-logo .badge{
	position: absolute;
	top: 4px;
	left: -6px;
}
.reco-brand-card-logo img{
	position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.reco-brand-summ{
	padding: 15px 0 15px 0;
	border-bottom: solid 1px rgba(0,0,0,0.02);
}
.reco-brand-metrics{
	padding: 15px 0 15px 0;
}

.reco-brand-summ .fa, .reco-brand-metrics .fa{
	font-size: 0.8em;
	margin-right: 3px;
}
.reco-brand-summ .brand-metric,
.reco-brand-metrics .brand-metric{
	float: right;
}

.reco-brand-priceSeperator{
	margin: 0 10px;
}

.reco-best-brand-price-3 > reco-brand-summ{
	text-align: center;
}

/*Wild Card*/
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td{
	height: 22px;
	padding: 8px;
}