:root {
    --widthImg: 17.125rem; /*274px;*/
    --margeImg: 3.125rem; /*50px;*/
    --widthImg1: 274;
    --margeImg1: 50;
    --widthImg2: 164;
    --margeImg2: 30;
    --widthImg3: 110;
    --margeImg3: 10;
}
/*content*/
.contentBlock, .content {
    min-height: inherit;
}
.contentBlock {
    overflow: hidden;
}
br{
    display:none;
}
.bt_block {
    background-color: #000000;
	color: white;
    display: inline-block;
    width: 100%;
    background-image: url('../../../Images/_Common/Svg/btDownBlack.svg');
    background-repeat: no-repeat;
}
    .bt_block.open {
        background-image: url('../../../Images/_Common/Svg/btUpBlack.svg');
        background-repeat: no-repeat;
    }
.btDel {
    background-image: url('../../../Images/_Common/Svg/btDelBlack.svg');
    background-repeat: no-repeat;
    background-size:contain;
    display: inline-block;
    position: absolute;
}
.titreArt {
    position: relative;
    padding-right: 2rem;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.divButton {
    margin-top: auto;
    display: flex;
    justify-content: flex-end;
    width: 100%;
}
.divArticle {
    width: 100%;
    display: flex;
	align-items: stretch; 
}
.divImgPanier {
    align-self: flex-start;
	line-height: 0;
}
.infosArtPanier {
    display: flex;
    flex-direction: column;
}
    .divImgPanier img {
        width: inherit;
		display: block;
		vertical-align: top;
    }
.ligneArt {
    width: 100%;
    float: left;
}
.blockContentPanier .button {
    border: var(--border);
    display: inline-block;
    text-align: center;
}
/*.blockLandings .button {
    border: unset;
    display: unset;
    text-align: unset;
}*/
.article{
    border-bottom:var(--border);
}
.info {
    background-image: url(../../../Images/_Common/Svg/listePicto.svg);
    background-repeat: no-repeat;
    background-position: center left;
}
.infos {
    position:relative;
}
.btPanier.btDevis {
    position: absolute;
}
.accroche {
    font-family: GrandPalais-Regular, sans-serif;
    color: #000;
    text-transform: uppercase;
}
.info {
    font-family: GrandPalais-Medium, sans-serif;
    color: #000;
}
/*panier vide*/
.infoPanier {
    padding-top: 10px;
    padding-bottom: 10px;
}
.buttons {

}
    .buttons .btPanier {
        margin-right: 10px;
        margin-top: 10px;
    }
    .buttons .btPanier:nth-child(2n) {
        margin-right: 0;
    }
/*--------Font-size--------*/
/*maxWidth 600px*/
.bt_block {
    font-size: calc((14 / var(--width3)) * 100vw);
}
.btArticle {
    font-size: calc((14 / var(--width3)) * 100vw);
}
.matiereArt {
    font-size: calc((10 / var(--width3)) * 100vw);
}
.variantes {
    font-size: calc((10 / var(--width3)) * 100vw);
}
.prixArt {
    font-size: calc((14 / var(--width3)) * 100vw);
}
.btPanier {
    font-size: calc((10 / var(--width3)) * 100vw);
}
.accroche {
    font-size: calc((10 / var(--width3)) * 100vw);
}
.info {
    font-size: calc((10 / var(--width3)) * 100vw);
    line-height: calc((14 / var(--width3)) * 100vw);
}
/*-----600px------ */
@media (min-width: 37.563em) {
    .bt_block {
        font-size: calc((19 / var(--width2)) * 100vw);
    }
    .btArticle {
        font-size: calc((24 / var(--width2)) * 100vw);
    }
    .matiereArt {
        font-size: calc((12.1 / var(--width2)) * 100vw);
    }
    .variantes {
        font-size: calc((12.1 / var(--width2)) * 100vw);
    }
    .prixArt {
        font-size: calc((24 / var(--width2)) * 100vw);
    }
    .btPanier {
        font-size: calc((12.1 / var(--width2)) * 100vw);
    }
    .accroche {
        font-size: calc((12.1 / var(--width2)) * 100vw);
    }
    .info {
        font-size: calc((12.1 / var(--width2)) * 100vw);
        line-height: calc((14 / var(--width2)) * 100vw);
    }
}
/*--------1110x---------*/
@media (min-width: 69.438em) {
    /*font-size*/
    .bt_block {
        font-size: calc((32 / var(--width1)) * 100vw);
    }
    .btArticle {
        font-size: calc((40 / var(--width1)) * 100vw);
    }
    .matiereArt {
        font-size: calc((22 / var(--width1)) * 100vw);
    }
    .variantes {
        font-size: calc((22 / var(--width1)) * 100vw);
    }
    .prixArt {
        font-size: calc((34 / var(--width1)) * 100vw);
    }
    .btPanier {
        font-size: calc((25 / var(--width1)) * 100vw);
    }
    .accroche {
        font-size: calc((18 / var(--width1)) * 100vw);
    }
    .info {
        font-size: calc((20 / var(--width1)) * 100vw);
        line-height: calc((24 / var(--width1)) * 100vw);
    }
}
/*--------1921px---------*/
@media (min-width: 120.063em) {
    /*font-size*/
    .bt_block {
        font-size: 2rem;
    }
    .btArticle {
        font-size: 2.5rem;
    }
    .matiereArt {
        font-size: 1.375rem;
    }
    .variantes {
        font-size: 1.375rem;
    }
    .prixArt {
        font-size: 2.125rem;
    }
    .btPanier {
        font-size: 1.5625rem;
    }
    .accroche {
        font-size: 1.125rem;
    }
    .info {
        font-size: 1.25rem;
        line-height: 1.5rem;
    }
}



.blockContentPanier .button {
    padding: 1.25rem 0;
    width: 38.938rem;
}
/*.blockLandings .button {
    padding: unset;
    width: unset;
}*/
.bt_block {
    padding: 0.625rem var(--padding);
    background-position: center right var(--padding);
    background-size: 2.25rem 2.25rem;
    padding-right: calc(var(--padding) + 2.25rem);
}
    .bt_block.open {
        background-position: center right var(--padding);
        background-size:  2.25rem 3.625rem;
        padding-right: calc(var(--padding) + 3.625rem);
    }
.btDel {
    width: 2.25rem;
    height: 2.25rem;
    right: 0;
    top: 0.4rem;
}
.divArticle {
    padding: 2.375rem var(--padding);
}
    .infos {
        padding: 0 var(--padding);
    }
.info {
    padding-left: 1.375rem;
    background-size: 1rem;
}

	.titreArt {
		margin-top: -0.563rem;
		padding-bottom: 0.875rem;
	}
	.variantes {
		padding-bottom: 2.125rem;
		
	}
	.prixArt {
		padding-bottom: 2.25rem;
		
	}
	
.accroche {
    padding: 1.5rem 0;
}
.btPanier.btDevis {
    right: var(--padding);
    top: 2.75rem;
}
.interblocs-text-long {
    margin-bottom: 3.125rem;
}
.infosArtPanier {
    width: calc(100% - (((var(--widthImg1) + var(--margeImg1)) * (2000 / var(--width1))) / 16 * 1rem));
}
.divImgPanier {
    width: calc(((var(--widthImg1) + var(--margeImg1)) * (2000 / var(--width1))) / 16 * 1rem);
}
    .divImgPanier a {
        width: calc((var(--widthImg1) * (2000 / var(--width1))) / 16 * 1rem);
        margin-right: calc((var(--margeImg1) * (2000 / var(--width1))) / 16 * 1rem);
    }
/*--------1920px---------*/
@media (max-width: 120em) {	
	
    .blockContentPanier .button {
        padding: calc((20 / var(--width1)) * 100vw) 0;
        width: calc((623 / var(--width1)) * 100vw);
    }
/*	.blockLandings .button {
        padding: unset;
        width: unset;
    }*/
    .bt_block {
        padding: calc((10 / var(--width1)) * 100vw) var(--padding);
        background-position: center right var(--padding);
        background-size: calc((36 / var(--width1)) * 100vw) calc((36 / var(--width1)) * 100vw);
        padding-right: calc(var(--padding) + calc((36 / var(--width1)) * 100vw));
    }
        .bt_block.open {
            background-position: center right var(--padding);
            background-size: calc((36 / var(--width1)) * 100vw) calc((58 / var(--width1)) * 100vw);
            padding-right: calc(var(--padding) + calc((58 / var(--width1)) * 100vw));
        }
    .btDel {
        width: calc((36 / var(--width1)) * 100vw);
        height: calc((36 / var(--width1)) * 100vw);
        right: 0;
        top: 0.4rem;
    }
    .divArticle {
        padding: calc((38 / var(--width1)) * 100vw) var(--padding);
    }
    .infos {
        padding: 0 var(--padding);
    }
    .info {
        padding-left: calc((22 / var(--width1)) * 100vw);
        background-size: calc((16 / var(--width1)) * 100vw);
    }
	.titreArt {
		margin-top: calc((-9 / var(--width1))* 100vw);
		padding-bottom: calc((14 / var(--width1)) * 100vw);
	}
	.variantes {
		padding-bottom: calc((34 / var(--width1)) * 100vw);
		
	}
	.prixArt {
		padding-bottom: calc((36 / var(--width1)) * 100vw);
		
	}
    .accroche {
        padding: calc((24 / var(--width1)) * 100vw) 0;
    }
    .btPanier.btDevis {
        right: var(--padding);
        top: calc((44 / var(--width1)) * 100vw);
    }
    .interblocs-text-long {
        margin-bottom: calc((50 / var(--width1)) * 100vw);
    }
    .infosArtPanier {
        width: calc(100% - (((var(--widthImg1) + var(--margeImg1)) / var(--width1)) * 100vw));
    }
    .divImgPanier {
        width: calc(((var(--widthImg1) + var(--margeImg1)) / var(--width1)) * 100vw);
    }
        .divImgPanier a {
            width: calc((var(--widthImg1) / var(--width1)) * 100vw);
            margin-right: calc((var(--margeImg1) / var(--width1)) * 100vw);
        }
}
/*--------1110px---------*/
@media (max-width: 69.375em) {
    .blockContentPanier .button {
        padding: calc((15 / var(--width2)) * 100vw) 0;
        width: calc((346 / var(--width2)) * 100vw);
    }
    .bt_block {
        padding: calc((10 / var(--width2)) * 100vw) var(--padding2);
        background-position: center right var(--padding2);
        background-size: calc((22 / var(--width2)) * 100vw) calc((22 / var(--width2)) * 100vw);
        padding-right: calc(var(--padding2) + calc((22 / var(--width2)) * 100vw));
    }
        .bt_block.open {
            background-position: center right var(--padding2);
            background-size: calc((22 / var(--width2)) * 100vw) calc((34 / var(--width2)) * 100vw);
            padding-right: calc(var(--padding2) + calc((34 / var(--width2)) * 100vw));
        }
    .btDel {
        width: calc((22 / var(--width2)) * 100vw);
        height: calc((22 / var(--width2)) * 100vw);
        right: 0;
        top: 0.4rem;
    }
    .divArticle {
        padding: calc((25 / var(--width2)) * 100vw) var(--padding2);
    }
    .infos {
        padding: 0 var(--padding2);
    }
    .info {
        padding-left: calc((15 / var(--width2)) * 100vw);
        background-size: calc((10 / var(--width2)) * 100vw);
    }
	.titreArt {
		margin-top: calc((-5 / var(--width2))* 100vw);
		padding-bottom: calc((5 / var(--width2)) * 100vw);
	}
	.variantes {
		padding-bottom: calc((10 / var(--width2)) * 100vw);
		
	}
	.prixArt {
		padding-bottom: calc((15 / var(--width2)) * 100vw);
		
	}
    .accroche {
        padding: calc((14 / var(--width2)) * 100vw) 0;
    }
    .btPanier.btDevis {
        right: var(--padding2);
        top: calc((34 / var(--width2)) * 100vw);
    }
    .interblocs-text-long {
        margin-bottom: calc((30 / var(--width2)) * 100vw);
    }
    .infosArtPanier {
        width: calc(100% - (((var(--widthImg2) + var(--margeImg2)) / var(--width2)) * 100vw));
    }
    .divImgPanier {
        width: calc(((var(--widthImg2) + var(--margeImg2)) / var(--width2)) * 100vw);
    }
        .divImgPanier a {
            width: calc((var(--widthImg2) / var(--width2)) * 100vw);
            margin-right: calc((var(--margeImg2) / var(--width2)) * 100vw);
        }
}
/*-----600px------ */
@media (max-width: 37.5em) {
    * {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .blockContentPanier .button {
        padding: calc((5 / var(--width3)) * 100vw) calc((8 / var(--width3)) * 100vw);
        width:100%;
    }
    .bt_block {
        padding: calc((10 / var(--width3)) * 100vw) var(--padding3);
        background-position: center right var(--padding3);
        background-size: calc((18 / var(--width3)) * 100vw) calc((18 / var(--width3)) * 100vw);
        padding-right: calc(var(--padding3) + calc((18 / var(--width3)) * 100vw));
    }
        .bt_block.open {
            background-position: center right var(--padding3);
            background-size: calc((18 / var(--width3)) * 100vw) calc((28 / var(--width3)) * 100vw);
            padding-right: calc(var(--padding3) + calc((28 / var(--width3)) * 100vw));
        }
    .btDel {
        width: calc((18 / var(--width3)) * 100vw);
        height: calc((18 / var(--width3)) * 100vw);
        right: 0;
        top: 0.4rem;
    }

    .divArticle {
        padding: calc((20 / var(--width3)) * 100vw) var(--padding3);
    }
    .infos {
        padding: 0 var(--padding3);
		display: flex;
		flex-direction: column;
    }
    .info {
        padding-left: calc((12 / var(--width3)) * 100vw);
        background-size: calc((8 / var(--width3)) * 100vw);
    }
	.titreArt {
		margin-top: calc((-5 / var(--width3)) * 100vw);
		padding-bottom: calc((5 / var(--width3)) * 100vw);
	}
	.variantes {
		padding-bottom: calc((5 / var(--width3)) * 100vw);
		
	}
	.prixArt {
		padding-bottom: calc((8 / var(--width3)) * 100vw);
		
	}
    .accroche {
        padding: calc((14 / var(--width3)) * 100vw) 0;
    }
    .btPanier.btDevis {
        position: relative;
        right: unset;
		top: unset;
		padding-top: calc((14 / var(--width3))* 100vw);
		order: -1;
    }
    .interblocs-text-long {
        margin-bottom: calc((30 / var(--width3)) * 100vw);
    }
    .infosArtPanier {
        width: calc(100% - (((var(--widthImg3) + var(--margeImg3)) / var(--width3)) * 100vw));
    }
    .divImgPanier {
        width: calc(((var(--widthImg3) + var(--margeImg3)) / var(--width3)) * 100vw);
    }
        .divImgPanier a {
            width: calc((var(--widthImg3) / var(--width3)) * 100vw);
            margin-right: calc((var(--margeImg3) / var(--width3)) * 100vw);
        }
}