/*	local.map.css */ 


body#map #header {
	height: 100px; 
}

#content {
	overflow: hidden; 	
}


#locations {
	text-align: center; 	
}
#location-details {
	text-align: left; 	
}

#merchant-notification {
	display: block; width: 100%; clear: both; box-sizing: border-box; 
	margin: 0px; text-align: center; 	
}




#map-container {
	width: 100%; height: 80vh; 
}
	#map-container.no-map {
		display: none; 
	}

ul.icon-legend {
	display: inline-block; 
	text-align: center; list-style-type: none; 
	padding: 0px; margin: 0px auto; 	
	margin-bottom: 20px; 
	box-sizing: border-box; 
}

ul.icon-legend li {
	display: inline-block; 
	margin-bottom: 10px; 
	margin-right: 10px; 
	vertical-align: middle;
	text-align: center;  
}

ul.icon-legend li:first-child {
	display: block; clear: both; width: 100%; font-weight: bolder; 	
}
ul.icon-legend li i.icon {
	width: 20px; height: 20px; opacity: 0.5; margin-right: 10px; 	
	vertical-align: middle; 
}

	#participants-list ul.icon-legend {
		padding: 0px 20px;
		width: 100%;  	
	}
	#participants-list ul.icon-legend li i.icon {
		opacity: 0.75; 
	}	

	#location-list-toggle {
		display: inline-block; text-align: center; 
		-webkit-transform: rotate(-90deg); 	
		transform: rotate(-90deg); 
		position: absolute; 
		height: 40px; 
		line-height: 40px; 
		vertical-align: middle; 
		bottom: 80px; 
		left: -75px; 	
		padding: 0px 15px; 
		background-color: #5a9c88; 
		color: #fff; 
		text-transform: uppercase; 
		font-size: 0.8rem; 
		text-decoration: none; 
	}
	#location-list-toggle:hover {
		text-decoration: none; 	
	}
		#location-list-toggle::before,
		#location-list-toggle::after {
			content: "";
			position: absolute;
			display: block;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			z-index: -1;
			background: #5a9c88;

		}		
	
		#location-list-toggle::before {
			transform-origin: top left;
			-ms-transform: skew(30deg, 0deg);
			-webkit-transform: skew(30deg, 0deg);
			transform: skew(30deg, 0deg);
		}
		#location-list-toggle::after {
			transform-origin: top left;
			-ms-transform: skew(-30deg, 0deg);
			-webkit-transform: skew(-30deg, 0deg);
			transform: skew(-30deg, 0deg);
			left: auto; right: 0px; 
		}	
	
	#participants-list {
		display: block; 
		width: 5px; 
		top: 0px; 
		right: 0px;
		box-sizing: border-box; 
		padding-top: 50px; 
		position: absolute; 
		background-color: #5a9c88; color: #fff;  
		height: 80vh;
		z-index: 400;   	
	}
		#participants-list.no-map {
			display: none; 
		}

	#participants-list.active {
		right: 0px;
		width: 300px;  
		-webkit-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;			
	}
	
		#participants-list .inner {
			display: block; width: 300px; height: 100%; 
			overflow: auto; 	
		}
		
		#participants-list h3 {
			display: block; width: 100%; box-sizing: border-box; 
			padding: 20px 10px; 
			text-align: center; font-weight: normal; 	
		}
		
		#participants-list .page-container {
			display: block; width: 100%; 
			white-space:nowrap; 
			overflow: hidden; 
			vertical-align: top; 	
			box-sizing: border-box; 	
		}
		
		#participants-list .page-container .page {
			display: inline-block; width: 100%; vertical-align: top; 
			box-sizing: border-box; 	
			white-space:normal; 
		}
		
		
			.page-container .page ul {
				padding: 20px 0px; 	
			}
			.page-container .page ul li a {
				color: #fff; text-decoration: none; 	
			}
			.page-container .page ul li.active,
			.page-container .page ul li:hover  {
				background-color: #bf3948; 
			}
			.page-container .page ul li.active a,
			.page-container .page ul li a:hover {
				text-decoration: none; 	
			}
			.page-container .page ul li > span {
					display: block; width: 100%; clear: both; 
			}
			
				span.merchant-name {
					font-weight: bolder; 
				}
				span.merchant-address {
					font-size: 0.75rem; 	
				}
				span.merchant-charity-pairing {
					font-size: 0.9rem;
					font-style: italic;  	
				}		
				span.merchant-thinkgreenwich {
					font-size: 0.9rem; 
					font-style: bold !important; 	
				}
				span.merchant-keys {
					font-style: italic;
					margin: 5px 0px;  
				}	
				span.merchant-keys span {
					display: inline-block;
					width: auto;  
				}			
				span.merchant-keys i.icon {
					width: 20px; height: 20px; 
					opacity: 0.75; 	
				}

				span.merchant-icons {
					display: block; width: 100%; margin: 10px 0px; 
				}
					span.merchant-icons .icon {
						display: inline-block; margin-left: 10px; 
						width: 25px; height: 25px; 						
					}
					span.merchant-icons .icon:first-child {
						margin-left: 0px; 
					}
		
		.page-tabs {
			display: block; width: 100%; clear: both; box-sizing: border-box; 
			text-align: center; 
		}
		.page-tabs ul {
			list-style-type: none; 	
			padding: 0px; margin: 0px;
			font-size: 0; 
			display: block; width: 100%; box-sizing: border-box; 
			text-align: center; 
		}
		.page-tabs ul li {
			display: inline-block; box-sizing: border-box; 
			font-size: 0.8rem; text-transform: uppercase; 
			margin-left: 10px; 
		}
			.page-tabs ul li.video-cat {
				display: block; 
				width: calc(100% - 20px); 
				clear: both; 
				margin: 0px auto; margin-top: 10px; 
			}
				.page-tabs ul li.video-cat:first-child {}			

		.page-tabs ul li:not(.video-cat):first-child {
			margin-left: 0px; 
		}
		.page-tabs ul li a {
			display: block; 
			width: 100%; 
			height: auto; box-sizing: border-box; 
			padding: 10px; 
			color: #bf3948;
			border: 2px solid #bf3948; 
			background-color: #fff; 
			-webkit-border-radius: 20px;
			border-radius: 20px;
			text-decoration: none; 
			text-transform: uppercase; 
			font-weight: bolder; 	
			-webkit-transition: all 500ms ease-in-out;
			transition: all 500ms ease-in-out;								 
		}
			.page-tabs ul li.video-cat a {
				padding: 5px 10px; 
			}		
		.page-tabs ul li.active a,
		.page-tabs ul li a:hover {
			background-color: #bf3948; 
			color: #fff;
			text-decoration: none; 	
		}
		
			.page ul {
				display: block; width: 100%; margin: 0px; padding: 0px; 
				list-style-type: none; 	
			}
			.page ul li {
				display: block; width: 100%; box-sizing: border-box;
				padding: 10px 20px;  		
			}
			.page ul li a {
				display: block; width: 100%; height: 100%; box-sizing: border-box; 
				padding: 0px; color: #fff; 	
			}
			
	#page-special-events ul {
		counter-reset: li;	
	}
	
	#page-special-events ul li {
		position: relative; 
		padding: 10px 20px; 
		padding-left: 40px; 	
	}
	#page-special-events ul li::before {
		/*
		content: counter(li, upper-alpha)".";
		*/
		content: counter(li, upper-alpha);
		counter-increment: li;
		display: inline-block; 
		font-size: 0.9rem;
		font-family: 'Homenaje', sans-serif;
		position: absolute; top: 10px; left: 10px;  
		width: 20px; height: 20px; background-color: #bf3948; 
		-webkit-border-radius: 20px;
		border-radius: 20px;
		color: #fff; 
		text-align: center; 
		padding: 2px 0px; box-sizing: border-box; 
	}

	#page-special-events ul li.no-count:before {
		counter-increment: none !important;
		visibility: hidden; 
	}	

	/*
	#map-container::after {
		display: block; width: 100%; height: 200px; 
		content: ""; 
		position: absolute; 
		z-index: 1000; 
		top: -95px; 
		left: 50%; 
		-webkit-transform: translateX(-50%); 
		transform: translateX(-50%); 
		background-image: url('../images/static/repeating-banner.png'); 
		background-repeat: repeat-x; 
		background-color: transparent; 
		background-size: auto;
		background-position: center center;  
		overflow: hidden; 
	}
	*/


