/*https://mdbootstrap.com/docs/jquery/css/colors/*/
-- 
*{font-family: 'Baloo 2', cursive;}
.letra1{font-family: 'Baloo 2', cursive;}
.letra2{font-family: 'Noto Sans SC', sans-serif; }
.letra3{font-family: 'Maven Pro', sans-serif;}

/*	HOME	*/
  .bg-home{
  	background-image: url('../img/bg_4.jpg');
  	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
  	min-height: 500px;
  }
  .text-shadow{text-shadow:3px 8px 12px black;}

  .hover-effect:hover h3, .hover-effect:hover i.hover{ color: #ffc107;}

/*	PAGINATION	*/
  .pagination > li > button
  {
      background-color: white;
      color: var(--yellow);
  }

  .pagination > li > button:focus,
  .pagination > li > button:hover,
  .pagination > li > span:focus,
  .pagination > li > span:hover
  {
      color: var(--yellow);
      background-color: #eee;
      border-color: #ddd;
  }

  .pagination > .active > button.page-link
  {
      color: white;
      background-color: var(--yellow);
      border: solid 1px var(--yellow);
  }

  .pagination > .active > button:hover
  {
      background-color: var(--yellow);
      border: solid 1px var(--yellow);
  }

/* DROPDOWN*/
  .dropdown-menu>a.active{
    background-color: #ffc107;
    color: #16181b;
  }
  .dropdown-menu>a:hover,.dropdown-item:hover,
  .dropdown-menu>a:focus, .dropdown-item:focus{
    color: #16181b;
    background-color: #f8f9fa;
  }

/*FIXED ELEMENTS*/
  #btnTop{
    position:fixed;
    bottom:10px;
    right:10px;
  }
  .filter{   
      position:fixed;
      top:75px; 
      right:5px;
  }

/*GRID AUTO-FLOW*/
  .grid-captivity {
    display: grid;
    grid-auto-flow: row; /*options: row|column|dense*/
    grid-template-columns: repeat(3, auto);
  }

  .grid-genetics{
    display: grid;
    grid-auto-flow: row; /*options: row|column|dense*/
    grid-template-columns: repeat(5, auto);
  }

/* CHECKBOX COLOR*/
  .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    border-color: #ffc107;
    background-color: #ffc107;
  }

/* SCROLLBAR */
  .fasta {
    overflow-y: scroll; /* Add the ability to scroll */
  }
  .fasta::-webkit-scrollbar {
      display: none; /* Hide scrollbar for Chrome, Safari and Opera */
  }
  .fasta {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }