/* 20250501024532 - v2 */
.gui,
.gui-block-linklist li a {
  color: #666666;
}

.gui-page-title,
.gui a.gui-bold,
.gui-block-subtitle,
.gui-table thead tr th,
.gui ul.gui-products li .gui-products-title a,
.gui-form label,
.gui-block-title.gui-dark strong,
.gui-block-title.gui-dark strong a,
.gui-content-subtitle {
  color: #000000;
}

.gui-block-inner strong {
  color: #848484;
}

.gui a {
  color: #0a8de9;
}

.gui-input.gui-focus,
.gui-text.gui-focus,
.gui-select.gui-focus {
  border-color: #0a8de9;
  box-shadow: 0 0 2px #0a8de9;
}

.gui-select.gui-focus .gui-handle {
  border-color: #0a8de9;
}

.gui-block,
.gui-block-title,
.gui-buttons.gui-border,
.gui-block-inner,
.gui-image {
  border-color: #8d8d8d;
}

.gui-block-title {
  color: #333333;
  background-color: #ffffff;
}

.gui-content-title {
  color: #333333;
}

.gui-form .gui-field .gui-description span {
  color: #666666;
}

.gui-block-inner {
  background-color: #f4f4f4;
}

.gui-block-option {
  border-color: #ededed;
  background-color: #f9f9f9;
}

.gui-block-option-block {
  border-color: #ededed;
}

.gui-block-title strong {
  color: #333333;
}

.gui-line,
.gui-cart-sum .gui-line {
  background-color: #cbcbcb;
}

.gui ul.gui-products li {
  border-color: #dcdcdc;
}

.gui-block-subcontent,
.gui-content-subtitle {
  border-color: #dcdcdc;
}

.gui-faq,
.gui-login,
.gui-password,
.gui-register,
.gui-review,
.gui-sitemap,
.gui-block-linklist li,
.gui-table {
  border-color: #dcdcdc;
}

.gui-block-content .gui-table {
  border-color: #ededed;
}

.gui-table thead tr th {
  border-color: #cbcbcb;
  background-color: #f9f9f9;
}

.gui-table tbody tr td {
  border-color: #ededed;
}

