.circle-red{
   width: 20px;
   height: 20px;
   font-size: 20px;
   border-radius: 100px;
  display: inline-block;
  background-color: red;
}

.full-width-btn a span, 
.full-width-btn a {
    width: 100%;
    text-align: center !important;
    box-sizing: border-box;
}
.img-grayscale {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

.img-grayscale:hover {
  filter: none;
  -webkit-filter: grayscale(0%);
}
/*tab*/
#item-16534859170 ul.nav.nav-tabs li.active a {
    color: var(--title-inverse);
    background-color: var(--primary);
  border-radius: 5px
}

/*animate pulse*/
@keyframes example {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(2);
  }
}
.circle-red{
    width: 14px;
    height: 14px;
    font-size: 14px;
    border-radius: 100px;
    display: block;
}

.number-animated{
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: var(--title-inverse);
    padding-bottom: 15px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 15px;}

#item-16546030730 p{
    animation-duration: 1s;
    animation-delay: 0.4s;
}

@keyframes eurohop-hopin-number {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.35);
  }
  
}

#item-16546030730 p, #item-16546049160202 p {
  animation-name: eurohop-hopin-number;
  animation-duration: 0.2s;
  animation-iteration-count: 1;
  animation-delay: 0.4s;
}
#item-16546039443311 p, #item-16546049160204 p{  
  animation-name: eurohop-hopin-number;
  animation-duration: 0.2s;
  animation-iteration-count: 1;
  animation-delay: 1s;}
#item-16546039535761 p, #item-16546049160206 p{
    animation-name: eurohop-hopin-number;
  animation-duration: 0.2s;
  animation-iteration-count: 1;
  animation-delay: 1.5s;
}

.numberCircle {
  display: inline-block;
  line-height: 0px;
  border-radius: 50%;
  background-color: red;
  font-size: 20px;
  color: white;
  transition: 0.2s all ease;
}

.numberCircle span {
  display: inline-block;
  padding-top: 50%;
  padding-bottom: 50%;
  margin-left: 18px;
  margin-right: 18px;
  text-align: center:
}
.reveal{
  position: relative;
  transform: translateY(0px);
  opacity: 0;
  transition: 0.2s all ease;

}

.reveal.active{
  transform: translateY(0);
  opacity: 1;
  animation-name: eurohop-hopin-number;
  animation-duration: 0.2s;
  animation-iteration-count: 1;
  -webkit-transition: transform 0.5s ease-in-out;
transition: transform 0.5s ease-in-out; 
}
.delay-1{
animation-delay: 0.3s;}
.delay-2{
animation-delay: 0.6s;}
.delay-3{
animation-delay: 0.9s;}
#item-1772279480157 ul.nav.nav-tabs li.active a {
    color: var(--bg-primary);background-color: var(--primary);
}