/* ###########################################################################
#
#  LOGOS DO PEDIDOPOP
#
#  Este arquivo existe para facilitar a edição das logos uma por uma.
#
#  Arquivos das imagens:
#
#  • Logo do cabeçalho:
#    /assets/img/logos/logo-header.png
#
#  • Logo principal da Home:
#    /assets/img/logos/logo-home.png
#
#  • Logo dentro da demonstração:
#    /assets/img/logos/logo-demo.png
#
#  • Logo do rodapé, se for usada futuramente:
#    /assets/img/logos/logo-footer.png
#
############################################################################ */


/* ###########################################################################
#  LOGO DO CABEÇALHO
############################################################################ */

.pp-public-logo{
    width:auto;
    height:82px;
    object-fit:contain;
}


/* ###########################################################################
#  ÁREA DA LOGO PRINCIPAL DA HOME
############################################################################ */

.pp-home-logo-area{
    max-width:1180px;
    margin:0 auto;
    padding:34px 18px 0;

    display:flex;
    justify-content:center;
    align-items:center;
}


/* ###########################################################################
#  LOGO PRINCIPAL DA HOME
#
#  Ajuste apenas o width para aumentar ou diminuir.
############################################################################ */

.pp-home-logo-mark{
    display:block;
    width:860px;
    max-width:82vw;
    height:auto;
    margin:0 auto;
    object-fit:contain;
}


/* ###########################################################################
#  LOGO DENTRO DA DEMONSTRAÇÃO
############################################################################ */

.pp-demo-avatar img{
    width:86%;
    height:auto;
    object-fit:contain;
}


/* ###########################################################################
#  MOBILE
############################################################################ */

@media(max-width:780px){

    .pp-public-logo{
        height:38px;
        max-width:210px;
    }

    .pp-home-logo-area{
        padding:24px 16px 0;
    }

    .pp-home-logo-mark{
        width:410px;
        max-width:80vw;
    }

}


/* ###########################################################################
#  CELULARES MUITO PEQUENOS
############################################################################ */

@media(max-width:360px){

    .pp-public-logo{
        height:34px;
    }

    .pp-home-logo-mark{
        width:185px;
    }

}