/*
Events Category CSS
*/

/* General
========================= */
.events-category .site-inner { padding: 1em 2em; width: 100%; min-height: 800px; }

/* Events Category Hero
========================= */
.hero-container { display: flex; justify-content: center; width: 100%; padding: 1em 2em 0em; }
.hero { display: block;background-color: #fff; position: relative; width: 100%; height: 600px; max-height: 100%; overflow: hidden; z-index: 999; }
.hero-block { display: block; width: 100%; height: 0; }
.hero-block .hero-bg { background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; width: 100%; height: 100%; overflow: hidden; }

/* Events
========================= */
.events-listing-overview { display: flex; flex-direction: column; align-items: center; margin: 0; padding: 2em 0 1em; }
.events-listing-inner { display: flex; flex-direction: column; max-width: 1480px; width: 100%; }
.events-listing-title { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; margin: 0; padding: 0; }
.events-listing-title span { color: #1a1a1a; font-family: 'Roboto Slab', serif; font-size: 3.4rem; font-weight: 600; line-height: 1.2; letter-spacing: .08em; text-transform: uppercase; }
.events-listing-title a { border: 1px solid #1a1a1a; color: #1a1a1a; display: flex; align-items: center; font-family: 'Mulish', sans-serif; font-size: 1.3rem; font-weight: 800; height: 30px; line-height: 1.2; padding: 8px; text-transform: uppercase; }

.events-listing { display: grid; grid-template-columns: repeat(2,1fr); gap: 27px; padding: 1.5em 0 2em; }
.events-listing .column { display: grid; position: relative; }
.events-listing .column a { display: grid; }
.events-overlay { background: linear-gradient(to bottom, rgba(0, 0, 0, .1) 25%, rgba(0, 0, 0, .2) 50%, rgba(0, 0, 0, .3) 75%, rgba(0, 0, 0, .8) 100%); position: absolute; left: 0; right: 0; top: 0; bottom: 0; }
.events-details { display: flex; flex-direction: column; justify-content: flex-end; position: absolute; left: 0; top: 0; max-width: 475px; padding-left: calc(100vw * 0.02); padding-right: calc(100vw * 0.04); width: 100%; height: 100%; z-index: 99; }
.events-title { display: flex; flex-direction: column; justify-content: center; margin-bottom: 15px; }
.events-title span { color: #fff; font-family: 'Mulish', sans-serif; font-size: 2.4rem; font-weight: 600; line-height: 1.2; letter-spacing: .05em; text-transform: uppercase; }
.events-thumb { display: grid; grid-column: span 1; margin: 0; width: 100%; transition: none; }

/* Pagination
========================= */
.pagination { display: flex; justify-content: center; margin: 0; padding: 3em 0 2em; }
.pagination .nav-links .page-numbers { display: inline-block; background-color: #fff; border: 1px solid #e5e5e5; border-radius: 4px; color: #222; cursor: pointer; font-size: 1.6rem; font-weight: 600; margin-bottom: 4px; padding: 4px 12px; text-decoration: none; }
.pagination .nav-links .page-numbers:hover { color: #fec70f; border: 1px solid #fec70f; }
.pagination .nav-links .page-numbers.current { display: inline-block; background-color: #fff; border: 1px solid #000; border-radius: 4px; color: #222; cursor: pointer; font-size: 1.6rem; font-weight: 600; margin-bottom: 4px; padding: 4px 12px; text-decoration: none; }
.pagination .nav-links .prev { display: none; }
.pagination .nav-links .next { display: none; }

/* Responsive
--------------------------------------------- */
@media only screen and (min-width: 1980px) {
.hero { height: 700px; }
}

@media only screen and (min-width: 2500px) {
.hero { height: 750px; }
}

@media only screen and (max-width: 1480px) {
.hero { max-height: calc(100vw * 0.38852); }
.events-listing-overview { padding: 1.5em 0 1em; }
.events-listing-title span { font-size: 3.2rem; }
.pagination { padding: 3em 0 1.5em; }
}

@media only screen and (max-width: 1280px) {
.hero { max-height: calc(100vw * 0.39063); }
.events-listing-overview { padding: 1em 0; }
.events-listing-title span { font-size: 3rem; }
.events-listing { padding: 1em 0 1.5em; }
.events-title span { font-size: 2.2rem; }
.pagination { padding: 3em 0 1em; }
}

@media only screen and (max-width: 1140px) {
.events-listing-title span { font-size: 2.8rem; }
.events-listing { padding: 1em 0; }
.pagination { padding: 2.5em 0 .5em; }
}

@media only screen and (max-width: 1023px) {
.hero { max-height: calc(100vw * 0.39101); }
.events-listing-title span { font-size: 2.6rem; }
.events-listing-title a { font-size: 1.2rem; height: 25px; }
.events-listing { grid-template-columns: repeat(1,1fr); }
.events-listing .column { max-height: 400px; overflow: hidden; }
.events-title span { font-size: 2.1rem; }
.pagination { padding: 2em 0 .5em; }
}

@media only screen and (max-width: 880px) {
.hero { max-height: calc(100vw * 0.39773); }
.events-listing-overview { padding: 1em 0; }
}

@media only screen and (max-width: 768px) {
.hero-container { padding: 0.8em 1.5em 0em; }
.hero { max-height: calc(100vw * 0.39064); }
.events-category .site-inner { padding: 1em 1.5em 2em; }
.events-listing { padding: .8em 0; }
.events-listing-overview { padding: 0.5em 0; }
.events-listing-title span { font-size: 2.4rem; }
.events-title span { font-size: 2rem; }
.pagination { padding: 1.5em 0 .5em; }
}

@media only screen and (max-width: 640px) {
.hero { max-height: calc(100vw * 0.4297); }
.events-listing-title span { font-size: 2.2rem; }
.events-listing { gap: 22px; padding: .5em 0; }
.events-listing .column { max-height: 300px; }
.events-title span { font-size: 1.9rem; }
}

@media only screen and (max-width: 480px) {
.hero { max-height: calc(100vw * 0.46874999); }
.events-category .site-inner { padding: 1em 1.5em 1.5em; }
.events-listing-overview { padding: 0.5em 0 0; }
.events-listing-title span { font-size: 2rem; }
.events-title span { font-size: 1.8rem; }
}

@media only screen and (max-width: 420px) {
.hero { max-height: calc(100vw * 0.4762); }
}