[Proyecto] Haga lo que hicimos en aula

html

<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">


 <section class="mapa">
                <h3 class="titulo_principal"> Esta es nuestra ubicación</h3>
                <p> Nuestro establecimiento está ubicado en el corazón de la ciudad</p>

                <iframe src="https://www.google.com/maps/embed?pb=!1m16!1m12!1m3!1d3656.4289779950755!2d-46.63605992529485!3d-23.588943462604906!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!2m1!1scaelum%20alura!5e0!3m2!1ses-419!2sco!4v1683296365237!5m2!1ses-419!2sco" width="100%" height="300" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>

            </section>

            <div class="video">
                <iframe width="560" height="315" src="https://www.youtube.com/embed/wcVVXUV0YUY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
            </div>

css

body{
    font-family: 'Montserrat', sans-serif;
}



.mapa {
    padding: 3em 0;
}

.mapa p {
    margin: 0 0 2em;
    text-align: center;
}

.imagendiferenciales {
    width: 60%;
}


.video{
    width: 560px;
    margin: 1em auto;
}