/* Font */
	@font-face {
		font-family: "FontA";
		src: url("asset/font/Inter-VariableFont.woff2") format("woff2");
	}
/**/
/* vars */
	body {
		--colorBackground: #FFF;
		--bkgOpacity: 0.4;
		--bkgLogoSize: 18em;
		--iconSize: 2em;
		--colorDark: #333333;
		--colorGrey: #B5BBBD;
		--colorLinkHover: #B5BBBD;
		--colorGreyDarkerOO: #737C7E;
	}
/**/
/* base */
	html,body {
		height: calc(100% - 20px);
		/* height: 100%; */
	}
	body {
		font-family: FontA;
		background-color: var(--colorBackground);
		align-items: center;
		justify-items: center;
		display: grid;
		grid-template-columns: 1fr;
	}
	a {
		color: var(--colorDark);
		transition: background-color 100ms;
	}
	a:hover {
		background-color: var(--colorLinkHover);
	}
/**/
/* heading */
	h1 {
		margin: 0;
		padding-bottom: 1em;
		font-weight: 800;
		font-size: 140%;
		color: var(--colorDark);
		text-shadow: 0 0 .3em white, 0 0 .2em white, 0 0 .2em white, 0 0 .2em white;
	}
/**/
/* container */		
	div.container {
		align-items: center;
		justify-items: center;
		display: grid;
		grid-template-columns: 1fr;
	}
/**/
/* background logo */
	div.bkgLogo {
		transform: rotate(-15deg);
		opacity: var(--bkgOpacity);
		z-index: -1;
		width: 200vw;
		height: 200vh;
		background-size: var(--bkgLogoSize) auto;
		background-image: url(logo-main.svg);
		position: fixed;
	}
/**/
/* reviewLinks */
	#reviewLinks {
		border: .15em solid var(--colorGreyDarkerOO);
		border-radius: 2em;
		box-shadow: .5em .5em 2em rgba(0,0,0,.2);
		padding: 1em 2em;
		background-color: white;
	}
	#reviewLinks ul {
		padding: 0;
		list-style: none;
		grid-template-columns: 1fr;
		display: grid;
	}
	#reviewLinks ul li {
		position: relative;
	}
	#reviewLinks ul li a {
		gap: .6em;
		height: var(--iconSize);
		padding: .5em;
		border-radius: .5em;
		align-items: center;
		grid-template-columns: var(--iconSize) 1fr;
		display: grid;
		font-size: 120%;
	}
	/* Icon */#reviewLinks ul li>a::before  {
		border-radius: .4em;
		width: var(--iconSize);
		height: var(--iconSize);
		background-size: 100% 100%;
		background-position: center;
		display: block;
		content: " ";
	}
	/* Icon googleReview */#reviewLinks ul li.googleReview>a::before  {
		background-image: url(asset/logo-google.svg);
	}
	/* Icon facebook */#reviewLinks ul li.facebook>a::before  {
		background-image: url(asset/logo-facebook.svg);
	}
	/* Icon yelp */#reviewLinks ul li.yelp>a::before  {
		background-image: url(asset/logo-yelp.svg);
	}
/**/
