/* Arlo CSS Variables */
.arlo {
	--primary-theme-color: #312783; /* Primary color of the theme - Used in primary button */
	--primary-theme-color-hover: #5371b6; /* Primary hover color */
	--primary-light-text-color: #FFFFFF; /* Text color on the --primary-theme-color */
	--primary-text-color: #312783; /* Global text color */
	--primary-blank-bg-color: #FFFFFF;
	--primary-light-bg-color: #f0efee; /* Used in event search page */
	--primary-card-shadow-color: #0000001A; /* Card element boxshadow color */
	--primary-card-border-color: #E1E1E1;/* Card element border color */
	--secondary-background-color: #ffffff; /* Secondary theme color: Used in secondary button */
	--secondary-background-color-hover: #312783; /* Hover color */
	--secondary-background-text-color: #FFFFFF; /* Text color above the secondary background color */
	--primary-tag-color: #89ccca; /* Tag element border and text color */
	--primary-tag-background-color: #e7f5f4; /* tag element background color */
	--arlo-discount-bg-color: #fcc043; /* Discount info box background color */
	--arlo-image-placeholder-bg-color: #f0efee;
	
	/* Additional Variables */
	--secondary-theme-color: #89ccca; /* Used for date tabs on the course cards */
	--button-border-radius: 12px;
}

/* Global Styles =========================================== */
.modal {
	display: none;
}
.arlo {
	line-height: 1.5;
}
#arloapp {
	padding-bottom: 60px;
	padding-top: 40px;
}
#arloapp.arlo-desktop.arlo-pad {
	padding-bottom: 30px;
	padding-top: 30px;
}
.arlo .arlo-desktop select {
	border: 1px solid var(--primary-theme-color);
}
.arlo .arlo-desktop .arlo-events-item-main > h3 {
	font-weight: 600;
	line-height: 1.3;
}
.arlo .arlo-desktop .arlo-events-item-main-info p {
	padding: 0;
}
.arlo .arlo-desktop .arlo-catalog-filters #arlo-event-filter select.arlo-filter-templatetag,
.arlo .arlo-desktop .arlo-upcoming-filter .arlo-filters select.arlo-filter-templatetag,
.arlo .arlo-desktop .arlo-upcoming-filter .arlo-filters label[for="arlo-filter-templatetag"] {
	display: none;
}
@media (max-width: 767px) {
	#arlo {
		padding-top: 4rem;
	}
	#arloapp.arlo-desktop.arlo-pad {
		padding-top: 2rem;
	}
}
/* Button Styles */
.arlo .arlo-desktop .arlo-button,
.arlo .arlo-desktop .arlo-event .arlo-no-results a,
.arlo .arlo-desktop .arlo .arlo-schedules-item-dates-items .arlo-register,
.arlo .arlo-desktop .arlo .arlo-schedules-item-dates-items .arlo-event-search-result-item .arlo-event-next-running .arlo-event-search-result-item-schedule-item,
.arlo .arlo-desktop .arlo-event-search-result-item .arlo-event-next-running .arlo .arlo-schedules-item-dates-items .arlo-event-search-result-item-schedule-item,
.arlo .arlo-desktop .arlo .arlo-schedules-item-dates-items .arlo-schedules-item-dates-items-item,
.arlo .arlo-desktop select {
	border-radius: var(--button-border-radius); /* Corner roundness - Default: 5px */
}

/* Dropdown Filter */
.arlo .arlo-desktop select {
	border-radius: var(--button-border-radius); /* Corner roundness - Default: 6px */
}

/* Cards Element */
.arlo .arlo-desktop .arlo-event-list-items-item-bg,
.arlo .arlo-desktop .arlo-events-item,
.arlo .arlo-desktop .arlo .arlo-schedules-item,
.arlo .arlo-desktop .arlo-upcoming-result-events-item,
.arlo .arlo-desktop .arlo-activities-item,
.arlo .arlo-desktop .arlo-venue-list-item,
.arlo .arlo-desktop .arlo-presenters-item {
	box-shadow: none; /* Default: 0px 0px 8px var(--primary-card-shadow-color); */
}
.arlo .arlo-desktop .arlo-upcoming-filter > h2,
.arlo .arlo-desktop .arlo-upcoming-result-events-item-title > h2,
.arlo .arlo-desktop .arlo-upcoming-result-events-item-date div:nth-child(2),
.arlo .arlo-desktop .arlo-activities-item-title,
.arlo .arlo-desktop .arlo-venue-list-item-address-name,
.arlo .arlo-desktop .arlo-presenters-item-footer > p,
.arlo .arlo-desktop .arlo-event-section-title p,
.arlo .arlo-desktop .arlo-event-online-item-title {
	font-weight: 600;
}
.arlo .arlo-desktop .arlo-events-item-main-tags span,
.arlo .arlo-desktop .arlo-events-item-main-tags li {
	border: 1px solid var(--secondary-theme-color);
	color: var(--primary-theme-color);
}
/* Paint Effect on Image */
.arlo .arlo-desktop .arlo-events-item-cover,
.arlo-venue-map {
	position: relative;
}
.arlo .arlo-desktop .arlo-events-item-cover:after,
.arlo-venue-map:after {
	background-color: #ffffff;
	bottom: 0;
	content: '';
	height: 10px;
	left: 0;
	-webkit-mask: url('https://assets.codepen.io/597099/paint-effect.png') no-repeat bottom;
	-webkit-mask-size: cover;
	mask: url('https://assets.codepen.io/597099/paint-effect.png') no-repeat bottom;
	mask-size: cover;
	position: absolute;
	transform: scaleY(-1);
	width: 100%;
}

