/*
TRY AND USE THE SITE DEFAULTS AS MUCH AS POSSIBLE

TYPOGRAPHY:
Thought it might be easier to update typography where the css is for each block of layout elements.  If font sizes, weights, margins,
etc. need to be updated refer to the layout sections below and update as needed.  Keep in mind some typography settings are forced to prevent
layout site conflicts.

*/

/*used .btn class to easily add btn-default, btn-primary for bootstrap themes*/

/*Featured Events*/
#e4-featured-events-wrap {
	padding: 2rem 1rem 3rem 1rem;
	background-position: center center;
	background-repeat: no-repeat;
	padding-bottom: 1rem;
}

@media (min-width: 992px) {
	#e4-featured-events-wrap.parallax {
		background-attachment: fixed;
	}
}

#e4-featured-events {
	position: relative;
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}

#e4-featured-events article {
	-webkit-box-flex: 0; 
	flex: 0 0 24%; 
	max-width: 24%;
	margin: 0 .5% 2rem .5%;
}

#e4-featured-events article .date {
	display: block;
	position: relative;
	padding-bottom: 56.25%;
	overflow: hidden;
}

#e4-featured-events article .date .image {
	position: absolute;
	width: 60%;
	height: 100%;
	right: 0;
	top: 0;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

@media (min-width: 768px) {
#e4-featured-events article .date .image {
	width: 100%;
}
}

#e4-featured-events article .date .dates {
	position: absolute;
	left: 0;
	top: 0;
	width: 40%;
	height: 100%;
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	flex-direction: column !important;
	-webkit-box-pack: center;
	justify-content: center;
}

@media (min-width: 768px) {
#e4-featured-events article .date .dates {
	width: 50px;
	min-height: 80px;
	padding: .5rem .25rem;
	height: auto;
}
}

#e4-featured-events article .date .dates div {
	position: relative;
	width: 100%;
	min-height: 1px;
	max-width: 100%;
	text-align: center;
}

@media (min-width: 768px) {
#e4-featured-events article .date .dates div {
	-webkit-box-flex: 0; 
	flex: 0 0 100%; 
}
}

#e4-featured-events article .date .dates div span {
	display: block;
	text-transform: uppercase;
	font-size: 15px;
}

#e4-featured-events article .date .dates div span.day {
	font-weight: 700;
}

#e4-featured-events article .date .dates div:only-of-type span.day {
	font-size: 24px;
}


#e4-featured-events article .info {
	padding: 1.5rem;
}

#e4-featured-events article .info h3 {
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: .75rem;
}

#e4-featured-events article .info .meta {
	font-weight: 700;
	margin-bottom: .75rem;
}

#e4-featured-events article .info .categories {
	margin-bottom: .75rem;
}

#e4-featured-events article .info .rsvp {
	margin-bottom: 0;
}

#e4-featured-events article .info .categories span {
	position: relative;
	display: block;
	margin-bottom: .15rem;
	vertical-align: middle;
}

#e4-featured-events article .info .categories b {
	position: relative;
	display: inline-block;
	width: 10px;
	height: 10px;
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
	border-radius: 50%;
	margin-right: .08rem;
	margin-bottom: 1px;
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0;
}

.slick-list:focus {
    outline: none;
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.slick-track:before,
.slick-track:after {
    content: "";
    display: table;
}

.slick-track:after {
    clear: both;
}

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    display: none;
}

[dir="rtl"] .slick-slide {
    float: right;
}

