.imap {
	position: relative;
	padding-bottom: 50px;
	margin-top: 50px;
	margin-bottom: 100px;
}

.imap .small {
	line-height: 0;
}

.imap .large {
	display: none;
}

.imap .large svg {
	max-height: 1170px;
}

.imap .large-wrapper .content {
	margin: 30px 20px;
}

.imap .large-wrapper .content .title {
	text-transform: uppercase;
	color: #03607f;
	font-size: 2.25em;
	margin-bottom: .2em;
	font-family: "benton-sans-extra-compressed", sans-serif;
	line-height: 1em;
	letter-spacing: .05em;
	font-weight: 900;
}

.imap .large-wrapper .content .desc {
	font-size: 1em;
	line-height: 1.5em;
	font-family: "Avenir65Medium", sans-serif;
	color: #333;
	margin-bottom: 1.25em;
}

.imap .large-wrapper .content .regions {
	max-width: 640px;
	margin: 0 auto;
}

.imap .large-wrapper .content .list {
	columns: 2;
	padding-inline-start: 15px;
	pointer-events: all;
	margin-block-start: 0;
	padding-left: 5px;
}

.imap .large-wrapper .content .region {
	font-family: "Avenir65Medium", sans-serif;
	text-transform: uppercase;
	font-size: .8em;
	line-height: 1.75em;
	flex-basis: 50%;
	cursor: pointer;
	color: #333;
	font-weight: 900;
}

.imap .large-wrapper .content .region:hover,
.imap .large-wrapper .content .region.active {
	text-decoration: underline;
}

.imap .slides {
	max-width: 640px;
	margin: 0 auto;
	box-shadow: 0 0 10px rgb(0 0 0 / 25%);
}

.imap .slides .slide {
	height: 100%;
}


.imap .slides .arrows {
	position: absolute;
}

.imap .slides .arrows .next {
	width:50px;
	height:50px;
	background: green;
	padding: 50px;

}

.imap .slide .image {
	position: relative;
	display: flex;
	justify-content: center;
}

.imap .slide .image img {
	width: 100%;
}

.imap .slide .image .title {
	position: absolute;
	bottom: 0;
	color: #fff;
	font-size: 60px;
	left: 20px;
	text-transform: uppercase;
	font-family: "benton-sans-extra-compressed", sans-serif;
	letter-spacing: .04em;
	line-height: 70px;
}

.imap .slide .info {
	background: white;
	padding: 15px 20px 50px 20px;
}

.imap .slide .info .description {
	font-size: 1em;
	line-height: 1.5em;
	font-family: "Avenir65Medium", sans-serif;
	color: #333;
}

.imap .slide .info .more {
	display: flex;
	flex-direction: row;
	background: #03607f;
	text-transform: uppercase;
	color: #fff;
	width: fit-content;
	width: -moz-fit-content;
	margin-top: 20px;
	padding: 4px 35px;
	font-size: .5em;
	text-decoration: none;
	pointer-events: all;
	vertical-align: middle;
	align-items: center;
	letter-spacing: .05em;
}

.imap .slide .info .more .link {
	font-family: 'AvenirNextLTW01-Condens_721299', sans-serif;
	font-size: 2em;
	line-height: 1.25em;
	font-weight: 600;
}

.imap .slide .info .more i {
	margin-left: 10px;
	font-size: 3em;
}


.imap .large-wrapper .arrows {
	list-style: none;
	margin-top: -75px;
}

.imap .large-wrapper .arrows .prev,
.imap .large-wrapper .arrows .next {
	top: auto;
	bottom: -25px;
	z-index: 9;
	position: absolute;
}

.imap .large-wrapper .arrows i,
.imap .large-wrapper .arrows i {
	display: flex;
	justify-content: center;
	top: auto;
	bottom: 0;
	z-index: 9;
	position: absolute;
	border-radius: 50px;
	background: #879f72;
	height: 60px;
	width: 60px;
	cursor: pointer;
	pointer-events: all;
	font-size: 1.75em;
	color: white;
	font-weight: 900;;
}

