:root{   
    --branco: #ffffff;
    --branco-efeito: #e2e2e2;
    --background-grad: linear-gradient(90deg, rgba(17,17,17,1) 0%, rgba(34,34,34,1) 32%, rgba(51,51,51,1) 100%);
    --vermelho-rosado: #D32F2F;
    --verde: #388E3C;
    --laranja-escuro: darkorange;
    --preto-primario: #111;
    --preto-secundario: #222;
    --amarelo: #FFC107;

    --font-roboto:'Roboto Slab';
    --font-montserrat:'montserrat';
}

body{
    background: var(--background-grad)
}

    /*Container Principal*/


.container__titulo{
    font-family: var(--font-roboto);
    font-style: italic;
    font-size: 75px;
    background-color: var(--amarelo);
    font-weight: weight;
    padding: 0.5em;
    height: 2.2em;
    border-bottom-right-radius:25px ;
}

.container__bella{
    color: var(--vermelho-rosado);
}

.container__italia{
    color: var(--verde);
}

.container__navegacao{
    color: var(--branco);
    font-family: var(--font-montserrat);
    display: inline-flex;
    background-color: var(--preto-secundario);
    height: 3em;
    border-bottom-left-radius:25px ;
}

.link{
    color: var(--laranja-escuro);
}

.container__link{
    margin: 0 1em;
    font-size: 20px;
    padding: 10px;
}

.container__link:hover{
    cursor: pointer;
}

.container__link:active{
    margin-top: 2px;
    color: var(--branco-efeito);
}

.container__pesquisa{
    margin-top: 1em;
    background-color: transparent;
    border: var(--branco) 3px solid;
    border-radius: 5px;
    width: 100%;
    padding: 0.2em;
}


.container__pesquisa:hover{
    background-color: var(--branco);
}

.container__pesquisa:active{
    background-color: var(--branco-efeito);
}
    /*navegação*/

.navegacao{
    display: flex;
    justify-content: space-around;
    background-color: var(--vermelho-rosado);
}

.navegacao__opcao{color: var(--branco);
font-size: 18px;
font-family: var(--font-montserrat);
font-weight: 600;
padding: 5px 0;
}

    /*Meio*/




    


article{display: flex;
margin: 50px 0 0 0;
} 

ol{background-color: var(--preto-secundario);
    border: solid var(--branco) 2px;
width: 200px;
margin: auto;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
box-shadow: 1px 1px 3px;}
 


ol li{text-align: center;
    margin: auto;
font-size: 18px;
color: var(--branco);
margin: 20px 0;
font-family: 'montserrat';
font-weight:500;
}

li p{color: var(--laranja-escuro);
    border: solid var(--laranja-escuro) 2px;
    width: 125px;
    padding: 5px;
    margin: auto;
    transition: 0.2s transform;}

li p:hover{transform: scale(1.05);
    cursor: pointer;}






.pizza{width: 200px;}







/*rodapé*/

footer{background-color: var(--preto-primario);
padding: 25px 0;
margin-top: 35px;}

footer h2{  font-family: "Roboto Slab", serif;
font-size: 50px;
color: var(--branco);
text-align: center;
font-style: italic;
font-weight: bold;}

footer h3{  font-family: "montserrat", serif;
font-size: 15px;
color: var(--branco);
text-align: center;}