/*
 * Meu Banner Plugin — estilos públicos de exibição.
 *
 * Banners de imagem ocupam, no máximo, 100% da largura do contêiner em que
 * foram inseridos. Isso impede que layouts com colunas estreitas ou templates
 * especiais sejam quebrados por banners mais largos.
 */
.mbp-banner {
    display: block;
    clear: both;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Mantém links de banner dentro da mesma largura da coluna. */
.mbp-banner.mbp-banner-image a {
    display: inline-block;
    width: 100%;
    max-width: 100%;
}

/*
 * !important é aplicado somente às imagens dentro do wrapper do plugin para
 * neutralizar regras genéricas de temas que podem definir larguras incompatíveis.
 */
.mbp-banner.mbp-banner-image img {
    display: inline-block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    vertical-align: middle;
    box-sizing: border-box;
}

/* Mantém códigos de vídeo incorporados responsivos. */
.mbp-banner video,
.mbp-banner iframe {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
}