/* Remove this when moving to prod */
@import url('https://fonts.googleapis.com/css2?family=Suez+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&display=swap');
/* --- */

.arlo {
	/* Default variables */
	--primary-theme-color: #e82731;
	--primary-theme-color-dark: #006472;
	--secondary-background-color: #242526;

	--primary-theme-color-hover: #006472;
	--primary-text-color: #676767;
	--primary-card-shadow-color: #0000001A;
	--primary-tag-color: #B3460E;
	--primary-tag-background-color: #F792561A;
	--arlo-discount-bg-color: #00b3ba;
	
	/* Added variables */
	--arlo-page-bgcolor: #ffffff;
	--primary-theme-color-20: #e8273133;
	--primary-theme-color-10: #e827311a;
	--arlo-heading-color: #444444;

	--arlo-font-family-heading: 'Suez One', serif;
	--arlo-font-family-body: 'Cormorant Garamond', serif;	/* Change the value to inherit when moving to prod */
	
	--arlo-font-size-body: 20px;
	--arlo-font-weight-heading: 400;
	--arlo-line-height-body: 1.1;
	--arlo-button-radius: 30px;
	--arlo-button-box-shadow: 10px 10px 30px #d9d9d9,-10px -10px 30px #fff;
}

/* GLOBAL OVERRIDES ------------------------ */
.arlo .arlo-desktop,
.arlo .tingle-modal-box__content {
	font-family: var(--arlo-font-family-body);
	font-size: var(--arlo-font-size-body);
}
.arlo .arlo-desktop .arlo-wrapper * {
	font-family: inherit;
}
.arlo .arlo-desktop .arlo-wrapper,
.arlo .arlo-desktop .arlo-event-basic.noimage .arlo-event-basic-info {
	max-width: unset;
	width: auto;
}
.arlo .arlo-desktop select {
	border-radius: 30px;
}


/* COURSE TEMPLATE ------------------------ */
.arlo .arlo-desktop .arlo-event-basic {
	background-color: var(--arlo-page-bgcolor);
	color: var(--primary-text-color);
}
.arlo .arlo-desktop .arlo-event-basic-info > div > h1 {
	color: var(--arlo-heading-color);
	font-family: var(--arlo-font-family-heading);
	font-weight: var(--arlo-font-weight-heading);
}
.arlo .arlo-desktop .arlo-event-basic-info > div > p {
	font-size: var(--arlo-font-size-body);
}
.arlo .arlo-mobile .arlo-event-list-items-item {
	height: auto;
}
.arlo .arlo-desktop .arlo-event-list-items-item-wrapper {
	position: relative;
}
.arlo-event_tags-list {
	align-self: flex-start;
	list-style: none;
	padding: 0;
}
.arlo-event_tags-list li {
	background-color: var(--primary-theme-color-10);
	line-height: 1.2;
	list-style: none;
	border-radius: 12px;
	padding: 4px 8px;
}
.arlo .arlo-desktop .arlo-event-list-items-item-bg {
	border: 0;
	border-radius: 30px;
	box-shadow: inset 10px 10px 30px #d9d9d9,inset -10px -10px 30px #fff;
	overflow: hidden;
}
.arlo .arlo-desktop .arlo-event-list-items-item-bg:hover {
	box-shadow: 10px 10px 30px #d9d9d9, -10px -10px 30px #fff;
	transform: translate3d(0,-10px,0);
}
.arlo .arlo-desktop .arlo-event-list-items-item-time-calendar {
	font-family: var(--arlo-font-family-heading);
}
.arlo .arlo-desktop .arlo-event-list-items-item-time-calendar > p {
	font-family: var(--arlo-font-family-heading);
	font-size: 28px;
}
.arlo .arlo-desktop .arlo-event-list-items-item-time-calendar > p:nth-child(2) {
	font-size: 22px;
	font-family: var(--arlo-font-family-heading);
}
.arlo .arlo-desktop .arlo-event-list-items-item-time-detail {
	font-size: var(--arlo-font-size-body);
	line-height: var(--arlo-line-height-body);
}
.arlo .arlo-desktop .arlo-event-list-items-item-info > div {
	border: 0;
	font-size: var(--arlo-font-size-body);
	line-height: var(--arlo-line-height-body);
	padding: 4px 0;
}
.arlo .arlo-desktop .arlo-event-list-items-item-info > .arlo-event-note {
	font-size: 18px;
	margin-top: -2px;
	padding-left: 30px;
	padding-top: 0;
}
.arlo .arlo-desktop .arlo-event-list-items-item-info .arlo-event-offer-wrapper {
	color: #e8273196;
	font-family: var(--arlo-font-family-heading);
}
.arlo .arlo-desktop .arlo-event-list-items-item-info > div > svg,
.arlo .arlo-desktop .arlo-event-list-items-item-info > div > i {
	font-size: 18px;
}
.arlo .arlo-desktop .arlo-button {
	border-radius: var(--arlo-button-radius);
	box-shadow: var(--arlo-button-box-shadow);
	font-size: var(--arlo-font-size-body);
	font-weight: 600;
	transition: all ease .15s;
}
.arlo .arlo-desktop .arlo-button.arlo-register:hover {
	background-color: #ffffff;
	border-color: transparent;
	box-shadow: inset 5px 5px 20px #d9d9d9,inset -5px -5px 20px #fff;
	color: var(--primary-theme-color);
}
.arlo .arlo-desktop .arlo-event-section-content p {
	font-size: var(--arlo-font-size-body);
}
.tingle-modal-box__content * {
	font-family: inherit;
}