@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap');

/*
 * BASE STRUCTURE
 */
 :root {
/*  
first: #40b238, hsl(116.1,52.1%,45.9%), rgba(64,178,56,1); green
second: #2a67da, hsl(219.2,70.4%,51%), rgba(42,103,218,1); blue
third: #ef55f9, hsl(296.3,93.2%,65.5%), rgba(239,85,249,1); purple
fourth: #e12727, hsl(0,75.6%,51.8%), rgba(225,39,39,1);  red
*/

--first: hsl(116.1,52.1%,45.9%);
--firstdark: hsl(116.1,52.1%,35.9%);
--first70: rgba(64,178,56,.7);
--first30: rgba(64,178,56,.3);
--second: hsl(219.2,70.4%,51%);
--seconddark: hsl(219.2,70.4%,41%);
--second70: rgba(42,103,218,.7);
--third: hsl(296.3,93.2%,65.5%);
--thirddark: hsl(296.3,93.2%,55.5%);
--third70: rgba(239,85,249,.7);
--fourth: hsl(0,75.6%,51.8%);
--fourthdark: hsl(0,75.6%,41.8%);
--fourth70: rgba(225,39,39,.7);

--body-color: #222;
--muted-color: #777;
--link-color: var(--seconddark);
--link-bkg: transparent;
--link-hv-color: var(--second);
--link-color-lite: #fff;

--primary-btn-color: #fff;
--primary-btn-bkg: var(--first); 
--primary-btn-bdr: var(--first);
--primary-btn-hv-color: #fff;
--primary-btn-hv-bkg: var(--firstdark);
--primary-btn-hv-bdr: var(--firstdark);
--primary-btn-bkg70: var(--first70);

--secondary-btn-color: #fff;
--secondary-btn-bkg: var(--second); 
--secondary-btn-bdr: var(--second);
--secondary-btn-hv-color: #fff;
--secondary-btn-hv-bkg: var(--seconddark);
--secondary-btn-hv-bdr: var(--seconddark);
--secondary-btn-bkg70: var(--second70);

--hilight-btn-color: #fff;
--hilight-btn-bkg: var(--third); 
--hilight-btn-bdr: var(--third);
--hilight-btn-hv-color: #fff;
--hilight-btn-hv-bkg: var(--thirddark);
--hilight-btn-hv-bdr: var(--thirddark);
--hilight-btn-bkg70: var(--third70);

--bs-btn-light-bg: #ddd;
--bs-btn-light-border: #ddd;
--bs-btn-light-hover-bg: #ccc;
--bs-btn-light-hover-border: #ccc;

--header-bkg: #232323;
--nav-ul-bkg: var(--first);
--nav-ul-color: #fff;
--nav-ul-hv-color:  var(--firstdark);
--nav-ul-open-color: #fff;
--nav-ul-open-bkg: var(--firstdark);
--nav-ul-open-menu-bkg: var(--firstdark);
--nav-drop-hilite-color: #fff;
--nav-drop-head-color: #fff;
--nav-drop-color: #fff;
--nav-drop-hv-color: var(--second);
--nav-drop-hv-bkg: transparent;

--topbar-color: #fff;
--topbar-bkg: var(--firstdark);

--sectionhead-bdr: var(--second);
--section-dark-bkg: var(--first);
--section-dark-bkg-start: var(--fourth70);
--section-dark-bkg-end: var(--fourth70);
--section-med-bkg: #f9f9f9;
--section-med-bkg-start: #f9f9f9;
--section-med-bkg-end: #f9f9f9;
--section-lite-bkg: #fff;
--section-lite-bkg-start: #fff;
--section-lite-bkg-end: #fff;
--underline-bdr: var(--fourth);
--underline-lite-bdr: #eee;

--tab-color: #ddd;
--tab-bdr: #ddd;
--tab-bkg: transparent;
--tab-active-color: var(--second);
--tab-active-bdr: #ddd;
--tab-active-bkg: #ddd;

--panel-border: #ddd;

--footer-bkg: #232323;

}

body {
  padding-top: 62px; /* Move down content because we have a fixed navbar that is 62px tall */
  font-family: 'Montserrat', sans-serif;
  overflow:hidden;
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
  font-family: 'Montserrat', sans-serif;	
}
a {
	color: var(--link-color);
}
a:hover {
	color: var(--link-hover-color);
}
@media (max-width: 1024px) {
	body {
		font-size: 20px;
		padding-top: 124px;
	}
	p {
		font-size: 2em;
	}
	.article-body p {
		font-size: 2.5em;
	}
}
body.portal {
	padding-top: 0px;
}
/*
 * BUTTONS
 */
.btn {
	transition: transform .1s .2s ease-in-out;
	will-change: transform, opacity;
}
.btn.btn-outline-secondary {
	border-color: #dee2e6;
}
.btn-block {
	width: 100%;
	max-width: 400px;
	text-align: center;
	margin: 0 auto;
	display: block;
}
.btn-mobile-view {
	width: 100%;
	text-align: center;
	margin: 0 auto;
	display: block;
	padding: 30px 0;
}
.btn-primary {
	background-color: var(--primary-btn-bkg);
	border-color: var(--primary-btn-bdr);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
	background-color: var(--primary-btn-hv-bkg);
	border-color: var(--primary-btn-hv-bdr);
}
.btn-light {
	background-color: var(--bs-btn-light-bg);
	border-color: var(--bs-btn-light-border);
}
.btn-light:hover,
.btn-light:focus,
.btn-light:active {
	background-color: var(--bs-btn-light-hover-bg);
	border-color: var(--bs-btn-light-hover-border);
}
.btn-hidden-white {
 	border-color: #f6f6f6;
 	color: #f6f6f6;
}
.btn-hidden-white:hover,
.btn-hidden-white:focus,
.btn-hidden-white:active,
.btn-hidden-white:hover:active {
 	border-color: #f6f6f6;
 	color: #f6f6f6;
}
/*
 * GLOBAL ADD-ONS
 */
