@charset "UTF-8";
/* CSS Document */


.iv-subpage{
	padding-top: 0px!important;
	/*padding-left: 0px!important;
	padding-right: 0px!important;*/
	width:calc(100% - 40px);
	background-color: white;
}

.section-title{
	margin-bottom: 0px;
}

.section-subtitle{
	margin-left:20px;
	margin-right:20px;
	padding:20px 10px;
	/*background-color:#F2F2F2;*/
	background-color:#E5E5E5;
	color:#64318E;
	text-align:center;
	font-size:20px;
	font-weight:bold;
}
.smallText .section-subtitle{
	font-size:18px;
}
.bigText .section-subtitle{
	font-size:22px;
}

.FootnoteClass
{
    margin-top: 10px;
    color: brown;
    font-size: small;
    font-weight: normal;
    text-align: left;
    white-space: pre-line;
}


#section-iv > p {
/*
	float: left;
    width: 100%;
    position: relative;
	*/
	margin-left:20px;
	margin-right:20px;
    line-height: 22px;
    font-size: 16px;
    color: #333;
}
.smallText #section-iv > p {
	font-size: 14px;
}
.bigText #section-iv > p {
	font-size: 18px;
}
.right-dspt{
	display: inline-block;
	float: right;
	padding-right: 10px;
	width:73%;
	max-width: calc(100% - 130px);
}

.press-box{
	width:880px;
	height:auto;
	min-height:100px;
	position:relative;
	float:left;
	border:1px solid #DFDFDF;
	border-bottom:5px solid #DFDFDF;
	padding:10px 19px;
	margin:25px 0;
	background-color:#FFF;
	cursor: auto;
}

.press-title{
	margin: 15px 0 5px 0;
	color:#782C81;
	cursor: auto;
}
.press-text{
	padding-right: 20px;
    width: calc(100% - 20px);
	min-height: 115px;
	cursor: auto;
}
.press-thumbnail{
	display: inline-block;
	position: relative;
    float: left;
	margin: 15px 0px;
	border: 2px solid #E5E5E5;
	width: 33%;
	height:214px;
    font-size: 16px;
	text-align:center;
    /*background-color: #FFAD30;*/
}
.press-thumbnail.pub{
	width: 20%;
	min-width: 100px;
	height:auto;
	border:none;
}

/* center vertically */
.press-thumbnail::before {
  content: " ";
  display: inline-block;
  height: 8%;
  width: 1%;
  vertical-align: middle;
}

.press-thumbnail img{
	max-width:100%;
	max-height:214px;
	width: auto;
	height: auto;
	vertical-align: middle;
	border: 1px solid #AFAFAF;
}






.small-btn {
	display: inline-block;
	/*display: none;*/
	border-radius: 20px;
	padding: 3px;
	width: 80px;
/*	height: 35px; */
	font-size: 14px;
	font-weight: normal !important;
	text-align: center;
	margin-top: 7px;
    vertical-align: top;
	cursor: pointer;
}
.smallText .small-btn {
	font-size: 12px;
}
.bigText .small-btn {
	font-size: 16px;
}
.btn-enabled {
	background-color: #692272;
	color: #FFFFFF;
}
.rnd_btn_left{
	display: inline-block;
	border: 1px solid;
    border-radius: 0.66em;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
    padding: 0.02em;
    width: 140px;
    height: 30px;
	line-height: 30px;
    text-align: center;
	font-weight: bold;
	cursor:pointer;
}
.rnd_btn_right{
	display: inline-block;
	border: 1px solid;
    border-radius: 0.66em;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
    padding: 0.02em;
    width: 140px;
    height: 30px;
	line-height: 30px;
    text-align: center;
	font-weight: bold;
	cursor:pointer;
	margin-left: -6px !important;
}
.rnd_small_btn_left{
	display: inline-block;
	border: 1px solid;
    border-radius: 0.66em;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
    padding: 0.02em;
    width: 70px;
    height: 28px;
	line-height: 28px;
    text-align: center;
	font-weight: bold;
	cursor:pointer;
}
.rnd_small_btn_center{
	display: inline-block;
	border: 1px solid;
    padding: 0.02em;
    width: 70px;
    height: 28px;
	line-height: 28px;
    text-align: center;
	font-weight: bold;
	cursor:pointer;
	margin-left: -6px !important;
}
.rnd_small_btn_right{
	display: inline-block;
	border: 1px solid;
    border-radius: 0.66em;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
    padding: 0.02em;
    width: 70px;
    height: 28px;
	line-height: 28px;
    text-align: center;
	font-weight: bold;
	cursor:pointer;
	margin-left: -6px !important;
}
.rnd_btn_on{
	border-color:#692271;
    background: #692271;
	color:#FFFFFF;	
}
.rnd_btn_off{
	border-color:#B3B3B3;
    background: #FFFFFF;
	color:#000000;
}
/*
.highcharts-data-label  span  span{
	z-index: 2 !important;
}

.highcharts-tooltip{
	z-index: 19998 !important;
}
*/

