﻿@background-image: ""; //must be the same name variable for all other page

@background-color: white;

@header1-color: white;
@header1-text-color: #aaaaaa;
@header1-font-size: 13px;
@header1-font: tahoma;

@header-page-title: #F5F5F5;

@menu-color: white;
@menu-text-color: black;
@menu-font: tahoma;
@menu-font-size: 13px;

@title-color: black;
@title-font: tahoma;
@title-font-size: 20px;

@title2-color: #202020;
@title2-font: tahoma;
@title2-font-size: 16px;

@text-color: #444444;
@text-font: tahoma;
@text-font-size: 13px;

@botton-color: #0081ff;
@botton-text-color: white;
@botton-font: tahoma;

@footer-color: #222;
@footer-text-color: white;

@second-footer-color: #1b1b1b;

@second-footer-text-color: white;

@menu-hover-text-color: white;
@sub-menu-hover-text-color: white;

@second-menu-color: black;

@sub-menu-color: white;

@page-title-color: black;
@page-title-font: tahoma;
@page-title-font-size: 20px;

@sub-menu-font-size: 12px;
@sub-menu-font-color: black;

@dataform-text-color: black;
@dataform-font: tahoma;
@dataform-font-size: 13px;

@shopping-cart-continiue: black;

body {
    background: @background-image;
    background-color: @background-color;
    font-family: @text-font;
    font-size: @text-font-size;
}

.top-bar {
    background-color: @header1-color;
}

.top-link li, .top-link li a,
.top-social-link a {
    font-family: @header1-font;
    font-size: @header1-font-size;
    color: @header1-text-color;
}

/*.top-social-link a {
    color: fade(@menu-text-color,70%);

    &:hover {
        color: @menu-text-color;
    }
}*/

.top-tell {
    color: @menu-text-color;
}

header, .menu-25 .container-menu-desktop {
    background-color: @menu-color;
}

.menu-appear-alt, header.sticky, #header.transparent-header .light-header, #header.transparent-header {
    background-color: @menu-color;
}

@media screen and (max-width: 900px) {
    .menu-appear-alt, header.sticky, #header.transparent-header .light-header, #header.transparent-header {
        background-color: fade(@menu-color,100%) !important;
    }
}

header.sticky .menuzord-menu li > .megamenu, .sub-mega-menu, .menu-25 .main-menu-m > li, .menu-25 .main-menu-m, .search-mm-box, .menu25 .topbar-mobile {
    background-color: @sub-menu-color;
}

.transparent-header.sticky.sticky-m, .fix-menu-desktop .main-nav.show-main-nav {
    background-color: fade(@menu-color,100%) !important;
}

.menuzord-menu ul.dropdown, .menuzord-menu ul.dropdown li ul.dropdown,
.float-menu, .menuzord-menu li > .megamenu {
    background-color: @sub-menu-color;
}

.menuzord-menu > li > a, .menuzord-menu > li > a > i, .dark.menuzord-menu > li > a, .megamenu-header, .total-cart ul li span, .menu-25 .main-menu > li > a {
    color: @menu-text-color !important;
    font-family: @menu-font !important;
    font-size: @menu-font-size !important;

    &:hover {
        color: @menu-text-color !important;
    }
}

.nav-icon.cart-info .megamenu-header, .nav-icon.cart-info .megamenu span {
    color: @sub-menu-font-color !important;
}

.menuzord-menu ul.dropdown li a, .menu-25 .sub-mega-menu .nav-pills .nav-link {
    color: @sub-menu-font-color !important;
    font-family: @menu-font !important;
    font-size: @sub-menu-font-size !important;
}

.menu-25 .sub-mega-menu .nav-pills .nav-link {
}

.menuzord-menu > li > .megamenu a {
    color: @sub-menu-font-color !important;
    font-family: @menu-font !important;
    font-size: @sub-menu-font-size - 1 !important;

    &:hover {
        color: @menu-text-color !important;
    }
}

.menuzord-menu > li > .megamenu {
    color: @second-menu-color;
    font-family: @menu-font !important;
    font-size: @menu-font-size !important;
}

.menuzord-menu li.root-menu a {
    font-size: @sub-menu-font-size !important;
}

.list-unstyled li {
    border-color: @second-menu-color;
}

.sub-mega-menu .nav-pills .nav-link.active, .sub-mega-menu .show > .nav-pills .nav-link {
    background-color: @second-menu-color;
}

.menuzord-menu > li.active > a,
.menuzord-menu > li:hover > a,
.menuzord-menu ul.dropdown li:hover > a,
.menuzord .menuzord-menu > li:hover > a,
.menu-25 .main-menu > li:hover > a {
    color: @menu-hover-text-color !important;
}

