/* Make sure the Hubb icons are loaded*/
@font-face {
  font-family: 'HubbIcons';
  src:  url('/Images/Content/2414/Templates/56328/fonts/HubbIcons.ttf') format('truetype');
}

/* UML_EL_1: Universal Mini-Layout Event-List 1 */
section.EventsCardsFour {
  	padding:50px 10px;
	background-color:white;
  	text-align:center;
}
section.EventsCardsFour h1 {line-height:1; margin-bottom:20px;}
section.EventsCardsFour a.ArrowToRight {
  display:inline-block; font-size:20px; line-height:1; margin-top:20px;
}
section.EventsCardsFour div.UML_EL_1 {
	display: flex; flex-flow: row wrap; justify-content: center; align-items:stretch;
}
section.EventsCardsFour div.UML_EL_1 > div { 
  background-color: var(--FeedCardLightGrey); width: 100%; margin:15px 0;
} /* 1 column */
@media (min-width: 467px) { /* 2 columns */
	section.EventsCardsFour div.UML_EL_1 > div { width: 49%; margin:15px 0; }
	section.EventsCardsFour div.UML_EL_1 > div:nth-child(2n+1) {margin-right:1%;} /* Extra 1% on each */
	section.EventsCardsFour div.UML_EL_1 > div:nth-child(2n) {margin-left:1%;}
}
@media (min-width: 992px) { /* 4 columns */
	section.EventsCardsFour div.UML_EL_1 > div { width:24.25%; margin:15px 0;}
	section.EventsCardsFour div.UML_EL_1 > div:nth-child(4n+1) {margin-left:0;margin-right:0;}
	section.EventsCardsFour div.UML_EL_1 > div:nth-child(4n+2) {margin-left:1%;margin-right:1%;} 
	section.EventsCardsFour div.UML_EL_1 > div:nth-child(4n+3) {margin-left:0;margin-right:1%;} 
	section.EventsCardsFour div.UML_EL_1 > div:nth-child(4n) {margin-left:0;margin-right:0;}
}
section.EventsCardsFour div.UML_EL_1 div.eventListImage img { display: block; width: 100%;  margin:0;}
section.EventsCardsFour div.UML_EL_1 div.eventListImage a { display: block; margin: 0; }
section.EventsCardsFour div.UML_EL_1 div.eventListImage a:hover,
section.EventsCardsFour div.UML_EL_1 div.eventListTitle a:hover { opacity: 0.6;text-decoration:none; }
section.EventsCardsFour div.UML_EL_1 div.eventListTitle {  padding: 5px 20px 5px;}
section.EventsCardsFour div.UML_EL_1 div.eventListTitle a { 
  font-weight: 700; font-size:22px;text-align:left;line-height: 1.4; 
  display:block; color:var(--FeedTextColour);
}
section.EventsCardsFour div.UML_EL_1 div.eventListSummary { 
  padding: 0 10px 10px;  font-weight: 400; text-align: center;line-height: 1.3;
}

section.EventsCardsFour div.UML_EL_1 div.eventListLocation {
  flex:1 1 auto;font-size:0;line-height:1;color:transparent;text-align:left;
} /* takes up the height slack */
section.EventsCardsFour div.UML_EL_1 div.eventListLocation a {
  display:block; font-size:16px; line-height:1.2; padding:0 20px 30px 25px; 
  color:var(--FeedTextColour);
  font-weight:400;
}
section.EventsCardsFour div.UML_EL_1 div.eventListLocation a::before {
	content:'\e92c';
  	display:inline-block; font-size:22px; line-height:22px;
  	font-family:HubbIcons;
  	color:var(--FeedMainSiteColour);
    position:relative; top:4px; left:-6px;
}
section.EventsCardsFour div.UML_EL_1 div.eventListDate {
	font-weight:400; font-size:18px;text-align:left;padding: 20px 20px 0;
  	position:relative;
}
section.EventsCardsFour div.UML_EL_1 div.eventListDate div.BoxDate {
	position:absolute;
  	bottom:100%; left:15px;
  	background-color:var(--FeedCardLightGrey);
  	text-align:center;padding:5px 15px;
}
section.EventsCardsFour div.UML_EL_1 div.eventListDate div.BoxDate div:first-child {
	font-size:28px; color:var(--FeedMainSiteColour); font-weight:700; line-height:1; padding:0 0 2px;
}
section.EventsCardsFour div.UML_EL_1 div.eventListDate div.BoxDate div:last-child {
	font-size:18px; color:var(--FeedTextColour); line-height:1;
}


/* ################### */
/* UML_ML_1: Universal Mini-Layout Media-List 1 */