.highcharts-tooltip span {
    background-color: white;
	
    /* border:1 px solid green; */
    opacity: 1;
    z-index: 9999 !important;
}




/* for marital-status */
#section-iv-marital-status p{
	padding-right: 4%;
	width: 96%;
}

.embedded-table{
	margin:20px 0px;
	/*padding:0px 10px;*/
	border:0px solid transparent;
	/*border:1px solid black;*/
	border-spacing: 0px;
	width:100%;
}
.smallText .embedded-table{
	font-size: 14px!important;
}
.bigText .embedded-table{
	font-size: 18px!important;
}
/*-----------------------*/
.smallText .embedded-table label{
	font-size: 14px!important;
}
.bigText .embedded-table label{
	font-size: 18px!important;
}



.embedded-table tr:nth-child(1){
	/*border:0px solid transparent;*/
	border-bottom: 2px solid #000000;
}
.embedded-table tr:nth-child(1) th{
	/*border:0px solid transparent;*/
	max-height:calc(100% - 5px);
}
.embedded-table th, .embedded-table td{
	border:0px solid transparent;
}
.embedded-table td{
	height:25px;
	line-height:25px;
	
}


.embedded-table tr td:nth-child(1){
	text-align:left;
}
.embedded-table tr th:nth-child(2),
.embedded-table tr th:nth-child(3),
.embedded-table tr td:nth-child(2),
.embedded-table tr td:nth-child(3){
	text-align:right;
}

#table_marital tr:nth-child(1),#table_sex tr:nth-child(1){
	vertical-align:bottom;
}

.iv_table_cell_padding th, .iv_table_cell_padding td{
	padding:10px 10px;
}
#table_ne th, #table_ne td{
	padding:7px 5px;
}





#controls_slider {
    margin-top: 0px;
	/*padding-left: 50px;*/
}

#controls_slider div {
    display : inline-block;
	margin-left:2px;
    padding :0px;
    border : 1px solid #ccc;
	border-radius: 5px;
    background-color : #E6E6E6;/*E6E6E6, EEE*/
    cursor : pointer;
	height: 27px;
	
}
.slider_button{
	width:50px;
}
#reset img{
	width:29px;
}

.label_slider_chosen_option{
	float: right;
	border:0;
	color:#64318E; /* f6931f */
	text-align:right;
	font-size:16px;
	font-weight:bold;
}
#age_range{
	/*width:calc(100% - 89px);*/
	/*width:calc(100% - 95px);*/
	width:100px;
	/*display:inline-block;*/
	
}
#slider-range{
	width:calc(100% - 10px);
/*	width: calc(100% - 40px);
	min-width: 350px;
	max-width: 450px;*/
	margin: 0 auto;
	margin-top:10px;
	margin-bottom:10px;
	margin-left:10px;
}
.ui-widget-header{
	background-color:#64318E;
}
.ui-state-default{
	border-color:#64318E!important;
}
.highcharts-data-labels text{
	font-size:14px;
}


#marital_pie_chart_container{
	display:inline-block;
	margin: 0 auto;
	/*max-width: 650px;
	min-width: 350px;*/
	width: 350px;
	height: 400px;	
}
#table_marital_container{
	display: inline-block;
	/*float: right;*/
	width: calc(100% - 390px);
	margin-top:40px;
	margin-left:10px;
	/*margin-right:20px;*/
	vertical-align:top;
}
#by_sex_and_age_control_container{
	display: inline-block;
	width: 35%;
	vertical-align:top;
	padding:10px 20px;
}
.smallText .control_container_text{
	font-size: 14px!important;
}
.bigText .control_container_text{
	font-size: 18px!important;
}

.control_container_title{
	font-size: 18px;
	font-weight:bold;
	/*text-decoration: underline;*/
}
.smallText .control_container_title{
	font-size: 16px;
}
.bigText .control_container_title{
	font-size: 20px;
}


