/*
 * file_name = representaciones__stylesheet.css
 *
 * file_type = CSS stylesheet
 *
 * description = CSS styles used by the page [Representactiones] where all the suppliers of medical products are listed.
 *               Each supplier's logo is displayed and id hyperlinked to the correspoding supplier landing page
 *                
 * descripción = Hoja de estilo para la página [Representaciones] donde se enumeran todos los proveedores de productos médicos.
 *               El logo de cada proveedor/representación esta en muestra y está vinculado a la página principal
 *               que corresponde a ese proveedor. 
 * 
 *
 */


div.representaciones__buttons_container
{
       /* background: azure; */
             column-gap: 1rem                  ;
                display: grid                  ;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
                 margin: 1rem auto 0rem auto   ;
                row-gap: 1rem                  ;
                  width: 90%                   ;

}


a.representaciones_supplier_button
{
       /* background: lightpink       ; */
      /* for vertical alignment of supplier's logo image */
      align-items: center            ; 
    border-radius: 1.5rem            ;
          display: flex              ;
  /* for horizontal alignment of supplier's logo image */
  justify-content: center            ;
          padding: 1rem              ;
       transition: all 0.6s          ;
}


a.representaciones_supplier_button:hover
{
  box-shadow: 0rem 0.5rem 1rem rgba(0,0,0,0.3)  ;
     z-index: 1   ;
}


img.representaciones_supplier_logo
{
  /* background: lightyellow; */
      max-height: 7rem             ;
       max-width: 90%             ;
}