@import url('//fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Crimson+Text:ital,wght@0,400;0,600;1,400;1,600&family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap');

/************ TEMPLATE  ************

burgandy: #4a2220  rgba(74, 34, 32, 1)
cream: #fedba1  rgba(254, 219, 161, 1)  
green:

************/

.site-1 {
    --primary-color: #4a2220;
    --secondary-color: #fedba1;

    --primary-rgb: 74,34,32;
    --secondary-rgb: 254,219,161;

    --default-white: #ffffff;
    --default-black: #000000;

    --title-font-family: 'Cinzel', serif;
    --body-font-family: 'Crimson Text', serif;
	--third-font-family: 'Montserrat', sans-serif;

    --heading-color: var(--primary-color);
    --heading-font-family: var(--title-font-family);

    --title-border-bottom: 1px solid var(--secondary-color);
    --home-title-font: var(--title-font-family);

    --transparent: rgba(255,255,255,0);

    --default-box-shadow: 0px 0px 10px rgba(0,0,0,.5);
    --swiper-box-shadow: var(--default-box-shadow);

    --ql-title-color: var(--default-white);
	--ql-font-family: var(--third-font-family);
	--ql-height: 24vw;
	--ql-text-transform: var(--text-transform-upper);
	
	--hero-img-height: 48vw;
	--hero-opacity: 1;
	--hero-text-font-size-desktop: 1.75vw;
	--hero-img-height-mobile: 48vw;
	--hero-title-font-family: var(--body-font-family);
	
}

