@import url('//fonts.googleapis.com/css2?family=Caudex:ital,wght@0,400;0,700;1,400;1,700&family=EB+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Lato:ital,wght@0,400;0,700;1,400;1,700&display=swap');

@font-face {
    font-family: 'American Uncial Normal';
    src: url('/content/fonts/American Uncial Normal.ttf');
}

/************ TEMPLATE  ************

************/

.site-1 {
    --primary-color: #3753a4;
    --secondary-color: #3753a4;

    --primary-rgb: 55, 83, 164;
    --secondary-rgb: 55, 83, 164;

    --default-white: #ffffff;
    --default-black: #000000;

    --title-font-family: 'American Uncial Normal';
    --body-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-size-desktop: 2.25vw;

    --ph-width: 22vw !important;

    --rok-mini-badge: var(--default-white);
    --rok-mini-numbers: var(--primary-color);
    --rok-mini-timeline: var(--default-white);
    --rok-mini-text: var(--default-white);
}

.site-1-home {
    --ph-title-color: var(--default-white);
}

.readon, .button, .btn, p.readmore .btn, .sprocket-lists-portrait-container > li .sprocket-lists-portrait-item > a span, .listentobutton.moduletable a {
    background: var(--primary-color);
    font-family: var(--body-font-family);
}

/*************** ALL SITE *****************/
.item-image {display: none;}

.site-1-home #g-top {
    background-color: var(--primary-color);
}

#g-mainbar .moduletable {
    margin: 0 !important;
}

.site-1-home .g-content-array .g-content {
    padding: 0 !important;
}

.site-1-home .g-array-item-text {
    margin: 0;
}

iframe {
  border: none;
}

.site-1-home .g-content.g-particle {
    padding: 0 !important;
    margin: 0 !important;
}

.admod td {
    padding: 0 !important;
}

.admod table, .admod tr {
    gap: 0.5rem;
}

.site-1 #g-mainbar {
    padding-bottom: 5%;
}

a {
    text-shadow: var(--deafult-text-shadow);
}

@media only screen and (min-width: 50.99rem) {
    .site-1-home #g-header .thanksgiving-video {
        width: 100%!important;
        height: auto!important;
    }

    .site-1-home #g-header:has(.thanksgiving-video) > .g-grid {
        display: flex;
        flex-direction: row;
        gap: 2vw;
        align-items: center;
    }
    .site-1-home #g-header:has(.thanksgiving-video) > .g-grid > .g-block:has(.thanksgiving-video) {
        flex: 25;
        width: unset;
    }
    .site-1-home #g-header:has(.thanksgiving-video) > .g-grid > .g-block.mass-times-section {
        flex: 75;
        width: unset;
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-1-home #g-header .thanksgiving-video {
        width: 100%!important;
        height: auto!important;
    }
}

/***********Custom Scrollbar****************/

/* Hide the default scrollbar */

::-webkit-scrollbar {
    width: .75rem;
}

::-webkit-scrollbar-track {
    background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb {

background-color: #ccc;
    border-radius: 5px;
}

/* Style the scrollbar on hover */

::-webkit-scrollbar-thumb:hover {
    background-color: #bbbbbb;
}

/* Style the scrollbar when it's being dragged */

::-webkit-scrollbar-thumb:active {
    background-color: #8c8c8c;
}

@-moz-document url-prefix() {
    * {
    scrollbar-width: thin;
         scrollbar-color: #ccc #f5f5f5;
    }
}

/*************** HOMELAYOUT ***************/ 
/*************** OFFCANVAS ****************/
.g-offcanvas-toggle {color: var(--primary-color);} 
.g-offcanvas-toggle .fa-fw {text-shadow: none;}

/*************** TOP **********************/ 

@media (min-width: 50.99rem) {
    .modern-alert-padding {
        padding: 2% 5% !important;
    }
}

/*************** NAVIGATION ***************/

.site-1-home #g-navigation {
    position: relative;
}

.site-1-home .menu-block {
    position: absolute;
    top: 0;
    z-index: 10;
}

.site-1 #g-navigation a:not(.button):hover {
    color: white;
    opacity: 0.6;
}

.site-1-home .g-main-nav {
    background-color: rgba(var(--primary-rgb),0.75);
}

@media only screen and (min-width: 50.99rem) {

    .ql-fa-toplinks {
		--ql-title-color: var(--primary-color);
		--ql-font-title-color: var(--primary-color);
	}
}