.sub-header {
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
}
.no-wrap {
	white-space: nowrap;
}
td > a:nth-child(even) {
	margin: 0 5px;
}

.collapsed .glyphicon {
	transform: rotate(270deg);
}
.bootstrap-select > select.mobile-device:focus + .dropdown-toggle, .bootstrap-select .dropdown-toggle:focus {
	outline: none !important;
}
.bootstrap-select.bs-container .dropdown-menu {
	z-index: 99999;
}
.input-group > div.bootstrap-select + div.bootstrap-select > button {
	border-left: none;
}
.input-group > div.bootstrap-select + input {
	border-left: none;
}
.text-italic {
	font-style: italic;
}
li:empty {
	display: none;
	width: 0;
}
/* 
 * UTILITY CLASSES
 */
 .flexrow-center {
 	display: flex;
 	align-items: center;
 }
 .flexrow-end {
 	display: flex;
 	align-items: flex-end;	
 }
 .line-through {
 	text-decoration: line-through;
 }
 .mb-1 {
 	margin-bottom: 1em;
 }
 .mr-1 {
 	margin-right: 1em;
 }
 .m0 {
 	margin: 0 !important;
 }
 .noborder {
 	border: none;
 }
 .border-bottom {
 	border: none;
 	border-bottom: 1px solid var(--panel-border);
 }
 .hideme {
 	display: none;
 }
/* 
 * TOP NAVIGATION
 */
nav.navbar {
	padding: 0;
}
nav.navbar > .container-fluid {
	height: 62px;
}
.main-navbar {
	justify-content: space-between; 
	background-color: var(--header-bkg);
}
.main-navbar > .navbar-nav {
	height: 100%;
	align-items: center;
}
.main-navbar > .navbar-nav li {
	display: flex;
	align-content: center;
	align-items: center;
	height: 100%;
	padding: 0 1vw;
	color: var(--bs-navbar-color);
}
.main-navbar > .navbar-nav li {
	font-size: clamp(16px, 1.2vw, 20px);
}
.main-navbar > .navbar-nav li a {
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0;
}
.navbar-inverse {
	box-shadow: 0 1px 5px rgba(0,0,0,0.5);
	background-color: var(--header-bkg);
	padding: 0;
}
.navbar-brand {
	padding: 0;
	margin-right: 4vw;
	min-width: 100px;
	width: 6vw;
}
.navbar-brand > img {
}
.navbar-inverse .navbar-nav > li > a {
	color: #fff;
	font-size: 1vw;
}
.navbar-toggler {
	margin-left: auto;
}
@media (max-width: 1024px) {
	nav.navbar > .container-fluid {
		height: 124px;
	}
	.navbar-brand {
		width: 25vw;
	}
	.main-navbar {
	    margin: auto -15px;
    }
    .main-navbar > .navbar-nav li {
		font-size: clamp(24px, 1.2vw, 30px);
	}
	.main-navbar > .navbar-nav li a {
		padding: 10px 0;
	}
	.navbar-inverse .navbar-nav > li > a {
		font-size: 1.2vw;
	}
	.nav.navbar-nav.navbar-right li:nth-last-child(2) {
		display: none;
	}
}

.navbar-nav > li > a.btn {
	border-radius: 0;
}
.navbar-inverse .navbar-nav > li > a.btn-danger:hover, 
.navbar-inverse .navbar-nav > li > a.btn-danger:focus {
	background-color: #c9302c;
}
.navbar-nav > li > a.profile {
	padding: 0 15px 0 0;
}
.profile > img {
	height: 54px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	border: 1px solid #000;
	margin-right: 5px;
}
.navbar-nav .server-name {
	font-size: .8em;
}
.navbar-nav > li > .dropdown-menu {
	background-color: #080808;
	border: none;
	box-shadow: 0 12px 12px rgba(0,0,0,0.2);
	padding: 10px 0;
}

.navbar-nav .dropdown-menu > li:hover {
	background-color:#f5f5f5;
	color: #000;
}

.navbar-nav .dropdown-menu > li > a {
	color: #fff;
	font-weight: 600;
	font-size: 1.1em;
	display: flex;	
	justify-content: space-between;
	align-items: center;
}

.navbar-nav .dropdown-menu > li > a > span:last-child {
	font-size: 1.1em;
	color: #ccc;
	font-weight: normal;
}

.navbar-nav .dropdown-menu > li:hover > a {
	color: #000;
}
/* submenus */
.dropdown-submenu {
	position: relative;
}
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu,
.navbar-right > li > .dropdown-menu > li > .dropdown-menu {
	background-color: #080808;
	border: none;
	box-shadow: 0 12px 12px rgba(0,0,0,0.2);
	padding: 10px 0;
}
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu {
	top: -46%;
	left: 90%;
}
.navbar-right > li > .dropdown-menu > li > .dropdown-menu {
	top: -46%;
	right: -89%;
}
.dropdown-submenu .caret {
	transform: rotate(270deg);
}
ul.navbar-nav li.notification-nav-item > .notification-bell-wrapper {
    position: relative;
    display: inline-block;
}
ul.navbar-nav li.notification-nav-item button {
	  color: inherit;
}
ul.navbar-nav li.notification-nav-item button:hover,
ul.navbar-nav li.notification-nav-item button:focus,
ul.navbar-nav li.notification-nav-item button:active {
  color: var(--bs-navbar-hover-color);
}
ul.navbar-nav li.notification-nav-item button {
	font-size: 20px;
}
ul.navbar-nav li.notification-nav-item .notification-badge {
	position: absolute;
    top: 0;
    right: -13px;
	background-color: var(--bs-danger);
	color: #fff;
	padding: 0 7px;
	font-size: 0.75em;
	font-weight: bold;
	text-align: center;
	box-shadow: 0 0 0 1px #fff;
}

