﻿:root {
	/* --primary-color: rgba(); */
}

* {
	margin: 0;
	padding: 0;
	font-family: "Lato", sans-serif;
	font-weight: 400;
	/* outline: 1px solid red !important; */
}

@page {
	margin: 0;
	size: landscape;
}

body>* {
	-webkit-print-color-adjust: exact;
	color-adjust: exact;
	margin: 0;
	padding: 0;
}

body * {
	box-sizing: border-box;
	/* display: none; */
}

body,
.container,
.container>div,
#page_section {
	display: block !important;
}


#spinner {
	display: none !important;
}

body {
	/* padding: 10px; */
	padding-bottom: 0;
	position: relative;
}

.container,
#page_wrapper,
#page_section,

/* #main-content *, */
.printable * {
	display: block;
}

#mapScreenshot {
	object-fit: cover;
	height: 15%;
	width: 45%;
	position: absolute;
	right: 4%;
	top: 50%;
	border-radius: 4px;
	border: 1px solid rgba(233, 233, 233, 0.8);
}

#allDrawnShapeArea,
.drawTools,
.gmnoprint {
	display: none !important;
}

/* #main-content {
	position: absolute !important;
	display: flex !important;
	justify-content: center;
	align-items: center;
	width: 45%;
	height: 16%;
	bottom: 101vh;
	right: 4%;
	overflow: hidden;
	clip-path: inset(0 0 25px 0 round 6px);
} */

/* #mapArea,
#mapContainer {
	width: 100%;
	height: 100% !important;
  display: block !important;
} */
#report-container {
	position: relative;
	height: 700px;
	width: 1000px;
	background: silver !important;
}

.container,
#page_wrapper,
#page_section,
#main-content {
	/* border-radius: 10px; */
}

.printable {
	display: block !important;
	width: 100%;
	height: auto;
}

.page {
	height: 100vh;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	background: white !important;
	/* margin-bottom: 10px; */
	/* box-shadow: 0 1px 3px #666666e0; */
}

.header {
	/* background: pink !important; */
	display: flex;
	width: 100%;
	align-items: center;
	/* border: 1px solid black; */
	justify-content: space-between;
	padding: 2% 3%;
	height: 100px;
}

.content-wrapper {
	height: 100%;
	width: 100%;
	padding: 0 3%;
	overflow: hidden;
	/* background: blueviolet !important; */
}

.report-title {
	/* font-family: "Montserrat"; */
	border-left: 8px solid teal;
	padding-left: 15px;
	font-size: 36px;
	font-weight: 600;

}

#report-date {
	font-size: 13px;

}

.report-main-title {
	display: flex;
	flex-direction: column;
	font-size: 36px;

	/* align-items: baseline; */
}

.report-header-logo {
	max-height: 60px;
	max-width: 250px;

}

#pie-chart {
	height: 100%;
}

#income-chart,
#age-chart,
#pie-chart,
#price-chart {
	max-height: 100%;
	max-width: 100%;

	/* border: 1px solid black !important; */
}

.report-color-key {
	height: 15px;
	width: 30px;
	border: 1px solid silver;
	background: yellow !important;
	margin-left: auto;
}

.chart-title-container {
	margin-bottom: 10px !important;
}

.chart-title {
	/* font-size: 16px; */
	padding: 10px 0;
}

.half-grid {
	width: 100%;
	height: 100%;
	display: grid;
	z-index: 999;
	grid-template-columns: 1fr 1fr;
	background: yellow !important;
}

.four-column {
	/* background: blueviolet !important; */
	/* border: 1px solid black; */
	width: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	column-gap: 15px;
	height: fit-content;

	/* background: yellow !important; */
}

.three-column {
	/* background: blueviolet !important; */
	width: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	height: fit-content;
	margin-top: 10px;
}

.gm-style div>img {
	display: block !important;
	position: absolute;
}

.progress-ring__circle {
	transform: rotate(-90deg);
	transform-origin: 50% 50%;
	box-shadow: 0 1px 3px #a1a1a1b8;
	border: none;
}

