@import url('//fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,400;0,700;1,400;1,700&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');

/************
/************ TEMPLATE  ************
Rotator Size: 1000x563 (wide, 16:9)

/************ FONTS  ************
Serif: Libre Baskerville
Sans Serif: Lato
font-family: 'Lato', sans-serif;
font-family: 'Libre Baskerville', serif;

/************ COLORS  ************
Blue (now gold): #C4AA39; rgba(196,170,57,1)
Light Blue (now dark blue): #191971; rgba(25, 25, 113,1)
Grey: #D1D3D4; rgba(209,211,212,1) - only really used for description rotator text
Light Grey: #F1F2F2

/************ NOTES ************
Menu bar - light blue 90% - rgba(25, 25, 113,.9)
QL - light blue 80% - rgba(25, 25, 113,.8)
Rotator text bg - blue 80% - rgba(196,170,57,.8)
Drop/box shadow on: menu bar, rotator, ql, news

/************ UPDATING COLORS 2024 ************
navy: #191971 rgba(25, 25, 113, 1)
gold: #C4A938 rgba(196, 169, 56, 1)



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

body {color: #1c1c1c; font-family: 'Lato', sans-serif;}

h1, h2, h3, h4, h5, h6 {margin: .75rem 0; line-height: 1.3; font-weight: normal;}
p {line-height: 1.3;}
.page-header h1 {text-transform: none; font-size: 3rem;}
h1 {color: #001940; font-size: 3.5rem; font-weight: bold; font-family: 'Libre Baskerville', serif;}
h2 {font-variant-caps: small-caps; color: #C4AA39; font-size: 2.5rem; font-family: 'Libre Baskerville', serif; font-weight: bold;}
.page-header h2 { padding-bottom: 0.25rem; line-height: 2.5rem;}
h3 {color: #C4AA39; font-size: 2rem; border-bottom: 1px solid #D1D3D4;  line-height: 1.3; margin: 0 0 10px 0;}
h3.lato {font-family: 'Lato', sans-serif;}
h4 {color: #001940; font-size: 2rem;}
h4.lato {font-family: 'Lato', sans-serif;}
h5 {background: rgba(25, 25, 113,0.9); font-size: 1.75rem;color: white; border-radius: .3rem; padding: .5rem;}
h6 {color: #C4AA39; font-size: 1.5rem; text-transform: uppercase; font-weight: bold;}
h6.mixed { text-transform: none;}
a {color: #191971;}
a:hover {color: black;}

h3.g-title {background: rgba(25, 25, 113,0.9); font-size: 1.5rem;color: white; border-radius: .4rem; padding: .5rem; font-weight: 400;}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
    h1 {font-size: 2.2rem;}
    h2 {font-size: 1.75rem;}
    h3 {font-size: 1.75rem;}
    h4 {font-size: 1.75rem;}
    h5 {font-size: 1.2rem;}
    h6 {font-size: 1.2rem;}
    p {font-size: 1rem; margin-bottom: 4px;}
    h1, h2, h3 {line-height: 1.2;}
    h4, h5, h6, p{line-height: 1.1;}
}

@media only screen and (max-width: 767px) {
 h1 {font-size: 2.2rem;}
 h2 {font-size: 1.75rem;}
 h3 {font-size: 1.75rem;}
 h4 {font-size: 1.75rem;}
 h5 {font-size: 1.2rem;}
 h6 {font-size: 1.2rem;}
 p {font-size: 1rem; margin-bottom: 4px;}
 h1, h2, h3 {line-height: 1.2;}
 h4, h5, h6, p{line-height: 1.1;}
}

.readon, .button, .btn, p.readmore .btn, .sprocket-lists-portrait-container > li .sprocket-lists-portrait-item > a span, .listentobutton.moduletable a {
    background: #191971;
}
.button {font-family: 'Lato', sans-serif;}

/*************** HOMELAYOUT ***************/
/*************** OFFCANVAS ****************/
/*************** TOP **********************/

#g-top .g-content {padding: 0.5rem;}

