@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;500;900&display=swap');

* {margin: 0;padding: 0;border: none;outline: none;font-weight: 300;box-sizing: border-box;font-size: 100%;font-family: 'Roboto', sans-serif }
html{height: 100%;}
body {background-color: #f6f6f6;height: 100%;color: #323232}
a {
    text-decoration: none;
    color: inherit; /* herda a cor do pai */
    transition: color 0.3s ease; /* transição suave */
}

a:hover {
    color: #00547e;
}
ul {list-style: none}
img {max-width: 100%;float: left;width: 100%}

.container {float: left;width: 100%;padding: 2% 4%;position: relative;}
.limite {margin:0 auto;width:100%;max-width:1240px;clear: both;position: relative}
.limite2 {margin:0 auto;width:100%;max-width:1240px;padding: 2% 5%;clear: both;position: relative}

.img-sombra:after{
    content: " ";
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 29%, rgba(0,0,0,0.65) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 29%,rgba(0,0,0,0.65) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 29%,rgba(0,0,0,0.65) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
    right: 0px;
    z-index: 1;
}
.escurecedor:after{
    content: " ";
    background: -moz-linear-gradient(top, rgba(0,0,0,0.55) 100%, rgba(0,0,0,0.55) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0.55,0) 100%,rgba(0,0,0,0.55) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0.55) 100%,rgba(0,0,0,0.55) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
    right: 0px;
    z-index: 1;
}

.mobileOn{display: block}
.mobileOff {display: none}