.slick-slide img {
    display: block;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-arrow.slick-hidden {
    display: none;
}

.slick-prev,
.slick-next {
	position: absolute;
    display: block;
    line-height: 0px;
    cursor: pointer;
	font-size: 0px;
	background-color: transparent;
    padding: 0;
	margin: 0;
    border: none;
    outline: none;
	z-index: 100;
}

@media (min-width: 992px) {
	.slick-prev:hover,
	.slick-next:hover {
		opacity: .5;
	}
}

.slick-prev {
	top: 50%;
	left: -2rem;
	margin-top: -.5rem;
}

.slick-next {
	top: 50%;
	right: -2rem;
	margin-top: -.5rem;
}

.slick-prev:before,
.slick-next:before {
    font-family: 'icons' !important;
  	speak: none;
  	font-style: normal;
  	font-weight: normal;
  	font-variant: normal;
  	text-transform: none;
  	line-height: 1;
  	-webkit-font-smoothing: antialiased;
  	-moz-osx-font-smoothing: grayscale;
	font-size: 18px;
}

.slick-prev:before {
	content:"\edc4";
}

.slick-next:before {
   	content:"\edbc";
}

.slick-prev.slick-disabled,
.slick-next.slick-disabled {
   	opacity: .25;
	cursor: default;
}

.slick-dots {
	margin: 0;
	padding: 1rem 0;
	list-style: none;
	text-align: center;
}


.slick-dots li {
	padding: 0;
	list-style: none;
	display: inline-block;
	vertical-align: middle;
	margin: 0 6px;
}

.slick-dots li:only-child {
	display: none;
}

.slick-dots li button {
	display: block;
	outline: none;
	font-size: 0px;
	width: 12px;
	height: 12px;
	border: none;
	padding: 0;
	margin: 0;
	overflow: hidden;
	line-height: 1;
	border-radius: 100%;
	cursor: pointer;
}

.slick-dots li button:hover {
	opacity: .5 !important;
}

/*Slick Custom*/
#e4-featured-controls {
	position: relative;
	text-align: center;
	margin: 2rem 0;
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	-webkit-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
}

#e4-featured-controls .slick-dots {
	padding: 0 !important;
}

#e4-featured-controls .slick-prev,
#e4-featured-controls .slick-next {
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	vertical-align: middle;
	margin: 0 .5rem;
	outline: none;
    border: none;
}

#e4-featured-controls .slick-next {
	-webkit-box-ordinal-group: 14;
	order: 13;
}

#e4-featured-controls .slick-next:active,
#e4-featured-controls .slick-prev:active {
	outline: none;
    border: none;
}

#e4-featured-events.e4-slick {
	position: relative;
	display: block;
}

#e4-featured-events.e4-slick article {
	max-width: 100%;
	margin: 0 1px;
}

.e4-slick {
	position: relative;
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.e4-slick.slick-initialized {
	visibility: visible;
	opacity: 1;
}

/*Heading and toggle - script adjusts for small views*/
#e4-heading {
	position: relative;
	padding: 2rem 0;
	text-align: center;
}

#e4-view-title {
	text-transform: capitalize;
}

#e4-heading p {
	font-size: 1.25rem;
	margin-bottom: 0;
}

#e4-view {
	display: none;
	position: relative;
	bottom: -30px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	text-align: right;
	z-index: 99999;
}
@media (min-width: 992px) { /*shold match e4IsSmall windowsize in events4.js  if heading gets long or this changes may need to change how this bottom is set to not overlap heading*/
#e4-view {
	display: block;
}
}

#e4-view li {
	display: inline-block;
	margin: 0 0 0 .25rem !important;
	list-style: none !important;
}

#e4-view li a {
	display: block;
	border-radius: 0rem;
	height: 40px;
	width: 40px;
	text-align: center;
}

#e4-view li a.active {
}

#e4-view li i {
	display: block;
	font-size: 1.125rem;
	position: relative;
	top: 50%;
  	-webkit-transform: translateY(-50%);
  	-ms-transform: translateY(-50%);
  	transform: translateY(-50%);
}

/*Filters*/
#e4-filters {
	margin-bottom: 2rem;
}

#e4-filters-form .e4-sorter-wrap {
	width: 100%;
	position: relative;
	display: -webkit-box;
    display: flex;
	flex-wrap: wrap;
	-webkit-box-pack: center;
	justify-content: center;
	z-index: 999;
	margin-bottom: 2rem;
}


#e4-filters-form .filter-categories {
	padding: 1rem; 
	position: relative; 
	display: -webkit-box; 
	display: flex; 
	flex-wrap: wrap; 
	margin: 0 !important;
	list-style: none !important;
}

#e4-filters-form .filter-categories li {
	list-style: none !important;
	margin: 0 0 .25rem 0 !important;
	-webkit-box-flex: 0; 
	flex: 0 0 100%; 
	max-width: 100%;
	transition: .2s opacity ease-in-out;
}

