:root {
  --color-primary: #00C4B0;
  --color-secondary: #005F6B;
}

html, body { height: 100%; width: 100%; margin: 0; color: #333; text-align: center; line-height: initial; min-width: 500px; }
@media (max-width:768px) {
  html, body { min-width: inherit; }
}
body {  /*font-family: 'Roboto Slab', serif;*/
font-family: 'Poppins', sans-serif; font-weight: lighter; font-stretch: expanded; font-display: swap; }
img { vertical-align: top; image-orientation: from-image; }
h1 { font-size: 50px; }
h2 { font-size: 30px; }
h2, h3, h4, h5 { font-weight: lighter; }
a { cursor: pointer; color: #00C4B0; }
a:hover { text-decoration: none; background-color: rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); }
blockquote, blockquote p { font-size: 14px; color: #aaa; }
strong { font-weight: bold; }

/*div, span, a {
  position: relative;
}
*/
.flexstart { display: flex; display: -webkit-flex; justify-content: flex-start; -webkit-justify-content: flex-start; align-items: flex-start; -webkit-align-items: flex-start; flex-wrap: wrap; -webkit-flex-wrap: wrap; max-width: 100%; }
.flexend { display: flex; display: -webkit-flex; justify-content: flex-end; -webkit-justify-content: flex-end; flex-wrap: wrap; -webkit-flex-wrap: wrap; max-width: 100%; }
.flexcenter { display: flex; display: -webkit-flex; display: -moz-flex; justify-content: center; -webkit-justify-content: center; -moz-justify-content: center; align-items: center; -webkit-align-items: center; -moz-align-items: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; max-width: 100%; }
.flexv { flex-direction: column; -webkit-flex-direction: column; -moz-flex-direction: column; }
.flexaib { align-items: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; }
.flexjcsb { justify-content: space-between; -webkit-justify-content: space-between; -moz-justify-content: space-between; }
.flexjcc { justify-content: center; -webkit-justify-content: center; -moz-justify-content: center; }
.flexaic { align-items: center; -webkit-align-items: center; -moz-align-items: center; }
.fullscreen { position:absolute; left:0px; right:0px; top:0px; bottom:0px; }
ng-view { display: block; }
@media (max-width:768px) {
  .hidden-on-phone { display: none; }
}
@media (min-width:768px) {
  .hidden-on-desktop { display: none; }
}
.small-note { font-size: 10px; color: #7a7a7a; margin: 10px 0px; }
.cover-image { max-width: 100%; max-height: 100%; }
.cover-image.wide { height: auto; }
.cover-image.tall { width: auto; }
.editing-background-color {  /*background:rgba(170, 184, 11,0.05);*/
background-color: #eee; }
.catholicer-container { min-width: 350px; max-width: 1200px; width: 80%; margin: 0px; display: inline-flex; flex-wrap: wrap; display: -webkit-inline-flex; -webkit-flex-wrap: wrap; display: -moz-inline-flex; -moz-flex-wrap: wrap;  /*background-color: #f2f2f2;*/ }
#directory-section { position: relative; text-align: center; -webkit-justify-content: right; justify-content: right; padding: 0px; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; }
#banner-section { position: relative; text-align: left; -webkit-justify-content: left; justify-content: left; padding: 0px;    /*height:70vh;*/ }
.banner-left-column { position: relative; color: white; background-color: rgba(0, 0, 0, 0.0);  /*height:calc(100% - 100px);*/ flex-direction: column; -webkit-flex-direction: column; }
.banner-right-column { position: relative; color: white; }
@media (max-width:768px) {
  .catholicer-container { min-width: inherit; width: inherit; display: block; flex-wrap: inherit; -webkit-flex-wrap: inherit; }
  #banner-section > div { width: 100%; position: relative; }
  .banner-calendar { margin: 10px 0px; }
}
@media (min-width:769px) {
  .banner-calendar { position: absolute; top: 10px; right: 10px; }
  .banner-left-column, .banner-right-column { width: 50%; }
  #banner-section {    /*height:80vh;*/
  min-height: 600px; }
}
footer .catholicer-container, header .catholicer-container, filter .catholicer-container, profile .catholicer-container { background-color: transparent; }
header { position: relative; background: #00C4B0; text-align: center; max-height: 300px; }
header img {  /*height: 4%;*/

/*margin: 1%;*/ }
header > div > div { position: relative;  /*height:100%;*/ -webkit-justify-content: flex-end; justify-content: flex-end; }
@media (max-width:768px) { }
@media (min-width:769px) {
  header > div > div { max-width: 380px; }
}
footer { margin-top: 50px; margin-bottom: 50px; color: #707070; padding: 10px 10px; text-align: center; display: flex; display: -webkit-flex; min-height: 5%; justify-content: center; -webkit-justify-content: center; background: #eee; }
footer .footer-main-item { margin: 10px; }
footer img { width: 26px; }
footer login img { width: inherit; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
 *    Main Page
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
@media (max-device-width:600px) {
  #catholicer-logo { width: 100%; }
}

/*#banner-section {
}
#banner-section:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 0;
  border-bottom: 20px solid white;
  border-left: 50px solid transparent;
  border-right: 350px solid transparent;

}
#banner-section:before {
  content: "";
  position: absolute;
  left: 0;
  top: -20;
  width: 0;
  height: 0;
  border-bottom: 20px solid white;
  border-right: 50px solid transparent;
  border-left: 350px solid transparent;

}*/
.main-page-title { width: 70%; border-bottom: #00C4B0 solid 1px; background: white; }
.dashboard-column:nth-child(even) .main-page-title { width: 100%; }
.main-section { margin: 1px; padding: 1px; flex-direction: column; -webkit-flex-direction: column; position: relative; }

/*.main-section:nth-child(odd) {
  background:#fff; color: #00C4B0;
}
.main-section:nth-child(even) {
  background:#f8f8f8; color: #707070;
}
*/
.main-page-block, .main-page-block-button-border, .main-page-block-button {  /*flex: 1 1 150px;-webkit-flex: 1 1 150px;*/
text-align: center; cursor: pointer; height: 90px; width: 90px; position: relative; background-color: white; color: #00C4B0; font-size: 12px; margin: 1px; border-radius: 45px; border-bottom: #ccc 1px solid;  /*border-right:#ccc 1px solid;*/ overflow: hidden; }
.main-page-block-button-border { margin: 20px; width: 100px; height: 100px; background-color: white; border-radius: 50px; border-top: #FCE38A 2px solid; border-left: #FCE38A 2px solid; border-right: none; border-bottom: none; }
.main-page-block { padding: 5px; }
.main-page-block { color: #707070; background-color: #fcfcfc; }
.main-page-block-button:hover { background-color: var(--color-secondary); color: white; }
.main-page-block:hover { background-color: white; }
.main-poster { height: 95%; width: 100%; position: relative; }
.main-poster-content { top: 0px; width: 100%; color: white; position: absolute; display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; height: 100%; text-align: center; background-color: rgba(0, 0, 0, 0.7); }
.main-poster-image { height: 100%; width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; position: absolute; }
.main-poster nav { text-align: center; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
.tab { padding: 10px; margin: 2px;  /*font-size: 18px;*/ flex-grow: 1; -webkit-flex-grow: 1; cursor: pointer; border-radius: 4px; color: #00C4B0; }
.tab.selected { font-weight: bold; }
.button-1, nav .button { cursor: pointer; color: white; display: inline-block; margin: 4px; border: 0; min-width: 15%; border-radius: 4px; font-size: 15px;  /*font-weight: 400;*/ line-height: 30px; text-align: center; white-space: nowrap; vertical-align: middle; background-color: #00C4B0; justify-content: space-around; -webkit-justify-content: space-around;  /*height:4%;*/ width: 150px; box-shadow: 0px 0px 1px #333; }
.button-1:hover, .button-1.selected, nav .button:hover, nav .button .selected { background-color: var(--color-secondary); }
nav .button:disabled { opacity: 0.5; background-color: #00C4B0; }
nav .button img { width: 20px; float: left;  /*height:20px;*/ margin-right: 20px;  /*height: 100%;*/ vertical-align: middle; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
 *    Filter Page
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
filter-list nav { background: #f2f2f2; color: #707070; text-align: center; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; -webkit-flex-direction: column; flex-direction: column; width: 100%; }
.filter-navigation nav p { }
filter-list nav .button { min-width: 10%; }
@media (max-width:768px) {
  filter-list nav .button { max-width: initial; min-width: inherit; width: calc(100% - 10px); padding: 0px; margin: 5px; }
}
.filter-list { text-align: center; color: black; display: block; }
.filter-schedule-day div { background: url(/images/icon/icon-day.png); background-size: 100% 100%; width: 80px; padding: 30px 5px 10px 5px; opacity: 0.5; font-size: 12px; }
.filter-schedule-day div:hover, .filter-schedule-day .selected { opacity: 1; }
@import url('http://getbootstrap.com/dist/css/bootstrap.css');
.glyphicon-chevron-down { -animation: blink .5s infinite linear alternate; -ms-animation: blink .5s infinite linear alternate; -webkit-animation: blinkw .5s infinite linear alternate; -moz-animation: blinkm .5s infinite linear alternate; }
.glyphicon-refresh-animate { -animation: spin .7s infinite linear; -ms-animation: spin .7s infinite linear; -webkit-animation: spinw .7s infinite linear; -moz-animation: spinm .7s infinite linear; }
@keyframes spin {
  from { transform: scale(1) rotate(0deg); }
  to { transform: scale(1) rotate(360deg); }
}
@-webkit-keyframes spinw {
  from { -webkit-transform: rotate(0deg); }
  to { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes spinm {
  from { -moz-transform: rotate(0deg); }
  to { -moz-transform: rotate(360deg); }
}
@keyframes blink {
  from { opacity: 1; transform: translateY(0px); }
  to { opacity: 0.5; transform: translateY(10px); }
}
@-webkit-keyframes blinkw {
  from { opacity: 1; -webkit-transform: translateY(0px); }
  to { opacity: 0.5; -webkit-transform: translateY(10px); }
}
@-moz-keyframes blinkm {
  from { opacity: 1; -moz-transform: translateY(0px); }
  to { opacity: 0.5; -moz-transform: translateY(10px); }
}
.filter-list-entry { display: flex; display: -webkit-flex; justify-content: flex-start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; margin: 20px 0px; text-align: left; }
.thumbnail { max-width: 100%; background-size: cover; background-position: center; }
.filter-list-entry .thumbnail { width: 200px; height: 120px; }
.filter-list-thumbnail { width: 100%; height: 100%; top: calc(50% - 35px); left: calc(50% - 35px); opacity: 0.2; }
@media (max-width:768px) {
  .filter-list-entry .thumbnail { width: calc(100% - 50px); margin: 25px; }
  .filter-list-entry > a { width: 100%; }
}
.filter-list-entry-content { margin-left: 25px; width: calc(100% - 250px); }
@media (max-width:768px) {
  .filter-list-entry-content { margin-left: 25px; width: calc(100% - 50px); }
}
.filter-list-entry-content h5 { color: #00C4B0; font-weight: bold; margin: 0px 0px 10px 0px; }
.filter-list-entry-content h3 { color: #00C4B0; font-weight: normal; margin: 10px 0px 0px 0px; font-size: 20px; }
p { color: #707070;  /*font-weight: lighter;*/ margin: 0px; }
prayer-window, prayer-chapel { display: block; }
prayer-window p, prayer-chapel p { color: #aaa;  /*font-weight: lighter;*/ margin: 0px; word-break: break-word; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
 *    Profile Page
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
gallery { width: calc(100% - 0px); display: block; position: relative; }
.galleria-container { background-color: #fefefe;  /*box-shadow: 0px 1px 5px #ddd;*/ margin-bottom: 20px; }
.galleria-stage { /* modify line 17 of your galleria.classic.css stylesheet */
bottom: 10px; /* define the bottom spacing, same as top/left/right */ }
.galleria-thumbnails-list { background-color: #f7f7f7; }
.galleria-theme-classic .galleria-thumbnails .galleria-image { background: none; border: none; }
.galleria-stage .galleria-image, gallery .galleria-image, entity-thumbnail .galleria-image, post .galleria-image { background: url("/images/gallery-bg.jpg") center center / cover; }
.featherlight-content img { width: auto !important; height: auto !important; max-width: 100%; max-height: 90vh; }
post p { margin: 10px 0px; }
post p { }
post hr { background-color: #eee; height: 0.5px; }
post .post-content { overflow: hidden; }
post .post-content img:not(.cover-image) { width: 50%; float: left; margin-right: 20px; margin-bottom: 20px; max-height: initial; }
@media(max-width:768px) {
  post .post-content img:not(.cover-image) { width: 100%; float: initial; margin-right: inherit; margin-bottom: inherit; }
}
.inputfile { width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; }
.inputfile + label { color: white; background-color: #00C4B0; display: inline-block; width: 100%; padding: 5px; }
.inputfile:focus + label, .inputfile + label:hover { background-color: var(--color-secondary); }
.inputfile + label { cursor: pointer; /* "hand" cursor */ }
.inputfile:focus + label { outline: 1px dotted #000; outline: -webkit-focus-ring-color auto 5px; }
.inputfile + label * { pointer-events: none; }
post img { height: auto; max-height: 200px; width: auto; }
.post { margin: 20px 0px; min-width: 150px; position: relative; }
.post .post { background-color: #eee; margin: 5px 0px; }
profile .post { box-shadow: 0px 1px 5px #ddd; border-radius: 10px; }
prayer .button-1 { margin: 1px; flex-grow: 1; -webkit-flex-grow: 1; width: inherit; padding: 0px 15px; }
.dashboard-column { min-width: 200px; max-width: 100%; padding: 15px; }
.profile-column { max-width: 100%; padding: 15px; }
@media (min-width:769px) {
  .dashboard-column, .profile-column { min-height: 90%; }
}
.dashboard-column::before, .profile-column::before { margin: 0px; }
.dashboard-column:nth-child(even) { flex: 3 1 400px; -webkit-flex: 3 1 400px; }
.dashboard-column:nth-child(odd) { flex: 2 1 250px; -webkit-flex: 2 1 250px; }
.dashboard-column:nth-child(1) { flex: 1 1 200px; -webkit-flex: 1 1 200px; }
.profile-column:nth-child(even) { flex: 3 1 400px; -webkit-flex: 3 1 400px; }
.profile-column:nth-child(odd) { flex: 2 1 250px; -webkit-flex: 2 1 250px; }
.profile-column:nth-child(1) { flex: 1 1 200px; -webkit-flex: 1 1 200px; }

/*.profile-column div, */
div#activity-section div { border-radius: 10px; }
.profile-column .mce-tinymce div, .profile-column .mce-tinymce { border-radius: 0px; }
.profile-block, .profile-content { width: calc(100%); margin: 0px 0px 20px 0px; text-align: left; background-color: #fefefe; position: relative; }
.profile-block { padding: 10px; box-shadow: 0px 1px 5px #ddd; border-radius: 10px; }
profile .profile-block, post .profile-block { padding: 20px; }
profile .profile-content, post .profile-content { margin: 40px 0px; }
.profile-block h2, .profile-content h2 { margin: 10px 0px; color: #00C4B0; }
.profile-block h3, .profile-block h4, .profile-content h3, .profile-content h4 { margin: 0px 0px; color: #00C4B0; }
.profile-block .thumbnail, .profile-content .thumbnail { width: 120px; height: 150px; }
.event-detail { width: calc(100% - 200px); }
map, .map { width: 100%; height: 150px; overflow: hidden; border-radius: 10px; }
map iframe { border: none; }
@media (max-device-width:600px) {
  map, .map { height: 150px; }
}
calendar { width: 100%; text-align: left; }
calendar p { color: #00C4B0; }
schedule { width: 100%; }
schedule .time:hover { background-color: rgba(11, 108, 192, 0.2); }
post { min-width: 250px; }
membership { padding: 0px 0px;  /*background:#f2f2f2;*/ display: block;  /*box-shadow: 0px 1px 5px #ddd;*/  /*border-radius: 10px;*/ }
membership>nav>div { margin: 5px; }
membership .button { width: 100%; font-size: 12px; cursor: pointer; margin: 0px 0em;  /*border-radius: 0;*/ padding: 2px 10px; }
.breadcrum { padding: 5px 0px; background: #f2f2f2; }
.breadcrum-element { margin-right: 5px; color: gray; }
.text-button { color: #00C4B0; background-color: transparent; border: none; cursor: hand; }
.profile-hierarchy-parents { }
.profile-hierarchy-children { }
.profile-hierarchy-parents img, .profile-hierarchy-children img { border-radius: 50%; border: 1px solid #00C4B0; background-color: #777; }
about, newentity, login, montage-detail, montage-submission { background-color: rgba(0, 0, 0, 0.5); position: fixed; width: 100vw; height: 100vh; top: 0px; left: 0px; display: flex; display: -webkit-flex; display: -moz-flex; justify-content: center; align-items: center; -webkit-justify-content: center; -webkit-align-items: center; -moz-justify-content: center; -moz-align-items: center; z-index: 5; -webkit-backface-visibility: hidden; }
newentity content { width: 50%; min-width: 350px; max-height: 100%; color: white; text-align: center; }
about content, login content, montage-detail content, montage-submission content { width: 50%; min-width: 350px; max-height: 100%; background: white; color: #333; text-align: left; border-radius: 10px; }
login input, login .button-1 { width: 100%; height: 35px; border-radius: 17px; padding: 18px; font-size: 15px; text-align: center; }
login input { background-image: linear-gradient(to right, #Ffffcc, white); }
#login-input-area { width: 100%; right: 0px; padding: 20px;  /*background: url(/images/backgrounds/login-iphone.svg) center center no-repeat / 100% 100%;*/  /*background-color: #eee;*/ }
@media (max-width:768px) {
  #login-input-area { width: 100%; }
}
about content p { padding: 10px; }
.about-content div, .about-content p { padding: 10px; width: 100%; }
.about-content div { font-weight: lighter; }
newentity content h2 { padding: 20px; }
newentity content select, newentity content input { width: 100%; }
newentity content .new-entity-entry { display: flex; display: -webkit-flex; justify-content: flex-start; -webkit-justify-content: flex-start; align-items: center; -webkit-align-items: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; position: relative; }
.new-entity-entry .search-select { position: absolute; left: 100%; top: 0px; width: 200px; height: 150px; z-index: 2; }
newentity content .new-entity-label { width: 150px; display: inline-block; }
newentity content div { width: 100%; text-align: left; }
.new-entity-question, .new-entity-operation, .new-entity-input, .new-entity-action, .new-entity-note, .new-entity-option { width: 100%; padding: 10px; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; position: relative; }
.new-entity-question { justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; }
.new-entity-header { min-height: 60px; color: #00C4B0; }
.new-entity-question { min-height: 30px;    /*background:#00C4B0;*/ color: #333; align-items: baseline; -webkit-align-items: baseline; }
.new-entity-operation { min-height: 180px; padding: 0px;  /*background: #f2f2f2;*/ }
::-webkit-scrollbar { -webkit-appearance: solid; background-color: rgba(0, 0, 0, .1); width: 7px; }
::-webkit-scrollbar-thumb { border-radius: 4px; background-color: rgba(0, 0, 0, .5); -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5); }
.new-entity-input { text-align: left; /*width: calc(100% - 140px);*/ }
.new-entity-option, .new-entity-action { width: 60px; background: #00C4B0; color: #f2f2f2; cursor: pointer; margin: 5px; border-radius: 30px; }
.new-entity-operation .selected, .new-entity-option:hover, .new-entity-action:hover { background: var(--color-secondary); color: #f2f2f2; }
.new-entity-action:disabled { opacity: 0.5; }
.new-entity-option { font-size: 12px; border-radius: 0px; margin: 2px 0px;  /*height: 32px;*/ width: 100%; }
.new-entity-note { min-height: 30px; }
.new-entity-footer { min-height: 30px; }
.mobile-option { width: 80%; height: 18%; padding: 15px 5px; margin: 1px; background: #00C4B0; opacity: 0.8; color: white; }
.mobile-option.selected, .mobile-option:hover { background: var(--color-secondary); opacity: 1; }
.segmented-control { position: relative; display: inline-block; border: 1px solid currentColor; font-style: normal; font-weight: normal; text-decoration: none; overflow: hidden;  /* margin: .8em auto; */ -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-user-select: -moz-none; -ms-user-select: none; -webkit-user-select: none; user-select: none; -moz-transition-duration: 0.8s; -o-transition-duration: 0.8s; -webkit-transition-duration: 0.8s; transition-duration: 0.8s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-tap-highlight-color: transparent; }
.segmented-control > input { position: absolute; left: -10000px; opacity: 0; }
.segmented-control > input[type='checkbox'] ~ label { -moz-transition-duration: 0; -o-transition-duration: 0; -webkit-transition-duration: 0; transition-duration: 0; }
.segmented-control > input[type='checkbox'] ~ label:before { opacity: 0; }
.segmented-control > input:disabled:nth-child(1) ~ label:nth-of-type(1) { opacity: 0.3; cursor: not-allowed; }
.segmented-control > input:nth-child(1):checked ~ label:nth-of-type(1):after, .segmented-control > input:nth-child(1):checked ~ label:nth-of-type(1):before { opacity: 1; }
.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(1):after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(1):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(1) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(1) ~ label:before { left: 0%; }
.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(2):after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(2):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(2) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(2) ~ label:before { left: 0%; }
.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(3):after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(3):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:before { left: 0%; }
.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(4):after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(4):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:before { left: 0%; }
.segmented-control > input:disabled:nth-child(2) ~ label:nth-of-type(2) { opacity: 0.3; cursor: not-allowed; }
.segmented-control > input:nth-child(2):checked ~ label:nth-of-type(2):after, .segmented-control > input:nth-child(2):checked ~ label:nth-of-type(2):before { opacity: 1; }
.segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(2):after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(2):before, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(2) ~ label:after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(2) ~ label:before { left: 50%; }
.segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(3):after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(3):before, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:before { left: 33.33333%; }
.segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(4):after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(4):before, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:before { left: 25%; }
.segmented-control > input:disabled:nth-child(3) ~ label:nth-of-type(3) { opacity: 0.3; cursor: not-allowed; }
.segmented-control > input:nth-child(3):checked ~ label:nth-of-type(3):after, .segmented-control > input:nth-child(3):checked ~ label:nth-of-type(3):before { opacity: 1; }
.segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(3):after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(3):before, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:before { left: 66.66667%; }
.segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(4):after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(4):before, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:before { left: 50%; }
.segmented-control > input:disabled:nth-child(4) ~ label:nth-of-type(4) { opacity: 0.3; cursor: not-allowed; }
.segmented-control > input:nth-child(4):checked ~ label:nth-of-type(4):after, .segmented-control > input:nth-child(4):checked ~ label:nth-of-type(4):before { opacity: 1; }
.segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(4):after, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(4):before, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:before { left: 75.0%; }
.segmented-control > label { display: inline-block; padding: 0 .71em; cursor: pointer; float: left; line-height: 3em; font-style: inherit; font-weight: inherit; text-decoration: inherit; -moz-transition-property: none; -o-transition-property: none; -webkit-transition-property: none; transition-property: none; -moz-transition-duration: inherit; -o-transition-duration: inherit; -webkit-transition-duration: inherit; transition-duration: inherit; -moz-transition-timing-function: inherit; -o-transition-timing-function: inherit; -webkit-transition-timing-function: inherit; transition-timing-function: inherit; }
.segmented-control > label:before, .segmented-control > label:after { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; }
.segmented-control > label:after { color: white; content: attr(data-value); text-align: center; padding: inherit; z-index: 10; font-style: inherit; text-decoration: inherit; font-weight: inherit; opacity: 0; -moz-transition-property: opacity, left; -o-transition-property: opacity, left; -webkit-transition-property: opacity, left; transition-property: opacity, left; -moz-transition-duration: inherit; -o-transition-duration: inherit; -webkit-transition-duration: inherit; transition-duration: inherit; -moz-transition-timing-function: inherit; -o-transition-timing-function: inherit; -webkit-transition-timing-function: inherit; transition-timing-function: inherit; }
.segmented-control > label:after, .segmented-control > label { text-align: center; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.segmented-control > label:before { content: ''; color: inherit; background: currentColor; -moz-transition-property: left; -o-transition-property: left; -webkit-transition-property: left; transition-property: left; -moz-transition-duration: inherit; -o-transition-duration: inherit; -webkit-transition-duration: inherit; transition-duration: inherit; -moz-transition-timing-function: inherit; -o-transition-timing-function: inherit; -webkit-transition-timing-function: inherit; transition-timing-function: inherit; }
.segmented-control > label:first-of-type:nth-last-of-type(1), .segmented-control > label:first-of-type:nth-last-of-type(1):after, .segmented-control > label:first-of-type:nth-last-of-type(1):before, .segmented-control > label:first-of-type:nth-last-of-type(1) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(1) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(1) ~ label:before { width: 100%; }
.segmented-control > label:first-of-type:nth-last-of-type(2), .segmented-control > label:first-of-type:nth-last-of-type(2):after, .segmented-control > label:first-of-type:nth-last-of-type(2):before, .segmented-control > label:first-of-type:nth-last-of-type(2) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(2) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(2) ~ label:before { width: 50%; }
.segmented-control > label:first-of-type:nth-last-of-type(3), .segmented-control > label:first-of-type:nth-last-of-type(3):after, .segmented-control > label:first-of-type:nth-last-of-type(3):before, .segmented-control > label:first-of-type:nth-last-of-type(3) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(3) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(3) ~ label:before { width: 33.33333%; }
.segmented-control > label:first-of-type:nth-last-of-type(4), .segmented-control > label:first-of-type:nth-last-of-type(4):after, .segmented-control > label:first-of-type:nth-last-of-type(4):before, .segmented-control > label:first-of-type:nth-last-of-type(4) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(4) ~ label:before { width: 25%; }
.segmented-control.italic, .segmented-control .italic { font-style: italic; }
.segmented-control.bold, .segmented-control .bold { font-weight: bold; }
.segmented-control.underline, .segmented-control .underline { text-decoration: underline; }
.segmented-control.line-through, .segmented-control .line-through { text-decoration: line-through; }
.polaroid { flex: 1 1 100px; -webkit-flex: 1 1 100px; width: 8%; min-width: 100px; height: 100px; margin: 2px; display: inline;  /*clear:both;*/ background-size: cover; background-position: center; -webkit-box-reflect: below 0px 
  -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, transparent), to(rgba(255, 255, 255, 0.2)));/*  -webkit-box-shadow:
                  0px 1px 3px 2px #00C4B0;
       -moz-box-shadow:
                  0px 1px 3px 2px #00C4B0;
            box-shadow:
                  0px 1px 3px 2px #00C4B0;*/ }
  input::-webkit-input-placeholder, input::-moz-placeholder { color: #00C4B0; }

  /* ----------- iPhone 4 and 4S ----------- */

  /* Portrait and Landscape */
  @media only screen 
  and (min-device-width:320px) 
  and (max-device-width:480px)
  and (-webkit-min-device-pixel-ratio:2) { }

  /* Portrait */
  @media only screen 
  and (min-device-width:320px) 
  and (max-device-width:480px)
  and (-webkit-min-device-pixel-ratio:2)
  and (orientation:portrait) { }

  /* Landscape */
  @media only screen 
  and (min-device-width:320px) 
  and (max-device-width:480px)
  and (-webkit-min-device-pixel-ratio:2)
  and (orientation:landscape) { }

  /* ----------- iPhone 5 and 5S ----------- */

  /* Portrait and Landscape */
  @media only screen 
  and (min-device-width:320px) 
  and (max-device-width:568px)
  and (-webkit-min-device-pixel-ratio:2) { }

  /* Portrait */
  @media only screen 
  and (min-device-width:320px) 
  and (max-device-width:568px)
  and (-webkit-min-device-pixel-ratio:2)
  and (orientation:portrait) { }

  /* Landscape */
  @media only screen 
  and (min-device-width:320px) 
  and (max-device-width:568px)
  and (-webkit-min-device-pixel-ratio:2)
  and (orientation:landscape) { }

  /* ----------- iPhone 6 ----------- */

  /* Portrait and Landscape */
  @media only screen 
  and (min-device-width:375px) 
  and (max-device-width:667px) 
  and (-webkit-min-device-pixel-ratio:2) { }

  /* Portrait */
  @media only screen 
  and (min-device-width:375px) 
  and (max-device-width:667px) 
  and (-webkit-min-device-pixel-ratio:2)
  and (orientation:portrait) { }

  /* Landscape */
  @media only screen 
  and (min-device-width:375px) 
  and (max-device-width:667px) 
  and (-webkit-min-device-pixel-ratio:2)
  and (orientation:landscape) { }

  /* ----------- iPhone 6+ ----------- */

  /* Portrait and Landscape */
  @media only screen 
  and (min-device-width:414px) 
  and (max-device-width:736px) 
  and (-webkit-min-device-pixel-ratio:3) { }

  /* Portrait */
  @media only screen 
  and (min-device-width:414px) 
  and (max-device-width:736px) 
  and (-webkit-min-device-pixel-ratio:3)
  and (orientation:portrait) { }

  /* Landscape */
  @media only screen 
  and (min-device-width:414px) 
  and (max-device-width:736px) 
  and (-webkit-min-device-pixel-ratio:3)
  and (orientation:landscape) { }

  /* ----------- iPad mini ----------- */

  /* Portrait and Landscape */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (-webkit-min-device-pixel-ratio:1) { }

  /* Portrait */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (orientation:portrait) 
  and (-webkit-min-device-pixel-ratio:1) { }

  /* Landscape */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (orientation:landscape) 
  and (-webkit-min-device-pixel-ratio:1) { }

  /* ----------- iPad 1 and 2 ----------- */

  /* Portrait and Landscape */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (-webkit-min-device-pixel-ratio:1) { }

  /* Portrait */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (orientation:portrait) 
  and (-webkit-min-device-pixel-ratio:1) { }

  /* Landscape */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (orientation:landscape) 
  and (-webkit-min-device-pixel-ratio:1) { }

  /* ----------- iPad 3 and 4 ----------- */

  /* Portrait and Landscape */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (-webkit-min-device-pixel-ratio:2) { }

  /* Portrait */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (orientation:portrait) 
  and (-webkit-min-device-pixel-ratio:2) { }

  /* Landscape */
  @media only screen 
  and (min-device-width:768px) 
  and (max-device-width:1024px) 
  and (orientation:landscape) 
  and (-webkit-min-device-pixel-ratio:2) { }
  select, input, textarea { border: none; border-bottom: 1px #eee solid; color: #00C4B0;  /*border-radius: 3px;*/
  background-color: #fcfcfc; }
  location, event, eventtime, #profile-contacts, .profile-general { display: block; margin: 20px 0px; }
  #profile-contacts input, location input, .profile-general input { width: 95%; margin-left: 5%; }
  td input { width: 100%; }
  .mce-panel, .mce-btn { background-color: transparent; }
  @media screen and (max-device-width:768px) {
    .fixfixed login { position: absolute; }
  }

  /*
  @font-face { font-family: DIN; src: url(css/fonts/DINRegularAlternate.ttf) format('truetype'); font-style: italic; font-weight: lighter; }
  @font-face { font-family: DIN; src: url(css/fonts/DINLight.ttf) format('truetype'); font-weight: lighter; }
  @font-face { font-family: DIN; src: url(css/fonts/DINRegularAlternate.ttf) format('truetype'); font-style: italic; }
  @font-face { font-family: DIN; src: url(css/fonts/DINRegular.ttf) format('truetype'); font-weight: normal; }
  @font-face { font-family: DIN; src: url(css/fonts/DINBold.ttf) format('truetype'); font-weight: bold; }
  @font-face { font-family: DIN; src: url(css/fonts/DINBoldAlternate.ttf) format('truetype'); font-weight: bold; font-style: italic; }
  @font-face { font-family: DIN; src: url(css/fonts/DINBlackAlternate.ttf) format('truetype'); font-weight: bolder; }
  */






  prayer-interface {
    color: 00C4B0;
    text-align: left;
  }
  prayer-interface h1, prayer-interface h2, prayer-interface h3, prayer-interface h4 {
    margin:0px;
  }
  

  .profile-thumb-info {
    right:0px;
    left:50%;
    height:100%;
    width:50%;
    position: relative;
  }
  .smallScreenOnly {
    display: none;
  }
  .profile-thumb-info > div,
  .profile-thumb-info > prayer,
  .profile-thumb-info > eventtime 
  {
    width: calc(100% - 20px);
  }

  @media (max-width: 768px) {
    .profile-thumb-info {
      left:0px;
      width:100%;
    }
    .smallScreenOnly {
      display: block;
    }
  }
  prayer-interface a:visited {
    color: #00C4B0;
  }

  prayer-interface {
    display:block;
  }