/*
Theme Name: Bizwheel
Theme URI: https://picmaticweb.com/wp/bizwheel/
Author: Picmaticweb
Author URI: https://themeforest.net/user/picmaticweb/portfolio
Description: Bizwheel is a modern and trendy business WordPress Theme we made for developing the business, consulting, digital agency, company, studio, startup, portfolio, blog, and multipurpose creative websites. So, grab your copy and start developing your dream website.
Version: 2.1.0
Requires at least: 5.0
Tested up to: 6.3
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: bizwheel
*/

/*---------------------------------------------------- */
/*------------------- CSS Variable --------------------*/
:root {
    /*Color Variables*/
    --primary-color: var(--primary_color_opt, #179e66) !important; /*Theme Brand Color*/
    --color-yellow: var(--primary_color2_opt, #F3A908) !important; /*Theme Brand Color 2*/
    --secondary-color: var(--secondary_color_opt, #0a0a0a) !important;
    --body-color: var(--body_color_opt, #333333) !important; /*Theme Paragraph Color*/

    /*font Variables*/
    --poppins: "Poppins", sans-serif;
}

/***============ Admin Bar ================**/
.admin-bar header, .admin-bar header.navbar_fixed > .middle-header {
    margin-top: 32px;
}
@media (max-width: 782px) {
    .admin-bar header.navbar_fixed .middle-header {
        margin-top: 0;
    }
    .admin-bar header .middle-header {
        margin-top: 46px;
    }
}

/***/
.contact-form-area .button .wpcf7-spinner {
    display: none;
}

/*============== Logo ===============*/
header .img-logo img {
    max-width: inherit;
    width: 180px;
}

header.navbar_fixed .img-logo img + img {
    display: block;
}

header.navbar_fixed .img-logo img,
header .img-logo img + img {
    display: none;
}


/*============= Header =======================*/
.error404 header .middle-header {
    background-color: rgb(255,255,255);
    -webkit-box-shadow: 0 3px 12px 0 rgb(0 0 0 / 10%);
    -moz-box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 3px 12px 0 rgb(0 0 0 / 10%);
    position: relative;
}

.error404 header.navbar_fixed .middle-header {
    position: fixed;
}

.error404 .header .nav li a {
    color: #2e2751;
}


/*=============== Custom Class ================*/
.home-3 header .middle-header {
    box-shadow: 0 3px 12px 0 rgb(0 0 0 / 10%);
}
.home-3 .header .right-button .bizwheel-btn {
    border-width: 1px;
    box-shadow: none;
}


















/*======================================
	Header CSS
========================================*/
.header {
    position:relative;
    width: 100%;
    z-index: 99;
}
/* Topbar */
.topbar {
    background-color: #2e2751;
    padding: 13px 0;
    overflow: hidden;
}
.top-contact {
    padding-top: 0;
}
.topbar .single-contact {
    display: inline-block;
    margin-right: 25px;
    color: #ccc;
    cursor: pointer;
}
.topbar .single-contact:last-child{
    margin-right:0px;
}
.topbar .single-contact,
.topbar .single-contact a{
    color: #ccc;
    font-weight:normal;
    -webkit-transition:all 0.3s ease;
    -moz-transition:all 0.3s ease;
    transition:all 0.3s ease;
    font-size:14px;
}
.topbar .single-contact i {
    color: #f3a712;
    margin-right: 10px;
    font-size: 18px;
    position: relative;
    top: 2px;
}
.topbar .single-contact:hover,
.topbar .single-contact a:hover{
    color:#fff;
}
/* Top right */
.topbar-right {
    position: relative;
    float: right;
}
.topbar-right .button {
    float: left;
    right: 0;
}
.topbar-right .button .bizwheel-btn {
    height: auto;
    text-transform: initial;
    padding: 8px 15px;
    line-height: initial;
    background: #fff;
    font-size:14px;
    color: #f3a712;
    border: 1px solid transparent;
}
.topbar-right .button .bizwheel-btn:hover{
    background:transparent;
    border-color:#fff;
    color:#fff;
}
/* Social Icons */
.topbar .social-icons {
    float: right;
    margin-right: 115px;
    padding-top: 0;
}
.topbar .social-icons li {
    margin-right: 10px;
}
.social-icons li{
    display: inline-block;
}
.topbar .social-icons li:last-child{
    margin:0;
}
.topbar .social-icons li a {
    color: #ccc;
}
.topbar .social-icons li a:hover{
    color:#F3A712;
}

/* Right Bar */
.right-bar {
    display: inline-block;
    position: absolute;
    right: 0;
    height: 50.5px;
    z-index: 3333;
    top: -13px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.right-bar .right-nav{
    z-index: 333;
    position: relative;
    line-height: initial;
    padding-top: 10px;
}
.right-bar:after {
    content: '';
    position: absolute;
    top: 0;
    left: -21px;
    width: 118px;
    height: 101%;
    transform: skew(-26deg);
    background: #f3a712;
    z-index: -1;
}
.right-bar ul li {
    display: inline-block;
    margin-right: 5px;
}
.right-bar ul li:last-child{
    margin:0;
}
.right-bar .right-nav li a {
    color: #fff;
    text-align: center;
    display: block;
    cursor: pointer;
    border: 1px solid #fff;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    border-radius: 100%;
}
.right-bar .right-nav li a:hover {
    color: #F3A712;
    border-color: transparent;
    background: #fff;
}


/* Middle header */
.header-inner {
    padding: 20px 0;
    background: #333;
}
/*.middle-header {
    background: #fff;
    position: relative;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    transition: all 0.6s ease;
    -webkit-box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.1);
    z-index: 1000;
}*/
/* Logo */
.header .logo {
    z-index: 33;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -moz-box-shadow: inherit;
}
.header .img-logo {
    margin-top: 22px;
}
.header .text-logo{
    margin-top:30px;
}
.header .text-logo a,
.header .img-logo a {
    font-size: 26px;
    font-weight: 600;
    display: block;
    z-index: 9999;
    position: relative;
}
.img-logo img + img,.header.sticky .img-logo img{
    display: none;
}
.header.sticky .img-logo img + img{
    display: inline-block;
}
.header .menu-area {
    position: relative;
}
.header .navbar {
    padding: 0;
}
/* Main Menu */
.header .nav-inner {
    float: right;
    margin-right: 160px;
    text-align: right;
}
.header .nav li {
    margin-right: 30px;
    position: relative;
    float: none;
    display: inline-block;
}
.header .nav li:last-child{
    margin:0;
}
.header .nav li a {
    text-transform: capitalize;
    position: relative;
    display: block;
    padding: 30px 0;
    color: #fff;
    font-weight: 600;
}
.header .nav li.active a,
.header .nav li:hover a{
    color:#179E66;
}
.header .nav li.active a::before,
.header .nav li:hover a::before {
    opacity:1;
    visibility:visible;
    transform: scaleY(1);
    width: 50%;
}
.navbar-expand-lg .navbar-collapse{
    display:block !important;
}
.header .nav li a i {
    margin-left: 6px;
    font-size: 10px;
}
.header .nav li a::before {
    content: "";
    position: absolute;
    width: 0;
    height: 4px;
    background: var(--primary-color);
    bottom: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.header .nav li.icon-active a::after {
    content: "\f107";
    position: relative;
    font-family: 'FontAwesome';
    padding-left: 6px;
}
.header .nav li .sub-menu a::after,
.header .nav li.icon-active .sub-menu li.icon-active .sub-menu a::after,
.header .nav li.icon-active .sub-menu li.icon-active .sub-menu li.icon-active .sub-menu a::after{
    display:none;
}
.header .nav li.icon-active .sub-menu li.icon-active a::after, .header .nav li.icon-active .sub-menu li.icon-active .sub-menu li.icon-active a::after {
    display: inline-block;
    float: right;
    content: "\f105";
    padding: 0;
    margin-right: 8px;
}
/* Dropdown Menu */
.header .nav li .sub-menu {
    background: #fff;
    width: 240px;
    text-align: left;
    position: absolute;
    top: 100%;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    padding: 20px;
    left: -32px;
    margin: 0;
    -webkit-box-shadow: 1px 4px 12px rgba(51, 51, 51, 0.25);
    -moz-box-shadow: 1px 4px 12px rgba(51, 51, 51, 0.25);
    box-shadow: 1px 4px 12px rgba(51, 51, 51, 0.25);
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.header .nav li:hover .sub-menu{
    opacity:1;
    visibility:visible;
}
.header .nav li .sub-menu li {
    float: none;
    margin: 0;
    display: block;
}
.header .nav li .sub-menu li:last-child{
    border:none;
}
.header .nav li .sub-menu li a {
    padding: 6px 15px;
    color: #666;
    display: block;
    font-size: 14px;
    font-weight: normal;
    text-transform: capitalize;
    background: transparent;
}
.header .nav li .sub-menu li a:before{
    display:none;
}
.header .nav li .sub-menu li:last-child a{
    border-bottom:0px;
}
.header .nav li .sub-menu li:hover a{
    color:#179E66;
}
.header .nav li .sub-menu li a:hover{
    border-color:transparent;
}
.header .nav li .sub-menu li i {
    float: right;
    margin-top: 8px;
    font-size:10px;
    z-index:5;
}
.header .nav li .sub-menu li .sub-menu {
    top: 0;
    left: 110%;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;
    padding: 10px;
}
.header .nav li .sub-menu li:hover .sub-menu{
    opacity:1;
    visibility:visible;
}
.header .nav li .sub-menu li .sub-menu li a{
    padding: 8px 15px;
    color: #666;
    display: block;
    font-weight: normal;
    text-transform: capitalize;
    background: transparent;
}
.header .nav li .sub-menu li:hover .sub-menu li a{
    background:transparent;
}
.header .nav li .sub-menu li .sub-menu li a:hover{
    color:#179E66;
}
.header .nav li .sub-menu .sub-menu li:last-child a{
    border-bottom:0px solid;
}
.header .nav li .sub-menu li .sub-menu .sub-menu {
    transform: scaleY(0.2);
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;
    padding: 10px;
}
.header .nav li .sub-menu li .sub-menu li:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: scaleY(1);
}
.header .right-button {
    position: absolute;
    right: 0;
    top: 21px;
}

/* Sidebar Popup */
.sidebar-popup {
    position: fixed;
    width: 350px;
    height: 100%;
    right: 0;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    overflow: auto;
    transform: translateX(100%);
    top: 0;
    border-left: 3px solid #F3A712;
    background: #fff;
    -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.2);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    z-index: 999999;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    padding: 50px 30px;
}
.sidebar-popup.active{
    opacity:1;
    visibility:visible;
    transform:translateX(0%);
    right:0;
}
.sidebar-popup .cross {
    position: absolute;
    right: 5px;
    top: 5px;
}
.sidebar-popup .cross .btn {
    width: 40px;
    height: 40px;
    line-height: 37px;
    padding: 0;
    margin: 0;
    font-size: 16px;
    cursor: pointer;
    color: #fff;
    border-radius: 100%;
    background: #2E2751;
}
.sidebar-popup .cross .btn:hover{
    background:#F3A712;
    color:#fff;
}
.sidebar-popup .logo {
    margin: 0;
    float: none;
    margin-bottom: 10px;
    background: transparent;
    position: relative;
    padding: 0;
    box-shadow: none;
    line-height: initial;
    height: auto;
}
.sidebar-popup .logo a{
    display:inline-block;
}
.sidebar-popup .single-content {
    margin-bottom: 40px;
}
.sidebar-popup .single-content:last-child{
    margin:0;
    border:none;
}
.sidebar-popup .single-content h4 {
    position: relative;
    font-size: 18px;
    text-transform: capitalize;
    color: #2E2751;
    line-height: initial;
    border-bottom: 1px solid #cccccc78;
    padding-bottom: 10px;
    margin-bottom: 10px;
}
.sidebar-popup .single-content h4:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    background: #179E66;
    width: 35px;
    height: 4px;
}
.sidebar-popup .single-content h4 i {
    color: #F3A712;
    margin-right: 10px;
}
.sidebar-popup .single-content .social {
    margin-top: 20px;
}
.sidebar-popup .single-content p {
    font-size: 14px;
}

.sidebar-popup .side-button {
    margin-top: 15px;
}
.sidebar-popup .side-button .bizwheel-btn {
    padding: 10px 20px;
    font-size: 14px;
}
/* Social */
.sidebar-popup .social li{
    display:inline-block;
    margin-right:5px;
}
.sidebar-popup .social li:last-child{
    margin-right:0px;
}
.sidebar-popup .social li a {
    height: 32px;
    width: 32px;
    line-height: 32px;
    text-align: center;
    font-size: 14px;
    color: #666;
    background: transparent;
    border: 1px solid rgba(204, 204, 204, 0.66);
    border-radius: 100%;
    display: block;
}
.sidebar-popup .social li a:hover,
.sidebar-popup .social li.active a{
    background:#179E66;
    border-color:transparent;
    color:#fff;
    border-radius:100%;
}
/* Sidebar Popup */
.address-widget-list i {
    margin-right: 15px;
    border: 1px solid #ccc;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 100%;
    color: #F3A712;
}
.address-widget-list li {
    line-height: 40px;
}
.address-widget-list {
    margin-top: 20px;
}
/* Links */
.sidebar-popup .links li{
    display:block;
    margin-bottom:6px;
    border-bottom:1px solid #eee;
}
.sidebar-popup .links li:last-child{
    border:none;
}
.sidebar-popup .links li a{
    text-transform:capitalize;
    color: #333;
    line-height: 35px;
}
.sidebar-popup .links li a:hover{
    color:#179E66;
}
/* Header Style 2*/
.header.style2 .middle-header {
    position: absolute;
    top: 51px;
    z-index: 9000;
    width: 100%;
    background: transparent;
    border: none;
    box-shadow:none;
}
.header.style2 .middle-inner{
    background:#2E2751;
    z-index:2035;
    padding:10px 20px;
    -webkit-transition:all 0.3s ease;
    -moz-transition:all 0.3s ease;
    transition:all 0.3s ease;
}
.header.style2 .topbar {
    background: #fff;
    padding: 15px 0 35px;
}
.header.style2 .topbar .single-contact, .header.style2 .topbar .single-contact a{
    color:#666;
}
.header.style2 .topbar .social-icons li a{
    color:#2E2751;
}
.header.style2 .topbar .social-icons li:hover a{
    color:#F3A712;
}
.header.style2 .img-logo {
    margin-top: 12px;
}
.header.style2 .text-logo {
    margin-top: 16px;
}
.header.style2 .text-logo a{
    color:#fff;
}
.header.style2 .logo {
    position: relative;
    top: 0;
    height: auto;
    margin: 0;
    background: transparent;
    box-shadow: none;
    line-height: initial;
    padding: 0;
    margin: 0;
}
.header.style2 .nav li a {
    color: #eee;
    padding: 22px 0;
}
.header.style2 .nav li:hover a{
    color:#E7A014;
}
.header.style2 .nav li a::before{
    background:#F3A712;
}
.header.style2 .nav li .sub-menu li a{
    color:#666;
}
.header.style2 .nav li .sub-menu li:hover a{
    background:#E7A013;
    color:#fff;
}
.header.style2 .nav li .sub-menu li .sub-menu li a{
    color:#666;
}
.header.style2 .nav li .sub-menu li .sub-menu li:hover a{
    background:#E7A013;
    color:#fff;
}
.header.style2 .button {
    position: absolute;
    right: 0;
    top: 7px;
}
.header.style2 .bizwheel-btn {
    background: #179E66;
    padding: 12px 20px;
    font-size: 14px;
}
.header.style2 .topbar .social-icons {
    margin: 0;
}
.header.style2 .nav-inner {
    margin-right: 165px;
}
.header.style2 .bizwheel-btn:hover{
    background:#fff;
    color:#179E66;
}
.header.style2 .top-contact,
.header.style2 .social-icons {
    padding: 0;
}

.header .menu_social_icon {
    margin-right: 20px;
}
.header .menu_social_icon li {
    display: inline-block;
    margin-right: 12px;
}
.header .menu_social_icon li a {
    color: #fff;
    font-size: 18px;
    transition: all 0.3s;
    position: relative;
    display: inline-block;
}
.header .menu_social_icon li a:hover {
    transform: translateY(-3px);
}




/* Header Sticky */
.header.sticky .middle-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 300000;
    -webkit-box-shadow: 0px 0px 10px #00000021;
    -moz-box-shadow: 0px 0px 10px #00000021;
    box-shadow: 0px 0px 10px #00000021;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    transition: all 0.6s ease;
    animation: fadeInDown 1s both 0.2s;
    background: #fff;
}
.header.header_absolute.sticky .middle-inner{
    border: 0px;
}
.header.style2.sticky .middle-header {
    background: #2E2751;
}
.header.sticky .nav li a {
    padding: 22px 0;
}
.header.sticky .text-logo {
    margin-top: 22px;
}
.header.sticky .right-bar {
    line-height: 72px;
}

.header.style2.sticky .middle-inner {
    padding: 0;
}
.header.style2.sticky .text-logo {
    margin-top: 15px;
}
.header.sticky .nav.menu_white li a,.header.sticky .menu_social_icon li a{
    color: #2E2751;
}
.header.header_absolute.sticky .slicknav_menu .slicknav_icon-bar{
    background: #2E2751 !important;
}
.header.header_absolute.header_nine.sticky .theme_btn{
    background: #1A64F9;
    color: #fff;
}
.header.one.sticky .right-button{
    top: 12px;
}
@media (min-width: 1340px){
    .custom_container{
        max-width: 1320px;
    }
}

.navbar_fixed .middle-header .middle-inner {
    border: none !important;
}

/*======================================
	End Header CSS
========================================*/