#age_range_container, #showyear, #checkbox_2006_item, 
#checkbox_2011_item, #checkbox_item, #checkbox_item_edu, #fdh_btn_group, 
#population_pyramid_year{
	margin:10px 0px 10px 10px;
}

#by_sex_and_age_result_container{
	display: inline-block;
	margin-top:30px;
	/*margin-left:10px;*/
	padding-left:17px;
	border-left:3px solid #E7E7E7;
	width: 55%;
}
/*Never Married*/
/* #marital_pie_chart_container .highcharts-data-label-color-0 text{ */
	/* fill: #691E71!important; */
/* } */
/*Married*/
/* #marital_pie_chart_container .highcharts-data-label-color-2 text{ */
	/* fill: #184403!important; */
/* } */
/*Widowed*/
/* #marital_pie_chart_container .highcharts-data-label-color-1 text{ */
	/* fill: #AF4905!important; */
/* } */
/*Divorced / Separated*/
/* #marital_pie_chart_container .highcharts-data-label-color-3 text{ */
	/* fill: #002c5a!important; */
/* } */
/* #marital_pie_chart_container .highcharts-data-label-color-0 tspan:nth-child(1), */
/* #marital_pie_chart_container .highcharts-data-label-color-1 tspan:nth-child(1), */
/* #marital_pie_chart_container .highcharts-data-label-color-2 tspan:nth-child(1), */
/* #marital_pie_chart_container .highcharts-data-label-color-3 tspan:nth-child(1){ */
	/* stroke: transparent!important; */
/* } */

.marital_tooltip{
	margin-top: 8px;
	margin-bottom: 8px;
	margin-left: 8px;
	margin-right: 8px
}





/************************ place_of_birth *************************/
#place_of_birth_control_container{
	display: inline-block;
	width: 32%;
	vertical-align:top;
	padding:10px 0px 10px 0px;
}
#fdh_include_btn, #fdh_exclude_btn{
	width:140px;
}
#place_of_birth_year_container{
	margin:20px 5px 10px 10px;
}
#fdh_btn_group{
	margin: 10px 0px;
}
#place_of_birth_year_slider_container{
	width:calc(100% - 20px);
	margin: 0 auto;
	margin-left:10px
}
.pob_controls_slider{
    padding-left: 50px;
}
#place_of_birth_result_container{
	display: inline-block;
	margin-top:30px;
	/*margin-left:10px;*/
	/*padding-left:17px;*/
	border-left:3px solid #E7E7E7;
	width: 67%;
}
#place_of_birth_pie_chart_container{
	display:inline-block;
	margin: 0 auto;
	/*max-width: 650px;
	min-width: 350px;*/
	width: 250px;
	height: 400px;	
}
#table_place_of_birth_container{
	display: inline-block;
	/*float: right;*/
	width: calc(100% - 270px);
	margin-top:40px;
	/*margin-left:5px;*/
	/*margin-right:20px;*/
	vertical-align:top;
}
#section-iv-place_of_birth-status #slider{
	
}
#place_of_birth_bar_chart_container{
	width:100%;height: 400px;margin: 0 auto;
}
/*HK*/
#place_of_birth_pie_chart_container .highcharts-data-label-color-0 text{
	fill: #691E71!important;
}
/*China*/
#place_of_birth_pie_chart_container .highcharts-data-label-color-2 text{
	fill: #184403!important;
}
/*Other*/
#place_of_birth_pie_chart_container .highcharts-data-label-color-1 text{
	fill: #AF4905!important;
}
#place_of_birth_pie_chart_container .highcharts-data-label-color-0 tspan:nth-child(1),
#place_of_birth_pie_chart_container .highcharts-data-label-color-1 tspan:nth-child(1),
#place_of_birth_pie_chart_container .highcharts-data-label-color-2 tspan:nth-child(1),
#place_of_birth_pie_chart_container .highcharts-data-label-color-2 tspan:nth-child(2),
#place_of_birth_pie_chart_container .highcharts-data-label-color-2 tspan:nth-child(3){
	stroke: transparent!important;
}

.pob_tooltip {
	margin-top: 8px;
	margin-bottom: 8px;
	margin-left: 8px;
	margin-right: 8px
}

