@import url('./font-raleway.css');
@import url('./font-glyphicons.css');

#region-select {
	height: 20em;
}

.datasets label img {
	/* inline icon legend */
	height: 1.5ex;
	width: 1.5ex;
	vertical-align: baseline;
}
/* visual indent in lieu of nested structure */
.dataset-options {
	margin-left: 2em;
}
.dataset-options .checkbox,
.dataset-options .radio,
.group-condensed .checkbox {
    margin-top: 1px;
    margin-bottom: 1px;
}

.leaflet-tooltip-pane {
	/* z-index: 350; /* default 650; 350 beneath point markers */
}
.leaflet-tooltip.region-label {
	background-color: transparent;
	border: 0px;
	box-shadow: none;
	color: #527ef7;
}
.leaflet-tooltip.region-label span {
	line-height: 1em;
}
.leaflet-tooltip.region-stats {
	font-weight: bold;
	color: #1930A8; /* from Word doc annual report maps */
}
.text-halo {
	text-shadow:
		1px 1px 1px white,
		1px -1px 1px white,
		-1px 1px 1px white,
		-1px -1px 1px white;
}
/* This width for map canvas (etc?) makes it print nicely */
.print-full-width {
	width: 702px; /* 670 for Letter size, plus (15 margin + 1 border) * 2 */
	/* width: 867px; /* "Tabloid"? 11x17 */
	/* width: 2609px; /* A0 is biggest (in Chrome Save As PDF) 33.11 x 46.81 */
	/* 20x24 is CEE typical max poster size, prefer 300+ dpi

		Chrome PDFs seem to have map-image at 192dpi,
		or possibly scaled down to higher dpi.
		Ex: 670px -> 1276x1199  "82%"  233dpi

		20" w @ 300dpi = 6000px W

	 */
}

.hint-icon {
	color: #777;
}

@page  
{ 
	size: auto;   /* auto is the initial value */ 
		  
	/* this affects the margin in the printer settings */ 
	margin: 5mm 5mm 5mm 5mm;  
}

.show-print {
	display:none;
}


@media print {

	.show-print {
		display:block;
	}

	.print-full-width {
		width:auto !important;
	}
	.leaflet-container .leaflet-control-attribution {
		font-size: 4pt;
	}
	.leaflet-control-zoom,
	span.hint-icon {
		display: none;
	}
	#results-widget .table th,
	#results-widget .table td {
		font-size: 10pt;
	}
	.table>tbody>tr>td,
	.table>tbody>tr>th {
		padding: 2pt;
	}

	 /* override app.css making these black: */
	* .leaflet-tooltip.region-label span {
		color: #527ef7 !important;
	}

	h3.js-page-title {
		font-size:18pt !important;
		font-weight:bold !important;
		color:#608131 !important;
	}
	hr {
		border: 2px solid #4f829d;
		margin: 5px 0 5px 0;
	}

	.attr1 {
		font-size:12pt !important;
		color:#807b78 !important;
	}
	.attr2 {
		font-size:9pt !important;
		color:#807b78 !important;
	}


	.map-page-printable .panel-heading {
		background-color:#e5dab7 !important;
		padding-left:20mm !important;
		padding-right:20mm !important;
		border-bottom:0 !important;
	}

	.map-page-printable .panel-body {
		background-color:#e5dab7 !important;
		margin:0 !important;
		padding-left:20mm !important;
		padding-right:20mm !important;
		border-top:0 !important;
	}

	#leaflet-map {
		border:solid 1mm #4f829d;
	}


	.map-page-printable .panel-footer {
		background-color:#ede5d4 !important;
		padding-left:20mm !important;
		padding-right:20mm !important;
		border-top:0 !important;
	}


	table.stats {
		border:solid .5mm #4f829d;
	}

	table.stats th {
		background-color:#4f829d !important;
		color:#fff !important;
		border:0 !important;
	}

	table.stats tr:nth-child(even) td {
		background-color:#4f829d !important;
		color:#fff !important;
	}

	table.stats > tbody > tr > td {
		border:0 !important;
	}
	.no-print-padding {
		padding:0 !important;
	}

}
.match-panel-title {
	font-size: 16px;
}
table.stats td {
		font-family: monospace;
		text-align: right;
}
table.stats .text-left {
	text-align: left;
}
table.stats .row-label {
	font-family: inherit;
	white-space: nowrap;
}
table.district-stats tr.numbered-region .row-label {
	font-family: monospace;
}
.table.stats th {
	font-size: 10px;
}
.table.stats td {
	font-size: 12px;
}
.table.stats > tbody > tr.total > td {
	border-top-width: 2px;
}
.program-stats td.row-label img {
	/* inline icon legend */
	vertical-align: baseline;
}
/* ALL LOADERS */

.loader{
    width: 100px;
    height: 100px;
    border-radius: 100%;
    position: absolute;
    margin: 0 auto;
    z-index: 2000;
    left: 50%;
    top: 50%;
    display: none;
}

/* LOADER 1 (ring with spinning section) */

.loader-1:before, .loader-1:after{
  content: "";
  position: absolute;
  top: -10px;
  left: -10px;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  border: 10px solid transparent;
  border-top-color: #3498db;
}

.loader-1:before{
  z-index: 2000;
  animation: spin 1s infinite;
}

.loader-1:after{
  border: 10px solid #ccc;
}

@keyframes spin{
  0%{
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100%{
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}