#ArticleModUI{box-shadow: 0 6px 5px rgba(0,0,0,.2);  margin-bottom:2.5vmax; padding:20px 0 10px 0; width:100%; position: relative; }
.hamburger-on #ArticleModUI{}
#ArticleModUI .filter { float:left; width:30%;}


.rss {display:none; }

#ArticleModUI .categorylist{background:var(--theme-color3); margin:0; padding:1em 0; width:100%; display:none; float:left; clear:both; z-index: 999; top: 3.1em; position: absolute;}
#ArticleModUI .categorylist li {float:left; list-style:none; margin:0.5em 0.75em;}
#ArticleModUI .categorylist li a{font-size:1.2em;}
#ArticleModUI .categorylist li .Btn1{ background: #333; color:#fff; padding: 0.9em 1.4em; text-transform:uppercase;border:none; border-radius:0;}
#ArticleModUI .categorylist li .Btn1.Current{background:#fff; color:#333;}
#ArticleModUI .categorylist li .Btn1:hover{ background:#fff; color:#333;}

#ArticleModUI .ArticleSearch {margin:0 auto; position: absolute; overflow: hidden; font-size: 1.3em; padding: 0; height: 60px; width:60%; right:0; }
#ArticleModUI .ArticleSearch #SearchPhrase{ line-height:2; border:none; background:#eee;  padding:0 65px 0 10px; height: 60px; width:100%;}
#ArticleModUI .ArticleSearch .Submit{font-family:'FontAwesome'; position: absolute; right:0; top:0;  border: none; background:var(--theme-color1); color: white;height: 60px; line-height: 60px; width:50px;padding: 0;}
#ArticleModUI .ArticleSearch .Cancel{background:#c84a55; color:white; border:none; position: absolute; right:50px; top:0; height: 60px; width:50px;padding: 0; line-height: 60px;}
#ArticleModUI .Btn1R{background:var(--theme-color3); ;height: 60px; padding-top: 0; padding-bottom: 0; line-height: 60px;  padding-right: 1.8em;font-size: 1.3rem;}
#ArticleModUI .Btn1R .ico{line-height: 60px; padding:0;width: 1.5em; }
#ArticleModUI .Btn1R:hover{background:var(--theme-color3); }

#ArticleModUI .rss {float:right; width:30%; position:relative; text-align: right;}


@media screen and (max-width:650px) {
	#ArticleModUI .rss {display: none;}
	#ArticleModUI .filter {  float:left; width:50%;}
	#ArticleModUI .ArticleSearch {width:50%; position: absolute; right:0;}
}
@media screen and (max-width:480px) {
	#ArticleModUI .ArticleSearch {margin:0; left:0;width:100%; top:0;height: 50px;}
	#ArticleModUI .ArticleSearch #SearchPhrase{  height: 50px; }
	#ArticleModUI .ArticleSearch .Submit{height: 50px; line-height: 50px;}
	#ArticleModUI .ArticleSearch .Cancel{height: 50px;line-height: 50px;}
	#ArticleModUI .filter {float:none; width:auto; margin-top: 55px;}
	#ArticleModUI .categorylist{top: 6.5em;}
	#ArticleModUI .Btn1R{height: 50px;  line-height: 50px;}
}

@media screen and (max-width:400px) {
	#ArticleModUI .categorylist li {margin:0.6em 0.4em; }
}



/* Article Listing pg ------ */

#ArticleList header {}
#ArticleList header h1 {text-align:center; color:#f8981d;  }
#ArticleList nav{}
#ArticleList nav .Lbl{display:none;}
#ArticleList nav .RecordStats{text-align:center;}
#ArticleList nav .PagingControl{text-align:center; margin:3px auto;display:none;}


#ArticleItems { font-size: 0;margin-left:-2%; min-height: 85vh;}
#ArticleItems .Tile {width:23%;margin:0 0 1em 2%; display:inline-block; vertical-align: top;font-size: 1rem;position: relative; background: #fff;border-bottom: 4px solid transparent; }
#ArticleItems .Tile .articleimg{width:100%; height:200px;background-repeat:no-repeat; background-size:cover; background-position:center;}
#ArticleItems .Tile .articleimg.no-image{ background:#fff; text-align: center; line-height: 3em; font-size: 4em; color: #d2d2d2;}
#ArticleItems .Tile .details{ height:5.5em;  margin: 0.3em 0 0; padding-bottom: 30px; overflow: hidden; }
#ArticleItems .Tile a {text-decoration:none; color: #444;}
#ArticleItems .Tile header{text-align: left; }
#ArticleItems .Tile header h2{  line-height:1.2rem; max-height:3.8rem;  font-size:1rem; padding:0; -webkit-line-clamp: 2;-webkit-box-orient: vertical; overflow: hidden; }
#ArticleItems .Tile p.intro{
	margin:0.25em 0;
	font-size: 80%;
	padding:0;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	line-height: 1.3;     /* fallback */
	max-height: 3.9em;      /* fallback */
	-webkit-line-clamp: 3; /* number of lines to show */
	-webkit-box-orient: vertical;
	display: none;
}
#ArticleItems .Tile .stamp {font-size:80%; position: absolute; bottom:5px;}

