

@media (max-width:992px)
	{#UncertaintiesImgMap {display: none;}}

@media (min-width:991px)
	{#UncertaintiesImgMap-S {display: none;}}

h4 {font-family:'Noto Sans display', sans-serif!important;
	text-transform: uppercase;
	letter-spacing: 1px;
	}

#UncertaintiesImgMap p, h4 {margin: 0;}
#UncertaintiesImgMap-S p, h4 {margin: 0;}

#UncertaintiesList li {color: #777; margin-left:25px; margin-top:5px;}
#UncertaintiesList .bold {font-weight:700; color: #555!important;}

#UncertaintiesList h4{
	color: white;
	padding: 5px 10px;
}

.considered{
	font-family:'Noto Sans display', sans-serif;
	font-size: 10pt;
	font-weight: 500;
	font-style: italic;
	letter-spacing: .2px;
	margin-top:12px!important;
}

.not-considered{
	font-family:'Noto Sans display', sans-serif;
	font-size: 10pt;
	font-style: italic;
	letter-spacing: .2px;
	color: #B1B5B8; 
	margin-top:12px!important;
}

.type-sm{
	font-size:10pt;
	font-style: italic;
	font-family:'Noto Sans display', sans-serif!important;
}

.color-catch{color:#896BA5;} /* purple */
.color-env{color:#AFCA0B;} /* limegreen */
.color-lht{color:#D682B5;} /* rose */
.color-model{color:#00ADB1;} /* turquoise */
.color-soc-ec{color:#F39655;} /* orange */
.color-pop-st{color:#F6CA21;} /* yellow */
.color-ref-pts{color:#931813;} /* brown */

.map-popup {
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 99;
	width: 60%;
	padding: 1rem;
	background-color: #fff;
	transition: all 300ms ease-in;
	transform: translate(-50%,-50%);
	box-shadow: 0 0 24px rgba(0,0,0,0.22);
	opacity: 0;
	visibility: hidden;
	text-align: left;
}


.map-popup > *:first-child { margin-top: 0; }
.map-popup > *:last-child { margin-bottom: 0; }
.map-popup.open {
	opacity: 1;
	visibility: visible;
}

.marker {
	position: absolute;
	z-index: 1;
	display: inline-block;
	width: 36px;
	height: 36px;
	line-height: 36px; /* position of number in circle */
	font-family:'Noto Sans display', sans-serif;
	text-align: center;
	text-decoration: none;
	border-radius: 50%;
	transition: all 300ms;
}

.marker-catch-C {background-color: #896BA5; color: #fff;}
.marker-catch-NC {width: 24px; height: 24px; line-height: 24px; 
	background-color: white; color: #896BA5; outline: 2px solid #896BA5;}

.marker-env-C {top: 30%; left: 20%; background-color: #AFCA0B; color: #fff;}
.marker-env-NC {top: 30%; left: 20%; width: 24px; height: 24px; line-height: 24px; 
	background-color: white; color: #AFCA0B; outline: 2px solid #AFCA0B;}

.marker-lht-C {top: 30%; left: 20%; background-color: #D682B5; color: #fff;}
.marker-lht-NC {top: 30%; left: 20%; width: 24px; height: 24px; line-height: 24px; 
	background-color: white; color: #D682B5; outline: 2px solid #D682B5;}

.marker-model-C {top: 30%; left: 20%; background-color: #00ADB1; color: #fff;}
.marker-model-NC {top: 30%; left: 20%; width: 24px; height: 24px; line-height: 24px; 
	background-color: white; color: #00ADB1; outline: 2px solid #00ADB1;}

.marker-soc-ec-C {top: 30%; left: 20%; background-color: #F39655; color: #fff;}
.marker-soc-ec-NC {top: 30%; left: 20%; width: 24px; height: 24px; line-height: 24px; 
	background-color: white; color: #F39655; outline: 2px solid #F39655;}

.marker-pop-st-C {top: 30%; left: 20%; background-color: #F6CA21; color: #fff;}
.marker-pop-st-NC {top: 30%; left: 20%; width: 24px; height: 24px; line-height: 24px; 
	background-color: white; color: #F6CA21; outline: 2px solid #F6CA21;}

.marker-ref-pts-C {top: 30%; left: 20%; background-color: #931813; color: #fff;}
.marker-ref-pts-NC {top: 30%; left: 20%; width: 24px; height: 24px; line-height: 24px; 
	background-color: white; color: #931813; outline: 2px solid #931813;}


@media only screen and (min-width:48em) {
	.map-item {
	position: absolute;
	width: 36px;
    height: 36px;
    }
	
	
    .map-item .marker {
		top: auto;
		left: auto;
    }
 
	/* CATCH */
	.map-item1 {top: 17%;left: 77%;}
	.map-item2 {top: 33.5%;left: 91.7%;}
	.map-item3 {top: 33.5%;left: 94%;}
	.map-item4 {top: 1%;left: 67%;}
	.map-item5 {top: 66%;left: 3%;}
	.map-item6 {top: 40%;left: 30%;}
	.map-item7 {top: 72%;left: 53.5%;}

	/* ENVIRONMENTAL */
	.map-item8 {top: 11%;left: 6%;}
	.map-item9 {top: 67.5%;left: 86.5%;}

	/* LIFE HISTORY TRAITS */
	.map-item10 {top: 58.5%;left: 50.8%;}
	.map-item11 {top: 76%;left: 75%;}
	.map-item12 {top: 72%;left: 55.8%;}
	.map-item13 {top: 72%;left: 58.1%;}
	.map-item14 {top: 72%;left: 60.4%;}
	
	/* MODEL */
	.map-item15 {top: 11%;left: 72.5%;}
	.map-item16 {top: 5.3%;left: 65.5%;}
	.map-item17 {top: 5.3%;left: 68.5%;}
	.map-item18 {top: 5.3%;left: 71.5%;}
	
	/* SOCIO-ECONOMIC */
	.map-item19 {top: 11%;left: 78.7%;}
	.map-item20 {top: 11%;left: 81%;}
	.map-item21 {top: 11%;left: 83.3%;}
	.map-item22 {top: 11%;left: 85.6%;}
	.map-item23 {top: 42%;left: 79%;}
	.map-item24 {top: 11%;left: 87.9%;}
	.map-item25 {top: 11%;left: 90.2%;}
	.map-item26 {top: 11%;left: 92.5%;}
	.map-item27 {top: 11%;left: 94.8%;}
	
	/* POPULATION STRUCTURE */
	.map-item28 {top: 57%;left: 88.5%;}
	.map-item29 {top: 75.6%;left: 55.8%;}
	.map-item30 {top: 75.6%;left: 58.1%;}
	.map-item31 {top: 75.6%;left: 60.4%;}
	.map-item32 {top: 75.6%;left: 62.7%;}
	.map-item33 {top: 75.6%;left: 65%;}
	.map-item34 {top: 67.5%;left: 78.6%;}
	.map-item35 {top: 66%;left: 44%;}
	
	/* REFERENCE POINTS */
	.map-item36 {top: 11%;left: 75.6%;}
	
  
	.map-popup {
    position: absolute;
    left: 58px;
    width: 280px;
    transform: translateY(-50%);
  }
	.map-popup:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -16px;
    margin-top: -16px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 16px 16px 0;
    border-color: transparent #fff transparent transparent;
  }
  
	.map-popup.edge {
    	left: auto;
    	right: calc(100% + 24px);
	}
	.map-popup.edge:before {
    	left: auto;
    	right: -16px;
    	border-width: 16px 0 16px 16px;
    	border-color: transparent transparent transparent #fff;
	}
}