:root{

    --cinza250: rgb(250,250,250);
    --cinza245: rgb(245,245,245);
    --cinza240: rgb(240,240,240);
    --cinza220: rgb(220,220,220);  
    --cinza200: rgb(200,200,200);        
    --cinza160: rgb(160,160,160);    
    --cinza128: rgb(128,128,128);
    --cinza100: rgb(100,100,100);

    --brancotransparente: rgba(255,255,255,0.7);
    --pretotransparente: rgb(0,0,0,0.7);

    --corbase: rgb(230, 60, 130);
    --corbasec: rgb(240, 80, 150);

    --azul: rgb(0,120,200);
    --azulc: rgb(0, 140, 220);

    --ciano: rgb(0,160,230);
    --cianoc: rgb(0,180,230);
    --cianocc: rgb(245, 245, 255);

    --dourado: rgb(195,160,45);
    --douradoc: rgb(235,190,55);    
    --douradocc: rgb(250, 250, 245);
    --douradoe: rgb(140, 120, 40);

    --verde: rgb(100,180,80);
    --verdec: rgb(140,190,110);
    --verdecc: rgb(240, 255, 240);

    --vermelho: rgb(220,0,0);
    --vermelhoc: rgb(230,20,20);
    --vermelhoe: rgb(180,0,0);
    --vermelhocc:rgb(255, 245, 245);

    --laranja: rgb(210, 140, 50);
    --laranjac: rgb(230,160,60);

    --rosa: rgb(240,130,180);
    --rosac: rgb(245, 145, 190);

    --roxo: rgb(150,150,255);
    --roxoc: rgb(170,170,255);

    --radiuspadrao: 5px;

    --corborda: var(--cinza220);
    --bordapadrao: 1px solid var(--cinza220);

    --shadowpadrao: 0 0 15px rgba(128,128,128,0.2);
    --shadowpadraocima: 0 -15px 15px rgba(128,128,128,0.1);
    --shadowpadraobaixo: 0 15px 15px rgba(128,128,128,0.1); 
    --shadowinsetbaixo: inset 0 -15px 15px rgba(128,128,128,0.1);
    --shadowinsetcima: inset 0 15px 15px rgba(128,128,128,0.1);
}

@font-face {
    font-family: "Quicksand";    
    src: url("../fonts/quicksand.woff2") format("woff2"), url("../fonts/quicksand.ttf") format("truetype");
    font-weight: 300 700;
    font-style: normal;
    font-optical-sizing: auto;
}

*, *::before, *::after{
    margin: 0;
    padding: 0;
    box-sizing: border-box;    
    scroll-behavior: smooth;
    font-family: "Quicksand", sans-serif;
    font-weight: 500;
    color: var(--cinza128);
    font-size: 1rem;
    line-height: 1.3; 
    -webkit-tap-highlight-color: transparent;
}

:focus-visible{
  outline: 1px solid var(--azul);
  outline-offset: 2px;
}