<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Louvre</title>
  <link rel="stylesheet" href="style.css">
</head>

<body>
  <header class="stripeblack">
    <div class="logo">LOUVRE</div>
    <nav class="nav">
      <a href="#visiting">Visiting</a>
      <a href="#explore">Explore</a>
      <a href="#video">Video</a>
      <a href="#gallery">Gallery</a>
      <a href="#tickets">Tickets</a>
      <a href="#contacts">Contacts</a>
    </nav>
  </header>
  <main>
    <section class="stripeblack" id="welcome" style="position: relative; height: 842px;">
      <img src="images/Frame.png" alt="Mona Lisa"
        style="position: absolute; width: 1000px; height: 810px; left: 680px; top: 0;">

      <div class="framewelcome" style="left: 240px;">
        <h1 class="welcometothelouvre">Welcome to the Louvre</h1>
        <p class="fromthecastle">From the castle to the museum</p>
        <a class="button"
          href="https://www.google.com/maps/@48.8618159,2.3366818,3a,75y,81.55h,73.4t/data=!3m7!1e1!3m5!1sAF1QipOVxZQuSy3Bx9T_HpH_7FtBHDTXvI6SF-A10ocT!2e10!3e12!7i5472!8i2736"
          target="_blank">
          Discover the Louvre
        </a>
      </div>
    </section>

    <section id="visiting" class="stripewhite" style="position: relative; height: 1202px;">
      <p style="
position: absolute;
left: 240px;
top: 0px;
font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 80px;
line-height: 90px;
letter-spacing: 5px;
text-transform: uppercase;
color: #9D8665;
">
        virtual tour
      </p>
      <div style="position: absolute;
width: 1440px;
height: 3px;
left: 240px;
top: 190px;
background: #710707;
border-radius: 0px;">
      </div>
      <a
        href="https://www.google.com/maps/@48.8606882,2.3356791,3a,90y,328.36h,87.55t/data=!3m7!1e1!3m5!1sAF1QipMZ9YgnArbwEIbTDANeSQYFu9gNqpW_2Sv8FBvY!2e10!3e12!7i4352!8i1815">
        <div style="position: relative; top: 75px; left: 240px;">
          <img src="images/Rectangle.jpg" style="
position: absolute;
width: 440px;
height: 285px;
left: 0px;
top: 193px;
border-radius: 0px;
">
          <p style="

position: absolute;
width: 280px;
height: 35px;
left: 0px;
top: 470px;
font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 32px;
line-height: 35px;
letter-spacing: 3px;
text-transform: uppercase;
color: #000000;
">
            royal palace
          </p>
          <div style="

position: absolute;
width: 300px;
height: 2px;
left: 0px;
top: 545px;

background: #710707;
border-radius: 0px;
"></div>
          <p style="
position: absolute;
width: 165px;
height: 26px;
left: 0px;
top: 535px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 22px;
line-height: 26px;
color: #000000;">360° Virtual Tour</p>
          <p style="
position: absolute;
width: 240px;
height: 21px;
left: 0px;
top: 565px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 18px;
line-height: 21px;
color: #000000;">Google Street Panorama View</p>
        </div>
      </a>
      <a
        href="https://www.google.com/maps/@48.8563254,2.3352706,3a,75y,90t/data=!3m7!1e1!3m5!1sAF1QipNRj_CwP4coDMYdCHj6qHeBeJpI2VxU5BUsOX4F!2e10!3e12!7i11000!8i5500">
        <div style="position: relative; top: 75px; left: 240px;">
          <img src="images/Rectangle1.jpg" style="
position: absolute;
width: 440px;
height: 285px;
left: 500px;
top: 193px;
border-radius: 0px;
">
          <p style="

position: absolute;
width: 280px;
height: 35px;
left: 500px;
top: 470px;
font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 32px;
line-height: 35px;
letter-spacing: 3px;
text-transform: uppercase;
color: #000000;
">
            Denon Wing
          </p>
          <div style="

position: absolute;
width: 300px;
height: 2px;
left: 500px;
top: 545px;

background: #710707;
border-radius: 0px;
"></div>
          <p style="
position: absolute;
width: 165px;
height: 26px;
left: 500px;
top: 535px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 22px;
line-height: 26px;
color: #000000;">360° Virtual Tour</p>
          <p style="
