.responsive-iframe {
    position: relative;
    padding-bottom: 72%;
    height: 0;
    overflow: hidden;
}

.responsive-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media (max-width: 767px) {
    .responsive-iframe {
        padding-bottom: 152%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .responsive-iframe {
        padding-bottom: 117%;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .responsive-iframe {
        padding-bottom: 87%;
    }
}