/*	Below Map
	------------------------------------------------------------ */ 
	

#locations {
	display: block; width: 100%; clear: both; box-sizing: border-box; 
	padding: 20px; 
}
	#locations h1 {
		display: block; width: 100%; box-sizing: border-box; 
		text-align: center !important; 	
	}
	
	ul.locations-alt {
		display: block; width: 100%; clear: both; 
		box-sizing: border-box; 
		padding: 10px 0px; padding-top: 0px; list-style-type: none; 
		font-size: 0; 	
		text-align: center; 
	}
	
	ul.locations-alt li {
		display: inline-block; font-size: 1rem; 
		margin-left: 20px; 	
		text-align: center; 
	}
	
	ul.locations-alt li:first-child {
		margin-left: 0px; 	
	}
	ul.locations-alt li a {
		display: block; width: 100%; height: 100%; 
	}
	ul.locations-alt li a:hover {
		text-decoration: underline; 
	}	
	
	
	/*	Nav */ 
	#location-types ul {
		display: block; width: 100%; 
		margin: 0px; padding: 0px; 
		list-style-type: none; 
		font-size: 0; 
		text-align: center; 
	}
	#location-types ul li {
		display: inline-block; 
		font-size: 1rem; 
		position: relative; 
		margin-left: 10px;	
	}
	#location-types ul li:first-child {
		margin-left: 0px; 
	}
	
	
	#location-types ul li a {
		-webkit-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;				
		display: block; box-sizing: border-box; 
		padding: 10px 15px; 
		border: 2px solid #bf3948; 
		background-color: #fff; color: #bf3948; text-transform: uppercase; font-size: 0.75rem; 
		text-decoration: none; 
		-webkit-border-radius: 20px;
		border-radius: 20px;	
		font-weight: bolder; 
	}


	#location-types ul li a ins {
		font-size: 0.65rem; text-decoration: none; 	
	}
	
		#location-types ul li.active a,
		#location-types ul li a:hover {
			background-color: #bf3948; color: #fff; 
			text-decoration: none; 
		}	




	
	/*	Location Listings */ 
	#location-details {
		display: block; width: 100%; height: 100%; 
		box-sizing: border-box; 
		white-space: nowrap; 
		overflow: hidden;  
		font-size: 0; 
		vertical-align: top; 
	}
	#location-details ul {
		display: inline-block; width: 100%; height: 100%;
		font-size: 0; margin: 0px; padding: 20px 0px; 
		white-space: normal; vertical-align: top;
		box-sizing: border-box;  
	}
	
	#location-details ul li {
		display: inline-block; 
		font-size: 1.1rem; line-height: 120%; 
		padding: 10px; box-sizing: border-box; 
		vertical-align: top; 
		margin-left: 10px; 
		margin-bottom: 10px; 
		width: calc((100% - 20px) / 3); 
		color: #404040; text-decoration: none;
	}
	
	#location-details ul li:nth-child(3n+1){ 
		margin-left: 0px; 
	}

	#location-details ul li a span {
		display: block; width: 100%; clear: both; box-sizing: border-box; 
	}
	
		span.location-name {
			font-weight: bolder; 	
		}
		
		span.location-charity-pairing {
			font-size: 0.9rem; font-style: italic; 
			margin: 5px 0px; 
			line-height: 115%; 
		}
		
		span.location-info,
		span.location-thinkgreenwich {
			cursor: pointer !important; 
			color: #65a08e;
			font-weight: bolder; 
			font-size: 0.9rem; 	
		}
		
		span.location-info:hover,
		span.location-thinkgreenwich:hover {
			text-decoration: underline; 
		}

		a.location-tel {
			display: block; width: 100%; clear: both;
			margin-bottom: 10px; 
		}

		a.location-url {
			color: #bf3948; font-weight: bolder; 
			vertical-align: middle; 
			margin: 10px 0px; 
		}
			a.location-url i.icon {
				width: 25px; height: 25px; 
				vertical-align: middle; 
				margin-right: 10px; 
			}
		a.location-url:hover {
			text-decoration: underline; 
		}

		span.location-videos {
			color: #bf3948; font-weight: bolder; 
			vertical-align: middle; 
			margin: 10px 0px; 
		}
			span.location-videos i.icon {
				width: 25px; height: 25px; 
				vertical-align: middle; 
				margin-right: 10px; 
			}		
			span.location-videos a.video {
				color: #bf3948; font-weight: bolder;
				display: inline-block !important; 
				width: initial !important; 
				margin-left: 10px; 
			}
			span.location-videos a.video:first-child {
				margin-left: 0px; 
			}
			span.location-videos a.video:hover {
				color: #bf3948; font-weight: bolder; 
				text-decoration: underline; 
			}
		
		
		span.location-hours {
			display: block; width: 100%; margin: 10px 0px; 
			font-size: 0.95rem; 
		}

		span.merchant-activity {
			font-size: 0.95rem;
			font-weight: bolder;  
		}
			span.merchant-activity a {
				text-decoration: underline; 
			}
			
		
		span.location-keys {
			margin: 10px 0px; 	
		}
		span.location-keys span {
			display: inline-block !important; width: auto !important; 
			font-style: italic;  	
		}
			.location-keys i.icon {
				width: 20px; height: 20px; 
				opacity: 0.5; 
			}	


	ul#special-events {
		counter-reset: li;	
	}
	
	ul#special-events li {
		position: relative; 
		padding-left: 40px; 	
	}
	ul#special-events li::before {
		/*
		content: counter(li, upper-alpha)".";
		*/
		content: counter(li, upper-alpha);
		counter-increment: li;
		display: inline-block; 
		font-size: 1.4rem;
		font-family: 'Homenaje', sans-serif;
		position: absolute; 
		top: 10px; left: 0px;
		background-color: #bf3948;  
		width: 30px; height: 30px;  
		-webkit-border-radius: 30px;
		border-radius: 30px;
		color: #fff; 
		text-align: center; 
		padding: 5px 0px; box-sizing: border-box; 
	}

	ul#special-events li.no-count:before {
		counter-increment: none !important;
		visibility: hidden; 
	}	
	

