<!doctype html>
<html lang="es">

<head>
  <title>Energías renovables 2023</title>
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/css/style.css">
  <!-- Bootstrap CSS v5.2.1 -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">

</head>

<body>

  <main>

  <div class="container">

   

    <hr class="parrafos">

    <div class="row">
      <div class="col-md-7">
        <h2 class="featurette-heading fw-normal lh-1">Una organización sin ánimo de lucro impulsa el desarrollo de la energía sostenible, <span class="sun">SUN DAY</span></h2>
        <p class="lead">Enfatizó una revisión por parte de la Administración de Información Energética (EIA) de los primeros 10 meses de 2022.
             En base a ello, los expertos aseguran que la energía renovable puede generar más electricidad en EEUU que la energía nuclear y 
             el carbón, en 2023. Lo cual, minimizaría la dependencia del país de la energía sucia.</p>
      </div>
      <div class="col-md-5">
        <img src="./images/sunday.png" alt="Logotipo de la empresa Sun Day">
      </div>
    </div>

    <hr class="parrafos">

    <div class="row featurette">
      <div class="col-md-7 order-md-2">
        <h2 class="featurette-heading fw-normal lh-1">Las energías de fuentes renovable se transformarán en la <span>mayor fuente de generación energética mundial.</span></h2>
        <p class="lead">No obstante, el panorama ha avanzado recientemente, ya que la producción de electricidad con energía solar y eólica están en pleno aumento. Así, muchos se preguntan si el escenario mundial también mejorará de esta forma, especialmente en España.</p>
      </div>
      <div class="col-md-5 order-md-1">
        <img src="./images/energia.jpg" alt="Una imagen en la que se ve aerogeneradores">
      </div>
    </div>
    <hr class="parrafos">

    <div class="row featurette">
      <div class="col-md-7">
        <h2 class="featurette-heading fw-normal lh-1">Los científicos han propuesto apostar por <span>la energía eólica y solar.</span></h2>
        <p class="lead">Según la revisión antes mencionada, la producción de electricidad con energía solar incrementó más del 26% en los primeros 10 meses de 2022 y en el presente año, este aumento se elevará. Por si fuera poco, sólo en el mes de octubre, la organización sin fines de lucro SUN DAY percibió que la producción de energía solar fue un 31.68% mayor que la de 2021, lo que se estima como una tasa de crecimiento que eclipsó la de cualquier otra fuente de energía.</p>
      </div>
      <div class="col-md-5">
        <img src="./images/ciclo.png" alt="Se observa un ciclo de todas las cuatro energías para obtener electricidad.">
      </div>
    </div>

    <hr class="featurette-divider">
    <div>
        <h3>Porcentaje de energías en el mundo en 2018</h3>
        <table class="col-xs-12 col-sm-12 col-md-6 order-md-6 col-lg-6"
        >
          <tr>
            <th class="column-5">Petróleo</th>
            <th class="column-4">Carbón</th>
            <th class="column-3">Gas natural</th>
            <th class="column-2">Energías renovables</th>
            <th class="column-1">Nuclear</th>
          </tr>
          <tr>
            <td class="column-5">33,6%</td>
            <td class="column-4">27,2%</td>
            <td class="column-3">23,9%</td>
            <td class="column-2">10,8%</td>
            <td class="column-1">4,4%</td>
          </tr>
        </table>
    </div>
    <div class="grafica">
      <img src="./images/grafica.png" alt="Visualización de una tabla del porcentaje de energías que se utilizan en 2018">
    </div>
    <hr class="featurette-divider">
    <div class="cajas ">
      <div class="col-xs-12 col-sm-12 col-md-12 order-md-12 col-lg-12">
        <div class="box-small">
          <p class="p-small">Con</p>
        </div>
        <div class="box-medium">
          <p class="p-medium">pequeñas cosas</p>
        </div>
        <div class="box-large">
          <p class="p-large">se consiguen grandes cosas</p>
        </div>
      </div>
      
    </div>
    <hr class="featurette-divider">
    <div class="fotos">
      <div class="fotos_">
        <img src="/images/1.jpg" alt="Se visualizan diversos aerogeneradores.">
        <p class="texto_imagen">Nuestro</p>
      </div>
      <div class="fotos_">
        <img src="/images/2.jpg" alt="Conjunto de energías renovables en el planeta.">
        <p class="texto_imagen">esfuerzo</p>

      </div>
      <div class="fotos_">
        <img src="/images/3.jpg" alt="Conjunto de placas solares y aerogeneradores.">
        <p class="texto_imagen">vale la</p>

      </div>
      <div class="fotos_">
        <img src="/images/4.jpg" alt="Simulación de una bombilla que simula una ciudad y se ven aerogeneradores.">
        <p class="texto_imagen">pena</p>

      </div>
    </div>
    <hr class="featurette-divider">

    <div class="barras">
      <div class="barra-1">
        <p>El medio</p>
      </div>
      <div class="barra-2">
        <p>ambiente es todo aquello</p>
      </div>
      <div class="barra-3">
        <p>que nos rodea. Incluye los tres</p>
      </div>
      <div class="barra-4">
        <p>reinos: mineral, vegetal y animal.</p>
      </div>
      <div class="barra-5">
        <p>Y lamentablemente nos hemos olvidado</p>
      </div>
    </div>


    <div class="cuadrado">
      <div class="cuadrado-1">
        <p class="columna-1">que si no está sano, su padecer acabará</p>
      </div>
      <div class="cuadrado-2">
        <p class="columna-2">siendo el nuestro. Estas frases </p>
      </div>
      <div class="cuadrado-3">
        <p class="columna-3">son fundamentales para</p>
      </div>
      <div class="cuadrado-4">
        <p class="columna-4">reflexionar al</p>
      </div>
      <div class="cuadrado-5">
        <p class="columna-5">respecto.</p>
      </div>
    </div>
   
    
  </div>
  </main>
  <footer>
    <div class="footer">

    </div>
  </footer>
  <!-- Bootstrap JavaScript Libraries -->
  <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"
    integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous">
  </script>

  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.min.js"
    integrity="sha384-7VPbUDkoPSGFnVtYi0QogXtr74QeVeeIs99Qfg5YCF+TidwNdjvaKZX19NZ/e6oz" crossorigin="anonymous">
  </script>
</body>

</html>