.menuzord-menu > li > .megamenu .megamenu-row li:hover > a,
.menuzord-menu ul.dropdown li:hover > a,
.menu-25 .sub-mega-menu .nav-pills .nav-link:hover {
    color: @sub-menu-hover-text-color !important;
}

.product-title h5 a, .portfolio-with-title .portfolio-title h4, .portfolio-with-title .portfolio-title h4 a,
.post-single .post-desk .date, .post-single .post-desk .date a, .post-single .post-desk h4 a,
.slick-slider .slide-title, .owl-carousel .item .title, .owl-carousel .item .title a,
.team-member .team-intro.light-txt h5 a, .desk h4 a, .team-title h5 a, .accordion > dt > a,
.line-tab .nav-tabs > li > a, .slider-pro .sp-thumbnail-title, .tiny-slider-title, .mis-slider li figcaption,
#example5 .sp-thumbnail-text, .tiny-slider-title, .portfolio-with-title .portfolio-title, #example1 .sp-thumbnail-title,
#latest ul li .txtoverlay .txtcaption .heading, .product .product__body > h5, .career-list .title a, .page-title-2,
.post_083_content > h5 > a, .post_085_content_col_2 > a {
    color: @title2-color;
    font-family: @title2-font;
    font-size: @title2-font-size;
}

.line-tab .nav-tabs > li.active > a {
    border-color: @title2-color !important;
}

.border-short-bottom h1, .border-short-bottom h2, .border-short-bottom h3, h1, h2,
.page-title h1, .page-title h2, .page-title h3, .page-title h4, .page-title h5,
.heading-title-alt h3, .heading-title h3,
.heading-title-alt span.heading-sub-title, .c-info h4, .post_085_header > h1 {
    color: @title-color;
    font-family: @title-font;
    font-size: @title-font-size;
}

#footer, #footer.dark .primary-footer {
    background: @footer-color !important;
    color: @footer-text-color !important;
}

#footer.dark .secondary-footer, .second-footer,
.second-footer span {
    background: @second-footer-color !important;
    color: @second-footer-text-color !important;
}

#footer.dark .secondary-footer span {
    color: @second-footer-text-color !important;
}

.f-link, #footer.dark h5, #footer.dark span {
    color: @footer-text-color !important;
}

#footer.gray .social-link a {
    color: @footer-text-color !important;
}

#footer.gray .social-link.circle a,
.gray .border-top {
    border-color: @footer-text-color;
}

.footer-4 .f-logo-center,
.footer-4.dark .copyright-sub-title,
.tell-footer,
#footer.dark .social-link.circle a,
.tell-footer {
    color: @footer-text-color;
}

.footer-4 .f-logo-center {
    border-color: @footer-color !important;
}

.btn {
    background: @botton-color !important;
    color: @botton-text-color !important;
    font-family: @botton-font !important;

    &:hover {
        @result: fade( @botton-color,70%);
        background: @result !important;
    }
}

.related-post-heading {
    border-right-color: @botton-color !important;
}

.page-title {
    background-color: @header-page-title;
}

.line-tab .nav-tabs > li > a, .line-tab .nav-tabs.nav-justified > li > a {
    border-bottom-color: @menu-color !important;
}

.nav-tabs > li.active > a,
.line-tab .nav-tabs > li.active > a:hover, .line-tab .nav-tabs > li.active > a:focus, tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
    color: @menu-text-color !important;
    background-color: @menu-color !important;
}

.nav-boxed-color .menuzord-menu > li:hover > a {
    background-color: @second-menu-color;
}

.border-tb, .nav-border-box .menuzord-menu > li:hover > a,
.header-13.nav-block-right,
.header-13.nav-block-right .menuzord-menu > li > a {
    border-color: @second-menu-color;
}

.sliding-image-gallery .nav-btn.selected {
    background: @second-menu-color !important;
    background-color: @second-menu-color !important;
    border-color: @second-menu-color !important;
}

.menu-15 .menuzord-menu > li > a::after {
    background: @second-menu-color;
}

@media (max-width: 768px) {
    ul.menuzord-menu {
        background: @sub-menu-color;
    }
}

.page-title span {
    font-family: @page-title-font;
    font-size: @page-title-font-size;
    color: @page-title-color;
}

.media-boxes-filter li a.selected {
    background: @second-menu-color;
}

.menu19 .menuzord-menu > li:hover > a {
    background: @menu-hover-text-color !important;
    /*color: @menu-text-color !important;*/
    border-bottom: 6px solid @menu-text-color;
    color: white !important;
}

.data-form-title {
    font-family: @dataform-font;
    font-size: @dataform-font-size;
    color: @dataform-text-color;
}

.menuzord-menu > li > .megamenu a.btn-continue {
    color:@shopping-cart-continiue !important;
}
