/*
Style Only Theme Vintage
*/

/* ==========================================================================
   Header Left
========================================================================== */
.cs-header-left-button .cs-item-cart-search,
.cs-header-left-button .cs-menu-mobile {
    padding: 10px 0;
}
.cs-header-left-button .cs-item-cart-search a i,
.cs-header-left-button .cs-menu-mobile a i {
    font-size: 20px;
    color: #666;
}
.header-copyright [class*="widget_"],
.header-copyright [class^="widget_"],
.header-copyright .widget {
    margin-top: 15px;
}
.header-copyright [class*="widget_"]:first-child,
.header-copyright [class^="widget_"]:first-child,
.header-copyright .widget:first-child {
    margin-top: 0;
}
/* Menu arrow align style */
.main-menu-left.main-menu-content  {
    width: 100%;
}
.main-menu-left.right ul li.menu-item-has-children > a:after {
    right: inherit;
    left: 0;
}  
/** Serach ***/
.header-v4 .header-cart-search .widget_searchform_content {
    width: 200px;
    position: absolute;
    top: 30px !important;
    left: 0 !important
}
.widget_searchform_content input[type="text"] {
    width: 100%;
    margin: 0 0 10px;
}
.header-v4 .widget_searchform_content input[type="submit"] {
    font-size: 12px;
    height: 35px;
    padding: 0 10px;
    position: absolute;
    right: 10px;
    line-height: 35px;
}
/* ==========================================================================
   Sticky Header Left
========================================================================== */
.header-v4 {
    z-index: 103;
    position: relative;
}
.csbody[class*="page-template-blog-"] #primary, 
.csbody.single #primary , 
.csbody[class*="single-"] #primary {
    padding-left: 45px;
    padding-right: 45px;
}
/* ==========================================================================
   Flyout Menu
========================================================================== */
.main-menu-left > ul {
    list-style: none;
    margin: 40px 0;
    padding: 0;
    vertical-align: baseline;
    line-height: normal;
}

/* The container */
.main-menu-left > ul {
    display: block;
    position: relative;
}

/* The list elements which contain the links */
.main-menu-left > ul li {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    width: 100%;
}

/* General link styling */
.main-menu-left > ul li a {
    /* Layout */
    display: block;
    position: relative;
    margin: 0;
    text-transform: uppercase;
}
/* Rounded corners for the first link of the menu/submenus */
.main-menu-left > ul li:first-child > a {
}

/* Rounded corners for the last link of the menu/submenus */
.main-menu-left > ul li:last-child > a {
}

/* The hover state of the menu/submenu links */
.main-menu-left > ul li a:hover,
.main-menu-left > ul li:hover > a {
}
/* The same arrow, but with a darker color, to create the shadow effect */
.main-menu-left > ul .sub-menu > a:before {}

/* Changing the color of the arrow on hover */
.main-menu-left > ul li > a:hover:after,
.main-menu-left > ul li:hover > a:after {}

.main-menu-left > ul li > a:hover:before,
.main-menu-left > ul li:hover > a:before {}

/* THE SUBMENUS */
.main-menu-left > ul ul {
    -webkit-transition: opacity 0.3s ease-in;
    -moz-transition: opacity 0.3s ease-in;
    transition: opacity 0.3s ease-in;
}
.main-menu-left > ul ul {
    padding: 0;
}
.main-menu-left > ul ul li a {
    text-transform: capitalize;
    padding: 10px 0;
    font-size: 14px;
}

/* Showing the submenu when the user is hovering the parent link */

.main-menu-left ul ul.sub-menu{
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 1.5s linear;
    -moz-transition: max-height 1.5s linear;
    -o-transition: max-height 1.5s linear;
    -ms-transition: max-height 1.5s linear;
    transition: max-height 1.5s linear;
}
.main-menu-left > ul li:hover ul.sub-menu {
    max-height: 1000px;
}
.main-menu-left ul ul.sub-menu ul.sub-menu {
    max-height: 0;
}
.main-menu-left > ul > li > ul > li > ul {
    padding-left: 15px;
}
.main-menu-left > ul ul.sub-menu li:hover ul.sub-menu {
    max-height: 1000px;
}
#cshero-main-menu-mobile.navbar-collapse,
#cshero-main-menu-mobile .cshero-mobile-menu{
    text-align: center;
}
.header-v4 #cshero-main-menu-mobile.navbar-collapse,
.header-v4 #cshero-main-menu-mobile .cshero-mobile-menu{
    text-align: left;
}

