html, body {
	height: 100%;
	margin: 0;
	display: flex;
	flex-direction: column;
}
main {
	flex: 1 0 auto;
}
.main-layout {
	display: flex;
	flex-wrap: nowrap;
}
.main-layout .left {
	width: 20%;
}
.main-layout .center {
	width: 60%;
}
.main-layout .right {
	width: 20%;
}

header .logo{
	max-height:40px;
	height:auto;
}
.footer .logo {
	max-height: 40px; 
	width:auto;
}

.map-rodals{
	height: 100%;
}

.mapbox-improve-map, .mapbox-improve-map + a, .mapboxgl-ctrl-logo{
	display:none !important;
}
.symbol {
	border-radius: 50%;
	display: inline-block;
	height: 10px;
	margin-right: 3px;
	width: 10px;
	top: -1px;
	position:relative;
}
.symbol-area {
	border-radius: 50%;
	display: inline-block;
	height: 15px;
	margin-right: 3px;
	width: 15px;
	top: 1px;
	position:relative;
	
}

.simbolFl svg {
				width: 15px;
				height: 15px;
				margin-right: 2px;
				top: -2px;
				position:relative;
			}
input[type="checkbox"]
{
	margin-right:3px;
}
.image-container {
	position: relative;
	cursor: pointer;
}
.expand-arrow {
	position: absolute;
	top: 0px;
	right: 4px;
	font-size: 20px;
	color: black;
	pointer-events: none;
}
.legend-qf {
	display: flex;
	gap: 20px;
	align-items: center;
	font-size: 16px;
}
.legend-item-qf {
	display: flex;
	align-items: center;
	gap: 8px;
}
.legend-rd {
	display: flex;
	gap: 3em;
	align-items: center;
	font-size: 24px;
	justify-content: center;
}
.legend-item-rd {
	display: flex;
	align-items: center;
	gap: 0.3em;
}
.box {
	width: 32px;
	height: 32px;
	border: 1px solid #000;
	flex-shrink: 0;
}

.future-tree {
	background-color: #6c8ed4;
	width: 16px;
	height: 16px;
	border: 1px solid #000;
}
.to-cut-tree {
	background-color: #f4a261;
	width: 16px;
	height: 16px;
	border: 1px solid #000;
}
.finalitzat{
	background-color: #f2f2f2;
}
.execucio{
	background-color: #fff2cc;
}
.pendent{
	background-color: #f7caac;
}
.boto-inici:hover{
	  background-color: black !important;
	  color: white !important;
}
#dadesEstat {
	border-collapse: collapse;
	border: 1px solid black !important;
}

#dadesEstat th,
#dadesEstat td {
	padding: 0.25rem;
	font-size: 0.8rem;
	border: 1px solid black;
}
.navIcon
{
	height:14px;
}
td.tFinalitzat{
	background-color:#e2efda;
}
td.tEnexecució{
	background-color:#ffff00;
}
td.tPendent{
	background-color:#ff0000;
}
.rodal-card {
	transition: filter 0.2s ease-in-out;
}

.rodal-card:hover {
	filter: brightness(95%);
	cursor: pointer;
}
@media (min-width: 992px) {
	.custom-col-20 {
		flex: 0 0 20%;
		max-width: 20%;
	}
	.custom-col-60 {
		flex: 0 0 60%;
		max-width: 60%;
	}
}
@media (max-width: 992px) {
	.map-rodals{
		aspect-ratio:1/1;
		width:100%;
		height:auto;
	}
	.legend-item-rd{
		font-size: 16px;
	}
}