@import url("../Agile-Web24/styles.css");
:root {
--epg-backcolor: white;
--epg-textcolor: black;
--epg-color1: #0065a0;
--epg-color1text: white;
--epg-color2: #000000;
--epg-color2text: white;
--epg-color3: #7db0df;
--epg-color3text: black;
}
body {
	font-family: 'Source Sans Pro',sans-serif;	
}
.agl-intro .agl-navigation-main > li:hover > a, .agl-navigation-cart:hover, .agl-navigation-user:hover, .agl-navigation-search:hover, .EpgHeaderLogo:hover { 
	animation-name: unset; 
}
.epgColor2Back { 
	background-color: #000000; 
	color: #ffffff; 
}
.agl-intro { 
	background-color: black;
	transition: background-color .5s;
}
.agl-intro.transparent, .agl-footer.transparent { 
	background-color: transparent; 
	box-shadow: none; 
	position: relative;
	transition: background-color .5s;  
}
.EpgHeaderLogo { 
	filter: none; 
	width: 260px; 
	height: 73px; 
	margin-top: 35px; 
	margin-left: 63px; 
	transition: margin-top .5s;
}
#secondaryMenu { 
	height: 50px; 
	justify-items: flex-end;
	transition: all .5s ease;
	transition-behavior: allow-discrete; 
	opacity: 1;
	scale: 1;
}
#secondaryMenu.site-header__container {
	display: none;
	height: 0;
	opacity: 0;
	scale: 0;
}
#lowerMenu { 
	display: flex; 
	list-style-type: none; 
	gap: 20px; 
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(10, 37, 65, .33)), to(rgba(10, 32, 62, 0)));
	background: linear-gradient(180deg, rgba(10, 37, 65, .33) 0%, rgba(10, 32, 62, 0) 100%);
}
.lowerMI a { 
	display: block; 
	padding: 10px; 
	text-decoration: none; 	
	color: white; 
	font-size: 18px; 
}
.lowerMI ul { 
	display: none; 
}
.lowerMI:hover { 
	text-decoration: underline !important; 
}
.lowerMI:hover > ul { 
	display: flex; 
	flex-direction: column; 
	background-color: rgba(11, 16, 27, 0.9); 
	color: #ffffff; 
	position: absolute; 
	padding: 0 5px 5px 5px;
}
.lowerMI:last-child:hover ul {
	right: 0;
}
.lowerMI ul li:not(:last-child) {
	border-bottom: 1px solid grey;
}
.agl-container:has(.agl-basketclock > div) { 
	padding-top: 125px; 
}
.agl-container:has(.agl-basketclock > div) {
    padding-top: 150px;
}
.agl-info .agl-container:has(.agl-basketclock > div) {
	padding-top: 0px
}
.agl-info .agl-basketclock {
	top: 125px;
}
.agl-basketclock {
	transition: top .5s ease;
}
.agl-container.no-space { 
	padding-top: 0; 
}
.agl-header { 
	max-width: calc(100vw - 10px); 
}
.agl-footer {
	background-color: black;
}
.agl-footerinclude {
	border: solid 50px transparent;
}
#footerItems {
	max-width: 1440px;
	margin: auto;
}

.AgileList-Tiles-4 {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	grid-auto-rows: 1fr;
	margin-top: 12px; 
}

.AgileList-Tiles-4 .Item { 
	box-shadow: none !important;
	display: flex !important;
	flex-direction: column;
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	background: white;
	overflow: hidden; 
}

.AgileList-Tiles .ImageBox {
	position: relative !important;
	overflow: hidden !important;
	flex: 1; 
	max-height: 400px; 
	transition: background-color .5s;
	isolation: isolate;
}

.AgileList-Tiles .ImageBox img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}


