﻿:root {
    --red_color: #ff4237;
    --dark-red: #af0011;
    --button_color: linear-gradient(90deg, #FF4237 4.17%, #505050 100%);
    --xlight_red: #fff1f1;
    --Ceramic: #ddd;
    --black: #000;
    --white: #fff;
}



.topHeader, #pricingCategory .row .card, .widget-area .widget_categories ul li::before, .widget-area .widget .widget-title:before, .navbar-toggler .icon-bar {
    background: var(--red_color) !important;
}

#navbar .navbar-nav li a.active, #navbar .navbar-nav li a:hover {
    background: var(--red_color);
    color: white !important;
}

.single-footer-widget .footer-social i {
    background-color: var(--dark-red) !important;
}

.single-footer-widget .footer-social i:hover {
    background-color: #ddd!important;
    color: var(--black);
}

.single-services-two::before {
    background: var(--Ceramic) !important;
}

.serviceRequestForm {
    border: none;
}
.default-btn {
    transition: 0.5s;
    border: none;
}
.default-btn, .section-title .bar, .process-content h3 span, .owl-carousel button.owl-dot.active,
.about-tab .bar, .clients-slider .clients-item .icon i, .serviceRequestForm h4 {
    background: var(--button_color) !important;
}

.default-btn:hover {
    box-shadow: 0px 0.2px 12px var(--red_color);
    transform: translateY(-0.2em);
    color: var(--white)!important;
}

.single-protfolio:hover, .clients-slider .clients-item .clients-content::before {
    background-color: var(--red_color) !important;
}

.protfolio-section.bg-color {
    background-color: var(--xlight_red);
}

.single-services-two, .comment-input:focus, .login-form form .form-control:focus {
    border-color: var(--red_color) !important;
}

.single-services-two h2 a:hover, .single-blog .content span, .single-blog:hover .read-more,.copyright.light a, 
.single-blog:hover h3 a, .team-section .team-item .content span, .navbar-area .navbar .navbar-nav .nav-item:hover a {
    color: var(--red_color);
}

h3 a:hover, a:hover, .copyright .copyright-area-content p a:hover,
.widget-area .widget-posts-thumb .item .info .title a:hover, .widget-area .widget_categories ul li a:hover {
    color: var(--dark-red) !important;
}

.process-content, .single-pricing, .register-fm {
    box-shadow: 0 5px 40px 0 rgba(0, 0, 0, 0.11);
    background-color: var(--white);
}

.pricing-section {
    background-color: var(--white);
}

#pricingCategory .row .card {
    color: var(--white);
}
#pricingCategory .row .active {
    color: black;
    background: #ddd!important;
}

.widget-area .widget-posts-thumb .item .info .title a {
    color: var(--black);
}