/*
 * MAIN CONTENT LAYOUT
 */
.main-content {
	padding-right: 0;
	padding-left: 0;
}
.flex-feed {
	flex: 0 0 400px;
}
@media (max-width: 1024px) {
	.flex-feed {
		flex: 0 0 50%;
	}
}
.flex-news {
	flex: 1 1;
}
.flex-calendar {
	flex: 0 0 500px;
	border-right: 1px solid var(--panel-border);
}
.flex-events {
	flex: 1 1;
}
.main-scroll-panel {
	height: 92vh;
	overflow-x: hidden;
	overflow-y: auto;
	padding: 0 0 500px 0;
	position: relative;
}
.panel-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	box-shadow: 0px 0px 7px var(--panel-border);
	margin-bottom: 0;
	padding: 5px 10px;
	background-color: #fff;
	position: sticky;
	width: 100%;
	top: 0;
	z-index: 9;
}
.panel-header h2, .panel-header ul {
	margin-bottom: 0;
}
.panel-header .header-actions li {
	padding: 0 10px;
}
@media (max-width: 1024px) {
	.panel-header .header-actions li {
		font-size: 2em;
	}
	.panel-header h2 {
		font-size: 3.2em;
	}
}
.mobile-news-feed-panel {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: transparent;
	display: none;
	z-index: 99;
}
.mobile-news-feed-panel a {
	font-size: 2em;
}
.mobile-news-feed-panel ul {
	justify-content: center;
	margin: 5px 0;
}
#articleListPanel .accordion-item {
	border: none;
}
@media (max-width: 1024px) {
	.main-content > .row {
		display: block;
	}
	.mobile-news-feed-panel {
		display: block;
	}
}
mark {
	padding: 0;
	color: blue;
	font-weight: bold;
	background-color: none;
}
/*
 * CARDS / GRIDS
 */
.card .card-header > :first-child {
	font-weight: bold;
	font-size: 1.2rem;
}
.news-grid {
	padding: 15px;
}
.news-grid .new-unread-badge {
	position: absolute;
	top: 0;
	right: 0;
	margin: 8px;
	padding: 0.35em 0.65em;
	font-size: 0.75em;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	background-color: #e6283a;
	border-radius: 10rem;
	border: 1px solid #fff;
	text-transform: uppercase;
}

.news-grid .unread {
	background-color: #2e78d3;
}

.grid-container-auto {
	display: grid;
	grid-gap: 0;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}
