#ctnBannerHome{
    min-height: 320px;
    background-image: url(/midias/sites/imgs/fundo-banner.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding-top: 30px;
    padding-bottom: 30px;
    position: relative;
    margin-bottom: 30px;
}

#ctnBannerHome .ladoEsquerdo { position: relative; display: block !important; width: 64.6666667%; height: 100%; float: left; }

#ctnBannerHome .ladoEsquerdo>div{ position: absolute; width: 100%; left: 0px; top:0px; z-index: 2; }
#ctnBannerHome .ladoEsquerdo>img{ position: absolute; right: 0px; top:0px; width: auto !important; height: 100% !important; min-height: 260px; }
#ctnBannerHome .ladoEsquerdo .fraseBanner{ background-color: #c3cf21; font-size: 36px; padding: 5px 12px 5px 12px !important; line-height: 58px; }

#ctnBannerHome>div>.btnLerArtigo{ position: absolute; bottom: 30px; z-index: 4;  }
#ctnBannerHome .ladoEsquerdo .btnLerArtigo{ display: none; }
#ctnBannerHome .btnLerArtigo::after{ content: "→"; display: inline-block; margin-left: 8px; }

#ctnBannerHome .ladoDireito{ width: 33%; float: right; height: 100%; min-height: 260px;  }



/* CELULAR */
@media all and (max-width: 768px){

    #ctnBannerHome{ width: 100%; padding-left: 1.3%; padding-right: 1.3%; padding-top: 5px; margin: 0px; position: static;  }

    #ctnBannerHome .ladoEsquerdo,
    #ctnBannerHome .ladoDireito { position: static; width: 100%;float: none; margin: 0px; }

    #ctnBannerHome .ladoEsquerdo>img{ min-height: 0 !important; height: auto !important; width: 100% !important; }
    #ctnBannerHome .ladoEsquerdo>div{ margin-top:-33px; margin-bottom: 37px; width: 98%; margin-left: 1%; margin-right: 1%; }
    #ctnBannerHome .ladoEsquerdo .fraseBanner{ font-size: 14px; line-height: 33px; }

    #ctnBannerHome .ladoDireito { }

    #ctnBannerHome>div>.btnLerArtigo{ display: none; }
    #ctnBannerHome .ladoEsquerdo .btnLerArtigo{ display: inline-block; float: right; font-size: 10px; padding: 2px 8px; }
}


/* CELULAR EM PE */
@media all and (max-width: 768px) and (orientation: portrait){
    #ctnBannerHome .ladoEsquerdo>img{ position: static; }
    #ctnBannerHome .ladoEsquerdo>div{ position: relative; }

}


/* CELULAR DEITADO */
@media all and (max-width: 768px) and (orientation: landscape){


    #ctnBannerHome .ladoEsquerdo>img{ position: static; float: right; height: auto !important; width: 60% !important;  }
    #ctnBannerHome .ladoEsquerdo{ position: relative; }
    #ctnBannerHome .ladoEsquerdo>div{ width: 90%; margin-left: 9%; margin-right: 1%;  margin-top:5px; margin-bottom: 37px;  }

    #ctnBannerHome .ladoEsquerdo .btnLerArtigo{ float: left; margin-top: 30px; }


    #ctnBannerHome .ladoDireito { margin-top: 15px; }
}

/* O fundo do título em destaque deixa a imagem parcialmente visível. */
#ctnBannerHome .ladoEsquerdo .fraseBanner{ background-color: rgba(195, 207, 33, 0.6); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
