#gci2016wrap{
	position:relative;
	width:100%;
	height:100%;
	min-width:320px;
	min-height:480px;

	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.makesans{
	font-family: franklin-gothic-urw,helvetica,sans-serif;
}

#gci2016wrap p{
	margin:1em 0em;
}
#gci2016wrap h1{
	font-size:2em;
	font-weight:bold;
	margin: 0.6em 0em;
}
#gci2016wrap h2{
	font-size:1.5em;
	font-weight:bold;
	margin: 0.8em 0em;
}
#gci2016wrap b{
	font-weight:bold;
}
#gci2016wrap ul{
	list-style-type:disc;
	padding:0em 0em 0em 2.25em;
}

#gci2016banner{
	position:relative;
	width:100%;
	padding:15px 3% 0px 3%;
	min-height:500px;

	/*credit: http://uigradients.com/*/
	background: #EDE574; /* fallback for old browsers */
	background: -webkit-linear-gradient(to left, #EDE574 , #E1F5C4); /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to left, #EDE574 , #E1F5C4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	  
	background: url("https://www.brookings.edu/wp-content/uploads/2016/09/metro_20160929_redefining_global_cities_unsplash.jpg");
	background-size: 100% auto;
	background-size: cover;
	background-repeat:no-repeat;  
	background-position:50% 45%;

	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

#gci2016wrap .plotgroup{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding: 2px 5px;

	float:left;
}

#gci2016wrap .plotgroup > div{
	float:left;
	background-color:#e0e0e0;
}

#gci2016wrap .gcisection{
	margin:20px 0px;
}

/*clearfix this class*/
.gcisection::after{content:""; display:table; clear:both;}


#gci2016banner .title-box{
    -ms-transform: translate(0px, 2em);
    -moz-transform: translate(0px, 2em);
   	-webkit-transform: translate(0px, 2em);
    transform: translate(0px, 2em);
}

#gci2016wrap .content .subtitle-box{
	position:absolute;
	bottom:0px;
	left:0%;
	width:40%;
	min-width:300px;
	background-color:#dc2a2a;
	padding:4px 20px 4px 3%;
	color:#ffffff;
}

#gci2016banner .subtitle-box > *{line-height:1.25em;}

#gci2016wrap .content, #gci2016wrap .content-left{
	position:relative;
	margin:0px auto;
	padding:1px 3%;

	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}
#gci2016wrap .content-left{
	margin:0px;
}

#gci2016wrap .big-card{
	width:32%;
	margin-left:2%;
	min-height:150px;
	padding:0% 30px 0% 0%;

	float:left;
	position:relative;

	border:0px solid #dddddd;

	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}

#gci2016wrap .big-card:first-child{
	margin-left:0%;
}

#gci2016wrap .big-card p:first-child{
	font-size:1em;
	font-weight:bold;
	margin:0px;

}

#gci2016wrap .content.mw820{max-width:820px;}
#gci2016wrap .content.mw1280{max-width:1280px;}
#gci2016wrap .content.mw1600{max-width:1600px;}

#gci2016wrap .three-col-grid, #gci2016wrap .three-col-grid div, #gci2016wrap .center-col{
	webkit-box-sizing: border-box;
	moz-box-sizing: border-box;
	box-sizing: border-box;
}
#gci2016wrap .three-col-grid{
	padding:0px 3%;
	margin-top:3em;
}

#gci2016wrap .three-col-grid > div:before, 
#gci2016wrap .three-col-grid > div:after{
	display:block;
	width:1px;
	height:1px;
	content:"";
}

#gci2016wrap .three-col-grid > div > div{
	padding: 0px;
	margin:0px 0px 1em 0px;
}

#gci2016wrap .three-col-grid .left-col{
	width:23%;
	float:left;
}
#gci2016wrap .three-col-grid .right-col{
	width:23%;
	float:right;

}
#gci2016wrap .center-col{
	width:54%;
	float:left;
	padding:0px 3%;
	margin:0px auto;
}
#gci2016wrap .three-col-grid .center-col > div{
	margin:0px auto;
	max-width:850px;
}


#gci2016wrap .three-col-grid *:first-child{
	margin-top:0px;
}

