/*Masque l'élément avant la première carte et après la dernière, quel que soit le mode d'affichage et que le panneau à gauche soit ouvert ou fermé*/
#page .section-catalog .row.masonry-container:before,
#page .section-catalog .row.masonry-container:after
{
    display: none;
}

/*Fait en sorte que toutes les cartes aient la même hauteur et donc qu'elles soient toutes alignées
quel que soit le mode d'affichage et que le panneau à gauche soit ouvert ou fermé*/
#wrapper #page .section-catalog .row.masonry-container .item-mansory {
  display: flex !important;
  justify-content: center;
}

/*Supprime la marge interne des cartes + celle au-dessus de la vignette, quel l'affichage et que le panneau à gauche soit ouvert ou fermé
quel que soit le mode d'affichage et que le panneau à gauche soit ouvert ou fermé*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card,
#page .section-catalog .row.masonry-container .bibrecord-panel-card .panel-body
{
    padding: 0;
}


/*Centre la vignette du document si celle-ci ne prend pas toute la largeur,
quel que soit le mode d'affichage et que le panneau à gauche soit ouvert ou fermé*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card div[name="jacket_tpl"] {
	display: flex;
	justify-content: center;
}

/*Instaure une hauteur mini et maxi à la vignette du document, qu'il y en ait une ou que ça soit la vignette par défaut,
quel que soit en affichage mosaïque ou grille et que le panneau à gauche soit ouvert ou fermé*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card div[name="jacket_tpl"] > img,
#page .section-catalog .row.masonry-container .bibrecord-panel-card div[name="jacket_tpl"] > svg
{
    min-height: 230px;
    max-height: 230px;
    object-fit: contain;
}

/*Instaure une hauteur mini et maxi à la vignette du document, qu'il y en ait une ou que ça soit la vignette par défaut,
pour l'affichage liste, que le panneau à gauche soit ouvert ou fermé*/
#page .section-catalog .row.masonry-container.result-list div[name="jacket_tpl"] > svg,
#page .section-catalog .row.masonry-container.result-list div[name="jacket_tpl"] > img {
    max-height: 250px !important;
    width: auto;
}


/*Masque le titre du document quand celui-ci dépasse un nombre de lignes,
quel que soit le mode d'affichage et que le panneau à gauche soit ouvert ou fermé*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card .panel-body h5.panel-card-title a
{
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}

/*Masque la marge sous les titres des documents,
quel que soit le mode d'affichage et que le panneau à gauche soit ouvert ou fermé*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card .panel-body h5.panel-card-title
{
    margin-bottom: 0;
}

/*Place les éléments de la carte les uns en dessous des autres*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card
{
    display: flex;
    flex-direction: column;
}

/*Fait en sorte que les éléments sous la vignette occupent tout l'espace sur la hauteur*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card .panel-body:nth-child(2)
{
    flex: 1 0;
    display: flex;
    flex-direction: column;
}

/*Ajoute des marges internes autour des éléments sous la vignette*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card .panel-body:nth-child(2)
{
  padding: 0.5em 1em;
}

/*Concerne le bloc avec les boutons Voir la disponibilité + Réserver + Ajouter à ma liste d'envies + Partager*/
/*Ça permet de :
Centrer les éléments
Faire en sorte que les éléments soient les uns en desouss des autres
Faire en sorte que les éléments occupent toute la largeur du bloc
Ajouter une marge interne en bas*/
#page .section-catalog .row.masonry-container .bibrecord-panel-card .text-center.search-panel-footer
{
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 1em;
}

/*Les règles suivantes concernent les rubans Nouveauté, Numérique ...*/
.ribbon {
	overflow: visible;
	position: absolute;
	top: 0;
	z-index: 2;
	right: .5em !important;
}
.ribbon svg {
	transform: translate3d(0px, -6px, 0px);
	transition: all 0.3s ease-in-out 0s;
	width: 33px !important;
	height: 110px !important;
}

/*Positionnement du texte sur les rubans verticaux*/
.text.text-uppercase {
    transform: translate(0rem, -1rem) rotate(90deg);
}