.news-grid.grid-container-auto {
	grid-gap: 15px;
}
.news-grid .card:hover {
 	box-shadow: 0 0 0 0.2rem var(--first30);
 	cursor: pointer;
}
.feed-grid .card {
	border-bottom: 4px solid var(--panel-border);
	border-radius: 0;
	padding: 10px 0;
}
.card.promoted {
	grid-column: 1 / -1;
	width: 50vw;
	max-width: 900px;
	margin: 15px auto;
}
.card.promoted .card-img-top {
	aspect-ratio: 3/1;
}
.card-img-top {
	aspect-ratio: 1/1;
	object-fit: contain;
	object-position: center;
}
.card-img-bottom {
	max-height: 600px;
	object-fit: contain;
}
.card-body {
	flex: 2;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.card-title {
	text-align: center;
	margin-bottom: 15px;
	font-weight: 600;
}
.news-grid .card-title {
 	display: -webkit-box;
  	-webkit-line-clamp: 2; 
  	-webkit-box-orient: vertical;
  	overflow: hidden;
  	text-overflow: ellipsis;
	font-size: 1.1rem;
}
@media (max-width: 1024px) {
	.news-grid .card-title,
	.card-title {
		font-size: 3em;
	}
	.card-img-top {
		max-height: 900px;
	}
	.grid-container-auto {
		grid-template-columns: 1fr;
	}
	.news-grid.grid-container-auto {
		grid-gap: 60px 15px;
	}
	.feed-grid .card {
		border-bottom: 15px solid var(--panel-border);
	}
}
.card-title a,
.card-icons a {
	text-decoration: none;
	color: var(--link-color);
}
.card-emp {
	margin-bottom: 5px;
	margin-top:	auto;
}
.card-emp li {
	display: flex;
	align-items: center;
}
.profile-widget {
	display: flex;
	cursor: pointer;
	margin-right: 5px;
}
.profile-widget > a {
	text-decoration: none;
}
.profile-widget > a > img {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid var(--panel-border);
}
.profile-widget > a > span {
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--muted-color);
	border-radius: 50%;
	color: #fff;
	font-weight: 600;
}
.profile-widget.small-widget > a > img {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid var(--panel-border);
}
.profile-widget.small-widget > a > span {
	width: 30px;
	height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--muted-color);
	border-radius: 50%;
	color: #fff;
	font-weight: 600;
}
.profile-widget.large-widget > a > img {
	width: 150px;
	height: 150px;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid var(--panel-border);
}
.profile-widget.large-widget > a > span {
	width: 150px;
	height: 150px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--muted-color);
	border-radius: 50%;
	color: #fff;
	font-weight: 600;
	font-size: 3rem
}
.profile-widget:hover > a > span {
	color: var(--bs-nav-link-hover-color);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.profile-widget:hover > a > img {
	transform: scale(1.05);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
@media (max-width: 1024px) {
	.profile-widget > a > img,
	.profile-widget > a > span,
	.profile-widget.small-widget > a > img,
	.profile-widget.small-widget > a > span {
		width: 80px;
		height: 80px;
	}
}
.card-icons {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-bottom: 0;
}
.card-icons li {
	margin: 0 .4em;
	font-size: .9em;
}
.card-icons li i {
	text-align: center;
    width: .9em;
}
.single-activity-dialog .activity-card .card-body {
	padding: 0;
}
.activity-card .card-icons {
	border-bottom: 1px dashed var(--panel-border);
}
.activity-card .card-icons a {
	padding: 0 3px;
}
.activity-card .card-icons a:nth-of-type(2),
.news-grid .card-icons li:nth-of-type(2),
.view-post .panel-article .card-icons li:nth-of-type(2) {
	margin-left: auto;
}
.feed-reply ul,
.article-comments ul {
	margin-bottom: 0;
}
.feed-reply li:first-of-type,
.article-comments li:first-of-type {
	border-top: 1px dashed var(--panel-border);
	margin-top: 10px;
}
.feed-reply .card-icons i,
.article-comments .card-icons i {
	margin-left: 5px;
}
.article-comments .card-icons li:last-of-type {
	margin-right: 0;
}
.post-person {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 10px;
	line-height: 1;
}
.post-date {
	font-size: .7em;
	color: var(--muted-color);
}
.post-text-block p {
	margin: 1.5rem auto;
}
.post-text-block p a {
	word-break: break-all;
}
.post-text-block li p {
	margin: .5rem auto;
}
.feed-reply .comment,
.article-comments .comment {
  display: block;
  text-align: left;
  margin-left: 30px;
  font-weight: 300;
  font-size: .9em;
  line-height: 1.2em;
  white-space: wrap;
}
.reply-name {
  font-size: .8em;
  font-weight: 600;
}
@media (max-width: 1024px) {
	.card-icons {
		font-size: 2em;
	}
	.activity-card .card-icons a,
	.header-actions a {
		margin: 0 15px;
	}
	.post-person {
		font-size: 2em;
	}
	.feed-reply .comment,
	.article-comments .comment,
	.reply-name,
	.form-control {
		font-size: 2em;
	}
}
.comment-header {
	display: flex;
	justify-content: space-between;
}
.grid-calendar {
	padding: 15px;
}
/*
 * ARTICLES
 */
body.view-post,
body.edit-post,
body.articles-list,
body.admin-home {
	padding-top: 0;
  	overflow: auto;
}
.panel-article {
	margin: 15px 0;
}
.panel-article .card {
	width: clamp(300px, 75vw, 900px);
	border: none;
}
.articles-list .panel-article .card {
	width: 95%;
}
.articles-list .panel-article .card .card-body {
	display: block;
}
@media (max-width: 1024px) {
	.panel-article .card {
		width: 100%;
		border: none;
	}
}
.panel-article .card-img-top {
	aspect-ratio: auto;
	min-height:300px;
	max-height: 500px;
}
body.view-post .card-img-top,
body.edit-post .card-img-top {
	object-fit: contain;
}
body.view-post .panel-header .communities {
	font-size: 1em;
}
@media (max-width: 1024px) {
	body.view-post .panel-header .communities {
		font-size: 1.5em;
	}
}
.panel-article .card-title {
	font-weight: 600;
}
.panel-article .card-body .section {
	display: flex;
	margin-bottom: 10px;
}
.panel-article .article-body {
	border-top: 1px solid var(--panel-border);
	margin-top: 15px;
	padding-top: 15px;
}
.panel-article .article-text-block {
	margin: 1rem 0 0;
	font-size: 1.1em;
	line-height: 1.4;
}
.panel-article .article-text-block + .article-text-block {
	margin-top: 0;
}
.panel-article .article-image-block {
	margin: 1rem 0 0;
	text-align: center;
}
.panel-article .article-image-block img {
	width: 100%;
}
.panel-article .article-comment-form {
	border-top: 1px solid var(--panel-border);
	margin: 15px 0;
	padding-top: 15px;
}
.panel-article .article-comments .badge {
  display: block;
  text-align: left;
  margin-left: 15px;
  font-weight: 400;
  white-space: wrap;
}
/*
 * CALENDAR / EVENTS
 */
.calendar-month-title {
	text-align: center;
	display: flex;
	justify-content: space-around;
	width: 100%;
}
.mon-yr-name {
	width: 80%;
	text-align: left;
}
.grid-calendar {
    display: grid;
    grid-gap: 1px;
    grid-template-columns: repeat(7, minmax(1vw, 1fr) ) ;
    color: #444;
    border-radius: 5px;
}
.dayname {
    text-align: center;
}
.day {
	display: flex;
    background-color: #fff;
    color: #444;
    border-radius: 5px;
    padding: 22px 5px 5px;
    border: 1px solid #bbb;
    position: relative;
    aspect-ratio: 1/1;
}
.daynum {
    position: absolute;
    top: 5px;
    left: 5px;
    font-size: .9em;
    color: var(--muted-color);
}
.day.today {
	border: 2px solid var(--first);
}
.day.today,
.day.today .daynum {
	color: var(--first);
	font-weight: 600;
}
.day ul {
	font-size: .7em;
}
a.event {
	font-size: .75em;
	padding: 2px;	
}
/* a.event, p.event {
    margin:3px 0;
    padding: 3px 0;
    font-size: .7em;
    text-decoration: none;
    display: block;
} */
.day img {
    width: 100%;
    height: 10vw;
    object-fit: cover;
}
.day > img {
    margin-top: 5px;
}
.event-row {
	align-items: start;
}
.event-day {
	font-size: 3vw;
	font-weight: 600;
	display: block;
	white-space: nowrap;
}
.event-month {
	font-weight: 600;
	white-space: nowrap;
}
.event-datetime {
	margin-bottom: 0;
	color: var(--muted-color);
}
.event-datetime i {
	margin: 0 10px;
}
.month-divider {
	padding: 10px;
	background-color: var(--section-med-bkg);
}
.month-divider h3 {
	margin: 0;
}
.event-info {
	margin-bottom: 2em;
}
.event-row {
	display: flex;
	margin-bottom: 8px;
}
.event-label {
	font-weight: bold;
}
.event-value {
	flex: 1;
}
.event-row:last-child {
	margin-bottom: 0;
}
.event-list .no-events {
	margin-top: 30px;
	font-size: 1.2em;
	font-style: italic;
}
.event-list .card {
	cursor: pointer;
}
.event-row:hover {
 	box-shadow: 0 0 0 0.2rem var(--first30);
 	cursor: pointer;
}
.event-row .event-synopsis {
 	display: -webkit-box;
  	-webkit-line-clamp: 4; 
  	-webkit-box-orient: vertical;
  	overflow: hidden;
  	text-overflow: ellipsis;
}
.event-row .event-img {
	object-fit: contain;
	object-position: center;
	max-height: 200px;
	width: 100%;
}
@media (max-width: 1024px) {
	.main-scroll-panel.flex-calendar {
		height: 40vh;
		padding-bottom: 0;
	}
	.main-scroll-panel.flex-events {
		height: 52vh;
	}
}
/*
 * TABLES
 */
.table > thead > tr > th, 
.table > tbody > tr > th, 
.table > tfoot > tr > th {
	vertical-align: bottom;
}
.table > thead > tr > td, 
.table > tbody > tr > td, 
.table > tfoot > tr > td {
	vertical-align: top;
}
.table > tfoot.emphasized > tr > th,
.table > tfoot.emphasized > tr > td {
	font-size: 1.2em;
}
.cell-label {
	white-space: nowrap;
}
.table-noborder > thead > tr > th, 
.table-noborder > tbody > tr > th, 
.table-noborder > tfoot > tr > th, 
.table-noborder > thead > tr > td, 
.table-noborder > tbody > tr > td, 
.table-noborder > tfoot > tr > td {
	border: none;
}
.table-nospace > thead > tr > th, 
.table-nospace > tbody > tr > th, 
.table-nospace > tfoot > tr > th, 
.table-nospace > thead > tr > td, 
.table-nospace > tbody > tr > td, 
.table-nospace > tfoot > tr > td {
	padding: 0;
	border: none;
	vertical-align: top;
}
.table-labeldata > thead > tr > th, 
.table-labeldata > tbody > tr > th, 
.table-labeldata > tfoot > tr > th, 
.table-labeldata > thead > tr > td, 
.table-labeldata > tbody > tr > td, 
.table-labeldata > tfoot > tr > td {
	border-top: 2px solid #fff;
	padding: 4px;
}
.table-labeldata tr td:first-child {
	background-color: #fafafa;
}
.table-labeldata tr td:last-child {
	padding-left: 15px;
}
.table-nospace,
.table-noborder,
.table-labeldata {
	margin-bottom: 10px;
}
.table-labeldata {
	display: flex;
}
.table-oneline > thead > tr > th,
.table-oneline > tbody > tr > td {
	white-space: nowrap;
	overflow: hidden;
	max-width: 200px;
	text-overflow: ellipsis;
}
.table-body-scroll {
	max-height: 30vh;
	overflow-y: auto;
	padding-top: 0;
	margin-top: 0;
}
th {
	background-color: #fff;
}
th.datetime,
td.datetime {
	white-space: nowrap;
}
th.num,
td.num,
th.action,
td.action,
th.btn-col,
td.btn-col {
	text-align: right;
	white-space: nowrap;
}
.float-thead > thead {
	background-color: #fff;
	border-bottom: 2px solid #ddd;
}
.contactlist > li {
	padding-left: 18px;
	display: flex;
	justify-content: space-between;
}
.contactlist > li:hover {
	background-color: #eee;
	border-radius: 4px
}
.contactlist > li > a {
 	flex: 1 0 auto;
	padding: 3px;
	max-width: 90%;
}
.contactlist > li > a + a {
	flex: 0 1 auto;
	border-left: 1px solid transparent;
	padding: 3px 6px 0;
}
.contactlist > li:hover > a + a {
	border-left: 1px solid #fff;
}
.contactlist > li > a + a > i.glyphicon {
	top: 3px;
}
.contactlist > li > a > i.fa-check {
	margin-left: -18px;
}
a.column-sort {
	text-decoration: none;
	white-space: nowrap;
}
.row-actions {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: flex-end;
}
.row-actions li {
}
/*
 * PANELS
 */
.panel-heading {
	overflow: hidden;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.panel-default > .panel-heading {
	border-color: #fff;
}
.panel-heading-overflow {
	overflow: visible;
}
.panel-heading .list-inline {
	margin: 0;
	display: flex;
	justify-content: flex-end;
}
h2.panel-title {
	font-size: 1.3em;
	line-height: 1.3em;
	font-weight: 600;
}
h3.panel-title {
	font-weight: 600;
	padding-top: 3px;
}
.panel-head-info {
	text-align: right;
}
.panel-head-info ul {
	margin: 0;
	padding: 0;
}
.panel-head-info ul li:last-of-type {
	padding-right: 0;
}
.panel-head-info .label {
	font-size: 1.2em;
	background-color: rgba(0,0,0,.1);
	padding: 0.2em 0.6em;
	line-height: 1.4;
}
.panel-head-info .label.badCredit {
	background-color: #d9534f;
	border: 1px solid #1d5586;
}
.panel-default .panel-head-info ul li {
	color: #111;
}
.panel-default .panel-head-info .label {
	color: #333;
}
.panel-heading .btn-link {
	padding:0;
}
.panel-primary > .panel-heading .btn .glyphicon {
	color: #fff;
}
.panel-primary > .panel-heading .btn:hover .glyphicon {
	color: #111;
}
.panel-heading .btn .glyphicon {
	font-size:1.2em;
}
.panel-primary > .panel-heading .btn .fas {
	color: #fff;
}
.panel-primary > .panel-heading .btn:hover .fas {
	color: #111;
}
.panel-heading .btn .fas {
	font-size:1.2em;
}
#ordersubtotal-panel {
	margin-top: 40px;
}
#ordersubtotal-panel td {
	padding: 8px 5px !important;
}
.panel-sub-heading {
	display: flex;
 	justify-content: space-between;
 	align-items: center;
 	padding: 10px 20px;
}
.panel-sub-heading > div:last-of-type {
	margin-left: auto;
}
.panel-body-scroll {
	max-height: 650px;
	overflow-y: auto;
	padding-top: 0;
	margin-top: 0;
}
.panel-body-scroll-sm {
	max-height: 300px;
}
.panel-body-scroll + .panel-body-scroll {
	border-top: 2px dashed #ddd;
}
.panel-body-lg {
	max-height: 420px;
}
.panel-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.panel-footer p {
	margin: 0;
}
button[name="body:search"] {
	margin-right: 15px;
}
/* 
 * TABS
 */
.nav-tabs > li > a {
	border: 1px solid #e9e9e9;
	background-color: #f9f9f9;
	font-size: .95em;
}
.nav-tabs > li.active > a, 
.nav-tabs > li.active > a:hover, 
.nav-tabs > li.active > a:focus {
	outline: none;
}
.tab-content > .tab-pane {
	padding-top: 10px;
	padding-right: 5px;
}
.tab-search .tab-pane {
	padding: 20px 10px 10px 10px;
	border-bottom: 1px solid #ddd;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
}
/*
 * FORMS
 */
input:-webkit-autofill {
    background-color: white !important;
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
    -webkit-text-fill-color: black !important;
}

.form-control:focus {
 	box-shadow: 0 0 0 0.25rem var(--first70);
}
.form-control[disabled], 
.form-control[readonly], 
fieldset[disabled] .form-control {
	background-color: #fafafa;
}
.form-control.form-string {
	border: none;
	box-shadow: none;
}
.control-label.required::before,
.required::before {
	content: "* ";
	color: #d43f3a;
}
.form-control.required {
	border: 1px solid #d43f3a;
}
.form-control.required::placeholder {
	color: #d43f3a;
	text-transform: uppercase;
}
.form-condensed .row {
	margin-right: -12px;
	margin-left: -12px;
}
.form-condensed .form-group {
	margin-bottom: 8px;
}
.form-condensed .col-sm-1, .form-condensed .col-sm-2,
.form-condensed .col-sm-3, .form-condensed .col-sm-4,
.form-condensed .col-sm-5, .form-condensed .col-sm-6,
.form-condensed .col-sm-7, .form-condensed .col-sm-8,
.form-condensed .col-sm-9, .form-condensed .col-sm-10,
.form-condensed .col-sm-11, .form-condensed .col-sm-12 {
	padding-right: 5px;
	padding-left: 5px;
}
.help-text {
	margin: 7px 0;
}
.input-addon-simple {
	background-color: #fff;
	border: none;
}
.list-creditcards {
	display: flex;
	margin: 0;
	padding: 2px 0 0 0;
}
.list-creditcards img {
	box-shadow: 0px 2px 5px rgba(0,0,0,0.2);
}
.disabled {
	opacity: .25;
}
.panel-heading > form {
	width: 50%;
}
.formgroup.no-input > * {
	padding-top: 8px;
}
h2.form-section-title {
	margin-top: 50px;
	color: #1d5586;
	border-bottom: 1px solid #1d5586;
}
/* styles for jquery.freezeheader.js */
#hdfrozen {
	z-index: 9999;
}
#hdfrozen td,
#hdfrozen th {
	background-color: #fff;
}
.btn-below {
	margin: 15px;
}
.sort-order-field {
	max-width: 60px;
}
/* 
 * PAGINATION
 */
