:root {
    --bkg:          var(--brack);
    --text:   		var(--beige);
    --action: 		var(--turquoise);
    --lowlink:		var(--taupe);
    --input:        var(--grock);
}


.front main			{ text-align: left; }
.front main .cover 	{ display: grid; place-content: center; max-width: 28em; margin: auto; margin-left: calc(50vw - 1.5em); padding: 0; padding-right: 2em; height: 100vh; width: auto; }

.front svg.btn 			{ width: 3em; background-color: var(--blued); color: var(--text); border: 0; padding: 0.8em; margin-left: 0; }
.front .login           { color: var(--lowlink); }
.front h1           { color: var(--action); }

*.quote 	  	    { color: var(--text);  }

.front .cover *		 { -webkit-filter: drop-shadow(1px 1px 2px var(--black)); }
h2.quote 		     { font-size: 3.5em; }

main > .veil 	     { background-color: var(--dark-pur); }

input                { color: var(--text); }

@media only screen and (max-width: 609px) {
	.front main .cover { padding-right: 1em;  }
    h2.quote 			{ font-size: 2.5em; }
}