@media (min-width: 768px) { 
#e4-filters-form .filter-categories li { 
	-webkit-box-flex: 0; 
	flex: 0 0 18%;
	max-width: 18%;
	margin: .25rem 1% !important;
}
}

#e4-filters-form .filter-categories li label {
	display: inline-block; 
	cursor: pointer; 
	position: relative; 
	padding-left: 20px;  
	font-size: 16px; 
	font-weight: 400; 
	line-height: 18px; 
	-webkit-touch-callout: none; 
	-webkit-user-select: none; 
	-moz-user-select: none; 
	-ms-user-select: none; 
	user-select: none;
}

#e4-filters-form .filter-categories li label:before {
	content: ""; 
	display: inline-block; 
	position: absolute; 
	left: 0;
	top: 1px;
	width: 12px; 
	height: 12px; 
	border-width: 1px;
	border-style: solid;
	border-radius: 50%;
}

#e4-filters-form .filter-categories li input[type="checkbox"]:checked + label:before { 
	background-color: transparent !important;
}

#e4-filters-form .filter-categories li input { 
	display: none;
}

#e4-filters-form .filter-categories li:hover {
	opacity: .6;
}

#e4-filters .reset {
	margin-top: 1rem;
	opacity: 0;
	visibility: hidden;
	max-height: 0px;
	transition: .2s all ease-in-out;
}

#e4-filters .reset.visible {
	opacity: 1;
	max-height: 20rem;
	visibility: visible;
}

#e4-filters .reset ul {
	margin: 0 !important;
	padding:  0 !important;
	list-style: none !important;
	display: -webkit-box; 
	display: flex; 
	flex-wrap: wrap;
	-webkit-box-pack: center;
	justify-content: center; 
}

#e4-filters .reset ul li {
	margin: .25rem .5rem !important; 
	padding:  0 !important;
	list-style: none !important;
	-webkit-box-flex: 0; 
	flex: 0 0 auto; 
	width: auto; 
	max-width: none;
}

#e4-filters .reset ul li a {
	display: block;
	font-size: 15px;
	padding: .5rem 1rem;
	border-radius: 2rem;
	border-width: 2px;
	border-style: solid;
}

#e4-filters .reset ul li a i {
	margin-right: .25rem;
}

/*Pagination*/
.e4-layout-pagination {
	text-align: center;
	margin-bottom: 3rem;
}

.e4-layout-pagination .heading {
	display: inline-block;
	vertical-align: middle;
	width: 70%;
	max-width: 260px;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 16px;
}

@media (min-width: 768px) { 
.e4-layout-pagination .heading {
	font-size: 22px;
}
}

.e4-layout-pagination a {
	display: inline-block;
	vertical-align: middle;
	background-color: transparent;
	margin-top: 4px;
}

.e4-layout-pagination a:hover {
	background-color: transparent !important;
}

.e4-layout-pagination a i {
	font-size: 1.125rem;
}

@media (min-width: 768px) { 
.e4-layout-pagination a i {
	font-size: 1.5rem;
}
}

/*Layout*/
#e4-load {
	position: relative;
	margin-bottom: 2rem;
}

#e4-load.preloading {
	min-height: 30rem;	
}

#e4-load.preloading:after {
	content:"";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,.94);
	background-image: url(/_assets/img/loaders/preloader.svg);
	background-repeat: no-repeat;
	background-position: center 64px;
	background-size: 64px 64px;
}

#e4-load .nrf {
	text-align: center;
}

/*List Layout*/
#e4-layout-list {

}

#e4-layout-list .month-view {
}

#e4-layout-list .grouping {
	font-weight: 700;
	margin: 1.5rem 0;
	text-transform: uppercase;
}

#e4-layout-list .grouping span {
	font-size: 16px;
	font-weight: 400;
	text-transform: none;
}

#e4-layout-list article {
	margin: 1rem 0;
	display: -webkit-box;
	display: flex;
}

#e4-layout-list article a {
}

#e4-layout-list article a :hover{
}

