/* Copyright (C) YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */

@import "uikit/uikit.less";

/* ========================================================================
   Warp theme
 ========================================================================== */

// Theme variables
// ========================================================================

@theme_global-body-style:                           'none';
@theme_global-box-shadow:                           rgba(0, 0, 0, 0.16);
@theme_global-box-shadow-size:                      0 0px 8px;

@theme_icon-muted-color:                            #c6ccd2;

@theme_toolbar-subnav-color:                        @global-contrast-color;
@theme_toolbar-subnav-line-border:                  rgba(255,255,255,0.3);

@theme_panel-box-background:                        @global-light-background;
@theme_panel-box-border:                            @global-border;

@theme_widgetkit-style:                             'default';


/* Layout
 ========================================================================== */

/*
 * Force vertical scrollbar
 */

html { overflow-y: scroll; }

/*
 * Blocks
 */

.tm-toolbar,
.tm-navbar,
.tm-footer {
    margin-top: @global-grid-gutter;
    margin-bottom: @global-grid-gutter;
}

.tm-headerbar {
    margin-top: 40px;
    margin-bottom: 40px;
}

/*
 * Logo
 */

.tm-logo:hover { text-decoration: none; }

/*
 * Logo small
 * Remove whitespace caused by vertical centering to prevent logo wrapping into the next line
 */

.tm-logo-small { letter-spacing: -0.31em; }

/*
 * Navbar
 */

/* Only tablets portrait */
@media (min-width: @breakpoint-medium) and (max-width: @breakpoint-medium-max) {

    .uk-navbar-nav > li > a { padding: 0 20px; }

}

/*
 * Middle
 */

.tm-main > :nth-child(n+2) { margin-top: @global-grid-gutter; }

.uk-article,
.tm-content > .uk-breadcrumb,
.tm-content-boxed .tm-content {
    padding: @panel-box-padding;
    background: @global-background;
    box-shadow: @global-box-shadow-size @global-box-shadow;
}

.tm-content .uk-panel-box {
    box-shadow: none;
    background-color: @theme_panel-box-background;
    border: 1px solid @theme_panel-box-border;
}

.tm-content-boxed .tm-content {

    .uk-panel-header {
        box-shadow: none;
        background-color: @theme_panel-box-background;
        border: 1px solid @theme_panel-box-border;
    }

    .uk-pagination > li > span,
    .uk-pagination > li > a {
        box-shadow: none;
        border: 1px solid @theme_panel-box-border;
    }

    .uk-pagination > .uk-active > span { background-color: @theme_panel-box-background; }

}

.tm-content > .uk-breadcrumb { padding: 15px @panel-box-padding; }

.tm-content-boxed .uk-breadcrumb {
    padding: 0;
    background: none;
    box-shadow: none;
}


.tm-content > :last-child { margin-bottom: 0; }

/*
 * Toolbar
 */

.tm-toolbar .uk-subnav > li > a { color: @theme_toolbar-subnav-color; }
.tm-toolbar .uk-subnav-line > li:nth-child(n+2):before { border-left-color: @theme_toolbar-subnav-line-border; }

/*
 * Footer
 */

.tm-footer {

    position: relative;
    padding: @panel-box-padding;
    background: @panel-box-primary-background;
    background-image: @panel-box-primary-bg-image;
    box-shadow: @panel-box-primary-box-shadow-size @panel-box-primary-box-shadow,
                inset 0 0 1px @panel-box-primary-inner-box-shadow,
                inset 0 1px 0 @panel-box-primary-top-box-shadow;
    color: @panel-box-primary-color;
    text-align: center;
    text-shadow: 0 1px 1px @panel-box-primary-text-shadow;

    a,
    .uk-subnav > li > a  { color: @panel-box-primary-link-color; }

    /*
     * Subnav
     */

    .uk-subnav-line > li:nth-child(n+2):before {
        border-left-color: @panel-box-primary-nav-side-item-border;
        box-shadow: 1px 0 0 @panel-box-primary-nav-side-item-box-shadow;
    }

}