body { color: #333; font-size: 1.2rem;  }
h1, h2, h3, h4, h5, h6 { margin: .75rem 0; line-height: 1; font-weight: normal;}
p { line-height: 1.3; font-size: 1.2rem; }
strong { font-weight: 600;}
a {color: #CE9F56;}


p.montserrat {
    font-family:  var(--third-font-family);
    font-size: 1.15rem;
}
span.dropcap {font-size: 2.5rem; /*font-style: italic;*/ line-height: 1; }
span.cinzel {font-family: var(--title-font-family); font-size: 2.5rem}
span.montserrat {font-family: var(--third-font-family);}

ul.montserrat, ol.montserrat {
    line-height: 1.3;
    font-family: var(--third-font-family);
    font-size: 1.15rem;
    margin: 1rem 0 1rem 1.5rem !important;
    width: 95%;
}

h1 {font-size: 4rem; font-family:  var(--body-font-family);}
h1.decorative {
    display: grid;
    grid-template-columns: auto minmax(10px, 1fr);
    align-items: center;
    font-size: 7vw;
    grid-gap: 40px;
    width: 100%;
    border-bottom: none;
    text-align: center;
}
h1.decorative:after {
    content: '';
    border-top: 1px solid var(--primary-color);
}

h2 {font-size: 4vw;}
h2.decorative {
	display: grid;
    grid-template-columns: minmax(20px, 1fr) auto minmax(20px, 1fr);
    align-items: center;
	grid-gap: 50px;
	width: 100%;
    border-bottom: none;
	text-align: center;
}
h2.decorative:before {
	content: '';
    border-top: 1px solid var(--primary-color);
}
h2.decorative:after {
	content: '';
    border-top: 1px solid var(--primary-color);
}


h2.ma {font-size: 9vw; }
h2.pagetitle {font-size: 7vw; }
h6.pagetitle { 
	line-height: 0.8;
    margin-top: -0.5rem;
    color: #fedba1 ;
    font-size: 2.5rem;
    z-index: -3;
	font-style: italic;
}
@media only screen and (max-width: 51rem) {
	h6.pagetitle {font-size: 1.5rem;}
    h1.decorative {font-size: 8vw;}
}

/*h3 {font-family: var(--third-font-family); }*/

h4.decorative {
    display: grid;
    grid-template-columns: auto minmax(10px, 1fr);
    align-items: center;
    grid-gap: 30px;
    width: 100%;
    border-bottom: none;
    text-align: center;
}
h4.decorative:after {
    content: '';
    border-top: 1px solid var(--primary-color);
}

h3 {color: var(--primary-color); background: none; font-weight: 500;  font-size: 2rem;	 margin-bottom: 0.5rem; padding: 0.5rem 0; border-bottom: 0px solid white;}
h5 {color: var(--primary-color); background: none; font-weight: 500;  font-size: 2rem;	 margin-bottom: 0.5rem; padding: 0.5rem 0; }
h6 {font-family:  var(--body-font-family); color: var(--primary-color); font-size: 1.25rem; margin-bottom: 0.25rem; }

hr.short { padding: 0; margin: 0 auto; width: 400px;}
hr {border-bottom: 1px solid var(--primary-color);}


/*span.subtitle-news { text-align: center; font-style: normal; font-size: 2.5rem; }
span.subtitle2 { font-size: 3.5rem; line-height: 1.1; }
span.subtitle22 { text-align: center; font-style: normal; font-size: 2.2rem; }
span.subtitle32 { font-size: 3.2rem; line-height: 1.1; }
span.regular-cabin {line-height: 1.2;
    font-family: 'Lato', sans-serif;
    /*font-variant: small-caps;
	font-weight: 600;
    position: relative;
    font-size: 1.45rem;}
*/
	
blockquote {
    color: var(--primary-color);
    padding: 0 0 0 15px;
    margin: 0 0 20px;
    border-left: 0px solid #d5d5d5;
    font: italic 16px/22px Crimson Text, Serif;
    line-height: 1.2;
    font-size: 1.5rem;
	text-align: center;
}

@media only screen and (max-width: 50.99rem) {
    h1 {font-size: 8vw;}
	h2 {font-size: 9.5vw;}
	h4 {font-size: 5vw;}
    hr.short {
        width: 80%;
    }
}

.readon, .button:not(.site-home #g-showcase .button, .ph-sidepics-3 .button, #g-footer .button, .ql-inner-box .button ), .btn, p.readmore .btn, .sprocket-lists-portrait-container > li .sprocket-lists-portrait-item > a span, .listentobutton.moduletable a {
    color: var(--primary-color); 
	font-size: 1rem;
	text-transform: none;
	background: transparent; 
	padding: .7rem 1.3rem; 
	border-radius: 0; 
	margin: 0;
	display: inline-block;
	font-weight: 500;
	line-height: 1.125rem;
	border: 2px solid var(--primary-color);
	transition: all .2s ease-in;
    font-family: var(--third-font-family);
}


/************ BUTTONS  ************/

a.creambutton { 
  color: var(--primary-color); 
  font-size: 1rem;
  text-transform: none;
  font-weight: normal;
  background: var(--secondary-color); 
  padding: .7rem 1.3rem; 
  border-radius: 0; 
  margin: 0.25rem;
  display: inline-block;
  line-height: 1.125rem;
  border: 2px solid var(--primary-color);
  transition: all .2s ease-in;
}
a.whitebutton { 
  color: #f2b13d; 
  font-size: 1rem;
  text-transform: none;
  font-weight: normal;
  background: #ffffff; 
  padding: .7rem 1.3rem; 
  border-radius: .5rem; 
  margin: 0.25rem;
  display: inline-block;
  line-height: 1.125rem;
  border: 2px solid #f2b13d;
  transition: all .2s ease-in;
}
a.creamblockbutton { 
  color: var(--primary-color);
  font-size: 1rem;
  text-transform: none;
  text-align: center;
  font-weight: normal;
  background: var(--secondary-color);  
  padding: .7rem 1.3rem; 
  border-radius: 0; 
  margin: 0.25rem;
  display: block;
  line-height: 1.125rem;
  border: 2px solid var(--primary-color);
  transition: all .2s ease-in;
}


.readon:hover, .button:not(.site-home #g-showcase .button, .ph-sidepics-3 .button, #g-footer .button, .ql-inner-box .g-blockcontent-buttons > a.button):hover, .btn:hover,  p.readmore .btn:hover {background: var(--primary-color); color: white; border: 2px solid var(--primary-color); }
.creambutton:hover {background: var(--primary-color); color: white!important;   border: 2px solid var(--primary-color);}
.whitebutton:hover {background: #f2b13d; color: white;   border: 2px solid #f2b13d;}
.creamblockbutton:hover {background: var(--primary-color); color: white; border: 2px solid var(--primary-color);}


.btn .icon-chevron-right { display: none;}

/*************** ALL SITE *****************/

.item-image {display: none;}

h1#hero-title-text {
    margin: 0 !important;
}

/*************** HOMELAYOUT ***************/ 
/*************** OFFCANVAS ****************/
.g-offcanvas-toggle {color: var(--primary-color);} 
.g-offcanvas-toggle .fa-fw {text-shadow: none;}

/*************** TOP **********************/ 
/*************** NAVIGATION ***************/

@media only screen and (min-width: 50.99rem) {
    .site-home #g-navigation {
        position: relative;
        z-index: 10;
    }
	#g-navigation .g-logo img {
        width: 500px;
    }
	#g-navigation .g-social .g-social-items a {
        font-size: 2vw;
		padding-left: 0.5rem;
    }
	#g-navigation .negtopmargin {margin-top: -3vw;}
}

