@charset "UTF-8";


/*CSS Document */

/*
/*    SECTION 1
/*	  1.1 – General
/*    1.2 - Map Setup
/*    1.3 - Pop Up Typography
/*		1.4 – Pop Up Structure

/* =================== */
/*      SECTION 1      */
/* =================== */
/* 1.1 - General */

html:focus{
	-webkit-tap-highlight-color: transparent;
	outline: none;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
}

body{
	/*background-color: #063046;*/
	-webkit-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
}

img{
	height: 100%;
  width: auto;
	vertical-align: middle;
}

/*SBK START CREDITS*/

.creditwrapper {
	margin-top: 40px;
	margin-left: 75px;
	margin-right: 10px;
}

p.credits{
	font-family: calibri, arial, helvetica, sans-serif;
	font-weight: 400;
	font-size:16px;
	color: #fff;
}

a.credits{
	font-family: calibri, arial, helvetica, sans-serif;
	font-weight: 600;
	font-size:16px;
	color: #fff;
}

/*SBK END*/

/* 1.2 - Map Setup */

#mapwrapper{
	position:relative;
	height: 80vh;
	margin-top: 40px;
	margin-left: 10px;
	margin-right: 10px;
	max-width: 2000px;
}

#map{
	position:absolute;
	top:0;
	bottom:0;
	width:100%;
}

@media (min-width: 786px){
	#mapwrapper{
		height: 85vh;
		margin-left: 80px;
		margin-right: 80px;
/*		margin-bottom: 40px;*/
	}
}

@media (min-width: 2000px){
	#mapwrapper{
		margin-left: unset;
		margin-right: unset;
		margin:auto;
		max-width: 2000px;
	}
}



/* 1.3 - Pop Up Typography */

h1.popuptitle{
	font-family: haboro-serif, Georgia, Times, serif;
	font-size:22px;
	color:#681e28;
	line-height: 1;
	font-weight: 600;
}

p.popupdescription{
	font-family: calibri, arial, helvetica, sans-serif;
	font-weight: 400;
	font-size:16px;
	color: #231f20;
}

p i{
	font-style: italic;
}



ul.popuplist li{
	font-family: haboro-serif, Georgia, Times, serif;
	font-size:18px;
	color: #231f20;
	font-weight: 600;
	line-height: 1.3;
}

ul.popuplist li a{
	text-decoration: none;
	color: #231f20;
}

ul.popuplist li a:hover{
	color:#681e28;
}

@media (min-width: 786px){

	h1.popuptitle{
		font-size:26px;
	}

}

/* 1.4 - Pop Up Structure and Styling */

.mapboxgl-popup{
	-webkit-transform: unset !important;
	-ms-transform: unset !important;
	transform: unset !important;
	top:10px !important;
	left:10px !important;
	right:10px !important;
	bottom:60px !important;
	max-width: unset !important;
}

.mapboxgl-popup-content{
	padding:15px !important;
	overflow-y: auto;
	overflow-x: hidden;
	border-radius: 0px !important;
	border: 0.5px solid #231f20;
	background-color: #eeebe4 !important;
	-webkit-box-shadow: unset !important;
	box-shadow: unset !important;
}

.mapboxgl-popup-anchor-right, .mapboxgl-popup-anchor-left{
	flex-direction: column !important;
}

.mapboxgl-popup-tip{
	display: none !important;
}

.mapboxgl-popup-content .popupheader .popupimage{
	width:250px;
	height:150px;
	margin-bottom:5px;
}

.mapboxgl-popup-content .popuptitle, .mapboxgl-popup-content .sitedescription, .mapboxgl-popup-content .popuplist{
	margin-top:15px;
}

.mapboxgl-popup-close-button{
	font-size: 20px;
}

.mapboxgl-popup-close-button:hover{
	background-color: transparent !important;
	color: #681e28;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #eeebe4;
	border-left: 0.5px solid #231f20;
}

::-webkit-scrollbar-thumb {
  background: #bbb5ad;
	/* border-radius: 10px; */
	border-left: 0.5px solid #231f20;
	/* border-top: 0.5px solid #231f20;
	border-left: 0.5px solid #231f20; */
}


@media (min-width: 768px){

	.mapboxgl-popup-content{
		width: 240px;
		max-height: 550px;
	}


	.mapboxgl-popup{
		right:0px !important;
	}

}

@media (min-width: 1000px){

	.mapboxgl-popup{
		top:20px !important;
		left:20px !important;
	}

.mapboxgl-popup-content{
	width: 300px;
}

.mapboxgl-popup-anchor-right{
	flex-direction: row-reverse;
}

}

@media (min-width: 1300px){
	.mapboxgl-popup-content{
		width: 400px;
	}

}