.gui a.gui-button-large,
.gui a.gui-button-small {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large.gui-button-action,
.gui a.gui-button-small.gui-button-action {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large:active,
.gui a.gui-button-small:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui a.gui-button-large.gui-button-action:active,
.gui a.gui-button-small.gui-button-action:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui-input,
.gui-text,
.gui-select,
.gui-number {
  border-color: #8d8d8d;
  background-color: #ffffff;
}

.gui-select .gui-handle,
.gui-number .gui-handle {
  border-color: #8d8d8d;
}

.gui-number .gui-handle a {
  background-color: #ffffff;
}

.gui-input input,
.gui-number input,
.gui-text textarea,
.gui-select .gui-value {
  color: #000000;
}

.gui-progressbar {
  background-color: #76c61b;
}

/* custom */
/*
@import url('https://fonts.googleapis.com/css2?family=wingdings');

body {

 font-family: 'wingdings';

}
*/
.container_info {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-columns: 1fr 2fr 2fr;
  grid-gap: 10px;
  grid-template-areas:
    "info info photo" 
    "info info photo" 
    "info info photo" 
    "info info photo";
   padding-left: 20px;
}

.container_info div{
   border: 1px solid black;
   padding: 8px;
   border-radius: 5px;
}

.td_info {
  border: 1px solid #ddd;
  padding: 8px;
  background-color: #000000;
  color: white;
  font-weight: bold;
  min-width: 200px;
  max-height: 50px;
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: separate;
  border-spacing: 0.5em;
  border-radius: 4px;
}

.td_info_white {
  border: 1px solid #ddd;
  padding: 8px;
  min-width: 200px;
  max-height: 50px;
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: separate;
  border-spacing: 0.5em;
  border-radius: 4px;
}

.container_photos {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-gap: 10px;
  grid-template-areas: "photo photo photo photo photo";
  padding: 20px;
}

.container_photos div{
   border: 1px solid black;
   border-radius: 5px;
   display: inline-block;
   padding: 28px;
   text-align: center;
}

.item-a {
  grid-column: 1;
  grid-row: 1;
}
.item-b {
  grid-column: 1;
  grid-row: 2;
}
.item-c {
  grid-column: 1;
  grid-row: 3;
}
.item-d {
  grid-column: 1;
  grid-row: 4;
}
.item-a2 {
  grid-column: 2;
  grid-row: 1;
}
.item-b2 {
  grid-column: 2;
  grid-row: 2;
}
.item-c2 {
  grid-column:2;
  grid-row: 3;
}
.item-d2 {
  grid-column: 2;
  grid-row: 4;
}
.item-e {
  grid-area: photo;
  max-width: 100%;
  height: auto;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.img_sub {
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px;
  max-width: 100%;
}

.photo-a {
  grid-column: 1;
  grid-row: 1;
}
.photo-b {
  grid-column: 2;
  grid-row: 1;
}
.photo-c {
  grid-column: 3;
  grid-row: 1;
}
.photo-d {
  grid-column: 4;
  grid-row: 1;
}
.photo-e {
  grid-column: 5;
  grid-row: 1;
}

.text_info {
  border: 1px solid #ddd;
  padding: 8px;
  background-color: #000000;
  color: white;
  font-weight: bold;
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: separate;
  border-spacing: 0.5em;
  border-radius: 4px;
  max-width: 250px;
}
.margin20 {
 margin-left: 20px;
}


.item-crit-a {
  grid-column: 1;
  grid-row: 1;
}
.item-crit-b {
  grid-column: 1;
  grid-row: 2;
}
.item-crit-c {
  grid-column: 1;
  grid-row: 3;
}
.item-crit-d {
  grid-column: 1;
  grid-row: 4;
}
.item-crit-e {
  grid-column: 1;
  grid-row: 5;
}
.item-crit-a2 {
  grid-column: 2;
  grid-row: 1;
}
.item-crit-b2 {
  grid-column: 2;
  grid-row: 2;
}
.item-crit-c2 {
  grid-column:2;
  grid-row: 3;
}
.item-crit-d2 {
  grid-column: 2;
  grid-row: 4;
}
.item-crit-e2 {
  grid-column: 2;
  grid-row: 5;
}
.container_criteres {
  display: grid;
  grid-template-columns: 1fr 4fr;
  grid-gap: 10px;
  grid-template-areas:
    "info info" 
    "info info" 
    "info info" 
    "info info"
    "info info";
   padding-left: 20px;
}


#msn_container{
display:none!important;
}
/*gift card image*/

#gift-cards-page #giftcard-design #giftcard-preview {
background-image: url("../png/cartecadeau.png") !important;
}


/*style the (+) and (-) */
a.btn2 i{
  float: right;
  margin-left: auto;
}

a.btn2 {
	height: 50px;
  display:flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	padding: 0px 30px;
	background: #aaa;
	color: #fff;
	border-radius: 5px;
	font-size: 1.15em;
	font-size: .95em;
	font-weight: 600;
	letter-spacing: 0.05em;
	outline: none !important;
  background: #f31212;
  color: #fff;
  border: 1px solid transparent;
  text-decoration:none!important;
}
a.btn2:hover {
	color: #000;
}

}
.header{
  font-family: inherit;
font-weight: 500;
line-height: 1.1;
color: inherit;
  margin-top: 20px;
margin-bottom: 10px;
  font-size: 30px;
}
.hide, .show {
	width: 30px;
	height: 30px;
	border-radius: 30px;
	font-size: 20px;
	color: #fff;
	text-shadow: 0 1px 0 #666;
	text-align: center;
	text-decoration: none;
	box-shadow: 1px 1px 2px #000;
	background: #cccbbb;
	opacity: .95;
	margin-right: 0;
	float: left;
	margin-bottom: 25px;
}

.hide:hover, .show:hover {
	color: #eee;
	text-shadow: 0 0 1px #666;
	text-decoration: none;
	box-shadow: 0 0 4px #222 inset;
	opacity: 1;
	margin-bottom: 25px;
}

.list p{
    height:auto;
    margin:0;
}
.question {
	float: left;
	height: auto;
	width: 90%;
	line-height: 20px;
	padding-left: 20px;
	margin-bottom: 25px;
	font-style: italic;
}
/*Pour retirer le padding introduit par le CSS pour les images via own-carousel*/
.product-detail .images .image.slick {
  padding:0px;
}

div.gui-payment-provider-paybright{
	display: none!important;
}

/* Background "gris" pour images de variantes*/
.tags3 {
	margin:-3px;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
      -ms-flex-align:center;
          align-items:center;
  -ms-flex-wrap:wrap;
      flex-wrap:wrap;
}

.variant-image a.strikethrough:hover { 
  background: #f31212!important;
  color: #fff;  
}
.variant-image img:hover{
  outline:2px solid darkgrey;
  outline-offset:-2px;
}