.AgileList-Tiles-4 .Item .ImageBox.placeholder-image,
.AgileList-Tiles .Item .ImageBox.placeholder-image {
	background-color: #cccccc !important;
	background-image: none !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.AgileList-Tiles-4 .Item .ImageBox.placeholder-image img,
.AgileList-Tiles .Item .ImageBox.placeholder-image img {
	object-fit: contain !important;
	width: 50% !important;
	height: 50% !important;
	max-width: 200px !important;
	max-height: 200px !important;
	background: transparent !important;
}

.AgileList-Tiles .ImageBox:not(.placeholder-image) .DescriptionContainer {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	background-color: rgba(0,0,0,.8) !important;
	color: white;
	padding: 10px;
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .5s, transform .5s;
	display: flex;
	flex-direction: column;
	overflow-y: auto;
	pointer-events: none;
	z-index: 10;
	margin-top: 0;
}

.AgileList-Tiles .ImageBox:not(.placeholder-image) .DescriptionContainer.hovered {
	opacity: 1 !important;
	transform: translateY(0) !important;
	pointer-events: auto;
}

.AgileList-Tiles .ImageBox:hover { 
	background-color: rgba(225,225,225,0.6); 
}

.AgileList-Tiles-4 .Item .ImageBox.placeholder-image:hover,
.AgileList-Tiles .Item .ImageBox.placeholder-image:hover {
	background-color: #b0b0b0 !important;
}

.AgileList-Tiles .Item .ButtonBar { 
	float: right;
	margin-left: auto;
	align-self: center;
}

.AgileList-Tiles .Item .ButtonBar a { 
	background-color: rgb(162, 173, 0);
}

.AgileList-Tiles .Item .ItemInfo, 
.AgileList-Tiles .Item .ItemInfo.ItemInfoFull {
	height: 50px;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	background: white !important;
	position: relative;
	z-index: 2;
	padding: 5px 10px;
	flex-shrink: 0;
	border-top: 1px solid #f0f0f0;
}

.AgileList-Tiles .Item .ItemInfo .Name {
	flex: 1;
	margin-right: 10px;
}

.FilterList {
	display: block !important;
}
.FilterList .AlphaFilter {
	display: none;
}
.FilterList .SearchBox {
	float: right;
}
.ViewBox button {
	display: none;
}
.ViewBox:has(#viewBtns) {
	justify-content: space-between; 
}
#viewBtns {
	display: flex;
}
#AtoZView {
	margin-left: 20px;
}
#dateView, #AtoZView {
	font-size: 1rem;
	font-weight: 900;
}
#dateView a i, #AtoZView a i {
	font-size: 130%;
}
.agl-epgbutton {
	background-color: rgb(162, 173, 0);
}
.swiper-slide img {
	object-fit: cover;
	object-position: center;
	font-family: "object-fit: cover; object-position: center;";
	width: 100%;
	height: 100%;
	max-height: unset;
	max-width: unset;
}
.swiper-wrapper {
	filter: brightness(0.6);
}
.agl-media-swiper .swiper-aglmedia .swiper-wrapper .swiper-slide .swiper-title { 
	display: none; 
}
.swiper-trailers { 
	bottom: 50% !important; 
}
.swiper-trailers .agl-epgbutton { 
	background-color: transparent; 
	flex-direction: column; 
	text-transform: uppercase; 
	border: 2px solid rgba(245,245,245,.4); 
	padding 17px 13px; 
	border-radius: 40px !important; 
	font-size: 10px; 
}
.swiper-button-next, .swiper-button-prev {
	color: white !important;
}
.agl-basketclock {
	top: 125px;
}
.agl-info .Name {
	font-size: 3.125rem;
	color: white;
	margin-bottom: 12px;
	text-align: left;
}
.agl-info .NameSecondary {
	font-size: 1.1875rem;
	color: white;
	text-align: left;
}
#infoDetails {
	max-width: 1440px;
	width: 100%;
	margin: auto;
	height: 70%;
}
#evtDetails {
	width: 100%;
	margin: auto;
	height: 30%;
	background-color: rgba( 0, 0, 0, 0.3);
}
#evtPropLinks {
	max-width: 1440px;
	margin: auto;
}
#eventBar {
	position: absolute;
	z-index: 99999;
	bottom: 0;
	width: 100%;
	height: 25%;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
}
.InfoContainer .Description, .InfoContainer .ExtraHTML, .InfoContainer .RelatedEventBlock, .InfoContainer .Comments, .InfoContainer .BackToListLink, .InfoContainer .AdditionalInformation {
	width: 100%;
}
.incAft::after { 
	content:'';
	background: transparent url(https://hotdocs.ca/Hotdocs/media/images/icons/arrow_nav_down-1.svg) bottom no-repeat;
} 


/* Custom Prop on Evt Pages*/
#evtPropLinks {
    padding: 12px 0;
    backdrop-filter: blur(5px);
}

.evt-props-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    color: white;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.5px;
    line-height: 1.6;
}

.evt-prop-label {
    color: white;
    font-weight: 600;
    white-space: nowrap;
}

.evt-prop-separator {
    color: white;
    font-weight: 300;
}