@media only screen and (max-width: 50.99rem) {
    #g-navigation .g-logo {
        max-width: 65%;
    }
    #g-navigation .g-social .g-social-items a {
        font-size: 6vw;
		padding-left: 0.5rem;
    }
    .nobottompadding {
        margin: 0;
        padding: 0;
    }
	#g-navigation {
		border-bottom: 2px solid var(--primary-color);
	}
	#g-navigation .g-content {
		padding: 0.5rem;
	}
}

/*************** SLIDESHOW ****************/ 

@media only screen and (min-width: 50.99rem) {
.homelayout.swiper-box #g-slideshow > .g-container {
    padding: 0!important;
}

.site-home #g-slideshow {
    pointer-events: none;
    margin-top: -4vw!important;
    z-index: 9;
    position: relative;
    margin-bottom: -4vw!important;
}

}

.site-home .g-content-array {
    margin: 0;
}

/*************** HEADER *******************/
@media only screen and (min-width: 50.99rem) {
    .site-home #g-header {
        position: relative;
        z-index: 10;
    }
}


#hero-title-text {font-size: 7vw; /*text-transform: none!important; font-variant-caps: normal!important; font-family:  var(--body-font-family)*/;}
#hero-title-text.decorative {
    display: grid;
    grid-template-columns: auto minmax(10px, 1fr);
    align-items: center;
    font-size: 5vw;
    grid-gap: 40px;
    width: 85%;
    border-bottom: none;
    text-align: center;
    text-transform: none!important;
    font-variant-caps: normal!important;
    font-weight: 400;
    font-style: italic;
	/*font-family:  var(--body-font-family);*/
}
#hero-title-text.decorative:after {
    content: '';
    border-top: 1px solid var(--primary-color);
}
/*
#hero-title-text .crimson {font-family:  var(--body-font-family);}
#hero-title-text .cinzel {font-family:  var(--title-font-family);}
*/

.underlinetitle {
    --hero-img-height: 42vw;
    --hero-object-position: bottom;
	
}
.underlinetitle #hero-title-text.decorative {
	--hero-title-font-family: var(--title-font-family);
	--hero-title-top-position: 5%;
	--hero-title-bottom-position: unset;
	--hero-title-left-position: 5%;;
	--hero-title-right-position: 5%;
	font-style: normal;
	font-weight: 400;
	display: flex;
	flex-direction: column;
	width: 90%;
	line-height: 1.1;
} 

.underlinetitle #hero-title-text/*.decorative*/:after {
    border-top: 1px solid var(--primary-color);
    height: 3px;
    width: 40%;
}