position: absolute;
width: 240px;
height: 21px;
left: 500px;
top: 565px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 18px;
line-height: 21px;
color: #000000;">Google Street Panorama View</p>
        </div>
      </a>
      <a
        href="https://www.google.com/maps/@48.8601723,2.3395439,3a,88.4y,322.04h,84.25t/data=!3m7!1e1!3m5!1sAF1QipNMZGQuEA-pAUvIG_eP_2f3gWTKZEJ6XLVJ-Pgb!2e10!3e12!7i10240!8i5120">
        <div style="position: relative; top: 75px; left: 240px;">
          <img src="images/Rectangle2.jpg" style="
position: absolute;
width: 440px;
height: 285px;
left: 1000px;
top: 193px;
border-radius: 0px;
">
          <p style="

position: absolute;
width: 600px;
height: 35px;
left: 1000px;
top: 470px;
font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 32px;
line-height: 35px;
letter-spacing: 3px;
text-transform: uppercase;
color: #000000;
">
            Colonnade Perrault
          </p>
          <div style="

position: absolute;
width: 300px;
height: 2px;
left: 1000px;
top: 545px;

background: #710707;
border-radius: 0px;
"></div>
          <p style="
position: absolute;
width: 165px;
height: 26px;
left: 1000px;
top: 535px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 22px;
line-height: 26px;
color: #000000;">360° Virtual Tour</p>
          <p style="
position: absolute;
width: 240px;
height: 21px;
left: 1000px;
top: 565px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 18px;
line-height: 21px;
color: #000000;">Google Street Panorama View</p>
        </div>
      </a>
      <a
        href="https://www.google.com/maps/@48.860183,2.3356156,3a,90y,177.69h,95.61t/data=!3m7!1e1!3m5!1sAF1QipP7uFZnTITRe-7AEVAgHAfqiCL-03gvBHcYWgF3!2e10!3e12!7i5472!8i2736">
        <div style="position: relative; top: 75px; left: 240px;">
          <img src="images/Rectangle3.jpg" style="
position: absolute;
width: 440px;
height: 285px;
left: 0px;
top: 675px;
border-radius: 0px;
">
          <p style="

position: absolute;
width: 280px;
height: 35px;
left: 0px;
top: 943px;
font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 32px;
line-height: 35px;
letter-spacing: 3px;
text-transform: uppercase;
color: #000000;
">
            Greek hall
          </p>
          <div style="

position: absolute;
width: 300px;
height: 2px;
left: 0px;
top: 1018px;

background: #710707;
border-radius: 0px;
"></div>
          <p style="
position: absolute;
width: 165px;
height: 26px;
left: 0px;
top: 1008px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 22px;
line-height: 26px;
color: #000000;">360° Virtual Tour</p>
          <p style="
position: absolute;
width: 240px;
height: 21px;
left: 0px;
top: 1038px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 18px;
line-height: 21px;
color: #000000;">Google Street Panorama View</p>
        </div>
      </a>
      <a
        href="https://www.google.com/maps/@48.8598788,2.3355157,3a,82.2y,7.53h,94t/data=!3m7!1e1!3m5!1sAF1QipO1wkUUbyzpPjj-OR0mR5etZJT-xl-40XK8rDQ3!2e10!3e12!7i10240!8i5120">
        <div style="position: relative; top: 75px; left: 240px;">
          <img src="images/Rectangle4.jpg" style="
position: absolute;
width: 440px;
height: 285px;
left: 500px;
top: 675px;
border-radius: 0px;
">
          <p style="

position: absolute;
width: 280px;
height: 35px;
left: 500px;
top: 943px;
font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 32px;
line-height: 35px;
letter-spacing: 3px;
text-transform: uppercase;
color: #000000;
">
            Mona Lisa
          </p>
          <div style="

position: absolute;
width: 300px;
height: 2px;
left: 500px;
top: 1018px;

background: #710707;
border-radius: 0px;
"></div>
          <p style="
position: absolute;
width: 165px;
height: 26px;
left: 500px;
top: 1008px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 22px;
line-height: 26px;
color: #000000;">360° Virtual Tour</p>
          <p style="
