/* =================================================================== */
/* Deep Orange #ff5722
====================================================================== */
.main-btn,
.main-btn:hover,
.main-btn:focus,
.item-title-hover,
.item-title-hover .item-category,
.contact-section .box > span,
.contact-section .box a > span,
.post-date,
.resume-item h6,
.chart-bar>.percent,
.about-section .arrow,
.chart-bar>.item-progress,
.social li a:hover,
body.dark .social li a:hover,
.badges span,
.heading h2:after,
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span,
#navigation.is-fixed ul li a:before,
.work-section .action--close>span:hover .navigation-close-line{
    background-color: #ff5722;
}

.btn.main-btn,
.btn.main-btn:focus,
.btn.main-btn:hover,
.btn.second-btn,
.contact-section input[type=text]:focus,
.contact-section input[type=email]:focus,
.contact-section textarea:focus,
body.dark .contact-section input[type=text]:focus,
body.dark .contact-section input[type=email]:focus,
body.dark .contact-section textarea:focus{
    border: 1px solid #ff5722;
}
#navigation.is-fixed ul li a.active,
#navigation.is-fixed ul li a:hover,
.home-section .home-contact a,
.home-section .hero-section h2 span,
body.dark .home-section .hero-section h2 span,
.btn.second-btn span,
.about-section .resume-header p,
.heading h2 span,
.about-section .resume-header p.active,
.about-section .resume-header p:hover,
.meta > span span,
.home-section .home-social .social li a:hover,
body.image .home-section .home-social .social li a:hover,
body.video .home-section .home-social .social li a:hover{
    color: #ff5722;
}

.right-dotted-shape,
.badges:after{
    background: radial-gradient(circle at center, #ff5722 10%, transparent 20%), transparent;
    background-size: 19px 18px;
}
.home-section .circles li {
    background: rgba(255, 87, 34, 0.2);
}