/* Photo gallery */
.photogrid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 10px;
	padding: 8px;
}
.photocell { text-align: center; }
.photocell img {
	width: 130px;
	height: 130px;
	object-fit: cover;
	border: 1px solid #000;
	display: block;
	margin: 0px auto 3px auto;
}
.photocaption {
	font-size: 7pt;
	word-wrap: break-word;
}
.photonav {
	display: flex;
	justify-content: space-between;
}
.photonav a { color: #fff; }
.photobig {
	text-align: center;
	padding: 10px;
}
.photobig img {
	max-width: 100%;
	max-height: 600px;
	border: 1px solid #000;
}
.photobigcaption {
	font-weight: bold;
	font-size: 9pt;
	margin: 6px 0px 2px 0px;
}

/* Comments */
.pcommentrow {
	display: flex;
	margin-bottom: 2px;
}
.pcommentuser {
	width: 150px;
	flex-shrink: 0;
	background-color: #FF9933;
	text-align: center;
	padding: 4px;
	margin-right: 2px;
}
.pcommentuser a {
	font-weight: bold;
	display: block;
	margin-bottom: 5px;
	text-decoration: none;
}
.pcommentuser img { width: 80px; }
.pcommenttext {
	flex: 1;
	min-width: 0;
	background-color: #F9D6B4;
	padding: 4px;
	font-size: 11px;
	line-height: 1.4;
	word-wrap: break-word;
}
.pcommentdate {
	font-weight: bold;
	margin-bottom: 10px;
	font-size: 12px;
}
.pcommentdelete {
	margin: 6px 0px 0px 0px;
	text-align: right;
}

/* Bulletins */
.mailrow.bulletinrow { grid-template-columns: 160px 120px 1fr; }

/* Groups */
.grouprow {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	background-color: #d5e8fb;
	padding: 5px;
	margin-bottom: 2px;
}
.grouprow a { text-decoration: none; }

/* Instant messages */
.imname { color: #fff !important; }
.imlog {
	height: 300px;
	overflow-y: auto;
	padding: 6px;
	background: #fff;
	font-size: 9pt;
	line-height: 1.5;
	word-wrap: break-word;
}
.imline b { color: #C00; }
.imline.mine b { color: #003399; }
.imstatus {
	color: #C00;
	font-size: 7pt;
	padding: 0px 6px;
	min-height: 10px;
}
.imform {
	display: flex;
	gap: 4px;
	padding: 6px;
	background: #d5e8fb;
}
.imform input[type=text] { flex: 1; }

/* Rank User */
.rankscale {
	display: flex;
	gap: 3px;
	margin-bottom: 8px;
}
.rankscale button {
	width: 26px;
	font-weight: bold;
	cursor: pointer;
}
.rankscale button.picked {
	background: #003399;
	color: #fff;
}
.redtext { color: #C00; }

.statusinput { width: 280px; }

/* Invites */
.invitelink { width: 380px !important; }

/* Search */
.searchbox {
	display: block;
	border: 2px solid #6699cc;
	background: #D5E8FB;
	padding: 10px;
	margin-bottom: 10px;
	text-align: center;
}
.searchtitle { font-weight: bold; font-size: 11pt; color: #003399; margin-bottom: 6px; }
.searchbox input[type=text] { width: 350px; }
.searchtypes { margin: 6px 0px 4px 0px; }
.searchtypes label { margin: 0px 6px; }
.searchresult {
	background: #fff;
	border-bottom: 1px solid #D5E8FB;
	padding: 6px;
	line-height: 1.4;
}
.searchresult a { text-decoration: none; }

/* Report form */
.reportreason { display: block; }
.reportpreview {
	background: #fff;
	border: 1px solid #B1D0F0;
	padding: 4px 6px;
	margin-top: 4px;
	word-wrap: break-word;
}
.reportlink { font-size: 7.5pt; color: #999 !important; text-decoration: none; }
.reportlink:hover { color: #C00 !important; text-decoration: underline; }
.reportline { text-align: right; margin-bottom: 6px; }

/* Footer pages */
.sitepage { display: flex; gap: 14px; align-items: flex-start; }
.sitepagenav {
	width: 140px;
	flex-shrink: 0;
	border: 2px solid #6699cc;
	background: #D5E8FB;
	padding: 6px 8px;
}
.sitepagenav a { display: block; font-weight: bold; text-decoration: none; padding: 2px 0px; }
.sitepagenav a.on { color: #C00; }
.sitepagebody { flex: 1; min-width: 0; line-height: 1.5; font-size: 8.5pt; }
.sitepagebody h2 { font-size: 12pt; color: #003399; margin: 0px 0px 8px 0px; }
.sitepagebody h3 { font-size: 9.5pt; margin: 14px 0px 4px 0px; }
.sitepagebody li { margin-bottom: 4px; }

/* Song page */
.songlyrics {
    padding: 4px;
}
.songtabs {
    text-align: right;
}
.songtabs .on, .songtabs .on:link, .songtabs .on:visited {
    background: #6699cc;
    color: #fff;
}
.songtabs a {
    background: #D8E4F1;
    padding: 4px 4px 1px 4px;
    font-weight: bold;
    font-size: 8pt;
    text-decoration: none;
    position: relative;
    bottom: 1px;
}
