body { background: #fff; }

.div-margen { width: 100%; height: 7rem; color: transparent; }

.principal { position: relative; width: 80%; margin: 0 auto 3rem auto; }
.principal iframe { width: 100%; height: 100%; position: absolute; left: 0; right: 0; top: 0; bottom: 0; }
.principal:before { content: ''; display: block; padding-top: 56.25%; }

/* Tamaño Mediano */
@media screen and (max-width: 992px) {
    .prueba { width: 90%; }
    .principal { width: 100%; }
}

/* Tamaño pequeño */
@media screen and (max-width: 576px) {
    .prueba { width: 100%; }
}