@media (max-width:460px) {
  #page .section-catalog .row.masonry-container.result-list .result-list-item .panel-card>.row-flex {
    flex-direction: column;
    align-items: center;
  }
  #page .section-catalog .row.masonry-container.result-list .result-list-item .panel-card > .row-flex > div {
    width: 100% !important;
    max-width: 100%;
    display: flex;
    justify-content: center;
  }
}

@media (max-width:991px) {
    #page .section-catalog .row.masonry-container .bibrecord-panel-card
    {
        width: 100%;
    }
}

@media (min-width:768px) and (max-width:991px) {
    /*Passe le conteneur des cartes dans un système de grille, avec un espace entre les cartes, que le panneau à gauche soit ouvert ou fermé*/
    #page .section-catalog.opened .row.masonry-container
    {
        display: grid;
        column-gap: 1.5rem;
    }
    /*Quand le panneau des facettes est fermé mode mosaïque*/
    #page .section-catalog.opened .row.masonry-container.result-default
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 80px)/2),auto));
    }

    /*Quand le panneau des facettes est fermé mode grille*/
    #page .section-catalog.opened .row.masonry-container.result-grid
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 80px)/3),auto));
    }
    /*Cartes, quand le panneau des facettes est fermé et en mode mosaïque*/
    #page .section-catalog.opened .row.masonry-container.result-default .bibrecord-panel-card
    {
        max-width: calc((100vw - 80px)/2);
    }

    /*Cartes, quand le panneau des facettes est fermé et en mode grille*/
    #page .section-catalog.opened .row.masonry-container.result-grid .bibrecord-panel-card
    {
        max-width: calc((100vw - 80px)/3);
    }
}

@media (min-width:992px) {
    /*Passe le conteneur des cartes dans un système de grille, avec un espace entre les cartes, que le panneau à gauche soit ouvert ou fermé*/
    #page .section-catalog .row.masonry-container
    {
        display: grid;
        padding-top: 1.5rem;
    }
}


@media (min-width:992px) and (max-width:1199px) {
    /*Quand le panneau des facettes est ouvert mode mosaïque*/
    #page .section-catalog:not(.opened) .row.masonry-container.result-default
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 355px)/2),auto));
    }

    /*Quand le panneau des facettes est ouvert mode grille*/
    #page .section-catalog:not(.opened) .row.masonry-container.result-grid
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 370px)/3),auto));
    }

    /*Quand le panneau des facettes est fermé mode mosaïque*/
    #page .section-catalog.opened .row.masonry-container.result-default
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 80px)/2),auto));
    }

    /*Quand le panneau des facettes est fermé mode grille*/
    #page .section-catalog.opened .row.masonry-container.result-grid
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 95px)/3),auto));
    }

    /*Cartes, quand le panneau des facettes est ouvert et en mode mosaïque*/
    #page .section-catalog:not(.opened) .row.masonry-container.result-default .bibrecord-panel-card
    {
        max-width: calc((100vw - 355px)/2);
        width: 100%;
    }

    /*Cartes, quand le panneau des facettes est ouvert et en mode grille*/
    #page .section-catalog:not(.opened) .row.masonry-container.result-grid .bibrecord-panel-card
    {
        max-width: calc((100vw - 370px)/3);
        width: 100%;
    }

    /*Cartes, quand le panneau des facettes est fermé et en mode mosaïque*/
    #page .section-catalog.opened .row.masonry-container.result-default .bibrecord-panel-card
    {
        max-width: calc((100vw - 80px)/2);
        width: 100%;
    }

    /*Cartes, quand le panneau des facettes est fermé et en mode grille*/
    #page .section-catalog.opened .row.masonry-container.result-grid .bibrecord-panel-card
    {
        max-width: calc((100vw - 95px)/3);
        width: 100%;
    }
    /*Nombre de lignes au-delà duquel le titre du document est masqué, quand l'affichage est un affichage mosaïque*/
    #page .section-catalog .row.masonry-container.result-default .bibrecord-panel-card .panel-body h5.panel-card-title a
    {
        -webkit-line-clamp: 3;
    }

    /*Nombre de lignes au-delà duquel le titre du document est masqué, quand l'affichage est un affichage mosaïque*/
    #page .section-catalog .row.masonry-container.result-grid .bibrecord-panel-card .panel-body h5.panel-card-title a
    {
        -webkit-line-clamp: 4;
    }

    /*Hauteur des documents affichage mosaïque*/
    #page .section-catalog .row.masonry-container.result-default .bibrecord-panel-card .panel-body h5.panel-card-title
    {
        height: 3.3em;
    }

    /*Hauteur des documents affichage grille*/
    #page .section-catalog .row.masonry-container.result-grid .bibrecord-panel-card .panel-body h5.panel-card-title
    {
        height: 4.4em;
    }
}