.imap .large-wrapper .arrows .prev i:before {
	padding-right: 6px;
	margin-top: -4px;
	font-size: 2em;
}
.imap .large-wrapper .arrows .next i:before {
	padding-left: 6px;
	margin-top: -4px;
	font-size: 2em;
}

.imap .large-wrapper .arrows .prev {
	left: 31%;
}

.imap .large-wrapper .arrows .next {
	right: 46%;
}

@media screen and (min-width: 375px) {
	.imap .large-wrapper .content .region {
		font-size: 20px;
	}
}

@media screen and (min-width: 640px) {
	.imap .slide .image .title {
		bottom: 10px;
		font-size: 3em;
		line-height: 1em;
	}
	
	.imap .large-wrapper .arrows .prev {
		left: 40%;
	}
	
	.imap .large-wrapper .arrows .next {
		right: 45%;
	}
}

@media screen and (min-width: 1150px) {
	.imap {
		overflow-x: visible;
		margin-top: 100px;
		margin-bottom: 50px;
	}

	.imap .small {
		display: none;
	}

	.imap .large {
		display: block;
	}

	.imap .large-wrapper {
		display: block;
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		pointer-events: none;
	}

	.imap .large-wrapper .content {
		margin: 0;
		position: absolute;
		top: 6%;
		left: 3%;
		width: 18%;
	}

	.imap .large-wrapper .content .title {
		font-size: 2.4vw;
		margin-bottom: .25vw;
		line-height: 2.4vw;
		letter-spacing: .03em;
	}

	.imap .large-wrapper .content .desc {
		font-size: 1vw;
		line-height: 1.2vw;
		margin-bottom: 1.25vw;
	}

	.imap .large-wrapper .content .list {
		padding-left: .3vw;
	}

	.imap .large-wrapper .content .region {
		font-size: 1vw;
		line-height: 1.6vw;
	}

	.imap .large-wrapper .slides {
		position: absolute;
		top: -2%;
		right: 3%;
		width: 23%;
	}

	.imap .slide .image .title-link {
		pointer-events: all;
	}

	.imap .slide .image .title {
		position: absolute;
		bottom: 6%;
		color: #fff;
		font-size: 4.25vw;
		left: 6%;
		text-transform: uppercase;
		font-family: "benton-sans-extra-compressed", sans-serif;
		letter-spacing: .02em;
		line-height: 3.5vw;
	}
	
	.imap .slide .info {
		background: white;
		padding: 1vw 1.5vw;
		height: 19vw;
	}
	
	.imap .slide .info .description {
		font-size: 1vw;
		line-height: 1.4vw;
		font-family: "Avenir65Medium", sans-serif;
		color: #333;
	}
	
	.imap .slide .info .more {
		display: flex;
		flex-direction: row;
		background: #03607f;
		text-transform: uppercase;
		color: #fff;
		width: fit-content;
		margin-top: .75vw;
		padding: .25vw 1.75vw;
		font-size: 1vw;
		text-decoration: none;
		pointer-events: all;
		letter-spacing: .05em;
	}
	
	.imap .slide .info .more .link {
		font-family: 'AvenirNextLTW01-Condens_721299', sans-serif;
		font-size: 1vw;
		line-height: 1vw;
		font-weight: 600;
	}

	.imap .slide .info .more i {
		font-size: 2vw;
	}
	
	.imap .large-wrapper .arrows {
		position: absolute;
		top: 5%;
		right: 3%;
		width: 23%;
		height: 104%;
		list-style: none;
	}

	.imap .large-wrapper .arrows .prev,
	.imap .large-wrapper .arrows .next {
		top: auto;
		bottom: 0;
		z-index: 9;
		position: absolute;
		border-radius: 50px;
		height: 3vw;
		width: 3vw;
	}

	.imap .large-wrapper .arrows .prev {
		left: 35%;
	}

	.imap .large-wrapper .arrows .next {
		right: 35%;
	}

	.imap .large-wrapper .arrows i,
	.imap .large-wrapper .arrows i {
		display: flex;
		justify-content: center;
		top: auto;
		bottom: 0;
		z-index: 9;
		position: absolute;
		border-radius: 50px;
		height: 2.75vw;
		width: 2.75vw;
		cursor: pointer;
		pointer-events: all;
		font-size: 3vw;
		color: white;
		font-weight: 900;
	}

	.imap .large-wrapper .arrows .prev i:before {
		padding-right: 6px;
		margin-top: -4px;
		font-size: 3vw;
	}

	.imap .large-wrapper .arrows .next i:before {
		padding-left: 6px;
		margin-top: -4px;
		font-size: 3vw;
	}
}