position: absolute;
width: 240px;
height: 21px;
left: 500px;
top: 1038px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 18px;
line-height: 21px;
color: #000000;">Google Street Panorama View</p>
        </div>
      </a>
      <a
        href="https://www.google.com/maps/@48.8563254,2.3352706,3a,90y,21.26h,79.91t/data=!3m7!1e1!3m5!1sAF1QipPpGAowYatVyk3MMGnZAaQkYm2EUk-Dlca06SS5!2e10!3e12!7i11304!8i5652">
        <div style="position: relative; top: 75px; left: 240px;">
          <img src="images/Rectangle5.jpg" style="
position: absolute;
width: 440px;
height: 285px;
left: 1000px;
top: 675px;
border-radius: 0px;
">
          <p style="

position: absolute;
width: 600px;
height: 35px;
left: 1000px;
top: 943px;
font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 32px;
line-height: 35px;
letter-spacing: 3px;
text-transform: uppercase;
color: #000000;
">
            night palace
          </p>
          <div style="

position: absolute;
width: 300px;
height: 2px;
left: 1000px;
top: 1018px;

background: #710707;
border-radius: 0px;
"></div>
          <p style="
position: absolute;
width: 165px;
height: 26px;
left: 1000px;
top: 1008px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 22px;
line-height: 26px;
color: #000000;">360° Virtual Tour</p>
          <p style="
position: absolute;
width: 240px;
height: 21px;
left: 1000px;
top: 1038px;
font-family: 'Roboto';
font-style: normal;
font-weight: 200;
font-size: 18px;
line-height: 21px;
color: #000000;">Google Street Panorama View</p>
        </div>
      </a>
    </section>
    <section id="explore" class="stripeblack" style="position: relative; height: 865px;">
      <div class="slider-container">
        <img src="images/Rectangle7.png" class="before">
        <img src="images/Rectangle6.png" class="after">
        <div class="slider-line"></div>
        <div class="slider-handle">
          <img src="images/explore slider.png" alt="Slider Handle">
        </div>
      </div>
      <p style="
  position: absolute;
  height: 90px;
  left: 240px;
  top: 0px;
  font-family: 'Forum', serif;
  font-style: normal;
  font-weight: 200;
  font-size: 80px;
  line-height: 90px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: #FFFFFF;">
        picture explore
      </p>
      <p style="
position: absolute;
width: 780px;
height: 3px;
left: 240px;
top: 178px;
background: #710707;
border-radius: 0px;
">
      </p>
      <p style="
position: absolute;
width: 660px;
height: 77px;
left: 240px;
top: 240px;
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
font-size: 22px;
line-height: 38px;
color: #FFFFFF;
">Las Meninas is a 1656 painting by Diego Velázquez, the leading artist of the Spanish Golden Age.<br><br>
        It was cleaned in 1984 to remove a <span style="color: #e1bd2e;">"yellow veil"</span> of dust that had
        gathered since the previous restoration in the 19th century.<br><br>
        The cleaning provoked furious protests, not because the picture had been damaged in any way, but because
        it looked different.</p>

    </section>
    <section id="video" class="stripewhite" style="position: relative; height: 1400px;">
      <p style="
position: absolute;
height: 90px;
left: 240px;
top: 0px;
font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 80px;
line-height: 90px;
/* identical to box height, or 112% */
letter-spacing: 5px;
text-transform: uppercase;

color: #9D8665;

">video journey</p>
      <p style="
position: absolute;
height: 90px;
right: 240px;
top: 58px;
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
font-size: 22px;
line-height: 38px;
display: flex;
align-items: center;
color: #000000;
">Enter and visit one of the most famous museums in the world and enjoy<br> masterpieces such as Mona Lisa or
        Hammurabi's Code</p>
      <div>
        <img src="images/Rectanglevideo.png" style="
position: absolute;
width: 1440px;
height: 650px;
left: 240px;
top: 240px;
border-radius: 0px;
">
        <a href="https://youtu.be/zp1BXPX8jcU">
          <img src="images/play.png" style="
position: absolute;
width: 220px;
height: 220px;
left: 850px;
top: 455px;
border-radius: 0px;
">
        </a>
        <img src="images/youtube.png" style="/* Frame */