.variant-image img.selected{
  outline:2px solid black;
  outline-offset:-2px;
}
.variant-image .strikethrough img{
 opacity:50%;
}

.variant-image {
   padding:3px;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
  -webkit-box-align:start;
      -ms-flex-align:start;
          align-items:flex-start;
}
.variant-image .images-wrap2 {
	/*min-width:450px;
  max-width:450px;
  margin-right:100px;*/
}
.variant-image .images2 .image2 {
  background: #fff;
  overflow:hidden;
  position:relative;
}
.variant-image .images2 .image2.img-gray2:after  {
	position: absolute;
  content: '';
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.03);
  outline:1px solid lightgray;
  outline-offset:-2px;
}

.variant-image .images2 .image2.img-gray2.selected:after  {
	position: absolute;
  content: '';
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.03);
  outline:3px solid black;
  outline-offset:-3px;
}
.variant-image .images2 .image2.img-gray2.strikethrough:after  {
	position: absolute;
  content: '';
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
 background:
    linear-gradient(to top left,
      rgba(0, 0, 0, 0.03) 0%,
      rgba(0, 0, 0, 0.03) calc(50% - 0.8px),
      rgba(0, 0, 0, 1) 50%,
      rgba(0, 0, 0, 0.03) calc(50% + 0.8px),
      rgba(0, 0, 0, 0.03) 100%)!important;
  outline:1px solid lightgray;
  outline-offset:-2px;
}
.variant-image .images2 .image2.img-gray2.strikethrough.selected:after  {
	position: absolute;
  content: '';
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
 background:
    linear-gradient(to top left,
      rgba(0, 0, 0, 0.03) 0%,
      rgba(0, 0, 0, 0.03) calc(50% - 0.8px),
      rgba(0, 0, 0, 1) 50%,
      rgba(0, 0, 0, 0.03) calc(50% + 0.8px),
      rgba(0, 0, 0, 0.03) 100%)!important;
  outline:3px solid black;
  outline-offset:-3px;
}

.variant-image .images2 .image2.img-gray2:hover:after {
	position: absolute;
  content: '';
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.03);
  outline: 2px solid black;
  outline-offset: -1px;
}


/* Fin Background "gris" pour images de variantes*/

.strikethrough {
  color:gray !important;
  background:
    linear-gradient(to top left,
      rgba(0, 0, 0, 0.07) 0%,
      rgba(0, 0, 0, 0.07) calc(50% - 0.8px),
      rgba(0, 0, 0, 1) 50%,
      rgba(0, 0, 0, 0.07) calc(50% + 0.8px),
      rgba(0, 0, 0, 0.07) 100%)!important;
}

.tags2 .tag2 a:hover,
.tags2 .tag2.active a {
	background:#f31212;
  color:#fff;
}
.tags2 .tag2 a.strikethrough:hover,
.tags2 .tag2.active a.strikethrough {
	 background:
    linear-gradient(to top left,
      rgba(243,18,18,1) 0%,
      rgba(243,18,18,1) calc(50% - 0.8px),
      rgba(0, 0, 0, 1) 50%,
      rgba(243,18,18,1) calc(50% + 0.8px),
      rgba(243,18,18,1) 100%)!important;
  color:#fff;
}

.label-variant {
   color:black;
   margin-bottom:10px;
   margin-left:-3px;
}
.label-matrix{
	width:75px;
  margin-left:25px;
  color : black;
}
/*Copie CSS TAGS + TAG pour éviter de foutre le trouble dans le thème*/
.tag2 a:hover{
  outline:2px solid darkgrey;
  outline-offset:-2px;
}
.tags2 {
	margin:-3px;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
      -ms-flex-align:center;
          align-items:center;
  -ms-flex-wrap:wrap;
      flex-wrap:wrap;}
.tags2 .tag2 {
	padding:3px;
  color:black;
}

.tags2 .tag2 a {
  height: 30px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0px 15px;
  border-radius: 5px;
  background: rgba(0,0,0,0.07);
  color: inherit;
  font-weight: bold;
  font-size: 11px;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  -webkit-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear;
}


.in-flex {
    display: inline-flex
}

.flex-wrap {
  display: flex;
  flex-wrap: wrap;
}



    .variant_container {
      display: flex;
      align-items: center;
    }
    .variant_image {
      width: 100px;
      height: 100px;
    }
   /* .text-container {
      margin-left: 10px;
    }*/
    .text-container div {
      margin-bottom: 5px;
    }
/*
.active{
  color: red;
}*/

