:root{
	/* Colors */
	--cloud-tint-1:#F3F3F0;
	--cloud-tint-2:#E3DED7;
	--cloud-tint-3:#C8C0B8;
	--cloud-tint-4:#6B635C;
	--peach:#E99F7B;
	--white:#FFFFFF;
	--black:#000000;
	--ocean-90:#0E2349;
	--ocean-60:#4A73B6;
	--ocean-30:#87A7DC;
	--ocean-10:#BDD4F7;
	--ocean-05:#D9E8FF;
	--ocean-subtle:#D9E8FF;
	--sunbeam-40:#F0F3BB;
	--crimson:#641B2E;
	--crimson-subtle:#F0D5DC;
	--seaglass:#08908C;
	--harvest-subtle:#FFD7C7;
	--sunflower-subtle:#FFEABA;
	--text-neutral:#5A5A58;
	--accentyellow:#F0F3BB;
	--accentpink: #D84B8A;
	--harvest-stark: #3D2218;


	/* Sizing */
	--size-4: 4px;
	--size-8: 8px;
	--size-12: 12px;
	--size-14: 14px;
	--size-15: 15px;
	--size-16: 16px;
	--size-18: 18px;
	--size-20: 20px;
	--size-24: 24px;
	--size-28: 28px;
	--size-32: 32px;
	--size-36: 36px;
	--size-40: 40px;
	--size-44: 44px;
	--size-48: 48px;
	--size-56: 56px;
	--size-64: 64px;
	--size-72: 72px;
	--size-80: 80px;
	--size-88: 88px;
	--size-96: 96px;
	--size-104: 104px;

	  /* Spacing */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 16px;
	--space-4: 24px;
	--space-5: 32px;
	--space-6: 48px;

	/* Typography */
	--font-body: 'Inter', sans-serif;
	--font-heading: 'STIX Two Text', serif;

	/* Transitions */
	--transition: all 0.3s ease;

}


*{ margin:0px; padding:0px; outline:0px; box-sizing: border-box;}
*, *:before, *:after { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
a{text-decoration:none; color:var(--ocean-90); transition: var(--transition);}
a:hover{transition: var(--transition); color:var(--accentpink);}
a img, img{border:0px; outline:none;}
img{max-width:100%; height:auto;}
a, input[type="submit"], button{outline:none;  }
.clear{clear:both;}
::-moz-placeholder{ opacity:1; }
input[type=submit], button, select{ -moz-appearance: none;-webkit-appearance: none;}
input, select, button, textarea{font-family: var(--font-body); font-weight:400;}
input[type=submit], button{ cursor:pointer;transition: var(--trns);}
input[type="submit"], input[type="text"], input[type="date"], input[type="time"], input[type="search"], button, input[type="email"], input[type="tel"], textarea, select{-webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius:0; border:0;}
h1, h2, h3, h4, h5, h6, p, ul, li, label, input, textarea, img, submit, button, a{ margin: 0px; padding: 0px; outline: none; list-style: none;}
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, font, ins, kbd, q, s, samp, small, strike, strong, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {order: 0;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align:baseline;}
html {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;font-size: 62.5%;overflow-y: scroll;-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;scroll-behavior: smooth;}
q {-webkit-hyphens: none;-moz-hyphens: none;-ms-hyphens: none;hyphens: none;quotes: none;}
a:focus {outline:0;outline: 0;}
a:hover,
a:active {outline: 0;}
a img {border: 0;}
input::-webkit-input-placeholder { opacity: 1; }
input::-moz-placeholder { opacity: 1; }

body{color: var(--black); font-family: var(--font-body); font-weight:400; font-size:var(--size-16); line-height:calc(var(--size-16) + 4px); position:relative;}
strong, b{ font-weight:700;}

/* Headings */
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 400; margin: var(--size-20) 0; }

h1, .x-large{ font-size: var(--size-56); line-height: calc(var(--size-56) + 4px); }
h2, .large{ font-size: var(--size-48); line-height: calc(var(--size-48) + 4px); }
h3, .medium{ font-size: var(--size-40); line-height: calc(var(--size-40) + 4px); }
h4, .small{ font-size: var(--size-32); line-height: calc(var(--size-32) + 4px); }
h5, .title-large{ font-size: var(--size-28); line-height: calc(var(--size-28) + 4px); }
h6, .title-medium{ font-size: var(--size-24); line-height: calc(var(--size-24) + 4px); }
.title-small{ font-size: var(--size-20); line-height: calc(var(--size-20) + 4px); }
.body-large{ font-size: var(--size-18); line-height: calc(var(--size-18) + 2px); }
.body-medium{ font-size: var(--size-16); line-height: calc(var(--size-16) + 4px); }
.body-small{ font-size: var(--size-14); line-height: calc(var(--size-14) + 4px); }
.label-small{ font-size: var(--size-12); line-height: calc(var(--size-12) + 4px); }

/* Width Utilities */
.w-100 { width: 100%; }
.w-90  { width: 90%; }
.w-80  { width: 80%; }
.w-75  { width: 75%; }
.w-70  { width: 70%; }
.w-66  { width: 66.666%; }
.w-60  { width: 60%; }
.w-50  { width: 50%; }
.w-40  { width: 40%; }
.w-33  { width: 33.333%; }
.w-30  { width: 30%; }
.w-25  { width: 25%; }
.w-20  { width: 20%; }


/* Font Weights and Families */
.regular{ font-weight: 400;}
.fontmedium{ font-weight: 500;}
.fontbold{ font-weight: 700;}
.semibold{ font-weight: 600;}
.stixtwo{ font-family: 'STIX Two Text', serif;}
.inter{ font-family: 'Inter', sans-serif;}

p{margin: var(--size-20) 0;}
h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child{ margin-bottom: 0;}
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child, p:first-child{ margin-top: 0;}

p:empty{ display: none!important;}
em{ font-style: italic;}
.btn{display: inline-flex; padding: var(--size-15) var(--size-24); font-size: var(--size-16); line-height: 20.4px; font-weight: 600; color: var(--white); background-color: var(--ocean-90); border: 1px solid var(--ocean-90); border-radius: 50px; justify-content: center; align-items: center; gap: var(--size-8); text-transform: capitalize; }
.btn:hover{ background-color: var(--ocean-60); color: var(--white); transition: var(--transition); border-color: var(--ocean-60);}

.btn-secondary{ padding: var(--size-12) var(--size-16) 10.4px; font-size: var(--size-12); line-height: 15px; letter-spacing: 0.7px; text-transform: uppercase; font-weight: 700; }

.btn.ocean-10{ background-color: var(--ocean-10); border-color: var(--ocean-10); color: var(--ocean-90);}
.btn.ocean-10:hover{ background-color: var(--ocean-30); border-color: var(--ocean-30);}

.btn.ocean-60{ background-color: var(--ocean-60); border-color: var(--ocean-60); color: var(--white);}
.btn.ocean-60:hover{ background-color: var(--ocean-90); border-color: var(--ocean-90);}

.btn.border-white{ background-color: transparent; border-color: var(--white); color: var(--white);}
.btn.border-white:hover{ background-color: var(--white); border-color: var(--white); color: var(--ocean-90);}

.btn.border-ocean90{ background-color: transparent; border-color: var(--ocean-90); color: var(--ocean-90);}
.btn.border-ocean90:hover{ background-color: var(--ocean-90); border-color: var(--ocean-90); color: var(--white);}


.btn.accentyellow{ background-color: var(--accentyellow); border-color: var(--accentyellow); color: var(--ocean-90);}
.btn.accentyellow:hover{ background-color: var(--cloud-tint-3); border-color: var(--cloud-tint-3);}


.gap-24{ gap: var(--size-24);}
.gap-20{ gap: var(--size-20);}
.gap-16{ gap: var(--size-16);}
.gap-12{ gap: var(--size-12);}
.gap-8{ gap: var(--size-8);}



/* Background Color Utilities */
.cloudtint10, .bg-cloudtint10{ background-color: var(--cloud-tint-1);}
.sunbeam40, .bg-sunbeam40{ background-color: var(--sunbeam-40);}
.ocean05, .bg-ocean05{ background-color: var(--ocean-05);}
.ocean90, .bg-ocean90{ background-color: var(--ocean-90);}
.white, .bg-white{ background-color: var(--white);}
.ocean10, .bg-ocean10{ background-color: var(--ocean-10);}
.peach, .bg-peach{ background-color: var(--peach);}


/* Text Color Utilities */
.textocean90{ color: var(--ocean-90);}
.textoceansubtle{ color: var(--ocean-subtle);}


/* Padding Utilities */
.py8{ padding: var(--size-8) 0;}
.py12{ padding: var(--size-12) 0;}
.py16{ padding: var(--size-16) 0;}
.py20{ padding: var(--size-20) 0;}
.py24{ padding: var(--size-24) 0;}
.py32{ padding: var(--size-32) 0;}
.py40{ padding: var(--size-40) 0;}
.py64{ padding: var(--size-64) 0;}
.py104{ padding: var(--size-104) 0;}
.pb64{ padding-bottom: var(--size-64);}


/* Margin Utilities */
.mt8{ margin-top: var(--size-8);}
.mt16{ margin-top: var(--size-16);}
.mt20{ margin-top: var(--size-20);}
.mt24{ margin-top: var(--size-24);}
.mt32{ margin-top: var(--size-32);}
.mt40{ margin-top: var(--size-40);}
.mt50{ margin-top: 50px;}
.mb40{ margin-bottom: var(--size-40);}
.mb50{ margin-bottom: 50px;}
.mb32{ margin-bottom: var(--size-32);}
.mb24{ margin-bottom: var(--size-24);}
.mb20{ margin-bottom: var(--size-20);}
.mb16{ margin-bottom: var(--size-16);}

.block{ display: block;}

.hubcontainer{ max-width: 1376px; margin: 0 auto; padding: 0 32px; width: 100%;}

.text-center { text-align: center; }
.text-white { color: var(--white); }
.flex { display: flex;}
.flex-between { display: flex; justify-content: space-between; align-items: center;}
.flex-center { display: flex; justify-content: center; align-items: center;}

.menutoggle{ display: none;}
.buttonwrap{ width: 100%; display: block;}
.buttonwrap span{ display: inline-block;}


/* Header Style */
body{ padding-top: 120px;}
.hubheader{ width: 100%; position: fixed; top: 0; left: 0; will-change: transform;  transition: transform 0.3s ease; z-index: 9999; background-color: var(--ocean-90); }
.hubheader.is-fixed{ transform: translateY(-32px); transition: transform 0.3s ease;}