position: absolute;
width: 1440px;
height: 85px;
left: 240px;
top: 815px;">
      </div>
      <div>
        <img src="images/poster3.png" style="
position: absolute;
width: 452px;
height: 254px;
left: 240px;
top: 940px;">
        <img src="images/Video title3.png" style="
position: absolute;
width: 406px;
height: 35px;
left: 250px;
top: 952px;">
        <a href="https://www.youtube.com/watch?v=aWmJ5DgyWPI">
          <img src="images/youtube icon.png" style="
position: absolute;
width: 68px;
height: 48px;
left: 432px;
top: 1043px;">
        </a>
      </div>
      <div>
        <img src="images/poster1.png" style="
position: absolute;
width: 452px;
height: 254px;
left: 734px;
top: 940px;
">
        <img src="images/Video title1.png" style="
position: absolute;
width: 406px;
height: 40px;
left: 744px;
top: 952px;">
        <a href="https://www.youtube.com/watch?v=Vi5D6FKhRmo">
          <img src="images/youtube icon.png" style="
position: absolute;
width: 68px;
height: 48px;
left: 926px;
top: 1043px;
">
        </a>
      </div>
      <div>
        <img src="images/poster2.png" style="
position: absolute;
width: 452px;
height: 254px;
left: 1228px;
top: 940px;">
        <img src="images/Video title2.png" style="
position: absolute;
width: 406px;
height: 40px;
left: 1238px;
top: 952px;
">
        <a href="https://www.youtube.com/watch?v=NOhDysLnTvY">
          <img src="images/youtube icon.png" style="
position: absolute;
width: 68px;
height: 48px;
left: 1420px;
top: 1043px;
">
        </a>

      </div>
      </div>
      <img src="images/Vector (Stroke) left.png" style="
position: absolute;
width: 10px;
height: 12px;
left: 860px;
top: 1240px;
">
      <img src="images/Ellipse 4.png" style="/* Ellipse 4 */

position: absolute;
width: 12px;
height: 12px;
left: 890px;
top: 1240px;
">
      <img src="images/Ellipse 5.png" style="/* Ellipse 5 */

position: absolute;
width: 12px;
height: 12px;
left: 922px;
top: 1240px;
">
      <img src="images/Ellipse 6.png" style="/* Ellipse 6 */

position: absolute;
width: 12px;
height: 12px;
left: 954px;
top: 1240px;
">
      <img src="images/Ellipse 7.png" style="
position: absolute;
width: 12px;
height: 12px;
left: 986px;
top: 1240px;
">
      <img src="images/Ellipse 8.png" style="
position: absolute;
width: 12px;
height: 12px;
left: 1018px;
top: 1240px;
">
      <IMG src="images/Vector (Stroke) right.png" style="/* Vector (Stroke) */

position: absolute;
width: 10px;
height: 12px;
left: 1050px;
top: 1240px;

">



      </div>


    </section>
    <section id="gallery" class="stripeblack" style="position: relative; height: 2200px;">

      <p style="/* Art Gallery */

position: absolute;
width: 600px;
height: 90px;
left: 240px;
top: 0px;

font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 80px;
line-height: 90px;
/* identical to box height, or 112% */
letter-spacing: 5px;
text-transform: uppercase;

color: #FFFFFF;

">Art Gallery</p>
      <img src="images/galery2 1.png" style="/* galery2 1 */

position: absolute;
width: 456px;
height: 570px;
left: 240px;
top: 315px;
">
      <img src="images/galery1 1.png" style="/* galery1 1 */

position: absolute;
width: 456px;
height: 456px;
left: 732px;
top: 240px;
">
      <img src="images/galery7 1.png" style="

position: absolute;
width: 456px;
height: 570px;
right: 240px;
top: 315px;
">
      <img src="images/galery8 1.png" style="/* galery8 1 */

position: absolute;
width: 456px;
height: 570px;
left: 732px;
top: 720px;
">
      <img src="images/galery3 1.png" style="/* galery3 1 */

position: absolute;
width: 456px;
height: 570px;
left: 732px;
top: 1314px;
">
      <img src="images/galery5 1.png" style="
position: absolute;
width: 456px;
height: 292px;
left: 732px;
top: 1908px;
filter: brightness(50%);
">
      <img src="images/galery9 1.png" style="

