/* Base styles for event microsites (normally in main.css) */
.block-list-events.p7-block {padding:50px 0;}
@media (max-width:768px) {
	.block-list-events.p7-block {padding:30px 0;}
}

.block-list-events .inner {max-width:1090px; margin:0 auto;}
@media (max-width:1120px) {
	.block-list-events .inner {padding:0 20px;}
}

/* Background colors */
.block-list-events.bg-white {background:#fff;}
.block-list-events.bg-light-gray {background:var(--color-light-gray);}
.block-list-events.bg-dark-gray {background:var(--color-dark-gray);}
.block-list-events.bg-blue {background:var(--color-text-blue, var(--color-blue));}
.block-list-events.bg-red {background:var(--color-red);}

/* Text color adjustments for dark backgrounds (via p7-white-text class) */
.block-list-events.p7-white-text .events .intro h2,
.block-list-events.p7-white-text .events .intro .description p {
	color: #fff;
}

/* Override events-main.css global img rule */
.block-list-events img {
	width: auto;
	height: auto;
}

/* Block-specific styles */
.block-list-events {}

.block-list-events .events {display:flex; flex-wrap:wrap; margin:-15px;}

.block-list-events .events > div {flex:0 0 calc(50% - 30px); margin:15px;}

.block-list-events .events .intro h2 {font-size:40px; font-weight:800; color:var(--color-blue); text-transform:uppercase; margin-bottom:10px;}
.block-list-events .events .intro .description p {font-size:14px; font-weight:500; line-height:1.7em; color:var(--color-blue);}

.block-list-events .events .event {display:flex; border:1px solid var(--color-blue);}

.block-list-events .events .event .left-side {flex:0 0 40%; background:var(--color-blue); padding:15px; color:#fff; display:flex; flex-direction:column;}
.block-list-events .events .event .left-side .date {font-size:18px; font-weight:800; color:#89B1E2; text-transform:uppercase; margin-bottom:10px;}
.block-list-events .events .event .left-side .organizer {font-size:12px; font-weight:800; text-transform:uppercase; margin-bottom:10px;}
.block-list-events .events .event .left-side .location {font-size:12px; font-weight:600; line-height:1.5em; margin-bottom:30px;}
.block-list-events .events .event .left-side .add-to-calendar {margin-top:auto;}
.block-list-events .events .event .left-side .add-to-calendar .button {display:flex; align-items:center; text-decoration:none;}
.block-list-events .events .event .left-side .add-to-calendar .button img {margin-right:5px;}
.block-list-events .events .event .left-side .add-to-calendar .button span {display:inline-block; font-size:7px; text-transform:uppercase;}

.block-list-events .events .event .right-side {flex:0 0 60%; padding:15px; background:#fff; color:var(--color-dark-gray); display:flex; flex-direction:column;}
.block-list-events .events .event .right-side .title {font-size:16px; font-weight:800; color:var(--color-red); text-transform:uppercase; margin-bottom:10px;}
.block-list-events .events .event .right-side .description {margin-bottom:10px;}
.block-list-events .events .event .right-side .description p {font-size:12px; font-weight:500; color:var(--color-blue); line-height:1.5em; margin-bottom:1.5em;}
.block-list-events .events .event .right-side .buttons {margin-top:auto;}
.block-list-events .events .event .right-side .buttons a {display:flex; align-items:center; text-decoration:none;}
.block-list-events .events .event .right-side .buttons a img {margin-right:5px;}
.block-list-events .events .event .right-side .buttons a span {display:inline-block; font-size:7px; text-transform:uppercase; color:var(--color-blue);}

.block-list-events .events .event.event-webinar .left-side .location {margin-bottom:15px;}
.block-list-events .events .event.event-webinar .left-side .webinar-btn {
	display:block; margin-left:-15px; margin-bottom:10px; padding:10px 25px; 
	background:var(--color-red); color:#fff; text-transform:uppercase; text-decoration:none;
}
.block-list-events .events .event.event-webinar .right-side .webinar-buttons {margin-top:auto;}
.block-list-events .events .event.event-webinar .right-side .webinar-buttons a {
	font-size:9px; font-weight:500; display:inline-block; padding:5px 30px; background:var(--color-blue); color:#fff;
	text-decoration:none; text-transform:uppercase;
}

@media (max-width:700px) {
	.block-list-events .events {display:block;}
	.block-list-events .events .event {display:block;}
}