
	.opening-times
	{
		display: grid;	
		grid-gap: var(--grid-gap-standard-horizontal) var(--grid-gap-extrawide-vertical);
	}	
	
	.opening-times > .standard-grid
	{
		grid-template-columns: repeat(auto-fit, minmax(308px, 0.3fr));
	}
	
	.opening-times h2
	{
		font-size: var(--font-size-title);
		color: var(--colour-main-text);		
		padding: 16px var(--padding-main-horizontal);		
	}
	
	.opening-times > .standard-grid	
	{						
		padding: 0px var(--padding-main-horizontal);
	}	
	.opening-times > .standard-grid > div
	{
		scroll-snap-align: center;
	}
	.opening-times > .standard-grid img
	{
		border-radius: var(--radius-tiny);
		width: 100%;
		min-height: 184px;
		object-fit: cover;		
	}
	.opening-times > .standard-grid h1
	{
		text-align: left;
		line-height: 2;
		font-size: 24px;
		line-height: 24px;
		padding: 16px 0px;
	}
	.opening-times > .standard-grid table
	{
		width:100%;		
	}
	.opening-times > .standard-grid table tr
	{
		height: 38px;		
	}
	.opening-times > .standard-grid table tr:nth-child(odd)
	{
		background: var(--colour-base);
	}
	.opening-times > .standard-grid table tr td
	{
		color: var(--colour-secondary-text);		
		white-space: nowrap;	
		line-height: 38px		
	}
	
	.opening-times > .standard-grid table tr td:first-child
	{
		padding-right: 8px;
	}
	.opening-times > .standard-grid table tr td:last-of-type
	{
		color: var(--colour-main-text);
		font-weight: var(--font-weight-semi-bold);
		text-align: right;
	}

	.opening-times .button + div,
	.opening-times > .standard-grid input[type="radio"],
	.opening-times .button + div + nav
	{
		display: none;
	}	

	
	.opening-times > .standard-grid + nav
	{
		display: flex;
		justify-content: center;
		grid-column: 1 / -1;
		grid-area: nav;
		grid-row: 3;		
	}		
	.opening-times > .standard-grid + nav > label
	{
		display: block;
		background: var(--colour-stroke);
		box-shadow: 0px 1px 2px 0px #000A;
		width: 20px;
		height: 20px;
		pointer-events: all;
		mask-image: url('/index/spot.svg');
		mask-repeat: no-repeat;
		mask-size: 20px 20px;
		mask-position: center center;		
	}
	.opening-times > .standard-grid + nav > label:hover,
	.opening-times > .standard-grid + nav > label.selected
	{
		background: var(--colour-main);
	}
	.opening-times > .standard-grid + nav > label.selected
	{
		mask-image: url('/index/spot-selected.svg');
	}
	
	.opening-times > .standard-grid > input + div
	{
		display: none;
	}
	.opening-times > .standard-grid > input:checked + div
	{
		display: grid;		
		grid-template-rows: min-content min-content auto;
		align-items: start;
	}
	
			
	
	@media (min-width: 1024px)
	{
		.opening-times > .standard-grid + nav
		{
			display: none;
		}
		.opening-times > .standard-grid > input + div
		{
			display: grid;
			grid-template-rows: min-content min-content auto;
			align-items: start;
		}
				
		.opening-times > .standard-grid table tr td
		{	
			letter-spacing: -0.2px;
			word-spacing: -1px;	
		}		
	}
	@media (min-width: 1031px) { 
		.opening-times > .standard-grid table tr td
		{	
			letter-spacing: -0.15px;
			word-spacing: -.75px;	
		}		
	}
	@media (min-width: 1038px) { 
		.opening-times > .standard-grid table tr td
		{	
			letter-spacing: -0.1px;
			word-spacing: -.5px;	
		}		
	}
	@media (min-width: 1045px) { 
		.opening-times > .standard-grid table tr td
		{	
			letter-spacing: -0.05px;
			word-spacing: -.25px;	
		}		
	}	
	@media (min-width: 1052px)
	{
		.opening-times > .standard-grid table tr td
		{	
			letter-spacing: initial;
			word-spacing: initial;	
		}		
	}
	
	