/************ BASE  ************/
@media only screen and (min-width: 1200px) { html {font-size: 100%;} }
@media only screen and (min-width: 960px) and (max-width: 1199px) { html {font-size: 90%;} }
@media only screen and (min-width: 768px) and (max-width: 959px) { html {font-size: 80%;} }

/************ FONT ITEMS  ************/

body { color: #333; font-size: 1.1rem;  }
h1, h2, h3, h4, h5, h6 { margin: .75rem 0; line-height: 1; font-weight: normal;}
p { line-height: 1.3; font-size: 1.1rem; }

/************ DEFAULT FONT ITEMS  ************/
blockquote {
   color: #333;     
   padding: 0 0 0 15px;
   margin: 0 0 20px;
   border-left: 5px solid #d5d5d5;
   font: italic 16px/22px Georgia, Serif;
   line-height: 1.2;
   font-size: 1.3rem;
}

address {
   font-style: italic;
   font-weight: bold;
   font-size: 1.2rem;
   line-height: 1.2;
}

/************ BUTTONS  ************/
.readon, .button, .btn, p.readmore .btn, .listentobutton.moduletable a, .newsflashlistentobutton2 a:last-child  { 
 color: white; 
 font-size: 1rem;
 text-transform: none;
 font-weight: normal;
 background: #333; 
 padding: .7rem 1.3rem; 
 border-radius: .5rem; 
 margin: 0;
 display: inline-block;
 line-height: 1;
 border: none;
 transition: all .2s ease-in;
}

.readon:hover, .button:hover, .btn:hover,  p.readmore .btn:hover, .listentobutton .moduletable a:hover {background: #777; color: white;}
.readon a, .button a, .btn a, p.readmore a, .btn a {color: white;}
.btn .icon-chevron-right { display: none;}

.centertext h1,
.centertext h2,
.centertext h3,
.centertext h4,
.centertext h5,
.centertext h6,
.centertext p,
.centertext a,
.centertext {
   text-align: center; 
}
.centertext img { margin: auto;}

.buttontoplainlink { background: none; padding: 0; margin: 0; }

.cursorpointer { cursor: pointer; }

/************ TABLES  ************/
.fancytable th {color: white; background: #333; border: 1px solid #333;}
.fancytable td { border: 1px solid #333;}


/************ ABILITY TO HIDE on HOME  ************/
.homelayout .hiddenhome {display: none; }
body:not(.homelayout) .showhome { display: none; }
p.buttonheading { margin: 0; padding: 0; }

/************ TABLES  ************/
table {width: auto;}
.fancytable th {padding: 5px; }
.fancytable td {padding: 5px 10px; }

.equaltable { width: 100%; display: table; table-layout: fixed;}
table.flextable, .flextable tbody, .flextable tr { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-around;}
.equaltable td {width: 2%;}
.equaltable td, .equaltable tr, table.equaltable, .flextable td, .flextable tr, table.flextable {border: none;}

.flextable { display:flex; }
.flextable.equalcells > div { flex: 1; }
.flextable.spacedcells > div { padding-right: 20px; }
.flextable.flexcolumn { flex-direction: column; }
.flextable.spacedcells > div:last-child { padding-right: 0; }
.flextable.border > div { border: 1px #ddd solid;  padding: 20px;}
.flextable.centervertically, .centervertically { align-items: center; }
.centercellvertically { align-self: center; }
.flextable.centerhorizontally { justify-content: center; }
.centercellhorizontally { justify-self: center; }
.boxshadow { box-shadow: 0px 0px 8px rgba(0,0,0,.5); margin: 10px 20px;}
.flextable.wrapitems { flex-wrap: wrap; }

 
@media only screen and (max-width: 767px){ 
  .equaltable, .equaltable div, table.flextable, table.flextable div, .fancytable, .fancytable div,  .fancytable tr, .fancytable td, .equaltable, .equaltable td,  table.flextable td, table.flextable tbody, table.flextable tr, .equaltable tbody, .equaltable tr{ display: block; table-layout:auto; width: 100%; border: none; margin: 0;}
  #g-container-main .equaltable img { display: block; margin: 0 auto; width: 100%;}  
  .flowflexonmobile.flextable { display:flex; flex-wrap: wrap;}
  .flowflexonmobile.flextable > div {  min-width: 40%;}
  .blockonmobile.flextable { display:block;}
  .flextable.reverseonmobile { flex-direction: column; }
  .flextable.reverseonmobile > div:nth-child(4) { order: 1;}
  .flextable.reverseonmobile > div:nth-child(3) { order: 2;}
  .flextable.reverseonmobile > div:nth-child(2) { order: 3;}
  .flextable.reverseonmobile > div:nth-child(1) { order: 4;}
  .flextable.spacedcells > div { padding-bottom: 20px; padding-right: 0px;}
  .flextable.spacedcells > div:last-child { padding-bottom: 0px; }
  .flextable.columnonmobile { flex-direction: column; display: flex;  }
  .flextable.rowonmobile { display:flex; flex-wrap: none;}
  body:not(.homelayout) .hidesubpagesmobile { display: none; }
  
} 

/************ ALERT ************/
.alert .g-content {padding: 0; margin: 0;}
.alert {border: none; padding: 0; margin: 0; background-color: #FFCFCF; color: #FF0000;}
.alert h1, .alert h2, .alert h3, .alert h4, .alert h5, .alert h6, .alert p { margin-left: 20px; color: red; background: transparent;}
.alert .platform-content { padding: 0; margin: 0; }
.alert h2.contentheading { padding-top: 15px; }

.parish-alert .g-content {padding: 0; margin: 0;}
.parish-alert {border: none; padding: 0; margin: 0; background-color: transparent;}
.parish-alert :is(h1, h2, h3, h4, h5, h6, p) {margin-left: 20px; color: inherit; background: transparent;}
.parish-alert .platform-content {padding: 0; margin: 0;}
.parish-alert h2.contentheading {padding-top: 15px;}


/************ HERO IMAGE ************/
.hero p { margin: 0; }
.hero img { height: 24vw; object-fit: cover; width: 100%; opacity: 0.35; }

@media only screen and (max-width: 767px) { 
   .hero img { height: 24vw; }
}

/************ DOCMAN ************/
.docman_download__info {display: none;}
.doclink .docman_download__info {display: none;}
.k-ui-namespace .k-js-grid-controller koowa_table_list > .docman_block > h3.koowa_header { display: none; }
.k-ui-namespace .mod_docman ul li .koowa_header { padding: 0 0 2px 15px; display: flex; }
.doclink span:last-child { display: none;}
.table-striped tbody tr:nth-child(2n+1) td, .table-striped tbody tr:nth-child(2n+1) th { background: rgba(0,0,0,.1); }
.k-ui-namespace .koowa_header:before, .k-ui-namespace .koowa_header:after { display: none; }
.k-ui-namespace .koowa_header, 
.k-ui-namespace .koowa_header__item,
.k-ui-namespace .koowa_wrapped_content,
.k-ui-namespace .mod_docman ul  { display: inline-block; width: auto;}
.k-ui-namespace .mod_docman ul li .koowa_header { padding: 0 0 2px 0;}
.k-ui-namespace .mod_docman ul .module_document__info { display: none; }
.k-ui-namespace .mod_docman.mod_docman--documents { display: flex; justify-content: center; }
.k-ui-namespace .mod_docman_icons { padding-bottom: 10px;}


/************ GET RID OF SIDE COLUMNS  ************/
.g-block.remove-column { flex: 0%; width: 0%;}
.g-block.fullwidth-column {  flex: 0 100%;  width: 100%;}

/************ MAKE THE ROTATOR NOT JUMP  ************/
.sprocket-features-img-container {width: 100%;}

/************ CANIDATE FOR BASE STYLE  ************/
.removecontentbuffer .g-content { margin: 0; padding: 0;}
.rmtopbotcontentbuffer .g-content { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0;}
.rmleftrightcontentbuffer .g-content {margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0;}

/************ ALIGN IMAGES CORRECTLY  ************/
img[align="left"], img[style*="float:left"], img[style*="float: left"], .pull-left {padding-right: 10px;}
img[align="right"], img[style*="float:right"], img[style*="float: right"], .pull-right {padding-left: 10px;}

/************ BREADCRUMB  ************/
.breadcrumb span.divider:before { line-height: 1.3; }
.breadcrumb li:nth-child(2) .divider {display: inline-block; }

.breadcrumb > li > .divider { margin-right: .25em; padding: 0 5px;}
.moduletable .nav.menu li a:before, .moduletable .mostread li a:before, .moduletable .latestnews li a:before, .moduletable .archive-module li a:before, .moduletable .relateditems li a:before, .moduletable .categories-module li a:before, .moduletable .category-module li a:before, .moduletable .latestusers li a:before, .moduletable .unstyled li a:before {display: none;}

/************ FIX FOR IFRAMES ON IOS Devices ************/
@media only screen and (max-width: 767px) {
  /* iframe {width: 1px; min-width: 100%; } */
}

/************ MODULE HELPERS  ************/
.topright { position: absolute; right: 0; top: 0; }

.marginzero { margin: 0; }

.align-right .g-content { padding-left: 0px; padding-right: 0px;}

.shrinkgcontent .g-content { padding: 0; margin: 0;}
.shrinkplatformbuffer .platform-content { padding: 0; margin: 0;}

/************ MAKE FILEMAN LINKS HAVE ICON BEFORE TEXT  ************/
a[href*="?option=com_fileman"]:before {    
  content: "\f1c1";
    font-family: FontAwesome;
    margin-right: 10px;
    display: inline;
  font-weight: normal;
}

/************ SMOOTH SCROLL  ************/
html { scroll-behavior: smooth; }

.centertitle .g-title,
h1.centertitle,
h2.centertitle,
h3.centertitle,
h4.centertitle,
h5.centertitle,
h6.centertitle
{text-align: center; padding-left: 0px; padding-right: 0px; margin-left: 0px; margin-right: 0px;}

.platform-content .moduletable.moveintoabovemodule { margin-top: -40px;}

[name="spacer"] { display: none !important; }

/************ HEIGHT CLASSES  ************/
.fullheight { height: 100vh;}
.ninetyheight { height: 90vh;}
.eightyheight { height: 80vh;}
.seventyheight { height: 70vh;}
.sixtyheight { height: 60vh;}
.fiftyheight { height: 50vh;}
.fortyheight { height: 40vh;}
.thirtyheight { height: 30vh;}
.twentyheight { height: 20vh;}
.tenheight { height: 10vh;}

/************ WIDTH CLASSES  ************/
.fullwidth { width: 100vw;}
.ninetywidth { width: 90vw;}
.eightywidth { width: 80vw;}
.seventywidth { width: 70vw;}
.sixtywidth { width: 60vw;}
.fiftywidth { width: 50vw;}
.fortywidth { width: 40vw;}
.thirtywidth { width: 30vw;}
.twentywidth { width: 20vw;}
.tenwidth { width: 10vw;}

/************ PADDING CLASSES  ************/
.pad10sides { padding-left: 10%; padding-right: 10%;}

/************ 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;  }
.flexrow > div { flex: 1;}

.justifycontentcenter { justify-content: center !important; }

@media only screen and (max-width: 767px) {
   .flexrow { flex-wrap: wrap;   }
   .flexrow > div { padding-bottom: 20px;}
   
   .flexrow.force { display: flex; }
   .flexrow.blockonmobile { display: block; }
}



/************ MINISTRY PAGE  ************/
.ministrypage .item { display: flex; flex-direction: column; }
.ministrypage .item .pull-left.item-image { order: 1; }
.ministrypage .item .pull-left.item-image img { border-radius: 4px; box-shadow: 2px 2px 5px rgba(0,0,0,0.2); }
.ministrypage .item .page-header { order: 2; }
.ministrypage .item table { order: 3; margin: 5px 0 20px 0; }
.ministrypage .item p { order: 4; }
.ministrypage .pull-left.item-image { margin: 0; padding: 0;}

.ministrypage .page-header h2 {
   line-height: 1.2;
   font-weight: 400;
   font-size: 1.7rem;
   border-bottom: 2px solid #E2EDE9;
   margin: 3px 0 0 0;
   padding: 0;
}


.ministrypage .nav.menu a { word-break: normal; }
.ministrypage h2 a { word-break: normal; }

.btn [class^="icon-"] { display: none; }

.blogministrypage .row-fluid {
   border-bottom: solid 15px #f5f5f5;
   margin-bottom: 15px;
}
.blogministrypage .row-fluid:last-child {
   border-bottom: none; 
} 

@media only screen and (max-width: 767px) {
   .ministrypage .item { padding-bottom: 30px;}
   .ministrypage .item .pull-left.item-image img  { width: 75%;}
   .blogministrypage .row-fluid { border: none; margin-bottom: 0px;}
}


/************ ROK MINI EVENTS  ************/
.rme-items li, .rme-timeline-bar, .rme-arrow {
   background: none; 
   border: none;
}
.rme-items li { padding: 0; margin: 15px 0 30px 0; clear:both; }
.rme-badge {
   background: #333;
   color: white;
   width: 58px;
   margin-right: 10px;
   margin-bottom: 10px;
   padding: 5px;
   font-weight: normal;
   display: block;
   float: none; 
}
.rme-timeline-point:hover, .rme-timeline-point.active, .rme-timeline-point span { background: #333; } 
.rme-arrow { color: #333; } 
.rme-date {display: none; }
.rme-day { font-size: 1.5rem; }
.rme-title {
   font-size: 1rem;
   font-weight: normal;
}
@media only screen and (max-width: 767px) {
   .rme-badge { float: left;  padding: 2px;}
   .rme-day { font-size: 1.4rem;}
   .rme-items li { margin: 0; }
   .rme-timeline { display: none;}
   .rme-items { padding-top: 15px;}
}

/************ PODCAST  ************/
.listentobutton.moduletable a:nth-child(3) {
   background: inherit;
   color: inherit;
   padding: inherit;
   display: inherit;
}


/************ SIMPLE PARALAX  ************/
.simpleparalax, .simpleparallax{
   background-color: white !important;
   background-attachment: fixed !important;
   background-position: 50% 0% !important;
   background-repeat: no-repeat !important;
   background-size: cover !important;
}


/************ SPECIAL MOBILE ITEMS  ************/
@media only screen and (max-width: 767px) {
   .inrowonmobile { display: flex; justify-content: space-between; }
   .inrowonmobile div:first-child { padding-right: 20px; }
   .hiddenmobile, .hiddenphone { display: none !important; }
}

@media only screen and (min-width: 768px) {
   .showmobile { display: none; }
}

/************ IMAGES  ************/
img.thumbnail { width: 200px; height: 200px; box-shadow: 2px 2px 5px rgba(0,0,0,.5); border-radius: 10px; }

/************  FOOTER  ************/
.adminfooter { position: absolute; bottom:20px;  right:20px; text-align:right; }
.sitebysolutio {color: #444444; font-size: x-small; }
.adminfooter a  {color: #aaa;}

@media only screen and (max-width: 767px) {
   .adminfooter { display: none; }
}

/************ BACKGROUND VIDEO  ************/
.videocontainer { position: relative; }

video.widevideo {  height: 56vw;}
video.superwidevideo {  height: 42vw;}
video.ultrawidevideo {  height: 28vw;}
video.background-video {
   width: 100%;
   object-fit: cover;
   object-position: center;
   background-color: rgba(0, 0, 0, 0) !important;
} 

/************ OVERLAY  ************/
.overlayitem { position: absolute; top:0; bottom:0; left:0; right:0; z-index: 99;  }
.centercontent { display: flex; align-items: center; justify-content: center; }
.whitetext h1,
.whitetext h2,
.whitetext h3,
.whitetext h4,
.whitetext h5,
.whitetext h6,
.whitetext p
{ color: white; }

.adminfootericon { position: absolute; bottom: 10px; right: 10px; text-align: right; }
.adminfootericon p { padding: 0; margin: 0;}

@media only screen and (max-width: 767px) {
   .adminfootericon img { display: none; }
   .adminfootericon .fa-lock { display: none; }
}

/************ HIDDEN ON SCROLL  ************/
.sticky .hiddenonscroll { display: none; }

/************ LEGACY BOXES  ************/
#g-aside .moduletable.box2.title1 { padding: 0.5rem;}

/************ ALTERNATE ROWS  ************/
/**** Create a nice looking table with alternating rows *****/
.alternaterows td { padding: 5px 10px;}
.alternaterows tr:nth-child(even) {background: #fff; border-bottom: 1px solid #ddd;}
.alternaterows tr:nth-child(odd) {background: #e8e8e8; border-bottom: 1px solid #ddd;}

/**** Create a nice looking table with alternating rows *****/
.alternaterowsm  {width: 100%;}
.alternaterowsm tr:nth-child(even) {background: #fff; border-bottom: 1px solid #ddd;}
.alternaterowsm tr:nth-child(even):hover {background: #fafafa; border-bottom: 1px solid #ddd;}
.alternaterowsm tr:nth-child(odd) {background: #fafafa; border-bottom: 1px solid #ddd;}
.alternaterowsm tr:nth-child(odd):hover {background: #fff; border-bottom: 1px solid #ddd;}
   
@media only screen and (max-width: 767px){ 
  .alternaterowsm, .alternaterowsm div, .alternaterowsm tr, .alternaterowsm td, .alternaterowsm tbody { display: block; table-layout:auto; width: 100%; border: none; margin: 0;}
  .alternaterowsm img { display: block; margin: 0 auto; width: 100%;}  
  .alternaterowsm { display:block; }
}

.recordstable  {width: 100%; border: 2px solid #333333;}
.recordstable tr:first-child { background: #333; color: white; font-weight: bold; }
.recordstable th {color: #333; padding: 5px; background: #D9D9D9; border: 1px solid #333333;}
.recordstable td {padding: 5px 10px; border: 1px solid #333333;}


/************ TOP HEADER TABLE  ************/
.topheadertable td, .leftheadertable td { border: 1px #333 solid; padding: 5px 10px;}
.topheadertable tr:first-child { background: #333; color: white; font-weight: bold; }
.leftheadertable td:first-child { background: #333; color: white; font-weight: bold; }


.alternaterows.topheadertable td, .alternaterows.leftheadertable td { border: none; }
.alternaterows.topheadertable tr:last-child { border-bottom: 1px #333  solid; }
.alternaterows.topheadertable tbody, .alternaterows.leftheadertable tbody { border: 1px #333  solid; }



/************ PARALLAX  ************/
.parallax {
 /* Create the parallax scrolling effect */
 background-attachment: fixed;
 background-position: center;
 background-repeat: no-repeat;
 background-size: 100%;
}