/* === custom.css === */ 
/* === Parish website administrators may include === */
/* === custom css updates for their website in the space below. === */

@import "directory.css";
@import "hovercards.css";
@import "ipa.css";

a { color: #005F86;}

h1, h2, h3, h4, .card h5 { text-transform: uppercase; font-family: sans-serif !important; font-weight: 200;  }
h1, h3 { color: #b4872d; }
h2, h4 { color: #005e85; }

.carousel-caption h1 { color : #fff; }
footer h4 { color: #fff; text-transform: none; }

.royal-bg { background-color: #005F86; }
.gray-bg { background-color: #eee; }

.royal-bg .card, .royal-bg .card .card-footer, .gray-bg .card, .gray-bg .card .card-footer { background: none; border: none; }

.royal-bg .card .card-title { color: #9e8151; }
.gray-bg .card .card-title { color: #005F86; }

.royal-bg .card .card-text { color: white; }
/*.royal-bg .card { flex-direction: row !important; }*/
.royal-bg .card .card-img-top { width: 50% !important; }
.royal-bg .card .btn-primary { background-color: #9e8151; }
.royal-bg .card .btn-primary:hover { background-color: #b4872d; }

.prayer_corner_icon { padding: 14px; min-width:200px; }
.prayer_corner_visit { font-size: 0.8em;}
.prayer_corner_switch { text-align: right; font-size: 0.8em;}
.card-text { line-height: 1.75rem; }

 .main-page-content a {
     color: #0056b3;
 }

.ctct-form-button:hover { background-color: #9e8151 !important;}

footer a:hover { color: var(--highlight-color); }

.carousel-indicators {
  bottom: 30px;
}

.carousel-caption {
  bottom: 5rem;
}

header .horizontal-nav {
  background-color: transparent;
  border: none;
  width: 90%;
}

#site-name {
  font-size: 1.2rem !important;
}

header nav a:hover {
  background-color: #c2ab6b;
  background-color: var(--accent-color) !important;
  color: #fff;
}

.carousel-caption {
  background: rgba(0,0,0,.7);
}

header .header-mask {
  background: linear-gradient(to bottom,rgba(0,0,0,.85) 10%,rgba(0,0,0,0) 100%);
  height: 25vh;
}


header nav .dropdown-menu, footer, #offcanvas {
  background: #005F86;
}

#powered-by {
  background-color: rgb(158,129,81);
}

.text-left {
  background-image: url(/assets/template-elements/logos/assembly-logo-transparent-bg.png);
  background-size: contain;
  z-index: 3; 
  background-position: left 28%;
  background-repeat: no-repeat;
  min-height: 100px;
  min-width: 28%;
  padding: 10px 10px 10px 100px !important;
}

@media (max-width:767px) {
	.text-left { width: 95%; padding-top:15px; display:block; }

}

@media (max-width:500px) {
	header {	background-size: 175% !important;	}
	.text-left { min-width: 40%;  }
}

@media (max-width:380px) {
	header {	background-size: cover !important;	}
}

.center {
  text-align: center;
}

.singlecard { position: relative; background-size: cover; width: 254px; height: 254px; }
.singlecard .overlay { box-shadow: inset 0 0 0 1000px rgba(0,0,0,.55); height: 100%; }
.singlecard .overlay a { display: block; width: 100%; height: 100%;}
.singlecard:hover .overlay { box-shadow: inset 0 0 0 1000px rgba(0,0,0,.175); }
.singlecard a { text-decoration: none; }
.singlecard a:hover { text-decoration: none;  }
.singlecard-title-comm { width: 100%; font-size: 1.5rem; font-family: var(--primary-font); font-weight: bold; position: absolute; padding: 3%; text-align: center; text-transform: uppercase; color: white; display: block; bottom: 5%; text-shadow: 1px 1px 3px #000000; }
.singlecard-title-schools { width: 100%; font-size: 0.95rem; font-family: var(--primary-font); font-weight: bold; position: absolute; padding: 3%; text-align: center; text-transform: uppercase; color: white; display: block; bottom: 5%; text-shadow: 1px 1px 3px #000000; }

@media(max-width: 1199px){
  .singlecard { width: 210px; height: 210px;  }
}

@media(max-width: 991px){
  .singlecard { width: 330px; height: 330px;  }
}

@media(max-width: 767px){
  .singlecard { width: 100%;  }
}

.news-body {
	border-bottom: 1px solid #ccc;
	padding-bottom: 1em;
	display: flex;
}

.news-body img {
	width: auto;
	height: 100px; 
	margin-right: 15px;
}

#ListservSubscribeForm input {
	margin-top: 2px;
	margin-bottom: 2px;
}

#ListservSubscribeForm select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0 24px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

#stay-connected-social {
  	padding-top: 10px;
 	display: flex;
  	justify-content: space-around;
}

.staff-grid {
 	display: flex;
  	justify-content: space-between;
  	flex-wrap: wrap;
}

.staff-grid .person {
 	width: 23%;
  	border: 1px solid #ccc;
  	margin-bottom: 15px;
}

.staff-grid .person img {
  width: 100%;
}

.staff-grid .person p {
  	text-align: center;
  	margin: 0;
}

.staff-grid .person p.name {
 	font-weight: bold; 
}

.card * { max-width: 100%; }

/* ---------- Graphics Buttons --------- */

.graphic-button { position: relative; width: 45%; height:200px; float: left; margin: 10px; padding: 0;  }
.graphic-button .gb-title { position: absolute; color: black !important; background-color: rgba(255,255,255,0.8); width: 100%; text-align:center; bottom: 30px; font-size: 1.4em; }
.graphic-button .gb-title a { color: black !important; text-decoration: none; }

.graphic-button .gb-title { position: absolute; }

/* ---------- Alert Banner --------- */

.alert-banner	{	background-color: #990000; color: white; font-weight: normal; text-align: center; padding: 25px; font-size: 1.4em;	}
.alert-banner:hover	{	background-color: red;	}
.alert-banner a	{	color: white !important; text-decoration: none; word-break: normal !important; hyphens: none !important;}