#g-top {
	background: url('/images/template/bg-mary.jpg') 0 0 no-repeat;
    padding-bottom: 50vw!important;
    margin-bottom: -50vw;
    background-size: 60%;
}

/*******image still in header on subpages*********

#g-top .g-logo img {margin-left: 2vw; margin-bottom: -4vw;}

/************accounting for ipad dimensions**************/
@media only screen and (max-width: 49rem){
	.hiddenphone { display: none !important;}
}

@media only screen and (max-width: 767px){
	#g-top {padding-bottom: 0 !important;}
	.g-logo img {width: 60%;}
    .homelayout #g-top {background: none; margin: 0; padding: 0; padding-bottom: 0 !important;}
    #g-top {background: none; margin: 0; padding: 0;}
    #g-top .g-logo img {margin: 0;}	
}
/*************** NAVIGATION ***************/

#g-navigation {border-bottom: 2px solid rgba(196, 170, 57 0.9); box-shadow: 1px 1px 5px rgb(0 0 0 / 40%);}

/**Clarity dropdown- remove border-radius on menu dropdowns:***
.g-main-nav .g-standard .g-dropdown {border-radius: 0px;}
.g-main-nav .g-dropdown .g-dropdown-column>.g-grid>.g-block.size-100 {border-radius: 0px;}
.g-main-nav .g-dropdown .size-100>.g-sublevel>li.g-go-back+li>.g-menu-item-container {
 border-top-left-radius: 0px;
 border-top-right-radius: 0px;
}
.g-main-nav .g-dropdown .size-100>.g-sublevel>li:last-child>.g-menu-item-container {
 border-bottom-left-radius: 0px;
 border-bottom-right-radius: 0px;
}***/

/*Clarity- remove top level dropdown indicatator***/
.g-main-nav .g-toplevel > li.g-parent .g-menu-parent-indicator {display: none;}
/*clarity increase menu font size, remove capitalization***/
.g-main-nav .g-toplevel>li>.g-menu-item-container>.g-menu-item-content {font-size: 1rem; letter-spacing: 0.1rem; font-weight: 600;}
/**.g-main-nav .g-toplevel {text-transform: none;}**/
.g-main-nav {font-family: 'Lato', sans-serif;}

.ministrypage .item .page-header {
	order: unset;
}

/*************** SLIDESHOW ****************/
/*************** HEADER *******************/
#g-header {padding: 0 10%;}
.scseperateback .sprocket-features-content { background: rgba(196,170,57,.8);}

/*.scseperateback .sprocket-features-desc:is(h1,h2,h3,h4,h5,h6)*/
.scseperateback .sprocket-features-desc h1, 
.scseperateback .sprocket-features-desc h2, 
.scseperateback .sprocket-features-desc h3,
.scseperateback .sprocket-features-desc h4,
.scseperateback .sprocket-features-desc h5, 
.scseperateback .sprocket-features-desc h6 {
	font-size: 1.6vw; 
	letter-spacing: 2px;
	color: #ffffff; 
	text-transform: none; 
	font-weight: 600; 
	line-height: 1.3; 
	font-family: 'Lato', sans-serif;
	margin-bottom: 3vw;
}
.scseperateback .sprocket-features-content p {font-size: 1.2vw;}
.scseperateback .sprocket-features-content a {color: white;}

.scthird.scwide .layout-showcase .sprocket-features-img-container img {width: 57vw;  height: 31vw;}
.scthird .layout-showcase .sprocket-features-content, .schalf .layout-showcase .sprocket-features-content {padding: 0 2vw;}