.pagination-sm {
	margin-top: 0;
	margin-bottom: 0;
}
/* 
 * MODALS
 */
.modal-backdrop {
   background-color: black;
}
.modal-head-info .list-inline {
	margin-bottom: 0;
}
.modal-head-info button {
	padding: 0;
}
.modal-title {
	font-weight: 600;
}
/*
 * SEARCH FORM and SEARCH STUFF
 */
.searchform .row {
	margin-bottom: 1em;
}
.searchform .row [class^="col-"] {
	padding-top: 3px;
	padding-bottom: 3px;
}
.searchform .row [class^="col-"]:first-of-type {
	padding-left: 3px;
}
.searchform .row .col:last-of-type {
	padding-right: 3px;
}
.searchform .row h4 {
	margin-top: 6px;
	margin-bottom: 8px;
}
.border-left {
	border: 1px solid #ddd;
	border-right: none;
	background-color: #f6f6f6;
	border-radius: 4px;
}
.border-right {
	border: 1px solid #ddd;
	border-left: none;
	background-color: #f6f6f6;
	border-radius: 4px;
}
.border-tb {
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	background-color: #f6f6f6;
}
.filter-text {
	background-color: rgba(0,255,0,.2);
	display: inline-block;
}
/* input fields next to dropdown selects */
.bootstrap-select + .input-group > .form-control,
.bootstrap-select + .form-control {
	/* height: 30px; */
}
/* button next to input field next to dropdown selects */
.bootstrap-select + .input-group > .input-group-btn > .btn,
.bootstrap-select + .input-group-btn > .btn {
	/* padding: 4px 8px; */
}
.filter-status {
	font-style: italic;
	font-size: .95em;
}
.no-results-warning {
	color: #a94442;
	text-align: center;
	font-size: 1.2em;
}
.feedbackPanelERROR {
	color: red;
}
/* 
 * GALLERIES
 */
