/*@font-face { font-family: Cormorant; src: url('fonts/comorant/cormorant/Cormorant[wght].ttf');}*/

body {
	font-family: serif;
	font-size: 100%;
	min-width:30rem;
	max-width:55rem;
	margin:0rem auto;
	letter-spacing: 0.05rem;
}
h1 {
	font-weight:normal;
	font-size:200%;
	margin-bottom:-2rem;
	margin-top:1rem;
}
h2 {
	font-weight:normal;
	font-size:140%;
	margin-bottom:0rem;
}
h3 {
	font-weight:normal;
	font-size:130%;
	margin-top:0rem;
	line-height:1.5;
}
main {
	display:flex;
	flex-flow: row wrap;
	justify-content:center;
	max-width:fit-content;
/*	background:#f8f8f8;*/
	border-radius:0.5rem;
	margin:1rem;
	line-height:1.75;
}
a{
	color:#08f;
	text-decoration:none;
	border-bottom: solid 1px;
}
a:hover{
	border-bottom: solid 3px;
}
nav{
	font-size:90%;
	font-weight:normal;
	margin:1rem;
	margin-top:2rem;
	font-variant-caps:small-caps;
	letter-spacing: 0.17rem;
	text-align: right;
}
nav a{border:none;}
nav a:hover{border-bottom:solid 3px;}

.tile, .photo, .title, .about, .spacer{
	margin: 1rem;
	margin-bottom: 0rem;
	align-items:stretch;
	box-sizing:border-box;
	clear:both;
	min-height:10rem;
	min-width:10rem;
	flex-grow:2;
/*	background: #eee;*/
}
.title {width:60%;min-width:30rem;min-height:0rem}
.about {min-width:20rem;width:60%;}
.photo {
	height: 20rem;
	overflow: hidden;
	width: 15rem;
	max-width: 15rem;
	border-radius: 1rem;
	margin-left: 0em;
}
.photo img {
	left: -43%; /* alter this to move left or right */
	top: 0rem; /* alter this to move up or down */
	height:100%;
	position: relative;
}
.spacer {
	height:0rem;
	width: 15rem;
	max-width: 15rem;
	min-height:1rem;
	margin-left:0rem;
/*	visibility: hidden;*/
}
footer {
	font-style:italic;
	font-size:70%;
	color:#888;
	margin-top: 2rem;
	margin-right: 1rem;
	text-align: right;
	}

.emailform {
	min-width:30rem;

}
.emailform input, .emailform textarea {
	margin:0.5rem;
	font-family: serif;
	font-size:140%;
}

/*@media all and (orientation: portrait) {*/
@media only screen and (hover: none) and (pointer: coarse) {
	main {
		width: 100%;
/*		background: #00f;*/
	}
	.tile, .title, .about {
		width: 100%;
		min-width: 100%;
	}
	body {
		font-family: sans-serif;
		font-size: 250%;
		line-height: 2.0;
		letter-spacing: 0.17rem;
	}
	h1 {
		font-size: 170%;
	}
	h3 {
		margin-bottom: 5rem;
	}
	.photo {
		height: 40rem;
		width: 60%;
		min-width:60%;
		margin-top:3rem;
		margin-bottom:3rem;
	}
	.photo img {
		margin-left:10%;
		height: 100%;
	}

}