html {
   font-family: Arial, Helvetica, sans-serif;
}
#aaModalOverlay { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.5); z-index:2000; align-items:center; justify-content:center; }
#aaModalCard { background:#fff; border-radius:6px; box-shadow:0 4px 24px rgba(0,0,0,0.35); overflow:hidden; min-width:320px; max-width:500px; }
#aaModalTitleBar { background:#1e293b; color:#fff; padding:8px 12px; font-weight:bold; font-size:0.95rem; }
#aaModalBody { padding:12px 12px 4px; }
.aa-msg { font-size:0.88rem; margin-bottom:10px; color:#334155; }
.aa-field { display:flex; align-items:center; margin-bottom:8px; }
.aa-field label { width:130px; font-size:0.85rem; color:#334155; flex-shrink:0; text-align:right; padding-right:8px; }
.aa-field .aa-input { flex:1; font-size:0.85rem; padding:3px 6px; border:1px solid #94a3b8; border-radius:3px; min-width:0; }
.aa-field-note { display:block !important; }
.aa-field-note span { font-size:0.78rem; color:#64748b; }
#aaModalFooter { display:flex; justify-content:space-between; align-items:center; padding:12px 10px; border-top:1px solid #e2e8f0; gap:6px; }
#aaModalLeft, #aaModalRight { display:flex; gap:6px; }
body {
	margin:0px;
}
option {
	text-align:left;
}
.textareaPost:focus {
    border: 0 none #FFF;
    overflow: hidden;
    outline:none;
}
.imageTextPost:focus {
    border: 0 none #FFF;
    overflow: hidden;
    outline:none;
}
.classHideButton {
	visibility:hidden;
}
.alignCenter {
	text-align:center;
}
.alignRight {
	text-align:right;
	align-items:right;
}
.form-control {
	height:46px;
    border:1px solid #F3F3F3;
	margin-right:5px;
    padding-right:10px;
    margin-left:5px;
	-moz-box-shadow:0 0 0 1px #707070;
    box-shadow:0 0 0 1px #707070;
    -moz-border-radius:3px;
    border-radius:3px;
    background:-moz-linear-gradient(top, #F2F2F2 0%, #EBEBEB 50%, #DDDDDD 51%, #CFCFCF 100%);
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0,#F2F2F2), color-stop(0.5,#EBEBEB),color-stop(0.51,#DDDDDD),color-stop(1,#CFCFCF));
     text-decoration:none;
}
.width40 {
	width:40px;
}
.width10 {
	width:10px;
}
@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -1px) rotate(-1deg); }
  20% { transform: translate(-1px, 0px) rotate(1deg); }
  30% { transform: translate(1px, 1px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 1px) rotate(-1deg); }
  60% { transform: translate(-1px, 1px) rotate(0deg); }
  70% { transform: translate(1px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 1px) rotate(0deg); }
  100% { transform: translate(1px, -1px) rotate(-1deg); }
}
.inline-flex {
	display:inline-flex;
}
.inline-div {
    display:inline-block;
}
.centered {
	text-align:center;
}
.inlineDiv {
	display:inline-block;
}
.inlineDivF {
	display:flex;
	align-items: center;
}
.inlineDivFL {
	display:flex;
	align-items: left;
}
.inlineDivFR {
	display:flex;
	align-items: right;
}
.inlineDivGrid {
	display:grid;
	grid-auto-flow: column;
	align-items: center;
}
.topBd{
    border-top:solid 1px black;
}
.topBdd{
    border-top:solid 2px black;
}
.topBdLight{
    border-top:solid 1px grey;
}
.leftBd{
    border-left:solid 1px black;
}
.leftBdd{
    border-left:solid 2px black;
}
.leftBdLight{
    border-left:solid 1px grey;
}
.rightBd{
    border-right:solid 1px black;
}
.rightBdd{
    border-right:solid 2px black;
}
.rightBdLight{
    border-right:solid 1px grey;
}
.bottomBd{
    border-bottom:solid 1px black;
}
.bottomBdd{
    border-bottom:solid 2px black;
}
.bottomBdLight{
    border-bottom:solid 1px grey;
}
br {
   display:block;
   content:'';
   margin-top:4px;
}
.fade-in {
	opacity: 1;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: 1s;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
.fade-out {
	opacity: 0;
	animation-name: fadeOutOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: 0.5s;
}

@keyframes fadeOutOpacity {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}
.th-header > a { display:flex; align-self:stretch; }
.headerDiv { height: 56px; padding: 0; }
#adminSearch { margin-right:10px; }
.AdminHeaderButton { color: #93c5fd; text-decoration: none; border: 1px solid #334155; border-radius: 4px; background: none; cursor: pointer; }
.AdminHeaderButton:hover { text-decoration: underline; }
#headerLogo { height:100%; cursor:pointer; }
.theholts-page #stuffDiv { opacity: 0; }
.theholts-page #stuffDiv.fade-in-active { animation: fade-stuff-in 0.5s ease-in forwards; }
@keyframes fade-stuff-in {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes fade-stuff-out {
	0% { opacity: 1; }
	100% { opacity: 0; }
}




















#side-panel {
  position: fixed; top: 56px; right: -820px;
  width: 800px; bottom: 0; background: #fff;
  box-shadow: -4px 0 20px rgba(0,0,0,0.2);
  z-index: 1000; transition: right 0.3s ease;
  display: flex; flex-direction: column; overflow: hidden;
}
#side-panel.open { right: 0; }

#panel-header { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #e2e8f0; }
#panel-title { flex: 1; min-width: 0; }
#panel-close { background: #e2e8f0; border: 1px solid #94a3b8; border-radius: 6px; color: #0f172a; cursor: pointer; }
#panel-close:hover { background: #cbd5e1; }
#panel-back { display: none; background: #e2e8f0; border: 1px solid #94a3b8; border-radius: 6px; color: #0f172a; cursor: pointer; }
#panel-back:hover { background: #cbd5e1; }

#panel-content, .panel-content { padding: 0 14px; overflow-x: hidden; color: #0f172a; }
#panel-content { overflow-y: auto; height: 100%; }
#panel-content h2, #panel-title h2, .panel-content h2 { font-weight: 700; color: #0f172a; border: none; }

.popup-pics { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 12px; align-items: flex-start; }
.popup-pic-wrap { display: table; }
.popup-pic { max-height: 300px; width: auto; height: auto; max-width: 100%; border: 1px solid #cbd5e1; border-radius: 6px 6px 0 0; cursor: pointer; transition: opacity 0.15s; display: block; }
.popup-pic:hover { opacity: 0.85; }
.popup-pic-caption { display: table-caption; caption-side: bottom; background: #f1f5f9; color: #555; font-size: 0.9rem; padding: 4px 6px; border-radius: 0 0 6px 6px; line-height: 1.4; }

.post-group { border-top: 2px solid #cbd5e1; margin-top: 16px; padding-top: 10px; }
.post-group:first-child { border-top: none; margin-top: 0; }
.post-header { font-size: 0.9rem; color: #000; padding: 6px 8px 2px 8px; background: #d8dee8; border-radius: 6px 6px 0 0; }
.post-text { font-size: 0.9rem; color: #000; padding: 2px 8px 6px 8px; background: #d8dee8; border-radius: 0 0 6px 6px; white-space: pre-wrap; margin-bottom: 8px; }
.post-date { font-size: 0.9rem; color: #000; }
.post-place { font-size: 0.9rem; color: #000; }
.photo-date { font-size: 0.9rem; color: #555; }

.popup-post-text { color: #000; font-size: 0.9rem; line-height: 1.6; margin-bottom: 8px; padding: 2px 8px 6px 8px; background: #d8dee8; border-radius: 0 0 6px 6px; white-space: pre-wrap; }
.popup-parent { font-size: 0.9rem; color: #000; padding: 6px 8px 2px 8px; background: #d8dee8; border-radius: 6px 6px 0 0; margin-bottom: 0; }

.fb-posts-btn { background: #3b82f6; color: #fff; border: none; border-radius: 6px; cursor: pointer; }
.fb-posts-btn:hover { background: #2563eb; }

.panel-msg { margin-top: 20px; color: #64748b; font-size: 0.95rem; line-height: 1.6; }
#loading { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); color: #334155; font-size: 1.1rem; }