@charset "utf-8";


/* teste visão das DIVS 

div, header, nav, footer, section {
    border: 4px solid #ff0000;	
}
main {
    border: 4px solid #cccccc;
}
container{
        border: 4px solid #ffff00;	
}

*/


/* DEIXA DE AUMENTAR A DIV, CENTRALIZA NA CONTAINER AUMENTANDO APENAS A MARGEM */

@media only screen and (min-width: 1418px) {   /*** Mude após 1418px ***/
#resolucao {
        position: relative;
        width: 1210px;
        left: 0px;
        margin-left: 0px;
}
}


/* DEIXA LAYOUT PRINCIPAL FULL */

@media only screen and (min-width: 1430px) {  /*** Mude somente após 1390px ***/
       .artigo_index_novidades {
		width: 330px;
} 
        .artigo_index_projetos {
        width: 720px;
}
        .artigo_index_contato {
        width: 720px;
} 
}


@media only screen and (min-width: 0px) and (max-width: 1429px){	/***  Mude de 0px até 1200px - ok  ***/
    #principal{
    width: 100%;    
    }
    .artigo_index_novidades {
		width: 330px;
    }
    .artigo_index_projetos {
        width: 330px;
}
    .artigo_index_contato {
        width: 330px;
}
}



/* VÍDEO YOUTUBE PARA CELULARES */

@media only screen and (max-width: 500px) {	/***  Mude até 500px ***/
    .artigo_youtube {
       width: calc(100% - 4px);
}
}





/* MUDA IMAGEM DO QUADRO MAIOR, EVITANDO RECORTE */

@media only screen and (min-width: 450px) {	
    .artigo_index_novidades {
        background-image: url("imagens/layout/quadros_textos_noticia.jpg");
    } 
}


@media only screen and (min-width: 0px) and (max-width: 820px){	/***  Mude DE 0px ATÉ 500px - ok  ***/
#principal{
        width: 100%;    
    }
    .artigo_index_novidades {
		width: calc(100% - 70px);
    }
    .artigo_index_projetos {
        width: calc(100% - 70px);
}
    .artigo_index_contato {
        width: calc(100% - 70px);
}
}






/*** FIM AÇÕES NA INDEX ***/


/* Faça até 700px, dimenciona IMAGENS dos projetos */


@media only screen and (max-width: 700px) {	 
.imagem_dimencionaveis{
            width: 70%;
            height: 70%;
}
}


/* RELÓGIOS NO CABEÇALHO - Mostra apenas quando form maior que 819px(A)*/

@media only screen and (min-width: 819px){

#cabecalho_relogios {
                float: right;        
                width: 273px;
                height: 162px;
                background-image: url("imagens/layout/relogios_cabecalho.png");
                margin-top: 70px;
                background-repeat: no-repeat;        
}
}


/*** RODAPÉ (3 TAMANHOS DIFERENTES) ***/


@media only screen and (max-width: 850px) {	/*  diminuir até 850px */
#rodape_logo {
	float: right;	
    width: 390px;
    }
}


@media only screen and (max-width: 500px) {	/*  diminuir até 500px */
#rodape_logo {
    float: left;
    width: 250px;
    margin-left: calc((100% - 250px)/2);
    }
}