<script src="https://adventori.com/lp/enabler/ADventori-2.0.0.js" crossorigin="anonymous" type="text/javascript"></script>
<link rel=stylesheet type="text/css" href="https://adventori.com/lp/enabler/ADventori-2.0.0.css">

<div id="container1">
  <h1>setImageUrl()</h1><p><br>Without resize</p>
  <div id="ADventori_myAd1">           
    <div id="ADventori_myContent1">
        <img id="ADventori_logo1" src="https://adventori.com/lp/enabler/templates/assets/logo_carre_vert.svg">                   
        <div id="ADventori_Container_img1">
          <img id="ADventori_img1">
        </div>
    </div>
  </div>
</div>

<div id="container2">
  <h1>setImageUrl() + adaptImage()</h1><p><br>With the display option {fit:'contain'}</p>  
  <div id="ADventori_myAd2">           
    <div id="ADventori_myContent2">
        <img id="ADventori_logo2" src="https://adventori.com/lp/enabler/templates/assets/logo_carre_vert.svg">                   
        <div id="ADventori_Container_img2">
          <img id="ADventori_img2">
        </div>
    </div>
  </div>
</div>

<div id="container3">
  <h1>setImageUrl() + adaptImage()</h1><p><br>With the display option {fit:'cover'}</p>  
  <div id="ADventori_myAd3">           
    <div id="ADventori_myContent3">
        <img id="ADventori_logo3" src="https://adventori.com/lp/enabler/templates/assets/logo_carre_vert.svg">                   
        <div id="ADventori_Container_img3">
          <img id="ADventori_img3">
        </div>
    </div>
  </div>
</div>

<div id="container4">
  <h1>setImageUrl() + adaptImage()</h1><p><br>With the display option {fit:'cover', width : 270, height : 160}</p>  
  <div id="ADventori_myAd4">           
    <div id="ADventori_myContent4">
        <img id="ADventori_logo4" src="https://adventori.com/lp/enabler/templates/assets/logo_carre_vert.svg">                   
        <div id="ADventori_Container_img4">
          <img id="ADventori_img4">
        </div>
    </div>
  </div>
</div>

#container1, #container2, #container3, #container4{ 
  margin-left: 25px;
  width: 300px;
  height: 400px;
  display:inline-block;
  position:relative;
}

h1{
  height: 30px;
  width: 300px;
  font-size: 15px;
  position: absolute;
  top: 5px;
  color: #114454;
}
p{
  width: 300px;
  font-size: 13px;
  top: 20px;
  color: #353535;
  position: absolute;
}


#ADventori_myAd1 *, #ADventori_myAd2 *, #ADventori_myAd3 *, #ADventori_myAd4 *{
  box-sizing: border-box;
}
#ADventori_myAd1, #ADventori_myAd2, #ADventori_myAd3, #ADventori_myAd4{
    margin-top: 80px;
    float: left;
    overflow: hidden;
    width: 300px;
    height: 250px;
    cursor:pointer;
    border: 1px solid black;
    background-color: #ffffff;
}
#ADventori_myContent1, #ADventori_myContent2, #ADventori_myContent3, #ADventori_myContent4{
    position: relative;
    width: 100%;
    height: 100%;
    background-image : url(https://adventori.com/lp/enabler/templates/assets/bg-01.jpg)
}
#ADventori_myContent1::after, #ADventori_myContent2::after, #ADventori_myContent3::after, #ADventori_myContent4::after{
    display: block;
    width: 300px;
    height: 250px;
    content: "";
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0.3) 100%);
}
#ADventori_logo1, #ADventori_logo2, #ADventori_logo3, #ADventori_logo4{
    position:absolute;
    right: 0;
    left: 0;
    display: block;
    width: 60px;
    height: 60px;
    margin: auto;
}
#ADventori_Container_img1,#ADventori_Container_img2, #ADventori_Container_img3, #ADventori_Container_img4{
    width: 270px;
    height: 160px;
    font-size: 22px;
    line-height: 25px;
    position: absolute;
    top: 75px;
    left: 0px;
    right:0px;
    margin:auto;
    color: #114454;
    background-color:#EC6A6D;
    overflow:hidden;
}