/* Styles for the home page specifically */

.cta-container {
	display: flex;
	gap: 1em;
	margin: 2em;
	font-size: 135%;
}

.cta {
	flex-grow: 1;
	background: var(--cta-background);
	background-image: 
		linear-gradient(115deg, transparent, transparent 10%, var(--cta-background) 55%),
		var(--image);	
	background-size: cover;
	border-radius: 1.5em;
	padding: 1em;
	text-align: right;
	padding-right: 2em;
	border: 4px var(--cta-background) solid;
	
	--cta-background: var(--navbar-background);
}

.cta-join { --image: url(images/oxia-members-26.jpg); }
.cta-event { --image: url(images/litfest-collage.jpg); }
.cta-books { --image: url(images/book-cta.jpg); }

.cta-reverse {
	--cta-background: var(--navbar-corner-background);
}

div.banner {
	font-size: 5vw;
	font-family: Meie Script, serif; /* 'cursive' defaults to Comic Sans */
}
div.banner p { margin: 0; }
div.banner p:last-child { text-align: right; margin-right: 1em }

/* Mobile view */
@media (max-width: 799px) { 
	/* CTAs go vertical */
	.cta-container { display: block; margin: 0; }
	.cta { margin: 1em; }
}