/*	Google InfoWin
	------------------------------------------------------------------------------- */ 
	.infowin-wrapper {
		display: block; 
		box-sizing: border-box; margin: 0px; padding: 10px; 	
		max-width: 90vw; 
		font-size: 1rem; 		
	}
	.infowin-wrapper .infowin-title {
		font-size: 2.4rem; line-height: 120%;
		padding-bottom: 0px;  
		white-space:pre-wrap; 
	}
		ul.infowin-legend {
			display: block; width: 100%; clear: both; box-sizing: border-box; 
			text-align: center; margin: 0px; padding: 0px; 
			list-style-type: none;
			margin-bottom: 20px; 
		}
		ul.infowin-legend li {
			display: inline-block; text-align: center; 
			padding: 0px 10px; box-sizing: border-box; 	
			position: relative; padding-left: 30px; 	
			font-size: 0.9rem; font-weight: bolder; 
		}
		ul.infowin-legend li.think-greenwich {
			padding-left: 0px; 	
		}
		
			.infowin-legend li.santa-mailbox::before,
			.infowin-legend li.santa-letters::before{
				display: inline-block; width: 20px; height: 20px; 
				background-size: contain; 
				background-repeat: no-repeat; 
				background-position: center center; 
				content: ""; 
				position: absolute; 
				top: 50%; left: 0px; 
				-webkit-transform: translateY(-50%); 	
				transform: translateY(-50%); 	
				opacity: 0.5; 
				font-size: 0.8rem; 
				color: #404040; font-weight: bolder; 
			}
			.infowin-legend li.santa-mailbox::before {
				background-image: url('../images/static/icon-mailbox.svg'); 
			}			
			
			.infowin-legend li.santa-letters::before {
				background-image: url('../images/static/icon-letters.svg'); 
			}
			
		
	.infowin-wrapper .colgroup {
		
	}
		.infowin-wrapper .address {
			font-size: 1rem; 
			font-weight: bolder;  	
			margin-bottom: 20px; 
		}
		
		.promotion h6.title,
		.activity h6.title,
		.charity h6.title {
			display: block; width: 100%; box-sizing: border-box; 
			clear: both; 
			font-size: 1.4rem;
			color: #0b1f38; 
			border-bottom: 1px solid #dedede; 
			padding: 8px 0px !important; 
			margin-bottom: 8px !important;  
		}
		
		.promotion,
		.activity,
		.charity {
			margin-bottom: 20px; 	
		}

		.infowin-wrapper .holiday-specials {
			padding: 10px 0px; 
		}

	.infowin-wrapper iframe.yt-video-player {
		width: 100%; max-width: 320px; 
		min-height: 180px; height: auto; 
	}


	
	@media all and (max-width: 1024px){
	
		#location-details ul li {
			width: calc((100% - 10px) / 2); 
		}
		
		#location-details ul li:nth-child(3n+1){ 
			margin-left: 10px; 
		}		
		
		#location-details ul li:nth-child(2n+1){ 
			margin-left: 0px; 
		}		
		
	}


	@media all and (max-width: 980px){
	
		#participants-list {
			padding-top: 0px; 
		}

	}
	
	
	@media all and (max-width: 750px){
	
	
		
	}	
	
	@media all and (max-width: 680px){

		#location-types ul,
		#location-types ul li {
			box-sizing: border-box; 
		}

		#location-types ul li {
			display: block; width: 100%; max-width: 450px; margin: 0px auto !important; 
			margin-top: 10px; 
			padding: 5px 10px; 
		}
		#location-types ul li:first-child {
			margin-top: 0px; 
			margin-left: auto; 
		}

		#location-types ul li a ins {
			display: block; width: 100%; 
			clear: both; 
			font-size: 0.65rem; text-decoration: none; 	
		}		

		#location-types ul {
			text-align: center; 	
		}
		#location-details ul li {
			width: 100%; 
			max-width: 500px; 
			margin: 0px auto !important; 
			margin-bottom: 10px !important; 
		}		
	}