/************accounting for ipad dimensions**************/
@media only screen and (max-width: 47rem) {
	#g-header {padding: 0;}
	#g-header .g-content {padding: 0;}
	.scthird.scwide .layout-showcase .sprocket-features-img-container img {width: 100vw;  height: 56vw;}
	.scthird .layout-showcase .sprocket-features-content, .schalf .layout-showcase .sprocket-features-content {
    flex: auto; min-height: 60vw; padding: 0 10vw;}
	.scseperateback .sprocket-features-content { margin-right: 0;}
	.scseperateback .sprocket-features-content p {font-size: 4.5vw;}
	.scseperateback .sprocket-features-desc h1, 
	.scseperateback .sprocket-features-desc h2, 
	.scseperateback .sprocket-features-desc h3,
	.scseperateback .sprocket-features-desc h4,
	.scseperateback .sprocket-features-desc h5,
	.scseperateback .sprocket-features-desc h6 {font-size: 5vw; margin-bottom: 4vw;}
	
}

/*************** ABOVE ********************
#g-above .g-content {padding: 0;}*/
.qloverlaybackpic .sprocket-strips-content {background: rgba(25, 25, 113,.8);}
.qloverlaybackpic .sprocket-strips-content:hover {background: rgba(25, 25, 113,.6);}
#g-above .sprocket-strips-container > li {margin: 10px 0;}
.qloverlaybackpic h4 {font-family: 'Lato', sans-serif; font-size: 1.25rem; text-transform: uppercase; font-weight: 600; letter-spacing: 2px;}

@media only screen and (max-width: 767px) {
	/*.qloverlaybackpic .sprocket-strips-content, .qloverlaybackpic .sprocket-strips-content:hover {background: none;}*/
	.qloverlaybackpic li {background: rgba(126,20,22,1);}
    .qloverlaybackpic li:hover {background: black;}
}


/*************** UTILITY ******************/
/*************** FEATURE ******************/
#g-feature h2 {font-size: 2rem; font-variant: none; font-weight: 400;}
#g-feature p {font-size: 1.1rem;}
#g-feature .readon {color: #191971; background: none; text-transform: uppercase; font-weight: 600; }
#g-feature .readon:hover {color: #C4AA39; background: none; text-transform: uppercase; font-weight: 600; }

.outline-19 #g-feature h4 {color: white;}
.outline-19 #g-feature a {color: white;}
.outline-19 #g-feature a:hover {color: #191971;}
.outline-19 #g-feature .imagehover a:hover img {transform: scale(1.15); transition-duration: 1.25s; }


/*************** SHOWCASE *****************/
.rsphotoblocknews .sprocket-strips-item .readon:hover { background: rgba(196,170,57,0.95); }
.rsphotoblocknews .sprocket-strips-content h4 {background: rgba(196,170,57,0.85); font-family: 'Lato', sans-serif; font-size: 1.5rem; }
.rsphotoblocknews .sprocket-strips-item { background-image: url(/images/stories/template/default-news.jpg); }

@media only screen and (max-width: 767px) { .rsphotoblocknews .sprocket-strips-content h4, .rsphotoblocknews .sprocket-strips-item .readon:hover { top: 0; background: #174C72; } }



/*************** EXPANDED *****************/
.outline-18 #g-expanded {
	background: url('/images/template/crest-10.png') 0 100% no-repeat;
    background-size: 30%;
}
.outline-19 #g-expanded {
	background: url('/images/template/crest-10.png') 5% 95% no-repeat;
    background-size: 30%;
}

/**** UPCOMING EVENTS ****/
.rme-badge {
display: flex;
flex-direction: column;
justify-content: center;
font-family: 'Lato', sans-serif; font-weight: bold ;
background: #C4AA39;
border-radius: 3px;
color: white;
padding: 5px 0px;
width: 55px;
float: none;
margin-bottom: 0px;

}
.rme-items { display: block;}
.rme-description { flex: 1;}
.rme-day, .rme-month { text-transform: none;}
.rme-day { font-size: 1.4rem;}
.rme-month { font-size: 1.3rem; }
.rme-title { font-size: 1.1rem; font-weight: normal;}
.rme-time { font-size: 1rem; font-weight: 400;}
.rme-items li {
display: flex;
background: none;
border: none;
margin: 7.5px 0px;
padding: 7.5px 0px;
}