@media only screen and (max-width: 50.99rem) {
    .underlinetitle #hero-title-text.decorative {
        gap: 0vw;
        font-size: 6vw;
		line-height: 1;
    }
    .underlinetitle #hero-title-text.decorative:after {
        border-top: 1px solid var(--primary-color);
        width: 70%;
    }
	#hero-text-box h4 {
		font-size: 1.25rem;
	}
 
}

.shrinepage #hero-title-text.decorative {
    --hero-title-top-position: 5%;
    --hero-title-bottom-position: unset;
    height: 8vw;
}
@media only screen and (min-width: 50.99rem){
	.olampage  {
	--hero-text-right-position: 15%;
    --hero-text-left-position: 15%;
    --hero-text-top-position: 29%;
    --hero-text-bottom-position: unset;
	}
	.phrpage {
	--hero-text-right-position: 10%;
    --hero-text-left-position: 10%;
    --hero-text-top-position: 17%;
    --hero-text-bottom-position: unset;	
	}
}
@media only screen and (max-width: 50.99rem){
	.olampage {
		--hero-text-top-position: 13vw;
		--hero-text-right-position: 0%;
		--hero-text-left-position: 0%;
		--hero-img-height-mobile: 56vw;
	}
	.olampage img {
		margin-top: 5vw;
	}
	.phrpage img {
		margin-top: 5vw;
	}
	.phrpage {
		--hero-text-top-position: 14%;
		--hero-text-right-position: 0%;
		--hero-text-left-position: 0%;
		--hero-img-height-mobile: 56vw;		
	}
}

/**************hero title and text positions*************************/

.donatepage {
    --hero-title-top-position: 5%;
    --hero-title-left-position: 10%;
    --hero-title-bottom-position: unset;
    --hero-title-font-family: var(--body-font-family);
}

.visitpage {
    --hero-title-top-position: 5%;
    --hero-title-left-position: 10%;
    --hero-title-bottom-position: unset;
    --hero-title-font-family: var(--body-font-family);

    --hero-text-right-position: 5%;
    --hero-text-left-position: 30%;
    --hero-text-top-position: 25%;
    --hero-text-bottom-position: unset;
}

.visitpage #hero-text-box {
    display: flex;
    flex-direction: column;
}
.visitpage .hero-text-design {
    font-style: italic;
	text-align: center;
}


.shrinepage {
    --hero-opacity: .7;
}

.previewpage {
    --hero-opacity: .7;
    --hero-img-height: 24vw;
}

.fullwidth-img {
    width: 100%;
}

.site-home #g-header {
    /*background: url(/images/stories/template/monstrance.jpg) 0% 40% no-repeat, var(--default-white);
    background-size: 50% !important;*/
	padding: 0 5%;
}

@media only screen and (max-width: 50.99rem) {
    .site-home #g-header {
       /* background: url(/images/stories/template/monstrance.jpg) 0% 100% no-repeat, var(--default-white) ;*/
        /*background-size: 75% !important;*/
    }
    .site-home #g-header :is(.button.creambutton, .button) {
        background: rgba(255,255,255,.8)!important;
    }
    .site-home #g-header h1 {
        font-size: 11vw;
    }
    .site-home #g-header .g-content-array > .g-grid > .g-block > .g-content {
        padding: 0.5rem 0;
    }
}


/*************** ABOVE ********************/
.site-home #g-above .g-content-array .g-array-item-text, .g-content-array .g-array-item-read-more {margin: 0;}

.site-home #g-above {padding: 3vw 3% 3vw 5%;}
.site-home #g-above .hours-block {
	background: white;
	margin-bottom: 10px;
}
.site-home #g-above .mt-block {
	background: white;
}
@media only screen and (min-width: 50.99rem) {
	.site-home #g-above .g-content {padding: 0; margin: 0;}
}

.site-home #g-above h5 {color: var(--primary-color); background: none; font-weight: 500;  font-size: 2rem;	 margin-bottom: 0.5rem;}
.site-home #g-above h5.small {color: var(--primary-color); background: none; font-size: 1.5rem;}
.site-home #g-above p {font-family:  var(--third-font-family); color: var(--primary-color);  }


