#main-container {
	/* display: flex;
	flex-direction: column; */
	gap: 2em;
	align-items: flex-start;
}

#lang_map {
	display: flex; 
	flex-direction: row-reverse; 
	gap: 10px; 
	margin: 20px 30px 20px 0;
	align-items: flex-start;
}

#map-container {
	display: flex;
	flex-direction: column;
	justify-content: left;
	align-items: center; 
	gap: 10px;   
	margin: 40px 30px 20px 20px;
	width: 35%;
	height: 80vh;
	/* flex: 1; */
}

#table-container {
	flex: 2;
    width: 110%;
    margin: 0px 5px 20px 40px;
}
#map {
	height: 62vh;
	width: 95%;
	z-index: 0;
	border: solid #bba992;
	border-width: 5px;
}
#svg{
	justify-content: left;
	height: 20vh;
}
#statusbar  {
	width: 98%;
	height:70px;
}

/* Responsive for screen < 1200px */
@media (max-width: 1199px) {
	#lang_map {
		flex-direction: column;
		margin: 15px 0;
	}
	
	#map-container {
        max-height: 58vh;
        height: 54vh !important;
		transform: scale(0.95);
		transform-origin: top center;
		width: 90%;
		margin: 20px auto;
	}
	#map {
		height: 45vh;
	}
	#statusbar  {
		width:88% !important;
		height: 100px;
	}

	#table-container {	
		margin: 20px auto;
		max-width: max-content;
	}
	h2 {
		text-align: center;
	}
}

@media (max-width: 967px) {
	#table-container {	
		margin: 20px auto;
		max-width: min-content;
	}
}	
.circle-extinct { fill: #8B0000; }
.circle-nearly-extinct { fill: #FF4500; }
.circle-moribund { fill: #FFA500; }
.circle-shifting { fill: #FFD700; }
.circle-threatened { fill: #9ACD32; }
.circle-not-endangered { fill: #228B22; }

#statusbar line.trait{
	stroke-width: 4; /*epaisseur de la ligne du curseur*/
	stroke:black; /*couleur de la ligne du curseur*/
}

#statusbar line.princ{
	stroke-width: 6; /*épaisseur de la ligne principale*/
	stroke:#C0C0C0; /*couleur de la ligne principale*/
}

#Glottolink {
	margin-right: 3%;
}
#Glottolink > a > img {
	width: 28px;
	border-radius: 6px;
    margin: 8px;
}
div#formheader {
    margin: 8px 10px 20px 10px;
}