/*.reading no longer applies to containers*/
#gci2016wrap .reading{line-height:1.75em; clear:left; margin:1.25em 0px 1em 0px;}
/*#gci2016wrap .reading:first-child{margin:1em 0px 0px 0px;}*/
#gci2016wrap .reading.zero-top-margin{margin-top:inherit;}

#gci2016wrap .dotplot{
	min-height:600px; 
	min-height:100vh; 
	position:relative; 

	border:0px solid #dddddd;
	border-width:0px 0px 0px 0px;

	margin-bottom:125px;
}

#gci2016wrap .makesans p, #gci2016wrap .makesans table tr td{
    line-height:1.25em;
}

#gci2016wrap .dotplot .makesans table tr td{
    line-height:1.1em;
}

#gci2016wrap input{
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;	
}


#gci2016wrap p.cluster-title{font-size:2em; padding:0.75em 0em; margin:0em -3% 0em 0em; border-bottom:0px solid #aaaaaa;float:left;}
#gci2016wrap p.cluster-title div{
	display:inline-block;
	margin-right:0.5em;
	height:1em;
	width:1em;
	border-radius:0.5em;
	vertical-align:middle;
	background-color:red;
}

#gci2016wrap .dotplot div.cluster-group-description{
	/*max-width:1300px;*/
	position:relative;
	margin:2em 2% 0em 2%;
	padding:2em 1% 0em 1%;
	border-top:1px solid #dddddd;
}

#gci2016wrap table tr:first-child td, #gci2016wrap table tr:last-child td{
	border:1px solid #aaaaaa;
	border-width:0px 0px 1px 0px;
	font-weight:normal;
}
#gci2016wrap table tr td{
	border:1px dotted #aaaaaa;
	border-width:0px 0px 1px 0px;
	padding:3px 2px 1px 2px;
	vertical-align:bottom;
}
#gci2016wrap table thead{
	background-color:transparent;
}
#gci2016wrap .table-wrap{
	font-size:16px;
}

#gci2016wrap .plot-footnote:before{
	content:"";
	width:75px;
	height:9px;
	border-top:1px solid #dddddd;
	display:block;
}

#gci2016wrap td.sort-asc:after{content:"▲";color:#333333;}
#gci2016wrap td.sort-desc:after{content: "▼";color:#333333;}

#gci2016fixedframewrap{
	position:relative;
	height:1px;
	width:100%;
	top:0px;
	left:0px;
}

#gci2016fixedframe{
	position:relative;
	display:none;
	width:100%;
	height:100%;
	height:calc(100vh - 100px);
	
	border:0px solid #ffffff;

	left:0px;
	z-index:100;
	z-index:0;
}

#gci2016wrap svg{
	width:100%;
	height:100%;
}

.c-fix::after{
	content:"";
	display:table;
	clear:both;
}

@media (min-width:0px){
	#gci2016wrap .three-col-grid .left-col,
	#gci2016wrap .three-col-grid .right-col,
	#gci2016wrap .center-col{	
		width:auto;
		float:none;
	}

	#gci2016wrap .three-col-grid > div > div{
		margin:0px 0px 2em 0px;
	}

	#gci2016wrap .small-map{
		border:1px solid #dddddd;
		padding:10px 0px;
		margin:0px 0px 10px 0px;
		float:none;
		width:auto;
	}

	#gci2016wrap p.cluster-title{float:none;}
	#gci2016wrap p.small-labels{font-size:11px;}
}

@media (min-width:780px){
	#gci2016wrap .three-col-grid .left-col{
		width:23%;
		float:left;
	}
	#gci2016wrap .three-col-grid .right-col{
		width:23%;
		float:right;
	}
	#gci2016wrap .center-col{
		width:54%;
		float:left;
		padding:0px 3%;
	}
	#gci2016wrap .three-col-grid > div > div{margin:0px;}

	#gci2016wrap .small-map{
		float:right;
		width:60%;
		border:0px solid #dddddd;
		border-width:0px 0px 0px 0px;
		padding:10px 5px;
		margin:0.5em 0px 0px 3%;
		background: radial-gradient(ellipse at center, rgba(5,55,105,0.75) 0%, rgba(0,0,0,0) 70%);
	}

	#gci2016wrap p.cluster-title{float:left;}

}

@media (min-width:1200px){
	#gci2016wrap p.small-labels{font-size:13px;}	
}

.disable-highlight, .disable-highlight p, svg text{
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;           
}