.hsr .hsr__category{
  text-align: center;
}
.hsr  .hsr__nav_categories{text-align: center;}
.hsr  .hsr__nav_categories ul{
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.hsr  .hsr__nav_categories ul li{
  padding: 5px;
}
.hsr  .hsr__nav_categories ul li:not(:last-child){
  border-right: 2px solid #ececec;
}
.hsr  .hsr__nav_categories ul li a{
  cursor: pointer;
  border-radius: 6px;
  padding: 5px 1.5em;
}

.hsr .hsr__subcategory{
  margin: 8px 0 30px;
}

.hsr .hsr__listing-item{
  margin-bottom: 20px;
}

.hsr .hsr__listing-item p{
  margin:0;
}

.hsr .hsr_navigation{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.hsr .hsr_navigation > div{
  padding: 20px;
}


.hsr .hsr__categories ul{
  list-style: none;
  padding: 0;
  margin-bottom: 0;
  -ms-grid-columns: (1fr)[3];
  grid-template-columns: repeat(3,1fr);
  grid-gap: 20px;
  display: -ms-grid;
  display: grid;
}
.hsr .hsr__categories ul li{
  background: #ececec;
  padding: 20px;
}
.hsr .hsr__menu-link{
  display: block;
  text-decoration: none;
  font-size: 16px;
  line-height: 1;
  font-weight: bold;
}
.hsr .hsr__menu-title{
  color:#516eb0;
  margin: 0 0 10px;
  font-weight: inherit;
}
.hsr .hsr__menu-summary{
  color: #38464e;
  font-size: inherit;
  margin: 0 0 10px;
}
.hsr .hsr__menu-summary p:last-child{margin-bottom: 0;}

.hsr__main_text{
  -ms-grid-columns: 3fr 1fr;
  grid-template-columns: 3fr 1fr;
  grid-gap: 20px;
  display: -ms-grid;
  display: grid;
}

.hsr__main_text h1,
.hsr__main_text h2,
.hsr__main_text h3,
.hsr__main_text h4,
.hsr__main_text h5,
.hsr__main_text h6{
  color: #516eb0; 
}

.hsr__main_text .hsr__nav > img{
  margin-bottom: 1em;
}
.hsr__main_text .hsr__nav_text{
  background: #ececec;
  padding: 1em;
}
.hsr__main_text ul{
  color: #38464e;
  list-style: none;
}

.hsr__main_text ul li::before {
  content: "\2022";  
  color: #516eb0; 
  font-weight: bold; 
  display: inline-block; 
  width: 1em; 
  margin-left: -1em; 
}

@media (min-width:768px) and (max-width:992px){
  .hsr__main_text,
  .hsr .hsr__categories ul{
    -ms-grid-columns: repeat(2,1fr);
    grid-template-columns: repeat(2,1fr);
  }
}

@media (max-width:767px){
  .hsr__main_text,
  .hsr .hsr__categories ul{
    -ms-grid-columns: (1fr)[1];
    grid-template-columns: repeat(1,1fr);
  }
}

/*  Needed for filters */
.active{
  font-weight: 700;
  text-decoration: none;
  background-color: rgba(151,181,124,1.0);
  color: #fff;
  fill: #fff;
}
.hide { /* You can play with the seconds to change the "animation" */
  animation: fadeOut .5s ease 0s 1 normal forwards;
  transform-origin: center;
}
.show { /* You can play with the seconds to change the "animation" */
    animation: fadeIn .5s ease 0s 1 normal forwards;    
    transform-origin: center;
}

@keyframes hide {
  0%{
    transform: scale(1);        
  }
  100% {
    transform: scale(0);        
    width: 0;
    height: 0;
    margin: 0;
  }
}
@keyframes show {
  0%{
    transform: scale(0);     
    width: 0;
    height: 0;
    margin: 0;   
  }
  100% {
    transform: scale(1);    
  }
}
@-webkit-keyframes fadeIn{
  0%{
    opacity:0;
    display: none;
  }
  to{
    opacity:1;
    display: block;
  }
}
@keyframes fadeIn{
  0%{
    opacity:0;
    display: none;
  }
  to{
    opacity:1;
    display: block;
  }
}
@-webkit-keyframes fadeOut{
  0%{
    opacity:1;
    display: block;
  }
  to{
    opacity:0;
    display: none;
  }
}
@keyframes fadeOut{
  0%{
    opacity:1;
    display: block;
  }
  to{
    opacity:0;
    display: none;
  }
}
/*  // Needed for filters */