/************************ ne *************************/
#ne_control_container{
	display: inline-block;
	width: 23%;
	vertical-align:top;
	padding:10px 20px 10px 0px;
}
#ne_result_container{
	display: inline-block;
	margin-top:30px;
	/*margin-left:10px;*/
	/*padding-left:17px;*/
	border-left:3px solid #E7E7E7;
	width: 73%;
}
#percent_pie_chart_container{
	display:inline-block;
	margin: 0 auto;
	/*max-width: 650px;
	min-width: 350px;*/
	width: 250px;
	height: 400px;	
}
#percent_bar_chart_container{
	display:inline-block;
	margin: 0 auto;
	/*max-width: 650px;
	min-width: 350px;*/
	width: calc(100% - 290px);
	height: 400px;	
}
#table_ne_container{
	display: inline-block;
	/*float: right;*/
	width: calc(100%);
	margin-top:40px;
	margin-left:5px;
	/*margin-right:20px;*/
	vertical-align:top;
}
#table_ne th{
	text-align:center;
}
#table_ne tr:nth-child(1) th{
	background-color: #fdefff;
}
#table_ne tr:nth-child(2) th{
	background-color: #fdefff;
	text-align:right;
}
#table_ne tr:nth-child(1) th:nth-child(1){
	background-color:#fdefff;
	color:#692272;
	font-size:16pt;
}

#table_ne tr:nth-child(odd){
	background-color:#F4F4F4;
}
#table_ne tr:nth-child(even){
	background-color:#e6e6e6;
}

#table_ne td{
	vertical-align:top;
}
#table_ne td:nth-child(2),#table_ne td:nth-child(3),#table_ne td:nth-child(4){
	text-align:right;
}
#section-iv-ne-status #slider{
	
}
#population_pyramid_options{
	margin:30px 0px 0px 0px;
}

.ne_tooltip {
	margin-top: 8px;
	margin-bottom: 8px;
	margin-left: 8px;
	margin-right: 8px
}

/************************ population_growth *************************/
#population_growth_control_container{
	display: inline-block;
	width: 25%;
	vertical-align:top;
	padding:10px 20px;
}
#population_growth_result_container{
	display: inline-block;
	margin-top:30px;
	/*margin-left:10px;*/
	/*padding-left:17px;*/
	border-left:3px solid #E7E7E7;
	width: 68%;
}
#population_line_chart_container{
	margin-top:40px;
	
	
}
#population_bar_chart_container{
	margin: 0 auto;
	margin-top:40px;
	width:100%;
	height: 400px;
}

#age-group-form{
	margin: 10px 0px 10px 10px;
	    
}
#age_group_label{
	margin-top: 20px;
    margin-bottom: 10px;
}
.age-group-form-items{
	margin: 15px 0px 15px 20px;
}


#pg_more_btn{
	margin-left: calc(100% - 87px);
}

#sex_male_btn{
	margin-top:10px;
	
}







/************************ population_pyramid *************************/
#population_pyramid_control_container{
	display: inline-block;
	/*width: 33%;*/
	width: 45%;
	vertical-align:top;
	padding:10px 20px 10px 0px;
}
#population_pyramid_control_container #controls_slider{
	padding-left: 100px;
}


.population_pyramid_control_option_table tr td:nth-child(1){
	padding-top: 3px;
    vertical-align: top;
}
#population_pyramid_control_option_rbtn_table tr:nth-child(2){
	height:20px;
}


#population_pyramid_result_container{
	display: inline-block;
	margin-top:30px;
	/*margin-left:10px;*/
	/*padding-left:17px;*/
	border-left:3px solid #E7E7E7;
	/*width: 64%;*/
	width: 50%;
	height:365px;
}
#table_population_pyramid_container{
	display: inline-block;
	/*float: right;*/
	width: calc(100% - 40px);
	/* margin-top:40px; */
	margin-left:20px;
	margin-right:20px;
	vertical-align:top;
}
#table_population_pyramid tr:nth-child(1),#table_population_pyramid tr:nth-child(3){
	background-color:#fdefff;
}
#table_population_pyramid tr:nth-child(2),#table_population_pyramid tr:nth-child(4),#table_population_pyramid tr:nth-child(5){
	background-color:#eedee9;
}
#table_population_pyramid tr:nth-child(){
	
}
#table_population_pyramid tr:nth-child(){
	
}
#table_population_pyramid tr:nth-child(1) td:nth-child(1), #table_population_pyramid tr:nth-child(2) td:nth-child(1), #table_population_pyramid tr:nth-child(5) td:nth-child(1){
	font-weight:bold;
}
#table_population_pyramid tr td:nth-child(2){
	color:#692272;
}
#section-iv-population_pyramid-status #slider{
	
}
#pyramid_chart_footnote_link_1966,
#pyramid_chart_footnote_link_1971,
#pyramid_chart_footnote_link_1976{
	text-decoration: none;
}


