
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/* FONTS */


@namefont1: "arsenal";
@namefont2: "arsenal";
@font1: "arsenalregular";
@font2: "arsenalbold";
@web-font-path: "../fonts/";
@ew-font-family-regular: "@{font1}",
Helvetica,
Arial,
sans-serif;
@font-family-sans-serif: @ew-font-family-regular;
@ew-font-family-bold: "@{font2}",
Helvetica,
Arial,
sans-serif;
@headings-font-family: @ew-font-family-bold;
@font-face {
    font-family: '@{font1}';
    src: url('@{web-font-path}@{namefont1}/@{namefont1}-regular/@{namefont1}-regular-webfont.eot');
    src: url('@{web-font-path}@{namefont1}/@{namefont1}-regular/@{namefont1}-regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('@{web-font-path}@{namefont1}/@{namefont1}-regular/@{namefont1}-regular-webfont.woff2') format('woff2'),
    url('@{web-font-path}@{namefont1}/@{namefont1}-regular/@{namefont1}-regular-webfont.woff') format('woff'),
    url('@{web-font-path}@{namefont1}/@{namefont1}-regular/@{namefont1}-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: '@{font2}';
    src: url('@{web-font-path}@{namefont2}/@{namefont2}-bold/@{namefont2}-bold-webfont.eot');
    src: url('@{web-font-path}@{namefont2}/@{namefont2}-bold/@{namefont2}-bold-webfont.eot?#iefix') format('embedded-opentype'),
    url('@{web-font-path}@{namefont2}/@{namefont2}-bold/@{namefont2}-bold-webfont.woff2') format('woff2'),
    url('@{web-font-path}@{namefont2}/@{namefont2}-bold/@{namefont2}-bold-webfont.woff') format('woff'),
    url('@{web-font-path}@{namefont2}/@{namefont2}-bold/@{namefont2}-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}




/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/* VARIABLES */

@font-size-base: 18px;
@font-size-middle: 14px;
@font-size-small: 12px;
@line-height-middle: @line-height-small;

@brand-primary: #f7a526;
@gray-lighter: #f9f9f9;
@brand-secondary: #789862;
@brand-cart: #f7a526;
@header-height: 300px;
@header-height-mobil: 150px;
@header-margin-top: 35vh;
@header-margin-bottom: 100px;
@header-bgcolor: transparent;
@header-bgimg: "../images/header-bg.jpg";
@sub-header-height: 150px;
@sub-header-height-mobil: 150px;
@sub-header-margin-top: 150px;
@sub-header-margin-bottom: 20px;
@sub-header-bgcolor: transparent;
@sub-header-bgimg: "../images/sub-bg.jpg";
@navigation-link-font-size: 1.2em;
@navigation-link-padding-top: 25px;
@navigation-link-padding-bottom: 25px;
@navigation-link-padding-left: 19px;
@navigation-link-padding-right: 19px;
@shop-nav-height-monitor: 30px;
@shop-nav-height-mobil: 45px;
@shop-nav-font-size-monitor: 15px;
@shop-nav-font-size-mobil: 20px;
@shop-nav-bg-color: @brand-primary;
@shop-nav-bg-transparent: 90%;
@shop-nav-text: @color-on-brand-primary;
@shop-nav-orientation: right;
@usp-bg: fade(white,75%);
@usp-text: @brand-secondary;
@mega-nav-bg: fade(@brand-secondary,80%);
@footer-background: @brand-secondary;
@footer-heading-color: @color-on-brand-secondary;
@footer-heading-border: 1px solid fade(@color-on-brand-secondary,30%);
@footer-text-color: @color-on-brand-secondary;
@footer-link-color: @color-on-brand-secondary;
@footer-link-hover-color: lighten(@footer-link-color,25%);
@footer-copyright-color: @footer-text-color;
@footer-copyright-font-size: @font-size-middle;
@footer-border: 1px solid darken(@footer-background,15%);

@mega-nav-text: @color-on-brand-secondary;
@mega-menu-bg: white;
@mega-menu-padding: 10px;
@mega-menu-link-bg: white;
@mega-nav-cols: 12;
@mega-menulist-img-size: 6;

/* NAV ICONS */

@nav-icon-open: "\f057";
@nav-icon-close: "\f0ab";
@nav-icon-more: "\f0a9";
@mega-menu-bg: white;
@mega-menu-padding: 50px;
@mega-menu-link-bg: white;
@border-radius-base: 0px;

/* ARTEMIS VARIABLES */

@transparent: fade(@brand-secondary,50%);
@gradiant1: @brand-secondary;
@gradiant2: darken(@brand-secondary, 40%); 










/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/* ARTEMIS */

.horizontal-gradient (@startColor: #eee,@endColor: white) {
    background-color: @startColor;
    background-image: -webkit-gradient(linear, left top, right top, from(@startColor), to(@endColor));
    background-image: -webkit-linear-gradient(left, @startColor, @endColor);
    background-image: -moz-linear-gradient(left, @startColor, @endColor);
    background-image: -ms-linear-gradient(left, @startColor, @endColor);
    background-image: -o-linear-gradient(left, @startColor, @endColor);
}

.gradient (@startColor: #eee,@endColor: white) {
    background-color: @startColor;
    background: -webkit-gradient(linear, left top, left bottom, from(@startColor), to(@endColor));
    background: -webkit-linear-gradient(top, @startColor, @endColor);
    background: -moz-linear-gradient(top, @startColor, @endColor);
    background: -ms-linear-gradient(top, @startColor, @endColor);
    background: -o-linear-gradient(top, @startColor, @endColor);
}





body {
    background-color: transparent;
}


.products,
.product-listing {
    .panel-default {
        box-shadow: 2px 2px 20px fade(gray, 10%);
    }
}


.mega-menulist-wrapper {
    max-height: 80vh;
    overflow-y: auto;
}


.footer-wrapper{
    .gradient(@gradiant1, @gradiant2);
}
.footer-bottom-nav {
    @media @xs {
        li {
            display: block;
            width: 100%;
            margin-bottom: 10px;
        }
    }
}

.sticky-bottom-mobil-footer {
    @media @xs {
        -webkit-box-shadow: 0px 15px 20px 13px rgba(0, 0, 0, 0.3);
        -moz-box-shadow: 0px 15px 20px 13px rgba(0, 0, 0, 0.3);
        box-shadow: 0px 15px 20px 13px rgba(0, 0, 0, 0.3);
    }
}



.mega-nav-listitem-drop.open .mega-nav-listitem {
    background-color: @brand-primary;
    color: @color-on-brand-primary;
}


.mega-menu-wrapper {
    height: 0;
}

.shop-nav-wrapper {
    border-bottom: 0px solid @gray-light-borders;
}

.shop-nav-container,
.social-nav-container {
    > li {
        border-right: 0px solid @gray-light-borders;
    }
}


.footer-social li a:hover {
    opacity: 0.5;
}


.breadcrumb-container {
    background-color: @gray-lighter;
}


.footer-box {
    background-color: inherit;
}


.box-color {
    height: auto;
    width: 100%;
    .box-inner {
        background-color: @brand-secondary;
        height: 20px;
    }
    .box-inner2 {
        background-color: lighten(@brand-secondary, 5%);
        height: 20px;
    }
    .box-inner3 {
        background-color: lighten(@brand-secondary, 10%);
        height: 20px;
    }
    .box-inner4 {
        background-color: lighten(@brand-secondary, 5%);
        height: 20px;
    }
}

.btn-overlay-show {
    background-color: @brand-cart;
    color: white;
    @media @sm {
        display: block;
    }
}

.shop-nav-link {
    text-transform: uppercase;
}

.shop-nav-wrapper.active {
    box-shadow: 48px 0 0 0 #fff, -48px 0 0 0 #fff, 0 2px 30px -7px rgba(70, 70, 70, .4);
}

.mega-menu-wrapper.active {
    .mega-menu {
        box-shadow: 48px 0 0 0 #fff, -48px 0 0 0 #fff, 0 2px 30px -7px rgba(70, 70, 70, .4);
    }
}

.btn-mobil-nav,
.btn-head-wish,
.btn-head-cart,
.btn-head-search,
.btn-head-cart-dropdown {
    .button-variant(@color-on-brand-primary;
    @transparent;
    @color-on-brand-primary);
    &:active,
    &:hover {
        background-color: fade(@brand-primary, 85%) !important;
    }
    &.active,
    .open > &.dropdown-toggle {
        background-color: fade(@brand-primary, 85%) !important;
    }
}

.search-group-header {
    .form-control {
        background-color: @transparent;
        border: 1px solid @color-on-brand-primary;
        color: white;
        &:focus {
            border: 1px solid @color-on-brand-primary;
            background-color: fade(@brand-primary, 85%) !important;
        }
    }
    .form-control::-webkit-input-placeholder {
        color: @color-on-brand-primary;
    }
    .form-control:-moz-placeholder {
        color: @color-on-brand-primary;
    }
    .form-control::-moz-placeholder {
        color: @color-on-brand-primary;
    }
    .form-control:-ms-input-placeholder {
        color: @color-on-brand-primary;
    }
}

.btn-overlay-show {
    background-color: @mega-nav-bg;
}

.footer-col.contact {
    .img-responsive {
        max-width: 50%;
    }
}






/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/*
/* XTLIVE CUSTOM */

.xtlive {
    h2 {
        font-size: 2.3em;
        @media @sm {
            font-size: 30px;
        }
        @media @xs {
            font-size: 28px;
        }
    }
    h2 {
        color: @brand-primary;
    }
}
.xtlive.bg{
    background-color: fade(@brand-secondary, 90%);
}