header{position: relative;float: left;width: 100%; background-color: #ffffff;clear: both;}
section{float: left;width: 100%;position: relative}

.menu-btn { cursor: pointer; width: 24px; height: 24px;}
.btn_burger{ content: ''; width: 24px; height: 3px; background-color: white; border-radius: 5px; transition: all 0.3s ease; position: relative;float: left}
.btn_burger::before{ content: ''; width: 24px; height: 3px; background-color: white; border-radius: 5px; transition: all 0.3s ease; position: relative;float: left;    margin: 9px 0;}
.btn_burger::after { content: ''; width: 24px; height: 3px; background-color: white; border-radius: 5px; transition: all 0.3s ease; position: relative;float: left;    margin: -3px 0;}
.btn-busca{float: right;background-image: url("../images/icone-busca.svg")}


.btn {font-size: 1.2em;cursor: pointer}
.btn-menu {float: right; color: #ffffff;     font-size: 1.8em;display: block;text-align: center;border-radius: 50%;position: relative;}
.btn-busca{float: right;color: #fff;font-size: 1.3em;}


#myBtn {
    display: none; position: fixed; bottom: 20px; right: 30px; z-index: 99; border: none; outline: none; background-color: #b6771d; color: white;  cursor: pointer;  padding: 15px; border-radius: 10px; font-size: 18px;}

#myBtn:hover { background-color: #555; }

.linha {float: left;width: 100%}
.mascara-topo{background: url("../images/dots.png"); background-size: 100px 100px; position: absolute;width: 100%;height: 100%}

.ads-topo{float: left;width: 100%;}
.ads01 {float: left;width: 20%; margin-right: 2%}
.ads02{float: left;width: 56%;margin-right: 2%}
.barrinha-azul{float: left;width: 100%;margin-left: 0%;height: 3px;background-color: #20539b; margin-bottom: 10px;}

.barrinha{float: left;width: 50%;margin-left: 25%;height: 2px;background-color: #f4ac00; margin-bottom: 10px;}
.icone-fachada{float: left; width: 100%; text-align: center;color: #f4ac00;font-size: 1.5em}
.linha {float: left;width: 100%}
.mascara-topo{background: url("../images/dots.png"); background-size: 100px 100px; position: absolute;width: 100%;height: 100%}
.idioma {float: right;margin-left: 5px;padding: 20px 0; width: 28%;}
.idioma img {width: 30%;float: right;margin-left: 3px}

.compartilhar-facebook { float: left;  padding: 0px 9px; font-size: 0.8em;margin-left: 15px;color: #fff}
.compartilhar-whatsapp { float: left; padding: 0px 9px; font-size: 0.8em;margin-right: 5px;color: #fff}
.btn-close {font-size: 1.5em;float: right;cursor: pointer;color: #000;    padding: 2% 3% 0 0;line-height: normal}

.logo {float: left; background: url(../images/logoB.png) center center / 79% no-repeat; font-size: 0; width: 100%;height: 60px; position: relative; z-index: 3;}

footer{ float: left; width: 100%;border-top: 7px solid #ccc;margin-top: 20px;padding: 20px 0; background-color: #010252; color: #fff;}
footer h1{float: left;width: 100%;font-weight: 700;text-align: center}
footer h2{float: left;width: 100%;text-align: center}
footer h3{float: left;width: 100%;text-align: center;margin: 20px 0; padding: 0 20px}

.logo-footer {float: left; background: url(../images/logoCb.png) center center / 10% no-repeat; font-size: 0; width: 100%;height: 60px; position: relative; z-index: 3;}

.cabecalho{float: left;width: 100%;margin-top: 10px;}
.cabecalho h1 {
    float: left;
    width: 100%;
    padding: 20px;
    text-align: center;
    font-size: 1.5em;
    letter-spacing: -.5px;
    color: #436580;
    font-weight: bold;
}
.cabecalho h2{float: left;width: 100%; text-align:  center;font-size: 0.9em; color: #436580;}
.cabecalho b{position: relative; display: inline-block; width: 100%; height: 1px; background: #d6d6d6; margin: 10px 0 10px 0}
.cabecalho b:after {
    position: relative;
    top: -16px;
    content: "";
    display: inline-block;
    width: 30%;
    margin: 0;
    height: 2px;
    background: #052C62;
    margin-left: 35%;
}
.equipe{
    float: left;
    width: 100%;
    padding: 3%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.equipe figure {
    width: 150px;
    height: 150px;
    border-radius: 50%;
}

.equipe h1 {
    float: left;
    width: 100%;
    text-align: center;
    margin-top: 10px;
    font-weight: 900;
        font-size: 1.3em;

}
.equipe h2 {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 0.9em;
}
.equipe span {float: left;width: 100%;text-align: center;    padding: 5px 0;}

.box-leitura{float: left;position: relative;width: 100%;}
.box-leitura h1{float: left;width: 100%;font-size: 1.5em;font-weight: 700;padding:10px 0}
.box-leitura h2{float: left;width: 100%;font-size: 0.9em;padding-bottom: 15px;margin-bottom: 10px;border-bottom: 1px solid #aeaeae}
.box-leitura h3{float: left;width: 100%;text-align: center;font-size: 0.9em;color: #555555}
.leitura-sociais{float: left;width: 100%;padding: 10px 0;text-align: center;font-size: 1.4em}
.box-leitura figure{position: relative;float: left;width: 100%;overflow: hidden}
.box-leitura figcaption{position: absolute;right: 0;bottom: 0;background-color: #dddbe0;padding: 3px 5px;color: #323232;font-size: 0.8em}
.leitura-texto{float: left;width: 100%;margin-top: 10px;line-height: 1.5em;color: #000000}
.leitura-fotos{float: left;width: 100%; padding: 20px;}
.leitura-fotos {
    float: left;
    width: 100%;
    padding: 10px 20px;
    margin-top: 20px;
}
.leitura-fotos img  {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}
.tit-noticia{float: left;width: 100%;text-align: left;font-size: 1.5em;letter-spacing: -.5px; color: #000f00;font-weight: bold;margin-top: 20px}

.topo{float: left;width: 100%;display: flex;align-content: space-around;align-items: center;flex-wrap: wrap;padding: 10px 5px;border-bottom: 3px solid #0292db;background-color: #0292db}
.data-topo{    float: left;width: 50%;margin-left: 10%; color: #FFFFFF}
.data-topo h1 {    float: left;width: 100%;text-transform: uppercase;font-weight: 400;font-size: 0.9em;}
.data-topo h2 {    float: left;width: 100%;font-size: 0.9em;}
.logo-topo{    float: left; width: 30%;}
.menu-topo{    float: left; width: 40%;display: none }
.sociais-topo{}
.info-topo{    float: left; width: 100%; border-bottom: 1px solid #0292db;}
.previsao{float: left; width: 100%;display: flex; flex-wrap: wrap; justify-content: center;padding: 10px 0;background-color: aliceblue;}
.banner{    float: left; width: 100%; padding: 20px 10px;}
.destaque01{    float: left; width: 100%; padding: 20px 10px; text-align: center;}
.destaque01 h1{font-size: 1.8em; font-weight: 600; margin-bottom: 10px;}
.destaque01 h2{    font-size: 0.9em;}

.destaque02{float: left; width: 100%;    margin-bottom: 20px;}
.destaque02 figure {float: left; width: 100%;position: relative}
.destaque02 figcaption{    position: absolute; color: #fff; padding: 20px; font-weight: 500; bottom: 0; font-size: 1.5em;    z-index: 2;}

.destaque03{float: left; width: 100%;}
.destaque03 figure {
    float: left;
    width: 40%;
    position: relative;
    padding: 10px;
    border-radius: 10px;
    overflow: hidden;
    min-height: 111px;
    margin: 0 10px 10px;
}
.destaque03 figcaption{display:none !important;float: left;width: 50%; margin-left: 5%; font-weight: 500;display: flex;  height: 111px; align-content: center; align-items: center;}
.destaque03 h1{float: left;width: 52%; margin-left: 2%; font-weight: 500;display: flex;  height: 111px; align-content: center; align-items: center;}

.destaque03 img{ float: left; width: 45%;    border-radius: 10px;}
.coluna{float: left; width: 100%;}
.fachada{float: left; width: 100%;    padding-bottom: 20px;}

.banner790{    float: left; width: 100%; margin-bottom: 20px;}
.banner790{    float: left; width: 100%; }

.box-g{float: left; width: 100%;}
.box-g figure{float: left; width: 100%;}
.box-g h1 {    float: left;width: 100%;padding: 10px 20px;font-size: 1.3em; font-weight: bold; line-height: 1em;}
.box-g h2 {    float: left;width: 100%;padding: 0 20px;font-size: 0.9em;margin-bottom: 30px;}
.btn-close {
    font-size: 1.5em;
    float: right;
    cursor: pointer;
    color: #000;
    padding: 2% 3% 0 0;
    line-height: normal;
    position: absolute;
    right: 10%;
    top: 3%;
}
.box-p{float: left; width: 100%;}
.box-p figure{float: left; width: 94%; margin: 20px 3%;border-radius: 20px; overflow: hidden;}
.box-p figcaption{    float: left;width: 100%;padding: 5%;color: #fff;font-weight: bold;}

.box-videos{float: left;width: initial; margin-left: 10px;padding: 10px 20px;background-color: #000; color: #fff;font-weight: 500;}
.informes {padding: 20px 0}
.informes img{border: 1px solid #ffffff70;border-radius: 10px;}
.informes figure{ position: relative; float: left; width: 92%; margin: 20px 4%;}
.informes figcaption{    float: left;width: 100%;padding: 20px;color: #fff;font-weight: bold;border-bottom: 1px solid #ffffff63;}

.cat-destaques figure { float: left; width: 94%; margin: 20px 3%; border-radius: 20px;overflow: hidden;}
.cat-destaques  figcaption{    float: left;width: 100%;padding: 20px;color: #fff;font-weight: bold;border-bottom: 1px solid #ffffff63;}
.cat-destaques span{    position: absolute;font-weight: 400; margin-top: 18px; padding: 5px 15px; border-radius: 0 10px 10px 0;}

.box-not-p {float: left; width: 100%;padding: 3%;}
.box-not-p img {float: left; width: 40%; margin-right: 4%;border-radius: 10px;}
.box-not-p h1 {float: left; width: 56%; font-weight: 500; display: flex; align-content: center;  height: 98px;  align-items: center;}

.box-not-m {float: left; width: 100%;}
.box-not-m figure { float: left; width: 94%; margin: 20px 3%; overflow: hidden;}
.box-not-m h1{ float: left;width: 100%;padding: 20px;font-weight: bold;border-bottom: 1px solid #ffffff63;}

.vertical{
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}
.menu-mobile {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #0292db;
    z-index: 4;
    padding: 10%;
}
.menu01 li {
    float: left;
    padding: 10px 20px;
    text-transform: uppercase;
    width: 100%;
    border-bottom: 1px dotted #fff;
}
.menu02 li {
    float: left;
    padding: 5px;
    width: 33.3%;
    font-size: 0.9em;
    text-align: center;
    background-color: #fff;
}
.menu02 a{
    color: #0292db !important;
    font-weight: bold;
}
.menu-mobile a{
    color: #FFFFFF;
    font-weight: bold;
}
.sociais-mobile {
    float: left;
    width: 100%;
    padding: 10px;
    text-align: center;
}
.sociais-mobile i {
    font-size: 2em;
    padding: 0 10px;
}
figure .play-icon {
    position: absolute;
    top: 35%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 3rem;
    color: white;
    opacity: 0.8;
    transition: 0.3s;
    pointer-events: none; /* para não bloquear clique na imagem */
}
.noticia {
    position: relative;
    float: left;
    width: 100%;
    padding: 0 5% 10% 5%;
}
.noticia-sociais {
    float: left;
    display: flex
;
    height: 36px;
    align-content: center;
    align-items: center;
    margin-left: 15px;
}
.noticia-sociais i{
    font-size: 1em;
}
.noticia-info {
    float: left;
    width: auto;

}
.noticia article  {
    float: left;
    position: relative;
    width: 100%;
    margin-top: 20px;
}
.noticia figure {
    float: left;
    width: 100%;
    position: relative;
}
.noticia figcaption {
    float: left;
    width: 100%;
    position: relative;
    background-color: #ebebeb;
    padding: 3px 6px;
    font-size: 0.8em;
}
.noticia-fonte {
    float: left;
    width: 100%;
    font-size: 0.8em;
    font-weight: bold;
    padding: 3px 6px;
    margin: 15px 0;
    background-color: #efefef;
    border: 1px solid #e9e9e9;
}
.badge-date {
    display: inline-flex                    ;
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 4px 8px 4px 4px;
    color: #4b4b4b;
    font-size: 14px;
    position: relative;
    line-height: 1;
}

/* "Caixa" do ícone (círculo pequeno) */
.badge-date .ico-wrap {
    display: inline-flex
;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    flex: 0 0 auto;
}
.badge-date .ico-wrap i {
    font-size: 12px;
    color: #3f3f3f;
}

/* Separador vertical */
.badge-date .divider {
    width: 1px;
    height: 22px;
    background: #ececec;
    margin-right: 10px;
    flex: 0 0 auto;
}

/* Texto (use time para semanticidade) */
.badge-date time {
    font-size: 13px;
    color: #3f3f3f;
    white-space: nowrap;
}

/* "Cauda" no lado direito (como um balão/ponta) */
.badge-date::after {
    content: "";
    position: absolute;
    right: -7px;
    top: 50%;
    transform: translateY(-50%) rotate(315deg);
    width: 12px;
    height: 12px;
    background: #f6f6f6;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-radius: 2px 0 0 0;
}

/* opção: leve hover */
.badge-date:hover {
    box-shadow: 0 4px 10px rgba(0,0,0,0.06);
    transform: translateY(-1px);
    transition: all .14s ease;
}
.ticker {
    width: min(var(--maxw), 100%);
    background: var(--card);
    border-radius: var(--radius);
    padding: 12px 16px;
    box-shadow: 0 6px 18px rgba(17,24,39,0.06);
    border: 1px solid rgba(16,24,40,0.04);
    display:flex;
    gap:12px;
    align-items:center;
    overflow:hidden;
}

/* conteúdo que transita */
.content {
    display:flex;
    gap:12px;
    align-items:center;
    width:100%;
    transition: opacity .35s ease, transform .35s ease;
    opacity: 0;
    transform: translateY(6px);
}
.content.visible { opacity: 1; transform: translateY(0); }

.date {
    flex: 0 0 auto;
    font-size: 13px;
    color: var(--muted);
    min-width: 95px; /* reserva espaço para a data */
}

.title {
    flex: 1 1 auto;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;       /* forçar uma linha só */
    overflow: hidden;
    text-overflow: ellipsis;   /* "..." quando muito longa */
}

/* versão responsiva: diminuir texto em telas bem pequenas */
@media (max-width:420px){
    .date { min-width: 80px; font-size:12px; }
    .title { font-size:14px; }
}


@media screen and (min-width: 768px) {

    .vertical {
        float: left;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .mobileOff {display: block}
    .mobileOn {display: none}


    .topo {
        float: left;
        width: 100%;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        padding: 10px 5px;
        border-bottom: 3px solid #0292db;
        background-color: #0292db;
        justify-content: center;
    }
    .menu-topo {
        float: left;
        width: 35%;
        display: block;
        text-align: end;
    }
    .menu-topo li {
        float: right;
        display: inline;
        font-size: 0.8em;
        text-transform: uppercase;
        padding-left: 10px;
    }
    .menu-topo a {color: #FFFFFF;font-weight: 700}

    .data-topo { float: left;width: 30%; margin-left: 0; color: #FFFFFF; }

    .logo {    background: url(../images/logoB.png) center center / 59% no-repeat;}

    .sociais-topo {
        float: right;
        width: 100%;
        margin-top: 3px;
    }
    .menu-principal {
        float: left;
        width: 100%;
        display: flex   ;
        justify-content: center;
        padding: 10px 0;
    }
    .menu-principal ul {
        list-style: none;
        float: left;
        width: 100%;
    }
    .menu-principal li {
        display: inline;
        float: initial;
        padding: 5px 3px;
        text-transform: uppercase;
        font-size: 0.7em;
    }
    .menu-principal a {
        font-weight: 400;
    }
    .previsao {width: 30%;  }
    .destaque01{    padding: 20px 30px;}
    .fachada {
        float: left;
        width: 100%;
        padding: 3%;
    }
    .destaque02 {
        float: left;
        width: 58%;
        margin-bottom: 0;
        border-radius: 10px;
        overflow: hidden;
    }
    .destaque02 img{height: 293px}

    .coluna {
        float: left;
        width: 40%;
        margin-left: 2%
    }
    .destaque03 {    margin-bottom: 4%; }
        .destaque03 figure {
        float: left;
        width: 100%;
        position: relative;
        padding: 0px;
        margin: 0;
        min-height: 140px;
    }
    .destaque03 img {
        float: left;
        width: 100%;
        border-radius: 10px;
        height: 140px;
    }
    .destaque03 h1 {display:none !important;}
    .destaque03 figcaption {
        
        z-index: 2;
        float: left;
        width: 100%;
        margin-left: 0;
        font-weight: 500;
        display: flex!important;
        height: 111px;
        align-content: center;
        align-items: center;
        position: absolute;
        color: #fff;
        padding: 5%;
        flex-direction: column-reverse;
        bottom: 0;
    }
    .banner440 {
        width: 35%;
        float: left;
        margin-left: 1%;
    }
    .banner790 {
        float: left;
        width: 63%;
        margin-right: 1%;
    }
    .box-g {
        float: left;
        width: 63%;
        padding: 10px 0 0 10px;
    }
    .box-g figure {
        float: left;
        width: 32%;
        margin-right: 2%;
    }
    .box-g h1 {
        float: left;
        width: 100%;
        padding: 10px 5px;
        font-size: 0.8em;
        font-weight: bold;
        line-height: 1em;
    }
    .box-g h2 {
        float: left;
        width: 100%;
        padding: 0 5px;
        font-size: 0.7em;
        margin-bottom: 30px;
    }
    .box-p {
        float: left;
        width: 35%;
        margin-left: 1%;
    }
    .box-p figure {
        float: left;
        width: 94%;
        margin: 10px 3% 0;
        border-radius: 10px;
        overflow: hidden;
    }
    .box-p figcaption {
        float: left;
        width: 100%;
        padding: 5%;
        color: #fff;
        font-weight: bold;
        font-size: 0.8em;
    }
    .informes figure {
        float: left;
        width: 22%;
        margin: 20px 0 0 2%;
    }
    .informes figcaption {
        float: left;
        width: 100%;
        padding: 5px;
        color: #fff;
        font-weight: bold;
        border-bottom: 1px solid #ffffff63;
        font-size: 0.7em;
    }
    .cat-destaques figure {
        float: left;
        width: 32%;
        margin: 20px 0 0 1%;
        border-radius: 10px;
        overflow: hidden;
    }
    .cat-destaques figure {
        float: left;
        width: 32%;
        margin: 20px 0 0 1%;
        border-radius: 10px;
        overflow: hidden;
    }
    .cat-destaques figcaption {
        float: left;
        width: 100%;
        padding: 10px;
        color: #fff;
        font-weight: bold;
        border-bottom: 1px solid #ffffff63;
        font-size: 0.7em;
    }
    .box-not-p {
        float: left;
        width: 33%;
        padding: 0 1% 20px 1%;
    }
    .box-not-p img {
        float: left;
        width: 40%;
        margin-right: 4%;
        border-radius: 5px;
    }
    .box-not-p h1 {
        float: left;
        width: 56%;
        font-weight: 500;
        display: flex ;
        align-content: center;
        height: 63px;
        align-items: center;
        font-size: 0.7em;
    }
    .box-not-m figure {
        float: left;
        width: 32%;
        margin: 20px 0 0 1%;
        overflow: hidden;
    }
    .box-not-m img {border-radius: 5px;}
    .box-not-m h1 {
        float: left;
        width: 100%;
        padding: 10px;
        font-weight: bold;
        font-size: 0.8em;
        border-bottom: 1px solid #ffffff63;
    }
    .logo-footer {
        float: left;
        background: url(../images/logoCb.png) center center / 40% no-repeat;
        font-size: 0;
        width: 20%;
        height: 60px;
        position: relative;
        z-index: 3;
    }
    .info-footer {
        float: left;
        width: 80%;
        min-height: 100px;
        display: flex
;
        align-items: center;
        flex-wrap: wrap;
    }
    footer h1 {
        float: left;
        width: 100%;
        font-weight: 700;
        text-align: left;
    }
    footer h2 {
        float: left;
        width: 100%;
        text-align: left;
        font-size: 0.8em;
    }
    footer h3 {
        float: left;
        width: 100%;
        text-align: left;
        margin: 5px 0;
        padding: 0;
        font-size: 0.8em;
    }



}

@media screen and (min-width: 1024px) {

    .fachada {
        float: left;
        width: 100%;
        padding: 0;
    }

    .topo {padding: 20px 5px;        border-bottom: 2px solid #006193;}
    .logo {height: 80px; }
    .menu-principal li {
        display: inline;
        float: initial;
        padding: 5px 5px;
        text-transform: uppercase;
        font-size: 1em;
    }
    .previsao {
        width: 25%;
    }
    .plantao {
        float: left;
        width: 75%;
    }
    .banner {
        float: left;
        width: 100%;
        padding: 20px 80px;
    }
    .destaque01 h1 {
        font-size: 2em;
        font-weight: 600;
        margin-bottom: 10px;
    }
    .destaque01 h2 {
        font-size: 01em;
    }
    .destaque02 img {
        height: 370px;
    }
    .destaque03 img {
        float: left;
        width: 100%;
        border-radius: 10px;
        height: 177px;
    }
    .banner {    margin: 40px 0;}
    .banner440{    margin-bottom: 0;}
    .banner790 {    margin-bottom: 0;}
    .box-g {
        float: left;
        width: 63%;
        padding: 10px 0 0 0;
    }
    .box-p {
        float: left;
        width: 36%;
        margin-left: 1%;
    }
    .box-p figure {
        float: left;
        width: 97%;
        margin: 10px 0 0 3%;
        border-radius: 10px;
        overflow: hidden;
    }
    .noticia {
        position: relative;
        float: left;
        width: 100%;
        padding: 0 20% 10% 20%;
        margin-top: 20px;
    }
    .leitura-fotos img {
        float: left;
        width: 31%;
        margin-bottom: 10px;
        margin-right: 10px;
    }
    .noticia article {
        float: left;
        position: relative;
        width: 100%;
        margin-top: 40px;
    }



}
@media screen and (min-width: 1280px) {
    .menu-principal{padding: 0}
    .menu-principal li {
        position: relative;
        display: inline-block;
        padding: 10px;
        text-transform: uppercase;
        font-size: 1em;
        cursor: pointer;
        overflow: hidden; /* esconde o fundo durante o slide */
        z-index: 1;
    }

    .menu-principal li::after {
        content: "";
        position: absolute;
        top: -100%; /* começa fora do elemento */
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #0292db;
        z-index: -1; /* fica atrás do texto */
        transition: top 0.3s ease;
    }

    .menu-principal li:hover::after {
        top: 0; /* desce e cobre o item */
    }

    .menu-principal li:hover {
        color: #fff !important;
    }
    .logo {
        background: url(../images/logoB.png) center center / 49% no-repeat;
    }
    .destaque01 h1 {
        font-size: 3em;
        font-weight: 600;
        margin-bottom: 10px;
    }
    .destaque02 img {
        height: 452px;
    }
    .destaque02 figcaption {
        position: absolute;
        color: #fff;
        padding: 30px;
        font-weight: 500;
        bottom: 0;
        font-size: 2em;
        z-index: 2;
    }
    .destaque03 img {
        float: left;
        width: 100%;
        border-radius: 10px;
        height: 216px;
    }
        .destaque03 figure {
        float: left;
        width: 100%;
        position: relative;
        padding: 0px;
        min-height: 216px;
    }
    .destaque03 figcaption{        font-size: 1.5em;}
    .box-g h1 {
        float: left;
        width: 100%;
        padding: 10px 5px;
        font-size: 1em;
        font-weight: bold;
        line-height: 1.3em;
        min-height: 109px;
    }
    .box-g h2 {
        float: left;
        width: 100%;
        padding: 0 5px;
        font-size: 0.9em;
        margin-bottom: 30px;
        line-height: 1.3em;
        min-height: 54px;
    }
    .box-p figcaption {
        float: left;
        width: 100%;
        padding: 4%;
        color: #fff;
        font-weight: bold;
        font-size: 1.2em;
    }
    .informes figcaption {
        float: left;
        width: 100%;
        padding: 10px 5px;
        color: #fff;
        font-weight: bold;
        border-bottom: 1px solid #ffffff63;
        font-size: 1em;
        min-height: 78px;
    }
        .cat-destaques figcaption {
        float: left;
        width: 100%;
        padding: 20px;
        color: #fff;
        font-weight: bold;
        border-bottom: 1px solid #ffffff63;
        font-size: 1em;
        min-height: 98px;
        display: flex
;
        align-items: center;
    }
    .box-not-p h1 {
        float: left;
        width: 56%;
        font-weight: 500;
        display: flex
    ;
        align-content: center;
        height: 102px;
        align-items: center;
        font-size: 1em;
    }
    .box-not-m h1 {
        float: left;
        width: 100%;
        padding: 10px;
        font-weight: bold;
        font-size: 1.3em;
        border-bottom: 1px solid #ffffff63;
    }
    .logo-footer {
        float: left;
        background: url(../images/logoCb.png) center center / 40% no-repeat;
        font-size: 0;
        width: 20%;
        height: 100px;
        position: relative;
        z-index: 3;
    }
    footer h1 {
        float: left;
        width: 100%;
        font-weight: 700;
        text-align: left;
        font-size: 1.5em;
    }
        footer h2 {
        float: left;
        width: 100%;
        text-align: left;
        font-size: 1em;
        font-weight: 900;
    }
    footer h3 {
        float: left;
        width: 100%;
        text-align: left;
        margin: 5px 0;
        padding: 0;
        font-size: 1em;
    }


}