/************************ district_comparison *************************/
.container-title{
	display:inline-block;
	margin-top:15px;
	margin-bottom:15px;
	font-size: 14pt;
	font-weight:bold;
	color:#692272;
}
#district-comparison-categorizing {
    display: inline-block;
    /*margin-left: 50px;*/
    border: 2px solid #E7E7E7;
    border-radius: 10px;
    /*width: 530px;*/
	width: calc(100% - 4px);
    height: 40px;
    line-height: 40px;
    background-color: white;
    text-align: center;
}
#district-comparison-categorizing select {
    border: 0px;
    /*border-radius: 8px;*/
    width: 890px!important;
    height: 30px;
    font-size: 18px;
    /* font-weight: bold; */
    color: #6A2373;
}
.smallText #district-comparison-categorizing select {
	font-size: 16px;
}
.bigText #district-comparison-categorizing select {
	font-size: 20px;
}

#chart_district_comparison_container_label  p {
	margin-left:20px;
	margin-right:20px;
    line-height: 22px;
    font-size: 16px;
    color: #6A2373;
}
.smallText #chart_district_comparison_container_label p {
	font-size: 14px;
}
.bigText #chart_district_comparison_container_label p {
	font-size: 18px;
}

#table_district_comparison_container{
	display:inline-block;
	width:100%;
}
#chart_district_comparison_container{
	display:inline-block;
	/*float:right;*/
	margin-top: 40px;
    margin-bottom: 30px;
	width:100%;
}




#table_district_comparison{
	border:0px solid transparent;
	border-spacing:0px;
	margin:auto;
	width:76%;
}
/*
#table_district_comparison tr{
	padding-top: 10px;
	padding-bottom: 10px;
}
*/
#table_district_comparison tr td{
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left:7px;
	padding-right:7px;
	
}
#table_district_comparison tr:nth-child(even){
	background-color:#f6f6f6;
}
#table_district_comparison tr:nth-child(odd){
	background-color:#e6e6e6;
}
#table_district_comparison tr:nth-child(n+2){
	font-size:14px;
}
.smallText #table_district_comparison tr:nth-child(n+2){
	font-size:12px;
}
.bigText #table_district_comparison tr:nth-child(n+2){
	font-size:16px;
}

#table_district_comparison tr:nth-child(-n+5) td:nth-child(1){
	width:70%;
	/*font-weight:bold;
	color:red;*/
}
#table_district_comparison tr:nth-child(-n+5) td:nth-child(2){
	text-align:right;
}
#table_district_comparison tr:nth-child(6) td:nth-child(2){
	width:30%;
}
#table_district_comparison tr:nth-child(6) td:nth-child(3){
	text-align:right;
}
/*
#table_district_comparison tr:nth-child(7) td:nth-child(1),
#table_district_comparison tr:nth-child(8) td:nth-child(1),
#table_district_comparison tr:nth-child(9) td:nth-child(1),
#table_district_comparison tr:nth-child(10) td:nth-child(1){
	
	font-weight:bold;
}
*/
#table_district_comparison tr:nth-child(7) td:nth-child(2),
#table_district_comparison tr:nth-child(8) td:nth-child(2),
#table_district_comparison tr:nth-child(9) td:nth-child(2),
#table_district_comparison tr:nth-child(10) td:nth-child(2),
#table_district_comparison tr:nth-child(11) td:nth-child(2){
	text-align:right;
	/*font-weight:bold;*/
}
#table_district_comparison tr:nth-child(1) td:nth-child(1){
	padding:10px 7px;
	font-size:13.5pt;
	font-weight:bold;
	background-color:#fdefff;
	color:#692272;
}

.district_comparison_population_bar_chart_x_labels {
	/* color:#000000; */
}

#district_comparison_population_change_bar_chart_container{
	width:95%;height: 550px;margin: 0 auto;
}
#district_comparison_population_bar_chart_container{
	width:95%;height: 550px;margin: 0 auto;display:none;
}
#district_comparison_population_density_bar_chart_container{
	width:95%;height: 550px;margin: 0 auto;display:none;
}
#district_comparison_median_age_bar_chart_container{
	width:95%;height: 550px;margin: 0 auto;display:none;
}



.highcharts-contextbutton{
	display:none;
}

.pie-chart-legend{
	display: inline-block;
    border: 1px solid black;
    width: 20px;
    height: 20px;
    margin-right: 5px;
    vertical-align: top;
}