.evt-prop-value-separator {
    color: white;
}

.evt-prop-link, .evt-prop-text {
    color: white !important;
    text-decoration: none;
    display: inline;
    font-weight: 400;
    transition: opacity 0.2s ease;
    white-space: nowrap;
}

.evt-prop-link {
    cursor: pointer;
}

.evt-prop-link:hover {
    opacity: 0.7;
    text-decoration: underline;
}

.evt-prop-link:focus {
    outline: 2px solid white;
    outline-offset: 2px;
    border-radius: 2px;
}

.evt-prop-link:active {
    opacity: 0.5;
}

@media (max-width: 768px) {
    #evtPropLinks {
        padding: 10px 15px;
    }
    
    .evt-props-container {
        font-size: 12px;
    }
}

@media (max-width: 480px) {
    .evt-props-container {
        font-size: 11px;
    }
}

/*Media Breaks*/
@media (max-width: 1475px) {
	#infoDetails, #evtPropLinks {
		padding-left: 10px;
	}
	.EpgHeaderLogo {
		margin-left: 12px;
	}
}

@media (max-width: 1200px) {
	.AgileList-Tiles .Item .ItemInfo, 
	.AgileList-Tiles .Item .ItemInfo.ItemInfoFull {
    		height: 65px;
	}
}

@media (max-width: 900px) {
	#secondaryMenu {
		display: none;
	}
	.agl-basketclock {
		top: 75px !important;
	}
	.EpgHeaderLogo {
		margin-top: 5px !important;
		width: 93%;
	}
	.AgileList-Tiles-4 {
		grid-template-columns: repeat(3, 1fr) !important;
	}
	
	.AgileList-Tiles-4 .Item {
		width: auto !important;
		float: none !important;
	}
	
	.AgileList-Tiles .Item .ItemInfo, 
	.AgileList-Tiles .Item .ItemInfo.ItemInfoFull {
		height: 70px;
	}
}

@media (max-width: 768px) {
	.agl-header {
    		max-width: 100vw;
	}
	.agl-intro:has(.agl-navigation-mobile) {
		background-color: black !important;
		margin-top: 0;
	}
	.agl-info .swiper, .agl-ticketsearchcriteria .swiper, .agl-welcomepage .swiper {
		height: 300px;
	}
	.EpgHeaderLogo {
		width: fit-content;
		width: -moz-fit-content;
	}
	.agl-info .agl-container, .agl-info .agl-container:has(.agl-basketclock > div) { 
		padding-top: 0px !important; 
	}
	.agl-container, .agl-container:has(.agl-basketclock > div) { 
		padding-top: 75px !important; 
	}
	:not(.agl-info) .agl-basketclock {
		top: 44px !important;
	}
	.AgileList-Tiles-2, .AgileList-Tiles-3, .AgileList-Tiles-4,
	[class*="AgileList-Tiles-"]:not(.AgileList-Tiles-2, .AgileList-Tiles-3, .AgileList-Tiles-4) {
		grid-template-columns: 1fr !important;
	}
	
	.AgileList-Tiles-2 .Item, .AgileList-Tiles-3 .Item, .AgileList-Tiles-4 .Item, 
	[class*="AgileList-Tiles-"]:not(.AgileList-Tiles-2, .AgileList-Tiles-3, .AgileList-Tiles-4) .Item {
		float: none !important;
		width: auto !important;
		margin: 0 !important;
	}
	.AgileList-Tiles-4 {
		grid-auto-rows: unset;
	}
	.AgileList-Tiles .ImageBox {
		min-height: 200px;
		max-height: 200px;
	}
	.swiper-trailers:not(.swiper-trailerlist) {
		left: 40%;
	}
	#eventBar {
		height: 35%;
	}
	#infoDetails {
		height: 50%;
	}
	.agl-info .Name {
    		font-size: 1.85rem;
		margin-bottom: 0;
	}
	.agl-info .NameSecondary {
    		font-size: .8rem;
	}
	#evtDetails {
		height: 50%;
	}
	.AgileList-Tiles .ImageBox.placeholder-image {
		background-color: #cccccc !important;
		min-height: 300px;
	}
	
	.AgileList-Tiles .DescriptionContainer {
		font-size: 120%;
	}
}