#e4-layout-list article .date {
	position: relative;
	min-height: 1;
	max-width: 100%;
	width: 60px;
	min-width: 60px;
	display: flex;
	-webkit-box-align: center;
	align-items: center;
}

#e4-layout-list article .date div {
	width: 100%;
	min-width: 100%;
	text-transform: uppercase;
	text-align: center;
}

#e4-layout-list article .date .day {
	display: block;
	font-weight: 700;
	font-size: 24px;
}

#e4-layout-list article .date .month {
	display: block;
}

#e4-layout-list article .info {
	padding: 1rem;
	position: relative;
	min-height: 1;
	max-width: 100%;
}

#e4-layout-list article .info h3 {
	font-size: 28px;
	font-weight: 700;
	margin: 0 0 .25rem 0;
}

#e4-layout-list article .info p.meta {
	font-size: 16px;
	margin-bottom: .5rem;
}

#e4-layout-list article .info p.meta b {
	text-transform: uppercase;
	font-weight: 700;
	margin-left: 1rem;
}

#e4-layout-list article .info p.meta b:first-of-type {
	margin-left: 0;
}

#e4-layout-list article .info p.meta span.sep {
	margin: 0 .125rem;
}

#e4-layout-list article .info p.meta i.repeat {
	margin-left: .25rem;
	font-style: italic;
}

#e4-layout-list article .info p.categories {
	margin-bottom: 0;
	line-height: 1;
}

#e4-layout-list article .info p.categories span {
	position: relative;
	display: inline-block;
	margin-right: .75rem;
	vertical-align: middle;
	    font-size: 14px;
}

#e4-layout-list article .info .categories b {
	position: relative;
	display: inline-block;
	width: 10px;
	height: 10px;
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
	border-radius: 50%;
	margin-right: .08rem;
}

/*Calendar Layout*/
#e4-layout-calendar .month-view {
}

#e4-layout-calendar table.calendar {
    table-layout: fixed;
  	width: 100%;
	border-collapse: separate !important;
	border-spacing: 2px;
}

#e4-layout-calendar table.calendar tr.calendar-row {

}

#e4-layout-calendar table.calendar th {
	padding: 10px;
	background: none;
	font-size: 15px;
    font-weight: 700;
	text-transform: uppercase;
	text-align: center;
}

#e4-layout-calendar table.calendar td {
	border: 1px;
  	border-style: solid;
  	height: 120px;
 	padding: 5px;
  	vertical-align: top;
}

#e4-layout-calendar table.calendar td.calendar-day {
}

#e4-layout-calendar table.calendar td.calendar-day-np {
}

#e4-layout-calendar table.calendar div.day-number {
	margin: 0 0 1rem 0;
}

#e4-layout-calendar table.calendar div.day-number span {
	display: inline-block;	
	width: 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 50%;
	text-align: center;
}

#e4-layout-calendar table.calendar .calendar-links {
	margin: .25rem !important;
	padding: 0 !important;
	list-style: none !important;
}

#e4-layout-calendar table.calendar .calendar-links li {
	margin: 0 0 .35rem 0 !important;
	padding: 0 !important;
	list-style: none !important;
	line-height: 1.1;
}

#e4-layout-calendar table.calendar .calendar-links li a {
}

#e4-layout-calendar table.calendar .calendar-links li a:hover {
}

#e4-layout-calendar table.calendar .calendar-links li span {
	margin-right: .2rem;
}

#e4-layout-calendar table.calendar .calendar-links li span.categories {
	margin: 0 .25rem 0 0;
}

#e4-layout-calendar table.calendar .calendar-links li span.categories b {
	position: relative;
	display: inline-block;
	width: 7px;
	height: 7px;
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
	border-radius: 50%;
	margin-right: .15rem;
}

#e4-layout-calendar table.calendar .calendar-links li span.title {
	font-size: 13px;
}

/*Event Detail*/
#e4-layout-detail {

}

#e4-layout-detail .details {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	 -webkit-box-pack: justify;
	 justify-content: space-between; }
}

#e4-layout-detail .info {
	-webkit-box-flex: 0;
	flex: 0 0 100%;
	max-width: 100%;
	margin-bottom: 2rem;
}