#ArticleItems .Tile:hover {z-index: 10; border-bottom: 4px solid 	var(--theme-color1);}


#ArticleList a.loadData {width:30%; min-width:75px;}

@media screen and (max-width:1000px) {
	#ArticleItems .Tile {width:31.33%;}
}
@media screen and (max-width:720px) {
	#ArticleItems .Tile {width:48%;}
}
@media screen and (max-width:480px) {
	#ArticleItems { margin-left:0; }
	#ArticleItems .Tile {width:100%; margin:0 0 1em 0; }
	#ArticleItems .Tile .articleimg.no-image{display: none;}
	#ArticleItems .Tile .details{ height:auto;  }


}
@media screen and (max-width:350px) {
	#ArticleItems .Tile .articleimg{ height:140px;}
}






/* individual article pg ------ */
body.ArticleDetail {}
body.ArticleDetail #pcontent{ background: none;}
#ArticleView{}
#ArticleView article.main .mainImg{max-width: 900px; height: auto;}
#ArticleView article.main .aBody {width:70%; float:left; min-height: 100vh;}
#ArticleView article.main .aBody .SocWrap {margin:1em 0;}
#ArticleView article.main header.main { padding-right: 0.5em;}
#ArticleView article.main header.main h1 {line-height:1.28;font-size:1.8rem;}
#ArticleView article.main header.main.ImgOn {margin-top:-3em; margin-bottom: 1em; max-width: 93%;}
#ArticleView article.main header.main.ImgOn h1 {background: #fff; display:inline; padding:0.15em  0 1em 0; white-space: pre-wrap;}
#ArticleView article.main header.main.ImgOn h1:after{content: " ";}

#ArticleView article.main .articlecopy {margin-bottom:3em; padding-top: 1.5rem; }
#ArticleView article.main .SideCont {width:25%; float:right;}

#ArticleView article.main  iframe.flickr-embed-frame{display:block!important; margin:auto!important;}

#ArticleView .wherewhen {font-size:85%; margin-bottom:1em; line-height:1; margin-top:0;}

#ArticleView .articlecopy h1{font-size: 1.75rem;}
#ArticleView .articlecopy h2{margin-top: 1.5em; padding-bottom: 0;}
#ArticleView .articlecopy h3{margin-top: 1em; padding-bottom: 0;}
#ArticleView .articlecopy img{display:block; margin:auto; max-width:100%; height:auto!important;}
.articlecopy a:hover{ text-decoration: underline;}

#ArticleView .articlecopy blockquote{max-width: 700px; margin-left:5%; }

#ArticleView .Tags {background:#fff;  margin:0 0 2em 0; }
#ArticleView .Tags h4 {  padding-bottom:0.25em;}
#ArticleView .Tags a {display: inline-block; padding: 0.2em 0.5em; background: rgba(0,0,0,0.05); margin: 0 0.2em 0.4em 0; text-decoration: none; font-size: 0.9em;}
#ArticleView .Tags a:hover{}

@media screen and (max-width: 1500px) {
	#ArticleView article.main .mainImg{max-width:100%;}
}