.promoribbon{ width: 100%; background-color: var(--peach); text-align: center; padding: var(--size-8) var(--size-32);}
.promoribbon p{ color: var(--black); font-weight: 700; font-size: var(--size-14); line-height: var(--size-16);  margin: 0;}
.promoribbon p i{ font-style: italic;}

.hubheadermain{ padding: var(--size-24) 0; position: relative;}
.hublogo{ width:330px; }
.hublogo img{ display: block; margin: 0; width: auto; max-height: 32px;}

.hubnav{ width: calc(100% - 710px); display: flex; justify-content: center;}
.hubnav ul{ display: flex; gap: var(--size-12);}
.hubnav ul li a{ color: var(--cloud-tint-1); font-size: var(--size-16); line-height: var(--size-18); font-weight: 500; transition: var(--transition); padding: var(--size-8);}
.hubnav ul li a:hover{ color: var(--accentyellow); transition: var(--transition);}

.hubaction{ display: flex; align-items: center; gap: var(--size-12); justify-content: end; width: 380px;}
.hubsearch{ width: 256px; position: relative; }
.hubsearch input{ width: 100%; height: var(--size-40);  transition: all 0.3s ease-in-out; background: transparent; font-weight: 400; padding: 4px 34px 4px 15px; border: 1px solid var(--ocean-60); border-radius: var(--size-40); font-size: var(--size-14); color: var(--ocean-10); line-height: 20px; }
.hubsearch button{ width: 16px; height: 16px; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); background-color: transparent; border: none; background-image: url(../images/search-icon.svg); background-repeat: no-repeat; background-position: center; cursor: pointer;}
.hubsearch button img{ width: var(--size-16); display: none;}
.hubsearch input:hover{ border-color: var(--ocean-10); transition: all 0.3s ease-in-out;}
.hubsearch input::-webkit-input-placeholder { color: var(--ocean-10); }
.hubsearch input::-moz-placeholder { color: var(--ocean-10);}
.hubsearch input:focus::-webkit-input-placeholder { color: var(--ocean-90); }
.hubsearch input:focus::-moz-placeholder { color: var(--ocean-90);}
.hubsearch input:focus, .hubsearch input:active{ background-color: var(--cloud-tint-1); border-color: var(--ocean-10); color: var(--ocean-90);}
.hubsearch .custom-search-form:focus-within .search-submit{ background-image: url(../images/search-arrow.svg);}

.hubdonate .btn::after{ content: url('../images/heart-icon.svg'); display: inline-block; width: var(--size-16); height: var(--size-16); }


.outreachmenu{ display: none; width: 100%; position: absolute; top: 100%; left: 0; background: var(--ocean-90); padding: 28px 0; border-radius: 0 0 12px 12px; box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.15);}
.outreachWrap{ width: 100%; display: flex; justify-content: space-between;}
.outreachMenuLeft{ width: 288px;}
.outreachMenuLeft h5{ padding-bottom: 8px; margin: 0 0 35px; border-bottom: 1px solid var(--ocean-30); font-family: var(--font-body); color: var(--ocean-30); font-size: 14px; text-transform: uppercase; font-weight: 600;line-height: 18px;letter-spacing: 0.28px;}
.outreachMenuLeft ul{ display: flex; flex-direction: column; gap: 12px;}
.outreachMenuLeft ul li a{ color: var(--white); font-size: 16px; line-height: 20px; font-weight: 400; display: inline-block;}
.outreachMenuLeft ul li a:hover{ color: var(--accentyellow); text-decoration: underline; text-underline-offset: 3px;}


.menuFeaturedPost{ display: flex; gap: 12px;}
.menuFeaturedText{ width: 210px;}
.menuFeaturedText h6{ margin: 0 0 12px; font-family: var(--font-body); color: var(--cloud-tint-1); font-size: 12px; font-weight: 400; line-height: 14px; text-transform: uppercase;}
.menuFeaturedText h3{color: var(--cloud-tint-1); font-size: 20px; font-weight: 400; line-height: 24px; margin: 0 0 12px;}
.menuFeaturedText h3 a{ color: var(--cloud-tint-1); text-decoration: none;}
.menuFeaturedText h3 a:hover{ color: var(--accentyellow); text-decoration: underline; text-underline-offset: 3px;}
.menuFeaturedText p{ margin: 0; font-size: 12px; line-height: 14px; color: var(--cloud-tint-1);}

.outreachmenu.active {display: block;}

.hubnav ul li.active a{ color: var(--accentyellow);}







.menuFeaturedImage{ width: 535px;}
.menuFeaturedImage img{ display: block; width: 100%; border-radius: 4px;}






/* Footer Style */
.hubfooter{ width: 100%; position: relative;}

.hubsignup h3{ margin: 0; color: var(--ocean-90); font-size: 36px;font-weight: 400; line-height:52.2px; letter-spacing: -0.72px;}
.hubsignup h3.textoceansubtle{ color: var(--white);}
.hubklvform{ position: relative; width: 457px;}
.hubklvform input{ width: 100%; height:52px; padding:0 125px 0 22px; font-size: var(--size-16); border: 0; border-radius: var(--size-48); background-color: var(--white); color: var(--text-neutral);}
.hubklvform button{ position: absolute; height:52px; width: 120px; font-weight: 600; font-size: var(--size-16); right: -2px; top: 0;}

.hubftrowmain{ width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 32px;}
.hubft_logo{ width: 202px;}
.hubft_logo img{ display: block; width: 40px;}
.hubft_logo p{ margin: 40px 0; font-size: 16px; font-weight: 500; letter-spacing: -0.08px;}


.hubfootermain.py40{ padding-top: 0;}
.hubftmenus{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px;}
.hubftmenucol{ width: 300px;}
.hubftmenucol h6{ color: var(--ocean-60); font-family: var(--font-body); margin: 0 0 24px; padding: 0 0 8px; border-bottom: 1px solid var(--ocean-60); font-size: 12px; font-weight: 700; line-height: 15px; letter-spacing: 0.5px; text-transform: uppercase;}
.hubftmenucol ul{ display: flex; flex-direction: column; gap: 8px;}
.hubftmenucol ul li a{ color: var(--ocean-90); font-size: 16px; font-weight: 500; line-height: 145%; letter-spacing: -0.08px;}

.hubftmenucol ul li.active a, .hubftmenucol ul li a:hover{ color: var(--accentpink); text-underline-offset: 2px; text-decoration: underline;}

.hubsociallinks{ width: 100%; margin: 20px 0;}
.hubsociallinks ul{ display: flex; gap: var(--size-24); align-items: center; justify-content: flex-end;}
.hubsociallinks ul li a svg{ display: block; width: 24px; height: 24px; transition: var(--transition);}
.hubsociallinks ul li a:hover .icon:not(.fb) svg path{ fill: var(--accentpink); transition: var(--transition);}
.hubsociallinks ul li a:hover .icon.fb svg path{ stroke: var(--accentpink); transition: var(--transition);}

.hubcopytext{ width: 100%; text-align: right;}
.hubcopytext p{ color: var(--ocean-90); font-size: 10.8px; line-height: 17px; letter-spacing: 0.44px;}
.hubcopytext p b{ font-weight: 600;}
.hubcopytext p a{ color: var(--ocean-90); }
.hubcopytext p a:hover{ color: var(--accentpink);  text-decoration: underline; text-underline-offset: 2px;}






/* Homepage Style */
body{ background: var(--ocean-90);}

.hubherosection{ width: 100%; position: relative; min-height: 650px; background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; align-items: center; padding: var(--size-40) 0;}

.hubherocontent{ max-width: 570px; color: var(--white);}
.hubherocontent h6{ font-size: var(--size-12); font-weight: 500; margin: 0 0 8px; line-height: var(--size-18); font-family: var(--font-body);}
.hubherocontent h1{ font-size: var(--size-48); line-height: 50px; margin: 0 0 var(--size-20);}
.hubherocontent p{ font-size: var(--size-16); line-height: calc(var(--size-16) + 4px); margin: 20px 0 0;}
.hubgifts .icon img{ width: var(--size-64); display: block; margin: 0 auto;}

.imgtextsection{ padding: var(--size-64) 0;}
.imgtextsection .hubimg{ width: 58%;}
.imgtextsection .hubimg img{ display: block; border-radius: var(--size-4); width: 100%;}
.imgtextsection .hubimgtext{ width: 34%;}
.imgtextsection .hubimgtext h2{ font-size: var(--size-40); line-height: var(--size-44); margin: var(--size-20) 0 0; color: var(--ocean-90);}
.imgtextsection .hubimgtext p{ margin: var(--size-12) 0 0; color: var(--ocean-90);}

.hubimgcardsection .flex{ justify-content: space-between;}
.hubimgcard_wrap{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px;}
.hubimgcard_title{ width: 260px;}
.hubimgcard_title h2{ font-size: var(--size-32); line-height: var(--size-36); margin:0 0 var(--size-12); color: var(--white);}


.hubimgcard_box{ width: 481px; display: flex; border-radius: 4px; padding: 20px; flex-direction: column; justify-content: flex-end;}
.hubimgcard_box h3{ color: var(--ocean-90);font-size: var(--size-24); line-height: var(--size-28); margin:0; font-weight: 500;}
.hubimgcard_img{ width: 481px; }
.hubimgcard_img img{ display: block; border-radius: var(--size-4); width: 100%;}

.mediaplayer_section img{ display: block; margin: 0 auto;}
.abidefeature_section{ width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; padding-top: var(--size-64); overflow: hidden;}
.abidefeature_section .hubcontainer{ display: flex; flex-wrap: wrap; justify-content: space-between; position: relative;}
.abidefeature_section .abideimage{ width: 37%;}
.abidefeature_section .abideimage img{ display: block; width: 100%;}
.abidefeature{ width: 39%;}
.abidefeature h2{ margin: 0; color: var(--ocean-90);}
.abidefeature p{ margin: var(--size-20) 0 0; color: var(--ocean-90);}

.abidereview{ width: 320px; display: flex; width: 313px; padding: var(--size-12) var(--size-16); flex-direction: column; align-items: flex-start; margin-top: var(--size-40); border-radius: 4px 20px; background: rgba(255, 255, 255, 0.50); box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10);}
.abidereview p{ font-size: var(--size-16); line-height: 20px; padding-right: 40px; color: var(--cloud-tint-4); margin: 12px 0 8px;}
.abidereview h6{ font-family: var(--font-body); font-size: var(--size-14); line-height: 16px; color: var(--cloud-tint-4); font-weight: 400; margin: 0;}
.abidereview .icon{ width: 100%; display: flex; align-items: flex-end; justify-content: flex-end;}
.abidereview .icon img{ width:39px; display: block;}