/*************** SHOWCASE *****************/
.site-home .g-blockcontent-subcontent-title-text {
	font-weight: 400;}
.site-home .ql-vw15 .g-blockcontent-subcontent-block-content {
    height: 30vw;
}

@media only screen and (max-width: 50.99rem) {
    .site-home .ql-dm {
        padding: 2rem 2%;
    }
    .site-home .ql-vw15 .g-blockcontent-subcontent-block-content {
        height: 60vw;
    }
	.ql-dm .g-blockcontent-subcontent-title {font-family: var(--ql-font-family); border-radius: 0;}
	.ql-dm .g-blockcontent-subcontent-block-content img {border-radius: 0;}
	.site-home #g-above .g-content {padding: 0 1rem; margin-bottom: 10px;}
}

/*************** UTILITY - pray with us ******************/
.site-home #g-utility {padding: 3% 7%;}
@media only screen and (min-width: 50.99rem){
		.site-home #g-utility {background: url('../images/stories/template/pray-with-us-parallax.jpg') 0% 60% no-repeat; background-size: 100% !important;}
}
#g-utility > .g-grid > .g-block > .g-content {background: rgba(255, 255, 255, 0.8); border-radius: 0;}
#g-utility p, #g-utility li {font-size: 1.2rem;}
#g-utility :is(h1,h2,h3,h4,h5,h6,p,ul,a) {color: var(--primary-color);}
#g-utility td { padding: 0.5rem;}
#g-utility .moduletable .category-module li {margin-bottom: 0.01rem; padding-bottom: 0.01rem;}

@media only screen and (max-width: 50.99rem) {
    #g-utility p, #g-utility li {
        font-size: 4vw;
    }
	.site-home #g-utility {background: url('../images/stories/template/pray-with-us-parallax.jpg') 70% 0% no-repeat; background-size: 170% !important;}

}


/*************** FEATURE ******************/
@media only screen and (min-width: 50.99rem) {
    .site-home .swiper-container-overlay-box > .g-container {
        position: relative;
        height: 45vw;
    }
    .site-home .swiper-container-overlay-box > .g-container > .g-grid:nth-child(1) {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100%;
        width: 100%;
        z-index: 2;
    }
    .site-home .swiper-container-overlay-box > .g-container > .g-grid:nth-child(2) {
        position: absolute;
        top: 10%;
        bottom: 10%;
        left: 7%;
        right: 10%;
        height: 80%;
        width: 83%;
        z-index: 3;
        pointer-events: none;
    }
    .site-home .visit-box-container {
        position: relative;
    }
    .site-home .visit-box-container .g-content-array {
        margin: 0;
        padding: 0;
    }
    .site-home .visit-box {
        width: 45%;
        height: 22vw;
        background: rgba(255,255,255,.7);
        padding: 2vw;
        pointer-events: none;
    }
    .site-home .visit-box h1 {
        font-size: 6vw;
        text-transform: uppercase;
        color: var(--primary-color);
    }
	.site-home .visit-box h4 {
        /*font-size: 5vw;*/
        padding-left: 4vw;
    }
    .site-home .visit-box p {
        font-size: 1.5vw;
        padding-left: 4vw;
    }
    .site-home .visit-buttons {
        position: absolute;
        bottom: 0;
        right: 0;
        height: 10vw;
        width: 70%;
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
    .site-home .visit-buttons .button {
        pointer-events: all;
        background: var(--secondary-color)!important;
        border: none!important;
        padding: 2vw!important;
        font-size: 2vw!important;
    }
    .site-home .visit-buttons .button:hover {
        pointer-events: all;
        background: var(--primary-color)!important;
    }
}
@media only screen and (max-width: 50.99rem) {
    .site-home .fullwidth-swiper .swiper-slide img {
		height: 60%;
	}
	
	.site-home .swiper-container-overlay-box > .g-container {
        position: relative;
        height: 90vw;
    }
    .site-home .swiper-container-overlay-box > .g-container > .g-grid:nth-child(1) {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100%;
        width: 100%;
        z-index: 2;
    }
    .site-home .swiper-container-overlay-box > .g-container > .g-grid:nth-child(2) {
        position: absolute;
        top: 40%;
        bottom: 0%;
        left: 5%;
        right: 5%;
        height: 55%;
        width: 90%;
        z-index: 3;
        pointer-events: none;
    }
    .site-home .visit-box-container {
        position: relative;
    }
    .site-home .visit-box-container .g-content-array {
        margin: 0;
        padding: 0;
    }
    .site-home .visit-box {
        width: 100%;
        height: 40vw;
        background: rgba(255,255,255,.7);
        padding: 2vw;
        pointer-events: none;
    }
    .site-home .visit-box h1 {
        font-size: 8vw;
        text-transform: uppercase;
        /*color: var(--default-black);
        text-align: center;*/
    }
	.site-home .visit-box h4 {
        font-size: 5vw;
        padding-left: 4vw;
    }
    .site-home .visit-box p {
        font-size: 3.5vw;
        padding-left: 4vw;
    }
    .site-home .visit-buttons {
        position: absolute;
        bottom: 0;
        right: 0;
        left: 0;
        height: 10vw;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 1rem;
        justify-content: space-around;
        align-items: center;
    }
    .site-home .visit-buttons .button {
        pointer-events: all;
        background: var(--secondary-color)!important;
        border: none!important;
        padding: 2vw!important;
        font-size: 4vw!important;
    }
    .site-home .visit-buttons .button:hover {
        pointer-events: all;
        background: var(--primary-color)!important;
    }

    .site-home #g-feature .swiper-navigation {
        display: none;
    }

}