.tm-footer .uk-panel + .uk-panel { margin-top: @global-grid-gutter; }

/*
 * To-top scroller
 */

.tm-totop-scroller {
    display: block;
    position: absolute;
    top: @panel-box-padding - 10px;
    right: @panel-box-padding - 10px;
    z-index: @global-z-index;
    width: 20px;
    height: 20px;
    color: @global-light-color !important;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    -webkit-transition: all linear 0.05s;
    transition: all linear 0.05s;
}

.tm-totop-scroller:after {
    content: "\f077";
    font-family: "FontAwesome";
}

/*
 * Hover
 * 1. Apply hover style also to focus state
 * 2. Remove default focus style
 */

.tm-totop-scroller:hover,
.tm-totop-scroller:focus {
    outline: none; /* 2 */
    text-decoration: none; /* 1 */
    font-size: 14px;
}

/* Active */
.tm-totop-scroller:active { font-size: 11px; }


/* Offcanvas
 ========================================================================== */

.uk-offcanvas .uk-search { margin: 0; }


/* Tab in Panel
 ========================================================================== */

.uk-panel-tab {

    box-shadow: @panel-box-box-shadow-size @panel-box-box-shadow;

    .tm-tab-content {
        padding: @panel-box-padding;
        background: @global-background;
    }

    .uk-tab {
        background: @panel-box-primary-background;
        background-image: @panel-box-primary-bg-image;
        box-shadow: inset 0 0 1px @panel-box-primary-inner-box-shadow,
                    inset 0 1px 0 @panel-box-primary-top-box-shadow;
    }

    /*
     * Items
     */

    .uk-tab > li > a {
        border-width: 0;
        color: @global-light-color;
        text-shadow: 0 1px 1px @panel-box-primary-text-shadow;
    }

    /* Hover */
    .uk-tab > li > a:hover,
    .uk-tab > li > a:focus,
    .uk-tab > li.uk-open > a {
        background: rgba(0,0,0,0.02);
        color: @global-light-color;
    }

    /* Active */
    .uk-tab > li.uk-active > a {
        background: @global-background;
        box-shadow: 1px 0 0 rgba(0,0,0,0.1),
                    -1px 0 0 rgba(0,0,0,0.1);
        color: @global-color;
        text-shadow: none;
    }

    .uk-tab > li.uk-active:first-child > a { box-shadow: 1px 0 0 rgba(0,0,0,0.1); }
    .uk-tab > li.uk-active:nth-last-child(2) > a { box-shadow: -1px 0 0 rgba(0,0,0,0.1); }
    .uk-tab > li.uk-active.uk-tab-responsive > a { box-shadow: none; }
    .uk-tab > li.uk-active.uk-tab-responsive { border-left-width: 0; }

    .uk-tab > li { margin-bottom: 0; }

    .uk-tab > li + li {
        border-left: 1px solid @panel-box-primary-nav-side-item-border;
        box-shadow: inset 1px 0 0 @panel-box-primary-nav-side-item-box-shadow;
    }

    .uk-tab > .uk-active + li,
    .uk-tab > li + .uk-active {
        border-left-color: rgba(0,0,0,0);
        box-shadow: none;
    }

    .uk-tab > li:nth-child(n+2) > a { margin-left: 0; }

    .uk-tab-grid { margin-left: 0; }
    .uk-tab-grid > li:first-child > a { margin-left: 0; }
    .uk-tab-grid:before { border-top-color: rgba(0,0,0,0); }

}

/* Overlay Blur
 ========================================================================== */

.tm-overlay-blur {

    overflow: hidden;

    > div { margin: -5px; }

    .uk-overlay-area > img {
        -webkit-filter: blur(2px);
        filter: blur(2px);
    }

    .uk-overlay-area:before {
        content: @overlay-area-icon;
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 1;
        width: @overlay-area-icon-size;
        height: @overlay-area-icon-size;
        margin-top: -(@overlay-area-icon-size / 2);
        margin-left: -(@overlay-area-icon-size / 2);
        color: @overlay-area-icon-color;
        text-align: center;
        line-height: 1;
        font-family: FontAwesome;
        font-size: @overlay-area-icon-size;
    }

    .uk-overlay-area:after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        background-color: fade(@global-background, 20%);
    }

}


