/* style sheet rules for uwriteit.com website */
/* created Nov 29, 2023, by elbrant */

/* large screens */
@media screen and (min-width: 700px) {
	h1 { 
		margin: 5% 0; padding: 0;
		font-size: 35px; letter-spacing:10px; }
	h2, h3 { font-size: 22px; letter-spacing:2px; }
	.intro {
		position: fixed;
		top: 10%;
		left: 50%;
		right: 25%;
		text-align: right; }
	nav.lnkd {
		position: fixed;
		top: 60%;
		left: 27%;
		text-align: left; }
	.trim { padding: 0 20%; }
	#bks {
		display: flex;
		flex-direction: row;
		align-items: top;
		justify-content: space-evenly; }		
} /* end large screen */

/* small screens */
@media screen and (max-width: 699px) {
	h1 { 
		margin: 5% 0; padding: 0;
		font-size: 25px; letter-spacing:-1px; }
	h2, h3 { font-size: 18px; }
	.intro {
		position: fixed;
		top: 20%;
		left: 40%;
		right: 10%;
		text-align: right; }
	nav.lnkd {
		position: fixed;
		top: 65%;
		left: 10%; 
		text-align: left; }
	header { margin-bottom: 30px; }
	.trim { padding: 0 5%; }
	#bks {
		display: flex;
		flex-direction: column;
		align-items: top;
		justify-content: space-evenly;
		float: right; }	
} /* end small screen */

/* all screens */
body, html {
	margin:  0;
	padding: 0;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-flow: column;
	align-items: center;
	justify-content: center;
	font-family: roboto, georgia, helvetica, sans-serif; }

body.splash {	
	background: #000;
	background-attachment: fixed;
	background-image: url("../imgs/bg-crocus.png");
	background-size: 100% 100%; }	

body.cb {	
	background: #000;
	background-attachment: fixed;
	background-image: url("../imgs/bg-brick.png");
	background-size: 100% 100%; }	

body.bb {	
	background: #0002;
	background-attachment: fixed;
	background-image: url("../imgs/bg-brick.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
 }	

header { 
	display: block;
	position: static;
	top: 0;
	left: 0;
	right: 0;
	margin: 0;
	padding: 0;
	text-align: center;
	background-color: #0002; }

main {
	margin-top: 50px;
	position: relative;
	text-align: center; }

footer {
	display: block;
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #000;
	text-align: center;
	margin: 50px 0 0 0;
	padding: 0; }

#bookBldr {
	display: flex;
	flex-direction: column;
	align-content: center;
	justify-items: center;
	padding: 2%;
	background-color: transparent;
	color: #BEBEBE;
	font: 20px bolder; }

#ordr {
	height: 100%;
	margin: 2.5% 15%;
	padding: 0;
	text-align: center;
	background-color: transparent;
	background-repeat: no-repeat;
	border: 2px solid #BEBEBE; }

#flora, #bldg { visibility:hidden; }

h1, h2, h3 { 
	font: 700 sans-serif; 
	color: white; 
	text-shadow: 1px 1px 2px black, 0 0 45px black; 
	margin: 5px 0; 
	padding:0; } 
p, h5 { color: #BEBEBE; font: 20px bolder; }
p#copy { color: #757575; font-size: 10px; }
#ips, #clr, #nms { font-size: 1em; }
a:link, a:visited, a:active { 
	text-decoration: none; 
	color: white; 
	font-weight: 650; 
	text-shadow: 1px 1px 2px black, 0 0 45px black; }
a:hover { 
	text-decoration: none; 
	color: limegreen; 
	text-shadow: 1px 1px 2px black, 0 0 45px black; }