/* Variable */
:root {
  --red: #0779e4;
}

.home .intro .img-div:hover{
  border-color: var(--red);
}

.aside .logo a::before {
  border-top: 4px solid var(--red);
  border-left: 4px solid var(--red);
}
.aside .logo a::after {
  border-right: 4px solid var(--red);
  border-bottom: 4px solid var(--red);
}

.aside .nav li a:hover,
.aside .nav li a.active,
body.dark .aside .nav li a:hover,
body.dark .aside .nav li a.active,
.about .about-content .about-text h3,
.about .about-content .skills h3,
.contact-text p,
.contact .contact-info-item .icon .fa,
.timeline-text span {
  color: var(--red);
}

.btn,
.about .about-content .skills .skill-item .progress .progress-in,
.about .about-content .timeline .timeline-item::before,
.about .about-content .timeline .circle-dot,
.aside .nav-toggler span,
.aside .nav-toggler span::before,
.aside .nav-toggler span::after,
.section-title h2::before,
.section-title h2::after,
.home .intro .social-links a {
  background-color: var(--red);
}

/* form */
#form .input_group input:focus,
#form .input_group select:focus {
  border: 2px solid var(--red);
}

#form .submit_form:hover{
  color: #fff;
  background-color: var(--red);
}