Untitled

.eg_trust{
    background-color: #ffdd01;
    display: flex;
    justify-content: center;
    position: sticky;
    top: 0;
    left: 0;
    padding-block: 10px;
    z-index: 9999;
}

.eg_ingrad img, 
.eg_protection img,
.eg_plastic img {
    width: 35px;
    margin: auto;
}

.eg_trust div {
    display: flex;
    flex-direction: column;
    padding: 1px 25px;
}

.eg_trust div p{
font-family: Gelica,Georgia,system-ui;    
    font-size: 20px;
}

.eg_trust div svg {
    width: 30px;
    margin: auto;
}

.eg_protection,.eg_ingrad, .eg_plastic {
    position: relative;
}

.eg_protection::after,
.eg_ingrad::after{
    content: '';
  height: 45%; 
  width: 1px;
  position: absolute;
  right: 0;
  top: 25%; 
  background-color: rgba(0,0,0,0.1);
}

@media screen and (max-width: 767px) {

        .eg_trust div {
            display: flex;
            flex-direction: column;
            padding: 1px 10px;
            text-align: center;
        }

        .eg_trust div p {
            font-weight: 700;
            font-family: Gelica,Georgia,system-ui;
            font-size: 16px;
            line-height: 1.1;
            padding-top: 5px;
        }
}
















(function () {
  try {
    /* main variables */
    var debug = 0;
    var variation_name = "";

    /* all Pure helper functions */

    function waitForElement(selector, trigger, delayInterval, delayTimeout) {
      var interval = setInterval(function () {
        if (
          document &&
          document.querySelector(selector) &&
          document.querySelectorAll(selector).length > 0
        ) {
          clearInterval(interval);
          trigger();
        }
      }, delayInterval);
      setTimeout(function () {
        clearInterval(interval);
      }, delayTimeout);
    }

    /* Variation functions */


    var egTrust = `
    <div class="eg_trust">
    <div class="eg_protection">

        <div class="eg_svg_1">
            <img src="https://cfactory-img.s3.amazonaws.com/WLD/4.0/icon3.svg" />
        </div>

        <p>24 hour protection</p>
    </div>

    <div class="eg_ingrad">

        <div class="eg_svg_2">
            <img src="https://cfactory-img.s3.amazonaws.com/WLD/4.0/icon2.svg" />
        </div>

        <p>Natural ingredients</p>
    </div>

    <div class="eg_plastic">
        <div class="svg_3">
            <img src="https://cfactory-img.s3.amazonaws.com/WLD/4.0/icon1.svg" />
        </div>
        <p>Plastic-free refills</p>
    </div>

</div>

`
 
function init(){
  document.querySelector("#__layout > div > main").insertAdjacentHTML("beforebegin", egTrust)

}
    /* Initialize variation */
    waitForElement("#__layout  main > div.FunnelLayout", init, 50, 15000);
  } catch (e) {
    if (debug) console.log(e, "error in Test" + variation_name);
  }
})();