.com-content-category-blog.blog h1, .com-content-article.item-page .page-header h1 {
    color: #15a067;
}

.com-content-category-blog .item-image {
    text-align: left;
}

.com-content-category-blog .item-image img{
    max-width: fit-content;
    height: 333px;
}

.com-content-category-blog .fields-container {
    display:none;
}
.com-content-category-blog .blog-items .readmore {
    display:none;
}
.com-content-category-blog.blog .item-content .page-header, .com-content-category-blog .item-image {
    text-align:center;
}

.com-content-article.item-page .item-image {
    float: left;
    padding: 1rem 5rem;
    margin-right: 2rem;
    border: thin solid #e9e9e9;
}

.com-content-article.item-page .page-header h1 {
    font-size:2rem;
}
.com-content-article.item-page .fields-container .field-value {
    font-weight: bold
}


@media screen and (min-width: 900px) {
    .blog .blog-items .blog-item, .blog-featured .blog-items .blog-item {
        width: 50%;
        float: left;
    }
}

@media screen and (min-width: 1200px) {
    .blog .blog-items .blog-item, .blog-featured .blog-items .blog-item {
        width: 30%;
        float: left;
    }
}

.com-content-article.item-page .field-entry.fiche-technique .field-value a {
    color: transparent;
    font-size:0;
}
.com-content-article.item-page .field-entry.fiche-technique .field-value a:after {
    color:#36ae45;
    font-size: var(--body-font-size);
    content: "Fiche Technique";
}
.t4-header .container-xxl .header-wrap {
    /*background-image: url('/images/castrol-logo-st.png');*/
    background-position: right;
    background-repeat: no-repeat;
    background-size: 10%;
}

.item-image img {
    width: auto;
    max-height: 500px;
}

.t4-section-inner.container-fluid .header-block {
    padding: 0;
}

.t4-section.sec-spacing-sm .t4-section-inner {
    padding-top: 0rem;
    padding-bottom: 0;
}

.t4-section-4, .t4-section-5 {
    /*display: none;*/
}

.navbar-brand.logo-control img.logo-img {
    display: none;
    max-height: 60px;
}

.pre {
    display: block;
    unicode-bidi: embed;
    font-family: monospace;
    white-space: pre;
}

.category-desc > img {
    float: right;
    max-width: 250px;
    margin-left: 1rem;
    margin-right: 0rem;
}


.category-desc > img {
    position: absolute;
    top: -10px;
    right: 30px; /*-20*/
}


/*----------------------------*/
/* style the blog-item class into a flip card */
/* Container for perspective */
.blog-items {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.blog-item {
  position: relative;
  width: 300px; /* Customize width */
  height: 400px; /* Customize height */
  perspective: 1000px; /* Enable 3D perspective */
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15), 0 6px 12px rgba(0, 0, 0, 0.1); /* More realistic corner shadows */
  transition: box-shadow 0.3s ease-in-out; /* Smooth transition for shadow */
}

/* Hover effect with even more pronounced corner shadow */
.blog-item:hover {
  box-shadow: 0 20px 35px rgba(0, 0, 0, 0.2), 0 10px 20px rgba(0, 0, 0, 0.25); /* Stronger corner-based shadow on hover */
}

/* Wrapper for the flip effect */
.item-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d; /* Keep children in 3D space */
  transition: transform 0.6s;
}

/* Flip effect on hover */
.blog-item:hover .item-wrapper {
  transform: rotateY(180deg); /* Flip the whole item */
}

/* Both sides of the item */
.blog-item .item-image,
.blog-item .item-content {
  position: absolute;
  backface-visibility: hidden; /* Hide the back face when flipped */
  width: 100%;
  height: 100%;
  overflow: hidden;
}

/* Front content: image */
.blog-item .item-image {
  z-index: 2; /* Keep image on top */
}

/* Back content: text */
.blog-item .item-content {
  transform: rotateY(180deg); /* Initially rotated 180 degrees */
  z-index: 1;
  padding: 20px;
  background-color: #fff; /* Optional: background color for visibility */
  box-sizing: border-box;
}
/** end flip*/
figure figcaption {
    background-color: inherit;
    color: #006b30;
    font-size: 1.4rem;
    letter-spacing: 0.5px;
}
.blog-item .item-content {
    background-color: #006b30;
    color: #fff;
}
.blog-item .page-header h2 a{
    color: var(--color-white);
    font-size:20px;
}
.blog-item .page-header h2 {
    margin-bottom:10px;
}
.home-categories-desc div {
  width: 30%; 
  float: left; 
  padding: 0px 20px;
}

/* Smartphone css only */
/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
.category-desc > img {
    position: relative;
    display: block;
    margin: 0 auto;
    float: none;
  }
.t4-section-2 .custom a, .t4-section-3 .custom a, .t4-section-5 .custom a {
  /*display:none;*/
  }
.home-categories-desc div {
  width: 90%;
}
.d-none {
  /*display: Block !important;*/
  }

}