// Page Two Page Css 

.green-area{
	background-color: $green;
		&.p20{
			padding: 30px 0;
		}
		.left-side{
			width: 167px;
			float: left;
				.graph-info{
						h1{
							@include text-style($white, 15pt, 400, $oswald);
							line-height: 22px;
							margin: 0 0 10px 0;
						}
						h4{
							@include text-style($white, 10pt, 400, $oswald);
							margin: 0 0 10px 0;
							line-height: 17px;
						}
						.legend-list{
							margin: 0 0 10px 0;
							padding-top: 10px;
								ul{
									li{
										list-style: none;
										@include text-style($black, 10pt, 400, $roboto);
										line-height: 13px;
										margin: 7px 0;
											&:nth-of-type(1){
												span{
													background-color: #603026;
												}
											}
											&:nth-of-type(2){
												span{
													background-color: #903432;
												}
											}
											&:nth-of-type(3){
												span{
													background-color: #bc8784;
												}
											}
											&:nth-of-type(4){
												span{
													background-color: #e9d7d6;
												}
											}
											&:nth-of-type(5){
												span{
													background-color: #b5bcc1;
												}
											}
											&:nth-of-type(6){
												span{
													background-color: #85a1b0;
												}
											}
											&:nth-of-type(7){
												span{
													background-color: #558598;
												}
											}
											&:nth-of-type(8){
												span{
													background-color: #005476;
												}
											}
											span{
												width: 10px;
												height: 10px;
												display: inline-block;
												position: relative;
												margin: 0 3px 0 0;
												border: 1px solid $white;
											}
									}
								}
						}
						.note{
							@include text-style($black, 8pt, 400, $roboto);
							font-style: italic;
							padding-top: 5px;
						}
				}
		}
		.right-side{
			width: 525px;
			float: right;
		}
}

.page-two-table{
	table{
		margin-bottom: 5px;
			thead{
				tr{
					th{
						@include text-style($white, 10pt, 400, $roboto);
						text-transform: none;
						border-right: 1px solid $white;
							&.b0{
								border-right: 0;
							}
					}
					&:nth-of-type(1){
						th{
							@include text-style($white, 10pt, 600, $roboto);
							text-transform: uppercase;
							text-align: center;
							vertical-align: middle;
						}
					}
					&:nth-of-type(2){
						th{
							&:nth-of-type(4){
								text-align: left;
							}
						}
					}
				}
			}
			tbody{
				tr{
					td{
						&:first-child{
							text-align: left;
						}
						&:nth-of-type(4){
							text-align: left;
						}
						span{
							display: inline;
							margin-left: 3px;
						}
					}
				}
			}
	}
}
.source-note{
	@include text-style($blue, 8pt, 400, $roboto);
		span{
			@include text-style($blue, 8pt, 600, $roboto);
		}
}