/*
Theme Name:     Thème Enfant Weaver Xtreme
Description:    Style Sheet for products content
Author:         Koenraad
Template:       weaver-xtreme

(optional values you can add: Theme URI, Author URI, Version, License, License URI, Tags, Text Domain)
*/
/* Remove product picture from header */
.header-image {
  display: none;
}

/* Remove the drop-down box "Tri par défaut" on the page produits */ 
.woocommerce .woocommerce-ordering select {
display: none;
}

/* Remove the Woocommerce result count on the page produits */
/* .woocommerce .woocommerce-result-count {
  display: none;
}*/

/* Remove the product name under every product on the page produits */
.woocommerce ul.products li.product h3 {
  display: none;
  font-size: 20px;
  font-weight: 800;
}

/* Center product name, product and add to cart button price under every product on the page produits */
.woocommerce ul.products li.product {
  text-align: center;
}

/* Center the star ratings under every product on the page produits */
.woocommerce ul.products li.product a .star-rating {
  position:relative;
  margin:auto
}

/* Set font size and color of the price under every product in the page produits */
.woocommerce ul.products li.product span.price {
  font-weight: 800;
}

/* Set color and font-weight for the prices on every single product page and on the products loop page */
.woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
  font-weight: 900;
  color: #00B5C2;
}

/* Set the style of the input field quantity on the single products page */
input.input-text.qty.text {
  width: 100px;
  font-weight: bold;
  font-size: 18px;
}
.woocommerce .quantity .qty {
  text-align: center;
}
button, input:not([type="radio"]):not([type="checkbox"]), select {
  vertical-align: middle;
}
select, textarea, input:not([type]), input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] {
  background-color: #FFFF99;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0 ,0.1);
  border-radius: 4px;
  color: #444;
  font-size: 12px;
  font-weight: 400;
  outline: none;
  padding: 10px;
}

/* Do not display etiquettes in single product page */
div.summary.entry-summary div.product_meta span.tagged_as {
  display: none !important;
}

/* Set the style for horizontal line under the tabs of the single product page */
.woocommerce div.product .woocommerce-tabs ul.tabs:before {
    position: absolute;
    content: " ";
    width: 100%;
    bottom: 0;
    left: 0;
    border-bottom: 1px solid #FFCC00;
    z-index: 1;
}

/* Remove white shadows in the lower corners of selected tab of the single product page */
.woocommerce div.product .woocommerce-tabs ul.tabs li.active:before {
    box-shadow: -2px 2px 0 transparent;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active:after {
    box-shadow: -2px 2px 0 transparent;
}

/* Remove white shadows in the lower corners of non-selected tabs of the single product page */
.woocommerce div.product .woocommerce-tabs ul.tabs li:before {
    left: -6px;
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-bottom-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-width: 0; /* removes the small corner borders which were misplaced in the layout */
    box-shadow: 2px 2px 0 transparent; /* removes the white shadow */
}
.woocommerce div.product .woocommerce-tabs ul.tabs li:after {
    right: -6px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-bottom-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-width: 0; /* removes the small corner borders which were misplaced in the layout */
    box-shadow: -2px 2px 0 transparent; /* removes the white shadow */
}

/* Set the style for the non-selected tabs of the single product page */
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  border: 1px solid #515151;
  background-color: #FFCC00;
  display: inline-block;
  position: relative;
  z-index: 0;
  border-radius: 4px 4px 0 0;
  margin: 0 -5px;
  padding: 0 1em;
  border-bottom-color: #FFCC00;
}

/* Set the style for the selected tab of the single product page */
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background: #00B5C2;
  z-index: 2;
  border-bottom-color: #00B5C2;
}

/* Set the style for the text on the non-selected tabs of the single product page */
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  display: inline-block;
  padding: .5em 0;
  font-weight: 700;
  color: #515151;
  text-decoration: none;
}

/* Set the style for the text on the selected tab of the single product page */
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: #FFFFFF;
    text-shadow: inherit;
}