@media only screen and (max-width:768px){
.iv-subpage{
	width:92%;
}



.press-box{
	width: calc(100% - 40px);
}
.press-thumbnail.pub{
	width: 100%;
}
.right-dspt{
	padding-right: 0px;
	width: 100%;
	max-width: 100%;
}


.embedded-table{
	margin-left:0px;
	margin-right:0px;
	width:100%;
}
#controls_slider {
	padding-left: calc(50% - 119px);
	/*padding-right: calc(50% - 89px);*/
}
#controls_slider div {
	margin-left:5px;
	margin-right:5px;
}
#marital_pie_chart_container{
	display: block;
	margin: 0 auto;
	width:100%;
	height: 400px;	
}
#table_marital_container{
	display: block;
	margin-left:0px;
	width: 100%;
}
#by_sex_and_age_control_container{
	display: block;
	width: calc(100% - 40px);
}
#by_sex_and_age_result_container{
	display: block;
	margin-top:0px;
	margin-left:0px;
	padding-left:0px;
	border-left:0px solid #000000;
	width: 100%;
}
#fdh_btn_group div{
	    width: 48%;
}
#checkbox_2006_item, #checkbox_2011_item{
	margin-top:20px;
	margin-bottom:20px;
}
#checkbox_item{
	margin:10px 0px 35px 10px;
}
#age-group-form{
	margin:10px 0px 0px 30px;
}

#place_of_birth_result_container, #ne_result_container, #population_growth_result_container, #population_pyramid_result_container{
	display: block;
	border-left:0px solid transparent;
	width: 100%;
}
#population_pyramid_result_container{
	height:290px;
}

/************************ place_of_birth *************************/
#place_of_birth_control_container{
	display: block;
	margin: 0 auto;
	width: calc(100% - 20px);
	
	vertical-align:top;
	padding: 10px 10px;
}
#slider{
	
	
}
#place_of_birth_pie_chart_container{
	display: block;
	margin: 0 auto;
	width: 100%;
	
}


#table_place_of_birth_container{
	display: block;
	margin: 0 auto;
	width: 100%;
}




/************************ ne *************************/
#ne_control_container{
	display: block;
	margin: 0 auto;
	width: calc(100% - 20px);
	
	vertical-align:top;
	padding: 10px 10px;
}

#percent_pie_chart_container{
	display: block;
	margin: 0 auto;
	width: 100%;
}
#percent_bar_chart_container {
	display: block;
	margin: 0 auto;
	width: 100%;
}
#table_ne_container{
	display: block;
	margin-left: 0px;
	border-left:0px solid transparent;
	width: 100%;
	overflow-x:auto;
	overflow-y:hidden;
}
#population_pyramid_options{
	margin:30px 20px 0px 20px;
}




/************************ population_growth *************************/
#population_growth_control_container{
	display: block;
	padding: 10px 10px;
	width: calc(100% - 20px);
}

#population_line_chart_container{
	margin-top:65px;
	
	
}
/************************ population_pyramid *************************/
#population_pyramid_control_container{
	display: block;
	margin: 0 auto;
	width: calc(100% - 20px);
	
	vertical-align:top;
	padding: 10px 10px;
}
#population_pyramid_control_container #controls_slider{
	padding-left: 5px;
}
#table_population_pyramid_container{
	display: block;
	margin: 0 auto;
	margin-top:20px;
	width: 100%;
}
/************************ district_comparison *************************/
#district-comparison-categorizing {
    display: block;
    margin-left: auto;
    margin-right: auto;
	width: 100%;
}
#district-comparison-categorizing select {
    width: calc(95%)!important;
}

#table_district_comparison_container{
	display:block;
	width:100%;
}
#chart_district_comparison_container{
	display:block;
	/*float:right;*/
	margin-top:40px;
	margin-bottom:30px;
	width:100%;
}
#district_comparison_population_change_bar_chart_container{
	width:100%;height: 500px;margin: 0 auto;
}
#district_comparison_population_bar_chart_container{
	width:100%;margin: 0 auto;display:none;
}
#district_comparison_population_density_bar_chart_container{
	width:100%;margin: 0 auto;display:none;
}
#district_comparison_median_age_bar_chart_container{
	width:100%;margin: 0 auto;display:none;
}


}


@media only screen and (max-width:320px){
#controls_slider {
	width:calc(100% - 5px);
	padding-left: 5px;
}
}