@media only screen and (min-width: 50.99rem) {
    .g-main-nav .g-toplevel>li>.g-menu-item-container>.g-menu-item-content {
        font-size: 1.15vw;
        font-family: var(--body-font-family);
    }
    .g-main-nav .g-sublevel>li>.g-menu-item-container>.g-menu-item-content>.g-menu-item-title {
        font-size: 1.25vw;
        font-family: var(--body-font-family);
    }
}
@media only screen and (max-width: 50.99rem) {
    #g-navigation .g-logo {
        max-width: 65%;
        margin: 2rem auto;
    }
}
	
/*************** SLIDESHOW ****************/ 
/*************** HEADER *******************/

.site-1-home #g-header {
    padding: 5%;
    background-image: url("/images/template/logo-icon-10.png");
    background-position: 50% 1vw;
    background-size: 18%;
    background-repeat: no-repeat;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: var(--default-white);
}

@media (max-width: 50.99rem) {
    .site-1-home #g-header {
        background-size: 30%;
    }
}

.mass-times-section p {
    margin-bottom: 0;
    line-height: 1.3;
    font-size: 1.2rem;
}

.mass-times-section h1 {
    margin: 0;
    line-height: 1;
}

.header-title {
    padding-bottom: 5%;
}

.header-title h1 {
    margin-bottom: 2rem;
}

.site-1-home .mass-times-container {
    display: grid;
    grid-template-columns: 2fr 2fr 1fr;
}

.mass-times-container > div {
    height: fit-content;
    margin: auto;
    width: 100%;
}

.mass-times-container img {
    box-shadow: var(--default-box-shadow);
    border-radius: 5px;
    transition: all 250ms ease-in-out;
}

.mass-times-container img:hover {
    transform: scale(0.98);
    transition: all 250ms ease-in-out;
}

.mass-times-container h6 {
    margin: 0;
    line-height: 1.5;
    margin-bottom: 1rem;
    font-size: 1.75rem;
}

.site-1-home #g-container-main h1 {
    margin: 0;
    line-height: 1;
    margin-bottom: 2rem;
}


@media (max-width: 50.99rem) {

    .site-1-home .mass-times-container {
        display: grid;
        grid-template-rows: 1fr 1fr 1fr;
        gap: 1rem;
        grid-template-columns: 1fr;
    }

    .site-1-home .mass-times-container img {
        width: 50%;
        height: auto;
        margin: auto;
    }

    .site-1-home .mass-times-container > div:last-child > a {
        display: grid;
        justify-content: center;
        align-items: center;
    }
}

@media (min-width: 50.99rem) {
    .ph-photoblocknews .g-content-array {
        justify-content: space-around;
        gap: 3vw;
    }
}

/*************** ABOVE ********************/
/*************** SHOWCASE *****************/
/*************** UTILITY ******************/

.site-1-home .ql-inner-box .g-blockcontent-subcontent-title > .g-blockcontent-subcontent-title-text {
    font-weight: 400;
    border: 1px solid var(--default-white);
}

.site-1-home .ql-inner-box .g-blockcontent-subcontent > div {
    padding: 0.5rem;
}

/*************** FEATURE ******************/
/*************** MAIN *********************/

.site-1-home #g-container-main {
    padding: 5%;
}

@media (min-width: 50.99rem) {
    .site-1-home .ph-photoblocknews {
        padding-right: 5%;
        padding-bottom: 5%;
    }
}

@media (max-width: 50.99rem) {

    .ph-sidebyside-mobile {
        --ph-read-more-color: transparent;
    }

    .ph-sidebyside-mobile .g-item-title a {
        --ph-title-color: var(--primary-color);
    }

    .site-1-home #g-mainbar {
        padding: 5% 0 !important;
    }

    .ph-sidebyside-mobile .g-content-array {
        padding: 0 0 1rem 0;
    }

    .ph-sidebyside-mobile .g-content-array .g-array-item-image {
        aspect-ratio: 12/16;
    }

    .site-1-home #g-container-main > div > div.g-block.size-14.flush-ads.grid-center {
        padding: 5%;
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-1-sub #g-mainbar > .g-grid > .g-block > .g-content {
        margin: 0;
        padding: 0;
    }
}

/*************** EXPANDED *****************/ 

.site-1-home #g-expanded > .g-container {
    padding: 7% 5%;
}