.header-v4.menu-appear-flyout #menu .cshero-dropdown li { position: relative; overflow: hidden;}
    .header-v4.menu-appear-flyout #menu .cshero-dropdown li .sub-menu{ 
        position: absolute; top:0; opacity: 0; visibility: hidden; min-width: 180px; overflow: visible;
        -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 5px rgba(0,0,0,0.2);
        -webkit-transition: margin 100ms, visibility 100ms, opacity 100ms;
        -moz-transition: margin 100ms, visibility 100ms, opacity 100ms;
        -o-transition: margin 100ms, visibility 100ms, opacity 100ms;
    }
    .header-v4.menu-appear-flyout #menu .cshero-dropdown  li:hover,
    .header-v4.menu-appear-flyout #menu .cshero-dropdown  li:focus,
    .header-v4.menu-appear-flyout #menu .cshero-dropdown  li:active{overflow: visible;} /* Fix flyout menu hover overlap*/

    .header-position-left.header-v4.menu-appear-flyout #menu .cshero-dropdown  li .sub-menu,
    .header-position-top.header-v4.menu-appear-flyout #menu .cshero-dropdown  li .sub-menu{ left: 100%; margin-left: 300px;}
    .header-position-right.header-v4.menu-appear-flyout #menu .cshero-dropdown li .sub-menu{ right: 100%; margin-right: 300px;}

    .header-v4.menu-appear-flyout #menu .cshero-dropdown  li:hover > .sub-menu,
    .header-v4.menu-appear-flyout #menu .cshero-dropdown  li:active > .sub-menu{ opacity: 1; visibility: visible; margin-left: 0; margin-right: 0; z-index: 1;}

        /* Level 2 */
        .header-v4.menu-appear-flyout #menu .cshero-dropdown .sub-menu{}
        .header-position-left #menu .multicolumn > li, 
        .header-position-top #menu .multicolumn > li { float: left;,}
        .header-position-right #menu .multicolumn > li { float: right;}
        .menu-appear-flyout #menu .multicolumn.columns2 > li { width: 50%;}
        .menu-appear-flyout #menu .multicolumn.columns3 > li { width: 33.33%;}
        .menu-appear-flyout #menu .multicolumn.columns4 > li { width: 25%;}
        .menu-appear-flyout #menu .multicolumn.columns5 > li { width: 20%; }


        /* Level 2+ */
        .header-v4.menu-appear-flyout #menu .cshero-dropdown .group .sub-menu .sub-menu{ padding-left: 15px;}

        /* Menu Grouped */
        .header-v4.menu-appear-flyout #menu .cshero-dropdown li.group .sub-menu,
        .header-v4.menu-appear-flyout #menu .cshero-dropdown li.group .sub-menu {
            opacity: 1; visibility: visible; margin-left: 0; margin-right: 0;
            position: relative;
            left: auto;
            right: auto;
            padding-left: 0;
        }
    .csbody .header-v4 #cshero-header ul.cshero-dropdown > li > a:before {
        content: ''; 
    }
    @media (min-width: 993px) {
        .csbody .header-v4 #cshero-header ul.cshero-dropdown > li.menu-item-has-children:hover > a:after {
            content: '\f105';
            font-family: FontAwesome;
            font-weight: normal;
            position: relative;
            right: 0px;
            top: 2px;
            float: right;
        }
    }
        
