#combinaisons + section[data-section-name="sectionFooter"] {
	clear: both
}
#combinaisons .videoCombi .new small {
    font-family: Arial, Helvetica, sans-serif;
    color: #1eafe1
}

/* Page combinaisons */
@media only screen and (max-width: 576px) {
    #combinaisons .videoCombi iframe {
		margin-top: 50px;
		width: calc((75vh / 9) * 16);
    	height: 75vh;
		margin-left: calc(((((75vh / 9) * 16) - 100vw) / 2) * (-1));
        background: #000;
        position: absolute;
        top: 0;
        left: 0;
	}
    #combinaisons .videoCombi .new {
		position: relative;
		margin-top: calc(75vh + 50px);
        padding: 20px
	}
	#combinaisons .videoCombi .new h1 {
		text-transform: uppercase;
		letter-spacing: -.035em;
		font-weight: 700;
		margin: 5px 0 10px;
        font-size: 2em
	}
	#combinaisons .videoCombi .new p {
		letter-spacing: .025em;
		line-height: 1.75em;
		margin: 0;
		text-align: justify
	}
    #combinaisons .segmentation {
        margin-bottom: 15%
    }
    #combinaisons .segmentation figure {
		padding: 0;
        margin: 0;
		width: 100%
	}
	#combinaisons .segmentation figure img {
        width: 100%;
        height: 30vh;
        object-fit: cover;
        object-position: bottom;
        margin: 0 0 10px
    }
    #combinaisons .segmentation figure img.gif {
        width: 100%;
        height: auto;
        object-fit: initial
    }
	#combinaisons .segmentation .desc {
		text-align: justify
	}
    #combinaisons [class*="ligne"] .carreM,
    #combinaisons [class*="ligne"] .carre2Q,
    #combinaisons [class*="ligne"] .carre2Q .carreQ img {
        width: 100%
    }
    #combinaisons [class*="ligne"] .carreM,
    #combinaisons [class*="ligne"] .carre2Q {
        position: relative
    }
	#combinaisons [class*="ligne"],
	#combinaisons [class*="ligne"] .carre2Q {
		clear: both
	}
	#combinaisons [class*="ligne"] .carreM {
		height: 50vh
	}
	#combinaisons [class*="ligne"] .carre2Q:last-child .carreQ.carreTechno {
		margin-bottom: 35%
	}
	#combinaisons .ligne3 .carre2Q:last-child .carreQ.carreTechno {
		margin-bottom: 0
	}
	#combinaisons [class*="ligne"] .carreM img {
		position: absolute;
		width: auto;
		height: 90%
	}
	#combinaisons [class*="ligne"] .carreM a:nth-child(1) img:nth-child(1) {
		z-index: 1;
		height: 75%;
		top: -5%;
		right: calc(50vw + 20%)
	}
	#combinaisons [class*="ligne"] .carreM a:nth-child(1) img:nth-child(2) {
		z-index: 2;		
		top: 3%;
		right: calc(50vw + 2.5%)
	}
	#combinaisons [class*="ligne"] .carreM a:nth-child(2) img:nth-child(1) {
		z-index: 3;
		height: 75%;
		top: -5%;
		left: 50vw
	}
	#combinaisons [class*="ligne"] .carreM a:nth-child(2) img:nth-child(2) {
		z-index: 4;		
		top: 3%;
		left: calc(50vw + 10%)
	}
	#combinaisons [class*="ligne"] .carreM:after {
		content: '';
		background: url('https://www.z3r0d.com/favicon.png');
		width: 40px;
		height: 40px;
		background-size: contain;
		position: absolute;
		left: calc(50vw - 20px);
		top: calc(-22% - 20px)
	}
	#combinaisons .ligne1 .carreM {
		margin-top: 30%
	}
	#combinaisons .ligne1 .carreM:after {
		top: calc(-16% - 20px)
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ {
		width: 100%;
		position: relative;
		padding: 0 5%
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ {
		width: 50%;
		height: 50vw;
		float: left;
		position: relative;
		overflow: hidden
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.carreVideo iframe {
		width: calc((100% / 9) * 16);
		height: 100%;
		background-color: #000;
		margin-left: calc(((((100% / 9) * 16) - 25vw) * (-1)) / 2)
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.carreTechno {
		background-color: #000
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.descGamme {
		display: table;
		padding: 35px;
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.descGamme div {
		display: table-cell;
		vertical-align: middle;
		text-align: justify
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .revendeur {
		float: right;
		display: block;
		text-align: right;
		margin-top: 7px
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .revendeur span {
		font-style: italic;
		text-transform: uppercase;
		color: #999;
		font-size: 1em;
		display: block;
		line-height: 1.15em
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .revendeur span strong {
		font-family: Helvetica, Arial, sans-serif;
		font-weight: 800
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .revendeur .btn-revendeur {
		font-size: .75em;
		font-weight: 700;
		text-decoration: underline;
		padding: 0
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ {
		padding-top: 20px
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ h2 {
		text-transform: uppercase;
		font-style: italic;
		font-size: 4em;
		font-weight: 900;;
		margin-top: 0
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ h2 small {
		display: block;
		padding-left: 2em;
		font-size: .2em;
		font-weight: 600;
		text-transform: capitalize;
		margin-bottom: -0.5em;
		font-style: normal
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .desc {
		margin: 0 0 20px;
		text-align: justify
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ img {
		width: 100%;
		height: 100%;
		object-fit: cover
	}
	#combinaisons .ligne1 {
		margin-top: 0
	}
	#combinaisons .ligne1 .carreM {
		background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.85) 20%, #2888a2 90%, rgba(255,255,255,1) 90%, rgba(255,255,255,1) 100%)
	}
	#combinaisons .ligne3 .carreM {
		background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.85) 20%, #dec294 90%, rgba(255,255,255,1) 90%, rgba(255,255,255,1) 100%)
	}
	#combinaisons .ligne1 .carre2Q .rowQ h2 small,
	#combinaisons .ligne1 .carre2Q .rowQ .btn-revendeur {
		color: #2888a2
	}
	#combinaisons .ligne2 .carreM {
		float: right
	}
	#combinaisons .ligne2 .carreM {
		background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.85) 20%, #8e1115 90%, rgba(255,255,255,1) 90%, rgba(255,255,255,1) 100%)
	}
	#combinaisons .ligne2 .carre2Q .rowQ h2 small,
	#combinaisons .ligne2 .carre2Q .rowQ .btn-revendeur {
		color: #8e1115
	}
	#combinaisons .ligne3 .carre2Q .rowQ h2 small,
	#combinaisons .ligne3 .carre2Q .rowQ .btn-revendeur {
		color: #dec294
	}
	#combinaisons .ligne3 .carreM,
	#combinaisons .ligne3 .carre2Q + .carre2Q,
	#combinaisons .ligne3 .carre2Q .carreQ.carreVideo,
	#combinaisons .ligne3 .carre2Q .carreQ.carreTechno {
		margin-bottom: 0
	}
	#combinaisons + section[data-section-name="sectionFooter"] footer .footer-v1 {
		padding-top: 30px
	}
	.combinaisons-revendeurs .hidden-xs {
		display: block!important;
		padding-top: 0!important;
	}
	.combinaisons-revendeurs .visible-xs {
		display: none!important
	}
	.combinaisons-revendeurs .container.hidden-xs [class*="col-xs"] {
		text-align: center;
	}
	.combinaisons-revendeurs .container.hidden-xs [class*="col-xs"] .blocRevendeur {
		padding-top: 10px;
		position: relative
	}
	.combinaisons-revendeurs .container.hidden-xs [class*="col-xs"] .blocRevendeur:before {
		content: '';
		position: absolute;
		top: 0;
		width: 30%;
		left: 35%;
		background-color: #e8e9ea;
		height: 1px
	}
}
@media only screen and (min-width: 577px) {
	#combinaisons {
		padding-top: 50px
	}
	#combinaisons .videoCombi,
	#combinaisons .videoCombi iframe {
		width: 100vw;
    	height: calc((100vw / 16) * 9)
	}
	#combinaisons .videoCombi {
		position: relative;
		display: table
	}
	#combinaisons .videoCombi .new {
		position: relative;
		z-index: 1;
		display: table-cell;
		vertical-align: middle;
		width: 600px;
		padding: 0 0 0 100px;
		color: #FFF
	}
	#combinaisons .videoCombi .new h1 {
		text-transform: uppercase;
		letter-spacing: -.035em;
		font-weight: 700;
		margin: 6px 0 15px
	}
	#combinaisons .videoCombi .new p {
		letter-spacing: .025em;
		line-height: 1.75em;
		margin: 0;
		padding-right: 25%;
		text-align: justify
	}
	#combinaisons .videoCombi iframe {
		position: absolute;
		background: #000;
		z-index: 0;
		top: 0;
		left: 0
	}
	#combinaisons .segmentation {
		padding: 7.5% 0 17.5%
	}
	#combinaisons .segmentation .desc {
		display: inline-block;
		width: calc((100% - 128px) / 3);
		vertical-align: top
	}
	#combinaisons .segmentation h2 {
		font-weight: 800;
		font-size: 4em;
		letter-spacing: -.05em;
		margin: 0 0 20px;
		opacity: 15%;
		line-height: 0.9em;
		text-align: left
	}
	#combinaisons .segmentation .flexSegmentation {
		display: flex;
		flex-direction: row;
		margin-bottom: 20px
	}
	#combinaisons .segmentation figure {
		margin: 0 10px;
		padding: 0;
		width: calc((100% - 68px) / 3);
		height: 450px;
		position: relative;
		flex: auto
	}
	#combinaisons .segmentation figure img + img {
		margin-top: 20px
	}
	#combinaisons .segmentation figure:not(.img2) img {
		overflow: hidden;
		width: 100%;
		height: 100%;
		object-fit: cover
	}
	#combinaisons .segmentation figure.img2 img {
		width: 100%;
		object-fit: cover;
		object-position: bottom
	}
	#combinaisons .segmentation figure.img2 img:not(.gif) {
		height: calc((450px - ((450px / 370) * 198)) + 22px)
	}
	#combinaisons .segmentation .desc {
		text-align: justify;
		margin: 0 20px
	}
	#combinaisons [class*="ligne"] .carreM:after {
		content: '';
		background: url('https://www.z3r0d.com/favicon.png');
		width: 40px;
		height: 40px;
		background-size: contain;
		position: absolute;
		left: calc(100% - 20px);
		top: calc(-22% - 20px)
	}
	#combinaisons [class*="ligne"] .carreM,
	#combinaisons [class*="ligne"] .carre2Q {
		width: 50%;
		float: left;
		position: relative
	}
	#combinaisons [class*="ligne"] .carreM {
		height: 40vw;
		padding: 50px;
	}
	#combinaisons [class*="ligne"] .carreM:before {
		content: '';
		position: absolute;
		z-index: 1;
		width: 5px;
		height: calc(40vw + 2.5%);
		top: -2.5%;
		right: -2.5px
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.carreVideo,
	#combinaisons [class*="ligne"] .carre2Q .carreQ.carreTechno {
		margin-bottom: 35%;
	}
	#combinaisons [class*="ligne"] .carreM img {
		position: absolute;
		width: auto;
		height: 100%
	}
	#combinaisons [class*="ligne"] .carreM a:nth-child(1) img:nth-child(1) {
		z-index: 1;
		height: 85%;
		top: -5%;
		right: calc(27vw + 15%)
	}
	#combinaisons [class*="ligne"] .carreM a:nth-child(1) img:nth-child(2) {
		z-index: 2;		
		top: 3%;
		right: 27vw
	}
	#combinaisons [class*="ligne"] .carreM a:nth-child(2) img:nth-child(1) {
		z-index: 3;
		height: 85%;
		top: -5%;
		left: 26vw
	}
	#combinaisons [class*="ligne"] .carreM a:nth-child(2) img:nth-child(2) {
		z-index: 4;		
		top: 3%;
		left: calc(26vw + 10%)
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ {
		width: 100%;
		height: 15vw;
		float: left;
		position: relative;
		padding: 0 5%
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ {
		width: 50%;
		height: 25vw;
		float: left;
		position: relative;
		overflow: hidden
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.carreVideo iframe {
		width: calc((100% / 9) * 16);
		height: 100%;
		background-color: #000;
		margin-left: calc(((((100% / 9) * 16) - 25vw) * (-1)) / 2)
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.carreTechno {
		background-color: #000
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.descGamme {
		display: table;
		padding: 35px;
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ.descGamme div {
		display: table-cell;
		vertical-align: middle;
		text-align: justify
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .revendeur {
		float: right;
		display: block;
		text-align: right;
		margin-top: -8px
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .revendeur span {
		font-style: italic;
		text-transform: uppercase;
		color: #999;
		font-size: 1.35em;
		display: block;
		line-height: 1.15em
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .revendeur span strong {
		font-family: Helvetica, Arial, sans-serif;
		font-weight: 800
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .revendeur .btn-revendeur {
		font-size: .9em;
		font-weight: 700;
		text-decoration: underline;
		padding: 0
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ h2 {
		text-transform: uppercase;
		font-style: italic;
		font-size: 6em;
		font-weight: 900;
		margin: -30px 0 0
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ h2 small {
		display: block;
		padding-left: 2em;
		font-size: .2em;
		font-weight: 600;
		text-transform: capitalize;
		margin-bottom: -0.5em;
		font-style: normal
	}
	#combinaisons [class*="ligne"] .carre2Q .rowQ .desc {
		margin: 0;
		max-height: calc((15vw - 8em) + 25px);
		overflow-y: auto
	}
	#combinaisons [class*="ligne"] .carre2Q .carreQ img {
		width: 100%;
		height: 100%;
		object-fit: cover
	}
	#combinaisons .ligne1 {
		margin-top: 0
	}
	#combinaisons .ligne1 .carreM {
		background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.85) 20%, #2888a2 90%, rgba(255,255,255,1) 90%, rgba(255,255,255,1) 100%)
	}
	#combinaisons .ligne3 .carreM {
		background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.85) 20%, #dec294 90%, rgba(255,255,255,1) 90%, rgba(255,255,255,1) 100%)
	}
	#combinaisons .ligne1 .carreM:before {
		background-color: #2888a2
	}
	#combinaisons .ligne1 .carre2Q .rowQ h2 small,
	#combinaisons .ligne1 .carre2Q .rowQ .btn-revendeur {
		color: #2888a2
	}
	/* #combinaisons .ligne1 .carre2Q .rowQ {
		background-image: url('/images/combinaisons/v-archi.png')
	} */ 
	#combinaisons .ligne2 .carreM {
		float: right
	}
	#combinaisons .ligne2 .carreM {
		background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.85) 20%, #8e1115 90%, rgba(255,255,255,1) 90%, rgba(255,255,255,1) 100%)
	}
	#combinaisons .ligne2 .carreM:before {
		background-color: #8e1115;
		right: unset;
		left: -2.5px
	}
	#combinaisons .ligne2 .carreM:after {
		left: unset;
		right: calc(50vw - 20px)
	}
	#combinaisons .ligne2 .carre2Q .rowQ h2 small,
	#combinaisons .ligne2 .carre2Q .rowQ .btn-revendeur {
		color: #8e1115
	}
	/* #combinaisons .ligne2 .carre2Q .rowQ {
		background-image: url('/images/combinaisons/v-flex.png')
	} */
	#combinaisons .ligne3 .carreM:before {
		background-color: #dec294;
		height: calc(40vw + 2.5%)
	}
	#combinaisons .ligne3 .carre2Q .rowQ h2 small,
	#combinaisons .ligne3 .carre2Q .rowQ .btn-revendeur {
		color: #dec294
	}
	#combinaisons .ligne3 .carreM,
	#combinaisons .ligne3 .carre2Q + .carre2Q,
	#combinaisons .ligne3 .carre2Q .carreQ.carreVideo,
	#combinaisons .ligne3 .carre2Q .carreQ.carreTechno {
		margin-bottom: 0
	}
	#combinaisons + section[data-section-name="sectionFooter"] footer .footer-v1 {
		padding-top: 70px
	}
}