<!--FAL-->
<!doctype html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0"/>
<link href='https://fonts.googleapis.com/css?family=Kalam|Yatra+One' rel='stylesheet' type='text/css' />
<style type="text/css">
body {
background: url(/_layout/images/bkg/fall/fall4.jpg) no-repeat center fixed;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
}
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
.LeftImage{visibility: hidden;}
.HDR {font-size:18px; padding:1em 1em 0 1em; text-align:center;}
.REF {font-size:12px; padding:0 2em 0 0; text-align:right;}
.SHC {font-size:14px; padding:0 1em; text-align:right;}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
.LeftImage{visibility: visible;}
.HDR {font-size:20px; padding:1em 1em 0 1em; text-align:center;}
.REF {font-size:14px; padding:0 2em 0 0; text-align:right;}
.SHC {font-size:18px; padding:0 1em; text-align:right;}
}
/* Medium to large devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 770px) {
.LeftImage{visibility: visible;}
.HDR {font-size:24px; padding:.5em 1em 0 1em; text-align:center;}
.REF {font-size:16px; padding:0 2em 0 0; text-align:right;}
.SHC {font-size:18px; padding:0 1em; text-align:right;}
}
</style>
</head>
<body class="NavigationPage">
<div style="position:fixed; width:100%; z-index:98; overflow:hidden; border:none;">
<div class="HDR" align="center" style="font-family:'Yatra One', cursive; color:#cccccc; text-shadow: 1px 1px #3B0B0B;">
Nothing will separate us from the love of Christ. If God is calling you to full time service in the church do not be afraid. The Lord is with you. </div>
<div class="REF" align="right" style="font-family:'Yatra One', cursive; color:#cccccc; text-shadow: 1px 1px #dddddd;">
Romans 8:35-39 </div>
</div>
<div style=" position:absolute; bottom:0; width:100%; z-index:99; overflow:hidden; border:none;">
<div class="SHC" align="right" style="font-family:'Kalam', cursive; color:#999999; text-shadow: 1px 1px #000000;">
Sacred Heart Catholic Church ~ Heron Lake, MN</div>
</div>
<!--SCRIPT FOR REMOVING AFTER DATE-->
<script>
// i.e. "20-02-16" from "2016-02-16T......" var md = (new Date()).toISOString().substring(2, 10); [].slice.call(document.querySelectorAll("[data-visible-from],[data-visible-to]")).forEach(function(el) { // Nab the visible-from date, or if it's not available, then the smallest // possible date per year (1 Jan) var from = el.dataset.visibleFrom || "20-01-01"; var to = el.dataset.visibleTo || "50-12-31"; // Then simply set the element's `display` to none if today's not the day. el.style.display = (from <= md && md <= to ? "" : "none"); }); </script>
</body>