@media only screen and (max-width: 767px) {
.rokminievents3 { display: flex; justify-content: center; }
.rme-items li { margin-top: 0px; margin-bottom: 0px; padding-top: 5px; padding-bottom: 5px;}
.rme-title { font-size: 1.1rem; }
.rme-time { font-size: 1.1rem; }
.rme-day { font-size: 1.5rem;}
}
/************ move ads higher on mobile  ************/
/***reorder columns in a container***/
@media only screen and (max-width: 767px) {
	#g-expanded .g-block:first-child  { order: 2; }
	#g-expanded .g-block:last-child { order: 1; }
	#g-expanded .g-block:nth-child(2) { order: 3; }
}


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



/*************** BOTTOM *******************/
/*************** FOOTER *******************/
/*************** COPYRIGHT ****************/

/*************** MODULES ******************/
.moduletable .nav.menu, .moduletable .unstyled {background: #C4AA39;}
.moduletable .nav.menu li.current.active a, .moduletable .nav.menu li a:hover {
    color: #ffffff;
    background: #191971;
}

/*************** SECTIONS *****************/
#g-footer a {color: #ffffff;}
#g-footer h3 {border-bottom: none;}
#g-footer p {font-family: 'Lato', sans-serif;}

/*************** MOBILE *******************
.g-offcanvas-toggle {color: #ffffff;}**/
@media only screen and (max-width: 51rem){
.g-offcanvas-toggle .fa-fw {
    text-shadow: none;
}}

/*************** ADS **********************/
/************ COLORS  ************
Blue: #C4AA39; rgba(196,170,57,1)
Light Blue: #191971; rgba(25, 25, 113,1)
Grey: #D1D3D4; rgba(209,211,212,1) - only really used for description rotator text
Light Grey: #F1F2F2**/


.item-image {
    display: none;
}

.homelayout #g-above {
	padding-left: 5% !important;
	padding-right: 5% !important;
}

@media (min-width: 50.99rem) {
	.homelayout .widthvw15 .sprocket-strips-item {
		width: 14vw !important;
	}
}

/*  */

.homelayout #g-showcase > div > div > div {
	padding: 0;
	margin: 0;
}

.homelayout #g-showcase {
	padding: 2.5% 5% !important;
}

@media (min-width: 50.99rem) {
	.grid-articles .g-content-array > .g-grid {
		margin: 0;
		padding: 0;
		flex: 1;
		min-width: 23% !important;
		width: 23% !important;
		max-width: 23% !important;
		position: relative;
		transition: var(--grid-transition);
	}

	.grid-articles {
		--grid-items-justify: space-between !important;
	}

	.homelayout #g-showcase .grid-articles {
		padding-bottom: 2% !important;
	}

	.homelayout #g-expanded > div > div.g-block.size-45 > div {
		padding-left: 0 !important;
		margin-left: 0 !important;
	}
}

.homelayout #g-showcase .grid-articles .g-title {
	padding-bottom: 2% !important;
	color: #30307f;
	font-size: clamp(1.75rem, 2.5vw, 3.5rem);
}

.homelayout #g-header {
	padding: 0 7.25% !important;
}

.homelayout #g-feature > div > div > div {
	padding: 0;
	margin: 0;
}

.homelayout #g-above {
	padding-bottom: 2% !important;
}

.homelayout .sprocket-features-desc p {
	color: white;
}

.homelayout .scseperateback .sprocket-features-content {
	background-color: rgba(196, 170, 57, 0.85);
	backdrop-filter: blur(2px);
}

.homelayout #g-expanded {
	padding: 2.5% 5% !important;
}


.moduletable .nav.menu li, .moduletable .mostread li, .moduletable .latestnews li, .moduletable .archive-module li, .moduletable .relateditems li, .moduletable .categories-module li, .moduletable .category-module li, .moduletable .latestusers li, .moduletable .unstyled li {
	border-bottom: 1px solid white;
}

.moduletable .menu > li {
	background-color: #30307f;
}

.moduletable .menu > li.active {
		background-color: rgba(196, 170, 57, 1);
}