//* CSS */

@font-face {
    font-family: NeoSansPro;
    src: url("../fonts/NeoSansProBold.OTF");
    font-weight: bold;
}

@font-face {
    font-family: NeoSansPro;
    src: url("../fonts/NeoSansProRegular.OTF");
    font-weight: normal;
}

* {
    box-sizing: border-box;
    font-family: NeoSansPro, "Lucida Sans", sans-serif;
}

html, body {
    height: 100%;
    color: white;
}

a {
    text-decoration: none;
}

p {
    margin  : 0px;
    padding : 0px;
}

span {
    margin  : 0px;
    padding : 0px;
}

div {
/*    display: inline-block;   */
}

body {
    width: 100%;
    height: 100%;
}

div.master {
    display: inline-block;
    width: 100%;
    height: 100%;
}

/* --------------------------------------------------------------------------------------------------- */
/* ECRÃS DE TELEMOVEL */
@media only screen and (max-width: 600px){

    /*  PARTE SUPERIOR DA PAGINA ------------------------------------------------------------------*/
    div.header-mobile {
        display: grid;
        grid-template-columns: 15% auto 15%;
        align-items: top;
        justify-items: center;
        width: 100%;
        height: 10%;
        padding-top: 15px;
    }

    div.header-menu {
        text-align: left;
        height: 100%;
    }

    div.header-logo {
        text-align: center;
    }

    img.logo {
        height: 60px;
    }

    div.header-language {
        padding-top: 18px;
    }


    /*  PARTE CENTRAL DA PAGINA ------------------------------------------------------------------*/
    div.body-mobile {
        display: grid;
        grid-template-columns: 100%;
        align-items: center;
        justify-items: center;
        width: 100%;
        height: 100%;
        vertical-align: top;
    }

    div.body-mobile-items {
        width: auto;
        text-align: center;
    }

/*    div.capsule-column {
        display: inline-block;
        vertical-align: top;
        width: 32%;
        height: 100%;
        padding: 220px 5px 10px 5px;
        border: solid 1px green;
    }
*/

    /*  PARTE INFERIOR DA PAGINA ------------------------------------------------------------------*/
    div.footer {
        display: block;
        text-align: center;
        font-size: x-small;
        color: #7D7D7D;
        width: 100%;
        height: 10%;
    }

}
/* FIM formatacao MOBILE  ------------------------------------------------------------------*/


/* ECRÃS NÃO TELEMÓVEL  ---------------------------------------------------------------------------*/
@media only screen and (min-width: 601px){

    /*  PARTE SUPERIOR DA PAGINA ------------------------------------------------------------------*/
    div.header {
        display: inline-block;
        padding-top: 0.8vw;
        padding-right: 5.5vw;
        width: 100%;
        height: 5%;
        text-align: right;
    }



    /*  PARTE CENTRAL DA PAGINA ------------------------------------------------------------------*/
    div.body {
        display: block;
        height: 95%;
    }

    div.body-grid {
        display: grid;
        grid-template-columns: 50% auto;
        align-items: center;
        justify-items: end;
        width : 100%;
        height: 100%;
        vertical-align: top;
    }

    div.logo-menu {
        width: 100%;
        padding-left: 1.5vw;
    }

    div.logo-menu-left {
        display: inline-block;
        width : 30%;
        text-align: right;
        vertical-align: middle;
    }

    div.logo-menu-right {
        display: inline-block;
        width: auto;
        height: 100%;
        vertical-align: middle;
        padding-left: 0.8vw;
        font-size: 1.0vw;
        line-height: 2.2vw;
        border-left: solid 1px white;
    }

    img.logo {
        width: 10vw;
/*        border-right: solid 1px white;        */
        padding-right: 12px;
    }

    div.body-capsules {
        width: 100%;
        text-align: right;
        padding-right: 4vw;
    }


    /*  PARTE INFERIOR DA PAGINA ------------------------------------------------------------------*/
    div.footer {
        display: block;
        text-align: center;
        font-size: x-small;
        color: #7D7D7D;
        width: 100%;
        height: 10%;
    }

    /* ECRÃS PEQUENOS-MÉDIO */
    @media only screen and (min-width: 601px) and (max-width: 710px){


    }
    /* FIM formatacao PEQUENO-MÉDIO  --------------------------------------------------------------------- */


    /* ECRÃS MÉDIOS */
    @media only screen and (min-width: 711px) and (max-width: 999px){


    }
    /* FIM formatacao MÉDIOS  ---------------------------------------------------------------------------- */


    /* ECRÃS MÉDIOS-GRANDE */
    @media only screen and (min-width: 1000px) and (max-width: 1300px){


    }
    /* FIM formatacao MÉDIOS-GRANDE  --------------------------------------------------------------------- */


    /* ECRÃS GRANDES */
    @media only screen and (min-width: 1301px){


    }
    /* FIM formatacao GRANDES  -------------------------------------------------------------------------- */

}