/*
Theme Name: ECOG Pickering
Theme URI: https://sanetto.com
Author: Sanetto
Author URI: https://sanetto.com
Description: Custom ECOG Pickering Website Template
Version: 2024

ECOG Pickering WordPress Theme © 2024 Sanetto
*/

@charset "utf-8";

/* Reset Styles **********************************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, location, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer.site, header.site, hgroup, menu, nav, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer.site, header.site, hgroup, menu, nav, section {display: block;}

* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} 

:focus {
  outline: none;
  /*box-shadow: 0 0 0 3px hsla(220, 100%, 50%, 80%);*/
}


/* Color Styles *****************************************/
.blue{color: #0070af;}
.dk_blue{color: #003f63;}
.dk_grey{color: #303030;}
.lt_grey{color: #FAFAFA;}
.black{color: #000;}
.white{color: #fff;}

.blue_bkg{background-color: #0070af;}
.dk_blue_bkg{background-color: #003f63;}
.dk_grey_bkg{background-color: #303030;}
.lt_grey_bkg{background-color: #FAFAFA;}
.black_bkg{background-color: #000;}
.white_bkg{background-color: #fff;}



/* Font Styles reg 400 semi 600 bold 700 *****************************************/
html {
    font-size: 16px;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

h1, h2, h3, h4, h5, h6{
    font-weight: 700;
    color: #303030;
    margin-bottom: 20px;
}

h1{font-size: 3.75rem; line-height: 110%;}
h2{font-size: 3.15rem; line-height: 120%;} 
h3{font-size: 2.188rem; line-height: 120%;}
h4{font-size: 1.5rem; line-height: 120%;}
h5{font-size: 1.125rem; line-height: 120%;}
h6{font-size: 1rem; line-height: 120%;}

body{overflow-x: hidden; background: #fff;}
.df_txt, p, body{font-size: 1.188rem; font-weight: 300; line-height: 130%; color: #767676;}
.lg_txt{font-size: 1.313rem; font-weight: 400; line-height: 155%;}
.sm_txt{font-size: 0.875rem; font-weight: 400; line-height: 130%}
.long{overflow-wrap: break-word; hyphens: auto;}
caption{font-size: 0.875rem; font-weight: 400; text-transform: uppercase; line-height: 120%;}
.df_txt, p, .lg_txt, .sm_txt{margin-bottom: 20px;}
.df_txt:last-child, p:last-child, .lg_txt:last-child, .sm_txt:last-child{margin-bottom: 0px;}

location, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}         
sup {top: -0.5rem;}
location {bottom: -0.25rem;}


/* Link + Button Styles *****************************************/
a{color: #0070af; text-decoration: none; border-bottom: 1px solid;}
a:hover{color: #d37200;}
.btn{display: inline-block; font-size: 1.125rem; font-weight: 600; padding: 16px 25px 19px; text-decoration: none; border-bottom: none;}
.has_icon img{width: 20px; vertical-align: middle; margin-right: 5px;}
a img{border-bottom: none;}
.btn.white{background: #fff; color: #303030;}
.btn.blue{background: #0070af; color: #fff;}
.btn.white:hover{background: #303030; color: #fff;}
.btn.blue:hover{background: #d37200; color: #fff;}
a:hover img{opacity: 0.8; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;}


/* Layout Styles *****************************************/
.clear {clear:both;}
.invisible{position : absolute; top : -1000px; width:1px; height:1px; overflow:hidden;}
.hide-text {text-indent: 100%; white-space: nowrap; overflow: hidden;}
.temp-hide{display:none!important;}

.cushion{padding: 80px 0px!important;}
.cushion-lg{padding: 120px 0px!important;}
.cushion-sm{padding: 40px 0px!important;}
.cushion-top{padding-top: 80px!important;}
.cushion-lg-top{padding-top: 120px!important;}
.cushion-sm-top{padding-top: 40px!important;}
.cushion-btm{padding-bottom: 80px!important;}
.cushion-lg-btm{padding-bottom: 120px!important;}
.cushion-sm-btm{padding-bottom: 40px!important;}

.alignleft {float:left; margin-right:15px; margin-bottom:5px;}
.alignright {float:right; margin-left:15px; margin-bottom:5px;}
.aligncenter {display: inline-block; margin: auto; padding: 10px;}

.img img{max-width: 100%; height: auto;}
img.alignleft{float: left; max-width: 100%; margin: 0px 20px 20px 0px;}
img.alignright{float: right; max-width: 100%; margin: 0px 0px 20px 20px;}
img.aligncenter{display: block; margin: 20px auto; max-width: 100%;}

section.full{position: relative; float: left; width: 100%; clear: both;}
.container-lg{margin: auto; display: block; position: relative; zoom: 1; width: 1634px;}
.container{margin: auto; display: block; position: relative; zoom: 1; width: 1436px;}
.container-sm{margin: auto; display: block; position: relative; zoom: 1; width: 1200px;}
.container-fluid{margin: auto; display: block; position: relative; zoom: 1; width: 96%;}

.img-fluid{max-width: 100%;}
.flex{display: table-cell; display: flex; display: -ms-flexbox;}
.full-center{align-items: center; justify-content: center;}

.text-right{text-align: right;}
.text-center{text-align: center;}

.embed-container{ position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; margin: 5px 0px;} 
.embed-container iframe, .embed-container object, .embed-container embed{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.clearfix::after{
  content: "";
  clear: both;
  display: table;
}

video {
  width: 100%;
  height: auto;
}

.wide{padding-left: 0px!important; padding-right: 0px!important;}

strong, .bold{font-weight:700; font-style: normal;}
em, .italic{font-style: italic;}

ol, ul{margin-top: 20px; margin-left: 40px;}
ol li, ul li{margin: 10px 0px;}


/* header.site Styles *****************************************/
header.site{float: left; width: 100%; position: fixed; z-index: 100000; top: 0px; left: 0px; padding-top: 20px; -webkit-transition: all 0.3s ease-in-out; 
  -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; background-color:transparent;}
header.site.active{background-color: #fafafa; -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.25); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);}

header.site .logo{float: left; width: 110px;}
header.site .logo a{display: inline-block; height: 70px; padding-bottom: 0px; border-bottom: none; -webkit-transition: all 0.3s ease-in-out; 
  -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
header.site.active .logo a{height: 40px; }
header.site .logo a img{display: block; height: 100%;}
header.site .logo a img.solid{display: none;}
header.site.active .logo a img.solid{display: block;}
header.site.active .logo a img.outline{display: none;}

header.site nav{float: right;}
header.site nav ul{list-style: none; margin: 0; display: inline-block;}
header.site nav ul li{display: inline-block; position: relative;}
header.site nav ul li a{text-decoration: none; font-size: 1rem; font-weight: 400; color: #fff; display: inline-block; margin-left: 35px; padding-bottom: 0px; border-bottom: none;}
header.site nav ul li a:hover, header.site nav ul li.current_page_item a, header.site nav ul li.current-menu-parent > a{border-bottom: 2px solid;}
header.site nav ul li:last-child a{background: #0070af; padding: 14px 30px; -webkit-transition: height 0.3s ease-in-out; 
  -moz-transition: height 0.3s ease-in-out; -o-transition: height 0.3s ease-in-out; transition: height 0.3s ease-in-out;}
header.site nav ul li:last-child a:hover{background: #d37200; border:none;}

header.site.active nav ul li a{color: #303030;}
header.site.active{padding: 8px 0px 4px; -webkit-transition: all 0.3s ease-in-out; 
  -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
header.site.active nav ul li a:hover, header.site.active nav ul li.current_page_item a, header.site.active nav ul li.current-menu-parent > a{color: #0070af; border:none;}
header.site.active nav ul li:last-child a{color: #fff; padding: 8px 30px;}
header.site.active nav ul li:last-child a:hover{}

header.site nav ul li.menu-item-has-children > a{cursor: pointer;}
header.site nav ul li.menu-item-has-children > a:after {
    content: '\25BE';
    font-size: 0.875rem;
    display: inline-block;
    margin-left: 5px;
    color: #fff;
}
header.site.active nav ul li.menu-item-has-children > a:after{color: #303030;}

header.site nav ul li ul.sub-menu{
    display: none;
    position: absolute;
    z-index: 10;
    width: 200px;
    background: #fff;
    left: 35px;
    top: 25px;
    padding: 10px 0px;
    -webkit-box-shadow: 0px 2px 15px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 2px 15px 0px rgba(0,0,0,0.1); box-shadow: 0px 2px 15px 0px rgba(0,0,0,0.1);
}
header.site nav ul li:hover ul.sub-menu{display: block;}
header.site nav ul li ul.sub-menu li{display: block; text-align: left; margin: 0px; padding: 0px;}
header.site nav ul li ul.sub-menu li a {
    padding: 6px 12px!important;
    margin: 0px!important;
    display: block;
    font-size: 1rem;
    font-weight: 400;
    color: #303030!important;
    border: none;
    background: #fff!important;
}

header.site nav ul li ul.sub-menu li a:hover, header.site nav ul li ul.sub-menu li.current_page_item a{color: #fff!important; background: #0070af!important; border:none!important;}


/* Mobile Menu Styles *****************************************/
.mobileToggle{display: none;}

#toggleMenu {
    width: 40px;
    height: 32px;
    position: absolute;
    right: 0px;
    top: 12px;
    border-radius: 4px;
    padding: 0px;
    border-bottom: none;
}
#toggleMenu span:after,
#toggleMenu span:before {
  content: "";
  position: absolute;
  left: 0;
  top: -7px;
}
#toggleMenu span:after{top: 7px;}
#toggleMenu span{position: relative; display: block; margin-top: 8px;}
#toggleMenu span,
#toggleMenu span:after,
#toggleMenu span:before {
    width: 100%;
    height: 4px;
    background-color: #fff;
    transition: all 0.3s;
    backface-visibility: hidden;
    border-radius: 2px;
}
#toggleMenu.opened span {background-color: transparent;}
#toggleMenu.opened span:before {transform: rotate(45deg) translate(5px, 5px);}
#toggleMenu.opened span:after {transform: rotate(-45deg) translate(5px, -5px);}
#toggleMenuTitle{
    position: absolute; 
    top: -2px; 
    right: 50px; 
    font-weight: 700;
    font-size: 14px;
    color: #fff;
    cursor: pointer;
}

header.site.active #toggleMenu span,
header.site.active #toggleMenu span:after,
header.site.active #toggleMenu span:before{background-color: #0070af;}
header.site.active #toggleMenu.opened span {background-color: transparent;}
header.site.active #toggleMenuTitle{color: #0070af;}

#mobileNav{
    visibility: visible;
    padding: 0px 0px 0px 0px;
    z-index: 10000000;
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    transition: all 0.5s;
    transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    overflow: auto;
    width: 65%;
    max-width: 275px;
    min-width: 230px;
    background: #303030;
    height: 100%;
}
#mobileNav.opened{
    transform: translateX(0);
    -ms-transform: translateX(0);
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
}
#mobileNav .logo{display: block; margin: 20px 0 0 24px; border-bottom: none;}
#mobileNav .logo img{width: 80%;}
#mobileNav .menu-main-menu-container{display: inline;}
#mobileNav ul{list-style: none; display: block; margin: 20px 0;}
#mobileNav ul li{display: block; position: relative;}
#mobileNav ul.main li a{text-decoration: none; font-size: 1rem; font-weight: 400; color: #fff; display: block; padding: 12px 24px; border-bottom: none;}
#mobileNav ul.main li a:hover, #mobileNav ul.main li.current_page_item a{background: #0070af;}

#mobileNav ul.main li.menu-item-has-children > a{cursor: pointer;}
#mobileNav ul.main li.menu-item-has-children > a:after {
    content: '\25BC';
    font-size: 0.875rem;
    position: absolute;
    right: 30px;
    margin-left: 5px;
    color: #fff;
}
#mobileNav ul.main li.menu-item-has-children.opened > a:after {
    content: '\25B2';
}
#mobileNav ul.main li ul.sub-menu{
    display: none;
    width: 100%;
    background: #003f63;
    margin: 0px;
}
#mobileNav ul.main li ul.sub-menu li{display: block; text-align: left; margin: 0px;}
#mobileNav ul.main li ul.sub-menu li a {
    padding: 12px 24px 12px 50px;
    display: block;
    font-size: 1rem;
}
#mobileNav ul.main li ul.sub-menu li a:hover{background: #005789;}


/* Home Banner Styles *****************************************/
#hero{background: url(images/hero-bkg.jpg) no-repeat top center; background-size: cover;}
#hero div{padding: 300px 0px 220px;}
#hero h1{color: #fff; font-size: 100px; font-style: italic;}
#hero p{color: #fff; margin: 20px 0px 40px; }



/* Inner Banner Styles *****************************************/
#inner_hero{padding: 220px 0px 140px;}
#inner_hero h1{color: #fff;}


/* site wide Styles *****************************************/
.sub-title{text-transform: uppercase; font-weight: 600; font-size: 1rem; margin-bottom: 20px;}

.halfflex .container, .leftflex .container{align-items: center; flex-wrap: wrap; justify-content: space-between;}
.halfflex .leftside, .halfflex .rightside{width: 48%;}
.leftflex .leftside{width: 33%;}
.leftflex .rightside{width: 65%;}

#ministries .container{align-items: center; flex-wrap: wrap; justify-content: flex-start;}
#ministries .container a{width: 31%; border: none; margin: 10px;}
#ministries .container a img{width: 100%; height: auto;}

#ministry_banner img.banner{width: 100%;}
.leaders_list .heading{width: 100%; border-bottom: 2px solid #303030; margin-bottom: 30px;}
#content.halfflex .container{align-items: flex-start;}


/* Calendar Styles *****************************************/
#calendar-list{width: 100%; border-top: 2px solid #303030; border-collapse: collapse; margin-top: 30px;}
#calendar-list tr{}
#calendar-list tr td{padding: 20px 0px; border-bottom: 1px solid #c8c6c6; vertical-align: middle;}
#calendar-list p{color: #303030; font-weight: 600;}
#calendar-list p span{display: block; color: #767676; font-weight: 400;}

#calendar-list a.info{display:block; float: right; width: 30px; height: 30px; background: url(images/icons/arrow-right-blue.png); background-size: 100%; border:none; text-decoration: none;}
#calendar-list a.info:hover{background-position: bottom;}
#calendar-list a.info span{display: none;}

#calendar-list a.invite{float: right; border: none;}
#calendar-list a.invite span{display: none;}
#calendar-list a.invite img{width: 100px; height: auto;}

#zoom{float: left; width: 100%; margin-top: 30px;}
#zoom a{border: none!important;}
#zoom p{vertical-align: middle;}
#zoom img{background: #003f63; border-radius: 10px; padding: 10px; width: 80px; vertical-align: middle; margin-right: 10px; margin-top: -5px;}

#content #zoom{text-align: center;}


/* Links Styles *****************************************/
#links .container.flex{justify-content: space-between; flex-wrap: wrap;}
#links .container.flex .item{width: 32%; border-bottom: 1px solid #c8c6c6;}
#links .item .img a{float: left; width: 100%; height: 320px; border: none;}
#links .item .img a:hover{opacity: 0.8; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;}

#links .item .text{float: left; width: 100%; padding: 20px 0px;}
#links .item .text h2{display: inline-block; margin-bottom: 0px; font-size: 2.188rem;}
#links .item .text a.info{display:block; float: right; width: 30px; height: 30px; background: url(images/icons/arrow-right-blue.png); background-size: 100%; border:none; text-decoration: none; margin-top: 10px;}
#links .item .text a.info:hover{background-position: bottom;}
#links .item .text a.info span, #links .item .img a span{display: none;}


/* About Styles ***************************************/
#about{background: url(images/about.jpg) no-repeat center; background-size: cover;}
#about p{color: #303030;}


/* Donations Styles ***************************************/
#donations{background: url(images/donations.jpg) no-repeat center; background-size: cover;}
#donations p{color: #303030; width: 650px; font-weight: 400; font-size: 1.25rem; margin: 40px auto;}


/* Prayer Styles ***************************************/
#prayer{background: url(images/prayer.jpg) no-repeat bottom; background-size: cover;}
#prayer span, #prayer h2{color: #fff;}
#prayer p{color: #fff; width: 650px; font-weight: 400; font-size: 1.25rem; margin: 40px 0px;}

#contact .container.flex{justify-content: space-between; flex-wrap: wrap;}
#contact .container.flex .item{width: 32%; padding: 30px; text-align: center; background: #fafafa; border: 1px solid #CFCFCF;}
#contact .container.flex .item img{max-width: 100%; width: 50px; display: block; margin: 0px auto 30px;}

#map{text-align: center; background: url(images/map.jpg) no-repeat center; background-size: cover;}
#map a{width: 100%; display: block; height: 550px; vertical-align: middle; text-indent: -100000000px; background: rgba(0,0,0,0); -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;}
#map a:hover{background: rgba(0,0,0,0.2);}

.single_mission:nth-child(odd) {
    background: #fafafa;
}
.single_mission {
    padding: 40px;
}
.single_mission .leftside.img {
    text-align: left;
}
.single_mission.has_img .img img {
    max-width: 300px;
    height: auto;
}
.single_mission.no_img .rightside.text {
    width: 100%;
}


/* Post/Text Styles ***************************************/
blockquote {
    padding: 50px 100px;
    background: #fafafa;
    display: block;
    margin-bottom: 20px;
    border-left: 5px solid #0070af;
    position: relative;
}

blockquote:before {
    content: "\0022";
    color: #0070af;
    font-family: "Passion One", sans-serif;
    font-size: 120px;
    position: absolute;
    left: 30px;
    top: 60px;
}

blockquote p {
    font-weight: 400;
    font-style: italic;
    font-size: 30px;
}

blockquote p strong {
    text-transform: uppercase;
    font-size: 1.125rem;
    color: #0070af;
}

body.single-post #inner_hero h1.entry-title{color: #fff;}

.entry-meta.post-details {
    width: 100%;
    border-bottom: 2px solid #303030;
    margin-bottom: 30px;
}

h2.entry-title.list{border-bottom: 2px solid #303030; padding-bottom: 10px;}

.blog_list article.post_overview {
    border: 1px solid #e7e7e7;
    padding: 30px;
    margin-bottom: 30px;
}

body.error404 h2{font-size: 150px;}

/* footer Styles *****************************************/
footer.site{position: relative; float: left; width: 100%; background: #003f63;}

footer.site .top, footer.site .bottom{float: left; width: 100%;}
footer.site .top .container{border-bottom: 1px solid #255774; padding-bottom: 20px;}
footer.site .bottom{margin-top: 30px;}

footer.site .logo{display: inline-block; border:none; margin-bottom: 30px;}
footer.site nav#footerNav{float: left; width: 100%; padding: 10px 0px;}
footer.site nav#footerNav ul{list-style: none; margin: 0 auto; display: block; text-align: center;}
footer.site nav#footerNav ul li{display: inline-block; position: relative;}
footer.site nav#footerNav ul li a{text-decoration: none; font-size: 1rem; font-weight: 400; color: #fff; display: inline-block; margin: 0px 10px; padding-bottom: 0px; border-bottom-color: transparent;}
footer.site nav#footerNav ul li a:hover{border-bottom: 1px solid;}

footer.site p{color: #fff; font-size: 0.875rem;}

.fancybox-close{border:none!important;}





/* Responsive Styles *****************************************/
@media only screen and (max-width:1650px) {
    .container-lg{width: 96%;}
}

@media only screen and (max-width:1470px) {
    .container{width: 96%;}
    
    header.site nav ul li a {
        margin-left: 10px;
    }
    
    header.site nav ul li ul.sub-menu {
        left: 10px;
    }
}


@media only screen and (max-width:1365px) {
    .container-sm{width: 96%;}

}


@media only screen and (max-width:1199px) {
    #mainNav{display: none;}
    .mobileToggle{display: block;}

    #hero div{padding: 200px 0px 120px;}
    #hero h1{font-size: 5rem;}

}


@media only screen and (max-width:989px) {
    #hero h1{font-size: 3.5rem;}
    
    .halfflex .leftside, .halfflex .rightside{width: 100%;}
    .leftflex .leftside, .leftflex .rightside{width: 100%;}
    .leftflex .img{margin-bottom: 30px;}

    #content.halfflex .container .img{display: block; width: 100%; margin-bottom: 30px;}
    
    .single_mission.no_img .img {margin-bottom: 0px!important;}

    #links .container.flex .item{width: 100%; margin-bottom: 30px;}
    #links .container.flex .item:last-child{margin-bottom: 0px;}
    #links .item .img a{background-position: center center!important;}

    #about .leftside{margin-bottom: 20px;}

    #prayer{text-align: center;}
    #prayer p{margin: 40px auto;}

    #ministries .container a{width: 47%;}

    #contact .container.flex .item{width: 100%; margin-bottom: 30px;}
    #contact .container.flex .item:last-child{margin-bottom: 0px;}

    #map{background-size: auto;}
    #map a{height: 350px;}
    
    body.error404 h2{font-size: 110px;}
}


@media only screen and (max-width:767px) {
    h1{font-size: 2.5rem;}
    h2{font-size: 1.875rem;} 
    h3{font-size: 1.5rem;}
    h4{font-size: 1.25rem;}
    h5{font-size: 1.125rem;}

    .cushion{padding: 40px 0px!important;}
    .cushion-lg{padding: 80px 0px!important;}
    .cushion-sm{padding: 20px 0px!important;}
    .cushion-top{padding-top: 40px!important;}
    .cushion-lg-top{padding-top: 80px!important;}
    .cushion-sm-top{padding-top: 20px!important;}
    .cushion-btm{padding-bottom: 40px!important;}
    .cushion-lg-btm{padding-bottom: 80px!important;}
    .cushion-sm-btm{padding-bottom: 20px!important;}

    .btn{font-size: 1rem; padding: 12px 20px 15px;}

    .lg_txt {font-size: 1.125rem;}
    .df_txt, p, body{font-size: 1rem;}

    #inner_hero{padding: 160px 0px 100px;}

    #calendar-list{float: left; margin-top: 0px;}
    #calendar-list tr{float: left; width: 100%; padding: 10px 0px; border-bottom: 1px solid #c8c6c6;}
    #calendar-list tr td{float: left; width: 100%; padding: 2px 0px; border: none; vertical-align: top;}
    #calendar-list p{color: #303030; font-weight: 600;}
    #calendar-list a.info{display:block; float: left; width: 30px; height: 30px; background: url(images/icons/arrow-right-blue.png); background-size: 100%; border:none; text-decoration: none;}
    #calendar-list a.info:hover{background-position: bottom;}
    
    #calendar-list a.invite{float: left; margin-top: 20px;}

    #links .item .text h2{font-size: 1.5rem;}
    #links .item .text a.info{margin: 0px;}

    #donations p, #prayer p{width: 90%; font-size: 1rem;}

    #ministries .container a{width: 100%; margin: 5px 0px;}
    
    blockquote {
        padding: 80px 20px 50px 20px;
    }
    
    blockquote:before {
        font-size: 100px;
        left: 20px;
    }
    
    blockquote p {
        font-size: 20px;
    }

    blockquote p strong {
        display: block;
        margin-top: 10px;
    }
    
    body.error404 h2{font-size: 80px;}

    footer.site .logo img {
      max-width: 80%;
    }

    footer.site nav#footerNav ul{display: inline-block;}
    footer.site nav#footerNav ul li{display: block;}
    footer.site nav#footerNav ul li a{margin: 0px; font-size: 0.875rem; display: inline-block;}

}

@media only screen and (max-width:575px) {
  header.site .logo a img {
      height: auto;
      width: 190px;
  }

  #hero div{padding: 200px 0px 120px;}
  #hero h1{font-size: 2rem;}

  #zoom{width: 100%; text-align: center;}
  #zoom img{display: block; margin: 10px auto;}
}


@media only screen and (max-width:479px) {
    #calendar-list a.invite{width: 100%;}
}