/* ============================================================================
   THE FRAME - the ICGC theme's stylesheet
   ----------------------------------------------------------------------------
   Every value here was Divi's on 10 September 2026, measured on the live site
   and restated for the one header and footer this site has. adinkra-header.css
   loads after this and restyles the header in the church's colours; nothing
   here tries to do that job, so a value below that looks wrong for the design
   is usually one adinkra-header.css overrides on purpose.

   HOW DIVI'S RULES WERE RESTATED
   Divi scopes its header rules to body classes it sets from its own options -
   et_fixed_nav, et_show_nav, et_header_style_left, et_fullwidth_nav. On this
   site those were always on, so `.et_fixed_nav #main-header` is written here
   as `#main-header`; rules for options this site never used (centred or split
   headers, a secondary bar, vertical navigation, mega menus) are left out.
   The ids stay Divi's because adinkra-header.css, adinkra.css and adinkra.js
   address them 51 times.

   1  reset and base - Divi's style.min.css, every rule that targets plain
      elements rather than a Divi component, plus the .entry-content and
      .container rules the page template relies on
   2  the header      3  the phone menu      4  the footer      5  ours
   ========================================================================== */

/* 1 ---------------------------------------------------------------------- */
a,abbr,acronym,address,applet,b,big,blockquote,body,center,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,i,iframe,img,ins,kbd,label,legend,li,object,ol,p,pre,q,s,samp,small,span,strike,strong,sub,sup,tt,u,ul,var { margin:0;padding:0;border:0;outline:0;font-size:100%;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;vertical-align:baseline;background:transparent }
body { line-height:1 }
ol,ul { list-style:none }
blockquote,q { quotes:none }
blockquote:after,blockquote:before,q:after,q:before { content:"";content:none }
blockquote { margin:20px 0 30px;border-left:5px solid;padding-left:20px }
:focus { outline:0 }
del { text-decoration:line-through }
pre { overflow:auto;padding:10px }
figure { margin:0 }
table { border-collapse:collapse;border-spacing:0 }
article,aside,footer,header,hgroup,nav,section { display:block }
body { font-family:Open Sans,Arial,sans-serif;font-size:14px;color:#666;background-color:#fff;line-height:1.7em;font-weight:500;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale }
a { color:#2ea3f2 }
a,a:hover { text-decoration:none }
p { padding-bottom:1em }
p:not(.has-background):last-of-type { padding-bottom:0 }
strong { font-weight:700 }
cite,em,i { font-style:italic }
code,pre { font-family:Courier New,monospace;margin-bottom:10px }
ins { text-decoration:none }
sub,sup { height:0;line-height:1;position:relative;vertical-align:baseline }
sup { bottom:.8em }
sub { top:.3em }
dl { margin:0 0 1.5em }
dl dt { font-weight:700 }
dd { margin-left:1.5em }
blockquote p { padding-bottom:0 }
embed,iframe,object,video { max-width:100% }
h1,h2,h3,h4,h5,h6 { color:#333;padding-bottom:10px;line-height:1em;font-weight:500 }
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a { color:inherit }
h1 { font-size:30px }
h2 { font-size:26px }
h3 { font-size:22px }
h4 { font-size:18px }
h5 { font-size:16px }
h6 { font-size:14px }
input { -webkit-appearance:none }
input[type=checkbox] { -webkit-appearance:checkbox }
input[type=radio] { -webkit-appearance:radio }
input.text,input.title,input[type=email],input[type=password],input[type=tel],input[type=text],select,textarea { background-color:#fff;border:1px solid #bbb;padding:2px;color:#4e4e4e }
input.text:focus,input.title:focus,input[type=text]:focus,select:focus,textarea:focus { border-color:#2d3940;color:#3e3e3e }
input.text,input.title,input[type=text],select,textarea { margin:0 }
textarea { padding:4px }
button,input,select,textarea { font-family:inherit }
img { max-width:100%;height:auto }
.clear { clear:both }
br.clear { margin:0;padding:0 }
blockquote { border-color:#2ea3f2 }
#wpadminbar { z-index:100001 }
* { -webkit-box-sizing:border-box;box-sizing:border-box }
#main-content { background-color:#fff }
.container { width:80%;max-width:1080px;margin:auto;position:relative }
.entry-content table:not(.variations) { border:1px solid #eee;margin:0 0 15px;text-align:left;width:100% }
.entry-content thead th,.entry-content tr th { color:#555;font-weight:700;padding:9px 24px }
.entry-content tr td { border-top:1px solid #eee;padding:6px 24px }
.entry-content ul { list-style-type:disc;padding:0 0 23px 1em;line-height:26px }
.entry-content ol { list-style-type:decimal;list-style-position:inside;padding:0 0 23px;line-height:26px }
.entry-content ul li ol { padding:2px 0 2px 20px }
.entry-content ol li ol { padding:2px 0 2px 35px }
@media (max-width:980px) { #page-container { padding-top:80px } }
@media print { #page-container { padding-top:0!important } }
.clearfix:after { visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0 }

/* 2 THE HEADER ------------------------------------------------------------ */
#page-container { padding-top: 80px; }           /* the bar's height; Divi's script also wrote it inline */
#main-header {
  line-height: 23px; font-weight: 500; top: 0; background-color: #fff; width: 100%;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .1); position: fixed; z-index: 99999;
  transition: background-color .4s, color .4s, transform .4s, opacity .4s ease-in-out;
}
.container { text-align: left; }
.container.et_menu_container { z-index: 99; }
@media (min-width: 981px) {
  #main-header .container { width: 100%; max-width: 100%; padding-right: 32px; padding-left: 30px; }   /* full-width nav */
}
.logo_container { position: absolute; height: 100%; width: 100%; transition: all .4s ease-in-out; }
span.logo_helper { display: inline-block; height: 100%; vertical-align: middle; width: 0; }
#logo {
  width: auto; margin-bottom: 0; max-height: 54%; display: inline-block; float: none;
  vertical-align: middle; transform: translate3d(0, 0, 0); transition: all .4s ease-in-out;
}
@media (min-width: 981px) { #logo { max-height: 95%; } }   /* Divi's customizer; adinkra-header.css caps it at 62px */

#et-top-navigation { float: right; font-weight: 600; padding-top: 33px; transition: all .4s ease-in-out; }
#et-top-navigation nav > ul > li > a { padding-bottom: 33px; }
#top-menu-nav, #top-menu { line-height: 0; }
nav#top-menu-nav, #top-menu { float: left; }
.nav li { position: relative; line-height: 1em; }
#top-menu li { display: inline-block; font-size: 14px; padding-right: 22px; word-wrap: break-word; }
#top-menu > li:last-child { padding-right: 0; }
#top-menu a {
  color: rgba(0, 0, 0, .6); text-decoration: none; display: block; position: relative;
  transition: opacity .4s ease-in-out, background-color .4s ease-in-out;
}
#top-menu li a { font-weight: bold; font-style: normal; text-transform: none; }   /* Divi's customizer */
#top-menu-nav > ul > li > a:hover { opacity: .7; transition: all .4s ease-in-out; }
#top-menu li.current-menu-ancestor > a, #top-menu li.current-menu-item > a { color: #2ea3f2; }

/* Sub-menus. None in the public menu today; kept because the signed-in menu
   is built by a plugin and could grow one. */
.nav li ul {
  position: absolute; padding: 20px 0; z-index: 9999; width: 240px; background: #fff;
  visibility: hidden; opacity: 0; border-top: 3px solid #2ea3f2;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .1); transform: translateZ(0); text-align: left;
}
.nav li li { position: relative; line-height: 2em; padding: 0 20px; margin: 0; }
.nav li li ul { z-index: 1000; top: -23px; left: 240px; }
.nav li:hover { visibility: inherit; }
.nav li:hover > ul { opacity: 1; visibility: visible; }
#top-menu li li a { padding: 6px 20px; width: 200px; }
.nav li li a { font-size: 14px; transition: opacity .2s ease-in-out, background-color .2s ease-in-out; }
.nav ul li a:hover { background-color: rgba(0, 0, 0, .03); opacity: .7; }
#main-header .nav li ul a { color: rgba(0, 0, 0, .7); }
@media (min-width: 981px) { #et-top-navigation ul li:hover > ul { transition: all .2s ease-in-out; } }

/* The scrolled state: assets/frame.js sets .et-fixed-header once the page has
   moved, as Divi's script did. The bar shortens from 80px to 54px and trades
   adinkra-header.css's gold hairline for Divi's soft shadow - that swap is
   Divi's rule outranking the hairline at 1,1,0 against 1,0,0, both
   !important, and it is carried because it is what the site does today. */
@media (min-width: 981px) {
  #main-header.et-fixed-header { box-shadow: 0 0 7px rgba(0, 0, 0, .1) !important; }
  .et-fixed-header #et-top-navigation { padding-top: 20px; }
  .et-fixed-header #et-top-navigation nav > ul > li > a { padding-bottom: 20px; }
}

/* Signed-in editors see the admin bar above the header. */
body.admin-bar #main-header { top: 32px; }
@media screen and (max-width: 782px) { body.admin-bar #main-header { top: 46px; } }

/* Below 981px the bar scrolls away with the page, and the menu is the hamburger. */
@media (max-width: 980px) {
  #page-container { padding-top: 79px; }         /* 79, not 80: what Divi's script measured and wrote here */
  #main-header { position: absolute; transition: none; }
  #top-menu { display: none; }
  #et-top-navigation { margin-right: 0; transition: none; padding-top: 24px; display: block; }
  #logo { max-width: 50%; }
  #logo, .logo_container, .container { transition: none; }
}
@media print {
  #page-container { padding-top: 0 !important; }
  #main-header { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; }
}

/* 3 THE PHONE MENU -------------------------------------------------------- */
#et_mobile_nav_menu { float: right; display: none; }
/* The phone switch has to come AFTER the rule it overrides. Both are (1,0,0),
   so the later one wins. It was first written inside the block above, where
   Divi kept it - but Divi's base rules came earlier in its file, and here they
   come later, so `display: none` won. The first phone measurement of this
   theme found a 24px bar with no hamburger in it, and no way to open the menu. */
@media (max-width: 980px) { #et_mobile_nav_menu { display: block; } }
.mobile_menu_bar { position: relative; display: block; line-height: 0; }
#et-top-navigation .mobile_menu_bar { padding-bottom: 24px; }
.et_mobile_menu {
  position: absolute; left: 0; padding: 5%; background: #fff; width: 100%;
  visibility: visible; opacity: 1; display: none; z-index: 9999;
  border-top: 3px solid #2ea3f2; box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
}
.mobile_nav.opened .et_mobile_menu { display: block; }
.et_mobile_menu li a {
  border-bottom: 1px solid rgba(0, 0, 0, .03); color: #666; padding: 10px 5%; display: block;
  font-size: 14px; transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
}
.et_mobile_menu li a:hover { background-color: rgba(0, 0, 0, .03); opacity: .7; }
.et_mobile_menu li li { padding-left: 5%; }
#main-header .et_mobile_menu li ul { visibility: visible !important; display: block !important; padding-left: 10px; }
.et_mobile_menu .menu-item-has-children > a { font-weight: 700; background-color: rgba(0, 0, 0, .03); }
.et_mobile_menu li .menu-item-has-children > a { background-color: transparent; }
.mobile_menu_bar:before, .mobile_menu_bar:after { color: #2ea3f2; }   /* adinkra-header.css makes it light */

/* 4 THE FOOTER ------------------------------------------------------------ */
#main-footer { background-color: #222; }
#footer-bottom { background-color: rgba(0, 0, 0, .32); padding: 15px 0 5px; }
#footer-bottom a { transition: all .4s ease-in-out; }
#footer-info { text-align: left; color: #666; padding-bottom: 10px; float: left; }
#footer-info a { font-weight: 700; color: #666; }
#footer-info a:hover { opacity: .7; }
.et-social-icons { float: right; }
.et-social-icons li { display: inline-block; margin-left: 20px; }
.et-social-icon a {
  display: inline-block; font-size: 24px; position: relative; text-align: center;
  transition: color .3s; color: #666; text-decoration: none;
}
.et-social-icons a:hover { opacity: .7; transition: all .4s ease-in-out; }
@media (max-width: 980px) {
  #footer-info { float: none; text-align: center; }
  .et-social-icons { float: none; text-align: center; margin: 0 0 5px; }
}

/* 5 OURS ------------------------------------------------------------------ */
/* WordPress's own class for text only a screen reader should announce; core
   leaves the rule to the theme. */
.screen-reader-text {
  border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px;
  overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}

/* The hamburger is a real button now, so it answers to a keyboard and says
   what it is. Divi's was a span with a glyph from its ETmodules icon font;
   the three bars are drawn here in the same 32px box, in currentColor, which
   adinkra-header.css sets light. */
button.mobile_menu_bar {
  -webkit-appearance: none; appearance: none; background: none; border: 0; margin: 0;
  padding-top: 0; padding-left: 0; padding-right: 0; color: inherit; font: inherit; width: 32px; cursor: pointer;
}
.mobile_menu_bar:before {
  content: ""; display: block; width: 32px; height: 32px;
  background:
    linear-gradient(currentColor, currentColor) center 8px / 24px 3px no-repeat,
    linear-gradient(currentColor, currentColor) center 15px / 24px 3px no-repeat,
    linear-gradient(currentColor, currentColor) center 22px / 24px 3px no-repeat;
}

/* An in-page link lands clear of the fixed bar - Divi's script scrolled to
   the target less the bar's height; the browser does it from this. */
@media (min-width: 981px) { html { scroll-padding-top: 80px; } }