/*Overrides*/
a {border-bottom:0;}
.admin-only {display:none;}
.user-logged-in .admin-only {display:block;}
b, strong {font-weight:bold;}

.main-content h2 {margin:0 0 1em;}

/*X button for modal window*/
.ui-button .ui-icon {border:1px solid red;border-radius:100%;}

.front-link {display:none !important;}
body.path-frontpage .not-front-link {display:none;}
body.path-frontpage .front-link {display:block !important;}

#header {background:#f5f5f5;}
#header .layout-container {max-width:100%;}
.region-secondary-menu {background:#bbb;}
#page, #main-wrapper {background:#F9F9F9;/*#eee;*/}

.display-inline-block {display:inline-block;vertical-align:top;margin: 0 4%;}
.width-40 {width:40%;}
.width-50 {width:50%;}

.thirds {display:inline-block;vertical-align:top;}
.one-third {width:33%;}
.two-thirds {width:66%;}
.three-thirds {width:100%;}
.position-absolute {position:absolute;top:0;}
.right-0 {right:0;}


.region-header, .region-header a, .region-header li a.is-active, .region-header .site-branding__text, .region-header .site-branding, .region-header .site-branding__text a, .region-header .site-branding a, .region-secondary-menu .menu-item a, .region-secondary-menu .menu-item a.is-active
{color:black;}

/*header region*/
#block-sundayinfoheader {    clear: none;    display: inline-block;    float: none;
    border: 1px solid #ccc;max-width:300px;    margin: 1.167em 0 1.167em 2em;box-shadow:0 0 5px;}
#block-sundayinfoheader p {margin:0;}
.sunday-info-more-button {font-weight:bold;}
#block-sundayinfoheader a {font-weight:bold;}
#block-sundayinfoheader .field--name-body {}

.tbm.tbm--mobile .tbm-collapse {width:400px;left:-340px;background:transparent;} /*Strangely broken after changing the css from commponent to theme in libraries.yml*/

/*Flexslider*/
.flexslider header {display:none;}
.flexslider .node .field--type-image {float:none;margin:0;}
.flexslider .node__content {margin:0;}
.flexslider .node--view-mode-teaser {margin:0;padding:0;border:0;}
.flex-direction-nav a {border:0;overflow:unset;width:40px;}
.flex-direction-nav a.flex-prev {width:60px;}
.flexslider .field--name-body {padding:10px;}


/*Alerts*/
.alerts {    background: white;    padding: 10px 20px;border: 5px solid brown;}
.alerts .views-row {padding-left:70px;padding-right:70px;position:relative;}
.alerts .views-row .views-field-field-announcement-type {position:absolute;left:0;}
.alerts .views-row .views-field-field-announcement-type .an-icon::before { 
    color: white;    font-size: 30px;    display: block;    width: 50px;
    text-align: center;    height: 50px;    line-height: 50px;
    border-radius: 100%;    font-weight: bold;    text-shadow: 0 0 5px black;}
.alerts .views-row .views-field-field-announcement-type .an-icon.an-type-347::before {content:'*';background:brown;padding-top:5px;height:45px;} /*general*/
.alerts .views-row .views-field-field-announcement-type .an-icon.an-type-346::before {content: '✓';background:green;} /*good news*/
.alerts .views-row .views-field-field-announcement-type .an-icon.an-type-345::before {content:'!';background:blue;}
.alerts .views-row .views-field-field-announcement-type .an-icon.an-type-344::before {content:'!';background:red;}
.alerts .views-row .views-field-field-announcement-type .an-icon.an-type-343::before {content:'!';background:orange;}
.alerts .views-row .views-field-nothing {position:absolute;right:0;top:0;}
.x-this {
    border: 2px solid red;
    border-radius: 100%;
    width: 25px;
    text-align: center;
    line-height: 25px;
    background: darkred;
    font-weight: bold;
    text-shadow: 1px 1px 3px black;
    color: white;}
.x-this-inner {}

/*Node*/
/*body*/
.field--name-body,.block-field-blocktaxonomy-termministryfield-body {background:white;padding:2% 5%;}

#block-donate {position:relative;}
#block-donate .field--name-body {padding:0;background:transparent;}
#block-donate .three-thirds {height:500px;overflow:hidden;}

/*Footer*/
footer .field--name-body {background:transparent;}

/*Home Page*/
/*Self Updating*/
.self-updating {display:inline-block;margin: 2% 1%;    background: white;    border: 1px solid #ccc;
    width: 22.5%;      vertical-align: top;box-shadow: -5px -5px 7px slategrey;}
.self-updating h2 {    text-align: center;  color: white;background:#ccc;    margin-top: 0;    padding: 10px 0;    text-transform: uppercase;    font-weight: bold;}
.self-updating .content {    padding: 10px 20px;}
.self-updating.purple h2	{background: purple;  }
.self-updating.red h2	{background: red;  }
.self-updating.green h2	{background: green;  }
.self-updating.blue h2	{background: blue;  }
.self-updating .view-content,.self-updating .teaser-body {margin-bottom:5px;min-height:140px;}
.self-updating  .read-more { margin-left:10%;font-weight:bold;   display: inline-block;    background: #0071b3;    border-radius: 30px;    line-height: 30px;    text-align: center;    width: 80%;   margin-bottom: 5%;color:white;}
.view-meal-menus .views-field-field-date {font-weight:bold;text-align:center;}

/*Node type page*/
.node--type-page .field--name-field-image {float:none;}
.node--type-page .field--name-field-image img {display:block;margin:0 auto 1em;}

/*Node type event*/
.node--type-event .field--type-image {float:none;margin:0;}
.node--type-event .field--type-image img {display:block;margin:0 auto;}
 .node--type-event .field--name-field-smart-date {display:block;width:100px;height:100px;background:#eee;border:1px solid #ccc;position:relative;float:left;margin:20px 20px 40px;padding:0px;text-transform:uppercase;}
.field--name-field-smart-date .field__item {position:relative;height:100px;margin-bottom:10px;background:darkred;color:white;padding:4px 10px;}
 .field--name-field-smart-date .day {    position: absolute;    font-size: 50px; top:20px;    left: 0;    width: 100%;    text-align: center;}
 .field--name-field-smart-date .year {    position: absolute;    right: 10px;}
.node--type-event .field--name-field-smart-date .smart-date--time:nth-child(2) {position:absolute;bottom:0;        font-size: 12px;    left: 0;    width: 100%;    text-align: center;}
.node--type-event .field--name-field-smart-date .smart-date--time:nth-child(1) time {    padding: 10px;    display:block;    text-transform: uppercase;}
.extra-dates .smart-date--time {position: absolute;    bottom: 0;font-size: 12px;left: 0;width: 100%;text-align: center;}
.extra-dates .field--name-field-smart-date .day {top:15px;}

.view-all-dates {font-size:10px;text-align:center;font-weight:bold;padding:5px;}
.hide-all-dates {    color: white;    font-size: 30px;    text-align: right;    position: absolute;    right: 40px;    top: 20px;    padding: 10px;cursor:pointer;
    width: 30px;    line-height: 30px;    font-weight: bold;}
.field--name-field-smart-date.view-id-events.view-display-id-block_2 { z-index:555;margin:0;
    position: fixed;    display: none;     height: 100vh;    width: 100vw;    background: black;
    top: 0;    left: 0;}
.field--name-field-smart-date.view-id-events.view-display-id-block_2 .view-content {
    max-width: 700px;    text-align: center;    margin: 0 auto;    margin-top: 60px;}

.field--name-field-smart-date.view-id-events.view-display-id-block_2 .field__item {text-align:left;width:100px;display:inline-block;}


/*Overrides back*/
.node--type-reservation .field--name-field-smart-date .field__item {    background: none;
    height: initial;    color: initial;    padding: initial;    margin: initial;}

/*Extra Dates*/
.trigger-toggle {}
.extra-dates {}
.floating-wrapper { bottom:0;  position:fixed;    overflow-y:scroll;    overflow-x:hidden;    width: 100vw;    background: rgb(0,0,0,.8);      top: 0;    left: 0;z-index:55;}
.floating {padding:15vh 10vw;}
.centered {text-align:center;}
.centered .field__item {display:inline-block;text-align:left;}
.extra-dates.centered .field__item {width:100px;padding:0 !important;margin:10px;}
.extra-dates.centered .field__item .month {padding-left:10px;}
.close-button {background: white;    top: 10px;    position: absolute;    padding: 10px;    border-radius: 150px;    width: 30px;    text-align: center;    font-size: 30px;    line-height: 30px;    text-transform: uppercase;    font-weight: bold;    color: rebeccapurple;    right: 0;    margin-right: 10px;    cursor: pointer;    border: 1px solid rebeccapurple;    z-index: 5;}
.user-logged-in .close-button  {top:40px;}

.info {    font-size: 40px;    text-align: center;    margin-top: 20px;    text-transform: none;}
.info:hover + .showonhover {display:block;position:absolute;}
.showonhover {position: absolute;
    width: 300px;
    background: white;
    border: 1px solid #ccc;
    padding: 10px 20px;}

/*Video*/
.full-width video {    width: 100%;    height: 100%;    position: absolute;    top: 0;}
.full-width .field__item {    position: relative;height:0;    padding-bottom: 56.25%;}


/*Node content width*/
.page-node-type-webform #block-numcd9-content {width:50%;display:inline-block;}
.webform-signature-pad {background:white;}
.webform-progress__status {font-size:20px;}

/*Webform form - not the node*/
/*body.path-webform #main {
    width: 350px;
    margin: 0 auto;
    display: block;
    float: none;}
*/
/*Teasers*/
.path-blog #page, .path-blog #main-wrapper {background:#ddd;}
.teaser-style-blog {width:22.5%;display:inline-block;vertical-align:top;}
.teasers .teaser-style-blog.views-row {border:0;text-align:left;    box-shadow: -5px -5px 7px slategrey;}
.teaser-style-blog .views-field-field-image {}
.teaser-style-blog .views-field-field-image img {}
.teaser-style-blog .title 	{ margin: 10px 20px 0;  border-bottom:1px solid #eee;  min-height:55px;font-size: 18px;}
.teaser-style-blog .body {padding:20px;min-height:110px;}
.teasers .teaser-style-blog.views-row .read-more {display:none;}
.teaser-style-blog .views-field-field-blog-image {border:1px solid #ccc;}
.teaser-style-blog .views-field-field-blog-image a {}
.teaser-style-blog .views-field-field-blog-image img {display:block;}
.teaser-style-blog .views-field-uid {font-weight:bold;color:darkslategray;display:block;padding:10px 20px;}
.teaser-style-blog .views-field-created { font-size: 10px;    line-height: 10px;    display: block;    padding:10px 20px 4px;}


.teaser-style-Mini {width:22.5%;display:inline-block;vertical-align:top;box-shadow: -5px -5px 7px slategrey;}
.teaser-style-Mini .views-field-field-image {}
.teaser-style-Mini .views-field-field-image img {}
.teaser-style-Mini .title 	{    background: #ccc;    text-align: center;    padding: 10px 0;    font-size: 18px;}
.teaser-style-Mini .body {padding:10px;min-height:130px;}

.teaser-style-Regular {}
.teaser-style-Regular .views-field-field-image {   display: inline-block;
    vertical-align: middle;    width: 60%;}
.teaser-style-Regular .views-field-field-image img {width:100%;height:auto;}

.teaser-style-Regular .views-field-nid-2 {   display: inline-block;    vertical-align: middle;    width: 38%;margin:0 1%;}
.teaser-style-Regular .title {    font-size: 24px;    text-transform: uppercase;    padding-bottom: 20px;
}
.teaser-style-Regular .body {margin-bottom:30px;}
.teasers .teaser-style-Regular.views-row .read-more {    width: 200px;    display: block;    margin: 0 auto;}
.teaser-style-Single.Line {}

.teaser-style-Medium {width:28%;display:inline-block;vertical-align:top;margin:1% 2%;}
.teaser-style-Medium .title 	{    background: #ccc;    text-align: center;    padding: 10px 0;    font-size: 18px;}
.teaser-style-Medium .body {padding:10px;min-height:110px;}

.teasers .view-content {text-align:center;}
.teasers .views-row {margin:2% 1%;background:white;border:1px solid #ccc;}
.teasers .views-row .views-field-field-image a {text-align:left;font-size:0;display:block;border:0;}
.teasers .views-row .read-more { font-weight:bold;   display: inline-block;    background: #0071b3;    border-radius: 30px;    line-height: 30px;    text-align: center;    width: 80%;   margin-bottom: 5%;color:white;}
.teasers .views-row .read-more a {color:white;}
.teasers.solo .views-row {background:none;display:inline-block;}
.teasers.solo .title {font-size:20px;}

.teaser-style-.views-row {background:none;border:0;}
.teaser-style- .title {    font-size: 28px;    text-transform: uppercase;}
.teaser-style- .body {     width: 80%;    margin: 20px auto;}
.teaser-style-.views-row .read-more {    font-weight: bold;    display: inline-block;text-transform:uppercase;padding:10px;font-size:18px;
    background: #eee;    border-radius: 30px;    line-height: 30px;
    text-align: center;    width: 200px;    margin-bottom: 5%;}
	
	
/*Teaser if Video*/
.is-video {display:none;}
.type-video .not-video {display:none;}
.type-video .is-video {display:initial;}

/*Newsletter Delta*/
/*hide the repeat because of two dates*/
.newsletter-delta-1 {display:none;}


/*Room Reservations*/
td.views-field-field-reservation-status label {display:none;}
td.views-field-field-reservation-status .field--type-entity-reference {display:inline-block;}
.status-Approved {background:green;color:white;}
.status-Requested {background:#eee;}
.status-Declined {background:red;color:white;}
.status-Approved a,.status-Declined a {color:white;}
.field--type-entity-reference .field__label {font-size:inherit;font-weight:bold;}
.field--type-entity-reference {margin:inherit;}

tr.status-Approved.selected td {background:lightgreen;}
tr.status-Approved.selected td  a {color:black;}


.node-reservation-form #edit-submit {display:none;}
.node-reservation-form .wb-submit-button {display:inline-block;background:green;color:white;padding:5px 15px;border-radius:30px;border:1px solid #ccc;}

#edit-field-smart-date-0-manage-instances {  font-size: 16px;  font-weight: bold;  background: green;  color: white;}
.node-reservation-form .js-form-type-vertical-tabs {display:none;}

/*Taxonomy terms*/
.block-field-blocktaxonomy-termministryfield-image {text-align:center;}

/*Youtube*/
.youtube-container--responsive {    overflow: hidden;    position: relative;    padding-bottom: 56.25%;    height: 0;}
.youtube-container--responsive iframe {    border: none;    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;}



/*Employee type*/
.employee-photo {border-radius:100%;overflow:hidden;margin:10%;box-shadow: 0 0 0 2px #e78267;transition:.5s all ease;}
.flip-card-view .views-row:hover .employee-photo {box-shadow: 0 0 0 6px orange;}
.employee-photo img {display:block;}
.employee-name {font-weight:bold;font-size:16px;}
.employee-position {font-size:12px;}
.employee-bio {padding:10px;}

.down-arrow {  position:absolute;border: solid black;  border-width: 0 3px 3px 0;    padding: 3px;display:none;  transform: rotate(45deg);  -webkit-transform: rotate(45deg);bottom:6px;}
.flipped .down-arrow {display: inline-block;}
/*Flip Card*/
.flip-card-view .view-content {text-align:center;}
.flip-card-view .views-row {    display: inline-block;    background: white;    border: 1px solid #ccc;   margin: 0 0 10px;position:relative;}
	
.wb-flip-gallery > div {text-align:center;}

/*Flip Card wrapper*/
.flip-card-wrapper {} /*using views-row as wrapper */
.flip-card-link {    padding: 10px 20px;    background-color: rgb(235, 225, 213); color: black;
    margin: 20px;    display: block;    text-align: center;margin: 20px auto;}
.flip-card-link:hover {background:#b3d8de;color:black;}
	
/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
  background-color: transparent;
  width: 240px;
  height: 340px;
  border: 1px solid #f1f1f1;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card.flipped .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  color: black;
}

/* Style the back side */
.flip-card-back {
  /*background-color: dodgerblue;*/
  color: black;
  transform: rotateY(180deg);
  height:320px;overflow-y:scroll;
  
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox */
}
.flip-card-back::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}

@media (max-width: 1526px) {
	/*.tbm-button {display:block;}*/
}

@media (max-width: 1160px) {
	.self-updating {width:30%;}
}
@media (max-width: 1000px) {
	/*Node type page*/
	.node--type-page .field--name-field-image {float:none;margin:0 auto 20px;}
	.node--type-page .field--name-field-image img {margin:0 auto;display:block;}
	
	#block-donate .three-thirds {height:460px;margin-top:40px;}
	#block-donate .three-thirds img {height:563px;width:1000px;max-width:unset;}
	.position-absolute {left:50%;margin-left:-150px;box-shadow: 0px 5px 5px black;}
	.right-0 {right:unset;}
	
	/*Blog*/
	.teaser-style-blog {width:47%;}
	.teaser-style-blog .views-field-field-blog-image img {width:100%;}
	
}
@media (max-width: 890px) {

	.teaser-style-Regular {width:600px;margin: 2% auto !important;}
	.teaser-style-Regular .views-field-field-image,
	.teaser-style-Regular .views-field-nid-2 {width:100%;margin:0;}
	.teaser-style-Regular .views-field-nid-2 {padding:20px 0;}
	
	.teaser-style-Mini {    width: 40%;}
	
	.page-node-type-webform #block-numcd9-content {width:100%;display:block;}
	.display-inline-block {display:block;vertical-align:top;margin: 0 auto 40px;}
	.width-40 {width:100%;}
	.width-50 {width:100%;}
	.self-updating {width:47%;}
}

@media (max-width: 645px) {

	.teaser-style-Regular {width:unset;}	
	
	.teaser-style-Mini {    width: 47%;}
	/*Blog*/
	.teaser-style-blog {width:98%;}
	.teaser-style-blog .views-field-field-blog-image img {width:100%;}
}

@media (max-width: 600px) {
	.region-header {position:relative;}
	#block-numcd9-branding {width:80%;    display: inline-block;    vertical-align: top;}
	.site-branding__logo {width:10%;margin:0 2% 0 0; display:inline-block;}
	.site-branding__logo img {}
	.site-branding__text {font-size:12px;width:85%;display:inline-block;}
	#block-numcd9-mainmenu {position:absolute;top:10px;width:100%;left:0;}
	#block-numcd9-mainmenu button.tbm-button {position:absolute;right:0;}
	#block-numcd9-mainmenu .tbm.tbm--mobile .tbm-collapse {margin-top:3.1rem;background:white;left:0;width:100%;}
	
	.fix-bar .region-header {    position: fixed;    top: 0;    z-index: 45;    background: white;padding:0;width:100%;}
	#main-wrapper.fix-bar {margin-top:75px;}
	.self-updating {width:90%;display:block;margin:20px auto;}
}

@media (max-width: 461px) {
	.tbm.tbm--mobile .tbm-collapse {left:unset;width:100%;}
}

@media (max-width: 450px) {

	.teaser-style-Regular {width:unset;}	
	
	.teaser-style-Mini {    width: unset; margin: 2% auto;}
}