@font-face {
	font-family: Quicksand;
	src: url(/static/Quicksand-SemiBold.ttf);
}


body {
	font-family: 'Quicksand', sans-serif;
	margin: 0;
	color: black;
	background-color: wheat;
}
a {
	color: royalblue;
	text-decoration: inherit;
}
a:visited {color: royalblue;}
textarea {
	width: 80%;
	height: 10em;
}
div.content {
	width: 90%;
	margin: auto;
}

nav {
	background-color: teal;
}
nav a:any-link {
	color: gold;
	padding: 0.5em 2em;
}
nav a:hover {background-color: royalblue;}
nav ul {
	display: flex;
	margin: 0;
	padding: 0;
	list-style-type: none;
}
nav ul li {
	display: flex;
	padding: 0;
	text-align: center;
}
.home {font-weight: bold;}
.home + li {margin-left: auto;}

ul.listings-preview {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
}
ul.listings-preview li {
	width: 15em;
	max-height: 25em;
	overflow: hidden;
	margin-right: 1em;
	margin-bottom: 1em;
	padding: 0.5em;
	list-style-type: None;
	border-style: solid;
	border-color: teal;
	border-width: 4px;
}
ul.listings-preview a {
	text-decoration: none;
}
table {
	border: 4px solid;
	border-color: teal;
	border-collapse: collapse;
}
th, td {
	border: 2px solid;
	border-color: teal;
	padding: 0.2em;
}

.warning {
	padding: 0.2em;
	background-color: salmon;
	font-size: large;
}
.highlight {
	background-color: seagreen;
	padding: 0.2em;
}
.smaller {
	font-size: smaller; 
}
.larger {font-size: larger;}
.emphasis {
	font-style: italic;
	font-weight: bold;
}
.no-margin-bottom {margin-bottom: 0;}
.fullwidth {width: 100%;}
.center {margin: auto;}
.pre-wrap {white-space: pre-wrap;}

.listing-title {font-size: larger;}
.listing-description {
/* 	font-size: smaller; */
	color: black;
	white-space: pre-wrap;
}
.listing-image {
	display: block;
	margin: auto;
	max-width: 100%;
	max-height: 15em;
}
.message-sent {
	text-decoration: none;
	background: teal;
	border-radius: 0.5em;
	margin-left: 20%;
}
.message-sent a {color: gold;}

.message-received {
	text-decoration: none;
	background: lightgrey;
	border-radius: 0.5em;
	margin-right: 20%;
}
.message-context {
	font-size: small;
	font-weight: 100;
	text-align: right;
	padding: 0.2em;
	margin-bottom: 0;
}
a .message-sent, a .message-received {color: black;}
.unread-notice {
	background-color: salmon;
	border-radius: 0.5em;
	padding: 0.2em;
}

@media screen and (max-width: 800px) {
	nav ul {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	nav li {margin: auto;}
}