.progress-ring {}

.progress-circle {
	position: relative;
	height: fit-content;
	width: fit-content;
}

.progress-circle-container {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
	position: relative;

	/* box-shadow: inset 0 1px 3px rgba(163, 163, 163, 0.67) !important; */
}

.title-middle-aligned {
	display: flex;
	font-size: 14px;
	margin-bottom: 15px;
	color: #b3b3b3 !important;
}

#ring1-text,
#ring2-text,
#ring3-text {
	/* display: none; */
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ring-percent {
	/* color: #57befa !important; */
	font-size: 13px;
	opacity: 0.5;
}

.ring-value,
.secondary-ring {
	color: #2c2c2c !important;
	font-weight: bold;
	font-size: 24px;
	padding: 0 !important;
	margin: 0 !important;
}

.ring-total {
	color: silver !important;
	font-size: 12px;
}

.ring-footer {
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-top: 10px;

}

.ring-footer-item {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ring-footer-value {
	font-size: 12px;
}

.ring-footer-title,
.column-undertext {
	font-size: 8px;
	color: #b3b3b3 !important;
}

svg {
	filter: drop-shadow(0 2px 2px #66666654);
}

.map-container {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

#map-row {
	padding-top: 25px;
}

.column-title {
	display: flex;
	font-size: 14px;
	color: #b3b3b3 !important;
	margin-bottom: 5px;
	text-align: center;
}

.typical-value,
.typical-income {
	font-size: 14px;
}

#report-filters *,
.search-queries {
	font-size: 12px;
}

.search-title {
	display: flex;
	flex-direction: row;
	/* font-size: 24px; */
}

.filters {
	margin-top: 15px !important;
}

.cover-image {
	background-position: right !important;
}

.flex-column {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 5px;
}

.underlined-title {
	padding: 10px 0;
	border-bottom: 1px solid rgba(163, 163, 163, 0.67);
	margin-bottom: 20px;
}

.normal-text {}

h3 {
	margin: 0 !important;
}

#ring-row {
	height: 35%;
}

/* custom scrollbar */
::-webkit-scrollbar {
	width: 20px;
}

::-webkit-scrollbar-track {
	background-color: white;
	/* background-color: transparent; */
}

::-webkit-scrollbar-thumb {
	background-color: #cecece;
	border-radius: 20px;
	border: 6px solid transparent;
	background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
	background-color: #bfbfbf;
}

#footer-tag {
	top: 32%;
}

#footer-tag2 {
	top: 65.5%;
}

#footer-tag3 {
	top: 99%;
}

.column-content {
	margin-top: 7px;
}

.page-status {
	height: 10px;
	width: 10px;
	background: silver;
	border-radius: 10px;
}

#pieSection {
	height: 91% !important;
}

#priceBracketSection,
#incomeSection,
#ageSection {
	height: fit-content !important;
}

.three-column {
	/* transform: translateY(-26px); */
}

.three-column>div:not(:last-child) {
	grid-gap: 10px;
}

.owned-outright-selected,
.owner-ocupied-selected,
.private-rental-selected,
.social-rental-selected,
.mortgaged-selected,
.social-grade-A-selected,
.social-grade-B-selected,
.social-grade-C1-selected,
.social-grade-C2-selected,
.social-grade-D-selected,
.social-grade-E-selected {
	font-size: 14px !important;
}

.owned-outright-percent,
.owner-ocupied-percent,
.private-rental-percent,
.social-rental-percent,
.mortgaged-percent,
.social-grade-B-percent,
.social-grade-A-percent,
.social-grade-C1-percent,
.social-grade-C2-percent,
.social-grade-D-percent,
.social-grade-E-percent {
	font-size: 12px !important;
}

.owned-outright-total,
.owner-ocupied-total,
.private-rental-total,
.social-rental-total,
.mortgaged-total,
.social-grade-A-total,
.social-grade-B-total,
.social-grade-C1-total,
.social-grade-C2-total,
.social-grade-D-total,
.social-grade-E-total {
	font-size: 12px !important;
}