.OtherArticles{width:100%; margin-bottom: 2em;}
.OtherArticles ul {padding:0; margin:0;}
.OtherArticles li {list-style:none; padding:0; margin:0; border-bottom:1px solid #eee;}
.OtherArticles li div.item {padding:0.45em 0; border-right:4px solid transparent;  }
.OtherArticles li p.title{margin:0;line-height:1.2; font-size:0.9rem;}
.OtherArticles li p.datestamp {color:#aaa; font-size:80%; margin:0;margin-top: 0.1em;}
.OtherArticles li a{text-decoration:none; line-height:1.2;color: #666; }
.OtherArticles li a:hover {text-decoration:none; }
.OtherArticles li a:hover div.item {border-right:4px solid rgba(0,0,0,0.3); }

@media screen and (max-width:800px) {
	#ArticleView article.main header.main h1 {font-size:1.6rem;}
	#ArticleView article.main header.main.ImgOn {margin-top:-2.5em;}
	#ArticleView .articlecopy h1{font-size: 1.7em;}
}
@media screen and (max-width:650px) {
	#ArticleView article.main .aBody {width:100%; float:none;}
	#ArticleView article.main .SideCont {width:100%; float:none;}
}

@media screen and (max-width:440px) {
	#ArticleView article.main header.main h1{ font-size: 1.7em; }
	#ArticleView article.main header.main.ImgOn {margin-top:-2.0em;}
	#ArticleView .articlecopy h1{font-size: 1.4em;}
}


/* gallery feed ------ */
#ArticleView article.main ul.ImgFeed{ margin:0; padding: 0; list-style: none;  text-align: center; }
/*#ArticleView article.main ul.ImgFeed li { margin:0 0.5em 1em 0; padding: 0; list-style: none; width:260px; display: inline-block;vertical-align:top;}*/
#ArticleView article.main ul.ImgFeed li { margin:0 0.5em 1em 0; padding: 0; list-style: none; width:100%; display: inline-block;vertical-align:top;}
#ArticleView article.main ul.ImgFeed .FeedImg img { max-width: 100%; display: inline-block; text-align: center;}
#ArticleView article.main ul.ImgFeed p { margin: 0; line-height: 1.3;}
#ArticleView article.main ul.ImgFeed p.info { /*display: none;*/}
#ArticleView article.main ul.ImgFeed p.ttl { color: #252525; }
#ArticleView article.main ul.ImgFeed p.dtStamp { font-size: 90%; color:#aaa; }

@media screen and (max-width:850px) {
	#ArticleView article.main ul.ImgFeed li { margin:0 0 1em 0; width:100%;text-align: center;}
	#ArticleView article.main ul.ImgFeed .FeedImg img { max-width: 100%; }
}






.update-article {
	--ua-red: #a60d33; --ua-red-deep: #5f0519; --ua-green: #16844a; --ua-tint: #f1eefc; color: #3b3b4a; max-width: 1000px; margin: 0 auto 3rem; line-height: 1.55;
	*, *::before, *::after {box-sizing: border-box;}
	ul {list-style: none; margin: 0; padding: 0;}
	h1, h2, h3 {padding: 0; margin: 0; line-height: 1.15;}
	p {margin: 0 0 1rem;}
	.ico {font-family: FontAwesome; font-style: normal; font-weight: normal; display: inline-block; line-height: 1;}
	a:focus-visible {outline: 3px solid var(--theme-color5); outline-offset: 2px;}

	/* Hero */
	.ua-hero {
		position: relative; overflow: hidden; padding: 3rem 2rem; border-radius: 1rem; color: #fff; background: radial-gradient(circle at 85% 15%, #c4153f 0, transparent 55%), linear-gradient(135deg, var(--ua-red) 0%, var(--ua-red-deep) 100%); box-shadow: 0 10px 30px rgba(95,5,25,0.35);
		&::after {content: "\f013"; font-family: FontAwesome; position: absolute; right: -2rem; bottom: -4rem; font-size: 18rem; line-height: 1; opacity: 0.08;}
		> * {position: relative; z-index: 1;}
		.ua-kicker {display: inline-flex; align-items: center; gap: 0.5em; margin-bottom: 1rem; padding: 0.35em 0.9em; border-radius: 2em; background: var(--theme-color6); color: var(--theme-color1); font-family: var(--theme-font1); font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.08em;}
		h1 {max-width: 15em; padding-bottom: 0.5rem; color: #fff; font-size: clamp(1.9rem, 5vw, 3rem); text-transform: uppercase;}
		.ua-lead {max-width: 36em; margin: 0 0 1.5rem; font-size: 1.25rem; color: rgba(255,255,255,0.92);}
		.ua-start {display: inline-flex; align-items: center; gap: 0.6em; padding: 0.6em 1.1em; border-radius: 0.6em; background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.3); font-size: 1.1rem;
			.ico {color: var(--theme-color6); font-size: 1.4em;}
			strong {color: var(--theme-color6);}
		}
	}

	/* Live status, filled in by jQuery */
	.ua-status {
		display: none; align-items: center; gap: 0.75rem; margin: 1.5rem 0 0; padding: 0.9rem 1.25rem; border-radius: 0.75rem; font-size: 1.1rem; font-weight: 600; color: #fff;
		&.is-open {display: flex; background: var(--ua-green);}
		&.is-closed {display: flex; background: var(--ua-red);}
		.ico {font-size: 1.5em;}
	}

	/* Section headings */
	.ua-heading {
		display: flex; align-items: center; gap: 0.7rem; margin: 3.25rem 0 1.25rem; font-size: 1.9rem; color: var(--theme-color1);
		.ico {flex: none; display: flex; align-items: center; justify-content: center; width: 2.2em; height: 2.2em; border-radius: 50%; background: var(--theme-color1); color: var(--theme-color5); font-size: 0.8em;}
	}
	.ua-intro {max-width: 38em; font-size: 1.1rem;}

	/* Opening hours */
	.ua-hours-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem;}
	.ua-card {
		background: #fff; border-radius: 1rem; overflow: hidden; border: 3px solid transparent; box-shadow: 0 6px 22px rgba(0,0,0,0.12);
		&.is-current {border-color: var(--theme-color5);}
		&.is-current .ua-card-head .ua-tag {display: inline-block;}
		.ua-card-head {
			display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background: var(--theme-color1);
			h3 {color: var(--theme-color5); font-size: 1.6rem;}
			.ua-tag {display: none; padding: 0.25em 0.7em; border-radius: 2em; background: var(--theme-color5); color: var(--theme-color1); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;}
		}
		.ua-row {
			display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.5rem 1rem; padding: 1.1rem 1.25rem;
			&:nth-child(even) {background: var(--ua-tint);}
			.ua-days {font-size: 1.05rem; font-weight: 600; color: #333;}
			.ua-time {font-family: var(--theme-font1); font-size: 1.7rem; line-height: 1; color: var(--theme-color1); white-space: nowrap;}
			.ua-time em {font-family: var(--theme-font2); font-style: normal; font-size: 0.9rem; color: #777; margin: 0 0.15em;}
			.ua-badge {display: inline-flex; align-items: center; gap: 0.4em; padding: 0.3em 0.9em; border-radius: 2em; background: #fbe3e9; color: var(--ua-red); font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.85rem;}
		}
	}

	/* Repairs options */
	.ua-options {display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem;}
	.ua-option {
		position: relative; padding: 1.75rem 1.5rem; border-radius: 1rem; background: var(--ua-tint); border-left: 6px solid var(--theme-color1);
		.ico {font-size: 2.2rem; color: var(--theme-color1); margin-bottom: 0.6rem;}
		h3 {padding-bottom: 0.4rem; font-size: 1.4rem;}
		p {margin: 0;}
		.ua-phone {display: inline-block; margin-top: 0.75rem; font-family: var(--theme-font1); font-size: 1.7rem; color: var(--theme-color1); text-decoration: none;
			&:hover {color: var(--theme-color2);}
		}
	}

	/* Parts and essentials */
	.ua-parts {
		display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.5rem;
		li {display: flex; flex-direction: column; align-items: center; gap: 0.6rem; padding: 1.4rem 0.75rem; border-radius: 1rem; background: #fff; text-align: center; font-weight: 600; color: #333; box-shadow: 0 4px 14px rgba(0,0,0,0.1); border-bottom: 4px solid var(--theme-color5);
			.ico {font-size: 2rem; color: var(--theme-color1);}
		}
	}
	.ua-freewheel {
		display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding: 1.5rem; border-radius: 1rem; background: var(--theme-color5);
		p {margin: 0; font-size: 1.1rem; color: #3a2d00; max-width: 32em;}
		.ua-btn {display: inline-block; padding: 0.8em 1.4em; border-radius: 0.5em; background: var(--theme-color1); color: #fff; text-decoration: none; font-weight: 700; white-space: nowrap;
			&:hover {background: var(--theme-color2); color: #fff;}
		}
	}

	/* Contact panel */
	.ua-contact {
		margin-top: 3.25rem; padding: 2.25rem 2rem; border-radius: 1rem; color: #fff; background: linear-gradient(135deg, var(--theme-color1) 0%, #230776 100%);
		h2 {padding-bottom: 1rem; color: var(--theme-color5); font-size: 1.9rem;}
		.ua-contact-list {display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem;
			li {display: flex; gap: 0.8rem; align-items: flex-start;
				.ico {flex: none; font-size: 1.6rem; color: var(--theme-color6);}
				a {color: #fff; text-decoration: none; border-bottom: 1px dotted rgba(255,255,255,0.6); &:hover {color: var(--theme-color6);}}
				strong {display: block; color: var(--theme-color6); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em;}
			}
		}
		.ua-note {margin: 1.5rem 0 0; padding-top: 1.25rem; border-top: 1px solid rgba(255,255,255,0.25); font-size: 0.95rem; color: rgba(255,255,255,0.85);}
	}
	.ua-thanks {margin: 2.5rem 0 0; text-align: center; font-family: var(--theme-font1); font-size: 1.6rem; color: var(--theme-color1);}

	@media (width <= 900px) {
		.ua-parts {grid-template-columns: repeat(2, 1fr);}
		.ua-contact .ua-contact-list {grid-template-columns: 1fr;}
	}
	@media (width <= 700px) {
		.ua-hours-grid, .ua-options {grid-template-columns: 1fr;}
		.ua-hero {padding: 2rem 1.25rem;}
		.ua-heading {font-size: 1.6rem;}
	}
}