/* Upcoming Events List =========================================== */
.arlo .arlo-desktop .arlo-upcoming-result-events-item-date {
	background-color: var(--secondary-theme-color);
	color: var(--primary-theme-color);
}
.arlo .arlo-desktop .arlo-button.arlo-gray {
	border: 2px solid var(--primary-theme-color);
	color: var(--primary-theme-color);
}
.arlo .arlo-desktop .arlo-button.arlo-gray:hover {
	color: var(--secondary-background-text-color);
}

/* Online Activities List =========================================== */
.arlo .arlo-desktop .arlo-activities-item-note {
	color: var(--primary-theme-color);
}

/* Venues List =========================================== */
.arlo .arlo-desktop .arlo-venue-list-item .arlo-button,
.arlo .arlo-desktop .arlo-presenters-item .arlo-button {
	width: 136px;
}

/* Catalogue =========================================== */
.arlo .arlo-desktop .arlo-catalog-header,
arlo-catalog-moreheader,
.arlo .arlo-desktop .arlo-catalog-footer,
.arlo .arlo-desktop .arlo-events-item-cover span:not(:has(div)) {
	display: none;
}
.arlo .arlo-desktop .arlo-events-item-cover-date {
	z-index: 9;
}

/* Course Template =========================================== */
#arloapp.arlo-event-page {
	padding-top: 0;
}
#arloapp.arlo-desktop.arlo-pad.arlo-event-page {
	padding-top: 0;
}
.arlo .arlo-desktop .arlo-event-list-items-item-time-calendar p,
.arlo .arlo-desktop .arlo-events-item-cover-date p {
	padding-bottom: 0;
}
.arlo .arlo-desktop .arlo-event-basic-cover {
	position: relative;
}
.arlo .arlo-pad .arlo-event-basic-cover {
	overflow: hidden;
}
.arlo .arlo-desktop .arlo-event-basic-cover:after {
	background-color: var(--primary-theme-color);
	content: '';
	height: 100%;
	-webkit-mask: url('https://assets.codepen.io/597099/pain-effect-right.png') no-repeat center;
	-webkit-mask-size: cover;
	mask: url('https://assets.codepen.io/597099/pain-effect-right.png') no-repeat center;
	mask-size: cover;
	position: absolute;
	right: -20px;
	top: 0;
	transform: scaleX(-1);
	width: 40px;
}
.arlo .arlo-desktop.arlo-pad .arlo-event-basic-cover:after {
	bottom: 0;
	height: 20px;
	left: 0;
	-webkit-mask: url('https://assets.codepen.io/597099/paint-effect.png') no-repeat bottom;
	mask: url('https://assets.codepen.io/597099/paint-effect.png') no-repeat bottom;
	right: auto;
	top: auto;
	transform: scaleY(-1);
	width: 100%;
}

/* Single Pages =========================================== */
.arlo_event-template-default .breadcrumbs,
.arlo_presenter-template-default .breadcrumbs,
.arlo_venue-template-default .breadcrumbs {
	width: 100%;
}
.arlo_event-template-default .wrap,
.arlo_presenter-template-default .wrap,
.arlo_venue-template-default .wrap {
	padding: 0;
	width: 100%;
}
.arlo_event-template-default .col,
.arlo_presenter-template-default .col,
.arlo_venue-template-default .col{
	padding: 0;
}
.arlo_event-template-default .col-main,
.arlo_presenter-template-default .col-main,
.arlo_venue-template-default .col-main {
	width: 100%;
}
.arlo_event-template-default .col-sidebar,
.arlo_presenter-template-default .col-sidebar,
.arlo_venue-template-default .col-sidebar {
	display: none;
}
.arlo_event-template-default .col.col-primary-content > h1,
.arlo_presenter-template-default .col.col-primary-content > h1,
.arlo_venue-template-default .col.col-primary-content > h1 {
	display: none;
}
@media (min-width: 768px) {
	.arlo_event-template-default .main,
	.arlo_presenter-template-default .main,
	.arlo_venue-template-default .main {
		padding-top: 0;
	}
	.arlo_event-template-default .breadcrumbs,
	.arlo_presenter-template-default .breadcrumbs,
	.arlo_venue-template-default .breadcrumbs {
		display: block;
		margin: 0 auto;
		position: static;
		max-width: 1200px;
	}
	.arlo_event-template-default .wrap,
	.arlo_presenter-template-default .wrap,
	.arlo_venue-template-default .wrap {
		width: 100%;
	}
	.arlo_event-template-default .col,
	.arlo_presenter-template-default .col,
	.arlo_venue-template-default .col {
		float: none;
	}
	.arlo_event-template-default .col-main,
	.arlo_presenter-template-default .col-main,
	.arlo_venue-template-default .col-main {
		width: 100%;
	}
	.arlo_event-template-default .col-sidebar,
	.arlo_presenter-template-default .col-sidebar,
	.arlo_venue-template-default .col-sidebar {
		display: none;
	}
	.arlo_event-template-default .col.col-primary-content h1,
	.arlo_presenter-template-default .col.col-primary-content h1,
	.arlo_venue-template-default .col.col-primary-content h1 {
		border: 0;
	}
}