@media only screen and (min-width: 1200px){
	.imap .slide .content {
		padding: 35px 25px;
	}

	.imap .slide .forecast {
		padding: 10px 25px;
		max-width: 500px;
	}
}

/* svg styles */
#sumner,
#puyallup,
#lakewood,
#dupont,
#crystal,
#gigharbor,
#fife,
#tacoma,
#mtrainier_1_ {
	cursor: pointer;
}

#sumner:hover rect,
#puyallup:hover rect,
#lakewood:hover rect,
#dupont:hover rect,
#crystal:hover rect,
#gigharbor:hover rect,
#fife:hover rect,
#tacoma:hover rect,
#mtrainier_1_:hover rect {
	display: block;
	fill: #03607f;
}

#sumner:hover g,
#puyallup:hover g,
#lakewood:hover g,
#dupont:hover g,
#crystal:hover g,
#gigharbor:hover g,
#fife:hover g,
#tacoma:hover g,
#mtrainier_1_:hover g  {
	fill: #03607f;
}

.imap .poi.active rect {
	display: block;
	fill: #03607f;
}

.imap .poi.active g {
	fill: #03607f;
}

.imap .large .st0{fill:#A6E2DF;}
.imap .large .st1{fill:#81A06D;}
.imap .large .st2{display:none;fill:none;}
.imap .large .st3{fill:none;}
.imap .large .st4{opacity:0.6;fill:#FFFFFF;enable-background:new    ;}
.imap .large .st5{opacity:0.75;}
.imap .large .st6{fill:#FFB127;}
.imap .large .st7{fill:#FFFFFF;}
.imap .large .st8{fill:#161C7C;}
.imap .large .st9{fill:#B12028;}
.imap .large .st10{fill:#536646;}
.imap .large .st11{opacity:0.54;}
.imap .large .st12{fill:url(#SVGID_1_);}
.imap .large .st13{fill:url(#SVGID_2_);}
.imap .large .st14{fill:url(#SVGID_3_);}
.imap .large .st15{fill:url(#SVGID_4_);}
.imap .large .st16{opacity:0.21;}
.imap .large .st17{opacity:0.2;}
.imap .large .st18{fill:#446331;}
.imap .large .st19{fill:#775113;}
.imap .large .st20{display:none;}
.imap .large .st21{display:inline;}
.imap .large .st22{fill:#202020;}
.imap .large .st23{fill-rule:evenodd;clip-rule:evenodd;}
.imap .large .st24{fill:#FFFFFF;fill-opacity:0;}

.imap .small .st0{fill:#A6E2DF;}
.imap .small .st1{fill:#81A06D;}
.imap .small .st2{display:none;fill:none;}
.imap .small .st3{fill:none;}
.imap .small .st4{opacity:0.6;fill:#FFFFFF;enable-background:new    ;}
.imap .small .st5{opacity:0.75;}
.imap .small .st6{fill:#FFB127;}
.imap .small .st7{fill:#FFFFFF;}
.imap .small .st8{fill:#161C7C;}
.imap .small .st9{fill:#B12028;}
.imap .small .st10{fill:#536646;}
.imap .small .st11{opacity:0.54;}
.imap .small .st12{fill:url(#SVGID_1_);}
.imap .small .st13{fill:#775113;}
.imap .small .st14{display:none;}
.imap .small .st15{display:inline;}
.imap .small .st16{fill:#202020;}
.imap .small .st17{fill-rule:evenodd;clip-rule:evenodd;}
.imap .small .st18{fill:#FFFFFF;fill-opacity:0;}