@media (max-width:1199px) {
    /*Ajoute une marge interne à gauche et à droite de la liste de résultats de recherche
    afin que ceux-ci ne soient pas collés au bord droit de l'écran*/
    #page .section-catalog .row.masonry-container.result-list {
      padding: 0 15px;
    }
    /*Pour faire en sorte que les résultats de recherche en affichage Liste prennent toute la largeur de l'écran
    que le panneau des facettes soit ouvert ou non*/
    #page .section-catalog .row.masonry-container.result-list .result-list-item {
        width: 100%;
    }
}

@media (min-width:1200px) {
    /*Quand le panneau des facettes est ouvert mode mosaïque*/
    #page .section-catalog:not(.opened) .row.masonry-container.result-default
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 385px)/4),auto));
    }

    /*Quand le panneau des facettes est ouvert mode grille*/
    #page .section-catalog:not(.opened) .row.masonry-container.result-grid
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 415px)/6),auto));
    }

    /*Quand le panneau des facettes est fermé mode mosaïque*/
    #page .section-catalog.opened .row.masonry-container.result-default
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 110px)/4),auto));
    }

    /*Quand le panneau des facettes est fermé mode grille*/
    #page .section-catalog.opened .row.masonry-container.result-grid
    {
        grid-template-columns: repeat(auto-fill,minmax(calc((100vw - 140px)/6),auto));
    }

    /*Cartes, quand le panneau des facettes est ouvert et en mode mosaïque*/
    #page .section-catalog:not(.opened) .row.masonry-container.result-default .bibrecord-panel-card
    {
        max-width: calc((100vw - 385px)/4);
        width: 100%;
    }

    /*Cartes, quand le panneau des facettes est ouvert et en mode grille*/
    #page .section-catalog:not(.opened) .row.masonry-container.result-grid .bibrecord-panel-card
    {
        max-width: calc((100vw - 415px)/6);
        width: 100%;
    }

    /*Cartes, quand le panneau des facettes est fermé et en mode mosaïque*/
    #page .section-catalog.opened .row.masonry-container.result-default .bibrecord-panel-card
    {
        max-width: calc((100vw - 110px)/4);
        width: 100%;
    }

    /*Cartes, quand le panneau des facettes est fermé et en mode grille*/
    #page .section-catalog.opened .row.masonry-container.result-grid .bibrecord-panel-card
    {
        max-width: calc((100vw - 140px)/6);
        width: 100%;
    }
    /*Nombre de lignes au-delà duquel le titre du document est masqué, quand l'affichage est un affichage mosaïque*/
    #page .section-catalog .row.masonry-container.result-default .bibrecord-panel-card .panel-body h5.panel-card-title a
    {
        -webkit-line-clamp: 3;
    }

    /*Nombre de lignes au-delà duquel le titre du document est masqué, quand l'affichage est un affichage mosaïque*/
    #page .section-catalog .row.masonry-container.result-grid .bibrecord-panel-card .panel-body h5.panel-card-title a
    {
        -webkit-line-clamp: 4;
    }

    /*Hauteur des documents affichage mosaïque*/
    #page .section-catalog .row.masonry-container.result-default .bibrecord-panel-card .panel-body h5.panel-card-title
    {
        height: 3.3em;
    }

    /*Hauteur des documents affichage grille*/
    #page .section-catalog .row.masonry-container.result-grid .bibrecord-panel-card .panel-body h5.panel-card-title
    {
        height: 4.4em;
    }

    /*Pour centrer les résultats de recherche en affichage Liste*/
    #page .section-catalog .row.masonry-container.result-list .result-list-item {
      width: 83.33333333%;
      margin: 0 auto;
    }
}