/* GBEL Liste produits (Abonnements) */

.ProductListComponent .section{
    background-color: #f6f6f6;
}

.ProductListComponent .section .constrain h1{
    display: none;
}

.ProductListComponent  {
    padding-top: 80px;
    background-color: #e6e6e659;
    /*background-color: var(--lightGrey);*/
}

    .ProductListComponent h1 {
        position: relative;
        line-height: 3rem;
        font-size: 2.4rem;
    }

        /*.ProductListComponent h1::before {
            content: "Étape 1 sur 2";
            display: block;
            line-height: 2.4rem;
            font-family: "UnitOT-Medi", "Trebuchet MS", Arial, Helvetica, sans-serif;
            font-size: 1.6rem;
            margin: 0 0 5px 0;
        }*/

            .ie .ProductListComponent #ad_portal {
                background-color: #e6e6e6;
                background-color: var(--lightGrey);
            }
            .ie .ProductListComponent h1::before {
                padding-top: 10px;
            }

        .skin_red1.ProductListComponent h1::before {
            color: var(--red1);
            color: #e3013a;
        }

        .skin_red2.ProductListComponent h1::before {
            color: var(--red2);
            color: #e30613;
        }

        .skin_blue1.ProductListComponent h1::before {
            color: var(--blue1);
            color: #0069b4;
        }

        .skin_blue2.ProductListComponent h1::before {
            color: var(--blue2);
            color: #0076c0;
        }

.GBEL_productList {
    overflow: hidden;
}

.GBEL_productList h2 {
    margin-bottom: 30px;
    font-family: "UnitOT", "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: 700;
}

#FormOrderProduct .hpProduct {
    display: none;
}

.GBEL_productList .univers + .univers {
    /*margin-top: 55px;*/
    margin-top: 100px;
}

.GBEL_productList .univers {
    overflow: hidden;
    margin-top: 15px;
}

    .GBEL_productList .univers .univers-header {
        margin-bottom : 2%;
    }

    .GBEL_productList .univers .univers-header .univers-header-title{
        font-size: 50px;
        font-weight: bold;
        text-align: center;
    }

    .GBEL_productList .univers .univers-header .univers-header-content{
        text-decoration: underline;
        text-align: right;
    }

    .GBEL_productList .lSPagerContainer {
        display: none;
    }

    .GBEL_productList .productsWrapper {
        overflow-x: scroll;
    }

        @media screen and (min-width: 1000px) {
            .GBEL_productList .productsWrapper {
                overflow-x: auto;
            }
        }

    .GBEL_productList .mobileView {
        display: none;
    }

    /*.GBEL_productList .desktopView {
        display: block;
    }*/

    

    /* .GBEL_productList .univers .products {
        width: 1000px;
    } */

    .GBEL_productList .univers .products.mobileScroll {
        overflow-y: hidden;
        white-space: normal;
    }

        @media screen and (min-width: 1000px) {
            .GBEL_productList .univers .products {
                clear: both;
            }
        }

        .GBEL_productList .univers .products.auto {
            position: relative;
            /*transform: scale(0.62);*/
            /*margin-left: -100px;*/
                /*margin-left: -66%;*/
        }

        .GBEL_productList .univers .products/*.auto*/ .product:not(.metaProduct) .callToAction {
            position: absolute;
            bottom: 20px;
            left: 16px;
            right: 16px;
        }

        .GBEL_productList .univers .products.auto .product.metaProduct .callToAction {
            /*position: relative;
            bottom: auto;
            left: auto;
            right: auto;*/
            position: absolute;
            bottom: 20px;
            left: 16px;
            right: 16px;
        }

        
            /*.GBEL_productList .univers .products.auto .callToAction {
                position: absolute;
                bottom: 20px;
                left: 16px;
                right: 16px;
            }*/

        .GBEL_productList .univers .products .product {
            /*height: 600px;*/
        }


        .GBEL_productList .univers .products .product.metaProduct .price, 
        .GBEL_productList .univers .products .product.metaProduct .variantes {
            /*margin-top: 20px;*/
        }

        .GBEL_productList .univers .products .product.metaProduct .variantes {
            margin: 24px 0;
        }

        /*.GBEL_productList .univers .products .product.metaProduct .callToAction input, 
        .GBEL_productList .univers .products .product.metaProduct .generatedPrice {
            display: inline-block;
            width: 45%;
        }*/

        .GBEL_productList .univers .products .product.metaProduct .generatedPrice {
            line-height: 50px;
            font-family: "UnitOT-Medi", "Trebuchet MS", Arial, Helvetica, sans-serif;
            font-size: 3rem;
            vertical-align: middle;
        }

            .GBEL_productList .univers .products .product.metaProduct .generatedPrice.alone {
                width: 100%;
                margin-top: 15px;
            }

    .GBEL_productList .univers-divider {
        text-align: center;
        padding: 20px;
        margin-top: 65px;
    }

    .GBEL_productList .univers-divider span {
        text-align: center;
    }
    
    .GBEL_productList .univers-divider:before {
        content: '\e98f';
        font-family: 'IconRedac';
    } 

    .GBEL_productList .univers-divider:after {
        content:url("../images/paiement3.png");
        transform: scale(0.1);
    } 

