/****************** Map Styles ********************/

#google-map-legend { background-color: #f9f7f8; position: absolute; box-sizing: border-box; padding: 20px; font-family: Arial; font-size: 15px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: 1px; color: #20415b; bottom: 43px; left: 43px; text-align: left;}
#google-map-legend > div:not(:last-of-type) {margin-bottom: 8px;}
#google-map-legend > div::before {display: inline-block; content: ''; width: 13px; height: 13px; border-radius: 13px; margin-right: 13px;}
#google-map-legend > div.production::before {background-color: #e16928;}
#google-map-legend > div.exploration::before {background-color: #7db739;}
#google-map-legend > div.development::before {background-color: #9ba2a1;}
@media screen and (max-width: 900px) {
	.map-container {display: none;}
}



/****************** Popup styles ******************/

.infoBox {
	-webkit-box-shadow: 4px 8px 26px -1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 4px 8px 26px -1px rgba(0, 0, 0, 0.3);
	box-shadow: 4px 8px 26px -1px rgba(0, 0, 0, 0.3);
	color: #000;
	font-size: 18px;
	line-height: 18px;
	position: relative;
	transform: translate(0px, -25px) !important;
	width: 214px;
}
.infoBox::after {
	content: '';
	border-top: solid 12px #19262e;
	border-right: solid 12px transparent;
	border-left: solid 12px transparent;
	position: absolute;
	left: calc(50% - 12px);
	bottom: -12px;
}
.infoBox.exploration::after {border-top: solid 12px #7db739;} 
.infoBox.production::after {border-top: solid 12px #e16928;} 
.infoBox.none::after {border-top: solid 12px #e16928;} 
.infoBox.development::after {border-top: solid 12px #9ba2a1;} 
.infoBox.turkey::after {border-top: solid 12px #ffffff;} 

@media screen and (max-width: 700px) {
	.infoBox {
		transform: translate(40px, 35px) !important;
	}
}
@media screen and (max-width: 450px) {
	.infoBox {
		transform: translate(25px, 35px) !important;
	}
}
.infoWindow {}

.infoWindow .type {
  display: block;
  background-color: #d8d8d8;
  text-transform: uppercase;
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 1px;
  color: #000000;
  text-align: center;
  padding: 5px;
  box-sizing: border-box;
}

.infoWindow .project {
  display: block;
  text-align: center;
  text-transform: capitalize;
  font-family: Arial;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 1px;
  color: #ffffff;
  padding: 5px;
  box-sizing: border-box;

  background-color: #9ba2a1; /* default for everything else */
}

.infoWindow.exploration .project {
  background-color: #7db739;
}

.infoWindow.production .project {
  background-color: #e16928;
}

.infoWindow.none .project {
  background-color: #e16928;
}

.infoWindow.turkey .project.expand {
  background-color: #ffffff;
  margin-top: 0;
  font-family: Arial;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.88px;
  text-align: center;
  color: #000000;
  cursor: pointer;
}
.infoBox.turkey .infoWindow > .turkey-popup {opacity: 0; pointer-events: none; height: 0px;}
.infoBox.turkey.open .infoWindow > .type, .infoBox.turkey.open .infoWindow > .project {display: none;}
.infoBox.turkey.open .infoWindow > .turkey-popup {opacity: 1; pointer-events: all; height: auto;}
.infoBox.turkey .infoWindow > .turkey-popup > div {font-family: Arial; font-size: 16px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: 1px; text-align: center; color: #ffffff; box-sizing: border-box; text-align: center; padding: 5px;}
.infoBox.turkey .infoWindow > .turkey-popup > div a {color: #ffffff;}
.infoBox.turkey .infoWindow > .turkey-popup > div.exploration {background-color: #7db739;}
.infoBox.turkey .infoWindow > .turkey-popup > div.production {background-color: #e16928;}
.infoBox.turkey .infoWindow > .turkey-popup > div.development {background-color: #9ba2a1;} 
.infoBox.turkey .infoWindow > .turkey-popup > div.type {font-family: Arial; font-size: 15px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: 1px; text-align: center; color: #000000; text-align: center; text-transform: uppercase;}
.infoBox.turkey.open::after {border-top: solid 12px #7db739;} 
/*.infoBox.open .content, .infoBox.open .project-link {height: initial; opacity: 1; pointer-events: all;}
.infoBox.open img {opacity: 1;}
.infoBox.open .infoWindow {padding: 31px 0px 18px 0px;}
.infoBox.open .content {margin: 20px 0px 20px 0px;}
.infoBox.open .expand-note {opacity: 0; height: 0; pointer-events: none;}*/