position: absolute;
width: 456px;
height: 570px;
left: 240px;
top: 884px;
">
      <img src="images/galery4 1.png" style="/* galery4 1 */

position: absolute;
width: 456px;
height: 456px;
left: 240px;
top: 1478px;
">
      <img src="images/galery6 1.png" style="/* galery6 1 */

position: absolute;
width: 456px;
height: 242px;
left: 240px;
top: 1958px;
filter: brightness(50%);
">
      <img src="images/galery10 1.png" style="/* galery10 1 */

position: absolute;
width: 456px;
height: 456px;
right: 240px;
top: 884px;
">
      <img src="images/galery15 1.png" style="
position: absolute;
width: 456px;
height: 456px;
right:240px;
top: 1364px;
">
      <div class="image-dark-bottom" style="
  position: absolute;
  width: 456px;
  height: 342px;
  right: 240px;
  top: 1844px;
  overflow: hidden;
">
        <img src="images/galery12 1.png">
        <div class="dark-overlay"></div>
      </div>

    </section>
    <section id="tickets" class="stripewhite" style="position: relative; height: 1293px;">
      <p style="/* BUY TICKETS */

position: absolute;
left: 240px;
top: 0px;

font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 80px;
line-height: 90px;
/* identical to box height, or 112% */
letter-spacing: 5px;
text-transform: uppercase;

color: #9D8665;

">
        buy tickets
      </p>
      <p style="/* Rectangle */

position: absolute;
width: 1440px;
height: 3px;
left: 240px;
top: 190px;

background: #710707;
border-radius: 0px;
"></p>
      <img src="images/Rectangle buy tickets.png" style="/* Rectangle */

position: absolute;
width: 720px;
height: 550px;
left: 240px;
top: 268px;

background: url(.jpg);
border-radius: 0px;
">
      <p style="/* Ticket Type */

position: absolute;
width: 156px;
height: 33px;
left: 1020px;
top: 233px;

font-family: 'Roboto';
font-style: normal;
font-weight: 700;
font-size: 28px;
line-height: 33px;
/* identical to box height */

color: #000000;

">Ticket Type</p>

      <form style="
  position: absolute;
  width: 270px;
  height: 211px;
  left: 1020px;
  top: 318px;
">

        <div style="margin-bottom: 15px;">
          <input type="radio" id="permanent exhibition" name="type" value="Permanent exhibition">
          <label for="permanent exhibition">Permanent exhibition</label>
        </div>

        <div style="margin-bottom: 15px;">
          <input type="radio" id="temporary exhibition" name="type" value="Temporary exhibition">
          <label for="temporary exhibition">Temporary exhibition</label>
        </div>

        <div>
          <input type="radio" id="combined admission" name="type" value="Combined Admission">
          <label for="combined admission">Combined Admission</label>
        </div>

      </form>
      <img src="images/parallax 1.png" style="/* parallax 1 */

position: absolute;
width: 1920px;
height: 400px;
left: 0px;
top: 893px;

background: url(parallax.jpg);
">
      <p style="/* Amount */

position: absolute;
width: 100px;
height: 33px;
left: 1520px;
top: 233px;

font-family: 'Roboto';
font-style: normal;
font-weight: 700;
font-size: 28px;
line-height: 33px;
/* identical to box height */

color: #000000;

">Amount</p>
      <section class="ticket-container">
        <div class="ticket-group">
          <div class="label">Basic 18+</div>
          <div class="counter">
            <button onclick="decrement('basic')">−</button>
            <span id="basic-count">1</span>
            <button onclick="increment('basic')">+</button>
          </div>
        </div>

        <div class="ticket-group">
          <div class="label">Senior 65+</div>
          <div class="counter">
            <button onclick="decrement('senior')">−</button>
            <span id="senior-count">1</span>
            <button onclick="increment('senior')">+</button>
          </div>
        </div>

        <div class="total">
          Total €<span id="total">220</span>
        </div>

        <button class="buy-button">Buy Now</button>
      </section>


      <script>
        const prices = {
          basic: 110,
          senior: 110
        };

        const counts = {
          basic: 1,
          senior: 1
        };
        function updateDisplay() {
          document.getElementById("basic-count").textContent = counts.basic;
          document.getElementById("senior-count").textContent = counts.senior;
          const total = counts.basic * prices.basic + counts.senior * prices.senior;
          document.getElementById("total").textContent = total;
        }

        function increment(type) {
          counts[type]++;
          updateDisplay();
        }

        function decrement(type) {
          if (counts[type] > 0) {
            counts[type]--;
            updateDisplay();
          }
        }

        updateDisplay();
      </script>
    </section>
    <section id="contacts" class="stripewhite" style="position: relative; height: 962px;">
      <p style="/* Contacts */

