body {
    font-family: 'Roboto Condensed', sans-serif,verdana;
}



/*
Base geral
*/

#beta {
    text-align: center;
}
#espaco {
    background: #ffffff;
    padding-top: 85px;
}
#rodape {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    text-align: center;
    padding: 15px;
    
}

#banner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    
}

#banner div {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
#banner img {
    display: flex;
    max-width: 100%;
}


#templo {
    display: flex;
    flex-direction: row;
    padding: 15px;
    
    justify-content: center;
    text-align: center;
}

#templo p {
    padding: 15px;
    max-width: 100%;
    margin: 15px;
}
#templo div{
 flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    max-width: 50%;
}

#templo .botao {
    text-decoration: none;
    background-color: #2384c6;
    color: #ffffff;
    padding:10px;
    border: 15px;
}




#foto {
    display: flex;
    flex-direction: column;
    padding: 15px;
    align-items:center;
    justify-content: center;
    
}
#foto img {
    max-width: 100%;
}




#destaque {
    display: flex;
    flex-direction: column;
    background: #8B7D7B;
    justify-content: center;
    align-items:center;
    padding: 35px ;
 
}
#destaque div {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
    padding: 45px;
    border: 15px;
}
#destaque p {
    color: #ffffff;
    padding: 15px;
    font-size: 25px;
    width: 600px;
    text-align: center;
}

#destaque h2 {
    color: #ffffff;
    padding: 15px;
    
    font-size: 
}
#destaque lo {
    display: flex;
    flex-direction: row;
}

#destaque .botao {
    text-decoration: none;
    background-color: #2384c6;
    color: #ffffff;
    padding:10px;
    border: 15px;
}









#destaque2 {
    display: flex;
    flex-direction: column;
    background: #2384c6;
    justify-content: center;
    align-items:center;
    padding-top: 15px 1px 1px 5px;
 
}
#destaque2 div {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
    padding: 25px;
    border: 15px;
}
#destaque2 p {
    color: #ffffff;
    padding: 10px;
    font-size: 20px;
    width: 500px;
    text-align: left;
}

#destaque2 h2 {
    color: #ffffff;
    padding: 15px;
    
}

#destaque2 h1 {
    font-size:30px;
    width: 500px;
    color: #ffffff;
}
#destaque2 lo {
    display: flex;
    flex-direction: row;
    
}

#destaque2 .botao {
    text-decoration: none;
    background-color: #2384c6;
    color: #ffffff;
    padding:10px;
    border: 15px;
}






#propaganda {
      background-image: url('../img/fundo%20hq.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px;
    
    
}

#propaganda img {
    max-width: 100%;
   
}

#propaganda lo {
    display: flex;
    flex-direction: row;
    align-items: center;
}

#propaganda div {
    display: flex;
    flex-direction: column;
    padding: 10px 15px 5px 10px
}

#propaganda h1 {
    font-size: 50px;
}


#propaganda h2 {
    font-size: 20px;
    width: 500px;
    padding: 15px;
}


#propaganda .botao {
    text-decoration: none;
    background-color: #000000;
    color: #ffffff;
    padding:15px;
    border: 15px;
    width: 80px;
}















#divisao {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #ffffff;
}

#conteudo {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
    background: #c1cdc5;
    padding: 10px;
}
#conteudo img {
    display: flex;
    max-width: 100%;
    padding: 10px
    
}







#topo {
    display: flex;
    flex-direction:row;
    background:#000;
    align-items: center;
    text-align: center;
    color: #ffffff;
    justify-content: center;
}

#topo lo {
    display: flex;
    flex-direction: column;
    padding: 10px;
}
#topo img{
    max-width: 100%;
}

#topo div {
    max-width: 500px;
    align-items: center;
    justify-content: center;
}
topo p {
    width: 400px;
    text-align: left
}

#divisao2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #ffffff;
}

#conteudo2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
    background: #000;
    padding: 10px;
}
#conteudo2 img {
    display: flex;
    max-width: 100%;
    padding: 10px
    
}

#conteudo2 p {
    color: #ffff;
    text-align-last: left;
    padding-left: 10px;
}
















#contato {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: #ffff;
    text-align: center;

}
#contato h2 {
    padding: 15px;
    color: #000000;
}

#contato p {
    padding: 15px;
    color: #ffffff;
    font-size: 80px;
}
#contato lo {
    flex-direction: row;
}
#contato iframe {
    padding: 35px;
}

#mapa {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #2384c6;
    
}

#mapa iframe {
    padding: 30px;
    max-width: 100%;
}

#mapa lo {
    display: flex;
    flex-direction: row;
}

#mapa h1 {
    color: #fff;
}



#redes {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 15px;
    background: #000000;
}

#redes lo {
    flex-direction: row;
}

#rodape p {
    color: #ffffff;
}

#rodape {
    color:#ffffff;
    background: #000000;
}



@media screen and (max-width: 1000px) {
/*
PAREIROS
*/
    #banner img {
        display: flex;
        flex-direction: column;
        max-width: 100%;
    }

    #templo {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
    #templo div {
        max-width: 100%;
    }
    
    #destaque lo {
       flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
     #promocao div {
        max-width: 100%;
    }
    
    
     #promocao lo {
       flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
     #destaque div {
        max-width: 100%;
    }
    
    #destaque p {
        width: 390px;
    }
    
    
     #videos lo {
       flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
     #videos div {
        max-width: 100%;
    }
    
  
     #contato lo {
       flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
     #contato div {
        max-width: 100%;
    }
    
    #contato iframe {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        max-width: 80%;
    }
    
    #mapa {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    
}
    #mapa iframe {
        max-width: 350px;
    }

    
    
    
    #sub lo {
        display: flex;
        flex-direction: column;
    }
    
    
    #criare {
    display: flex;
    flex-direction:column;
    background:#c1cdc5;
    align-items: center;
    text-align: center;
    color: #ffffff;
    justify-content: center;
}
    
    #propaganda lo {
        display: flex;
        flex-direction: column;
        text-align: center;
        justify-content: center;
        text-align: center;
    }
    
    #propaganda  h2{
        width: 390px;
    }
    
    
    
     #mapa lo {
        display: flex;
        flex-direction: column;
        text-align: center;
        justify-content: center;
        text-align: center;
    }
    #mapa h1{
        text-align: center;
    }
    
    #mapa iframe {
        max-width: 100%;
    }
    
    #propaganda  h2{
        width: 390px;
    }
    
    #propaganda {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
     #propaganda div {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
     #propaganda lo{
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    #propaganda img{
        max-width: 80%;
    }
    
    #propaganda iframe{
        max-width: 80%;
    }