/*************** MAIN *********************/
#g-mainbar {padding: 0 5%;}

.site-home #g-container-main {
    padding: 0 5%;
}
#g-container-main { margin: 0 -2%; padding: 0 5%; }
/*.outline-10 #g-container-main { margin: 0; padding: 0 8%; }*/

.heroincontent #g-mainbar .g-content {padding-top: 0; margin-top: 0;}

@media only screen and (min-width: 50.99rem){
.ph-rec-row .g-array-item {
    max-height: 44vw;
}
}

@media only screen and (max-width: 50.99rem) {
	#g-mainbar {padding: 0 1%;}
	
}

.g-blockcontent-subcontent-title-text {font-weight: normal;}


/*.blessedsacramentpage #g-mainbar > .g-grid > .g-block > .g-content {
    margin: 0 .625rem .625rem .625rem;
    padding: 0 1.5rem 1.5rem 1.5rem;
}*/

/*************** EXPANDED - adoration sodality *****************/ 
.site-home #g-expanded {background: url('/images/stories/template/nun-praying.jpg') 0% 40% no-repeat; background-size: 75% !important;}
.site-home #g-expanded .g-content {padding: 0; margin: 0;}

@media only screen and (max-width: 50.99rem){
	.site-home #g-expanded {background-position: 0% 0% !important; background: none; padding: 0 5%;}
}



/*************** EXTENSION ****************/
/*************** BOTTOM *******************/


/*************** FOOTER *******************/
#g-footer .g-content-array {margin: 0;}
#g-footer .g-content {padding-left: 0.5rem; padding-right: 0.5rem;}
#g-footer a {color: var(--default-white);} 
#g-footer a:hover {color: var(--secondary-color);}
#g-footer a.button {
    border: 2px solid var(--secondary-color);
    font-family: var(--title-font-family);
    font-size: 1.3rem;
	background: transparent;
	border-radius: 0;
	}

#g-footer a.button:hover {color: var(--primary-color) !important; background: var(--secondary-color) !important; }