.div_inner_wrapper{
 height:100%;
}
.div_inner_image{
 height:100px;
 width:100px;
 margin:15px 15px 0px 0px;
}
.div_inner_couleur{
 height:40px;
 padding: 18px 0px 0px 0px;
 color:black;
}

.div_inner_grandeur{
  display: flex;
  flex-wrap: wrap;
  padding: 10px 0px 0px 0px;
}

.product_page .product__matrix_option {
    margin-top: 15px
}

.product_page .product__matrix_option_title em {
    color: red;
}
.div_grandeur {
    height:125px;
    width:105px;
    padding:5px;
}

.product_page .product__matrix_option_values p {
    align-items: center;
    justify-content: center;
    line-height: 1.2;
    padding: 5px;
    font-size: 14px;
    font-weight: 600;
}
.product_page .product__matrix_option_values a {
    display: flex;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
    padding: 5px;
    font-size: 14px;
    font-weight: 600;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid grey;
    margin: 5px 8px 0 5px;
    background-color: white;
    color:black;
}

.product_page .product__matrix_option_values .div_inner_image a {
    width: 105px;
    height: 105px;
    border: 1px solid grey;;   
}
/*
.product_page .product__matrix_option_values .div_inner_image .a_img a {
    display: flex;
    width: 200px;
    height: 104px;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
    padding: 5px;
    font-size: 14px;
    font-weight: 600;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid grey;
    margin: 5px 8px 0 0;
    background-color: white;
}*/

.product_page .product__matrix_option_values a:hover {
  color: red;
}
.product_page .product__matrix_option_values a.active {
    border-color: red;
  border-width: medium;
}

.product_page .product__matrix_option_values a.disabled {
    pointer-events: none;
    color: #ccc;
    background-color: #fcfcfc;
    text-decoration: line-through
}

.product_page .product__matrix_option_values a.disabled img {
    opacity: .7
}

.product_page .product__matrix_option_values a.with_image {
    margin-bottom: 15px;
    height: unset;
    line-height: 1.1;
    display: block
}

.product_page .product__matrix_option_values a.with_image span {
    font-weight: 400;
    font-size: .65rem
}

.product_page .matrix__others a {
    display: inline-flex;
    margin: 5px 8px 0 0;
    height: 52px;
    width: 87px;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 600;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 2px
}

.product_page .matrix__others a.active {
    border-color: red;
}

.product_page .matrix__others a.disabled {
    pointer-events: none;
    color: grey;
}




/*Style de la custom USP Bar pour Covid-19*/
	.custom_uspbar {
	    width: 100%;
	    position: fixed;
	    top: 0;
	    left: 0;
	    text-align: center;
	    color: #FFF;
	    font-size: 14px;
	    z-index: 1000;
	    height: auto!important;
	    background: #414141!important;
	    box-shadow: none!important;
	    border-bottom: 0px !important;
	    line-height: 42px!important;
	    text-shadow: none!important;
	}


	.custom_uspbar_mobile {
	    height:22px;
	    font-size: 12px;
	    font-weight: bold;
	    font-family: "Heebo", Helvetica, sans-serif;
	    background: #000!important;
	  	color : #FFF;
	    text-align:center;
	    line-height: 22px;
	}
	.custom_uspbar_desktop {
	    height:32px;
	    font-size: 22px;
	    font-weight: bold;
	    font-family: "Heebo", Helvetica, sans-serif;
	    background: #000!important;
	  	color : #FFF;
	    text-align:center;
	    line-height: 32px;
	}


/* This part of the CSS code ensures the USP bar is hidden for mobile visitors. When a screen is smaller than 767 pixels wide, the USPs will not fit properly. */
@media screen and (max-width: 767px){
.custom_uspbar{
display: none !important;
}
body {
margin-top: 0px!important;
}
}


/*CSS pour les tableaux descriptifs des Vélos*/
        table {
            font-family: arial, sans-serif;
            border-collapse: collapse;
            width: 100%;
        }

        .img {
            width: 30px;
            height: 30px;
            min-width:30px;
            min-height:30px;
        }

        .header {
            font-weight: bold;
            text-align: left;
            background-color: #f31212;
            color: white;
        }

        .td1 {
            font-weight: bold;
        }

        .td2 {
            text-align: center;
        }

        .td3 {
            font-weight: normal;
        }
        .th1 {
             border: none;
        }
      .th-left {
        text-align: left;
        border:none;
      }
      .th-right {
        text-align: right;
        border:none;
      }
				td, th {
            border: 1px solid #dddddd;
            text-align: left;
            padding: 8px;
        }

        tr:nth-child(even) {
            background-color: #dddddd;
        }