/* Set the style for the comment field when logged in and giving a comment on a single product */
#review_form #respond textarea {
    box-sizing: border-box;
    width: 100%;
}
.woocommerce #reviews #comment {
    height: 75px;
}
textarea#comment {
  background-color: #FFFF99;
  color: #000000;
  margin-top: 1%;
  margin-left: 1%;
}

/* Set the style for the table in the tab "Information complémentaire" of a single product page */
table.shop_attributes {
  border-color: #FFCC00 !important;
}
td.product_weight {
  border-color: #FFCC00 !important;
  padding-left: 5px !important;
}

/* Set style for horizontal line in product descriptions */
hr.horizontal-line {
  border: 0;
  /* height: 1px; */
  background-image: linear-gradient(to right, #000000, #FFCC00, #000000);
}

/* Style of product names in the product descriptions */
.o5oh {
  color: #FFCC00;
  font-weight: bold;
}
.o5oe {
  color: #FFCC00;
  font-weight: bold;
}
.a3oh {
  color: #FFCC00;
  font-weight: bold;
}
.a3oe {
  color: #FFCC00;
  font-weight: bold;
}
.pro51 {
  color: #FFCC00;
  font-weight: bold;
}
.sp7s {
  color: #FFCC00;
  font-weight: bold;
}
.xtls {
  color: #FFCC00;
  font-weight: bold;
}
.fh3s {
  color: #FFCC00;
  font-weight: bold;
}
.rx2s {
  color: #FFCC00;
  font-weight: bold;
}
.ytec {
  color: #FFCC00;
  font-weight: bold;
}
.premium {
  color: #FFFFFF;
  font-weight: bold;  
}

/* responsive rules for tablets and phones with screen width between 580px and 767px */
@media screen and (max-width:223px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 24px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 224px and 359px */
@media screen and (min-width:224px)  and (max-width:359px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 24px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 360px and 389px */
@media screen and (min-width:360px)  and (max-width:389px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 26px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 390px and 419px */
@media screen and (min-width:390px)  and (max-width:419px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 26px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 420px and 439px */
@media screen and (min-width:420px)  and (max-width:439px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 26px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 440px and 447px */
@media screen and (min-width:440px)  and (max-width:447px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 26px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 448px and 469px */
@media screen and (min-width:448px)  and (max-width:469px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 26px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 470px and 499px */
@media screen and (min-width:470px)  and (max-width:499px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 26px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 500px and 579px */
@media screen and (min-width:500px)  and (max-width:579px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 26px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 580px and 599px */
@media screen and (min-width:580px) and (max-width:599px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 600px and 619px */
@media screen and (min-width:600px) and (max-width:619px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 620px and 626px */
@media screen and (min-width:620px) and (max-width:626px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 627px and 639px */
@media screen and (min-width:627px) and (max-width:639px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 640px and 684px */
@media screen and (min-width:640px) and (max-width:684px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 685px and 699px */
@media screen and (min-width:685px) and (max-width:699px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 700px and 719px */
@media screen and (min-width:700px) and (max-width:719px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 720px and 731px */
@media screen and (min-width:720px) and (max-width:731px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 732px and 767px */
@media screen and (min-width:732px) and (max-width:767px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for devices with screen width between 768px and 779px */
@media screen and (min-width:768px) and (max-width:779px){
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 780px and 819px */
@media screen and (min-width:780px) and (max-width:819px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 820px and 849px */
@media screen and (min-width:820px) and (max-width:849px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for tablets and phones with screen width between 850px and 999px */
@media screen and (min-width:850px) and (max-width:999px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}

/* responsive rules for devices with minimum screen width of 1000px */
@media screen and (min-width:1000px) {
  /* Set size for the prices on every single product page and on the products loop page */
  .woocommerce ul.products li.product span.price span.woocommerce-Price-amount.amount {
    font-size: 40px;
  }
  /** --------------------------------------------------------------------------------------------------- **/
}