@media only screen and (min-width: 50.99rem){
	#g-footer .g-social .g-social-items a {
        font-size: 1.5vw;
		padding-left: 0.5rem;
    }
}
@media only screen and (max-width: 50.99rem){
	#g-footer .g-social .g-social-items a {
        font-size: 4.5vw;
		padding-left: 0.5rem;
	}
	#g-footer > .g-grid > .g-block > .g-content {
        margin: 0 .625rem;
        padding: 1vw 1.5rem;
    }
}



/*************** COPYRIGHT ****************/ 
/*************** MODULES ******************/
.moduletable .nav.menu, .moduletable .unstyled {background: var(--primary-color);} 
.moduletable .nav.menu li.current.active a, .moduletable .nav.menu li a:hover {    
    color: var(--primary-color); 
    background: var(--secondary-color);
} 
/*************** SECTIONS *****************/
/*************** MOBILE *******************/ 




.minus10, .platform-content .moduletable.minus10  {  margin: 0 calc(-10vw - 20px); }
.plus10, .platform-content .moduletable.plus10 {  margin: 0 10vw; }
.fullwidthpic { width: 100%;}
img.fullwidth { width: 100%;}

.mtable .sprocket-lists-pagination-hidden {display: none;}

.flexrow > .imageside { flex: 2;}
.flexrow > .moduleside { flex-basis: 35%}
.flexrow > .fiftypercent { flex-basis: 35%}

@media only screen and (min-width: 768px) {
	.flexrow div.imageside:first-child, .flexrow div.moduleside:first-child { padding-right: 30px;}
	.flexrow div.imageside:last-child, .flexrow div.moduleside:last-child { padding-left: 30px;}
	
	.flexrow > .imageside { flex: 2;}
	.flexrow > div { order: 2; }
	
}
/************ FLEX ITEM  ************/
.flexcolumn { display: flex; flex-direction: column; }
.flexcolumn > div { flex: 1;}
.flexcenter { display: flex; align-items: center; justify-content: center;}

/************ FLEX ITEM  ************/
.flexrow { display: flex; align-items: center; justify-content: center;   }
.flexrow > div { flex: 1;}

@media only screen and (max-width: 767px) {
	.flexrow { flex-direction: column; }
}

.bback { background: var(--primary-color); padding: 20px; margin-top: 0; margin-bottom: 0; }
.goldback { background: var(--secondary-color); padding: 20px; margin-top: 0; margin-bottom: 0; }
.whiteback { background: rgba(255,255,255,.75); padding: 20px; margin-top: 20px; margin-bottom: 20px;}


@media only screen and (max-width: 50.99rem) {
    #g-container-main {
        margin: 0;
        padding: 0;
    }
    .plus10, .platform-content .moduletable.plus10 {padding: 0 calc(1vw + 10px);}
    .minus10, .platform-content .moduletable.minus10   {margin: 0 calc(-15vw - 15px);}
}