@media (min-width: 768px) { 
#e4-layout-detail .info {
	-webkit-box-flex: 0; 
	flex: 0 0 65%; 
	max-width: 65%;
}
}

#e4-layout-detail .meta {
	-webkit-box-flex: 0;
	flex: 0 0 95%;
	max-width: 95%;
	padding: 1rem 2.5%;
	border-width: 0px;
	border-style: solid;
	margin-bottom: 2rem;
	position: relative;
	padding-left: 2.5rem;
	position: relative;
	z-index: 999999999;
}

#e4-layout-detail .meta:before {
	content : '';
	display: block;
	position: absolute;
	width: 10000%;
	height: 10000%;
	top: 0;
	left: -20px;
	z-index: 0;
}

#e4-layout-detail .meta > * {
	position: relative;
	z-index: 999999999;
}

@media (min-width: 768px) { 
	#e4-layout-detail .meta {
		-webkit-box-flex: 0;
		flex: 0 0 27.5%;
		max-width: 27.5%;
		margin-bottom: 0;
		z-index: 1;
	}
}

@media (max-width: 767px){
	#e4-layout-detail .meta {
		padding: 1rem 2.5%;
	}
}

#e4-layout-detail .image {
	margin-bottom: 1rem;
}

#e4-layout-detail .image img {
	display: block;
	width: 100%;
	height: auto;
}

#e4-layout-detail p.categories span {
	position: relative;
	display: inline-block;
	margin-right: .75rem;
	vertical-align: middle;
}

#e4-layout-detail p.categories b {
	position: relative;
	display: inline-block;
	width: 10px;
	height: 10px;
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
	border-radius: 50%;
	margin-right: .08rem;
}

#e4-layout-detail .info h5.coord {
	font-weight: normal;
}

#e4-layout-detail .info h5.coord b.sep {
	margin: 0 .25rem 0 0;
}


#e4-layout-detail .info h5.coord span {
	font-size: 1rem;
}

#e4-layout-detail .meta h5 {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	padding-bottom: .25rem;
	padding-top: 2em;
}

#e4-layout-detail .meta h6 {
	text-transform: uppercase;
	margin-bottom: .25rem;
}

#e4-layout-detail .meta p {
	margin-bottom: 1em;
}

#e4-layout-calendar table.calendar div.day-number span {
  color: #3c3c3c;
}

#e4-layout-list article .info p.meta i.repeat {
  color: rgba(0,0,0,.3);
}

#e4-featured-events article .date,
#events_4_layout .slick-dots li button {
  background-color: gray;
}

#e4-view li a  {
}

#events_4_layout .rsvp a {
	background-color: transparent;
}

#events_4_layout p > a.website {
    white-space: normal;
    word-break: break-all;
    display: block;
}
#e4-featured-controls .slick-prev:focus, 
#e4-featured-controls .slick-next:focus,
#e4-featured-events.e4-slick article:focus,
#e4-featured-events.e4-slick article a:focus {
	outline: none;
}

#e4-featured-controls .slick-prev,
#e4-featured-controls .slick-next {
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	vertical-align: middle;
	margin: 0 .5rem;
	margin-top: 2px;
}

#e4-featured-controls .slick-next {
	-webkit-box-ordinal-group: 14;
	order: 13;
}

#e4-featured-events.e4-slick {
	position: relative;
	display: block;
}

#e4-featured-events.e4-slick article {
	max-width: 100%;
	margin: 0 1px;
}

.e4-slick {
	position: relative;
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.e4-slick.slick-initialized {
	visibility: visible;
	opacity: 1;
}

#content.overflowXHidden {
	overflow-x: hidden;
}

@media (max-width: 480px) {
	#e4-layout-list article .info p.meta .time:before {
		content :'';
		display: block;
		clear: both;
	}
	#e4-layout-list article .info p.meta i.repeat {
        display: block;
        margin: 0;
        padding: 0;
    }
}

#e4-layout-detail article .details .meta a:hover,
#e4-layout-detail article .details .meta a {
	background-color: transparent;
	font-size: 18px;
	font-weight: 700;
	line-height: 19.8px;
}