#filterOn:hover{
    color: white;
    background-color:var(--color-primary);  
    }
.carousel-control-next,.carousel-control-prev{
  color: var(--color-primary)!important;  
}
.carousel-control-prev-icon{
 background-image :url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23004d66'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e")    
}
.carousel-control-next-icon{/**/
  background-image : url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23004d66'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.bi-arrow-left-square,.bi-arrow-right-square {
    font-size: 2.5vw;
  }
.icon-text{
    font-size: 0.8vw;
    color: var(--color-primary)!important;
}
.carousel-inner h5{
    font-size: 1vw;
}
.catchReport h5{
    font-size: 1vw;
}
@media (max-width: 767px) {
.icon-text{
    font-size: 2vw;
}    
.carousel-inner h5{
    font-size: 2.5vw;
}
.card-text,.card-footer{
    font-size: 2vw;
}
.catchReport h5,.card-header .fishSummaryTitle{
    font-size: 3vw;
}

}

.card-footer.carousel-control-next-icon, .card-footer.carousel-control-prev-icon {
    width: 5rem;
    height: 5rem;}

.carousel .carousel-indicators button {
    width: 15px;
   height: 15px;
   border-radius: 100%;
   background-color: var(--color-secondary)!important;
 }
 .carousel-indicators{
    bottom: inherit;
 }
.carousel-indicators {top: -0.65rem;}
 .carousel-indicators .active{
    background-color: var(--color-primary)!important;
 }
.catchFisheriesCarouselModal> button.carousel-control-prev,.catchFisheriesCarouselModal> button.carousel-control-next, 
#carouselCatchFisheriesbyDate > button.carousel-control-prev,#carouselCatchFisheriesbyDate > button.carousel-control-next,
#carouselCatchFisheriesbyFishery > button.carousel-control-prev,#carouselCatchFisheriesbyFishery > button.carousel-control-next
{
    align-items: flex-start;
    padding-top: 0.2rem;
}
.catchFisheriesCarouselModal> button.carousel-control-prev,.catchFisheriesCarouselModal> button.carousel-control-next, 
#carouselCatchFisheriesbyDate > button.carousel-control-next,#carouselCatchFisheriesbyFishery > button.carousel-control-next
,
#carouselCatchFisheriesbyDate > button.carousel-control-prev,#carouselCatchFisheriesbyFishery > button.carousel-control-prev
,
#selectedFisheryCarousel > a.carousel-control-next > span
,
#selectedFisheryCarousel > a.carousel-control-prev > span{
    color: var(--color-primary);

}
.text-primary{
    color: var(--color-primary);
    font-size: medium;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
  border: 2px solid #004d66;
  border-radius: 50%;   /* makes it circular */
  width: 3rem;
  height: 3rem;
  background-size: 50% 50%;
  background-position: center;
  background-repeat: no-repeat;
}