.zac-activity-thumb {
  cursor: pointer;
  /* border: 1px solid #bbb; padding: 1em; border-radius: 50%; */
  display: inline-block; 
  margin-right:30px;margin-bottom:0px;
}
.zac-activity-thumb .img-container:hover {background-color: #f8f8f8;}
.zac-activity-thumb .img-container{
  background-color:#f4f4f4;
  position:relative;
  width:150px;
  height:150px;
  padding:0px;
  border:2px solid #666; border-radius: 30%; box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.7) !important; 
  }
  .zac-activity-thumb .img-container .adding-color{ /* remove the adding.color class to enable yellow background */
    background: #edeeef; /* Old browsers */
    background: -moz-linear-gradient(top, #edeeef 0%, #a9b7ce 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #edeeef 0%,#a9b7ce 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #edeeef 0%,#a9b7ce 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#edeeef', endColorstr='#a9b7ce',GradientType=0 ); /* IE6-9 */

    background: #f1e767; /* Old browsers */
    background: -moz-linear-gradient(top, #f1e767 0%, #feb645 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #f1e767 0%,#feb645 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #f1e767 0%,#feb645 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645',GradientType=0 ); /* IE6-9 */
  }
.zac-activity-thumb img {
  /* margin-top: 0px; margin-bottom: 0px; */
  /*position:absolute;*/
  padding:6px;
  top:0;
  bottom:0;
  margin:auto;
  max-height: 100%;  
  max-width: 100%; 
  width:auto;
  height:auto;
  /* height:150px */
}
.zac-activity-thumb div.thumb-title {
  width:100%; text-align:center; vertical-align: middle;
  margin-top:0.5em;
  color: #333; background-color: white; font-weight:700;
  font-family: 'Ravi Prakash'; font-size: 1.4em;
  min-height: 3em;
  padding-top:; 0.5em; padding-bottom:; 0.2em;
}


.zac-activity-thumb:hover  {
  opacity: 0.8;
}

/* Hero image and title for the single activity */
div.darken-overlay {
  width:100%; height: 100%; background-color: rgba(0,0,0,0.1);
}
div.page-thumbnail { margin-top:0px; height:400px; }
div.page-thumbnail div.thumbnail-container {background-size: cover; background-position:bottom;}
div.page-thumbnail div.thumbnail-container div.row {height:400px;}
div.page-thumbnail  h1.page-title {
  margin-top:220px; text-align:center; 
  font-family: "Raleway";
  color:white; font-size:4em;
  -webkit-animation-duration: 1s;
  -webkit-animation-delay: 0s;
  // padding-left:10px;
  text-shadow: -1px 0 #888, 0 1px #888, 1px 0 #888, 0 -1px #888;
  
}



/*div.hello-personthumb {text-align:center;}
div.hello-personthumb img {border-radius: 50%; border: 1px solid #888; max-width:180px;}
div.hello-personthumb div.name {margin-top:0.4em; font-size:1.3em; font-weight:500;}
div.hello-personthumb div.jobtitle {margin-top:0.2em; font-size:1.1em; font-weight:300; font-style:italic;}
div.hello-personthumb div.excerpt {margin-top:0.2em; margin-bottom:2em; line-height:1.3em;}

div.modal-hello-person {}
/* div.modal-hello-person div.img-wrapper {width: 150px; float:left; } */
/* div.modal-hello-person div.img-wrapper img {width:150px; display:inline; padding-right: 1em; padding-botton: 1em; border: 0px;} */
div.modal-hello-person div.img-wrapper {width: 150px; float:left; padding-right:8px;}
div.modal-hello-person div.img-wrapper img {width:150px; display:inline; border: 1px solid black;}
div.modal-hello-person div.description { display:inline;; font-size:0.9em; line-height: 1.3em;}
button.ui-dialog-titlebar-close {}
.ui-dialog .ui-dialog-titlebar-close span {margin:0px !important;}


.ui-dialog .ui-dialog-titlebar-close span {
  margin: -8px !important; /* Don't ask me why the close 'x' is wrongly positioned by default */
}
.ui-widget-content { background: #eee !important;}
*/