.map-wrapper {
	padding-top: 20px;
}

.map-container {
	height: auto;
	width: calc(100% + 20px);
	margin: 0 -10px;
	display: flex;
	flex-flow: row wrap;
	padding-top: 40px;
	padding-bottom: 100px;
}

.map-intro {
	border-top: 1px solid #E2E5E9;
	padding-top: 50px;
	width: calc(100% + 20px);
	margin: 0 -10px;
}

.map-intro .title {
	font: 800 3.6rem/4rem 'Roboto Condensed', sans-serif;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 2rem;
}

.map-intro p {
	font: 15px/1.6 'PT Serif', serif;
	color: #393939;
	text-align: center;
}

#map-obj {
	position: relative;
	height: 500px;
	width: 100%;
	flex: 0 1 auto;
}

.map-notification {
	display: none;
	position: absolute;
	bottom: 0;
	z-index: 10;
	background: rgba(0,0,0, 0.4);
	width: 100%;
	color: #fff;
	text-align: center;
	font: italic 14px 'Roboto Condensed', sans-serif;
	padding: 5px 0;
}

#map-obj.with-list {
	width: 100%;
	border-top: 1px solid #E2E5E9;
	border-bottom: 1px solid #E2E5E9;
}

#map-obj.with-list .map-notification {
	display: block;
}

.map-select {
	display: none;
	width: 100%;
	margin: 0 0 20px 0;
	padding: 20px;
	border-top: 1px solid #E2E5E9;
	border-bottom: 1px solid #E2E5E9;
}

.map-select.active {
	border: 0;
	margin: 0;
}

.map-select p {
	text-align: center;
	font: 800 2rem 'Roboto Condensed', sans-serif;
	margin-bottom: 2rem;
}

.map-select select {
	padding: 0 0 0 4rem;
	text-align: left;
	margin-bottom: 1.2rem;
	border: 1px solid #c7c7c7;
	font-size: 1.8rem;
	line-height: 2.65;
	height: 4.4rem;
	border-radius: 0;
	color: #393939;
	text-transform: uppercase;
	font-family: Roboto, sans-serif;
	width: 100% !important;
	background: url(../images/fal/select.png) no-repeat 95% 50%;
}

@media (max-width: 1023px) {
	.map-select {
		display: block;
	}
}

.map-list {
	display: none;
	width: 100%;
	height: 500px;
	padding: 10px 0;
	border-top: 1px solid #E2E5E9;
	border-bottom: 1px solid #E2E5E9;
}

@media (min-width: 1024px) {
	#map-obj.with-list {
		width: 66.66%;
	}

	.map-list {
		width: 33.33%;
	}
}

.map-list.active {
	display: block;
	position: relative;
}

.map-state {
	font: 800 2.7rem/1.2 'Roboto Condensed', sans-serif;
	margin-bottom: 5px;
	padding: 0 18px;
}

.map-chart {
	height: 25px;
	width: 100%;
	display: flex;
	flex-flow: row nowrap;
	padding: 0 18px 10px;
	border-bottom: 1px solid #E2E5E9;
}

.map-chart .light {
	flex: 0 1 0;
}

.map-chart .red.light {
	background-color: rgb(255, 96, 88);
}

.map-chart .yellow.light {
	background-color: rgb(255, 195, 61);
}

.map-chart .green.light {
	background-color: rgb(40, 200, 65);
}

.map-schools {
	height: calc(100% - 32px - 5px - 25px + 10px);
	overflow-y: auto;
}

.spotlight-school {
	font: 13px/1.4 'PT Serif', serif;
	color: #000000;
	border-bottom: 1px solid #E2E5E9;
	width: 100%;
	padding: 18px;
	transition: background-color 1s;
}

.spotlight-school:last-child {
	border-bottom: 0;
}

.spotlight-school > span {
	display: block;
	margin-bottom: 5px;
}

.spotlight-school .label  {
	font-weight: bold;
}

.spotlight-school .school-name {
	font: 700 15px/1.6 'PT Serif', serif;
}

.spotlight-school .school-name a {
	transition: color 0.3s;
}

.spotlight-school .school-name a::after {
	content: '\0203A';
	padding-left: 0.4em;
}

.spotlight-school .school-name a:hover {
	color: #e01f29;
}

.spotlight-school .school-website a {
	font-weight: bold;
	text-decoration: none;
	color: inherit;
	transition: color 0.3s;
}

.spotlight-school .school-website a:hover {
	color: #e01f29;
}

