/* Sermon Series template CSS code. */

/* Banner Image code ### May not need this ### */
section.slice_BannerImage {
  position:relative;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	padding: 200px 10px;
}
@media(max-width:992px){
	section.slice_BannerImage {padding:100px 10px;}
}
section.slice_BannerImage h1 {
  position:relative; z-index:0;
	line-height:1.2; 
	margin:0; 
	text-align:center;
	color: white;
	font-size: 60px;
	text-transform:uppercase;
}
@media(max-width:992px){
	section.slice_BannerImage h1 {font-size: 40px;}
}
@media(max-width:467px){
	section.slice_BannerImage h1 {font-size: 30px;}
}
section.slice_BannerImage div.BannerImgCustomFields {display:none;}
section.slice_BannerImage div.container {text-align:center;}
section.slice_BannerImage div.OverlayTint { 
  position:absolute;top:0;bottom:0;left:0;right:0;width:100%;height:100%;
  background-color:rgba(0,0,0,0.4);
}
section.slice_content_page.AddTopBorder {border-top:1px solid #d7d7d7;}

/* Media Landing page search box */
section.slice_MediaSearch div.search-overlay {padding:25px 10px 25px 0; background-color: #f1f1f1; }
section.slice_MediaSearch div.search-overlay input.button, section.slice_MediaSearch div.search-overlay label { display: none; }
section.slice_MediaSearch div.search-overlay div.search-form { position: relative; max-width:600px;}
section.slice_MediaSearch div.search-overlay div.search-form span.top-link { 
  position: absolute; top: 0; right:0 ; background-color: #3D8CC4; color:white; 
  display: inline-block; 
  line-height: 1; padding: 13px;  font-size: 16px; 
  transition: color 500ms linear, background-color 500ms linear; cursor:pointer;
	height:47px;
}
section.slice_MediaSearch div.search-overlay div.search-form span.top-link:hover { background-color: #1E679D; }
section.slice_MediaSearch div.search-overlay div.search-form span.top-link img { display: inline-block; padding: 3px 3px 0; }
section.slice_MediaSearch div.search-overlay .search_div { margin: 0 50px 0 0; }
section.slice_MediaSearch div.search-overlay .search_div input.text { height: 47px; margin-bottom: 0px; border: none; background-color: white;  font-size: 15px; line-height: 1;  width: 100%; color: #444444; outline: none; margin-left: 10px; padding-left: 20px; padding-right: 5px; }
@media (max-width: 400px) { section.slice_MediaSearch div.search-overlay div.search-form div.search_div input.text { font-size: 16px; letter-spacing: -0.5px; } }

/*
################## 
# Start of Slice #
################## 
*/
.SermonsAndPDFs { background-color: white; color: #444444; text-align: left;  }
.SermonsAndPDFs .article_cards > span > div { width: 100%; margin-left: 0; margin-right: 0; }
.SermonsAndPDFs .article_cards > span { text-align: left; }
.SermonsAndPDFs .article_cards > span > div { background-color: white; padding:15px; border-top:1px solid #d7d7d7; }
.SermonsAndPDFs .article_cards > span > div:last-child {border-bottom:1px solid #d7d7d7;}
.SermonsAndPDFs .article_cards > span > div:hover {background-color: #f1f1f1;}
.SermonsAndPDFs .article_cards > span > div .articleListTitle a { 
  color: #1E679C; font-size: 25px; line-height: 1.2; font-weight:400;
}
.SermonsAndPDFs .article_cards > span > div .articleListAuthor,
.SermonsAndPDFs .article_cards > span > div .articleListDate,
.SermonsAndPDFs .article_cards > span > div .articleListBibleRef {display:inline; font-size: 16px; line-height: 1.2; color: #444444;}
.SermonsAndPDFs .article_cards > span > div .articleListAuthor.BarOnEnd::after,
.SermonsAndPDFs .article_cards > span > div .articleListDate::after {content:'\00A0\00A0\00A0|\00A0\00A0\00A0';}
.SermonsAndPDFs .article_cards > span > div .articleListSummary {display:none;}
@media (max-width: 767px) { 
	.SermonsAndPDFs .article_cards > span > div { padding:10px 5px; }
  .SermonsAndPDFs .article_cards > span > div .articleListTitle a {font-size:20px;}
}
@media (max-width: 467px) { 
  .SermonsAndPDFs .article_cards > span > div .articleListTitle a {font-size:18px;}
  .SermonsAndPDFs .article_cards > span > div { padding:5px 5px; }
  .SermonsAndPDFs .article_cards > span > div .articleListBibleRef {display:block;}
  .SermonsAndPDFs .article_cards > span > div .articleListAuthor.BarOnEnd::after {content:'';}
}

  section .SermonsAndPDFs div.article_cards div.TextItems {float:left;clear:both;}
  section .SermonsAndPDFs div.article_cards div.articleListTitle a {text-decoration:none;}

  section .SermonsAndPDFs div.article_cards div.MediaLinks {background-color:transparent; float:right; display:flex; flex-flow:row nowrap;}
  section .SermonsAndPDFs div.article_cards div.MediaLinks a {display:block; font-size:16px; font-weight:700; color:#444444; text-decoration:none; padding:15px;}
  section .SermonsAndPDFs div.article_cards div.MediaLinks img {position:relative; top:3px;}
  section .SermonsAndPDFs div.article_cards div.MediaLinks span {padding-right:10px;}
  section .SermonsAndPDFs div.article_cards div.MediaLinks div:nth-child(2) img {margin-top:1px;}
  
  section .SermonsAndPDFs div.article_cards img.IconHover,
  section .SermonsAndPDFs div.article_cards div.SermonLink:hover img.IconNormal,
  section .SermonsAndPDFs div.article_cards div.NotesLink:hover img.IconNormal {display:none;}
  section .SermonsAndPDFs div.article_cards div.SermonLink:hover img.IconHover,
  section .SermonsAndPDFs div.article_cards div.NotesLink:hover img.IconHover {display:inline;}
  
  section .SermonsAndPDFs div.article_cards div.SermonLink:hover,
  section .SermonsAndPDFs div.article_cards div.NotesLink:hover {background-color:#3D8CC4;}
  section .SermonsAndPDFs div.article_cards div.SermonLink:hover a,
  section .SermonsAndPDFs div.article_cards div.NotesLink:hover a {color:white;}
	@media (max-width: 768px) { 
		section .XSermonsAndPDFs div.article_cards div.MediaLinks {margin-top:10px;}
		section .SermonsAndPDFs div.article_cards div.MediaLinks a { padding:5px 10px;}
	}

section .SermonsAndPDFs div.article_cards div.SermonLink:nth-child(2),
section .SermonsAndPDFs div.article_cards div.NotesLink {display:none;}

section.slice_content_page.WideContent div.main-content {width:100%;margin-left:0;margin-right:0;float:none;}

/*
################## 
# Start of Slice #
################## 
*/
section.SermonsGroupNav { background-color: white; text-align: left; padding: 30px 0; }
@media (min-width: 768px) { section.SermonsGroupNav { padding: 40px 0; } }
@media (min-width: 992px) { section.SermonsGroupNav { padding: 60px 0; } }

section.SermonsGroupNav div.GroupNavCards {display: flex; flex-flow: row wrap; justify-content: center; align-items:stretch;}
section.SermonsGroupNav div.GroupNavCards > div { background-color: #f1f1f1; width: 96%; margin:0 2% 20px;}
@media (min-width: 467px) { section.SermonsGroupNav div.GroupNavCards > div { width: 48%; margin:0 1% 25px; } }
@media (min-width: 768px) { section.SermonsGroupNav div.GroupNavCards > div { width: 31.33333%; margin:0 1% 30px;} }

section.SermonsGroupNav div.GroupNavImage a { display: block; margin: 0; }
section.SermonsGroupNav div.GroupNavImage a:hover { opacity: 0.6; }
section.SermonsGroupNav div.GroupNavImage img { display: block; width: 100%; }
section.SermonsGroupNav div.GroupNavTitle {  background-color: #f1f1f1; padding: 10px 20px; }
section.SermonsGroupNav div.GroupNavTitle a { color: #444444; font-weight: 400; font-size: 24px; line-height: 1.3; text-transform: capitalize;}
section.SermonsGroupNav div.GroupNavTitle a:hover { color: #3D8CC4; }
section.SermonsGroupNav div.BottomButtons {text-align:center;}
section.SermonsGroupNav a.button { display:inline-block;margin:0; }

section.SermonsGroupNav h2,
section.slice_content_page.WideContent h2 {margin:30px 0 20px;text-align:center;}
section.SermonsGroupNav h2:first-child,
section.slice_content_page.WideContent h2 {margin-top:0;}
section.SermonsGroupNav div.main-content {margin:0 10px;}

section.slice_content_page.WideContent div.SermonsAndPDFs {margin:0;}
section.slice_content_page.WideContent div.SermonsAndPDFs div.SeriesSummary {margin-bottom:20px;}

/* Fix iPad/iPhone problems by not having elements change display on hover or click */
body.OnSmallAppleDevice div.SermonsAndPDFs div.SermonLink a img.IconHover 
{display:none !important;}
body.OnSmallAppleDevice div.SermonsAndPDFs div.SermonLink a img.IconNormal 
{display:inline-block !important;}