/*.GBEL_productList .lSSlideWrapper .lSSlide {
    max-height: none;
}*/

.GBEL_productList .product + .product {
    margin-left: 15px;
}

.GBEL_productList .product {
    float: left;
    width: 315px;
    color: #212121;
	color: var(--darkGrey);
}

@media screen and (min-width: 1000px) {
    .GBEL_productList .product + .product {
        margin-left: 30px;
    }

    .GBEL_productList .product {
        width: calc(33.3% - 22px);
        margin-bottom: 25px;
    }

            .products .product:only-child {
                float: none;
                margin: auto;
            }

        .GBEL_productList .product.metaProduct .base {
            min-height: 435px;
        }

        .GBEL_productList .product:not(.metaProduct) .base {
            min-height: 490px;
        }

        .GBEL_productList.nonStatic .product.metaProduct .base {
            min-height: 490px;
            height: 100%;
        }

        .GBEL_productList.nonStatic .product:not(.metaProduct) .base {
            min-height: 490px;
            height: 100%;
        }
        
        /* tous les 3 produits à partir du premier (1, 4, 7, 10...) */
        .GBEL_productList .product:nth-of-type(3n+1) {
            margin-right: 16.5px;
            margin-left: 0; 
            clear: both;
         }

        /* tous les 3 produits à partir du deuxième (2, 5, 8, 11... */
        .GBEL_productList .product:nth-of-type(3n+2) {
            margin-right: 16.5px;
            margin-left: 16.5px;
         }

        /* tous les 3 produits à partir du troisième (3, 6, 9, 12...) */
        .GBEL_productList .product:nth-of-type(3n+3) {
            margin-left: 16.5px;
         }
}

	.GBEL_productList .product .base {
        position: relative;
		padding: 47px 16px 20px 16px;
        padding: 47px 16px 90px 16px;
		background-color: #FFFFFF;
        text-align: center;
        /*min-height: 480px;*/
	}

    .GBEL_productList.nonStatic .product .base {
        position: relative;
		/*padding: 47px 16px 20px 16px;*/
        padding: 10px 0px 30px 0px;
		background-color: #FFFFFF;
        text-align: center;
        /*min-height: 480px;*/
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	}
	
		.GBEL_productList .product .base img {
			margin: 0 auto;
            max-width: 190px; /* Conformément au pattern NW_productsList et surtout pour les images de gnf */
            height: auto;
            max-height: 100px; /* Conformément au pattern NW_productsList et surtout pour les images de gnf */
		}
		
		.GBEL_productList .product .base .name {
			margin-top: 13px;
			line-height: 40px;
			font-family: "UnitOT-Medi", "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-size: 3.2rem;
		}

        .GBEL_productList.nonStatic .product .base .name {
			margin-top: 13px;
			line-height: 40px;
			font-family: "UnitOT-Medi", "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-size: 3rem;
		}
		
			.skin_red1 .GBEL_productList .product .base .name {
				color: #e3013a;
				color: var(--red1);
			}
		
			.skin_red2 .GBEL_productList .product .base .name {
				color: #e30613;
				color: var(--red2);
			}
		
			.skin_blue1 .GBEL_productList .product .base .name {
				color: #0069b4;
				color: var(--blue1);
			}
		
			.skin_blue2 .GBEL_productList .product .base .name {
				color: #0076c0;
				color: var(--blue2);
			}

            .GBEL_productList .product .base .selectVariant {
                display: block;
                margin: 0;
            }

                .GBEL_productList .product .base .selectVariant:first-of-type {
                    margin-top: 24px;
                }

                .GBEL_productList .product .base .selectVariant + .selectVariant {
                    margin-top: 24px;
                }

                .GBEL_productList .product .base .selectVariant:last-of-type {
                    margin-bottom: 24px;
                }

            .GBEL_productList .alert--danger {
                padding: 5px;
            }
			
		.GBEL_productList .product .base .price {
			line-height: 64px;
			font-family: "UnitOT-Medi", "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-size: 6.4rem;
		}

            .GBEL_productList .product .base .price .aPrice {
                font-size: 3.2rem;
                display: inline;
            }

            .GBEL_productList .product .base .euros, 
            .GBEL_productList .product .base .rightPart {
                display: inline-block;
                vertical-align: top;
            }

                .GBEL_productList .product.metaProduct .base .euros {
                    /*line-height: 40px;*/
                    /*font-size: 3.2rem;*/
                }

                .GBEL_productList .product.metaProduct .base .euros .priceEuro {
                    display: inline-block;
                }

                .GBEL_productList .product.metaProduct .base .euros .priceDecimal  {
                    display: inline-block;
                    font-size: 2.3rem;
                    top: -24px;
                    position: relative;
                }

                .GBEL_productList .product.metaProduct .base .euros .parMois{
                    display: inline-block;
                    line-height: 2rem;
                    font-size: 1.6rem;
                    left: -36px;
                    position: relative;
                }

                .GBEL_productList .product .base .rightPart {
                    line-height: 40px;
                    font-size: 3.2rem;
                }
                    
                    .GBEL_productList .product .base .price.tacitReconduction .rightPart {
                        font-size: 2.3rem;
                    }

                        .GBEL_productList .product .base .price.tacitReconduction .rightPart .cents {
                            display: inline-block;
                        }

                    .GBEL_productList .product .base .rightPart small {
                        line-height: 20px;
                        font-size: 1.6rem;
                    }
		
			.GBEL_productList .product .base .price .reducedPrice, 
            .GBEL_productList .product .base .price small {
                display: block;
				line-height: 2rem;
				font-size: 1.6rem;
			}

            .GBEL_productList .product .base .price .reducedPrice {
                height: 20px;
                text-decoration: line-through;
            }

                .GBEL_productList .product .base .price .reducedPrice:empty {
                    display: none;
                    text-decoration: none;
                }

            .GBEL_productList .product .base .price small {
                margin-left: 10px;
            }
		
		.GBEL_productList .product .base .more, .GBEL_productList .product .base .dureeToDisplay {
			margin: 15px auto 0 auto;
			line-height: 2.3rem;
			font-family: "UnitOT-Light", "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-size: 1.4rem;
			color: #f6f6f6;
			color: var(--grey);
		}

        .GBEL_productList.nonStatic .product .base .more, .GBEL_productList.nonStatic .product .base .dureeToDisplay {
			margin: 15px auto 0 auto;
			line-height: 2.3rem;
			font-family: "UnitOT-Light", "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-size: 2.4rem;
            background-color: #E5E5E5;
            padding: 10px;
            color: black;
		}
	
		/*.GBEL_productList .product .base .callToAction {
            
            margin-top: 20px;
			border-top: 1px solid #E6E6E6;
			border-top: 1px solid var(--lightGrey);
		}*/

        .GBEL_productList .product .base .callToAction {     
            /*margin-top: 20px;*/
		}
            
            .GBEL_productList .base.descMeta .callToAction input {
                padding: 0 5px;
                width: 140px !important;
                height: 50px;
                min-width: 140px;
                border: none;
                box-shadow: none;
            }
            .GBEL_productList .m .base .callToAction input {
                width: 100%;
                min-width: inherit;
                border: none;
            }
		
	/*.GBEL_productList .product .description {
		margin-top: 36px;
	}*/

    .GBEL_productList .description {
		padding: 20px 30px;
	}
	
		.GBEL_productList .description li + li {
			margin-top: 10px;
            margin-left: 0;
		}
	
		.GBEL_productList .description li {
            position: relative;
            padding-left: 32px;
            line-height: 2.2rem;
            font-family: "UnitOT-Light", "Trebuchet MS", Arial, Helvetica, sans-serif;
            font-size: 1.6rem;
            text-align: left;
		}
		
			.GBEL_productList .description li:before {
				content: '\e909';
                position: absolute;
                left: 0;
				font-family: 'IconRedac';
				font-size: 2.5rem;
                vertical-align: middle;
                color: darkgreen;
			}

        .GBEL_productList .description .descriptionCheck {
			padding-bottom: 10px;
		}

        .GBEL_productList .description .descriptionCheck li + li {
			margin-top: 10px;
            margin-left: 0;
		}
	
		.GBEL_productList .description .descriptionCheck li {
            position: relative;
            padding-left: 32px;
            line-height: 2.2rem;
            font-family: "UnitOT-Light", "Trebuchet MS", Arial, Helvetica, sans-serif;
            font-size: 1.6rem;
		}
		
			.skin_red1 .GBEL_productList .description .descriptionCheck li:before {
				content: '\e909';
                position: absolute;
                left: 0;
				font-family: 'IconRedac';
				font-size: 2.5rem;
                vertical-align: middle;
                color: darkgreen;
			}

            .skin_red2 .GBEL_productList .description .descriptionCheck li:before {
				content: '\e909';
                position: absolute;
                left: 0;
				font-family: 'IconRedac';
				font-size: 2.5rem;
                vertical-align: middle;
                color: darkgreen;
			}

            .skin_blue1 .GBEL_productList .description .descriptionCheck li:before {
				content: '\e909';
                position: absolute;
                left: 0;
				font-family: 'IconRedac';
				font-size: 2.5rem;
                vertical-align: middle;
                color: darkgreen;
			}

            .skin_blue2 .GBEL_productList .description .descriptionCheck li:before {
				content: '\e909';
                position: absolute;
                left: 0;
				font-family: 'IconRedac';
				font-size: 2.5rem;
                vertical-align: middle;
                color: darkgreen;
			}

        .GBEL_productList .description .descriptionUncheck li+ li {
			margin-top: 10px;
            margin-left: 0;
		}
	
		.GBEL_productList .description .descriptionUncheck li {
            position: relative;
            padding-left: 32px;
            line-height: 2.2rem;
            font-family: "UnitOT-Light", "Trebuchet MS", Arial, Helvetica, sans-serif;
            font-size: 1.6rem;
            color: rgba(170,170,194,0.7);
		}
		
			.GBEL_productList .description .descriptionUncheck li:before {
				content: '\ea0d';
                position: absolute;
                left: 0;
				font-family: 'IconRedac';
				font-size: 2.1rem;
                vertical-align: middle;
                color: rgba(170,170,194,0.7);
                margin-left: 2px;
			}