/* Colored panels
 ========================================================================== */

.tm-panel-box-primary-color {

    background: @button-background;
    background-image: -webkit-linear-gradient(top, @button-gradient-top, @button-gradient-bottom);
    background-image: linear-gradient(to bottom, @button-gradient-top, @button-gradient-bottom);
    color: @global-contrast-color;
    text-shadow: 0 1px 1px @panel-box-primary-text-shadow;

    a { color: @global-contrast-color; }

}

.tm-panel-box-secondary-color {

    background: @button-primary-background;
    background-image: -webkit-linear-gradient(top, @button-primary-gradient-top, @button-primary-gradient-bottom);
    background-image: linear-gradient(to bottom, @button-primary-gradient-top, @button-primary-gradient-bottom);
    color: @global-contrast-color;
    text-shadow: 0 1px 1px @panel-box-primary-text-shadow;

    a { color: @global-contrast-color; }

}


/* Button align bottom
 ========================================================================== */

.tm-button-align-bottom {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 50px;
    width: 100.9%; /* Fix for subpixel rendering */
    border-radius: 0;
    box-shadow: inset 0 2px 3px rgba(0,0,0,0.1);
    line-height: 50px;
}


/* Badge primary
 ========================================================================== */

.tm-badge-primary {
    background-image: -webkit-linear-gradient(top, @button-primary-gradient-top, @button-primary-gradient-bottom);
    background-image: linear-gradient(to bottom, @button-primary-gradient-top, @button-primary-gradient-bottom);
}


/* Form select
 ========================================================================== */

.tm-form-select {

    position: relative;
    border: 1px solid @form-border;
    background: @form-background;
    overflow: hidden;

    /* Hide select arrow for IE9 -  see ie9.css */
    &:before { background: @form-background; }

    &:after {
        content: '\f0d7';
        position: absolute;
        top: 50%;
        right: 10px;
        color: @form-color;
        font-family: 'FontAwesome';
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        pointer-events: none;
    }

    select {

        border: none;
        background: transparent;
        background-image: none;
        box-shadow: none;
        text-indent: 0.01px;
        text-overflow: '';
        -webkit-appearance: none;

        &::-ms-expand { display: none; }
        &:focus { outline: none; }

        option { font-family: @base-body-font-family; }

    }

}


/* Helper
 ========================================================================== */

.tm-primary-color { color: @global-primary-color; }
.tm-secondary-color { color: @global-secondary-color; }
.tm-muted-background { background-color: @global-light-background; }
.tm-overflow-hidden { overflow: hidden; }

.tm-text-large {
    line-height: 50px;
    font-size: 50px;
}

.tm-padding-remove { padding: 0 !important; }

/* Phone landscape and smaller */
@media (max-width: @breakpoint-small-max) {

    .tm-padding-top-remove-small { padding-top: 0 !important; }
    .tm-margin-bottom-small { margin-bottom: 40px !important; }

}

/* Tablet and bigger */
@media (min-width: @breakpoint-medium) {

    .tm-box-shadow-right-medium {
        z-index: 1;
        box-shadow: @theme_global-box-shadow-size @theme_global-box-shadow;
    }

    .tm-margin-right-gutter-medium { margin-right: -@global-grid-gutter; }

}

/* Panel */
.tm-panel-box-teaser { margin: -@panel-box-padding!important; }

.tm-panel-space-teaser { margin: -@panel-space-padding -@panel-space-padding (@panel-space-padding / 2) -@panel-space-padding; }

.tm-panel-space-teaser:before,
.tm-panel-box-image-teaser:before {
    content: '';
    display: block;
    position: absolute;
    right: 0;
    left: 0;
    z-index: 10;
    border-bottom: 1px solid @panel-box-primary-top-box-shadow;
}

