place two images one above the other

Question

I am looking to update a site. The goal is to put the "reservez" button above the image "logis" My problem is that whatever changes I make I have another style that takes over and my changes do not take effect. So I'm a little desperate and I don't know how to move the 'reservez' element above the image.

Could you help me, I'm just starting out and what may seem obvious to you may not be obvious to me. Thanks in advance. What I have : Actual Images

The code :

<div class="site-branding">
  <div class="logo-main" style="text-align: left">
    <h1 class="site-title semantic">Hotel LOGIS LA BORIE en Périgord Noir</h1>
    <a href="https://hotel-restaurant-borie.fr/" rel="home" class="site-logo"
      ><img
        id="desktop-logo"
        src="https://hotel-restaurant-borie.fr/wp-content/uploads/2017/04/Transparent.png"
        alt="Hotel LOGIS LA BORIE en Périgord noir"
        width="988"
        height="614"
      />
      <img
        id="retina-logo"
        src="https://hotel-restaurant-borie.fr/wp-content/uploads/2017/04/Transparent.png"
        alt="Hotel LOGIS LA BORIE en Périgord noir"
        width="988"
        height="614"
      />
    </a>
    <div class="tel-header">Tel. +33 (0 53 28 97 60</div>
  </div>
  <div class="form-reservation">
    <div class="logo-logis">
      <a
        href="https://hotel-restaurant-borie.fr/wp-content/uploads/2020/12/sejoursur-logis.mp4"
        target="_blank"
        rel="noopener noreferrer"
      >
        <img
          src="https://hotel-restaurant-borie.fr/wp-content/uploads/2020/12/BANDEAU-MAIL-400X100px-SEJOUR-PLUS-SUR-1.jpg"
          alt="lien de réservation"
          style="width: 400px !important"
        />
      </a>
    </div>
    <div class="group-input">
      <div class="logo-logis">
        <a
          href="https://www.logishotels.com/fr/hotel/-254254?partid=568&amp;layout=search&amp;ref=r"
          target="_blank"
          rel="noopener noreferrer"
        >
          <img
            style="width: 105px !important"
            src="https://hotel-restaurant-borie.fr/wp-content/uploads/2017/04/reservez-1.png"
            alt="lien de réservation"
            width="112"
            height="25"
        /></a>
        <a
          href="https://www.logishotels.com/fr/hotel/hotel-borie-254254?PARTID=1012&amp;gclid=Cj0KCQjwvLLZBRDrARIsADU6ojBX_SZoGK4q8u1U_o9D7ym88hIxs1SkPMDf8VeswMveqWXBDF70HFsaApIXEALw_wcB"
          target="_blank"
        >
          <img
            style="width: 105px !important"
            src="https://hotel-restaurant-borie.fr/wp-content/themes/morrison-hotel/images/log-logis.png"
        /></a>
      </div>
    </div>
  </div>
</div>

What I want is : Final result I want

Answer 1

Try below CSS in your Style

.logo-logis {
    display: flex;
    flex-direction: column;
}