.outsideProduct{
    position: sticky !important;
    /*top: 260px;*/
}

/* tunnel de conversion*/
@media screen and (max-width: 1000px) {

    .layout_light #ad_portal{
        padding-top: 0px;
    }

    .univers{
        margin: 0 16px;
    }

    .GBEL_productList.nonStatic .mobileView {
        display: block;
    }

    .GBEL_productList.nonStatic .desktopView {
        display: none;
    }

    .GBEL_productList.nonStatic .univers .univers-header .univers-header-title{
        font-size: 26px;
    }

    .GBEL_productList.nonStatic .univers .products .product{
        width: 182px;
        height: 150px;
        /*margin-bottom: 390px;*/
        border-radius: 5px;
    }

    .GBEL_productList.nonStatic .univers .products .product .base{
        height: 150px;
        padding: 0px;
        overflow: hidden;
        border-radius: 5px;
        border: solid 1px grey;
    }

    .skin_red1 .GBEL_productList.nonStatic .univers .products .product .base.productSelected{
        background-color: #fcf0ef;
        border: solid 1px #f1bab9;
    }

    .skin_red2 .GBEL_productList.nonStatic .univers .products .product .base.productSelected{
        background-color: #fcf0ef;
        border: solid 1px #f1bab9;
    }

    .skin_blue1 .GBEL_productList.nonStatic .univers .products .product .base.productSelected{
        background-color: #eff0fc;
        border: solid 1px #b9baf1;
    }

    .skin_blue2 .GBEL_productList.nonStatic .univers .products .product .base.productSelected{
        background-color: #eff0fc;
        border: solid 1px #b9baf1;
    }

    .GBEL_productList.nonStatic .product .base .name{
        font-size: 2rem;
        margin-top: 0px;
        height: 25%;
        line-height: normal;
        padding-top: 10px;
    }

    .GBEL_productList.nonStatic .product .base .price{
        height: 50%;
        padding-top: 5px;
        transform: scale(0.8);
    }

    .GBEL_productList.nonStatic .product .base .more, .GBEL_productList.nonStatic .product .base .dureeToDisplay{
        font-size: 1.3rem;
        margin: 0px;
        background-color: #ffffff;
        height: 25%;
    }

    .GBEL_productList.nonStatic .univers .products .product .more, .GBEL_productList.nonStatic .univers .products .product .dureeToDisplay{
        background-color: transparent;
    }

    .GBEL_productList.nonStatic .mobileView .product .description{
        display: none;
    }

    .GBEL_productList.nonStatic .mobileView .description{
        width: calc(100vw - 40px);
        /*position: absolute;*/
        left: 0px;
        padding: 14px 20px;
        /*display: none;*/
    }

    /*a revoir*/
    .GBEL_productList.nonStatic .description .desctiptionCheck li:before {
		font-size: 2.2rem !important;
	}

    .skin_red1 .GBEL_productList.nonStatic .mobileView .firstProduct .base{
        background-color: #fcf0ef;
        border: solid 1px #f1bab9 !important;
    }

    .skin_red2 .GBEL_productList.nonStatic .mobileView .firstProduct .base{
        background-color: #fcf0ef;
        border: solid 1px #f1bab9 !important;
    }

    .skin_blue1 .GBEL_productList.nonStatic .mobileView .firstProduct .base{
        background-color: #eff0fc;
        border: solid 1px #b9baf1 !important;
    }

    .skin_blue2 .GBEL_productList.nonStatic .mobileView .firstProduct .base{
        background-color: #eff0fc;
        border: solid 1px #b9baf1 !important;
    }

    .GBEL_productList .mobileView .description{
        /*border: solid 10px red;*/
    }

    .GBEL_productList.nonStatic .mobileView .firstProduct .description{
        /*display: block;*/
    }

    .GBEL_productList.nonStatic .description.diplayOn{
        display: block;
    }

    .GBEL_productList.nonStatic .description.diplayOff{
        display: none;
    }

    .GBEL_productList.nonStatic .callToAction{
        /*position: fixed;
        top: 77%;*/
    }
    
    .GBEL_productList.nonStatic .callToAction .bt_abo_mobile{
        width: calc(100vw - 12px);
        position: absolute;
        left: 6px;
        margin-top: 0px;
    }

    .GBEL_productList .product .base .price {
        font-size: 5.4rem;
    }


    .GBEL_productList .univers .products .product.metaProduct .price{
        margin-top: 0px;
    }

    .priceEuro {
        display: inline-block;
    }

    .priceDecimal{
        display: inline-block;
        font-size: 2.3rem;
        /*top: -24px;*/
        position: relative;
    }

    .zeroDecimal{
        font-size: 1.6rem;
        top: 0px;
    }

    .price .parMois{
        display: inline-block;
        font-size: 1.6rem;
        left: -22px !important;
    }

    
 }


/* ========================================================= */
/* Subscribe with Google */
/* ========================================================= */

.swg {
    align-items: center;
    display: flex;
    text-align: center;
    padding: 10px 0 10px 0;
}

.swg::before,
.swg::after {
    border-top: .1rem solid #E6E6E6;
    content: "";
    flex: 1;
    margin: 0 .5em;
}