.spotlight-school .school-warning-notice {
	margin-left: 21px;
	font-style: italic;
}

.school-dot::before {
	display: inline-block;
	content: '';
	position: relative;
	top: 0.5px;
	width: 21px;
	height: 12px;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAz0lEQVR4AbWW0Q3CMAxEMwojMQIbwEZlE7pB+fA5v2xANwA9gVBRpdKWXqSToiS+a+zYbpkatdZdZh4j8iKpk/IBmLPGHmfK0oGRpAayeVAzWygz9xG6Y7gE2GA7SS7VA4f/ARxG8hdGN8F/a9wy5a6vmETkmY0tAefn61lwAG5ezcklAHeRsnUJwI3AzSegrjBxwi/gdFGErvYg25+pPdH8pWJQLvoNBXo4R43GVK79DWd0k5Xu6rGd3fSXBJ6zq/8u3nnSkpXDDGWNvV/ETwQOe6dzqauLAAAAAElFTkSuQmCC);
	background-size: contain;
	background-repeat: no-repeat;
}

.school-dot-red::before {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAMFBMVEUAAADnGCjjHifjHyjjHynjHyniHijiHSbiHynkHSjiHijkHinjHyjjHynjHyjiHyh71NNYAAAAEHRSTlMAIG+/z/+fUO9goHDA4NDwZJ3i4gAAAHZJREFUeNp10VEOwyAMA1C7xYUCg/vfdlLVVdGK32cikpDgxm1PUto3IuKhxxFSuSgoGbdTf04Tl643LHopBFC1UAFqiWhaauha6vhoKUGGTbhSwza349oP+pWAUy+T15nM2v2hgDwVzIwHa+hLRGx9SKO3X/gLeDwKFxTNRFoAAAAASUVORK5CYII=);
}

.school-dot-yellow::before {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAzklEQVR42rWWgQ2DIBBFHaULCB2lI3SDulG7CNINdIRuQDegvMSkJCQUi9/kJyh377xDOIfaFf35FL25xdn6pCUpom3smcOmgqiAnb0DaxG2+DTCx0tyCjjuVMC3DnfjFeMewZDAc5FJWfO8LP0KML8BZvNg4kjBzN8+SkQW0ZlJFQA25XmqAsBOGdgXNyItAwOl5AHUJVrliyz/TOUbTX5U5A3mfRQcFsyi0YiOa33DKTL5p1z44Nvc9PcsPLYdfxdm2jbjmu9QnjH3C/wBAFBjaT8cqWgAAAAASUVORK5CYII=);
}

.school-dot-green::before {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAMFBMVEUAAAAox0AnyEAoyEAnyUAoyUAoyEAmyUAnyUAoykAoyUAnyEAoyUAoyEAnyUAnyUCCmcubAAAAEHRSTlMAIG+/z/+fUO9goHDA4NDwZJ3i4gAAAHZJREFUeNp10VEOwyAMA1C7xYUCg/vfdlLVVdGK32cikpDgxm1PUto3IuKhxxFSuSgoGbdTf04Tl643LHopBFC1UAFqiWhaauha6vhoKUGGTbhSwza349oP+pWAUy+T15nM2v2hgDwVzIwHa+hLRGx9SKO3X/gLeDwKFxTNRFoAAAAASUVORK5CYII=);
}

.school-dot-blue::before {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAMFBMVEUAAABAl8dFlchElsdFlcZFlsdFlcdDlsZElcZFlcdFlsdElsZFlsdElcZFlsdElsflVFpKAAAAEHRSTlMAIG+/z/+fUO9goHDA4NDwZJ3i4gAAAHZJREFUeNp10VEOwyAMA1C7xYUCg/vfdlLVVdGK32cikpDgxm1PUto3IuKhxxFSuSgoGbdTf04Tl643LHopBFC1UAFqiWhaauha6vhoKUGGTbhSwza349oP+pWAUy+T15nM2v2hgDwVzIwHa+hLRGx9SKO3X/gLeDwKFxTNRFoAAAAASUVORK5CYII=);
}

.school-dot-empty::before {
	background-image: initial;
}

.rating-red.school-selected {
	background-color: rgba(227, 32, 41, 0.1);
}

.rating-yellow.school-selected {
	background-color: rgba(255, 190, 46, 0.1);
}

.rating-green.school-selected {
	background-color: rgba(38, 201, 65, 0.1);
}

.rating-warning.school-selected {
	background-color: rgba(70, 150, 199, 0.1);
}
