.dark {
    background-color: #363636;
    transition: 200ms;
}

.dark a {
    color: var(--black-100);
    transition: 200ms;
}

.dark .darkMode {
    border: solid 1px var(--black-100);
    color: var(--black-100);
}

.dark .bio {
    color: var(--black-100);
    transition: 200ms;
}

.dark .skills h2, .dark .hobbies h2,.dark .experience h2{
    color: var(--black-100);
}

.dark .skills .box, .dark .hobbies .box {
    background-color: var(--black-500);
}

.dark .skills .box i, .dark .hobbies .box i{
    color: var(--blue-300);
}

.dark .skills .box p, .dark .hobbies .box p,.dark .experience-box__content {
    color: var(--black-100);
}

.dark .hobbies .box svg {
    fill: var(--blue-300);
}

.dark .formation .box div {
    background-color: #F2F8FF;
}

.dark .repositorio {
    background: transparent;
    border: 1px solid var(--blue-300);
    color: var(--blue-300);
}

.dark .demo {
    background: var(--blue-300);
    color: var(--black-500);
}

.dark .experience-guide {
    color: var(--blue-100);
}

.dark .experience-guide .ativo {
    border-color: var(--blue-100);
}

.dark .experience-guide .ativo:hover {
    border-color: var(--blue-500);
}

.dark .experience-guide i:hover, .experience-guide span:hover {
    color: var(--blue-500);
    border-color: var(--blue-500);
}

.dark #block {
    color: var(--black-500);
}

.dark footer {
    color: var(--blue-100);
}

.dark footer a{
    color: var(--blue-500);
}

.dark footer a:hover{
    color: var(--blue-100);
}

.dark footer a:active{
    scale: .8px;
}