.site-1-home .g-container {
    width: 100%;
}

.site-1-home #g-expanded h1 {
    color: white;
    text-shadow: var(--default-box-shadow);
}

.site-1-home #g-expanded {
    background: url('/images/template/parallax1.jpg') 50% 50% no-repeat;
    background-size: 125% auto;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
}

.site-1-home.tablet-screen #g-expanded {
    background: url('/images/template/parallax1.jpg') 50% 50% no-repeat;
    background-size: cover;
    background-attachment: unset !important;
}

.site-1-home #g-expanded > div.g-container {
    background: rgba(var(--primary-rgb),.6); /* You can change the color here */
}

.rok-mini-particle .rme-badge {
    border-radius: 5px;
}

.rok-mini-particle {
    margin-bottom: 5%;
}

.site-1-home .g-content {
    padding: 0;
    margin: 0;
}

.rok-mini-particle .rme-item {
    gap: 1rem;
}

.rok-mini-particle .rme-item .rme-description > span {
    text-shadow: var(--default-box-shadow);
}

.rok-mini-particle :is(.rme-timeline-point:hover span, .rme-timeline-point.active span) {
    background-color: var(--primary-color) !important;
}

.site-1-home #g-expanded h1 {
    padding-bottom: 5%;
    margin: 0;
    line-height: 1;
}

.calendar-button .button {
    color: var(--primary-color);
    border-radius: 3px;
    padding: 1rem 3rem;
    box-shadow: var(--default-box-shadow);
    background: rgba(255,255,255, .8);
    font-weight: 600;
}

@media (max-width: 50.99rem) {
  .site-1-home #g-expanded {
      background: url('/images/template/parallax1.jpg') 50% 50% no-repeat;
      background-size: cover;
  }

  .site-1-home #g-expanded > .g-container {
    padding: 10% 10%;
    }

}

/*************** EXTENSION ****************/

.site-1-home #g-extension {
    padding: 5% 0 0 0;
}

.site-1-home #g-extension > div:nth-child(1) {
    justify-content: space-evenly;
}



.instagram {
    background-color: #f1f1f1;
}

.instagram h1 {
    margin: 2.5rem 0;
}

.site-1-home #g-extension > .g-grid:first-child h1 {
    font-size: clamp(2rem, 2.3vw, 3.5rem);
    margin: 0;
}


.site-1-home #g-extension .g-grid {
    margin: 1vw;
    align-items: center;
}

.site-1-home #g-extension > .g-grid:first-child {
    padding-bottom: 5%;
}

.site-1-home #custom-5053-particle {
    box-shadow: var(--default-box-shadow);
}

@media (max-width: 50.99rem) {
    .site-1-home #g-extension {
        padding: 10%;
    }

    .site-1-home #g-extension > .g-grid:first-child {
        padding-bottom: 10%;
    }

    .site-1-home #contentarray-7129-particle > div > div > div {
        padding-bottom: 10%;
    }
}

@media (min-width: 50.99rem) {
    .site-1-home #g-extension .size-50 {
        flex: 0 42.5%;
    }
}

/*************** BOTTOM *******************/

.site-1 #g-bottom {
    padding: 2% 2% 1% 2% !important;
    position: relative;
    z-index: 10;
}

@media (max-width: 50.99rem) {
    .site-1 #g-bottom {
        padding: 10% !important;
    }
}

/*************** FOOTER *******************/
#g-footer .g-content-array {margin: 0;}
#g-footer a {color: var(--default-white);} 

.site-1 #g-footer p {
    margin: 0;
}

.site-1 #g-footer a:hover:not(:has(img)) {
    opacity: 0.6;
}

.site-1 #g-footer {
    padding: 0 2% 2% 2% !important;
}

.site-1 .footer-socials {
    margin-top: 1.25rem;
}

.site-1 #g-footer .g-social-items {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    justify-content: center;
}

.site-1 #g-container-footer .g-content {
    padding: 0;
}

.site-1 #g-container-footer .g-array-item-text {
    margin: 0;
}

@media (max-width: 50.99rem) {
    .site-1 #g-footer {
        padding: 0 5% 5% 5% !important;
    }
}

/****** ADDING FLOCKNOTE TO SOCIAL *******/
#g-navigation .g-logo img {width: 375px;}

.site-1 #g-footer .top-social-icons {
    display: flex !important;
    flex-direction: row !important;
    gap: 1rem !important;
    justify-content: center !important;
}

