/*==============================================================================

 * Template Name: Step - One Page Creative Portfolio Template.
 * Template URI: 
 * Author: ixTheme
 * Description: Responsive HTML5 Template
 * Version: 1.0
 * Copyright 2017 ixTheme


==============================================================================
    
    [Table of contents]
    ===================
	
    01. Color 1 APPLE GREEN
    02. Color 2 DODGER BLUE
    03. Color 3 SOFTYELLOW
    04. Color 4 PURPLE HEART
    05. Color 5 CORAL RED
    06. defoult colors

==============================================================================*/
/* ---------------------
------------ 01. Color 1 APPLE GREEN ---------------- */

.bgcolor1,
.cng_bgcolor1 .step_btn,
.cng_bgcolor1 .section_title p::after,
.cng_bgcolor1 .section_title p::before,
.cng_bgcolor1 .skillBar,
.cng_bgcolor1 .expreince_wrapper .exp_icon,
.cng_bgcolor1 .portfolio_item:hover::before,
.cng_bgcolor1 .service_item .service_item_inner:hover::after,
.cng_bgcolor1 .service_item .service_item_inner:hover::before,
.cng_bgcolor1 .service_item_inner i,
.cng_bgcolor1 .owl-dots .owl-dot.active span,
.cng_bgcolor1 .owl-dots .owl-dot:hover span {
    background-color: #48c24e;
}

.cng_bgcolor1 .mixitup-control-active,
.cng_bgcolor1 .blog_links a:hover,
.cng_bgcolor1 .address i,
.cng_bgcolor1 .theme_panel i {
    color: #48c24e !important;
}

.cng_bgcolor1 .skillText,
.cng_bgcolor1 .section_title p,
.cng_bgcolor1 .form-control:focus,
.cng_bgcolor1 .form-control:hover,
.cng_bgcolor1 .theme_panel,
.cng_bgcolor1 .theme_panel i {
    border-color: #48c24e;
}


/* ---------------------
------------ 02. Color 2 DODGER BLUE ---------------- */

.bgcolor2,
.cng_bgcolor2 .step_btn,
.cng_bgcolor2 .section_title p::after,
.cng_bgcolor2 .section_title p::before,
.cng_bgcolor2 .skillBar,
.cng_bgcolor2 .expreince_wrapper .exp_icon,
.cng_bgcolor2 .portfolio_item:hover::before,
.cng_bgcolor2 .service_item .service_item_inner:hover::after,
.cng_bgcolor2 .service_item .service_item_inner:hover::before,
.cng_bgcolor2 .service_item_inner i,
.cng_bgcolor2 .owl-dots .owl-dot.active span,
.cng_bgcolor2 .owl-dots .owl-dot:hover span {
    background-color: #198fed;
}

.cng_bgcolor2 .mixitup-control-active,
.cng_bgcolor2 .blog_links a:hover,
.cng_bgcolor2 .address i,
.cng_bgcolor2 .theme_panel i {
    color: #198fed !important;
}

.cng_bgcolor2 .skillText,
.cng_bgcolor2 .section_title p,
.cng_bgcolor2 .form-control:focus,
.cng_bgcolor2 .form-control:hover,
.cng_bgcolor2 .theme_panel,
.cng_bgcolor2 .theme_panel i {
    border-color: #198fed;
}


/* ---------------------
------------ 03. Color 3 SOFTYELLOW ---------------- */

.bgcolor3,
.cng_bgcolor3 .step_btn,
.cng_bgcolor3 .section_title p::after,
.cng_bgcolor3 .section_title p::before,
.cng_bgcolor3 .skillBar,
.cng_bgcolor3 .expreince_wrapper .exp_icon,
.cng_bgcolor3 .portfolio_item:hover::before,
.cng_bgcolor3 .service_item .service_item_inner:hover::after,
.cng_bgcolor3 .service_item .service_item_inner:hover::before,
.cng_bgcolor3 .service_item_inner i,
.cng_bgcolor3 .owl-dots .owl-dot.active span,
.cng_bgcolor3 .owl-dots .owl-dot:hover span {
    background-color: #e2b056;
}