section.SermonCardsFour {
  	padding:50px 10px;
	background-color:var(--FeedCardLightGrey);
  	text-align:center;
}
section.SermonCardsFour h1 {line-height:1; margin-bottom:20px;}
section.SermonCardsFour a.ArrowToRight {display:inline-block; font-size:20px; line-height:1; margin-top:20px;}
section.SermonCardsFour div.UML_ML_1 span.MediaList {
	display: flex; flex-flow: row wrap; justify-content: center; align-items:stretch;
}
section.SermonCardsFour div.UML_ML_1 > span.MediaList > div { 
  background-color:white; width: 100%; margin:15px 0;
} /* 1 column */
@media (min-width: 467px) { /* 2 columns */
	section.SermonCardsFour div.UML_ML_1 > span.MediaList > div { width: 49%; margin:15px 0; }
	section.SermonCardsFour div.UML_ML_1 > span.MediaList > div:nth-child(2n+1) {margin-right:1%;} /* Extra 1% on each */
	section.SermonCardsFour div.UML_ML_1 > span.MediaList > div:nth-child(2n) {margin-left:1%;}
}
@media (min-width: 992px) { /* 4 columns */
	section.SermonCardsFour div.UML_ML_1 > span.MediaList > div { width:24.25%; margin:15px 0;}
	section.SermonCardsFour div.UML_ML_1 > span.MediaList > div:nth-child(4n+1) {margin-left:0;margin-right:0;}
	section.SermonCardsFour div.UML_ML_1 > span.MediaList > div:nth-child(4n+2) {margin-left:1%;margin-right:1%;} 
	section.SermonCardsFour div.UML_ML_1 > span.MediaList > div:nth-child(4n+3) {margin-left:0;margin-right:1%;} 
	section.SermonCardsFour div.UML_ML_1 > span.MediaList > div:nth-child(4n) {margin-left:0;margin-right:0;}
}
section.SermonCardsFour div.UML_ML_1 div.mediaListImage img { display: block; width: 100%;  margin:0;}
section.SermonCardsFour div.UML_ML_1 div.mediaListImage a { display: block; margin: 0; }
section.SermonCardsFour div.UML_ML_1 div.mediaListImage a:hover { opacity: 0.6; }
section.SermonCardsFour div.UML_ML_1 div.mediaListTitle {  padding: 10px 20px 5px;}
section.SermonCardsFour div.UML_ML_1 div.mediaListTitle a { 
  font-weight: 700; font-size:23px;text-align:left;line-height: 1.4; display:block; color:var(--FeedTextColour);
}
section.SermonCardsFour div.UML_ML_1 div.mediaListTitle a:hover {
  text-decoration:none; color:var(--FeedMainSiteColour);
}
section.SermonCardsFour div.UML_ML_1 div.mediaListSummary { 
  padding: 0 10px 10px;  font-weight: 400; text-align: center;line-height: 1.3;
}

section.SermonCardsFour div.UML_ML_1 div.mediaListSpeaker {
  flex:1 1 auto;text-align:left;
  font-size:16px; line-height:1.2; padding:5px 20px 30px; color:var(--FeedTextColour);
  font-weight:400;
} /* takes up the height slack */
section.SermonCardsFour div.UML_ML_1 div.mediaListDate {
	font-weight:400; font-size:15px;text-align:left;padding: 20px 20px 0;
  position:relative;
}
section.SermonCardsFour div.UML_ML_1 div.mediaListImage a {position:relative;}
section.SermonCardsFour div.UML_ML_1 div.mediaListImage a div.BoxDate {
	position:absolute;
  	bottom:0; left:15px;
  	background-color:white;
  	padding:10px;
}
section.SermonCardsFour div.UML_ML_1 div.mediaListImage a div.BoxDate span::after {
	content:'\e94d';
  	font-family:HubbIcons;
  	color:var(--FeedMainSiteColour);
  	display:block; font-size:24px; line-height:1;
}



section.EventsCardsFour a.ArrowToRight,
section.SermonCardsFour a.ArrowToRight {
  padding:10px 50px 11px 30px;
  color:var(--FeedButtonColour);
  background-color:var(--FeedButtonBackgroundColour);
  border:var(--FeedButtonBorderThickness,1px) solid var(--FeedButtonBorderColour);
  border-radius:var(--FeedButtonBorderRadius,0);
  opacity:1;
}
section.EventsCardsFour a.ArrowToRight:hover,
section.SermonCardsFour a.ArrowToRight:hover {
  color:var(--FeedButtonColourHover);
  background-color:var(--FeedButtonBackgroundColourHover);
  border-color:var(--FeedButtonBorderColourHover);
  opacity:1;
}
section.EventsCardsFour a.ArrowToRight::after,
section.SermonCardsFour a.ArrowToRight::after {
	content:'\e903';
  	font-family:HubbIcons;
  	color:var(--FeedButtonColour);
  	display:inline-block; line-height:1;
  	position:relative; top:2px; left:12px;
  	transition:left 300ms linear,color 300ms linear;
}
section.EventsCardsFour a.ArrowToRight:hover::after,
section.SermonCardsFour a.ArrowToRight:hover::after {
  color:var(--FeedButtonColourHover);
  left:18px;
}