.today_playbtn{ position: absolute; bottom: -6px; left: 20px;}
.today_playbtn .btn{ display: flex; border: 0; border-radius: 12px 12px 0 0; padding: 12px 20px 20px; background: var(--seaglass); color: var(--white); pointer-events: none;}
.today_playbtn .btn:hover{ background: var(--seaglass); color: var(--white);}
.today_playbtn .btn::after{ content: url('../images/down-arrow.svg'); display: inline-block; width: 5px; height: 16px; }


.today_playbtn {z-index: 50;transform: translateY(100px); transition: transform 0.6s ease; }
.today_playbtn.is-visible {
    transform: translateY(0);
}

.today_playbtn.is-bouncing {
    animation: subtle-bounce 2.5s ease-in-out infinite;
}
@keyframes subtle-bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-6px);
    }
}




.everypurchase h4{color: var(--ocean-90); font-family: var(--font-body); font-size: 20px; font-style: italic; font-weight: 400; line-height: 120%; letter-spacing: 0.2px;}

.hubreviews{ width: calc(100% + 20px); margin-left: -10px; position: relative;}
.customreviewslider{ width: 100%; position: relative;}
.customreviewslider .item{ padding: 0 10px; }
.customreviewslider .hubreviewbox{ background-color: var(--ocean-10); border-radius: var(--size-4); padding:var(--size-12) var(--size-20); height: 152px; display: flex; flex-direction: column;}
.hubreviewbox p{ font-size: var(--size-16); line-height: 20px; padding-right: 40px; color: var(--ocean-90); font-weight: 400; margin: 12px 0 8px;}
.hubreviewbox p{  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 3;  overflow: hidden;}
.hubreviewbox h6{ font-family: var(--font-body); font-size: var(--size-14); line-height: 16px; color: var(--cloud-tint-4); font-weight: 400; margin: 0;}
.hubreviewbox .icon{ width: 100%; display: flex; align-items: flex-end; justify-content: flex-end;}
.hubreviewbox .icon img{ width:39px; display: block;}

.slick-dots{ display: flex; align-items: center; justify-content: center; gap: var(--size-8); margin: var(--size-24) 0 0; padding: 0; list-style: none;}
.slick-dots li button{ width: var(--size-8); height: var(--size-8); border-radius: 50%; background-color: var(--ocean-90); opacity: 0.3; font-size: 0px; border: none; padding: 0; cursor: pointer;}
.slick-dots li.slick-active button{ opacity: 1;}
.slick-dots li{ font-size: 0px; line-height: 8px;}



.hubdivider{ width: 100%; height: 1px; background-color: var(--cloud-tint-3);}

.storytitle{ display: flex; gap: var(--size-40); align-items: center;}
.storytitle h2{ font-size: var(--size-56); line-height: 60px; margin:0; color: var(--ocean-90);}
.storytitle::after, .storytitle::before{ content: ''; flex-grow: 1; height: 1px; background-color: var(--cloud-tint-3);}


.hubstoriesmain{ width: 100%; display: flex;  flex-wrap: wrap; gap: 20px;}
.hubstoriesleft{ width: calc(67% - 10px); display: flex; row-gap: 40px; column-gap: 20px; flex-wrap: wrap; height: 100%;}
.hubstoriesright{ width: calc(33% - 10px); display: flex; flex-direction: column; gap: var(--size-24); flex-wrap: wrap; }
.hubstoryfull{ width: 100%; display: flex; flex-direction: column;}
.hubstoryhalf{ width: calc(50% - 10px); display: flex; flex-direction: column;}
.hubstoryposter{ width: 100%; overflow: hidden; position: relative; border-radius: 4px;}
.hubstoryposter img{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: var(--size-4); width: 100%; transition: all ease-in-out 0.6s;}

.hubstorybox:hover .hubstoryposter img{ transform: scale(1.05); transition: all ease-in-out 0.6s;}
.hubstoryposter a{ display: block; width: 100%; height: 100%; position: relative; }
.hubstoryhalf .hubstoryposter{ height: 400px;}
.hubstoryfull .hubstoryposter{ height: 580px;}



.storymeta_data{ display: flex; text-transform: uppercase; gap: var(--size-24); font-size: var(--size-14); line-height: var(--size-16); color: var(--ocean-90); margin: var(--size-24) 0 0;}
.storymeta_data .postauthor a{ color: var(--ocean-90); text-decoration: underline; text-underline-offset: 2px;}
.storymeta_data .postauthor a:hover{ color: var(--accentpink);}	

.hubstorybox h3{ color: var(--ocean-90); font-size: 28px; line-height: 30px; margin: 8px 0 0;}
.hubstorybox h3 a{ color: var(--ocean-90); text-decoration: none;}
.hubstorybox:hover h3 a{ color: var(--accentpink); text-decoration: underline; text-underline-offset: 2px;}	
.hubstorybox p{ color: var(--ocean-90); margin: 8px 0 0;}
.hubstorybox p{ display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2;  overflow: hidden;}

.hubstoriesright .hubstoryhalf{ width: 100%;}
.hubstoriesright .hubstoryhalf .hubstoryposter{ height: 430px;}

.hubquoteoftheday{ width: 100%; border-radius: 4px; background: var(--harvest-subtle); padding: var(--size-16) var(--size-24);}
.hubquoteoftheday p{ font-size: 14px; line-height:16px; color: var(--ocean-90); margin: 12px 0 0; color: var(--harvest-stark);}
.hubquoteoftheday h5{color: var(--harvest-stark); font-size: var(--size-20); line-height: var(--size-24); margin: 0;}
.hubquoteoftheday .quoteicon{ margin: 0 0 24px; display: flex; width: 100%; justify-content: space-between; align-items: center; }
.hubquoteoftheday .quoteicon img{ width: var(--size-40); display: block;}
.hubquoteoftheday .quoteicon span{ display: inline-block; text-transform: uppercase; color: var(--harvest-stark); font-size: 14px; line-height: 20px; font-weight: 500; border-bottom: 1px solid var(--harvest-stark);}

