/*DIV DA ESTRUTURA DO SITE */
.container{ width:100%; color:#FFFFFF}
/* FIM DA DIV DA ESTRUTURA DO SITE */

.banner, .capa, .sessao-principal, .rodape {
background-color:#FFFFFF; 
}

nav{

}

.banner{
height:200px;
background-color:#CC0000
}

.capa {
background-color:#FFFFFF
}


@media screen and (min-width: 601px) {
.foto {width:451px; height:286px;}
}

@media screen and (max-width: 600px) {
.foto {width:290px; height:200px; }



.rodape {
height:150px;
background-color:#FF00FF

}


/* Tablet */

@media only screen and (max-width:768px) {
 article {
 width: 100%;
 height:auto;
 
 }
 
 .container {
 width:100%;
 
 }
}

/* Celular */

@media only screen and (max-width:500px) {
 article {
 width: 100%;
 height:auto;
 margin: auto;
 
 }
 
 .container {
 width:100%;
 
 }
 
 sobre {
 flex-direction: column;
 }
 
}



/*TABELA RESPONSIVA*/

@media(max-width: 900px){
.table-resp thead {display: none;}
.table-resp tr {display: block; border-bottom: 0px solid #dce0e0; }
.table-resp tr td {width: 100%; display: block; text-align: center; border-bottom: 0px dotted #ccc;}
.table-resp tr td:last-child {border-bottom: 0;}
.table-resp tr td:before {content: attr(data-label); float: left; font-weight: bold; font-size: 12px;}