html{
    --cor-azul: #32a9bd;
    --cor-amarelo: #fcd663;
    --cor-azul-escuro: #253556;
}


body {
    background: #FFF;
    color: var(--cor-azul-escuro);
}
header{
    background: var(--cor-azul);
}

header a.logo img{
    max-width: 70px;
}

main#index{
    min-height: 90vh;
    padding: 50px 0;
}

main#index .card{
    background: var(--cor-amarelo) !important;
}

main#index .card a, main#index .card a:visited{
   color: var(--cor-azul);
   font-size: 25px;
}

form#perguntas .btn{
    background: var(--cor-azul);
    border-color: #FFF;
}

form#perguntas .progress{
    height: 5px !important;
}
form#perguntas .progress .bg-success{
    background-color: var(--cor-amarelo) !important;
}

.card-header{
    background:var(--cor-amarelo) !important;
}

input:checked{
  background-color: red;
}



@media(max-width:480px){

 form#perguntas h2{
    font-size: 21px;
    font-weight: bold;
    letter-spacing: -1px;
}

header a.logo img{
    max-width: 50px;
}


}

.lds-ripple {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ripple div {
  position: absolute;
  border: 4px solid #fcd663;
  opacity: 1;
  border-radius: 50%;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) {
  animation-delay: -0.5s;
}
@keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
}
100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
}
}