.cng_bgcolor3 .mixitup-control-active,
.cng_bgcolor3 .blog_links a:hover,
.cng_bgcolor3 .address i,
.cng_bgcolor3 .theme_panel i {
    color: #e2b056 !important;
}

.cng_bgcolor3 .skillText,
.cng_bgcolor3 .section_title p,
.cng_bgcolor3 .form-control:focus,
.cng_bgcolor3 .form-control:hover,
.cng_bgcolor3 .theme_panel,
.cng_bgcolor3 .theme_panel i {
    border-color: #e2b056;
}


/* ---------------------
------------ 04. Color 4 PURPLE HEART ---------------- */

.bgcolor4,
.cng_bgcolor4 .step_btn,
.cng_bgcolor4 .section_title p::after,
.cng_bgcolor4 .section_title p::before,
.cng_bgcolor4 .skillBar,
.cng_bgcolor4 .expreince_wrapper .exp_icon,
.cng_bgcolor4 .portfolio_item:hover::before,
.cng_bgcolor4 .service_item .service_item_inner:hover::after,
.cng_bgcolor4 .service_item .service_item_inner:hover::before,
.cng_bgcolor4 .service_item_inner i,
.cng_bgcolor4 .owl-dots .owl-dot.active span,
.cng_bgcolor4 .owl-dots .owl-dot:hover span {
    background-color: #602cbe;
}

.cng_bgcolor4 .mixitup-control-active,
.cng_bgcolor4 .blog_links a:hover,
.cng_bgcolor4 .address i,
.cng_bgcolor4 .theme_panel i {
    color: #602cbe !important;
}

.cng_bgcolor4 .skillText,
.cng_bgcolor4 .section_title p,
.cng_bgcolor4 .form-control:focus,
.cng_bgcolor4 .form-control:hover,
.cng_bgcolor4 .theme_panel,
.cng_bgcolor4 .theme_panel i {
    border-color: #602cbe;
}


/* ---------------------
------------ 05. Color 5 CORAL RED ---------------- */

.bgcolor5,
.cng_bgcolor5 .step_btn,
.cng_bgcolor5 .section_title p::after,
.cng_bgcolor5 .section_title p::before,
.cng_bgcolor5 .skillBar,
.cng_bgcolor5 .expreince_wrapper .exp_icon,
.cng_bgcolor5 .portfolio_item:hover::before,
.cng_bgcolor5 .service_item .service_item_inner:hover::after,
.cng_bgcolor5 .service_item .service_item_inner:hover::before,
.cng_bgcolor5 .service_item_inner i,
.cng_bgcolor5 .owl-dots .owl-dot.active span,
.cng_bgcolor5 .owl-dots .owl-dot:hover span {
    background-color: #ff4242;
}

.cng_bgcolor5 .mixitup-control-active,
.cng_bgcolor5 .blog_links a:hover,
.cng_bgcolor5 .address i,
.cng_bgcolor5 .theme_panel i {
    color: #ff4242 !important;
}

.cng_bgcolor5 .skillText,
.cng_bgcolor5 .section_title p,
.cng_bgcolor5 .form-control:focus,
.cng_bgcolor5 .form-control:hover,
.cng_bgcolor5 .theme_panel,
.cng_bgcolor5 .theme_panel i {
    border-color: #ff4242;
}


/* ---------------------
------------ 06. defoult colors ---------------- */

.step_btn,
.section_title p::after,
.section_title p::before,
.skillBar,
.expreince_wrapper .exp_icon,
.portfolio_item:hover::before,
.service_item .service_item_inner:hover::after,
.service_item .service_item_inner:hover::before,
.service_item_inner i,
.owl-dots .owl-dot.active span,
.owl-dots .owl-dot:hover span {
    background-color: #48c24e;
}

.mixitup-control-active,
.blog_links a:hover,
.address i {
    color: #48c24e !important;
}

.skillText,
.section_title p,
.form-control:focus,
.form-control:hover {
    border-color: #48c24e;
}