// Report Left Area

.report-center{
	float: left;
	width: 680px;
	padding: 0 20px;
	margin: 10px 0 3px;
		.chart-title{
			@include text-style($purple, 700, 19px, $sarif);
			line-height: 25px;
		}
		.chart-area{
			margin-bottom: 5px;
				img{
					max-width: 100%;
				}
		}
		.chart-area-two{
			margin: 0px;
				.chart-sec{
					width: 49%;
					float: left;
						&:nth-of-type(2){
							float: right;
						}
						h5{
							@include text-style($black, 400, 11px, $sans);
							text-transform: uppercase;
						}
						.only-chart{
							margin: 0;
							width: 304px !important;
						}
				}
		}
		.lt-yellow-area{
			background-color: none;
			padding: 5px 0;
			margin: 13px 0;
				.chart-area-two{
						.chart-sec{
							width: 49%;
							float: left;
								&:nth-of-type(2){
									float: right;
								}
								h5{
									@include text-style($black, 400, 11px, $sans);
									text-transform: uppercase;
								}
								.only-chart{
									margin: 0;
								}
						}
				}
				.source-note{
					@include text-style($black, 400, 10px, $sans);
					font-style: italic;
					margin: 5px 0 0 0;
				}
		}
		.chart-labels{
			&.left-right{
				margin-top: 15px;
					.lable-list{
						float: right;
							li{
								width: 170px;
							}
					}
					.source-note{
						float: left;
						margin: 5px 0 0 0;
							&.mt10{
								margin-top: 10px;
							}
					}
			}
			ul{
				&.lable-list{
					li{
						@include text-style($white, 400, 11px, $sans);
						float: left;
						list-style: none;
						width: 135px;
						padding: 2px 0;
						text-align: center;
							&.yellow{
								background-color: $yellow;
								color: $black;
							}
							&.gray{
								background-color: $gray;
							}
							&.purple{
								background-color: $purple;
							}
					}
				}				
			}
			.source-note{
				@include text-style($black, 400, 10px, $sans);
				font-style: italic;
				margin: 5px 0 0 0;
					&.mt10{
						margin-top: 10px;
					}
					&.web{
						margin-top: 17px;
					}
			}
		}
		.table-area{
			margin-top: 14px;
			table{
				margin-bottom: 8px;
				thead{
					tr{
						&:nth-of-type(1){
							th{
								text-align: center;
							}
						}
						th{
							@include text-style($white, 700, 11px, $sans);
							padding: 4px;
							background-color: $purple;
							text-align: right;
							vertical-align: bottom;
								&:nth-of-type(1){
									text-align: left;
								}
								&:nth-of-type(2){
									border-right: 1px solid $white;
								}
						}
					}					
				}
				tbody{
					tr{
						&:nth-of-type(1){
							td{
								background-color: $yellow;
								font-style: italic;
									&:nth-of-type(2){
										border-right: 1px solid $white;
									}
							}
						}
						&:nth-of-type(odd){
							background-color: rgba(52, 52, 64, .06);
						}
						td{
							@include text-style($black, 400, 12px, $sans);
							text-align: right;
							padding: 4px;
							vertical-align: top;
								&:nth-of-type(1){
									text-align: left;
								}
						}
					}
				}
			}
			.source-note{
				@include text-style($black, 400, 10px, $sans);
				font-style: italic;
				margin: 3px 0 0 0;
			}
		}
}