.fslightbox-container img {
	background-color: #fff;
}
.multi-image .media-gallery {
	display: grid;
    grid-template-columns: repeat(auto-fit, minmax(45%, 1fr));
	gap: 5px;
	grid-auto-flow: dense;
	margin-bottom: 5px;
}
.single-image .media-gallery img,
.multi-image .media-gallery img {
	display: block;
	width: 100%;
	background-color: #fff;
	object-fit: contain;
}
.media-gallery .sortable-ghost {
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5); /* Increase the shadow */
}
.media-gallery li > a:first-child:hover {
 	box-shadow: 0 0 0 0.2rem var(--first30);
}
.media-gallery li {
	display: flex;
	justify-content: center;
	align-items: center;
}
.media-gallery li {
	position: relative;
}
.single-image .media-gallery li {
	display: block;
}
.media-gallery li.video::after {
	font: var(--fa-font-solid);
	content: '\f144';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: white;
	font-size: 3em;
	opacity: .70;
	pointer-events: none;
    text-shadow: 0 0 5px #000;
}
.media-gallery li .media-gallery-delete {
	position: absolute;
	cursor: pointer;
	right: 5px;
	top: 5px;
}
.single-gallery-media-panel,
.media-gallery-panel {
	border: 1px dashed #ddd;
	border-radius: 5px;
	display: flex;
    flex-direction: column;
    align-items: center;
	justify-content: center;
	padding: 30px 0 30px 0;
}