.shopslidermain{ width: 100%; position: relative; padding-left: calc(50vw - 666px); overflow: hidden; }
.shopslidermain h2{margin-bottom: var(--size-32); }
.shopsliderwrapper{ width: calc(100% + 100px);}
.shopslider{ width: 100%; position: relative;}
.shopslider .productitem{ width: 100%; padding:0 10px;}
.productitem h3{ color: var(--ocean-90); font-size: var(--size-20); line-height: 22px; margin: 0;}
.productitem .price{ width: 100%; display: block; margin: 8px 0 0; font-size: 16px; line-height: 20px; font-weight: 400; color: var(--ocean-90);}
.shopcardimg{ width: 100%; display: flex; align-items: center; justify-content: center; position: relative; background-color: #fff; overflow: hidden; border-radius: 4px; height: 472px; margin: 0 0 var(--size-20);}
.shopcardimg .shoptag{ position: absolute; top: 16px; left: 16px; border-radius: 0 24px 24px 24px; background: var(--sunbeam-40); box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.15);}
.shopcardimg .shoptag{color: var(--ocean-90); padding: 8px 12px; display: inline-block; font-size: 14px; font-weight: 500; line-height: 20px; letter-spacing: 0.2px; text-transform: uppercase;}
.shopcardimg img{ display: block; margin: 0 auto; max-height: 412px; max-width: 90%;}
.shopslider .slick-arrow{ position: absolute; top: -62px; right: calc(50vw - 600px); width: 40px; height: 30px; font-size: 0px; background-color: var(--ocean-05); background-repeat: no-repeat; background-position: center; background-size: 16px; border-radius: 99px; }
.shopslider .slick-arrow:hover{ background-color: var(--ocean-30);}
.shopslider .slick-arrow.slick-prev{ background-image: url(../images/arrow-left.svg); right: calc(50vw - 556px);}
.shopslider .slick-arrow.slick-next{ background-image: url(../images/arrow-right.svg);}
.shopcategory{ width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between; flex-direction: column; padding: 20px; background-repeat: no-repeat; background-size: cover; background-position: center;}
.shopcardimg .textbox{ width: 100%; margin-bottom: 0; margin-top: auto;}
.shopcardimg .textbox h4{ color: var(--ocean-90); font-size: 32px; line-height: 36px; margin: 0;}
.shopcardimg .textbox p{ color: var(--ocean-90); opacity: 0.6; margin: 8px 0 0; font-size: 16px; line-height: 20px; font-weight: 400;}
.shopcardimg .btn{ margin-top: 20px;}
.shopcardimg .white_textbox{ width: 100%; margin-bottom: 0; margin-top: auto; background: #fff; padding: 20px 12px; border-radius: 4px;}
.shopcardimg .white_textbox h4{ color: var(--ocean-90); font-size: 32px; line-height: 36px; margin: 0;}
.shopcardimg .white_textbox p{ color: var(--ocean-90); opacity: 0.6; margin: 4px 0 0; font-size: 16px; line-height: 20px; font-weight: 400;}
.shopcategory .icon{ display: block; padding: 8px; width: 100%; }
.shopcategory .icon img{ display: block; max-width: 42px; margin: 0;}

/* Audio Player */
.mediaplayer_section{ padding: var(--size-24) 0;}
.ggr-audio-card {display: flex; align-items: center; background: #ffffff;max-width: 100%;}
/* Cover */
.ggr-audio-cover img {width: 124px; height: 124px; object-fit: cover; border-radius: 12px; box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.15);}
/* Text */
.ggr-audio-info {padding-left: 26px; padding-right: 12px;}
.ggr-audio-title { min-width: 206px; margin: 0 0 4px; font-size: 20px; line-height: 24px; font-family: var(--font-body); color: var(--black); font-weight: 400; line-height: 24px; }
.ggr-audio-scripture {font-size: 14px; line-height: 18px; color: var(--text-neutral); margin-bottom: 4px;}
.ggr-audio-author {font-size: 14px; line-height: 18px; color: var(--text-neutral);}
/* Player */
.ggr-audio-player {display: flex; flex: 1; border-radius: 4px; box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.25); align-items: center; gap: 15px; padding: 16px;}
.ggr-audio-btn {width: 40px; min-width: 40px; height: 40px; border-radius: 50%; border: none; background: var(--seaglass); color: #fff; font-size: 15px; cursor: pointer;}
.ggr-audio-btn.pause {background: var(--accentpink);}
.ggr-audio-bar {display: flex;align-items: center;gap: 8px;width: 100%;}
.ggr-audio-time {font-size: 10px;color: #2A2A28; min-width: 35px; text-align: center;}
.ggr-audio-range {flex: 1; height: 3px; appearance: none; background: var(--text-neutral); border-radius: 2px;}

/* Base range style */
.ggr-audio-range { -webkit-appearance: none;  width: 100%;  height: 4px;  border-radius: 2px;  background: #e5e7eb;  outline: none;  cursor: pointer;}
.ggr-audio-range::-webkit-slider-runnable-track {  height: 4px;  border-radius: 2px;
  background: linear-gradient(    to right,
    #2A2A28 0%,
    #2A2A28 var(--progress),
    #e5e7eb var(--progress),
    #e5e7eb 100%
  );
}

.ggr-audio-range::-webkit-slider-thumb {  -webkit-appearance: none;  width: 14px;  height: 14px;  background: #2A2A28;  border-radius: 50%;  margin-top: -5px;}
.ggr-audio-range::-moz-range-track {  height: 4px;  background: #e5e7eb;  border-radius: 2px;}
.ggr-audio-range::-moz-range-progress { height: 4px;  background: #2A2A28;  border-radius: 2px;}
.ggr-audio-range::-moz-range-thumb {  width: 14px;  height: 14px;  background: #2A2A28;  border-radius: 50%;  border: none;}
.menutoggle{ display: none;}

.back-to-top { display:inline-flex; cursor: pointer; position: fixed; z-index: 99; transition: all 0.5s ease-in-out; bottom: 0; transform: translateY(60px); right: 15px; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 4px; background: var(--ocean-30);}
.back-to-top svg{ width: 22px; height: 22px; display: block;}
.back-to-top svg path{ fill: var(--ocean-90);}
.back-to-top.is-visible { transition: all 0.5s ease-in-out; transform: translateY(-15px);}
.back-to-top:hover{ background-color: var(--ocean-60); transition: all 0.5s ease-in-out;}
.returnMenu{ display: none;}

.gplogoicon{ width: 100%; position: fixed; top: 0; left: 0; height: 25px; background: var(--ocean-90); z-index: 9; transition: all 0.4s ease-in-out; display: none;}
.gplogoicon a{ position: absolute; top: 5px; left: 50%; transform: translate(-50%, 0%); width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--ocean-90);}
.gplogoicon a{box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10);}
.gplogoicon a img{ width: 17px; display: block;}



/* Outreach Landing Page Style */
.hub_pagebanner{ width: 100%; position: relative; display: flex; align-items: flex-end; min-height: 400px; background-repeat: no-repeat; background-size: cover; background-position: center; padding: var(--size-48) 0;}
.hub_pagebanner .hubherocontent{ max-width: 640px; color: var(--white);}
.hubgifts{background-repeat: no-repeat; background-size: cover; background-position: center;}
.hub_connecting{color: var(--white);}
.hub_connecting .flex-between{ align-items: initial;}
.hubconnecting_content{ max-width: 424px;}
.hubconnecting_content h2{ font-size: 40px; line-height: 44px;}
.hubconnecting_content p{ color: var(--ocean-subtle);}
.hubconnecting_stats{ max-width: 646px; display: flex; flex-wrap: wrap; row-gap: 20px;height: 100%;}
.hubconnecting_stat{ width: 33.33%; border-left: 1px solid var(--ocean-60); padding: 0 12px; min-height: 140px;}
.hubconnecting_stat h3{ font-size: var(--size-48); line-height: 50px; margin: 0;}
.hubconnecting_stat p{ font-size: 14px; line-height: 20px; margin: 0; font-weight: 500; color: var(--ocean-subtle);}
.hub_partnerlogos{ width: 100%; display: flex;justify-content: center;align-items: center;align-content: center;gap: 20px;align-self: stretch;flex-wrap: wrap;}
.hub_partnerlogos .item{display: flex;height: 84px;padding:0 16px;flex-direction: column;justify-content: center;align-items: flex-start;}
.hub_partnerlogos .item img{ display: block; max-height: 64px; max-width: 100%; margin: 0 auto;}
.hub_partners h3{ color: var(--ocean-90); font-size: var(--size-32); line-height: var(--size-36); margin: 0 0 var(--size-40);}
.hubevents_content{ max-width: 424px;}
.hubevents_content h2{ font-size: 40px; line-height: 44px; color: var(--ocean-90);}
.hubevents_row{ max-width: 758px; display: flex; flex-wrap: wrap; gap: 20px;}
.hubevents_row .hubevent_item{ position: relative; width: calc(50% - 10px); display: flex; border-radius: 4px; background: var(--white); box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10);}
.hubevent_item .img{ width: 120px; min-width: 120px;}
.hubevent_item .img img{ display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 4px 0 0 4px; min-height: 246px;}
.hubevent_item .eventInfo{ padding: 20px 16px; display: flex; flex-direction: column; position: relative;}
.hubevent_item .eventInfo h4{ color: var(--ocean-90); font-size: var(--size-24); line-height: 28px; font-weight: 500; margin: 0;}
.hubevent_item .eventInfo p{ color: var(--ocean-subtle); font-size: 14px; line-height: 20px; margin: 8px 0 0; font-weight: 500;}
.eventDate{ position: absolute; top: -16px; left: -16px; background: var(--accentyellow); color: var(--ocean-90); text-align: center; width: 65px; padding: 8px 12px; font-size: 18px; line-height: 20px; font-weight:400; border-radius: 4px 24px; box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10);}
.eventDate strong{ display: block; font-size: 32px; line-height: 34px; font-weight: 400;}
.hubevent_item .eventInfo p{ position: absolute; bottom: 20px; right: 16px; margin: 0; text-align: right;}
.hubevent_item .eventInfo p a{ color: var(--ocean-90); display: flex; align-items: center; gap: 4px; font-size: 16px;font-weight: 600;line-height: 20px;}
.hubevent_item .eventInfo p a:hover{ color: var(--ocean-90); text-decoration: underline; text-underline-offset: 2px;}
.hubevent_item .eventInfo p a img{ width: 16px; display: block;}
.hub_speakers{ background-color:#F6F8DC;}
.partners_slidermain{ display: flex; background: linear-gradient(135deg, #F6F8DC 0%, #FAFAF6 100%); padding: 54px 0 64px; position: relative; overflow: hidden; padding-left: calc(50vw - 666px);}
.partners_slidermain .title{ width: 32%; padding-right: 20px;}
.partners_slidermain .title h3{ font-size: 32px; line-height: 36px; color: var(--ocean-90); margin: 0; padding: 10px 0;}
.partners_slidermain .sliderwrap{ width: 68%;}
.widthmax{ width: 180%;}
.partner_slider{ width: 100%;}
.partner_slider .slick-slide{ padding: 10px 10px 30px;}
.partner_slider .item{ background: var(--ocean-05); border-radius: 4px 32px; box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10); padding: 24px; min-height: 287px;}
.partner_slider h4{ max-width: 77%; font-size: 28px; line-height: 30px; margin: 0 0 8px; min-height: 150px; display: flex; align-items: flex-end;}
.partner_slider p{ font-size: 14px; line-height: 20px; margin: 0; color: var(--cloud-tint-4); font-weight: 500;}
.partner_slider .icon{ display: block; width: 100%; padding-bottom: 12px;}
.partner_slider .icon img{ display: block; width: 66px; margin: 0 0 0 auto;}
.partner_slider .slick-current .item{ background: #fff;}
.partner_slider .slick-dots{margin: 0;}
.partners_slidermain.bg-ocean90{ background: var(--ocean-90);}
.partners_slidermain.bg-ocean90 h3{ color: var(--white);}
.partners_slidermain.bg-ocean90 .slick-dots li button{ background-color: var(--white); opacity: 0.3;}
.partners_slidermain.bg-ocean90 .slick-dots li.slick-active button{ background-color: var(--white); opacity:1;}
.hub_explore{ width: 100%; }
.hub_explore h3{ font-size: 32px; line-height: 36px; color: var(--ocean-90); margin: 0;} 
.hub_explore .icon{ display: block; width: 48px;}
.hub_explore .icon img{ display: block;}
.hub_pagebanner.gradient{ background: linear-gradient(90deg, #2B323E 0%, rgba(14, 35, 73, 0.00) 100%);}
.hub_partner_logos{ width: 100%; display: flex; column-gap: 20px; row-gap: 48px; flex-wrap: wrap;}
.hub_partner_logos .item{ flex: 0 0 calc((100% - 40px) / 3);}
.hub_partner_logos .logowrap{ display: flex; align-items: center; justify-content: center; padding: 16px; background: #fff; border-radius: 4px; border-radius: 4px; box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10); height: 240px;}
.hub_partner_logos .logowrap img{ display: block; max-width: 90%; max-height: 90%; margin: 0 auto;}
.hub_partner_logos h4{ font-size: 28px; line-height: 30px; color: var(--ocean-90); margin: 24px 0 0;}
.hub_partner_logos p{ font-size: 16px; line-height: 20px; margin: 8px 0 0; color: var(--ocean-90);}
.hub_breadcrumb{ position: absolute; top: 24px; left: 0; right: 0; margin: 0 auto; padding: 0 32px; max-width: 1376px;}
.hub_breadcrumb ul, .hub_breadcrumb>span{ display: flex; gap: 0; list-style: none; padding: 0; margin: 0;}
.hub_breadcrumb ul li, .hub_breadcrumb span span{ font-size: 14px; line-height: 16px; color: var(--white); display: flex; }
.hub_breadcrumb ul li a, .hub_breadcrumb span span a{ color: var(--white); text-decoration: none; font-weight: 400; display: flex; align-items: center;}
.hub_breadcrumb ul li::after, .hub_breadcrumb span span a::after{ content: ''; display: inline-block; width: 16px; height: 16px; margin: 0 4px; background-image: url('../images/chevron_forward.png'); background-repeat: no-repeat; background-position: center; background-size: 5px;}
.hub_breadcrumb ul li:last-child::after{ display: none;}
.hub_breadcrumb ul li .current, .hub_breadcrumb span.breadcrumb_last{ font-weight: 500;}
.hub_breadcrumb ul li a:hover{ text-decoration: underline; text-underline-offset: 2px;}

.programsEvents{ background: var(--cloud-tint-1);}
.programsEvents .title h4{ font-size: 18px; line-height: 20px; font-weight: 700; margin: 0 0 64px; color: var(--ocean-90); font-family: var(--font-body);}
.programsEvents .recentEvents{ margin-top: 64px; padding-top: 64px; border-top: 1px solid var(--cloud-tint-3);}
.noupcomingEvent{ max-width: 606px; margin: 0 auto 20px; text-align: center;}
.noupcomingEvent .hubklvform{ width: 376px; margin: 40px auto 0; max-width: 100%;}
.noupcomingEvent h3{ font-size: 40px; line-height: 44px; color: var(--ocean-90); margin: 0;}
.noupcomingEvent p{ color: var(--ocean-90); margin: 12px 0 0;}
.allrecentevents{ display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; width: 100%; row-gap: 32px;}
.allrecentevents .item{ width: calc(50% - 20px); background: #fff; padding: 16px; border-radius: 4px; box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10); display: flex; gap: 40px; position: relative;}
.allrecentevents .item .eventDate{ background: var(--cloud-tint-2); color: var(--ocean-90);}
.allrecentevents .item .eventinfo{ width: 100%; display: flex; flex-direction: column; position: relative;}
.allrecentevents .item .eventinfo h3{ color: var(--ocean-90); font-size: var(--size-28); line-height: 30px; font-weight: 400; margin: 0;}
.allrecentevents .item .eventinfo p{ color: var(--cloud-tint-4); font-size: 14px; line-height: 18px; margin: 8px 0 0; font-weight: 500;}
.allrecentevents .item .poster{ width: 213px; min-width: 213px;}
.allrecentevents .item .poster img{ display: block; width: 100%; height: 200px; object-fit: cover; border-radius: 4px;}
.allrecentevents .item .btnwrap{ margin-top: 20px;}
.upcomingbigEvent{ position: relative; max-width: 1090px; margin: 0 auto 20px; background: #fff; padding: 16px; border-radius: 4px; box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10); display: flex; align-items: center; gap: 40px; position: relative;}
.upcomingbigEvent .poster{ width: 520px; min-width: 520px;}
.upcomingbigEvent .poster img{ display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 4px;}
.upcomingbigEvent .eventinfo{ width: 100%; display: flex; flex-direction: column; position: relative; padding-left: 24px;}
.upcomingbigEvent .btnwrap{ margin-top: 40px;}
.upcomingbigEvent .eventinfo h3{ color: var(--ocean-90); font-size: var(--size-40); line-height: 44px; font-weight: 400; margin: 0;}
.upcomingbigEvent .eventinfo p{ color: var(--ocean-90); margin: 12px 0 0;}
.eventmeta{ width: 100%; display: flex; gap: 20px; margin: 0 0 20px;}
.eventmeta .metatext{ display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; line-height: 16px; color: var(--ocean-90);}
.eventmeta .metatext img{ width: 16px; display: block;}
#event-popup-overlay {display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 9999;}
#event-popup {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; width: 646px; padding: 20px; max-width: 90%; border-radius: 12px; z-index: 9999;}
.event-popup-image img { width: 100%; height: 340px; border-radius: 4px; display: block;  object-fit: cover;}
.event-popup-content { padding: 40px 0 30px;}
.event-popup-content h2{ font-size: 28px; line-height: 30px; margin: 20px 0 0; color: var(--ocean-90);}
.event-description{ color: var(--cloud-tint-4); margin: 8px 0 0; font-size: 14px; line-height: 16px;}
.event-popup-close { position: absolute; border-radius: 99px; box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10); top: -15px; right: -15px; background-color: var(--accentyellow); border: none; font-size: 0px; width: 40px; height: 40px; background-image: url(../images/close-icon.svg); background-repeat: no-repeat; background-position: center; background-size: 14px; cursor: pointer;}
.event-popup-close:hover{ background-color: var(--cloud-tint-3); transition: all 0.3s ease-in-out;}
.hubevent_img.nullimg img{ width: 100%; display: block; border-radius: 4px;}
.allrecentevents.upcomingevents{ padding: 44px 0 20px;}
.allrecentevents.upcomingevents .item .eventDate {background: var(--accentyellow);}
.slick-controls{ width: 52%; display: flex; align-items: center; justify-content: center; gap: 10px;}
.slick-controls .slick-prev-dot, .slick-controls .slick-next-dot{ width: 30px; height: 30px; border-radius: 50%; font-size: 0px; background-color: #fff; transition: all 0.3s ease-in-out; background-image: url(../images/chevron_forward.svg); background-repeat: no-repeat; background-size: 5px; display: block; background-position: center;}
.slick-controls .slick-prev-dot:hover, .slick-controls .slick-next-dot:hover{ background-color: var(--cloud-tint-1); opacity: 0.5; transition: all 0.3s ease-in-out;}
.slick-controls .slick-prev-dot{ background-image: url(../images/chevron_forward2.svg);}
.slick-controls .slick-dots{ margin: 0;}
.customreviewslider .slick-controls{ width: 100%; margin-top: 24px;}
.customreviewslider .slick-controls .slick-prev-dot, .customreviewslider .slick-controls .slick-next-dot{ background-color: var(--ocean-05);}
.page-template-outreach-template .slick-controls .slick-prev-dot, .page-template-outreach-template .slick-controls .slick-next-dot{ background-color: var(--ocean-05);}
.hubspeakerrow{ width: 100%; background: #fff; transition: var(--transition); padding: 40px 0; border-bottom: 2px solid var(--cloud-tint-3);}
.hubspeakerrow .hubcontainer{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.hubspeakerrow:hover{ background: var(--cloud-tint-1); transition: var(--transition);}
.hubspeakerrow:hover .btn { background-color: var(--ocean-60); color: var(--white); transition: var(--transition); border-color: var(--ocean-60);}
.hubspeakerrow:last-child{ border-bottom: 0;}
.speakerThumb{ width: 222px;}
.speakerThumb img{ display: block; width: 100%; height: 277px; object-fit: cover; border-radius: 4px;}
.speakerInfo{ width: calc(100% - 222px); padding-left: 20px; display: flex; justify-content: space-between;}
.speakerText{ max-width: 626px; display: flex; flex-direction: column;}
.speakerText h6{ font-size: 14px; line-height: 16px; color: var(--ocean-90); margin: 0 0 20px; font-weight: 700; font-family: var(--font-body);}
.speakerText h2{ font-size: 56px; line-height: 60px; margin: 0; color: var(--ocean-90);}
.speakerText p{ margin: 20px 0 0; color: var(--cloud-tint-4);}
.spkrTopics{ width: 100%; margin-top: auto; margin-bottom: 0;}
.spkrTopics label{ color: var(--cloud-tint-4); font-size: 14px; line-height: 20px; font-weight: 500; display: block; margin-bottom: 12px;}
.spkrTopics ul{ display: flex; gap: 8px; list-style: none; padding: 0; margin: 0; flex-wrap: wrap;}
.spkrTopics ul li{transition: var(--transition); background: var(--cloud-tint-1); color: var(--cloud-tint-4); padding: 4px 8px; border-radius: 3px; font-size: 14px; line-height: 16px; font-weight: 500;}
.hubspeakerrow:hover .spkrTopics ul li{ background-color: #fff; transition:var(--transition);}
.speakerAction{ display: flex; align-items: flex-end; justify-content: flex-end;}
.hubevent_item.single-image {width: auto;}
.hubevent_item.single-image .img { width: auto;}
.contact_pagebanner{ width: 100%; position: relative; background-repeat: no-repeat; background-size: cover; background-position: center; padding:92px 0 64px;}
.contactMain{ width: 100%; padding: 48px; display: flex; justify-content: space-between; flex-wrap: wrap; row-gap: 64px; border-radius: 8px; background: rgba(255, 255, 255, 0.90); box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10);}
.contactText{ max-width: 450px;}
.contactText h2{ font-size: 56px; line-height: 60px; color: var(--ocean-90); margin: 0;}
.contactText p{ margin: 20px 0 0; color: var(--ocean-90); font-size: 18px; line-height: 20px;}
.contactText img{ display: block; max-width: 48px; margin: 0 0 32px;}
.contactText .text p, .contactText .bottomtext p { font-size: 14px; line-height: 16px; color: var(--ocean-90); font-weight: 500;}
.contactForm{ max-width: 598px;}
.contactForm .form-grid{ width: 100%; display: flex; flex-wrap: wrap; row-gap: 20px;justify-content: space-between;padding: 0 !important;}
.hub_formfield{ width: 100%; display: flex; flex-direction: column; gap: 8px;}
.hub_formfield label{ font-size: 14px; line-height: 16px; color: var(--cloud-tint-4); font-weight: 700; display: block; margin: 0;}
.hub_formfield .inputfield{ width: 100%; height: 56px; background-color: #fff; padding: 16px; border: 1px solid var(--cloud-tint-3); border-radius: 4px; font-size: 14px; line-height: 20px; color: var(--ocean-90); font-family: var(--font-body);}
.hub_formfield textarea.inputfield{ min-height: 136px; resize: none;}
.contactForm .hub_formfield.w50{ width: calc(50% - 10px);}
.contactForm .submitbtn{ justify-content: center;align-items: center;}
.contactForm .submitbtn .btn{ width: 400px;}
.contactForm .disclaimer{ padding: 24px 0 0;}
.contactForm .disclaimer p{ font-size: 14px; line-height: 16px; color: #2A2A28; margin: 0; font-weight: 400;}
.contactForm .disclaimer p a{ color: var(--ocean-90); text-decoration: underline; text-underline-offset: 2px;}
.contactForm .disclaimer p a:hover{ color: var(--accentpink); transition: all 0.3s ease-in-out;}
.contactForm .disclaimer p:nth-child(2){ color: var(--ocean-90);}
.hub_formfield select.inputfield{ background-image: url(../images/chevron-down.svg); background-repeat: no-repeat; background-size: 24px; background-position: calc(100% - 16px) 50%;}
.contactForm .everest-forms{ width: 100%;}
.contactForm .everest-forms .evf-container{ width: 100%; margin: 0;}
.contactForm .evf-frontend-grid{ width: 100%; display: flex; flex-wrap: wrap; row-gap: 20px;justify-content: space-between;padding: 0 !important;}
.contactForm .evf-frontend-grid .evf-field{ width: 100%; display: flex!important; flex-direction: column; gap: 8px; margin: 0!important;}
.contactForm .evf-frontend-grid .evf-field .evf-field-label{ font-size: 14px; line-height: 16px; color: var(--cloud-tint-4); font-weight: 700; display: block; margin: 0;}
.contactForm .evf-frontend-grid .evf-field .input-text{ width: 100%; height: 56px; margin: 0; background-color: #fff; padding: 16px; border: 1px solid var(--cloud-tint-3); border-radius: 4px; font-size: 14px; line-height: 20px; color: var(--ocean-90); font-family: var(--font-body);}
.contactForm .evf-frontend-grid .evf-field textarea.input-text{ min-height: 136px; resize: none;}
.contactForm .evf-frontend-grid #evf-2248258-field_email-container{ width: calc(50% - 10px);}
.contactForm .evf-frontend-grid #evf-2248258-field_S0AfsjpX1N-6-container{ width: calc(50% - 10px);}
.everest-forms label .required, .wp-block-everest-forms-form-selector label .required{ display: none!important;}

.contactForm .evf-frontend-grid .evf-field.w50{width: calc(50% - 10px);}
.everest-forms .evf-field-container .evf-frontend-row .evf-frontend-grid .evf-field.everest-forms-validated input.input-text{ border-color: var(--ocean-90)!important;}


.contactForm .evf-frontend-grid .evf-field select.input-text{ appearance: none; background-image: url(../images/chevron-down.svg); background-repeat: no-repeat; background-size: 24px; background-position: calc(100% - 16px) 50%;}

.contactForm .evf-frontend-grid .evf-field .input-text:focus, .hub_formfield .inputfield:focus{ border-color: var(--ocean-90);}
.contactForm .evf-submit-container{ width: 100%; display: flex; justify-content: center; margin: 20px 0 0!important; padding: 0!important;}
.contactForm .evf-submit-container .button{ width: 400px; border: 0!important; height: 52px!important; color: var(--ocean-90)!important; background: var(--ocean-10)!important; font-weight: 600!important; font-size: 16px!important; border-radius: 40px!important; transition: all 0.3s ease-in-out;}
.contactForm .evf-submit-container .button:hover{ background: var(--ocean-30)!important; color: var(--ocean-90)!important; transition: all 0.3s ease-in-out;}
.disclaimer.ocn90 p{ color: var(--ocean-90);}
.contactForm .toptext h4{ font-size: 20px; line-height: 24px; color: var(--ocean-90); margin: 0;}
.contactForm .toptext p{ font-size: 14px; line-height: 16px; color: var(--cloud-tint-4); margin: 8px 0 0;}
.checkboxlist label, .contactForm .evf-frontend-grid .checkboxlist .evf-field-label{ color: var(--ocean-90);}
.checkboxlist ul{ display: flex; flex-direction: column; gap: 12px; padding: 4px 0 0 !important;}
.checkboxlist ul li{ position: relative;}
.checkboxlist ul li input{ position: absolute; opacity: 0;}
.checkboxlist ul li label{ position: relative; cursor: pointer; font-weight: 500; font-size: 14px; line-height: 24px;  display: flex; gap: 4px; align-items: center;}

.checkboxlist ul li label::before{ content: ''; display: inline-block; width: 24px; height: 24px; background: url(../images/checkbox-icon.svg) no-repeat; background-size: 100%; }
.checkboxlist ul li input:checked + label::before{ background-image: url(../images/checkbox-icon2.svg);}

.rightspage .contactText {max-width: 554px;}
.rightspage .bottomtext p { font-size: 14px; line-height: 16px; color: var(--ocean-90); font-weight: 500;}
.speaker_popup #event-popup{ width: 868px; background: #fff; top: 20px; right: 20px; left: auto; transform: none; padding: 0;}









.speaker_popup .popup_warrper{ display: flex; width: 100%; max-height: calc(100vh - 40px); overflow-y: auto; padding: 20px;}

.speaker_popup .event-popup-image{ width: 222px;}
.speaker_popup .event-popup-image .btn{ width: 100%; margin-top: 24px;}
.speaker_popup .event-popup-image img{ width: 100%; height: initial; display: block; border-radius: 4px;}
.speaker_popup .event-popup-content{ width: calc(100% - 222px); padding-left: 24px; padding-right: 84px; padding-top: 0; padding-bottom: 0;}
.speaker_popup .event-popup-content h2{ font-size: 40px; line-height: 44px; margin: 0 0 20px;}
.speaker_popup .event-description{ margin: 4px 0 0; padding-bottom: 48px;}
.speaker_popup .event-popup-close{ top: 24px; right: 24px;}
.speaker_popup .spkrTopics ul li {background-color: var(--cloud-tint-1)!important;}
.speaker_popup .speakerText{ max-width: 100%!important;}

.speaker_popup .btn{background-color: var(--ocean-10)!important;  border-color: var(--ocean-10)!important;  color: var(--ocean-90)!important;}
.speaker_popup .btn:hover{background-color: var(--ocean-60)!important;  border-color: var(--ocean-60)!important;  color: var(--white)!important;}

.speaker_popup .popup_warrper{-ms-overflow-style: none; scrollbar-width: none; }
.speaker_popup .popup_warrper::-webkit-scrollbar { display: none;}

.speaker_popup #event-popup::after{ content: ""; position: absolute; border-radius: 0 0 20px 20px; bottom: 0px; left: 0; width: 100%; height: 70px; display: block; pointer-events: none; background: linear-gradient(to bottom, rgba(255,255,255,0), #ffffff);}






/* Contact Main */
.hubklvform input{ height: 56px!important; font-family: var(--font-body)!important; font-size: 16px!important; padding-left: 24px!important; }
.hubklvform button{height: 56px!important; font-weight: 600!important; font-size: 20px!important; font-family: var(--font-body)!important;}
.hubklvform button:hover {background-color: var(--ocean-90)!important;}
.hubklvform form.needsclick>.needsclick{ min-height: initial!important;}
.hub_contactmain .flex{ justify-content: space-between; gap: 24px; flex-wrap: wrap;}
.hub_contactmain .item{ width: calc(50% - 12px); background: #fff; border-radius: 4px; box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10); padding: 24px;}
.hub_contactmain .icon{ width: 100%; display: block;}
.hub_contactmain .icon img{ display: block; width: 32px;}
.hub_contactmain h3{ font-size: 24px; color: var(--ocean-90); line-height: 28px; font-weight: 600; margin: 24px 0 0;}
.hub_contactmain p{ color: var(--ocean-90); font-size: 19px; line-height: 24px; margin: 8px 0 0;}
.hub_contactmain p a{color: var(--ocean-90); text-decoration: underline; text-underline-offset: 2px; }
.hub_contactmain p a:hover{ color: var(--ocean-60);}
.hub_contactmain .item ul{ width: 100%;margin: 24px 0 0; display: flex; justify-content: space-between; flex-wrap: wrap; row-gap: 20px; }
.hub_contactmain .item ul li{ width: 48%; color: var(--ocean-60); font-size: 16px; line-height: 20px;}
.hub_contactmain .item h5{ font-size: 20px; line-height: 24px; color: var(--ocean-90); margin: 0 0 4px;}
.hub_contactmain .item ul li a{ color: var(--ocean-60);}
.hub_contactmain .item ul li a:hover{ text-decoration: underline; text-underline-offset: 2px;}
.hub_contactmain .item ul li p{color: var(--ocean-60); font-size: 16px; line-height: 20px; margin: 0;}
.hub_contactmain .item ul li p a{ color: var(--ocean-60); text-decoration: none;}
.hub_contactmain .item:nth-child(3) p a{ text-decoration: none;}
.hub_contactmain .item ul li p a:hover, .hub_contactmain .item:nth-child(3) p a:hover{ text-decoration: underline;}
.hubherocontent p a{color: var(--white); text-decoration: underline; text-underline-offset: 2px;}
.hubherocontent p a:hover{ text-decoration: none;}
.page-template-contact-us-main .hubfooter .hubsignup{ background: var(--ocean-90); margin-bottom: 40px;}
.page-template-contact-us-main .hubfooter .hubsignup h3{ color: #fff;}
.page-template-contact-us-main .hubfooter .hubsignup button{background-color: var(--ocean-60)!important;}
.page-template-contact-us-main .hubfooter .hubsignup button:hover {background-color: var(--ocean-10)!important; color: var(--ocean-90)!important;}



.errorbanner .hubherocontent{ width: 100%; max-width: 100%;}
.errorbanner h3{ font-size: 24px; line-height: 28px; font-weight: 500; margin: 0 0 20px;}
.errorbtns, .errorsearch{ width: 100%; margin: 48px 0 0;}
.errorbtns ul{ width: 100%; display: flex; gap: 24px; flex-wrap: wrap;}
.errorbtns .btn:hover{ background: var(--ocean-30); border-color: var(--ocean-30); color: var(--ocean-90);}

.hub_pagebanner.errorbanner{ padding-bottom: 215px; min-height: 800px;}


.errorsearch .hubsearch input{ height: 56px; background-color: #fff; border: 1px solid var(--cloud-tint-3); color: var(--cloud-tint-4);}
.errorsearch .hubsearch button{ width: 32px; height: 32px; background-color: var(--cloud-tint-3); border-radius: 50%; background-image: url(../images/search-icon-dark.svg);}
.errorsearch .hubsearch{ width: 400px;}

.errorsearch .hubsearch input::-webkit-input-placeholder { color: var(--cloud-tint-3); }
.errorsearch .hubsearch input::-moz-placeholder { color: var(--cloud-tint-3);}
.errorsearch .hubsearch input:focus::-webkit-input-placeholder { color: var(--ocean-90); }
.errorsearch .hubsearch input:focus::-moz-placeholder { color: var(--ocean-90);}

.hubsearch .custom-search-form:focus-within .search-submit{ background-color: var(--ocean-60); background-image: url(../images/arrow-right2.svg);}


/* Page Default */

.hubbasic{max-width: 646px;  margin: 0 auto;  font-size: 16px; line-height: 20px; color: var(--ocean-90); padding: 44px 0 64px;}
.hubbasic a{ color: var(--ocean-60);}
.hubbasic a:hover{ text-decoration: underline; text-underline-offset: 2px; color: var(--ocean-90);}
.hubbasic h2{ margin: 0 0 24px; font-size: 32px; line-height: 34px; font-weight: 400; color: var(--ocean-90);}
.hubbasic h3{ margin: 0 0 24px; font-size: 28px; line-height: 30px; font-weight: 400; color: var(--ocean-90);}
.hubbasic h4{ margin: 0; padding: 32px 0 0; font-size: 24px; line-height: 28px; font-weight: 500; color: var(--ocean-90);}

.hubbasic h5{ margin: 0 0 16px; font-size: 20px; line-height: 24px; font-weight: 500; color: var(--ocean-90);}
.hubbasic h6{ margin: 0 0 16px; font-size: 18px; line-height: 22px; font-weight: 500; color: var(--ocean-90);}
.hubbasic p{ margin: 20px 0 0;}


.hubbasic ul{ margin: 20px 0 0; padding-left: 20px;}
.hubbasic ul li{ margin: 2px 0; list-style: disc; list-style-position: outside;}
.hubbasic ol{ margin: 20px 0 0; padding-left: 20px;}
.hubbasic ol li{ margin: 2px 0; list-style: decimal; list-style-position: outside;}
.hubbasic i{ font-weight: normal; font-style: italic;}
.hubbasic ul ul, .hubbasic ul ol, .hubbasic ol ul, .hubbasic ol ol{ margin: 0;}
.hubbasic table{ width: 100%; border-collapse: collapse; margin: 24px 0; border-radius: 4px; border: 1px solid var(--cloud-tint-3); background: var(--cloud-tint-1);}
.hubbasic table th{ width: 33.33%; padding: 10px 12px; text-align: left; color: var(--ocean-90); font-size: 14px; line-height: 16px; font-weight: 700; border-right: 1px solid var(--cloud-tint-3);}
.hubbasic table td{ padding: 10px 12px; text-align: left; color: var(--cloud-tint-4); font-size: 14px; line-height: 16px; font-weight: 500; border-top: 1px solid var(--cloud-tint-3); border-right: 1px solid var(--cloud-tint-3);}

.hubbasic table th:last-child, .hubbasic table td:last-child{ border-right: 0;}



.hubbasic strong{ font-weight: 700;}
.hubbasic u{ text-decoration: underline;}
.hubbasic .toc{border-radius: 4px;box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.10); background: var(--cloud-tint-1); padding: 24px; margin: 32px 0 0;}
.hubbasic .toc ol{ margin: 0; color: var(--ocean-60); font-family: var(--font-heading); font-weight: 400; font-size: 20px; line-height: 24px;}





.everest-forms-notice.everest-forms-notice--success.everest-forms-submission-scroll {flex-direction: column; justify-content: center; background-color: #F3F3F0BF; color: var(--ocean-90); text-align: center; height: 552px; align-items: center; display: flex; gap: 20px; font-size: 28px; line-height: 30px; font-family: var(--font-heading); font-weight: 400; padding: 20px 40px; border-radius: 4px;}

.tooltip-trigger { position: relative; color: #000; text-decoration: underline; cursor: pointer;}
.tooltip-bubble { position: absolute; bottom: 140%; right: 0%; background: #2A2A28; color: #fff; padding: 8px 12px; border-radius: 6px; font-size: 14px; line-height: 18px; width: 250px; text-align: center; opacity: 0; visibility: hidden; transition: opacity 0.2s ease, transform 0.2s ease; z-index: 999;}
.tooltip-bubble::after {content: ""; position: absolute; top: 100%; right: 15px; border-width: 8px; border-style: solid; border-color: #2A2A28 transparent transparent transparent;}
.tooltip-trigger:hover .tooltip-bubble {opacity: 1; visibility: visible; transform:translateY(-4px);}
.tooltip-bubble br{ display: none;}


.everest-forms .everest-forms-notice--success::before{ content: ''!important; position: static!important; width: 40px; height: 40px; font-size: 0px!important; background: url(../images/tick-icon.svg) no-repeat; background-size: 100%;}
.everest-forms .everest-forms-notice--success::after{display: none!important;}


.shop-layout {display: flex;}
.shop-sidebar {width: 20%;}
.shop-content {width: 80%; padding-left: 20px;}






/* Shop Pages */
body.page-template-christian-bookstore-template, body.single-product, body.woocommerce, body.woocommerce-cart, body.woocommerce-cart, body.woocommerce-page{ background: #fff!important; padding: 0;}
body.woocommerce-cart .hub_pagedflt{ display: flex; position: relative; width: 100%;}
body.woocommerce-cart .hubherocontent{ color: var(--ocean-90);}









/* Responsive: Tablet and Mobile adjustments */
@media (max-width: 1320px) {
.imgtextsection .hubimg {width: 54%;}
.imgtextsection .hubimgtext {width: 40%;}
.hubimgcard_wrap {width: 75%;}
.hubimgcard_title {width: 24%;}
.hubimgcard_img, .hubimgcard_box {width: calc(50% - 8px);}
.hubftmenus {width: calc(80% - 16px);}
.hubft_logo {width: calc(20% - 16px);}
.hubftmenucol {width: calc(33.33% - 16px);}
.shopslidermain {padding-left: 22px;}
.shopslidermain h2{padding-left: 10px;}
.shopslider .slick-arrow {right: 120px;}
.shopslider .slick-arrow.slick-prev {right: 168px;}
.abidefeature {padding-bottom: 88px;}
.hubheadermain .hublogo {width: 140px;}
.hubaction {width: 345px;}
.hubnav {width: calc(100% - 485px); justify-content: initial;padding-left: 20px;}
.partners_slidermain{ padding-left: 32px;}

.rightspage .contactText, .contactText {max-width: 48%;}
.contactForm {max-width: 48%;}


}


@media (max-width: 1199px) {
.menuFeaturedImage {width: 480px;}
.outreachMenuLeft {width: 232px;}
.hublogo img{ max-height: 24px;}
.hubcontainer{ padding: 0 24px;}
.shopslidermain {padding-left: 14px;}
.hubevents_content{ padding-right: 20px;}
.allrecentevents .item{ width: calc(50% - 16px);}
.upcomingbigEvent .eventinfo h3{ font-size: 32px; line-height: 36px;}
.upcomingbigEvent .poster {width: 50%;min-width: 50%;}
.contactMain{ padding: 48px 16px;}
.contactText h2 {font-size: 40px; line-height: 44px;}
.contactText { max-width: 45%;}
.contactForm { max-width: 50%;}


}


@media (max-width: 1040px) {
.hubftmenus {width: 100%;}
.hubft_logo {width: 100%; padding-bottom: 16px;}
.hubft_logo p {margin: 20px 0;}
.imgtextsection .hubimgtext {width: 48%;}
.imgtextsection .hubimg {width: 48%;}
.speakerText {max-width: 75%;}
.allrecentevents .item {width: 100%;align-items: center;}
.hub_contactmain .item {padding: 16px;}

}

@media (max-width: 979px) {
body{ padding-top: 95px;}
.hubftmenucol {width: 100%;}
.hubsociallinks ul {justify-content: center;}
.hubcopytext {text-align: center;}
.hubsignup h3 {font-size: 32px;line-height: 36px;}
.py104 {padding: var(--size-96) 0;}
h2, .large {font-size: var(--size-40); line-height: calc(var(--size-40) + 4px);}
h4, .small {font-size: var(--size-28); line-height: calc(var(--size-24) + 6px);}
.hubgifts .icon img {width: var(--size-44);}
.hubimgcardsection .flex{ flex-wrap: wrap; flex-direction: column; gap: 38px;}
.hubimgcard_title{ width: 100%; display: flex; align-items: center; justify-content: space-between;}
.hubimgcard_title h2{ margin: 0;}
.hubimgcard_wrap{ width: 100%;}
.hubimgcard_box h3 {font-size: var(--size-20); line-height: var(--size-24);}
.py64 {padding: var(--size-48) 0;}
.pb64 {padding-bottom: var(--size-48);}
.pt64 { padding-top: var(--size-48);}
.imgtextsection{padding: var(--size-48) 0;}
.abidefeature_section{padding-top: var(--size-48);}
.imgtextsection .hubimgtext {width: 100%; padding-top: 48px; order: 2;}
.imgtextsection .hubimg {width: 100%; order: 1;}
.imgtextsection .hubcontainer{ flex-wrap: wrap;}
.abidefeature_section .hubcontainer{ flex-wrap: wrap;}
.abidefeature{ order: 2; width: 100%;}
.abidefeature_section .abideimage{ width: 100%; padding: 0 0 40px;}
.abidefeature_section .abideimage img{ max-width: 500px; margin: 0 auto;}
.today_playbtn {left: 0;right: 0;margin: 0 auto;width: 234px;}
.ggr-audio-card{ flex-wrap: wrap; justify-content: center;}
.ggr-audio-player {flex: initial; width: 100%; border-radius: 4px; box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.25); margin: 12px 0 0;}
.storytitle h2 {font-size: 40px; line-height: 44px;}
.hubstoriesleft {width: 100%;}
.hubstoriesright {width: 100%; gap: 20px; flex-direction: initial;}
.hubstoriesright .hubstoryhalf, .hubquoteoftheday {width: calc(50% - 10px);}
.hubstoriesright .hubstoryhalf:nth-child(3){ display: none;}
.hubstoryfull .hubstoryposter{ height: 480px;}
.hubstoryhalf .hubstoryposter, .hubstoriesright .hubstoryhalf .hubstoryposter {height: 342px;}
.hubquoteoftheday{height: 342px; display: flex; flex-direction: column; justify-content: flex-end; justify-content: end;}
.hubquoteoftheday .quoteicon{margin-top: 0; margin-bottom: auto;}
.hubheadermain{ padding: 18px 0;}
.hubnav{ display: none; width: 100%;}
.hubaction{ display: none; width: 100%;}
.hubheadermain .hublogo{ width: 100%; text-align: center; display: flex; align-items: center; justify-content: center;}
.hublogo img{ display: block; margin: 0 auto;}
.hubheadermain .hubcontainer{ position: relative; flex-wrap: wrap;}
.menutoggle{ display: block; position: absolute; z-index: 11; top: -6px; right: 20px; cursor: pointer; width: 40px; height: 40px; background: url('../images/hamburger-icon.svg') no-repeat; background-size: 100%; }
.menutoggle.active{ background-image: url('../images/hamburger-icon-close.svg');}
.navopen .hubnav{ display: block; padding: 30px 0 24px;}
.hubnav ul{ flex-direction: column; gap: 0;}
.hubnav ul li{ padding: 8px 0;}
.hubnav ul li a{ font-size: 18px; line-height: 20px; font-weight: 400; padding: 0;}
.navopen .hubaction{ display: flex; align-items: center; justify-content: center; gap: 24px; flex-direction: column; padding: 0 0 6px; }
.hubaction .hubsearch{ width: 100%; max-width: 400px;}
.hubaction .hubdonate{ width: 100%; max-width: 400px;}
.hubaction .hubdonate .btn {position: relative;	width: 100%; display: flex; gap: 12px; align-items: center; line-height: 16px;}

.hubdonate .btn::after{ position: static; display: inline-block; }
.hubsearch input{ text-align: center; padding: 0 40px;}
.navopen .hubheader{border-radius: 0 0 12px 12px;box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.15);}
.navopen .hubherosection{ margin-top: -15px;}
.outreachWrap{ flex-direction: column;}
.outreachMenuLeft{ width: 100%;}
.menuFeaturedPost{ width: 100%; flex-direction: column; padding: 20px 0 0; border-top: 1px solid var(--ocean-30); margin-top: 20px;}
.menuFeaturedText{ width: 100%; }
.menuFeaturedImage{ width: 100%;}
.outreachMenuLeft h5{ margin: 0 0 15px; display: none;}
.returnMenu{ display: flex; justify-content: flex-start; margin: 0 0 30px;}
.returnMenu a{ display: flex; align-items: center; gap: 8px; font-size: 16px; line-height: 20px; font-weight: 500; color: var(--ocean-30);}
.returnMenu a svg{ width: 16px; display: block;}
.outreachmenu{top: 57px; z-index: 1;}
.outreachMenuLeft ul li{ padding: 8px 0;}
.outreachMenuLeft ul li a{font-size: 18px;line-height: 20px;font-weight: 400;padding: 0;}
.outreachMenuLeft ul{ gap: 0;}

.gplogoicon{ transform: translateY(-100px); display: block;}
.gplogoicon.is-visible { transform: translateY(0);}
.hubheader.is-hidden { transform: translateY(-112%)!important; transition: transform 0.35s ease;}
.hub_connecting .flex-between{ flex-wrap: wrap; row-gap: 48px;}
.hubconnecting_content, .hubconnecting_stats {max-width: 100%;width: 100%;}
.partners_slidermain{ padding: 48px 0; padding-left: 24px;}
.hub_partner_logos .item {flex: 0 0 calc((100% - 20px) / 2);}
.hub_explore .flex-center{ flex-wrap: wrap; flex-direction: column; justify-content: center;}
.speakerText h2 {font-size: 40px;line-height: 44px;}
.hubspeakerrow{ padding: 48px 0;}
.spkrTopics {margin-top: 34px;}
.contactText, .contactForm  { max-width: 100%; width: 100%;}
.widthmax {width: 100%;}
.partners_slidermain .slick-controls {width: 100%;}
.speaker_popup #event-popup {width: calc(100% - 48px);left: 24px;right: auto;max-width: 100%;}
.speaker_popup .event-popup-content {padding-right: 44px;}

.hub_contactmain .item {width: 100%;}
.rightspage .contactText, .contactText {max-width: 100%; width: 100%;}
.contactForm {max-width: 100%; width: 100%; }

.partners_slidermain{ flex-wrap: wrap;}
.partners_slidermain .title{ width: 100%; padding: 0 10px 22px; text-align: left;}
.partners_slidermain .title h3{ padding: 0;}
.partners_slidermain .sliderwrap{ width: 100%;}
.widthmax{ width: 100%;}
.partner_slider h4 {max-width: 90%;}
.partners_slidermain{ padding: 48px 14px;}

.shop-layout {flex-direction: column; gap: 30px;}
.shop-sidebar, .shop-content {width: 100%; padding: 0;}







}


@media (max-width: 767px) {
.flex-center{ flex-wrap: wrap;}
.hubklvform {width: 100%;}
.hubsignup{ text-align: center;}
h4, .small {font-size: var(--size-24); line-height: calc(var(--size-24) + 4px);}
.hubimgcard_wrap{ flex-wrap: wrap;}
.hubimgcard_img, .hubimgcard_box{ width: 100%;}
.hubimgcard_box{ padding: 80px 15px 20px;}
.flex{ flex-wrap: wrap;}
.imgtextsection .hubimgtext h2 {font-size: var(--size-32); line-height: var(--size-36);}
.hubherocontent h1, h1, .x-large {font-size: var(--size-32); line-height: var(--size-36);}
h3, .medium{font-size: var(--size-32); line-height: var(--size-36);}
h2, .large{font-size: var(--size-32); line-height: var(--size-36);}
.shopslidermain h2{ max-width: 260px;}
.everypurchase h4{ font-size: 16px; line-height: 20px; letter-spacing: initial;}
.hubreviewbox .icon {margin-bottom: 50px;}
.customreviewslider .hubreviewbox {height: 202px;}
.today_playbtn {width: calc(100% - 40px);}
.abidereview {width: 100%;}
.storytitle h2 {font-size: 32px; line-height: 36px; max-width: 170px; margin: 0 auto;}
.storytitle {gap: var(--size-24);}
.hubstoryfull .hubstoryposter {height: 230px;}
.hubstoriesright .hubstoryhalf, .hubquoteoftheday {width: 100%;}
.hubstoryhalf .hubstoryposter, .hubstoriesright .hubstoryhalf .hubstoryposter {height: 230px;}
.hubstoriesleft{ row-gap: 24px; }
.hubstoryhalf{ width: 100%;}
.hubquoteoftheday{ height: initial;}
.hubquoteoftheday .quoteicon{ margin-bottom: 24px;}
.hubstoriesright .hubstoryhalf:nth-child(3){ display: block;}
.promoribbon p{ line-height: 20px; font-weight: 600;}
body{ padding-top: 98px;}
.hubheader.is-fixed {transform: translateY(-36px);}
.shopcardimg .textbox h4, .shopcardimg .white_textbox h4{ font-size: 28px; line-height: 32px;}
.hub_pagebanner{ min-height: 650px;}
.partner_slider h4 {font-size: 20px;line-height: 24px;}


.hub_events .hubcontainer{ flex-wrap: wrap;}
.hubevents_content{ width: 100%; max-width: 100%; padding: 0 0 64px;}
.hubevents_row{ width: 100%; max-width: 100%; flex-wrap: wrap;row-gap: 24px;}
.hubevents_row .hubevent_item{ width: 100%;}
.hubevents_content h2, .hubconnecting_content h2 {font-size: 32px;line-height: 36px;}

.hubconnecting_stats{ flex-wrap: wrap;}
.hubconnecting_stat{ width: 100%; min-height: 110px; }


.partner_slider .icon{ padding-bottom: 40px;}

.hub_partner_logos .item {flex: 1 1 100%;}
.hub_partner_logos .logowrap{ height: initial; min-height: 184px;}
.hub_partner_logos{ flex-direction: column; row-gap: 40px;}


.hub_breadcrumb ul li{ display: none;}
.hub_breadcrumb ul li:nth-child(1){ display: flex; gap: 4px; font-weight: 500;}
.hub_breadcrumb ul li::after{ display: none;}
.hub_breadcrumb ul li a{ display: flex; gap: 4px; align-items: center; font-weight: 500;}
.hub_breadcrumb ul li a::before{ content: ''; display: inline-block; width: 16px; height: 16px; margin: 0 4px; background-image: url('../images/arrow-left-white.png'); background-repeat: no-repeat; background-position: center; background-size: 16px;}
.hub_breadcrumb{ padding: 0 24px;}
.hub_explore h3 {text-align: center;}
.allrecentevents .item{ width: 100%;flex-direction: column; gap: 24px; }
.allrecentevents .item .poster {width: 100%;min-width: 100%;}
.upcomingbigEvent{ flex-direction: column;}
.upcomingbigEvent .eventinfo {padding: 50px 0 0;}
.upcomingbigEvent .poster{ width: 100%; min-width: 100%;}
.slick-controls{ width: 100%;}
.event-popup-content {padding: 24px 0 0;}
.event-popup-image img{ height: 100%;}
#event-popup {padding: 16px;border-radius: 8px;}
.eventmeta {gap: 12px;flex-wrap: wrap;}
.hubherosection .hubherocontent{ padding-top: 64px;}
.speakerInfo {width: 100%;padding: 32px 0 0; flex-wrap: wrap;}
.speakerText{ width: 100%; max-width: 100%;}
.spkrTopics{ margin: 32px 0;}
.speakerAction{ width: 100%;}
.contactForm .submitbtn .btn { width: 100%;}

.speaker_popup .speakerAction{ position: absolute; bottom: 16px; left: 16px; width: calc(100% - 32px); z-index: 11;}
.speaker_popup #event-popup::after {height: 120px;}
.speaker_popup .event-description {padding-bottom: 80px;}
.hub_partnerlogos .item img{ max-width: 250px;}
.hub_partnerlogos{ flex-direction: column;}




.speaker_popup .popup_warrper{ flex-wrap: wrap;}
.speaker_popup .event-popup-image{ width: 120px;}
.speaker_popup .event-popup-content {width: 100%;padding: 20px 0 0;}
.speaker_popup .event-popup-content h2 {font-size: 32px;line-height: 36px;margin: 0 0 12px;}
.speaker_popup .spkrTopics{ margin: 0;}
.contactForm .evf-frontend-grid #evf-2248258-field_email-container{ width: 100%;}
.contactForm .evf-frontend-grid #evf-2248258-field_S0AfsjpX1N-6-container{ width: 100%;}
.contactForm .hub_formfield.w50 {width: 100%;}
.hubsociallinks{ padding-top: 20px;}
.hub_pagebanner.bannersmall{ min-height: 488px;}
.hub_contactmain .item ul li {width: 100%;}
.errorsearch .hubsearch{ width: 100%;}

.hub_pagebanner.errorbanner {padding-bottom: 48px;min-height: 952px;}
.errorbtns, .errorsearch {text-align: center;}
.errorbtns ul {justify-content: center;}
.errorsearch input{ text-align: left;}
.hubbasic{ padding: 20px 0 40px;}
.hubbasic table th, .hubbasic table td{ font-size: 13px;line-height: 15px;padding: 10px 10px;}
.contactForm .evf-frontend-grid .evf-field.w50{width:100%;}
.page-template-programs-template .hub_pagebanner.bannersmall, .page-template-privacy-template .hub_pagebanner.bannersmall {min-height: 400px;}

.payment-links a {overflow-wrap: anywhere; word-break: break-word; display: inline-block; max-width: 100%;}












}



@media (max-width: 580px) {
.hubft_logo .btn{ width: 100%; text-align: center; display: block;}
.shopsliderwrapper {width: calc(100% + 200px);}
.shopslider .slick-arrow {right: 220px;}
.shopslider .slick-arrow.slick-prev {right: 268px;}

}

@media (max-width: 480px) {
.ggr-audio-cover{ width: 124px;}
.ggr-audio-info {padding-right: 0;width: calc(100% - 124px);}
.ggr-audio-title {min-width: initial;font-size: 18px;line-height: 22px;}

.promoribbon{ display: flex; align-items: center; justify-content: center; min-height: 56px;}
body{ padding-top: 116px;}
.hubheader.is-fixed {transform: translateY(-56px);}

}