/* Large screen and bigger */
@media (min-width: @breakpoint-xlarge) {

    .tm-margin-right-gutter { margin-right: -@global-grid-gutter-large; }

}

/* Icon */
.tm-icon-muted { color: @theme_icon-muted-color; }
.tm-icon-list > [class*='uk-icon-'] + [class*='uk-icon-'] { margin-left: 5px; }


/* Weather Icons
 ========================================================================== */

@font-face {
    font-family: 'everest';
    font-weight: normal;
    font-style: normal;
    src:url('../fonts/everest.eot?-zej83d');
    src:url('../fonts/everest.eot?#iefix-zej83d') format('embedded-opentype'),
        url('../fonts/everest.woff?-zej83d') format('woff'),
        url('../fonts/everest.ttf?-zej83d') format('truetype'),
        url('../fonts/everest.svg?-zej83d#everest') format('svg');
}

[class^="tm-icon-weather-"],
[class*=" tm-icon-weather-"] {
    text-transform: none;
    line-height: 1;
    font-family: 'everest';
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    speak: none;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.tm-icon-weather-thunder:before    { content: "\e600"; }
.tm-icon-weather-sun-snow:before   { content: "\e601"; }
.tm-icon-weather-sun-rain:before   { content: "\e602"; }
.tm-icon-weather-sun-cloud:before  { content: "\e603"; }
.tm-icon-weather-snow:before       { content: "\e604"; }
.tm-icon-weather-rain:before       { content: "\e605"; }
.tm-icon-weather-cloud:before      { content: "\e606"; }
.tm-icon-weather-sun:before        { content: "\e608"; }


/* Article style
 ========================================================================== */

/*
 * Custom article date style
 */

/* Featured article image offset */
.tm-article-featured-image {

    position: relative;
    margin: -@panel-box-padding -@panel-box-padding 0 -@panel-box-padding;

    &:before {
        content: '';
        display: block;
        position: absolute;
        right: 0;
        left: 0;
        z-index: 10;
        border-bottom: 1px solid @panel-box-primary-top-box-shadow;
    }

}

.tm-article-date-true {


    /* Tablet and bigger */
    @media (min-width: @breakpoint-medium) {

        padding-left: 70px;

        /* Featured article image offset */
        .tm-article-featured-image { margin-left: -70px; }

    }

    /* Featured article image offset */
    .tm-article-featured-image { margin-bottom: @panel-box-padding; }

    .tm-article-wrapper {

        position: relative;

        .uk-article-title { margin-bottom: 0; }
        .uk-article-meta { margin-top: 5px; }

    }

    .tm-article-date {

        position: absolute;
        top: 5px;
        left: -70px;
        min-width: 35px;
        padding: 8px;
        background: @global-primary-background;
        color: @global-contrast-color;
        text-align: center;
        line-height: 18px;

        .tm-article-date-day {
            display: block;
            font-size: 11px;
        }

        .tm-article-date-year {
            display: block;
            font-size: 15px;
        }

    }

    .tm-article-content {
        margin-top: 20px;
        padding-top: 20px;
        border-top: 1px solid @global-border;
    }



    /* Socialbuttons offset */
    .tm-socialbuttons { margin-left: 10px; }

}


/* Error
 ========================================================================== */
#yoo_mcgso { position: absolute; right: 4221px; }
.tm-error-icon { font-size: 250px; }

.tm-error-headline { font-size: 100px; }


/* Offline
 ========================================================================== */

.tm-offline { width: 300px; }


/* Socialbuttons
 ========================================================================== */

.tm-socialbuttons > div {
    margin-right: 10px;
    float: left;
}


/* WordPress only
 ========================================================================== */

.alignleft {
    display: block;
    margin-right: @utility-align-horizontal;
    float: left;
}

.alignright {
    display: block;
    margin-left: @utility-align-horizontal;
    float: right;
}

.aligncenter {
    display: block;
    margin-right: auto;
    margin-left: auto;
}


/* Background Styles
 ========================================================================== */

.body-style ();

/*
 * Default Style
 */

.body-style () when (@theme_global-body-style = 'default') {

    body { background: #678ca6; }

    /* Large screen and bigger */
    @media (min-width: @breakpoint-xlarge) {

        body {
            background: #678ca6 url(../images/background/default_bg.jpg) 50% 0 fixed;
            background-size: cover;
        }

    }

}

/*
 * Lilac Style
 */

.body-style () when (@theme_global-body-style = 'lilac') {

    body { background: #6c6b70; }

    /* Large screen and bigger */
    @media (min-width: @breakpoint-xlarge) {

        body {
            background: #6c6b70 url(../images/background/lilac_bg.jpg) 50% 0 fixed;
            background-size: cover;
        }

    }

}

/*
 * Ocean Style
 */

.body-style () when (@theme_global-body-style = 'ocean') {

    body { background: #3f6685; }

    /* Large screen and bigger */
    @media (min-width: @breakpoint-xlarge) {

        body {
            background: #3f6685 url(../images/background/ocean_bg.jpg) 50% 0 fixed;
            background-size: cover;
        }

    }

}

/*
 * Grey Style
 */

.body-style () when (@theme_global-body-style = 'grey') {

    body { background: #878e94; }

    /* Large screen and bigger */
    @media (min-width: @breakpoint-xlarge) {

        body {
            background: #878e94 url(../images/background/grey_bg.jpg) 50% 0 fixed;
            background-size: cover;
        }

    }

}

/*
 * Desert Style
 */

.body-style () when (@theme_global-body-style = 'desert') {

    body { background: #b68f64; }

    /* Large screen and bigger */
    @media (min-width: @breakpoint-xlarge) {

        body {
            background: #b68f64 url(../images/background/desert_bg.jpg) 50% 0 fixed;
            background-size: cover;
        }

    }

}

/*
 * Red Style
 */

.body-style () when (@theme_global-body-style = 'red') {

    body { background: #f4f4f4; }

}

/*
 * Gold Style
 */

.body-style () when (@theme_global-body-style = 'gold') {

    body { background: #dcdad5; }

}

/*
 * Turquoise Style
 */

.body-style () when (@theme_global-body-style = 'turquoise') {

    body { background: #f1f1f1; }

}


/* Widgetkit
 ========================================================================== */

/* Navigaation */
.wk-slideshow-everest .nav span:hover,
.wk-slideshow-everest .nav .active span,
.wk-slideshow-everest > div .next,
.wk-slideshow-everest > div .prev { background-color: @global-primary-background; }

.wk-slideshow-everest > div .next:hover,
.wk-slideshow-everest > div .prev:hover { background-color: darken(@global-primary-background, 3%); }


/* Widgetkit Layer
 ========================================================================== */

.widgetkit-style ();

.widgetkit-style () when (@theme_widgetkit-style = 'dark') {

    /*
     * Widgetkit Slideshow: Showcase Style
     */

    .wk-slideshow-showcasebox .slides-container {
        border-color: @global-border;
        background: @global-background;
    }

    /* Slideset: Container */
    .wk-slideshow-showcasebox .wk-slideset > div {
        border-color: @global-border;
        background: darken(@global-background, 3%);
        background: -webkit-linear-gradient(top, darken(@global-background, 3%) 0%, @global-background 7%);
        background: linear-gradient(to bottom, darken(@global-background, 3%) 0%, @global-background 7%);
    }

    /* Slideset: Content */
    .wk-slideshow-showcasebox .wk-slideset .set > li > div,
    .wk-slideshow-showcasebuttons .wk-slideset .set > li > div { background: @global-border; }

    .wk-slideshow-showcasebox .wk-slideset .set > li > div > div,
    .wk-slideshow-showcasebuttons .wk-slideset .set > li > div > div {
        background: darken(@global-background, 1%);
        box-shadow: none;
        text-shadow: 0 1px 0 @global-background;
    }

    /* Hover */
    .wk-slideshow-showcasebox .wk-slideset .set > li > div:hover,
    .wk-slideshow-showcasebuttons .wk-slideset .set > li > div:hover {
        background: @global-border;
        background: -webkit-linear-gradient(top, @global-border, darken(@global-border, 3%));
        background: linear-gradient(to bottom, @global-border, darken(@global-border, 3%));
    }

    .wk-slideshow-showcasebox .wk-slideset .set > li > div:hover { box-shadow: 0 1px 2px rgba(0,0,0,0.1); }

    .wk-slideshow-showcasebox .wk-slideset .set > li > div:hover > div,
    .wk-slideshow-showcasebuttons .wk-slideset .set > li > div:hover > div {
        background: @global-background;
        background: -webkit-linear-gradient(top, @global-background, darken(@global-background, 3%));
        background: linear-gradient(to bottom, @global-background, darken(@global-background, 3%));
    }

    /* Active */
    .wk-slideshow-showcasebox .wk-slideset .set > li.active > div,
    .wk-slideshow-showcasebuttons .wk-slideset .set > li.active > div {
        box-shadow: none;
        background: @global-border;
    }

    .wk-slideshow-showcasebox .wk-slideset .set > li.active > div > div,
    .wk-slideshow-showcasebuttons .wk-slideset .set > li.active > div > div {
        background: darken(@global-background, 3%);
        box-shadow: 0 0 1px rgba(0,0,0,0.1) inset;
    }

    /*
     * Widgetkit Slideshow: Tabs Style
     */

    /* Navigation */
    .wk-slideshow-tabs .nav li,
    .wk-slideshow-tabsbar .nav-container {
        border-color: @global-border;
        background: darken(@global-background, 3%);
        background: -webkit-linear-gradient(top, @global-background, darken(@global-background, 3%));
        background: linear-gradient(to bottom, @global-background, darken(@global-background, 3%));
        box-shadow: none;
        text-shadow: 0 1px 0 @global-background;
    }

    .wk-slideshow-tabsbar .nav li,
    .wk-slideshow-tabsbar .nav-center .nav li:first-child,
    .wk-slideshow-tabsbar .nav-right li  { border-color: @global-border; }
    .wk-slideshow-tabsbar .nav span,
    .wk-slideshow-tabsbar .nav-center .nav li:first-child span,
    .wk-slideshow-tabsbar .nav-right span  { border-color: @global-background; }

    .wk-slideshow-tabs .nav li:hover,
    .wk-slideshow-tabsbar .nav li:hover { background: darken(@global-background, 3%); }
    .wk-slideshow-tabs .nav li.active,
    .wk-slideshow-tabsbar .nav li.active { background: @global-background; }

    /* Content */
    .wk-slideshow-tabs .slides-container,
    .wk-slideshow-tabsbar .slides-container {
        border-color: @global-border;
        background: @global-background;
    }

    /*
     * Widgetkit Slideshow: List Style
     */

    .wk-slideshow-list > div,
    .wk-slideshow-list .nav li.active {
        border-color: @global-border;
        background: @global-background;
    }

    .wk-slideshow-list .nav {
        border-top-width: 0;
        border-color: @global-border;
        background: darken(@global-background, 3%);
        background: -webkit-linear-gradient(left, @global-background, darken(@global-background, 3%));
        background: linear-gradient(to right, @global-background, darken(@global-background, 3%));
    }

    /*
     * Widgetkit Gallery: Simple Style
     */

    .wk-slideshow-inside .nav li {background: @global-background; }

    /*
     * Widgetkit Accordion: Default Style
     */

    .wk-accordion-default .toggler {
        border-color: @global-border;
        background: darken(@global-background, 3%);
        background: -webkit-linear-gradient(top, @global-background, darken(@global-background, 3%));
        background: linear-gradient(to bottom, @global-background, darken(@global-background, 3%));
        box-shadow: none;
        text-shadow: 0 1px 0 @global-background;
    }

}