.features-boxed{color:#313437;background-color:#eef4f7}.features-boxed h2{font-weight:700;margin-bottom:40px;padding-top:40px;color:inherit}@media (max-width:767px){.features-boxed h2{margin-bottom:25px;padding-top:25px;font-size:24px}}.features-boxed .intro{font-size:16px;max-width:500px;margin:0 auto}.features-boxed .intro p{margin-bottom:0}.features-boxed .features{padding:50px 0}.features-boxed .item{text-align:center}.features-boxed .item .box{text-align:center;padding:30px;background-color:#fff;margin-bottom:30px}.features-boxed .item .icon{font-size:60px;color:#1485ee;margin-top:20px;margin-bottom:35px}.features-boxed .item .name{font-weight:700;font-size:18px;margin-bottom:8px;margin-top:0;color:inherit}.features-boxed .item .description{font-size:15px;margin-top:15px;margin-bottom:20px}
.box:hover{
  border-color: #66afe9;
  box-shadow: 0 0 8px rgba(0,255,0, 0.6);
  background:rgba(0,255,0,0.1);cursor:default;
}
/*this small piece of code solved the focus issue for multiple modals */
.modal { overflow: auto !important;}
.modal-dialog{margin:0px;display:flex;margin:0 auto;}
#modalviewchurch .modal-dialog{min-width:80%;}

.row{border-bottom:2px solid #00ac8e;padding-top:20px}input{margin-bottom:10px;margin-top:3px}.btn{margin:5px}.suspicious{background:orange;color:#fff;float:left;padding:4px;border:dotted}.gi-2x{font-size:2em}.gi-3x{font-size:3em}.gi-4x{font-size:4em}.gi-5x{font-size:5em}
.time{border:2px solid #00ff38;padding:13px;color:green;float:right;background:#ff0;border-radius:20px;margin:10px}
.closetime{padding:5px;border:1px solid #000;border-radius:10px;background:#fff;margin-left:15px}
.time p{font-size:20px}.closetime:hover{background:#bcd}
.preview_string_style
{
    color:#40c181;
     background: white;border-top:1px solid #40c181;margin:10px 10px;
}
.preview_string_count
{
    border:1px solid #40c181;color:white;text-align: center;
    background:#40c181;border-radius:20px;width:30px;padding:4px;
}
.preview_string_text
{
    text-transform:lowercase;
    font-family: 'Ubuntu', sans-serif;
}
/* Google Maps with search */

  /* Always set the map height explicitly to define the size of the div
   * element that contains the map. */
  #map {
    height: 100%;
  }
  /* Optional: Makes the sample page fill the window. */
  html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
  #description {
    font-family: Roboto;
    font-size: 15px;
    font-weight: 300;
  }

  #infowindow-content .title {
    font-weight: bold;
  }

  #infowindow-content {
    display: none;
  }

  #map #infowindow-content {
    display: inline;
  }

  .pac-card {
    margin: 10px 10px 0 0;
    border-radius: 2px 0 0 2px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    outline: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    background-color: #fff;
    font-family: Roboto;
  }

  #pac-container {
    padding-bottom: 12px;
    margin-right: 12px;
  }

  .pac-controls {
    display: inline-block;
    padding: 5px 11px;
  }

  .pac-controls label {
    font-family: Roboto;
    font-size: 13px;
    font-weight: 300;
  }

  #pac-input {
    background-color: #fff;
    font-family: Roboto;
    font-size: 15px;
    margin-top: 12px;
    height:32px;
    border-radius:4px;
    font-weight: 300;
    margin-left: 12px;
    padding: 0 11px 0 13px;
    text-overflow: ellipsis;
    width: 400px;
  }

  #pac-input:focus {
    border-color: #4d90fe;
  }

  #title {
    color: #fff;
    background-color: #4d90fe;
    font-size: 25px;
    font-weight: 500;
    padding: 6px 12px;
  }
  #target {
    width: 345px;
  }

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* webapp Stylings */

.flex-container{display:flex;align-items:center;justify-content:center;flex-direction:column;}


.flex-container {
  display:flex;
  align-items:center;

}

.flex-dashinfo-top {
  display:flex;
  flex-direction:row;
  background:#00a875;
  padding:4px;
  border-radius:5px;
}

.dash-info-item-top {
  /*background:red;*/
  padding:10px;
  font-size:14px;
  margin:4px;
  flex-direction:column;
  display:flex;
  align-items:center;
}

.flex-dash-top-info-container {
  display:flex;
  justify-content:space-around;
  flex-direction:row;
  flex-wrap: wrap;
}

.dash-info-item-name {
  font-size:10px;
  color:white;
}

.dash-info-item-value {
  font-size:15px;
  color:white;
}
.container-webapp{padding:0px 10px}

/* Loader*/
.loader-holder{
  position:absolute;
  left:0px;top:0px;
  width:100%;
  height:100%;
  background: white;
  display:flex;
  justify-content: center;
  align-items: center;
  z-index: 99;
}

.loader {

  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.ambiguity:hover{
  border-color: yellow;
  box-shadow: 0 0 30px rgba(0,255,255, 0.7);
}
/* WebLocation stylings ends here */

/* nearby masses */
.church_name,.time{color:green;font-size:25px}.church_name,.distance,.time{font-size:25px}.city,.language,.rite,.time{font-weight:600}.city{color:Green}.address{color:grey;word-wrap:break-word}.distance{color:red}.language{color:green}.rite{color:red}

#login-form-card{
  border-radius:3px; border:1px solid green; padding:20px;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
}
#thank_you_jesus{
  height:93vh;overflow:hidden;display:flex;justify-content: center;align-items:center;
}
@media screen and (min-width: 0px) and (max-width: 990px) {

  #login-page{
    width: 100vw;
    margin:0px;
  }
  #content{height:100vh}

  #thank_you_jesus{height:100vh;}
}
.flex{display: flex;}
.flex-center{justify-content: center;align-items: center}

.svg-background{
  width: 100vw;min-height: 93vh;background-image: url("/img/vector-background.svg");
}