.bback p, .bback li, .bback h1, .bback h2, .bback div .bback h3, .bback h4, .bback h5, .bback h6  { color: #ffffff; }
.toi p, .toi li, .toi h1, .toi h2, .toi div .toi h3, .toi h4, .toi h5, .toi h6 {text-shadow: 5px 5px 10px rgba(0,0,0,.5); color: #ffffff; }
.goldback p, .goldback li, .goldback h1, .goldback h2, .goldback div .goldback h3, .goldback h4, .goldback h5, .goldback h6, .goldback td  { color: var(--primary-color); }

.whiteback p {color: #fedba1; }

.bback a:not(a.creambutton) {color: white;}
.goldback a {color: var(--primary-color); }
.bback a:hover {color: var(--secondary-color); }
.goldback a:hover  {color: white; }

.visitpage .bback a {color: var(--primary-color); border: 1px solid var(--secondary-color);}
.visitpage .bback a:hover {border: 1px solid var(--secondary-color);}

/***background images per unique class - have text on image****/
.tourimg {background: url(../images/stories/template/top/lamb-tourbw20.jpg) 0% 0% no-repeat; background-size: 100%;  }
.discernment2 {background: url(../images/stories/template/hero/discernment2.jpg) 0% 50% no-repeat; background-size: 100%;  }
.eucharist-fade {background: url(../images/stories/template/top/eucharist-fade.jpg) 0% 50% no-repeat; background-size: 100%;  }
/*.pav-fade {background: url(../images/stories/template/top/plan-a-visit-fade.jpg) 0% 50% no-repeat; }*/
.shrine-story {background: url(../images/stories/template/top/shrine-story-fade.jpg) 0% 50% no-repeat; background-size: 100%;  }
/*.donate-top {background: url(../images/stories/template/top/donate-fade.jpg) 0% 50% no-repeat; }*/
.ind-pilgrimage {background: url(../images/stories/template/ind-pilgrim-parallax20.jpg) 0% 60% no-repeat; background-size: 100%; }
.group-pilgrimage {background: url(../images/stories/template/group-pilgrimage-parallax50.jpg) 0% 60% no-repeat;  background-size: 100%; }
.employment {background: url(../images/stories/template/top/employment-top.jpg) 0 100% no-repeat; background-size: 100%; }

@media only screen and (max-width: 50.99rem){
	.tourimg {background: url(../images/stories/template/top/lamb-tourbw20.jpg) 45% 0% no-repeat; background-size: 285%;  }
	.group-pilgrimage {background: url(../images/stories/template/group-pilgrimage-parallax50.jpg) 65% 100% no-repeat;  background-size: 150%; }
}

.padright { padding-right: 30px;}
.padleft { padding-left: 30px;}

@media only screen and (max-width: 50.99rem) {
    .padright {padding-right: 5px;}
    .padleft {padding-left: 5px;}
}

p.csscode {background-color: #f7f7f7;
	border: 1px solid rgba(0, 0, 0, 0.1);
	padding: 0.938rem; margin: 0 0 1.5rem;
	border-radius: 0.1875rem;
	font-family: "Menlo", "Monaco", monospace;
	clear: both;
} 


table, td {
	border: 0px solid transparent;}
td {padding: 0.15rem;}
.equaltable td {padding-left: 0.5rem; padding-right: 0.5rem; }


@media only screen and (max-width: 50.99rem){
#g-container-main .equaltable img.icon {
    width: 10%;
}}

#linksRemove .g-content-array {
    margin: 0;
}

#linksRemove .g-content-array .g-item-title a:hover {
    text-decoration: none;
}

#linksRemove .g-content-array .g-item-title a {
    pointer-events: none;
}

#linksRemove .g-array-item-image a {
    pointer-events: none;
}

@media only screen and (max-width: 50.99rem){
.prayer-request iframe {width: 100vw !important;}
}

@media only screen and (min-width: 50.99rem) {
    .g-sublevel .g-sublevel {
        width: 275px;
    }
}

@media only screen and (max-width: 50.99rem) {
    .is-sticky {
        position: fixed!important;
        top: 0;
        left: 0;
        width: 100%!important;
        z-index: 999!important; /* Ensures it stays on top of other content */
        box-shadow: 0 0px 5px rgba(0,0,0,0.4); /* Optional: adds a nice shadow */
    }

    .site-1 .g-offcanvas-toggle {
        position: fixed!important;
    }
}

@media only screen and (min-width: 50.99rem) {
/* Apply this to the wrapper div when it becomes sticky */
    .g-particle.is-sticky {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%!important;
        z-index: 999!important;
        background-color: #ffffff; /* Ensure this matches your site background */
        box-shadow: 0 0px 5px rgba(0,0,0,0.4);
        transition: all 0.3s ease; /* Optional: Makes the snap smoother */
    }
}

#g-navigation {
    position: relative;
    z-index: 1000!important;
}
img.fit-width {object-fit: cover;  object-position: center;}
.fit-width > img {object-fit: cover;  object-position: center top; width: 100%; /*max-height: 24vw;*/}
.fit-width {width: 100%;}

.fullwidthpic { width: 100%;}
img.fullwidth { width: 100%;}