.single-gallery-media-panel.drag-over,
.media-gallery-panel.drag-over {
	border: 1px solid #66FF00;
}
.single-gallery-media-panel,
.media-gallery-panel:hover {
	border: 1px solid #ddd;
}
.panel-article .single-image .media-gallery  {
	display: block;
}
.single-gallery-media-panel img,
.panel-article .single-image .media-gallery img {
	width: 100%;
	max-height: none;
}
/* 
 * ARTICLES
 */
.article-body .html-text {
	font-size: clamp(14px, 1.2vw, 20px);
}
/* 
 * EDIT ARTICLE
 */
blockquote {
    font-style: italic;
    border-left: 4px solid #ccc;
    margin: 1.5em 10px;
    padding: 0.5em 10px;
    color: #555;
    background-color: #f9f9f9;
}
.blockquote p {
    margin: 0;
}
.edit-post {
	margin-bottom: 60px;
}
.edit-post .panel-article .card {
	border: 0;
}
.edit-post textarea {
	width:100%;
}
.edit-post textarea.title {
	font-size: 1.25rem;
	font-weight: 600;
	padding: 8px;
}
.edit-post .html-editor,
.edit-post textarea.title {
	border: 1px solid transparent;
	padding: 8px;
	font-size: clamp(14px, 1.2vw, 20px);
}
.edit-post .html-editor:hover,
.edit-post .html-editor:focus,
.edit-post textarea.title:hover,
.edit-post textarea.title:focus {
	border: 1px solid #ddd;
	border-radius: 5px;
}
.edit-post .html-editor:before {
    content: attr(data-placeholder);
    position: absolute;
    color: #888;
    padding-left: 8px;
}
.edit-post .buttons {
	display: flex;
	gap: 5px;
	align-items: flex-start;
}
.edit-post .blank-image {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	border: 1px dashed #ddd;
}
.edit-post .blank-image > .text-muted {
	transform: translateY(100px);
}
.edit-post .blank-image:hover {
	border: 1px solid #ddd;
}	
.edit-post .blank-image::before {
	font: var(--fa-font-regular);
	content: '\f03e';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 10em;
	opacity: .25;
}
.edit-post .section .col-form-label {
	font-weight: bold;
}
.edit-post .panel-header {
	display: flex;
	flex-direction: column;
  	justify-content: flex-start;
  	gap: 10px;
}
.edit-post .panel-header > ul.header-options {
	display: flex;
  	list-style: none;
  	gap: 10px;
	width: 100%;
	padding-left: 10px;
	padding-right: 10px;
	flex-wrap: wrap;
}
.edit-post .panel-header .header-options > li {
	display: flex;
	align-items: center;
	gap: 10px;
}
.edit-post .panel-header .header-options:first-child > li:last-child {
	margin-left: auto;
}
.edit-post .panel-header .header-options > li label{
	white-space: nowrap;
	font-weight: 600;
	width: 8vw;
	text-align: right;
}
.edit-post .panel-header .header-options > li:nth-of-type(3) label{
	width: 9vw;
}	
.edit-post .panel-header .header-options > li .form-check{
	margin-top: 6px;
}
.tox.tox-tinymce.tox-tinymce-inline  {
	box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.35);
}
.edit-post button::after {
    content: none;
}
.edit-post .input-group.date {
	width: 220px;
}
.edit-post li.status {
	min-width: 130px;
}
.edit-post .card-icons {
	font-size: 1em;
}
/* Make emojis be larger...you know, important stuff */
.tox .tox-dialog__body .tox-collection__item-checkmark, 
.tox .tox-dialog__body .tox-collection__item-icon {
	height: 36px;
	width: 36px;
    font-size: 36px;
    line-height: 1.2;
}
.tox .tox-dialog__body .tox-collection--grid .tox-collection__item {
	padding: 8px;
}
/* Link previews */
.link-preview {
	border: 1px solid #ddd;
	border-radius: 5px;
	max-width: 600px;
}
.link-preview a {
	display: flex;
	flex-direction: row;
}
.link-preview a {
	text-decoration: none;
}
.link-preview span {
	display: block;
}
.link-preview img {
	width: 150px;
	height: auto;
	padding: 3px;
	object-fit: contain;
}
.link-preview .content {
	padding: 5px 10px 5px 10px;
	flex: 1;
}
.link-preview .title {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
	color: #333;
}
.link-preview .site-url {
	color: #0073e6;
}
.link-preview .description {
	font-size: 14px;
	color: #555;
	margin-bottom: 10px;
	max-height: 60px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.link-preview .invalid-link {
	color: red;
	padding: 3px;
}
.link-preview-url {
	font-size: 12px;
	color: #0073e6;
}
.cover-image.drag-over {
	border: 1px solid #66FF00;
}

.select-cover-image-modal li.selected {
	border: 3px solid var(--bs-success);
	box-shadow:0px 12px 12px 1px var(--bs-success);
}
/* articles list page */
.articles-list table tbody > tr {
	cursor: pointer;
}

.articles-list .card-header  {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}
.articles-list .card-body {
	align-items: flex-end;
}
.articles-list .filters  {
	display: flex;
	gap: 3px;
}
.articles-list .filters .select2-container--bootstrap-5 {
	flex: 0 0 auto;
}
.articles-list .filters .input-group {
	width: auto;
}
@media (max-width: 1024px) {
	.articles-list .filters .input-group input {
		font-size: 1.5em;
	}
}

/* user view/edit profile */
.user-profile {
	display:flex;
	flex-direction: row;
	gap: 10px;
}
.user-profile table.user-highlights  {
	align-self: center;
	border-collapse: separate;
	border-spacing: 0 5px;
}
.user-profile table.user-highlights tr td a > i {
	margin-right: 7px;
}
.user-profile table.user-highlights tr td:first-child {
	padding-right: 7px;
	vertical-align: top;
	font-weight: 600;
	text-align: right;
	text-wrap: nowrap;
}
.user-profile table.user-highlights tr td:first-child:after {
	content: ":";
}
.user-profile input.hidden-input,
.edit-user-profile input.hidden-input {
	visibility: hidden; 
	position: absolute;
}
.user-profile td.name {
	font-size: 1.5em;
	font-weight: 700;
}
.user-profile td.title {
	font-size: 1em;
}
.user-profile > img {
	width: 250px;
}
.edit-user-profile .profile-picture {
	width: 150px;
}
.edit-user-profile .input-group small {
	width: 100%;
}
.edit-user-profile .input-group.birthday {
	width: 66.66666667%
}
/* User mentions */
.mention-tag {
    color: #0366d6;
    border-radius: 4px;
    cursor: pointer;
}
.mention-tag:before {
	content: '@';
}
.mention-tag:hover {
    border-bottom: 1px dotted #0366d6;
}

[contenteditable] .mention-tag {
    user-select: none;
    -webkit-user-select: none;
    cursor: default;
}

[contenteditable] .mention-tag:hover {
    background-color: #e1ecf4;
}

/* Add Edit Activity Modal */
.add-edit-activity-modal .post-editor {
	margin-bottom: 10px;
}

/* Mentionable editors */
div.mentionable-editor {
	display: flex;
	height: 100%;
}

div.mentionable-editor > div {
	min-height: 125px;
}

/* People */
.main-scroll-panel .people .people-search select {
	width: 300px;
}
.main-scroll-panel .people .people-container {
	display: grid;
  	grid-gap: 10px;
	grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
}

.main-scroll-panel .people .person {
	display: flex;
	align-items: center;
	border-radius: 12px;
	padding: 10px;
    border: 1px solid var(--bs-border-color);
}

.main-scroll-panel .people .person .name {
	font-weight: bold;
	font-size: 1.2rem;
}
.main-scroll-panel .people .person .profile-img {
	flex: 0 0;
}
.main-scroll-panel .people .person .profile-detail {
	margin-left: 15px;
	width: 58%;
}

/* admin */

.admin-layout {
	display: flex;
  	min-height: 100vh;
}
.sidebar {
	width: 250px;
	background-color: var(--header-bkg);
	color: white;
	padding: 20px;
	overflow-y: auto;
}
.sidebar ul {
	list-style-type: none;
	padding-left: 0;
	margin: 0;
}
.sidebar > ul > li {
	margin-top: 10px;
}
.sidebar ul ul {
	margin-left: 15px;
	padding-left: 0;
	border-left: 2px solid #495057;
}
.sidebar li > div {
	padding: 6px 10px;
	cursor: pointer;
	color: #ffffff;
	transition: background-color 0.2s ease;
	border-radius: 4px;
}
.sidebar li > div:hover {
	color: #adb5bd;
	background-color: #3e444a;
}
.sidebar li > div.selected {
	background-color: #495057;
	color: #ffffff;
}
.sidebar li > div.selected:hover {
	color: #ffffff;
	text-decoration: none;
}
.sidebar li > div.menu-category {
	cursor: default;
	font-size: 1.2em;
	font-weight: bold;
	background: none;
	color: var(--nav-ul-color);
}
.sidebar li > div.menu-category:hover {
	color: var(--nav-ul-hv-color);
}
.main-admin-content {
	flex: 1;
	padding: 30px;
	background-color: var(--section-med-bkg);
}
.section-title {
	font-size: 24px;
	margin-bottom: 20px;
}
button.exit-admin {
	margin-top:30px;
	width: 100%;
}
button.role-info {
	padding: 0 0 0 5px;
}
.permission-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(200px, 1fr));
}
.permission-grid .form-check-label {
	display: inline-flex;
	align-items: flex-start;
	gap: 0.5rem;
}
.permission-grid .permission-label {
	display: inline;
}
td.permission-label {
	width: 250px;	
}
.no-user-list {
	font-style: italic;
	color: #6c757d;
}
.tooltip {
	z-index: 2000;
}
i.permission-info {
	color: var(--link-color);
}
.user-permission-overview table ul > li:not(:last-child)  {
	border-bottom: 1px solid #dee2e6;
}
.user-permission-overview table > tbody > tr:last-child > td {
	border-bottom: none;
}
.user-permission-overview table > tbody > tr:not(:last-child) > td {
	padding-bottom: 15px;
}

body.new-user-profile-page {
	overflow: scroll;	
	background-color: rgb(57, 58, 59);
 	padding-top: 0px;
}

.drag-handle {
	cursor: grab;
}

.up-down-btn {
	height: 38px;
}

.up-down-btn .btn {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 50%;
}

.up-down-btn .btn-up {
	border-top-left-radius: 0.375rem;
	border-top-right-radius: 0.375rem;
	border-bottom: none;
}

.up-down-btn .btn-down {
	border-bottom-left-radius: 0.375rem;
	border-bottom-right-radius: 0.375rem;
}

.up-down-btn i {
	font-size: 0.75em;
}