/* ==========================================================================
   End Flyout Menu
========================================================================== */
@media screen and (min-width: 993px) {
    .header-v4 #cshero-header {
        padding: 0px;
    }
    .admin-bar.header-v4 #cshero-header {
        margin-top: 32px;
    }
    .cs-row-container .container, .site-main > .container .container {
        padding: 0 !important;
    }
    .no-container.cs-row-container .wpb_row,
    .no-container.cs-row-fullwidth .wpb_row{
        padding-left: 0!important;
    }
    .wpb_row > .container .container {
        padding: 0 !important;
    }
    .cs-full-width.wpb_row,
    .cs-full-width .site-main{
        padding-left: 0!important;
    }
    .csbody #footer-top .container,
    .csbody #footer-bottom .container,
    .csbody #cs-page-title-wrapper .container,
    .csbody #cs-breadcrumb-wrapper .container,
    .csbody #cs-bottom-wrap .container, {
        padding-left: 60px;
        padding-right: 60px;
        width: 100%;
        max-width: 100%;
    }
    .csbody .sidebar-active-right .cs-blog {
        padding-right: 0 !important;
    }
    .csbody .sidebar-active-left .cs-blog {
        padding-right: 0 !important;
    }
    .csbody .sidebar-active-right .site-main {
        padding-right: 0;
    }
    .csbody .sidebar-active-left .site-main {
        padding-left: 0;
    }
    .header-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        z-index: 101;
        -webkit-backface-visibility: hidden;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: background-color .3s ease;
        -moz-transition: background-color .3s ease;
        -o-transition: background-color .3s ease;
        -ms-transition: background-color .3s ease;
        transition: background-color .3s ease;
        outline: 0;
    }
    #cshero-header {
        z-index: 100;
        position: fixed;
        height: 100%;
    }

    #cshero-header .logo-description {
        display: block;
    }
    .sticky-wrapper {
        z-index: 102;
        position: fixed;
        text-align: center;
        height: 100%!important;
    }

    .sticky-header-left{
        height: 100%!important;
    }
    .sticky-header-left.sticky-header.fixed{
        border: none;
    }
    .header-left .header-widget {
        padding-top: 60px;
    }
    /* ==========================================================================
    Menu Left & Right
    ========================================================================== */
    .header-left .main-menu > li,
    .header-left .main-menu > li.current-menu-item,
    .header-left .main-menu > li.current-menu-parent {
        position: relative;
    }
    .header-left .main-menu > li:before,
    .header-left .main-menu > li:after {
        background: transparent;
        content: "";
        left: -500px;
        position: absolute;
        top: 0;
        width: 500px;
    }
    .header-left .main-menu > li:after {
        left: inherit;
        right: -500px;
    }
    .header-left .main-menu > li > a {
        -webkit-transition: none;
           -moz-transition: none;
             -o-transition: none;
            -ms-transition: none;
                transition: none;
    }
    /* ==========================================================================
    End Menu Left & Right
    ========================================================================== */
    .header-v4 .entry-content > .vc_row {
        margin-left: auto;
        margin-right: auto;
        max-width: 1170px;
    }
    .header-v4 .entry-content > .vc_row[data-vc-full-width] {
        padding-left: 60px !important;
        padding-right: 60px !important;
        width: 100% !important;
        max-width: 100% !important;
        left: 0 !important;
        margin: 0;
    }
    .header-v4 .entry-content > .vc_row.vc_row-no-padding {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .header-v4 #primary > .container {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
        max-width: 100%;
    }
    .header-v4 #primary > .container > .row {
        margin: 0;
    }
    .header-v4 #primary > .container > .row .content-wrap.col-lg-12 {
        padding: 0;
    }
}
@media screen and (max-width: 992px)  {
    #wrapper > div > .container,
    #cs-page-title-wrapper > .container{
        padding-left: 15px;
        padding-right: 15px;
    }
    #wrapper #primary > .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .cs-row-fullwidth-wrap{
        margin-left: -15px;
        margin-right: -15px;
    }
    .csbody[class*="page-template-blog-"] #primary, 
    .csbody.single #primary , 
    .csbody[class*="single-"] #primary {
        padding-left: 30px;
        padding-right: 30px;
    }
}