position: absolute;
width: 397px;
height: 90px;
left: 240px;
top: 0px;

font-family: 'Forum';
font-style: normal;
font-weight: 400;
font-size: 80px;
line-height: 90px;
/* identical to box height, or 112% */
letter-spacing: 5px;
text-transform: uppercase;

color: #9D8665;

">
        Contacts
      </p>
      <p style="/* Rectangle */

position: absolute;
width: 1440px;
height: 3px;
left: 240px;
top: 190px;

background: #710707;
border-radius: 0px;
"></p>
      <div class="map-container">
  <iframe
    src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2519.0090168633323!2d4.351710615745591!3d50.85034697953237!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c3c380e27c2fd1%3A0xb57d028a2c6dc5f6!2sGrand%20Place%2C%201000%20Bruxelles%2C%20Belgium!5e0!3m2!1sen!2sbe!4v1633000000000!5m2!1sen!2sbe"
    width="600"
    height="450"
    style="border:0;"
    allowfullscreen=""
    loading="lazy"
    referrerpolicy="no-referrer-when-downgrade">
  </iframe>
</div>

      <p style="/* Palais Royal Musee du Louvre */

position: absolute;
width: 227px;
height: 66px;
left: 240px;
top: 238px;

font-family: 'Roboto';
font-style: normal;
font-weight: 500;
font-size: 28px;
line-height: 33px;

color: #000000;

">Palais Royal Musee du Louvre</p>
      <div style="margin-left: 240px; padding-top: 350px;">
        <p>
          address: 75001 Paris, France<br><br>
          phone: +33(0) 1 40 20 50 50<br><br>
          mail: info@louvre.fr
        </p>
      </div>
    </section>
  </main>

  <footer class="stripeblack" style="position:relative; height: 392px;">
    <div class="logo" style="top: 75px;">LOUVRE</div>
    <nav class="navfooter">
      <a href="#visiting">Visiting</a>
      <a href="#explore">Explore</a>
      <a href="#video">Video</a>
      <a href="#gallery">Gallery</a>
      <a href="#tickets">Tickets</a>
      <a href="#contacts">Contacts</a>
    </nav>
    <a href="https://www.youtube.com/user/louvre">
    <img src="images/Youtubee.png" style="/* Youtube */

position: absolute;
width: 48px;
height: 48px;
right: 532px;
bottom: 182px;

">
</a>
<a href="https://www.instagram.com/museelouvre/">
    <img src="images/Instagram.png" style="

position: absolute;
width: 48px;
height: 48px;
right: 459px;
bottom: 182px;

">
</a>
<a href="https://www.facebook.com/museedulouvre">
    <img src="images/Facebook.png" style="

position: absolute;
width: 48px;
height: 48px;
right: 386px;
bottom: 182px;

">
</a>
<a href="http://twitter.com/museelouvre">
    <img src="images/Twitter.png" style="

position: absolute;
width: 48px;
height: 48px;
right: 313px;
bottom: 182px;

">
</a>
<a href="https://www.pinterest.fr/museedulouvre/">
    <img src="images/Pinterest.png" style="

position: absolute;
width: 48px;
height: 48px;
right: 240px;
bottom: 182px;

">
</a>
<p style="/* Rectangle 24 */

position: absolute;
width: 1920px;
height: 3px;
bottom:124px;
background: #666666;

"></p>

<nav class="navfoot">
      <a>© 2025</a>
      <a href="https://rs.school/">The Rolling Scopes School</a><!-- stage 0 -->
      <a href="https://github.com/PolinaSoroko">PolinaSoroko</a>
    </nav>
  </footer>
</body>
</html>