Styling for the Neat 2 grid overlay

_grid-overlay.scss

/*
* Layout debugging display
*/
body {
	&.env--local {

		.grid-overlay {
			display: none;
			position: fixed;
			z-index: 99999999;
			top: 0;
			left: $base-spacing;
			right: $base-spacing;
			height: 100vh;
			pointer-events: none; // allows the user to 'click through' the element

			&.is--visible {
				display: block;
			}

			&__inner {
				@extend .outer-container;
				@include grid-visual(rgba($highrise-green, 0.2));
				height: 100vh; 

				@include grid-media($large-screen){
					
					@include grid-visual(rgba($highrise-green, 0.2), $large-screen);
				
				}
			}

			&-toggle {
				position: fixed;
				top: initial;
				bottom: $base-spacing*2;
				left: $base-spacing*2;
				cursor: pointer;
				pointer-events: all; // makes this element clickable
			}
		}
	}
}