.site-1 #g-navigation .top-social-icons {
    display: flex !important;
    flex-direction: row !important;
    gap: .5rem !important;
    justify-content: center !important;
    align-items: center;
}

.site-1 #g-navigation .flocknote-icon, .g-main-nav .g-toplevel i {opacity: 1;}
.site-1 #g-navigation .top-icon {font-size: 1.2rem;}

.top-icon {text-align: center; width: 1.25rem; }

.top-icon .flocknote-icon {width: 2vw; }

@media (max-width: 50.99rem) {
    .top-icon .flocknote-icon {width: 1.5rem; max-width: 1.5rem;}
    #g-offcanvas .top-social-icons {
        display: flex;
        gap: 2rem;
        flex-wrap: wrap;
        justify-content: space-evenly;
        padding: 5vw 2rem 0 .5rem !important;
        align-items: center;
        font-size: 2rem;
    }
    #g-offcanvas  .flocknote-icon {width: 2rem; max-width: 2rem;}

}


/*************** 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(--default-white); 
    background: #4a64b2;
} 

@media (max-width: 50.99rem) {
    .moduletable .nav.menu, .moduletable .unstyled {background: var(--primary-color);} 
.moduletable .nav.menu li.current.active a, .moduletable .nav.menu li a:hover {    
    color: var(--default-white); 
    background: #4a64b2;
} 
}

/*************** SECTIONS *****************/
/*************** MOBILE *******************/ 

@media (max-width: 50.99rem) {
    #g-offcanvas #g-mobilemenu-container {
        margin-left: 0 !important;
    }
    
    #g-mobilemenu-container {
        margin: 0 !important;
    }
    
    #g-offcanvas {
        padding-left: 0.5rem;
    }
    
    #g-offcanvas .g-menu-item-container > .g-menu-item-content {
        max-width: 80% !important;
    }
    
    #g-mobilemenu-container .g-toplevel li.g-parent .g-menu-parent-indicator {
        right: 0.75rem;
    }
    
    #g-offcanvas #g-mobilemenu-container ul>li.g-menu-item-link-parent>.g-menu-item-container>.g-menu-parent-indicator {
        padding: 0 !important;
        margin: 0 !important;
    }
    
    #g-offcanvas .g-social-items {
        padding-right: 0.5rem;
        margin-top: 1rem;
    }

    #g-offcanvas .g-content {
        margin: 0;
        padding: 0;
    }

    #g-offcanvas .g-social-items {
        display: flex;
        gap: 1rem;
        flex-wrap: wrap;
        justify-content: space-evenly;
        padding: 0 2rem;
    }
}

.g-offcanvas-toggle {
    box-shadow: var(--default-box-shadow);
    border-radius: 50%;
    background: white;
    display: grid;
    justify-content: center;
    align-items: center;
}

/*************** ADS **********************/

.home-ads tbody {
    display: flex;
    flex-wrap: wrap;
    margin: auto;
    justify-content: center;
    gap: 1rem;
}

.site-1-sub #g-aside > .g-grid:nth-child(1) .g-content {
    padding-bottom: 0;
    margin-bottom: 0;
}

/* ********Adoration Page Masss Times******* */

.adoration-page .mass-times-container {
    display: grid;
    grid-template-columns: 2fr 2fr 1fr;
}

.mass-times-container > div {
    height: fit-content;
    margin: auto;
    width: 100%;
}

.mass-times-container img {
    box-shadow: var(--default-box-shadow);
    border-radius: 5px;
    transition: all 250ms ease-in-out;
}

.adoration-page .header-title {
    display: none;
}

.adoration-page .mass-times-container p {
    margin-bottom: 0;
}

.mass-times-container img:hover {
    transform: scale(0.98);
    transition: all 250ms ease-in-out;
}

.mass-times-container h6 {
    margin: 0;
    line-height: 1.5;
    margin-bottom: 1rem;
    font-size: 1.75rem;
}

@media (max-width: 50.99rem) {

    .adoration-page .mass-times-container {
        display: grid;
        grid-template-rows: 1fr 1fr 2fr;
        gap: 1rem;
        grid-template-columns: 1fr;
    }

    .adoration-page .mass-times-container img {
        width: 50%;
        height: auto;
        margin: auto;
    }

    .adoration-page .mass-times-container > div:last-child > a {
        display: grid;
        justify-content: center;
        align-items: center;
    }
}