.logo {
  width: auto;
  height: 40px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: grayscale(1);
  transition: filter 0.3s ease;
}

.logo:hover {
  filter: grayscale(0);
}

/* Logos mapped to background images */
.logo.geico { background-image: url('/static/logos/geico.svg'); }
.logo.progressive { background-image: url('/static/logos/progressive.svg'); }
.logo.statefarm { background-image: url('/static/logos/statefarm.svg'); }
.logo.allstate { background-image: url('/static/logos/allstate.svg'); }
.logo.usaa { background-image: url('/static/logos/usaa.svg'); }
.logo.liberty-mutual { background-image: url('/static/logos/liberty-mutual.svg'); }
.logo.farmers { background-image: url('/static/logos/farmers.svg'); }
.logo.autoowners { background-image: url('/static/logos/AutoOwners.svg'); }
.logo.aaa { background-image: url('/static/logos/aaa.svg'); }
.logo.hartford { background-image: url('/static/logos/hartford.svg'); }
.logo.travelers { background-image: url('/static/logos/Travelers.svg'); }
.logo.kemper { background-image: url('/static/logos/Kemper.svg'); }
.logo.mapfre { background-image: url('/static/logos/mapfre.svg'); }
.logo.chubb { background-image: url('/static/logos/Chubb.svg'); }
.logo.mercury { background-image: url('/static/logos/mercury.svg'); }
.logo.amica { background-image: url('/static/logos/amica.svg'); }
.logo.shelter { background-image: url('/static/logos/shelter.svg'); }
.logo.nationalgeneral { background-image: url('/static/logos/NationalGeneral.svg'); }
.logo.nationwide { background-image: url('/static/logos/nationwide.svg'); }
.logo.esurance { background-image: url('/static/logos/Esurance.svg'); }
.logo.infinity { background-image: url('/static/logos/infinity.svg'); }
.logo.dairyland { background-image: url('/static/logos/Dairyland.svg'); }