#HotSellers { 
	clear: both; 
	background: grey; 
	padding: 15px 15px 10px 15px; 
}
#HotSellers .Header { 
	display: block; 
	font-size: 21pt; 
	padding: 20px 20px 20px 20px; 
	background-color: transparent !important; 
	color: white; 
	font-weight: normal; 
}
.HotEvent { 
	float: left; 
	cursor: pointer; 
	width: 29%; 
	margin: 0px 2%; 
	background-color: white; 
}
.HotEvent .Name { 
	display: block; 
	margin: 20px 20px 0; 
	text-transform: uppercase; 
	font-size: 1.2rem; 
	color: black; 
}
.HotEvent .HotDesc {  
	margin: 20px; 
	clear: both;  
}
.HotEvent .ItemInfo  { 
	height: 215px; 
	overflow: hidden;
	position: relative; 
}
.HotEvent .HotOpens {
	font-style: italic;
	margin: 0 8%;
} 
.HotEvent img { }
.HotEvent .BuyLink { 
	margin: 0px 0px 20px 20px; 
}
.HotEvent .FadeBottom  { 
	position: absolute; 
	bottom: 0px; 
	height: 50px; 
	background: transparent url(../fadebottom.png) repeat-x left top;  
	width: 100%; 
}
.HotDesc { 
	margin: 8px 0px; 
}

/***/
.site-header:not(:has(.agl-navigation-mobile)) {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10
}

.site-header ul,.site-header li {
    list-style-type: none;
    margin: 0;
    padding: 0
}

.site-header a {
    text-decoration: none
}

.site-header__container {
    position: relative;
    background: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: .3s;
    transition: .3s
}

.site-header__container::before,.site-header__container::after {
    display: table;
    content: ' ';
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.site-header__container::after {
    clear: both
}

.is-stuck .site-header__container {
    background: #040707;
    -webkit-box-shadow: 0 5px 9px 0 rgba(255,255,255,.06);
    box-shadow: 0 5px 9px 0 rgba(255,255,255,.06)
}

.is-fully-stuck .site-header__container {
    border-bottom: 2px solid #040707;
    margin-top: -60px
}

@media print,screen and (max-width: 74.99875em) {
    .is-fully-stuck .site-header__container {
        margin-top:-55px
    }
}

.is-fully-stuck.scrolled-up .site-header__container {
    border-bottom-width: 0;
    margin-top: 0
}

main,picture {
    display: block
}

.banner {
    height: 336px;
    position: relative;
    background: #1d2635;
    z-index: 0
}

@media print,screen and (max-width: 74.99875em) {
    .banner {
        height:204px
    }
}

@media print,screen and (max-width: 47.99875em) {
    .banner {
        height:177px
    }
}

.banner .grid-container {
    position: relative
}

.banner .grid-x {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.banner picture {
    position: relative;
    z-index: 1
}

.banner__content {
    position: absolute;
    bottom: 60px;
    left: 0;
    width: 100%;
    color: #fff;
    z-index: 2
}

@media print,screen and (max-width: 74.99875em) {
    .banner__content {
        bottom:30px
    }
}

@media print,screen and (max-width: 47.99875em) {
    .banner__content {
        bottom:20px
    }
}

.banner__content h1 {
    margin: 0;
    float: left
}

@media print,screen and (max-width: 47.99875em) {
    .banner__content h1 {
        position:relative;
        float: none;
        padding-right: 5px;
        padding-bottom: 10px;
        background-color: #1d2635;
        z-index: 1
    }
}

.banner--image picture:after {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: rgba(4,7,7,.4);
    background-image: linear-gradient(182.39deg,rgba(20,35,55,.71) 0%,transparent 50%,transparent 100%),linear-gradient(21.92deg,rgba(10,32,62,.53) 0%,transparent 50%,transparent 100%);
    z-index: 1;
}


.banner-gallery {
    position: relative;
    background-color: #1d2635
}

@media print,screen and (max-width: 74.99875em) {
    .banner-gallery {
        background-color: transparent
    }
}

.banner-gallery__slider {
    position: relative
}

@media print,screen and (min-width: 75em) {
    .banner-gallery__content {
        position:absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        pointer-events: none
    }
}

@media print,screen and (max-width: 74.99875em) {
    .banner-gallery__content {
        margin-top:15px
    }
}

.banner-gallery__title {
    color: #fff;
    margin-bottom: 50px
}

@media print,screen and (max-width: 74.99875em) {
    .banner-gallery__title {
        color:#040707;
        margin-bottom: 15px
    }
}

.banner-gallery__title .cell {
    pointer-events: auto
}

.banner-gallery__title .tag {
    color: #fff
}

.banner-gallery__title h1 {
    margin-bottom: 12px
}

@media print,screen and (max-width: 74.99875em) {
    .banner-gallery__title h1 {
        margin-bottom:6px
    }
}

.banner-gallery__title .info {
    font-size: 1.1875rem;
    line-height: 1.15789;
    font-weight: 400;
    letter-spacing: .03158em
}

@media print,screen and (max-width: 74.99875em) {
    .banner-gallery__title .info {
        font-size:.9375rem;
        line-height: 1.13333;
        font-weight: 400;
        letter-spacing: .03333em
    }
}

@media print,screen and (min-width: 75em) {
    .banner-gallery__meta {
        background:-webkit-gradient(linear,left top,left bottom,from(rgba(18,21,35,.72)),to(rgba(10,32,62,0)));
        background: linear-gradient(180deg,rgba(18,21,35,.72) 0%,rgba(10,32,62,0) 100%)
    }
}

.banner-gallery__meta.empty {
    visibility: hidden;
    opacity: 1
}

@media print,screen and (max-width: 74.99875em) {
    .banner-gallery__meta.empty {
        display:none
    }
}

.banner-gallery__meta .cell {
    letter-spacing: 0;
    color: #fff;
    padding: 18px 40px 16px 0;
    margin-bottom: 0
}

@media print,screen and (max-width: 74.99875em) {
    .banner-gallery__meta .cell {
        background:rgba(226,226,226,.35);
        color: #040707;
        padding: 14px 12px 12px
    }
}

.banner-gallery__meta ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 0;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    pointer-events: auto
}

.banner-gallery__meta li {
    list-style-type: none
}

.banner-gallery__meta li:nth-last-of-type(n+2):after {
    content: '·';
    display: inline-block;
    margin: 0 5px
}

.banner-gallery__meta a {
    font-weight: 700;
    text-decoration: underline;
    color: #fff
}

@media print,screen and (max-width: 74.99875em) {
    .banner-gallery__meta a {
        color:#040707
    }
}

.banner-slide {
    position: relative
}

.banner-slide.slide-hidden {
    visibility: hidden
}

.banner-slide picture {
    height: 90vh;
    width: 100%;
    max-height: 686px;
    min-height: 600px;
    position: relative;
    z-index: 0
}

@media print,screen and (max-width: 74.99875em) {
    .banner-slide picture {
        height:356px;
        min-height: 0;
        max-height: none
    }
}

.banner-slide picture img {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    font-family: "object-fit: cover; object-position: center";
    display: block
}

.banner-slide picture:before {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    content: '';
    background-color: rgba(4,7,7,.4);
    background-image: linear-gradient(182.39deg,rgba(20,35,55,.71) 0%,transparent 50%,transparent 100%),linear-gradient(21.92deg,rgba(10,32,62,.53) 0%,transparent 50%,transparent 100%);
    z-index: 1
}

.banner-slide picture:after {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    content: '';
    background-image: linear-gradient(158.8deg,rgba(255,255,255,.4) 0%,rgba(187,187,187,.36) 17%,rgba(255,255,255,0) 35%,rgba(255,255,255,0) 100%);
    mix-blend-mode: normal;
    z-index: 1
}

.banner-slide .video-modal {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    height: auto;
    width: 87px;
    font-size: .6875rem;
    line-height: 1.27273;
    font-weight: 400;
    letter-spacing: .04545em;
    z-index: 1;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    color: #fff;
    opacity: .48;
    -webkit-transition: .3s;
    transition: .3s
}

@media print,screen and (max-width: 47.99875em) {
    .banner-slide .video-modal {
        width:70px
    }
}

.banner-slide .video-modal img {
    width: 100%
}

.banner-slide .video-modal div {
    margin-top: -10px
}

@media print,screen and (max-width: 47.99875em) {
    .banner-slide .video-modal div {
        display:none
    }
}
.banner-slide .video-modal:after {
    content: '';
    display: block;
    left: 0;
    right: 0;
    top: 100px;
    bottom: 0
}
.banner-slide .video-modal:hover {
    width: 95px;
    font-size: .8125rem
}
.AgileList-Tiles-4 > .Item > .ImageBox.placeholder-image,
.AgileList-Tiles > .Item > .ImageBox.placeholder-image,
div[class*="AgileList-Tiles"] > div.Item > div.ImageBox.placeholder-image {
	background: #cccccc !important;
	background-color: #cccccc !important;
	background-image: none !important;
}