@charset "utf-8";
/* CSS Document */

.map-holder{
	width:713px;
	height:544px;
	border:2px solid #000;
	background-size:contain !important;
	background:url(https://www.weber.edu/wsuimages/GetIntoWeber/map.jpg) no-repeat;
	position:relative;
	overflow:inherit;
}
.map-holder li{
	list-style:none;
}
.spot-1{position:absolute; top:400px; left:300px;}
.spot-2{position:absolute; top:340px; left:270px;}
.spot-3{position:absolute; top:270px; left:334px;}
.spot-4{position:absolute; top:360px; left:190px;}
.spot-5{position:absolute; top:240px; left:250px;}
.spot-6{position:absolute; top:150px; left:155px;}
.spot-7{position:absolute; top:143px; left:273px;}
.spot-8{position:absolute; top:43px; left:290px;}
.spot-9{position:absolute; top:143px; left:373px;}
.spot-10{position:absolute; top:300px; left:290px;}
.f-dropdown{
	position:relative;
	display:none;
	max-width:500px !important;
	width:350px;
	padding:20px;
}
.f-dropdown h2{
	font-size:30px;
}

.play {
  width: 30px;
  height: 30px;
  background: red;
  border-radius: 100%;
  margin: 0 auto;
  cursor: pointer;
  padding:0 !important;
  border: 2px solid #fff;
  box-shadow: 0px 0px 0px 2px rgba(255,0,0,0.5);
  font-size:12px;
  font-weight:bold;
}
.play:hover{
	background: red;
	box-shadow: 0 0 0 5px hsla(210, 76%, 57%, 0.5);
}
.played{
	background: black;
	border: 2px solid #fff;
	box-shadow: 0 0 0 3px hsla(210, 76%, 57%, 0.5);
}
.play:focus {
	background: black;
	outline: 0;
	box-shadow: 0 0 0 3px hsla(210, 76%, 57%, 0.5);
}

.play::after {
  content: '';
  display: inline-block;
  position: relative;
  top: .1rem;
  left: .1rem;
  border-style: solid;
  border-width: 7px 0 7px 12px;
  border-color: transparent transparent transparent white;
}

.start-here{
	position:absolute;
	top:437px; left:275px;
	background: #492365;
	color:#fff;
	font-weight:bold;
	text-align:center;
	font-size:12px;
	width:80px;
	border-radius: 15px;
	margin: 0 auto;
	padding:0 !important;
	border: 2px solid #fff;
	box-shadow: 0px 0px 0px 2px rgba(73,35,101,0.5);
}

.key{
	background:rgba(255,255,255,.8);
	width:200px;
	border:2px solid #000;
	position:absolute;
	right:10px;
	top:10px;	
	padding:10px 0 0 0;
}

.key ol li{
	margin-left:10px;
	list-style:inherit;
	font-size:14px;
}

.key button{
	padding:0;
	margin:0;
	color:#492365;
	background-color:transparent;
	font-size:14px;
}
.key button:hover{
	color:#7f56c5;
}
.dropdown-content h2{
	font-size:20px;
	font-weight:bold;
}
.key h3{
	font-size:18px;
	font-weight:bold;
	margin:0 0 10px 16px;
	color:#000;
}
.lang{font-size:16px;}

.lang li{
	margin:7px 0px;
}

.lang a{
	padding:5px;
}
.lang a:hover{
	background:#FFFEB6;
}